@charset "utf-8";
/* CSS Document */

.homeheading2 .pageheading span{ color:#009d92;}
.homeheading2 .pageheading p{ border-color:#009d92;}

.cirlec-slider{ padding: 200px 177px; position: relative;}
.cirlec-slider-bg{ height: 760px;}

/* modification code H hash **************************************************/
.cirlec-slider-bg{ position: relative; background-size: 100% 100%!important}
.cirlec-slider-bg .f-courses{ cursor: pointer; position: absolute; top: 50%; left: 50%; transition: transform 1.1s ease-out;}
.name-tag.style-1{ top: -25px;} 
.name-tag.style-2{ bottom: 40px; right: -25px; top: auto;}
.name-tag.style-3{ bottom: -25px;}
.name-tag.style-4{ left: -25px;}

.f-courses-detail {
    position: absolute;
    top: 170px;
    z-index: -1;
    text-align: center;
    padding: 200px 30px 80px;
    opacity: 0;
    visibility: hidden;
	background: #009d92;
	color: #fff;
}
.f-courses-detail p { font-size:16px; line-height:30px;}

.f-courses-img{ border: 30px solid #fff; border-radius: 100%; overflow: hidden;}  
.f-courses-img img{ border:0; border-radius: 100%;}
.f-courses .name-tag{ height: 178px; width: 178px; border-radius: 100%; font-size: 20px; display: block; color: #30373e;
text-align: center; padding:55px 12px; position: absolute; background: #fff; box-shadow:0 0 5px 5px #d7d7d7;}

.f-courses.active .name-tag{ 
background:url(../images/arrowdown.jpg) no-repeat center bottom 30px #fff;

top: -25px; left: auto; right: auto; bottom: auto; left: 50%; box-shadow:0 -3px 8px 5px #d7d7d7; color:#009d92;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);}

.f-courses.active .f-courses-img{ border-color: #ededed;}
.f-courses.active .f-courses-img img{ border-color: #da951f;}
.f-courses.active .f-courses-detail{ opacity: 1; visibility: visible;}
.f-courses-detail{ position: absolute; top: 170px; z-index: -1; text-align: center; padding: 200px 30px 80px; opacity: 0; visibility: hidden;}
.f-courses-detail .angle-bg{ left: 0; position: absolute; bottom:-1px; width: 100%;}
.f-courses-detail .btn{ border-color: #fff; color: #fff; border-radius:20px; padding:8px 30px; margin-bottom:15px;}
.f-courses-detail .btn:hover { padding:8px 40px; border-radius:10px;}
.f-courses-detail .btn::before,
.f-courses-detail .btn::after{ border-color: #fff;}
.f-courses-detail::before,
.f-courses-detail::after{ content: ""; height: 12px; width: 31px; position: absolute; top: 0;}
.f-courses-detail::before{ background: url(../images/left-stand.png) no-repeat; right: 100%;}
.f-courses-detail::after{ background: url(../images/right-stand.png) no-repeat; left: 100%;}
.position-center-x {
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.position-center-y {
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}