@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');
body{font-family: 'Montserrat', sans-serif;font-size: 16px;  font-weight: 500}
/*font weight*/
.fw-800{font-weight: 800}
.fw-700{font-weight: 700}
.fw-600{font-weight: 600}
.fw-500{font-weight: 500}
.fw-400{font-weight: 400}
.fw-300{font-weight: 300}
:root{
    --primary:#cc9900;
    --dark:#000000;  
}

.z-index-10{z-index: 10}
/*header*/

::-moz-selection { /* Code for Firefox */
  color:#cc9900;
  background:#000000;
}

::selection {
  color:#cc9900;
  background:#000000;
}
.floating-social{position: fixed;z-index: 10;right: 0;top: calc(50% - 100px);}
.floating-social a{display: inline-block;font-size: 30px;padding: 8px;color: #ffffff;line-height: 30px;transition:All .5s ease;
                    -webkit-transition:All .5s ease;
                    -moz-transition:All .5s ease;
                    -o-transition:All .5s ease;float: right}
.floating-social a:hover{padding: 8px 15px 8px 8px;}
.floating-social a.whatsapp{background: #11bc18}
.floating-social a.facebook{background: #3a549f}
.floating-social a.instagram{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f5bb1c+0,f32f5f+53,6441c1+100 */
background: #f5bb1c; /* Old browsers */
background: -moz-linear-gradient(45deg,  #f5bb1c 0%, #f32f5f 53%, #6441c1 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  #f5bb1c 0%,#f32f5f 53%,#6441c1 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  #f5bb1c 0%,#f32f5f 53%,#6441c1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5bb1c', endColorstr='#6441c1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/*buttons*/
.btn-black{position: relative;padding: 10px 49px;font-weight: 500;text-transform: uppercase;background:var(--dark);color: #ffffff;text-decoration: none; }
.btn-black:hover{color: #ffffff}
.btn-black span{position: relative;z-index: 3;}
.btn-black::after,
.btn-black::before{position:absolute;z-index: 2;width: 100%;height: 0;left: 0;display: inline-block;content:"";
                    transition:All .5s ease;
                    -webkit-transition:All .5s ease;
                    -moz-transition:All .5s ease;
                    -o-transition:All .5s ease;background:var(--primary); 
}
.btn-black::after{bottom:0;}
.btn-black::before{top:0;}
.btn-black:hover::after,
.btn-black:hover::before{height:50%}


.btn-yellow{position: relative;padding: 10px 49px;font-weight: 500;text-transform: uppercase;background:var(--primary);color: #ffffff;text-decoration: none; }
.btn-yellow:hover{color: #ffffff}
.btn-yellow span{position: relative;z-index: 3;}
.btn-yellow::after,
.btn-yellow::before{position:absolute;z-index: 2;width: 100%;height: 0;left: 0;display: inline-block;content:"";
                    transition:All .5s ease;
                    -webkit-transition:All .5s ease;
                    -moz-transition:All .5s ease;
                    -o-transition:All .5s ease;background:var(--dark); 
}
.btn-yellow::after{bottom:0;}
.btn-yellow::before{top:0;}
.btn-yellow:hover::after,
.btn-yellow:hover::before{height:50%}

/*header*/
header{ z-index: 99}
header.fixed-header{}
header  .nav-link:hover {color: #000000;}
header .nav .nav-link{color: #ffffff;padding:0 42px;font-weight: 600}
header .phone i{width: 30px; height: 30px;border: 2px solid #ffffff;text-align: center;padding:4px;margin-right: 2px;position: relative;top: -2px}
header,
header .nav .nav-link,
header .navbar-brand img
{
        transition:All .5s ease;
        -webkit-transition:All .5s ease;
        -moz-transition:All .5s ease;
        -o-transition:All .5s ease;
}
header.fixed-header{background: var(--dark)}
header.fixed-header .nav .nav-link{padding:0 10px;font-size: 14px}
header.fixed-header .navbar-brand img{max-width: 100px}



/*banner*/

.banner .carousel-item .carousel-caption{z-index: 5}

/*what we*/
.section{padding:  95px 0}
/**/
.what-we{background: #ebecec;}
.what-we .colum{background: var(--dark);}
.what-we .colum img{opacity: .7}
.what-we .colum:hover img{opacity: 1}
.what-we .colum .cover{position: absolute;left: 0;right: 0;bottom: 0; width: 100%;padding: 25px;z-index: 2;top:60%;}
.what-we .colum .cover,
.what-we .colum .cover h5,
.what-we .colum .cover::before,
.what-we .colum .cover .description,
.what-we .colum::after,
.what-we .colum img
{transition:All .5s ease;
        -webkit-transition:All .5s ease;
        -moz-transition:All .5s ease;
        -o-transition:All .5s ease;}
.what-we .colum .cover h5{color: #ffffff;position: relative;z-index: 5}
.what-we .colum .cover::before{width: 100%;height: 0%;left: 0;bottom: 0;background: #ffffff;display: block;content:"";position: absolute;transform: scale(.8);opacity: 0}
.what-we .colum:hover .cover::before{height: 100%;background: rgba(255,255,255,0.7);transition-delay: .2s;transform: scale(1);opacity: 1;border: 1px solid #cccccc }
.what-we .colum:hover .cover {top: 0;}
.what-we .colum:hover .cover h5{top: 0;color: #000000}
.what-we .colum .cover .description{font-size: 14px;height: 0;opacity: 0}
.what-we .colum:hover .cover .description{height: 100%;transition-delay: .7s;opacity: 1}
.what-we .colum::after{width:0%;height: 7px;left: 50%;top: 0;background:var(--primary);display: block;content:"";position: absolute;z-index: 11;}
.what-we .colum:hover::after{width:100%;left:0%;transition-delay: .7s;}
.what-we .owl-nav{padding: 15px 0 0;text-align: center}
.what-we .owl-nav button{border: 1px solid var(--primary)!important;width: 30px; height: 30px; text-align: center; border-radius: 50%;margin: 0 2px;font-size: 25px!important}
.what-we .owl-nav button span{display: block;line-height: 10px;position: relative;top: -2px;}
.jarallax {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}


.features{background-repeat:no-repeat;position: relative}
.features ul li{padding: 0 0 15px 20px;font-size: 20px}
.features ul li span{font-size: 14px}

#gowin     { background: url(../img/gowin.png) repeat-x 0 bottom; height:355px; position:absolute;
left:0; bottom:0; z-index: 6; width: 100%;}


#courses figcaption{height:66px }
#courses article{height:123px;overflow: hidden}
#courses .card-body ul li a{color: #666666;font-weight: 500;display: block;padding: 8px 20px;text-decoration: none;border-bottom: 1px solid #dee2e6}
#courses .card-body ul li a:hover{color: #000000;}
#courses .card-body ul li a:hover .text-primary{color: #000000!important;}
#courses .card-body ul li:nth-child(even){background:var(--bs-light) }
/**/
.help{background:url(../img/features-bg2.jpg) no-repeat center center; }
.help ul li{display: inline-block;padding: 0 50px;position: relative;font-size: 20px;font-weight: 400}
.help ul li::before{position: absolute;left:17px; top: 8px;width: 12px; height: 12px;border-radius: 50%;background: var(--bs-primary);display: block;content: "";}



#IELTS{background: #333333;color: #999999}
#IELTS .border-dark{border-color: #5c5c5c!important}
#IELTS .form-control{color: #ffffff}
#IELTS .form-control:focus{box-shadow:none; }
#IELTS label{font-style: italic}

/*page loader*/
#status{z-index: 9999;position:fixed;left: 0;top:0;bottom: 0;right: 0;background: #ffffff;  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: 100vh;}
.divider {
  position: absolute;
  z-index: 2;
  top: 65px;
  left: 200px;
  width: 50px;
  height: 15px;
  background: #fff;
}

.loading-text {
  position: relative;
  font-size: 3.75rem;
  font-weight: 300;
  margin: 0;
  white-space: nowrap;
}
.loading-text::before {
  position: absolute;
  content: "";
  z-index: 1;
  top: 40px;
  left: 115px;
  width: 6px;
  height: 6px;
  background: #000;
  border-radius: 50%;
  -webkit-animation: dotMove 1800ms cubic-bezier(0.25, 0.25, 0.75, 0.75) infinite;
          animation: dotMove 1800ms cubic-bezier(0.25, 0.25, 0.75, 0.75) infinite;
}
.loading-text .letter {
  display: inline-block;
  position: relative;
  color: #000;
  letter-spacing: 8px;
}
.loading-text .letter:nth-child(1) {
  transform-origin: 100% 70%;
  transform: scale(1, 1.275);
}
.loading-text .letter:nth-child(1)::before {
  position: absolute;
  content: "";
  top: 22px;
  left: 0;
  width: 14px;
  height: 36px;
  background: #fff;
  transform-origin: 100% 0;
  -webkit-animation: lineStretch 1800ms cubic-bezier(0.25, 0.25, 0.75, 0.75) infinite;
          animation: lineStretch 1800ms cubic-bezier(0.25, 0.25, 0.75, 0.75) infinite;
}
.loading-text .letter:nth-child(5) {
  transform-origin: 100% 70%;
  -webkit-animation: letterStretch 1800ms cubic-bezier(0.25, 0.23, 0.73, 0.75) infinite;
          animation: letterStretch 1800ms cubic-bezier(0.25, 0.23, 0.73, 0.75) infinite;
}
.loading-text .letter:nth-child(5)::before {
  position: absolute;
  content: "";
  top: 15px;
  left: 2px;
  width: 9px;
  height: 15px;
  background: #fff;
}

@-webkit-keyframes dotMove {
  0%, 100% {
    transform: rotate(180deg) translate(-110px, -10px) rotate(-180deg);
  }
  50% {
    transform: rotate(0deg) translate(-111px, 10px) rotate(0deg);
  }
}

@keyframes dotMove {
  0%, 100% {
    transform: rotate(180deg) translate(-110px, -10px) rotate(-180deg);
  }
  50% {
    transform: rotate(0deg) translate(-111px, 10px) rotate(0deg);
  }
}
@-webkit-keyframes letterStretch {
  0%, 100% {
    transform: scale(1, 0.35);
    transform-origin: 100% 75%;
  }
  8%, 28% {
    transform: scale(1, 2.125);
    transform-origin: 100% 67%;
  }
  37% {
    transform: scale(1, 0.875);
    transform-origin: 100% 75%;
  }
  46% {
    transform: scale(1, 1.03);
    transform-origin: 100% 75%;
  }
  50%, 97% {
    transform: scale(1);
    transform-origin: 100% 75%;
  }
}
@keyframes letterStretch {
  0%, 100% {
    transform: scale(1, 0.35);
    transform-origin: 100% 75%;
  }
  8%, 28% {
    transform: scale(1, 2.125);
    transform-origin: 100% 67%;
  }
  37% {
    transform: scale(1, 0.875);
    transform-origin: 100% 75%;
  }
  46% {
    transform: scale(1, 1.03);
    transform-origin: 100% 75%;
  }
  50%, 97% {
    transform: scale(1);
    transform-origin: 100% 75%;
  }
}
@-webkit-keyframes lineStretch {
  0%, 45%, 70%, 100% {
    transform: scaleY(0.125);
  }
  49% {
    transform: scaleY(0.75);
  }
  50% {
    transform: scaleY(0.875);
  }
  53% {
    transform: scaleY(0.5);
  }
  60% {
    transform: scaleY(0);
  }
  68% {
    transform: scaleY(0.18);
  }
}
@keyframes lineStretch {
  0%, 45%, 70%, 100% {
    transform: scaleY(0.125);
  }
  49% {
    transform: scaleY(0.75);
  }
  50% {
    transform: scaleY(0.875);
  }
  53% {
    transform: scaleY(0.5);
  }
  60% {
    transform: scaleY(0);
  }
  68% {
    transform: scaleY(0.18);
  }
}
@media (min-width: 48rem) {
  #container {
    transform: scale(0.725rem);
  }
}
@media (min-width: 62rem) {
  #container {
    transform: scale(0.85);
  }
}

@media (max-width: 1399px) {

    header .nav .nav-link{padding: 0 30px;}
    header .navbar-brand img{max-width: 150px}
    header {font-size: 13px;}
    header .phone i{width: 25px;height: 25px;}
    .what-we .colum .cover .description{font-size: 11px;}
    #gowin{background-size: 1379px;height: 253px}
    #courses figcaption{font-size: 22px;}
    #courses article{font-size: 84%;}
    .what-we .colum .cover h5{font-size: 17px;}
}
@media (max-width: 1199px) {

    #courses figcaption{height: auto}
    #courses article{height: auto;font-size: 100%}
    .section{padding: 49px 0;}
}
@media (max-width: 991px) {
    header .navbar-brand img{max-width: 82px;}
    header .nav .nav-link{padding: 0 10px;}
    .what-we .colum .cover .description{font-size: 15px;}
    header.fixed-header .nav .nav-link{font-size: inherit}
    .what-we .colum .cover .description{opacity: 1}
    .what-we .colum .cover .description{height: auto}
    .what-we .colum .cover{top: 0}
    .what-we .colum::after{left: 0;width: 100%}
    .what-we .colum .cover::before{height: 100%;opacity: .8;transform: scale(1)}
    .what-we .colum .cover h5{color: #000000}
}
@media (max-width: 768px) {
    .btn-yellow,
    .btn-black
    {font-size: 10px;padding: 7px 21px}
    .features ul li{padding: 0 0 15px 5px;margin: 0 0 0 20px;}
    .loading-text{transform: scale(.5);}
}
@media (max-width: 568px) {
    header.fixed-header .navbar-brand {display: none!important}

}