/* design 05 */

.team-inner-wrapper{width: 100%; height: 600px; position: relative;}
.team-circle{position: absolute; padding: 5px; min-height: 60px; min-width: 60px; cursor: pointer;}
.team-circle:hover{ transform: scale(1.1); transition: all 0.5s; padding: 5px;}
.team-circle a{display: inline-block;text-align: center;display: flex;justify-content: center;align-items: center;height: 100%;width: 100%;text-decoration: none;color: #ffffff;/* font-family:bitter; */}
.team-circle a:hover{text-decoration: none; color: #ffffff;align-items: end; padding-bottom:15px; }
.team-circle-01{ width: 160px; height:160px; left:0px; top:50px; }
.team-circle-02{width: 300px; height: 300px; left:260px; top:70px; }
.team-circle-03{ width: 160px; height:160px; left:750px; top:70px; }
.team-circle-04{ width: 170px; height:170px; right:40px; top:50px; }
.team-circle-05{ width: 250px; height:250px; left:40px; bottom: 80px;}
.team-circle-06{ width: 175px; height:175px; left:415px; bottom: 50px;}
.team-circle-07{ width: 300px; height:300px; left:650px; bottom:40px}
.team-circle-08{width: 130px; height: 130px; left:950px; top:200px; }
.team-circle-09{ width: 175px; height:175px; right:50px; bottom: 50px;}



/*------------ Design 03 -----*/

.we-serve-inner-wrapper{ width:100%; height:840px; position: relative;}
.we-serve-circle{ position: absolute; }
.we-serve-circle a, 
.we-serve-circle a:hover { display: inline-block; text-align:center; width: 100%; height: 100%;  display: flex; justify-content: center; align-items: center; color: #FFFFFF; text-decoration: none; font-family:bitter;}
.we-serve-circle-01{ width: 300px; height: 300px; padding: 10px; top:270px; left:0px; font-size:40px;letter-spacing: 1px; }
.we-serve-circle-02{width: 800px;height: 800px;padding: 150px;top: 20px;left:300px;}
.we-serve-circle-02 a,.we-serve-circle-02 a:hover {align-items: end;padding-bottom:40px;font-size:30px;letter-spacing: 1px;}
.we-serve-child{ width: 120px; height: 120px;}
.we-serve-child a,.we-serve-child a:hover{align-items: end; padding-bottom:15px; line-height:18px; font-size:14px; }
.we-serve-circle-03{ top: 20px; left:950px;}
.we-serve-circle-04{ top:144px; left:1046px;}
.we-serve-circle-05{ top:288px; left:1095px;}
.we-serve-circle-06{ top:432px; left:1095px;}
.we-serve-circle-07{ top:576px; left:1046px;}
.we-serve-circle-08{ top:700px; left:950px;}


/* design 04 */

.you-ask-inner-wrapper{width:100%; height:790px; position: relative; }
.you-ask-circle{ position: absolute; }

.you-ask-circle a, .you-ask-circle a:hover{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: end; color: #FFFFFF; text-decoration: none; font-family:bitter; text-align:center; padding-bottom: 40px; }
.you-ask-circle a {box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.5);}
.you-ask-circle a:hover {box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.1);}
.you-ask-circle-01-inner-wrapper{ width: 100%; height: 100%; padding: 10px; border-radius: 50%;}

.you-ask-circle-01{ width:600px; height: 600px; padding:100px; top:0px;left:calc(50% - 300px);}
.you-ask-circle-01:hover{ transform: scale(1.1); transition: all 0.5s; }

.you-ask-circle-01-inner-wrapper a{ font-size:25px;letter-spacing: 1px;}

.you-ask-circle-child{ width: 140px; height: 140px;}
.you-ask-circle-child:hover {transform: scale(1.1); transition: all 0.5s;}
.you-ask-circle-child a, .you-ask-circle-child a:hover{align-items: end; padding-bottom:15px; line-height:18px; font-size:14px; }

.you-ask-circle-02{ top:145px; left:calc(50% - 430px); }

.you-ask-circle-03{ top:370px; left:calc(50% - 412px); }

.you-ask-circle-04{top:530px; left:calc(50% - 285px); }

.you-ask-circle-05{top:600px; left:calc(50% - 70px); }

.you-ask-circle-06{top:530px; left:calc(50% + 145px);}

.you-ask-circle-07{ top:370px; left:calc(50% + 272px); }

.you-ask-circle-08{ top:145px; left:calc(50% + 290px); }


/* Design 02 */
.hero-inner-wrapper{width: 100%; height: 350px; position: relative;}
.hero-circle{position: absolute; padding: 5px; min-height: 60px; min-width: 60px; cursor: pointer;}
.hero-circle:hover{ transform: scale(1.1); transition: all 0.5s;}
.hero-circle a{display: inline-block; width: 100%; height: 100%; display: flex; justify-content: center; align-items: end; color: #ffffff; text-decoration: none; font-size: 25px; font-family:bitter; }
.hero-circle a:hover{ color: #ffffff; text-decoration: none; font-size: 25px; }
.circle-01, .circle-02, .circle-03, .circle-04, .circle-05, .circle-06, .circle-07 {
    width: 180px;
    height: 180px;
}
.circle-01 { left: 0px; top: 0px;}
.circle-02 { left: 240px; top: 64px;}
.circle-03{top: 214px;}
.circle-04 {
  right: 354px;
  top: 65px;
}
.circle-05 {
  right: 125px;
  top: 0px;
}
.circle-06 {
  right: 132px;
  top: 200px;
}

.circle-07
{
right: 393px;
top: 320px;
}