@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@500&family=Hind:wght@500&family=Kanit:wght@500&family=Lato:ital,wght@0,300;0,400;1,300;1,700&family=Montserrat&family=Noto+Sans&family=Nunito&family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;1,300&family=Nunito:ital,wght@0,400;0,600;0,700;1,300&display=swap');

body
{
     font-family: 'Nunito', sans-serif;
}
@media screen and (min-width: 480px) {
  .pop-canva {
    aspect-ratio: auto 370 / 370!important;
  }
}
.spin-pointer
{
      position: absolute;
    left: 44%;
    top: 1%;
    height: 11%;
}
@media only screen   
and (min-width: 1030px)   
and (max-width: 1366px)  
{
    .spin-pointer
{
     
    left: 42%!important;
 
}
    }
.institute-block-two
{
    background: #ffffff!important;
    margin-left: 20px;
    
    padding: 0px;
    margin-bottom: 20px;
    box-shadow: -3px 10px 12px grey;
        
        max-width: 400px;
        width: 100%;


}
@media only screen and (max-width: 600px) {
  .institute-block-two
{
  
        box-shadow: none!important;


}
}
#canvas
{
   
  border: double 15px transparent;
  border-radius: 50%;
      background-image: linear-gradient(#F9df7b,#b57e10,#fff3a6,#f9df7b,#F9df7b,#b57e10,#fff3a6,#f9df7b), radial-gradient(circle at top left, #5c573a,#580043,#300025);
  background-origin: border-box;
  background-clip: content-box, border-box;
  width: 100%;
  height: auto;

}
.pop-img1
{display: none;
    width: auto;
    height: 140px;
    position: absolute;
    bottom: 10px;
    right: 0px;
        transform: rotate(241deg);
}
.mail-pop-content
{
    margin-left: 40px;
    background: #e6e6e6de;
}
@media screen and (max-width: 800px) {

.mail-pop-content
{
    margin: 10px;
}
}
.lower-content
{
   padding: 20px;
    margin-bottom: 5px;
    padding-top: 10px;
   
}
.courses
{
   /* background:#f1eded;
    padding: 20px;*/
}
.new-price
{
color: #a02470;
    font-size: 18px;
    font-family: 'Nunito', sans-serif;
    font-weight: 500;
    position: relative;
    left: 0%;
}
.old-price
{
    
    font-size: 18px;
   font-family: 'Nunito', sans-serif;
   
    colore: red;
    color: #a29fa1;
    
    position: relative;
    left: 33%;
    /*transform: translate(-18px, 1px);*/
   
}
@media only screen and (min-width: 200px) and (max-width: 300px) {
 .old-price {
      left: 50%;
  }
}
@media only screen and (min-width: 300px) and (max-width: 500px) {
 .old-price {
      left: 37%;
  }
}
@media only screen and (min-width: 500px) and (max-width: 600px){
 .old-price {
      left: 28%;
  }
}
@media only screen and (min-width: 700px) and (max-width: 850px){
 .old-price {
      left: 39%;
  }
}
.old-price i
{
text-decoration: line-through;
}

.course-name
{
    padding: 10px;
    padding-top: 0px;
    text-align: left;
    padding-bottom: 0px;
}
.course-name h4 a
{
   font-size: 22px;
   font-family: 'Nunito', sans-serif;
    color: #511b51;
    font-weight: 600;
}
.course-name h4 a:hover
{
color:#cb4f59
}
.icon-sec
{
    padding-left: 0px;
    margin-left: -3px;
    padding-top: 15px;
    text-align: left;
}
.icon-sec a
{
  color: cb4f59!important;
    font-size: 18px;
    font-weight: 700;
   font-family: 'Nunito', sans-serif;
    border: 3px solid #cb4f59!important;
    background: white!important;
    /* padding: 4px; */
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 2px;
    padding-right: 2px;
  
}


.buy-now-txt i{
margin-left: 10px;
}
.icon-sec a:hover
{
    background: #cb4f59!important;
    border: 3px solid #cb4f59!important;
    color: white!important;
    font-size: 18px;
   font-family: 'Nunito', sans-serif;
}
.icon-sec a:focus
{
    
    outline: none;
    
}
.buy-btns:focus
{
    outline: none!important;
    border: none;
}

.buy-n-book-btn
{
        background: #a02470;
    padding: 10px;
    text-align: center;
    position: relative;
    bottom: 0;
}
.demo
{
    
    text-align: center;
    color: white;
    padding: 20px;
    font-size: 24px;
    font-family: 'Nunito', sans-serif;
    font-weight: 600;
}
.gradient-back {
 /*  background-image: url("../images/test-back.jpg");*/
    max-height: 20%!important;
   opacity: 0.9;
    background-image: linear-gradient(#511b51, #a02470);
    padding-top: 30px;
    padding-bottom: 30px;
}
.update-heading h1 
{
    font-size: 25px;
    text-align: center;
    font-weight: 700;
    color: #511b51;
}
@media only screen and (max-width: 767px)and (max-width: 1200px)
{
.gradient-back {
    position: relative;
    top: 10px!important;
    padding-top: 20px!important;

}
}
@media only screen and (max-width: 600px) {
  .course-carousel .owl-nav .owl-prev {
    top: 13%!important;
  }
}
@media only screen and (max-width: 600px) {
  .course-carousel .owl-nav .owl-next {
    top: 13%!important;
  }
}
.course-carousel .owl-nav .owl-prev {
    position: absolute;
    left: 0;
    font-size: 60px;
    color: #d2d2d2;
    line-height: 38px;
    margin-right: 10px;
    display: inline-block;
    -webkit-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    top: 30%;
    height: 90px;
    width: 50px;
    background: white!important;
    color: #8f8a8a!important;
    font-size: 20px!important;
   
}
.course-carousel .owl-nav .owl-next {
    position: absolute;
    right: 0;
    color: #d2d2d2;
    font-size: 60px;
    line-height: 38px;
    display: inline-block;
    -webkit-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;
    top: 30%;
    height: 90px;
    width: 50px;
    background: white!important;
    color: #8f8a8a!important;
    font-size: 20px!important;
   
}
.course-img
{
    width: 341px;
    height: auto;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}
.course-img-div
{
    overflow: hidden;
    position: relative;
}
.inner-box:hover .course-img
{
transform: scale(1.2);
transition: transform .5s ease;
}
.per-session-box
{
    position: absolute;
    transform: translate(33%, -75%);
    background: #cb4f59;
    padding: 12px;
    border-radius: 50%;
    padding-top: 20px;
    padding-bottom: 26px;
    z-index: 1;
}
.per-session-box h4
{
    font-size: 18px;
    color: white;
    font-weight: 600;
}
.per-session-box h6
{
    color: white;
    font-size: 14px;
    font-weight: 600;
}
.pricing
{
    padding-left: 10px;
}
.buy-n-book-btn a:hover
{
    color: white!important;
}
.main-footer .widgets-section {
    position: relative;
    padding: 50px 0 60px!important;
}
@media only screen and (max-width: 600px) {
  .institute-block-two {
    max-width: 100%!important;
   /* max-height: 522px;*/
    margin-left: 0px!important;
  }
}
@media only screen and (max-width: 600px) {
.icon-sec a{
margin-bottom: 8px;
}
}
.title
{
    font-size: 42px;
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 1.2;
    margin-bottom: 10px;
  
       color: #511b51;
    z-index: 2;
    margin-bottom: 0px;
   
}
.box-shadow h4
{
    font-size: 27px!important;
    font-family: 'Nunito', sans-serif;
    font-weight: 600!important;
    color: #ee7540;
    margin-bottom: 10px
}
.text{
color: #525252!important;
    font-family: 'Lato';
    font-size: 18px!important;
    line-height: 29px;
    font-weight: 500;
}
/*.title:after
{
    margin-bottom: 10px;
    border-bottom: 4px solid #a02470;
    content: " ";
    width: 103px;
    height: 9px;
    position: absolute;
    bottom: -11px;
    left: 42%;

}
@media only screen and (max-width: 600px) {
.title:after{
display: none;
}
}*/
.main-header.fixed-header .header-upper
    {
            background-color: #ffffff!important;
    }
    .blog .carousel-indicators {
    left: 0;
    top: auto;
    bottom: -80px;

}
.abt-img
{
    padding-right: 0px!important;
    position: absolute!important;
    right: 0px;
    z-index: 0;
    top: 0px;
}
.about-img
{
/*background-image: url("images/about.png");
height: 974px;
    background-size: cover;
    margin-top: -282px;
    left: 73px;*/
}
.about-content
{
  /*  margin-left: 20px;
    margin-right: 50px;*/
    padding-top: 50px;
}
.abt-text
{
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 1.2;
    margin-bottom: 10px;
    color:#ee7540;
    font-size: 42px;
    color: #cb4f59;
    text-shadow: 1px 1px  #b7b5b5;
    }



.abt-para{
font-size: 18px;
    font-family: 'Nunito', sans-serif;
    line-height: 27px;
    max-width: 500px;
    color:#161616;
}
/*.curry-btn
{

   background: #ee7540!important;
    border: 0px solid #9a236d!important;
    font: lato;
    line-height: 1;
    margin: 1.2rem;
    padding: 11px;
    color: #ffffff!important;
    font-weight: 600!important;
    border-style: solid;
    border-width: 10px;
   
    border-radius: 5px;
    margin-left: 0px;
    font-size: 21px;
    font-family: Montserrat;
}*/
.curry-btn
{
     background-image: linear-gradient(to right, #88226b, #552572, #89216a, #25073a)!important;
    box-shadow: 0 8x 15px 0 grey!important;

}

.main-header.fixed-header .header-upper
    {
            background-color: #ffffff!important;
    }
    .code-about {
    margin-bottom: 160px;
}

.demo:hover
{
    color: #f47a43!important;
}
.about
{
    margin-top: -95px;
    margin-bottom: 30px;
     padding-top: 0px!important;
}
@media only screen and (max-width: 600px) {
.about
{
    margin-top: 1px!important;
    margin-bottom: 30px;
}
}
.course-intro
{
    position: absolute!important;
  
    bottom: 15%;
    padding-top: 0px!important;
    padding-left: 0px;
    display: table;
    width: 100%;
  

}
@media screen and (min-device-width: 700px)
and (max-device-width: 1024px)
{
   .course-intro
{
   
    transform: translate(0%,30%);
   
} 
}

@media only screen and (max-width: 700px) {
.course-intro
{
 transform: translate(0%,-0%);
    /* top: -50%; */
    /* left: -28%; */
    max-width: 100%;
    position: relative;
    padding: 20px;
 
    background: white;
    text-align: left;
}
}
@media only screen and (max-width: 600px) {
.course-intro
{
    }}
@media only screen and (max-width: 600px) {
.abt-text
{
    position:relative;
    
    font-size: 47px;
    font-weight: 700;
    }

}
.abt-mob
{
    display: none;
}
#myBtn
{
    display: none;
}
@media only screen and (max-width: 600px) {
 .abt-mob
{
    display: block;
} 
#myBtn
{
    display: block;
}
}  
@media only screen and (max-width: 600px) {
 .abt-main
{
    display: none;
} 
} 
@media only screen and (max-width: 600px) {
.mob-head
{
   color: #511b51;
    font-size: 21px;
    font-weight: 600;
}
}
.login-btn
{
    margin-top: 35px!importan;
    padding-top: 5px!important;
    padding-bottom: 5px!important;
   padding-left: 30px!important;
    padding-right: 30px!important;
    border-radius: 5px!important;
    font-size: 19px!important;
    background-image: linear-gradient(to right, rgb(145 33 105), rgb(76 37 115))!important;
    border: none!important;
    box-shadow: 5px 10px 8px #3e0d3d;
    /*transform: translate(-2px, -8px);*/
     moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.login-btn:hover
{
    background: rgb(145 33 105)!important;
   transition: 5s;
   transition-timing-function: ease-in-out;
   color: white!important;
   background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.l:after
{
    content:'';
  top:0;
    transform:translateX(100%);
    width:100%;
    height:220px;
    position: absolute;
    z-index:1;
    animation: slide 1s infinite;
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(128,186,232,0) 99%, rgba(125,185,232,0) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.8)), color-stop(99%,rgba(128,186,232,0)), color-stop(100%,rgba(125,185,232,0)));
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 );

}
@keyframes slide {
    0% {transform:translateX(-100%);}
    100% {transform:translateX(100%);}
}
#more {display: none;}
@media only screen and (max-width: 600px) {
.abt-para
    {
       font-size: 17px;
    font-family: 'Nunito', sans-serif;
    line-height: 26px;
    max-width: 500px;
    color: #383636;
    text-align: justify;
    font-family: 'Poppins';
    font-weight: 500;
    }
}
.mob-banner
{
    display: none;
}
@media only screen and (max-width: 600px) {
    .mob-banner
    {
        display: block;
    }
}
.main-banner
{
    display: block;
}
/*@media only screen and (max-width: 600px) {
    .book-demo
{
    display: none;
}
}*/
@media only screen and (max-width: 700px) {
    .main-banner .course-intro
{
    display: none;
}
}
@media only screen and (max-width: 700px) {
    .course-intro
{
        transform: translate(0%,-0%);
    top: -52%;
    /* left: -28%; */
    max-width: 100%;
    position: relative!important;
    padding: 20px;
    background: white;
    text-align: left;
    margin-top: 30px;
}
}
.main-menu .navigation>li>a 
{
    font-weight: 600!important;
    line-height: 31px;
    padding: 38px 0;
}
.book-demo
{
     width: 329px;
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    margin: 20px;
    height: 52px;
    text-align: center;
    border: none;
    background-size: 298% 100%;
    border-radius: 5px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    margin-left: 0px;
        margin-top: 7%!important;
}
.book-demo:hover
{
     background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    color: white!important;
}
.book-demo:focus
{
     outline: none;
}
.book-demo .curry-btn
{
 background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
}
@media only screen   and (min-device-width : 768px)   and (max-device-width : 1024px) 
{
  .main-banner
  {
    height: 70%;
  }  
}
      .link {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 1;
      }

      .d-block:after {
  content:"";
  display:block;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:rgba(0,0,0,0.7);
}
/*.selectdiv {
  position: relative;
  /*Don't really need this just for demo styling*/
  
  float: left;
  min-width: 200px;
  margin: 50px 33%;
}

/*To remove button from IE11, thank you Matt */
select::-ms-expand {
     display: none;
}
.certified
{
    border-radius: 0;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 0 10px;
    position: absolute;
    right: -7px;
    text-transform: capitalize;
    top: 11px;
    -webkit-transition: all 150ms ease-in-out 0s;
    -o-transition: all 150ms ease-in-out 0s;
    transition: all 150ms ease-in-out 0s;
    background: #ee7540;
    font-family: 'Lato';

}
.im{
color: #500050;
}
.certified:before {
    border-left: 7px solid rgba(0, 0, 0, 0.45);
    border-top: 7px solid transparent;
    content: "";
    height: 0;
    position: absolute;
    right: -1px;
    top: 0;
    transform: translateY(-100%);
    width: 0;

    }
.certified:after{
/*border-left: 50px solid ;*/
    }
    .sessions
    {
        text-align: left;
    padding-left: 10px;
    margin-bottom: 5px;
    }
    .icon-session i
    {
            font-size: 18px;
    color: #858080;
    margin-right: 10px;
    }
    .sessions h5
    {
        font-size: 16px;
    color: #858080;
    
    font-weight: 500;
    }
    .overlay-container:after{
display: block;
    background: rgba(0,0,0,0.7);
    position: absolute;
    top:0;
    left:0;
    width:100%;
    min-height: 250px;
    }
    .d-bloc{
        display: block;
        position: absolute;
    width: 100%;
    height: 100%;
    background: red;
    opacity: 0.7;
    z-index: 2;
    }
    select {

  /* styling */
  background-color: white;
  border: thin solid blue;
  border-radius: 4px;
  display: inline-block;
  font: inherit;
  line-height: 1.5em;
  padding: 0.5em 3.5em 0.5em 1em;

  /* reset */

  margin: 0;      
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.session-selection option
{
  background: white;
  color: gray;
}
.session-selection
{
    color:gray;
    font-weight: 500;
    padding-left: 0px;
    padding-right: 30px;
    padding-top: 2px;
    border: none!important;
    font-size: 16px;
    background: #fbfbfb;
    padding-bottom: 2px;
}
.session-selection:hover
{
    background: #511b51;
    color: white;
    padding-left: 8px;


}
.session-selection:focus
{
    background: #511b51;
    color: white;
    padding-left: 8px;
    outline: none!important


}
.per-session
{
padding-left: 10px;
    padding-bottom: 5px;
}
.per-session h4
{
   font-size: 16px;
    font-weight: 700;
    color: #cb4f59;
    letter-spacing: 1px;
}
select.session-selection
{
background-image: linear-gradient( 
45deg
, #1ff9c500 50%, #511b51 50%), linear-gradient( 
135deg
, #511b51 50%, transparent 50%), linear-gradient(to right, #fbfbfb, #fbfbfb);
    background-position: calc(100% - 11px) calc(1em + -4px), calc(100% - 4px) calc(1em + -4px), 100% 0;
    background-size: 8px 6px, 8px 6px, 2.5em 2.5em;
    background-repeat: no-repeat;
}
select.session-selection:hover
{
background-image: linear-gradient( 
45deg, #1ff9c500 50%, #ffffff 50%), linear-gradient( 
135deg, #ffffff 50%, transparent 50%), linear-gradient(to right, #511b51, #511b51);
    background-position: calc(100% - 11px) calc(1em + -4px), calc(100% - 4px) calc(1em + -4px), 100% 0;
    background-size: 8px 6px, 8px 6px, 2.5em 2.5em;
    background-repeat: no-repeat;
}
/* arrows */

select.classic {
 background-image: linear-gradient( 
45deg, transparent 50%, white 50%), linear-gradient( 
135deg, white 50%, transparent 50%), linear-gradient(to right, #683e69, #693e69);
    background-position: calc(100% - 20px) calc(1em + -3px), calc(100% - 15px) calc(1em + -3px), 100% 0;
    background-size: 9px 5px, 6px 5px, 2.5em 2.5em;
    background-repeat: no-repeat;
}

select.classic:focus {
  background-image:
    linear-gradient(45deg, white 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, white 50%),
    linear-gradient(to right, #6a3f6a, #6a3f6a);
  background-position: calc(100% - 14px) 1em, calc(100% - 21px) 1em, 100% 0;
    background-size: 7px 5px, 5px 5px, 2.5em 2.5em;
  background-repeat: no-repeat;
  border-color: transparent;
  outline: 0;
}
section{
padding-top: 30px;
    padding-bottom: 30px;
}
.book-now-btn
{
        background: #d96633;
    width: 100%;
    color: white!important;
    font-size: 20px;
}
.start-now i{
font-size: 13px;
    position: relative;
    top: -2px;
}
.buy-now-header
{
    background: #802a78!important;
    text-align: center;
    color: white;
    text-transform: uppercase;
}
.buy-now-header h4
{
   font-family: 'Nunito', sans-serif;
    font-size: 30px;
}
.payment-title
{
    margin-bottom: 0px!important;
}
.buy-now-body
{
    padding: 30px!important;
}
.buy-now-input
{
    
        border-bottom: 2px solid #828181!important;
        border-top: none!important;
        border-left: none!important;
        border-right: none!important;
        border-radius: 1px!important;
   
    
}
.coupan-code
{
   background: #f47a43!important;
    color: white!important;
    font-size: 20px!important;
    font-family: 'Nunito', sans-serif;
    border-radius: 5px!important;
    /* padding-top: 0px!important;*/

}
.bill-info
{
    font-size: 17px;
   font-family: 'Nunito', sans-serif;
    font-weight: 600;
    margin-bottom: 3px;
    color: #511b51;
        border-top: none!important;
}
.bill-data
{
    font-size: 16px;
    font-family: 'Nunito', sans-serif;
    font-weight: 600;
    color: #511b51;
    margin-bottom: 3px;
    text-align: right;
        border-top: none!important;
}
.prizing-div
{
    padding: 20px;
    border: 1px dotted #7b7878;
    margin-top: 20px;
    margin-bottom: 20px;
    display: block;
}
.course-info
{
    padding-right: 0px!important;
}
.prizing
{
    padding-left: 0px!important;
}
.dis-text
{
    color: #ee7540!important;
}
.bill-head
{
    color: #802a78!important;
    font-size: 20px!important;
   font-family: 'Nunito', sans-serif;
    font-weight: 600;
}
.bill-total
{
    color: #802a78!important;
    font-size: 20px!important;
   font-family: 'Nunito', sans-serif;
    font-weight: 600;
    text-align: right;
}
.bill-total-desc
{
    color: #802a78!important;
    font-size: 20px!important;
    font-family: 'Nunito', sans-serif;
    font-weight: 600;
    
}
.pay-now-btn
{
    background: #802a78!important;
    border: #802a78!important!important;
    font-size: 20px!important;
    /* width: 29%; */
    padding-top: 3px!important;
    padding-bottom: 3px!important;
    padding-left: 30px;!important
    padding-right: 30px!important;
    color: white!important;
    font-weight: bold;
}
.mt-10
{
    margin-top: 10px!important;
}
.pl-0
{
    padding-left: 0px!important;
}
.pr-0
{
    padding-right: 0px!important;
}
@media only screen and (max-width: 600px) {
 .pl-0
{
    padding-left: 20px!important;
}
}
@media only screen and (max-width: 600px) {
 .pr-0
{
    padding-right: 20px!important;
}
}
@media only screen and (max-width: 600px) {
 .coupan-code
{
   margin-top: 10px!important;
}
}
#myDIV
{
    display: none;
}
.cpn-labl
{
        font-size: 18px;
    color: #511b51;
    font-weight: 600;
}
.cpn-input
{
    height: 50px;
    border-radius: 10px;
}
.back-gradient
{
    width: 100%;
    z-index: -1;
    background-image: linear-gradient(#511b51, #a02470);
    height: 20.6%;
    position: absolute;
}
.course-plain .back-gradient
{
     height: 20%;
}
.certified:after {
    content: '';
    top: 0;
    transform: translateX(150%);
    width: 51px;
    height: 24px;
    position: absolute;
    z-index: 1;
    animation: slide 2s infinite;
    left: 66px;
  /* 
  CSS Gradient - complete browser support from http://www.colorzilla.com/gradient-editor/ 
  */
  background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(128,186,232,0) 99%, rgba(125,185,232,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.8)), color-stop(99%,rgba(128,186,232,0)), color-stop(100%,rgba(125,185,232,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* IE10+ */
    background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */
}
#course-list
{
     text-align: left;
    margin-bottom: 20px;
}
.course-filter-btn
{
    color: #ffffff;
    font-size: 20px;
    font-weight: 600;
    margin: 5px;
}
.course-filter-btn:hover
{
    color: #ee7540;
    /*border-bottom: 3px solid #ee7540;*/
   
}
.course-filter-btn:focus
{
    /*border-bottom: 3px solid #ee7540!important;*/
    color: #ee7540!important;
    box-shadow: 0 0 0 0.2rem rgb(243 246 249)!important;
    background: white;
    border: none!important;
}
.btn.active
{
    /*border-bottom: 3px solid #ee7540!important;*/
    color: #ee7540!important;
    box-shadow: 0 0 0 0.2rem rgb(243 246 249)!important;
    background: white;
   
    border: 1px solid #d96633!important;
}
.course-plain .institute-block-two
{
    max-width: 31%;
}
.course-plain .course-img
{
    width: 100%;
}
.course-plain .container-fluid
{
    max-width: 90%;
}
.course_cor .institute-block-two
{
    max-width: 100%!important;
}
.the_wheel
{
    background-image: url(../images/Asset-61.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    
}


@media screen and (max-width: 600px) {
.spin-pop #canvas1
{
    
    height: 270px!important;
    width: 270px!important;
}
}
@media screen and (max-width: 600px) {
.spin-pop .the_wheel
{
    
   height: 355px!important;
    width: 308px!important;
    background-size: 268px!important;
    background-position: 20px 1px!important;
}
}
.spin-pop #canvas1
{
    
    
    width: 85%;
}
.spin-pop .the_wheel
{
background-size: cover;
background-position: center center;
}
@media screen and (max-width: 600px) {
.spinner-img
{
    
    position: relative;
    top: 3px;
    left: 2px;
}
}
@media screen and (max-width: 600px) {
.center-spin
{
    
   transform: translate(-47px, -213px)!important;
}
}
@media screen and (max-width: 600px) {
.spin-pop
{
    
   max-width: 100%!important;
}
}
@media screen and (max-width: 600px) {
.spin-pop
{
    
   max-width: 100%!important;
}
}


         .coupon-btn {
            box-shadow: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(110,80,20,.4),
              inset 0 -2px 5px 1px rgba(139,66,8,1),
              inset 0 -1px 1px 3px rgba(250,227,133,1);
  background-image: linear-gradient(160deg, #e6b626, #bc881b, #fef1a2, #bc881b, #b78d11)!important;background-image: linear-gradient(
160deg, #f47a43, #f47a43, #f47a43, #f47a43, #f47a43)!important;
  border: 1px solid #a55d07;
  color: white!important
            
        }
         .coupon-btn {
            /*margin: 10px;*/
            padding: 15px 45px;
            text-align: center;
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white!important;            
            box-shadow: none;
            top: 20px;
            border-radius: 10px;
            display: block;
            top: 32px;
          }
.coupon-btn:hover
{
 
 background-image: linear-gradient(
160deg, #f47a43, #f47a43, #f47a43, #f47a43, #f47a43)!important;   
}
          
  
    .discount-text
    {
        color: #f47a43;
    }  
/
/*.coupon-btn:hover
{
     background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #ad7f21 30%, #cba85b 40%, #ad7f21 80%)!important;
}*/
@keyframes c1move {
  from {left: 0px;}
  to {left: 4px;}
}

.spin-wheel
{
   background-image: linear-gradient(#511b51, #a02470);
}
.speen-text
{
    padding: 10px;
    padding-top: 20px;
    padding-left: 25px;
}
.speen-text h2
{
    font-weight: 600;
    text-align: left;
    font-size: 35px;
    color: #ee7540;;
}
.speen-text p{
    margin-top: 15px;
    text-align: left;
    color: #fbf3f3;
    font-size: 21px;
}
.spin-submit
{
border: 1px solid #ee7540;;
    width: 100%;
    background: #ee7540;
    font-size: 24px;
    padding-top: 5px;
    padding-bottom: 5px;
    color: white!important;
    border-radius: 10px;


}
.spin-pop
{
    max-width: 40%;
}
.spin-header
{
    border-bottom: none!important;
    padding-bottom: 0px!important;
}
.spin-header h5
{
    font-size: 20px;
    color: #c31717;
    font-weight: 700;
}
.spin-submit:hover
{
border: 1px solid #ee7540;
    width: 100%;
    background: #ee7540;
    font-size: 24px;
    padding-top: 5px!important;
    padding-bottom: 5px!important;
    

}
.center-spin
{
    position: absolute;
    transform: translate(-46px, -318px);
}
.spin-submit:focus
{
border: 1px solid #ee7540;
    width: 100%;
    background: #ee7540;
    font-size: 24px;
    padding-top: 5px!important;
    padding-bottom: 5px!important;
    color: white!important;
    border-radius: 10px;

}

@-webkit-keyframes the_wheel2
 {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1665deg);
    -o-transform: rotate(1665deg);
    transform: rotate(1665deg);
  }
}
@keyframes the_wheel2 {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(deg);
    -moz-transform: rotate(1665deg);
    -webkit-transform: rotate(1665deg);
    -o-transform: rotate(1665deg);
    transform: rotate(1665deg);
  }
}
.the_wheel2 {
  -webkit-animation: the_wheel2 2s ease-in-out 0s;
  -moz-animation: the_wheel2 2s ease-in-out 0s;
  -ms-animation: the_wheel2 2s ease-in-out 0s;
  -o-animation: the_wheel2 2s ease-in-out 0s;
  animation: the_wheel2 2s ease-in-out 0s;
}
@-webkit-keyframes the_wheel1
 {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1665deg);
    -o-transform: rotate(1665deg);
    transform: rotate(1665deg);
  }
}
@keyframes the_wheel1 {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(deg);
    -moz-transform: rotate(1665deg);
    -webkit-transform: rotate(1665deg);
    -o-transform: rotate(1665deg);
    transform: rotate(1665deg);
  }
}
.the_wheel1 {
  -webkit-animation: the_wheel1 2s ease-in-out 0s;
  -moz-animation: the_wheel1 2s ease-in-out 0s;
  -ms-animation: the_wheel1 2s ease-in-out 0s;
  -o-animation: the_wheel1 2s ease-in-out 0s;
  animation: the_wheel1 2s ease-in-out 0s;
}

.rotate-cntrl
{
    width: 100%;
    text-align: center;
    font-size: 20px;
    background: #ee7540;
    margin-top: 20px;
    color: white;
    text-transform: uppercase;
    border-radius: 10px;
    font-weight: 700;
}
.rotate-cntrl:hover
{
   
    background: #a02470;
    margin-top: 20px;
    color: white;
    
}
.subscribe-btn
{
    background: #511b51;
    border: 1px solid #511b51;
    font-size: 20px;
    font-weight: 600;
}
.subscribe-btn:hover
{
    background: #511b51;
    border: 1px solid #511b51;
}
.no-sub
{
    background: #f47a43;

    border: 1px solid #f47a43;
    font-size: 20px;
    font-weight: 700;
}
.no-sub:hover
{
    background: #f47a43;

    border: 1px solid #f47a43;
    
}

.spin-pop .modal-body
{
    background: #f7f7f7;
}
.mailpop-body
{
      background: #f7f7f7;
    padding: 15px 20px;
    background-image: url(../images/blast1.jpg);
    background-position: center;
    background-size: cover;
    width: 40%;
  
}
@media screen and (max-width: 600px) {
 .mailpop-body {
   width: 100%;
  }
}
.mailpop-body h4
{
    text-align: left;
    color:#511b51;
    font-size: 28px;
    font-weight: 500;
}
.mailpop-body h4:after
{
/*content: "";*/
    border-bottom: 2px solid #f39015;
    width: 201px;
    height: 10px;
    position: absolute;
    bottom: -4px;
    left: 0;
    padding-top: 10px;

}

#spin_button
{
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #3f123f;
    border: 1px solid #330b33;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
  
}
#spin_button:hover
{
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #cb4f59;
    border: 1px solid #cb4f59;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
}
#spin_button:focus
{
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #cb4f59;
    border: 1px solid #cb4f59;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
}
.pop-input
{
    height: 50px;
    border-radius: 10px;
    background: #e6dede;

}
.mailpop-body h4 span
{
    color: #511b51;
    font-weight: 700;
}
.mail-submit
{
    background: #511b51;
    width: 100%;
    border: 1px solid #511b51;
    color: white;
    font-size: 18px;
    font-weight: 700;

}
.mailpop-body p
{
    margin-top: 20px;
    text-align: left;
    font-size: 17px;
    color: black;
    font-weight: 600;
}
.mail-pop
{
    max-width: 70%;
}
@media only screen and (max-width: 600px) {
  .mail-pop 
{
    max-width: 100%;
    padding:5px!important;

}
}
@media only screen and (max-width: 600px) {
  .mailpop-body
{
   
    padding:0px!important;

}
}
#email-pop
{
    padding-right: 0px!important;
}
.spinner-img
{
    position: relative;
    top: 3px;
    left: 1px;
}
.owl-theme .owl-controls .owl-page {
    display: inline-block;
}
.owl-theme .owl-controls .owl-page span {
    background: none repeat scroll 0 0 #869791;
    border-radius: 20px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    opacity: 0.5;
    width: 12px;
}
.spin-rules h2
{
    margin-top: 45px;
    font-size: 50px;
    font-weight: 900;
    color: #511b51;
    font-style: italic;
    /* text-shadow: 1px 5px #511b51; */
    letter-spacing: 2px;
}
.spin-rules p
{
    color: #cb0818;
    font-size: 19px;
    font-weight: 600;
    margin-top: 20px;
}
.rule-box
{
    background: #511b51;
    border: 1px solid #511b51;
    border-radius: 10px;
    padding-left: 7%;
    padding-right: 7%;
}
.spin-site
{
    padding-left: 7%;
}
.rule-box ul{
    text-align: left;
    padding-top: 10px;
    padding-bottom: 15px;
}
.rule-box ul li
{
    color: white;
    font-size: 16px;
    margin-bottom: 10px;
    font-weight: 600;
}
.rule-box h4
{
    color: white;
    font-size: 33px;
    border-bottom: 1px solid white;
    font-weight: bold;
}
.mailpop-header 
{
    border-bottom: 0px!important;
}
.mail-close
{
    opacity: 1!important;
}
.mail-close span
{
    color: #580043;
    cursor: pointer;
    font-size: 23px;
}
#loader {
 border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #a02470;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
     display: none; 
    position: absolute;
    top: 20%;
    left: 50%;
    z-index: 100000;
}
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.sucess-content
{
    margin-top: 20px;
}
.sucess-content h2
{
    color: #8ac926;
}
.sucess-content i
{
     color: #10ab10;
    font-weight: 400;
    font-size: 60px;
}
.table-left
{
    font-size: 17px;
    font-weight: 500;
    color: gray;
    text-align: left;
}
.table-right
{
    font-size: 17px;
    font-weight: 600;
    text-align: right;
}
.sucess-content 
{
  padding: 20px;
    background: white;
    box-shadow: 0px 40px 80px 0px rgb(2 2 26 / 41%);
    z-index: 9999;
}
.success-section
{
    background: #f5f1f1;

}
.sucess-content img{
max-height: 120px;
    width: auto;
}
.mobile-menu .navigation li .login-btn
{
    position: relative;
    background: white!important;
    box-shadow: none;
    text-align: left;
    margin-top: 13px!important;
    padding-left: 20px!important;
    margin-left: 0px;
    color: black!important;
}
.pattern-layer
{
position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 420px;
    background-repeat: repeat-x;
    animation: slide 0s linear 1s;
    
    }
    .btn:focus {
  outline: none!important;
  box-shadow: none!important;
}
@media only screen and (max-width: 770px) {
  .apply-coupan {
   margin-top: 10px!important;
    margin-left: 15px!important;
  }
}
.swal2-styled.swal2-confirm 
{
    background-color: #511b51!important;
    border: 0;
    border-radius: 0.25em;
    background: initial;
    color: #fff;
    font-size: 1.5em!important;
    font-weight: 700!important;
}
.swal2-styled.swal2-confirm:focus
{
    outline: 3px solid #511b51!important;
}
.demo-success
{
    background-image: url(../images/demo-success.png);
    padding: 50px;
}
/*.swal2-title
{
    padding-top: 30%!important;
}*/
.swal2-icon.swal2-success
{
    visibility: hidden!important;
}
.swal2-container.swal2-center>.swal2-popup
{
    background-repeat: no-repeat!important;
    background-size: cover!important;
}
.spin-result-content
{
  padding: 30px;
    width: 650px;
    height: auto;
    padding-top: 10px;
    padding-bottom: 9px;
   
}
.spin-result-image{
    
   background-size: cover;
   background-repeat: no-repeat;  
}
.spin-result-header
{
    display: block;
    border: none;
    padding-top: 25px;

}
.spin-result-body
{
    padding: 0px;
}
.spin-result-contents
{
    background: #cb4f59;
}
.spin-result-contents h2
{
        margin-top: 10px;
    border-top: 3px solid #e9818c;
    font-size: 30px;
    font-weight: 700;
    color: white;
    padding-top: 25px;
}
.spin-btnss{
    text-align: center;
    text-align: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 3px solid #b12b32;
    border-radius: 2px;
}
.spin-btnss button
{
    padding-left: 20px;
    padding-right: 20px;
    font-size: 20px;
    font-weight: 600;
    background: #ffad35;
    color: #e12726;
    border: none;
}
.spin-btnss button:hover
{
 background: #ffd101;
    color: #e12726;
    border: none;
}
.spin-btnss button:focus
{
 background: #ffd101;
    color: #e12726;
    border: none;
}
@media only screen and (max-width: 800px) {
  .spin-result-content {
    width: 100%!important;
  }
}
@media only screen and (max-width: 800px) {
  .spin-result-image {
    margin-bottom: 20px;
  }
}
.spin-result-title
{
    color: white;
    font-size: 25px;
    font-weight: 700;
}
.spin-result-contents h5
{
    color: #ffff;
    font-size: 18px;
    font-weight: 500;
    padding-top: 25px;
    padding-bottom: 30px;
    text-align: center;
}
.spin-result-footer
{
   border: none;
    display: block;
    text-align: right;
}
.spin-result-footer button
{
    background: #ff9338;
    border: 1px solid #ff9338;
    font-size: 17px;
    font-weight: 700;
    text-transform: uppercase;
}
.swal-book .swal2-title
{
    padding-top: 30%!important;
}
.swal-book .swal2-popup
{
    border-radius: 20px!important;
}
.logo-below
{
    text-align: right;
    padding-top: 20px;
    
}
.print-btn
{
    background: #f47a43;
    font-size: 20px;
    color: white;
    font-weight: 500;
    border-radius: 5px;
}
.print-btn:hover
{
   
    color: white;
  
}
.Back-home
{
    background: #511b51;
    color: white;
    font-size: 20px;
    margin-left: 20px;
}
.Back-home:hover
{
    color: white;
}
.invoice-buttons i
{
margin-right: 10px;
}
.dates-picker
{
   width: 50%;
   height: 45px;
    font-size: 17px;
    margin-left: 15px;
    padding-left: 12px;
    border: 1px solid #ced4da;
    padding: 8px;

}

input[type="date"]::-webkit-clear-button {
  font-size: 18px;
  height: 30px;
  position: relative;
}
 input[type="date"]::-webkit-inner-spin-button {
        opacity: 0
    }

    input[type="date"]::-webkit-calendar-picker-indicator {
        background: url(../images/calender-icon.png) center/100% no-repeat;
        
       
        color: rgba(0, 0, 0, 0);
        opacity: 0.8;
    }

    input[type="date"]::-webkit-calendar-picker-indicator:hover {
        background: url(../images/calender-icon.png) center/100% no-repeat;

        opacity: 1;
    }  
    .login-list
    {
        padding: 33px 0px;
    }   
    .title-new
    {
        font-size: 40px;
    text-align: left;
    margin-bottom: 10px;
    padding-bottom: 0px;
    }
    .new-subtitle
    {
        text-align: left;
    color: #f47a43;
    margin: 10px 0px;
    font-size: 20px;
    font-weight: bolder;
    }
    .steam-site img 
    {
        filter: drop-shadow(8px 15px 5px #dbd9d8);
    position: relative;
   /* height: 350px*/;
    /*right: 10%;
    top: 20%;*/
     /* animation: example 5s infinite;*/
          animation-timing-function: ease-in-out;
}
@keyframes example {
  0% {top: 0%}
  50% {top: 20%}
  100%{top: 0%}
}
@media (min-width: 1200px)
{
.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 80%;
}
}
.counter-achievements
{
   /* background-image: url(../images/count-back1.jpg);*/
       background-color: #fae8f3;
    padding-top: 50px;
    padding-bottom: 50px;
   /* margin-top: 60px;*/
}
.title2 h2
{
    color: #511b51;
    text-transform: uppercase;
    font-family: 'Kanit', sans-serif;
    letter-spacing: 0px;
    text-transform: capitalize;
    font-size: 50px;
    font-weight: 700;
}
.title2
{
    position: relative;
    margin: 0 auto;
}
.counter-ic img
{
        height: 90px;
    filter: drop-shadow(1px 11px 7px #702a09);
    width: auto;
}
.counter-ic
{
    text-align: center;
}
.count-num h4
{
margin-top: 15px;
    color: #511b51;
    letter-spacing: 2px;
    font-size: 40px;
    text-align: center;
    font-weight: bolder;
    margin-left: 10px;
    line-height: 44px;
}
.count-num h5 
{
   color: #f47a43;
    font-size: 21px;
    line-height: 30px;
    font-weight: 500;
    font-family: 'Kanit';
}
.grade_selection{
padding: 5px;
    padding-left: 30px;
    padding-right: 30px;
    margin-bottom: 20px;
    /* background-color: #fff; */
    color: #fff;
    font-size: 30px;
    border-top: 8px;
    border-left: 8px;
    border-bottom: 8px;
    /* border-right: 10px; */
    /* border-right: 19px; */
    border-radius: 10px;
    /* box-shadow: 7px 8px 12px #888888; */
    word-spacing: 2px;
    letter-spacing: 1px;
    border: 2px solid #6a3f6a;
    background: #6a3f6a;
    font-family: 'Kanit', sans-serif;
  }

.selection-field{
line-height: 2px;
    background-color: #f7f7f7;
    color: #511b51;
    font-size: 17px;
    /* font-family: 'lato'; */
    margin-bottom: 9px;
    font-weight: 500;
    height: 20px;
}
.selection-field option:hover {
   box-shadow: 0 0 10px 100px #1882A8 inset;
}
.start-now1
{
    text-align: center;
    padding-bottom: 30px;
}
.start-now-btn1
{
    background: #511b51;
    width: 90%;
    border-radius: 5px;
    color: white;
    font-weight: 700;
}
.start-now1 h4
{
    font-weight: 700;
}
.course-content1 ul li .right i 
{
    border: 1px solid green;
}
.email-input
{
    height: 40px;
    font-size: 17px;
}
.mail-pop-container
{
    max-width: 100%;
}
.coupn-btn a
{
font-size: 20px;
    background: #f47a43;
    color: white;
    font-weight: 700;
    border: 1px solid #f47a43;
 position: fixed;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    top: 80%;

}
.coupn-btn a:after
{
content: " ";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
      border-width: 19px 0 19px 18px;
  border-color: #ebebeb #ebebeb #ebebeb white;
}
.current img 
{
height: 30px;
}
@media only screen and (max-width: 600px) {
 #vert_menu {
   
    top: 24%;
        z-index: 9;
}
}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: 5;
  animation-iteration-count:5;
}

.animated:hover {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}


 

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.8, .8, .8) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.8, .8, .8) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.8, .8, .8) rotate3d(0, 0, 1, -3deg);
    -ms-transform: scale3d(.8, .8, .8) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.8, .8, .8) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}



.course-section {
    padding-bottom: 70px;
    background: #ffffff;
    padding-top: 70px;
}
.sec-title {
    margin-bottom: 42px;
}
.sec-title>h2 {
    color: #511b51;
    font-size: 50px;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: 7px;
    position: relative;
    z-index: 1;
    font-family: 'Kanit', sans-serif;
}
.course-section .find-course .sec-title p {
    margin-bottom: 22px;
        font-size: 17px;
}
.course-section .find-course .sec-title>h3 {
    font-size: 20.32px;
    color: #155799;
    font-weight: 500;
}
.course-section .find-course .sec-title>h3 img {
    margin-right: 9px;
    height: 30px;
}
.course-section .find-course .sec-title>h3>strong {
    font-weight: 700;
}
.course-section .find-course .course-img {
  /*  background-image: url(../images/abt-element.png);*/
    background-repeat: no-repeat;
    background-position: 50%;
    width: 100%
}
.course-section .find-course .course-img>img {
    max-width: 100%;
}
.course-section .courses-list {
    margin-top: 63px;
}
.course-section .all-btn {
    float: right;
    display: inline-block;
    color: #155799;
    font-size: 14.23px;
    font-weight: 600;
    margin-top: 20px;
    text-transform: uppercase;
}
.course-section .all-btn i {
    padding-left: 13px;
}
.course-section .courses-list .course-card {
    background-color: #fff;
    box-shadow: 0 0 10px rgb(21 87 153 / 8%);
    padding: 28px 28px 30px;
    border-radius: 25px;
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}
.course-section .courses-list .course-card:before {
    content: "";
    position: absolute;
    top: 6px;
    left: -1px;
    width: 7px;
    height: 166px;
   /* background-image: url(../images/shape3.png);*/
    background-repeat: no-repeat;
}
.course-section .courses-list .course-card .course-meta li {
    display: inline-block;
    color: #575757;
    font-size: 14.23px;
    margin-right: 11px;
}
.course-section .courses-list .course-card .course-meta li img {
    margin-right: 7px;
}
.course-section .courses-list .course-card .course-meta li:last-child {
    margin-right: 0;
}
.course-meta{
   /* display: inline-block;*/
    color: #df5314;
    font-size: 18px;
    margin-left: auto;
    font-weight: 700;
    text-align: right;
    margin-bottom: 10px;
}
.course-section .courses-list .course-card>h3 a{
       color: #300230;
    font-size: 25px;
    text-transform: capitalize;
    font-weight: bolder;
    margin-top: 18px;
    margin-bottom: 20px;
    font-family: 'Nunito', sans-serif;
    text-transform: uppercase;
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
}
.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}
.d-flex {
    display: -ms-flexbox!important;
    display: flex!important;
}
.course-section .courses-list .course-card .posted-by>img {
    margin-right: 7px;
    border-radius: 100px;
}
.course-section .courses-list .course-card .posted-by>a {
    display: inline-block;
    color: #575757;
    font-size: 14.23px;
    text-transform: capitalize;
    font-weight: 500;
}
.course-section .courses-list .course-card .posted-by>a {
    display: inline-block;
    color: #575757;
    font-size: 14.23px;
    text-transform: capitalize;
    font-weight: 500;
}
.course-section .courses-list .course-card .locat img {
    margin-right: 12px;
}
.course-section .courses-list .course-card:nth-child(2) {
  background-image: linear-gradient(#511b51, #a02470);
}
.course-section .courses-list .course-card:nth-child(2) .course-meta a {
 color: #f47a43;
}
.course-section .courses-list .course-card:nth-child(2) h3 a
{
    color: white;
}
.course-section .courses-list .course-card:nth-child(2) p
{
    color: white;
}
.course-section .courses-list .course-card {
    background-color: #fff;
    box-shadow: 0 0 10px rgb(21 87 153 / 8%);
   padding: 10px 28px 0px;
    border-radius: 25px;
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    border-bottom: 7px solid #f7f2f2!important;
    border: 1px solid #f3dddf;
        max-width: 30%;
    margin-right: 20px;
}
@media only screen and (max-width: 600px) {
  .course-section .courses-list .course-card {
   max-width: 100%; */
     margin: auto;
  }
}
@media only screen and (max-width: 970px) and (min-width: 600px) {
  .course-section .courses-list .course-card {
   max-width: 40%;
     margin: auto;
  }
}
.course-section .courses-list .course-card:before {
    content: "";
    position: absolute;
    top: 6px;
    left: -1px;
    width: 7px;
    height: 166px;
   /* background-image: url(../images/shape3.png);
    background-repeat: no-repeat;
}
.posted-by p{
margin-bottom: 10px;
font-family: 'Nunito', sans-serif;
    color: #726f72;
    font-size: 18px;
}
.right-arr
{
    display: none;
}
.course-meta a:hover .right-arr
{
  
    transform: translatex(10px);

}
.course-meta a
{
    color: #cb4f59;
}
.course-meta a:hover
{
    color:#56b4e4;
}
.course-card:hover
{
  /* transform: translatex(30px);  
   transition: transform 330ms ease-in-out;*/
}
.coupon-icon img
{
max-width: 250px;
    width: 80%;
    position: fixed;
    top: 50%;
    z-index: 99;
}
.animated {
  animation-duration: 1s;
  animation-iteration-count: 3;
}

@keyframes tada {
  0% {
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    transform: scale3d(1, 1, 1);
  }
}



.coupon-icon img:hover  {
  animation-name: tada;
  z-index: 99;
}
.tada 
{
   animation-name: tada; 
}
.testimonial-section-two
{
      padding-top: 0px;
    padding-bottom: 0px;
    background-image: url(../images/hexa-background.png);
}
@media only screen and (max-width: 1000px) and (min-width: 300px)  {
    .steam-site img
    {
        position: relative;
        left: 0px;
        top: 0px;
    }
}
@media only screen and (max-width: 1000px) and (min-width: 300px)  {
    .steam-site 
    {
        max-width: 100%;
    }
}
.desk-abt-img
{
    display: none;
}
@media only screen and (max-width: 600px) and (min-width: 300px)  {
    .steam-site img
    {
        position: relative;
        left: 0px;
        top: 0px;
        animation: unset;
    }
}
@media only screen and (max-width: 1000px) and (min-width: 300px)  {
.counter-box
{
margin-bottom: 20px;
}
}
@media only screen and (max-width: 800px) and (min-width: 300px)  {
.course-section .courses-list .course-card:nth-child(2) {
left: 0px;
}
}
@media only screen and (max-width: 1400px) and (min-width: 800px)  {
.course-section .courses-list .course-card:nth-child(2) {
/*left: -7%;*/
}
}
.abt-row
{
   padding: 20px 10px 20px 10px;
    background: #f7f7f7;
    border-radius: 5px;
    box-shadow: 9px 13px 7px #f5efef;
    margin-top: 20px;
}
.abt-steps li 
{
    display: inline-block;
}
.abt-header
{
    background: #f1eaf1;
}
.below-header-list li 
{
   display: inline-block;
    font-size: 20px;
    padding: 10px 15px;
    color: #501b50;
    /* border: 2px solid; */
    font-weight: 700;
}
.below-header-row
{
   background: white;
    box-shadow: 2px 10px 9px #b6b3b9;
    padding: 20px;
    width: 100%;
    height: 100%;
    overflow: scroll;
    white-space: nowrap;
}
.below-header
{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    transform: translatey(-50%);
}
@media screen and (min-width: 1200px) {
  .below-header-row {
  overflow: hidden;
  }
}
.main-heading-abt
{
       font-size: 65px;
    font-weight: 700;
    color: #511b51;
    line-height: 75px;
    
    letter-spacing: 3px;
    padding-bottom: 45px;
    border-bottom: 1px solid #d9d8d8;
    margin-right: 30px;
   
}
.new-abt
{
    padding-top: 120px;
        z-index: 1;
    position: relative;
}
.left-abt
{
    border-right: 1px solid #e8e6e6;
}
.abt-head-right
{
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #511b51;
}
.right-abt
{
    padding-left: 40px;
}
.abt-text-new
{
font-size: 18px!important;
}
.abt-text-new b 
{
    font-size: 17px!important;
    color: #f47a43;
}
.abt-head-left
{
   
    margin-top: 40px;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #511b51;
}
.vision-text
{
 
    padding-right: 30px;
}
.pb-30
{
    padding-bottom: 30px;
        border-bottom: 1px solid #d9d8d8;
}
.abt-left-content
{
    position: relative;
    z-index: 99;
    background: white;
}
.shape1
{

       position: absolute;
    z-index: 0;
    transform: translate(-50%,-71%);
    display: none;
}
@media screen and (max-width: 650px) {
 .shape1{
 display: none;
  }
}
@media screen and (max-width: 575px) {
 .below-header-row {
   width: 94%;
   margin-left: 10px;
  }
}
@media screen and (max-width: 575px) {
 .right-abt {
  padding-left: 15px;
  }
}
.mob-abt-text
{
    display: none;
}
@media screen and (max-width: 575px) {
 .mob-abt-text
{
    display: block;
}
}
@media screen and (max-width: 575px) {
 .mob-abt-text
{
    display: block;
}
}
@media screen and (max-width: 575px) {
 .desk-abt-text
{
    display: none;
}
}
.purpose-photo-section img
{
height: 80%;
    border-top-left-radius: 90px;
    border-bottom-right-radius: 90px;
    margin-left: 23%;
}
.Purpose-section
{
        background-image: url(../images/back-phil.jpg);
    background-size: contain;
    padding: 0px;
}
.inner-background
{
        background-image: linear-gradient(45deg, #511b51, #511b51c9);
    padding: 30px;
}
.purpose-photo-section
{
        padding-right: 50px;
        padding-left: 50px;
}
.purpose-photo-section h4
{
   font-size: 40px;
    color: white;
    font-weight: 700;
    margin-bottom: 30px;
}
.pur-text
{
    color: white!important;
    font-size: 17px!important;
}
.icon-pur img{
   height: 100px;
    width: auto;
    margin-left: 0px;
    border-radius: 0px;
}
.icon-pur
{

    margin-bottom: 30px;
}
@media screen and (max-width: 575px) {
 .inner-background
{
        padding: 20px;
}
}
@media screen and (max-width: 575px) {
.purpose-photo-section {
     padding-right: 0px; 
}
}
.brand-main img
{
margin: 0 auto;
    /* height: 46px; */
   height: 40px;
    width: auto;
    /* width: auto!important;
}
.brand-main
{
    padding-top: 20px;
    padding-bottom: 20px;
        position: relative;
}
.brand-container
{
   background: #f9f4f9;
    max-width: 47%;
    margin-left: 20px;
    height: 260px;
    margin-bottom: 20px;
    border-radius: 20px;
}
.brand-main h2
{
    font-size: 55px;
    font-weight: 600;
    color: #511b51;
    font-weight: 900;
 /*   /* margin-top: 20px;*/

}
.kidz-container
{
   padding: 0px; 
}
.kidz-banner
{
    padding-bottom: 0px;
}
@media screen and (max-width: 600px) {
 .brand-container
{
   
    max-width: 100%;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
}
}
.brand-main p
{
margin-top: 15px;
    padding: 0px 20px;
    line-height: 25px;
    font-size: 16px;
    color: white;
    color: #3e3c3e;
    
    font-weight: 900;
   
}
.brand-link
{
    padding: 5px 10px;
    font-size: 20px;
    font-weight: 600;
    background: #511b51;
    color: #edebeb;
    margin: 0 auto;
}
.lab-text
{
    color: #f47a43;
    font-weight: 900;
}
.innov-text
{
    padding-top: 50px;
}
.brand-logo
{
    font-weight: 900;
    line-height: 39px;
    color: #9e246f;
    text-transform: uppercase;
    font-size: 40px;
}
.brand-container
{
           margin-bottom: 20px;
    /*margin-left: 20px;*/
    max-width: 48%;
}
.brand-main
{
   background: white;
  
    padding: 20px;
    max-width: 95%;
    border-radius: 15px;
    border-bottom: 8px solid #722972!important;
    border: 1px solid #ede6ed;
    padding-bottom: 15px;
    margin-top: 20px;
}
@media only screen and (max-width: 600px) {
  .brand-main {
   margin: 0 auto;
  }
}
.odd-box1
{
    position:relative;
   /* top: 40px;*/
}
.odd-box2
{
    position:relative;
    top: 30px;
}
.brand-left-text h2
{
    padding-top: 40px;
    font-weight: 500;
    font-size: 45px;
    margin-right: 20px;
    line-height: 55px;
    font-family: 'Kanit', sans-serif;
}
.buy-kit-header
{
    width: 90%;
    font-size: 24px;
    font-weight: 700;
}
.buy-kit-modal-row
{
    padding: 10px;
}
.buy-kit-label
{
    font-size: 16px!important;
    font-family: 'Nunito';
    font-weight: 600;
    color: #670347!important;
}
.buy-kit-btn
{
    font-size: 18px;
    padding: 6px 35px;
    border-radius: 7px;
    background: #a20470;
    border: #a20470;
    font-weight: 700;
}
.buy-kit-form-group
{
    margin-bottom: 20px;
}
.buy-kit-input
{
        height: 35px;
    font-size: 16px;
    border: 1px inset #f4f3f4;
    border-radius: 6px;
    box-shadow: 4px 5px 1px #b4b1b1;
}
.buy-kit-modal p
{
    text-align: center;
    font-size: 16px;
    color: #393838;
    font-family: 'Kanit';
    padding: 10px;
}
.brand-left-text p 
{
    margin-top: 0px;
    font-size: 17px;
    padding-right: 9px;
    line-height: 25px;
    color: #6f7583;
    text-align: left;
}
.steam-site
{
    display: flex;
    align-items: center;
}
@media only screen and (max-width: 600px) {
  .brand-container {
    max-width: 100%;
  }
}
@media only screen and (max-width: 600px) {
 .odd-box1 {
    position: relative;
     top: 0px; 
}
}
.news
{
        padding-top: 100px;
}
.brand-container:hover
{
    transform: translatey(15px)!important;
    transition: transform 330ms ease-in-out!important;
}
.main-menu .navigation>li
{
        margin-right: 27px;
}
@media only screen and (max-width: 1100px) {
 .login-list {
    padding: 0px 0px;
}
}
@media only screen and (max-width: 1100px) {
 .coupon-btn {
    top: 0px;
}
}
.course-icon img
{
    height: 80px;
    padding: 10px;
    background: #f7f3f1;
    border-radius: 16px;
}
.onhover-icon
{
    display: none;
}
.course-card:hover .onhover-icon{
display: block;
background: #511b51;
}
.course-card:hover .course-main-icon{
display: none;
}
.course-card:hover
{
    transform: translatey(15px)!important;
    transition: transform 330ms ease-in-out!important;
}
.no-background 
{
        background: transparent!important;
}
.main-menu .navigation>li>a
{
    font-size: 20px;
}
@media screen and (max-width: 1500px) and (min-width: 1100px) {
.main-menu .navigation>li>a
{
    font-size: 17px;
}
}
.overlay-orange:after{
content:"";
  display:block;
  position:absolute;
  top:0;
  bottom:0;
 left: 15px;
    right: 15px;
  background: rgb(81 27 81 / 35%);
}
.brand-left-info
{
        position: relative;
    right: 10%;
   /* margin-top: 20px;*/
}
.shape-wave-upper
{
position: relative;
    left: 0;
    right: 0;
    bottom: calc(100% - 8px);
    z-index: 2;
    }
.shape-wave-bottom
{
position: relative;
    left: 0;
    right: 0;
    bottom: calc(100% - 8px);
    z-index: 2;
    transform: rotate(180deg);
    }
    .summercamp-bro 
    {
        position: fixed;
    bottom: 100px;
    z-index: 30;
    }
   .summercamp-bro  h2 a
   {
    font-size: 20px;
    background-image: linear-gradient(to right top, #eb4f12, #e74717, #e23f1b, #de361e, #d92d21);
    padding: 5px 20px;
    color: white;
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
    font-weight: bolder;
   }
   .summercamp-bro:hover{
 transform: scale(1.1);
transition-timing-function: ease-in-out;
   }
   .adv-pic-main img
{
height: 500px;
width: auto;
}
.head-title
{
    font-size: 43px;
    color: #511b51;
    font-weight: 700;
    margin-bottom: 15px;
}
.adv-name
{
    font-size: 26px;
    color: #8f2169;
    margin-bottom: 15px;

    font-weight: 700;
}
.more
{
    display: none;

}
.show-more-text
{
    color: #f47a43!important;
    font-size: 17px;
    font-weight: 700;
}
.adv-main
{
    padding-bottom: 45px!important;
}
.adv-info p 
{
    font-size: 17px;
    text-align: justify;
}
.adv-info
{
    height: 500px;
    overflow: auto;
    display: flex;
    flex-flow: column;
    justify-content: center;
}
.for-mob-adv
{
    display: none;
}
@media screen and (max-width: 600px) {
 .for-mob-adv {
    display: block;
  }
}
@media screen and (max-width: 600px) {
 .for-desk {
    display: none;
  }
}
@media screen and (max-width: 600px) {
 .adv-info {
   height: auto;
  
  }
}
.career-form
{
    margin: auto;
    padding: 35px 20px;
}
.career-label
{
    font-size: 20px;
    color: #511b51;
    font-weight: 800;
}
.career-input
{
    border: 1px dotted gray;
    margin-bottom: 20px;
    height: 42px;
    font-size: 18px;
}
.custom-file-label 
{
    font-size: 20px;

}
.submit-outer
{
        font-size: 20px;
    display: flex;
    justify-content: center;
}
.sub-btn-career
{
    font-size: 20px;
    margin-top: 20px;
    width: 100%;
    text-align: center;
    background: #511b51;
    color: white;
    padding: 0px;
}
.update-heading
{
    margin-top: 20px;
}
.update-snip
{
        position: fixed;
    bottom: 5%;
    z-index: 1000;
    background: white;
    padding: 10px;
    border-radius: 7%;
    margin-left: 20px;
}
.update-snip .update-main h4
{
    font-size: 20px;
    color: #511b51;
    font-weight: 600;
}
.update-snip .update-main small
{
font-size: 11px;
    color: black;
    font-weight: 600;
}
.steam-row
{
    padding-bottom: 75px;
}
.p-0
{
    padding: 0px;
}
.btn-know-more 
{
    background: #511b51;
    color: white;
    font-size: 18px;
    font-weight: 700;
    box-shadow: 4px 4px 8px #847c84;
}
.skill-text img
{
height: 120px;
}
.skill-text
{
    text-align: center;
}
.skill-text h3
{
    color: #4c4848;
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 20px;
    padding-top: 20px;
    margin-bottom: 20px;
}
.program-for-school h2
{
   font-size: 35px;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-weight: 900;
}
.program-for-school img 
{
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.steam-kit-name
{
    font-size: 30px;
   
    font-weight: 700;
}
.robotic-spl-makebot
{
        display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
  /*  border-right: 1px dotted gray;*/
    padding-bottom: 20px;
        margin-bottom: 20px;
}
.benifits-makebot-side
{
    background: linear-gradient(306deg, #511b51, #86226b);
    padding: 30px;
    margin-right: 20px;
    border-top-left-radius: 40px;
    border-bottom-right-radius: 40px;
    box-shadow: 4px 5px 7px grey;
}
.benifits-makebot-side2
{
    background: linear-gradient(306deg, #fcfbfc, #c7c5c6);
}
.benifits-makebot-side2 .benifits-makebot-side-wrapper ul li
{
    color:#511b51;
    font-weight: 700;
}
.benifits-makebot-side h4 
{
    text-align: center;
    color: #f47a43;
    font-weight: 700;
}
.benifits-makebot-side-wrapper ul 
{
    padding: 20px;
}
.benifits-makebot-side-wrapper ul li
{
   font-size: 17px;
    color: white;
    list-style-type: disc;
    line-height: 30px;
}
.box-shadow .robotic-spl-makebot:first-child
{
  /*border-right: 1px dotted gray; */ 
}
.kit-divider
{
    height: 2px;
    background-image: linear-gradient(344deg, #511b51, transparent);
}
.robotic-spl-title
{
        font-size: 31px;
    color: #511b51;
    font-weight: 700;
}
.robotic-spl-list li
{
list-style-type: disc;
    color: #5f5b59;
    font-size: 18px;
    line-height: 30px;
    font-weight: 600;
}
.prog-1
{
   padding: 0px;
    border: 0px dashed #511b51;
    max-width:32%;
   /* margin-left: 25px;*/
    background: linear-gradient(254deg, #bd0a86, #2e002e);
    border-radius: 10px;
    box-shadow: 4px 4px 6px grey;
}
.prog-1 .text
{
    padding: 20px;
    padding-top: 0px;
    font-size: 16px!important;
    color: white!important;
}
.prog-2 h2
{
color: #78065c;
}
.prog-2 
{
    background: linear-gradient(45deg, #efefef, #ffffffeb);
    padding: 0px;
    max-width: 32%; 
   border-radius: 10px;
    box-shadow: 4px 4px 6px grey;
}
.mkbot-fr-school .prog-2:last-child
{
   /* margin-left: 25px;*/
}
.prog-2 .text
{
    font-size: 16px!important;
    padding: 20px;
    padding-top: 0px;
    color: #98086f!important;
}
@media only screen and (max-width: 785px) {
  .prog-2 {
    max-width: 100%!important;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 785px) {
  .mkbot-fr-school .prog-2:last-child {
    margin-left:0px;
}
}
@media only screen and (max-width: 785px) {
  .prog-1 {
    max-width: 100%!important;
    margin-left: 0px;
    margin-bottom: 20px;
  }
}
.prog-1 a
{
    font-size: 15px;
    font-weight: 700;
    background: white;
    color: #90076a!important;
    border: 1px solid #840663;
    padding: 10px 20px;
    border-radius: 5px;
    margin-bottom: 20px;
}
.prog-2 a 
{
    font-size:15px;
    font-weight: 700;
   background: #4b0240;
    color: white;
    border: 1px solid #840663;
    padding: 10px 20px;
    border-radius: 5px;
    margin-bottom: 20px;

}
.prog-2 a:hover{
    color: white;
        box-shadow: 5px 4px 7px grey;
        transition-duration: 0.3s;
}
.prog-1 a:hover 
{

     box-shadow: 5px 4px 7px #070005;
      transition-duration: 0.3s;
}
.ml-0
{
    margin-left: 0px;
}
.hover-zoom:hover 
{
    transform: scale(1.05);
    transition: transform .2s;

}
.ribbon {
  width: 150px;
  height: 150px;
  overflow: hidden;
  position: absolute;
}
.ribbon::before,
.ribbon::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 5px solid #2980b9;
}
.ribbon span {
  position: absolute;
  display: block;
  width: 225px;
  padding: 15px 0;
  background-color: #3498db;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
  color: #fff;
  font: 700 18px/1 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-transform: uppercase;
  text-align: center;
}

.steam-lab-offer li 
{
    text-align: left;
    text-align: left;
    margin-bottom: 5px;
    font-size: 15px;
    color: #3e0138;
    font-weight: 700;
}
.pl-3
{
    padding-left: 30px;
}
.pr-3
{
    padding-right: 30px;
}
.pt-3 
{
    padding-top: 30px;
}
.pb-3 
{
    padding-bottom: 40px;
}
.pricing-plan
{
padding-top: 50px;

padding-bottom: 40px;
}
.mkbot-fr-school
{
    padding-bottom: 50px;
}

.offer-box
{
    padding-top: 20px;
    background: #ebebeb;
    padding-bottom: 20px;
    box-shadow: 4px 4px 4px grey;
    max-width: 23%;
   /* margin-left: 20px;*/
    text-align: center;
}
@media (min-width: 500px) and (max-width: 992px)
{
  .offer-box
  {
    max-width: 45%;
    margin-bottom: 20px;

  }  
}
@media (max-width: 500px)
{
  .offer-box
  {
    max-width: 98%;
    margin-bottom: 20px;
    margin-left: 0px;

  }  
}
.offer-box h3 
{
    background: #3e0138;
    color: white;
    margin-bottom: 15px;
    line-height: 45px;
    font-size: 22px;
    font-weight: 700;
    border-radius: 7px;
}
.offer-box h4 
{
        color: #f47a43;
    font-weight: 700;
    margin-bottom: 10px;
    font-size: 30px;
}
.offer-box a 
{
    background: #3e0138;
    border: #3e0138;
    font-size: 19px;
    margin-top: 15px;
    font-weight: 700;
    border-radius: 8px;
    padding: 10px 20px;
}
.steam-lab-offer li span i 
{
    font-size: 15px;
    font-weight: 500;
    margin-right: 10px;
    color: #f47a43;
}
.abt-icon-outer img 
{
height: 120px;
    padding: 20px;
    border: 2px solid #f2f0f0;
    border-radius: 50%;
    background: #efeded;
    box-shadow: -1px 0px 18px 8px #cecece;
}
.abt-us-heading
{
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #511b51;
   
}
.abt-us-heading h5 
{
    font-size: 25px;
    font-weight: 700;
}
.abt-main-box
{
    padding: 20px 30px;
}
.brand-link:hover 
{
    color: #edebeb;
}
.image-wrapper-course img 
{
    width: 100%;
    height: auto;
}
.courses-start-wrapper h3
{
        font-size: 20px;
    font-weight: 500;
    color: #f47a43;
    font-family: 'Kanit';
}

.course-content-main-name h3 
{
    font-size: 22px;
    font-weight: 700;
    color: #511b51;
    line-height: 35px;
}
.course-content-main-sessions span 
{
       color: #505050;
    font-size: 17px;
    margin-right: 13px;
    font-weight: 500;
    word-spacing: 2px;
    font-family: 'Nunito';
    margin-top: 10px;
}
.course-content-main-sessions
{
       padding-bottom: 5px;
    border-bottom: 1px inset #bdbdbd;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.course-content-main-buttons span 
{
   color: #511b51;
    font-size: 20px;
    font-weight: bold;
    font-family: 'Nunito';
    word-spacing: 1px;
    letter-spacing: 1px;
    line-height: 10px;
}
.course-content-main-buttons span a
{
   color: #ffffff;
    font-size: 17px;
    font-weight: 700;
    background: #511b51;
    margin-top: 10px;
        padding-left: 6px;
    border-radius: 4px;
}
.course-content-main-buttons span a:hover
{
box-shadow: 4px 4px 0px #260b26;
color: white!important;
transition-duration: 0.5s;
}
.course-content-main-buttons span a:focus 
{
    color: white!important;
}
.course-content-main-name  span 
{
    font-size: 18px;
    font-weight: 700;
    /* font-family: 'Nunito'; */
    color: #511b51;
}
.coding-course-main-container
{
       padding: 0px;
    border: 1px solid #e0dcdc;
    border-radius: 11px;
    box-shadow: 4px 7px 8px grey;
    margin-right: 20px;
    max-width: 23%;
}
@media only screen and (max-width: 600px) {
 .coding-course-main-container {
    max-width: 97%;
    margin-bottom: 15px;
    margin-left: 20px;
  }
}
@media only screen and (max-width: 1300px) and (min-width: 600px) {
 .coding-course-main-container {
    max-width: 47%;
    margin-bottom: 15px;
    margin-left: 20px;
  }
}
.course-detail-content-wrapper
{
    padding: 15px;
}
.view-all-courses-btn a 
{
        background: #511b51;
    color: white;
    font-size: 18px;
    padding: 10px 20px;
    font-weight: 700;
    margin-top: 20px;
    letter-spacing: 2px;
    margin-top: 20px;
}
.view-all-courses-btn a:hover{
box-shadow: 4px 4px 0px #260b26;
color: white!important;
transition-duration: 0.5s;
}
.view-all-courses-btn a:focus 
{
    color: white!important;
}
.product-circle
{
        position: relative;
}
.product-circle img 
{
    height: 275px;
    filter: none;
}
.rotate-anim
{
    animation: rotation 10s linear;
     animation-iteration-count: 2;
}
@keyframes rotation {
   
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
.owl-carousel .owl-nav
{
    display: block!important;

}
.owl-prev .finale-arrow
{
        position: absolute;
    top: 25%;
    left: -4%;
}
.owl-next .finale-arrow
{
        position: absolute;
    right: -5%;
    top: 25%;
}
.new_nav .nav-link
{

color: white;
    font-size: 20px;
    font-family: 'Kanit';
    font-weight: 500;
}
.new_nav a
{
  color: white;  
   font-size: 20px;
    font-family: 'Kanit';
    font-weight: 500;
}
.header-style-one .navbar
{
    margin-left: 30px;
    margin-right: 30px;
}
.new_nav
{
    margin-right: 15px;
}
@media only screen and (max-width: 768px) {
  .owl-prev .finale-arrow
{
     display: none;
}
}
@media only screen and (max-width: 768px) {
    .owl-next .finale-arrow
    {
       display: none!important;
    }
}
.makex-gallery-image .hover-shadow
{
  transition: 0.3s;
}
.makex-gallery-image .hover-shadow:hover{
    transform: scale(1.04);
    transition: 0.3s;
    cursor: pointer;
}
.btn-know-more:hover
{
    color: white;
}
.banner-area
{
       background-image: url(../images/Partners-banner.jpg);
    /* max-height: 660px; */
    width: 100%;
    background-size: contain;
    min-height: 660px;
    background-repeat: no-repeat;
}
.partner-second-section .section-head
{
    text-align: center;
    font-size: 23px;
    color: #511b51;
    font-weight: 700;
}
.partner-second-section .section-head
{
    padding-bottom: 20px;
}
.partner-second-section .section-sub-content .text
{
    padding: 0px 20px;
}
.partner-form-section .picture-section
{
    background: #511b51;
}
.partner-form-section .form-section form
{
    padding: 30px;
    background: #f9f9f9;
    box-shadow: 2px 6px 10px grey;
}
.partner-form-section .form-section form label 
{
        font-size: 20px;
    font-weight: 600;
    color: #511b51;
}
.partner-form-section .picture-section
{
    background-image: url(../images/partner-back.png);
    /* height: 100%; */
    background-size: cover;
    z-index: 100;
    padding: 0px;
}
.partner-form-section .contact-back 
{
    background: #511b51c4;
    height: 100%;
    padding: 15px;
}
.partner-form-section .contact-back h1 
{
    color: #f47a43;
    font-size: 33px;
    margin-top: 20px;
    font-weight: 700;
}
.partner-form-section .contact-back p 
{
        color: white;
    font-size: 17px;
    font-weight: 700;
    margin-top: 30px;

}
.partner-section-two ul li{
font-size: 18px;
    line-height: 28px;
    color: #3d393d;
    font-weight: 700;
    margin-bottom: 10px;
}
.partner-section-two ul li span  
{
    color: #511b51;
}
.partner-section-two ul li span i  
{
    margin-right: 5px;
}
.sale-text-outer
{
     --f: 10px; /* control the folded part*/
  --r: 15px; /* control the ribbon shape */
  --t: 10px; /* the top offset */
  
  position: absolute;
  inset: var(--t) calc(-1*var(--f)) auto auto;
  padding: 0 10px var(--f) calc(10px + var(--r));
  clip-path: 
    polygon(0 0,100% 0,100% calc(100% - var(--f)),calc(100% - var(--f)) 100%,
      calc(100% - var(--f)) calc(100% - var(--f)),0 calc(100% - var(--f)),
      var(--r) calc(50% - var(--f)/2));
  background: #ff824a;
  box-shadow: 0 calc(-1*var(--f)) 0 inset #0005;
  padding-bottom: 15px;

}

.sale-text-outer span 
{
       color: black;
    font-size: 14px;
    font-weight: 700;
}
.sale-text-inner span 
{
  
    background: #0c0c0b;
    padding-right: 15px;
    margin-bottom: 6px; 
    color: white;
    font-size: 17px;
}
.sale-text 
{
    padding-left: 15px
}
.bredcrumb-section 
{
        padding-top: 15px;
    padding-bottom: 15px;
    background: #f7f6f6;
}
.bredcrumb-section .breadcrumb 
{
        background-color: #f7f6f6;
}
.bredcrumb-section .breadcrumb a 
{
    font-size: 18px;
    color: #511b51;
    font-weight: 700;
}
.bredcrumb-section .breadcrumb .active 
{
    color: #f47a43;
    font-size: 18px;
    font-weight: 700;
}
.breadcrumb-item+.breadcrumb-item::before {
  display: inline-block;
    padding-right: 0.5rem;
    color: #f47a43;
    content: ">>";
    font-size: 17px;
    font-weight: 700;
}
.footer-form input
{
    color: white!important;
    background: #f5edf566;
    border: 1px solid #7b517b;
    border-radius: 7px;
}
.footer-form input::placeholder 
{
    color: white!important;
    font-size: 14px;
    font-weight: 600;
}
.footer-form-submit
{
    background: #f47a43;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #f47a43;
    padding: 5px 40px;
    border-radius: 7px;
}
.social-box a 
{
        padding: 7px;
    font-size: 20px;
}
.footer-form input:focus
{
 color: white!important;
    background: #f5edf566;
    border: 1px solid #7b517b;
    border-radius: 7px;
}
.course-content-main-sessions span a 
{
    color: #505050;
    font-size: 17px;
    margin-right: 13px;
    font-weight: 500;
    word-spacing: 2px;
    font-family: 'Nunito';
    margin-top: 10px;
}
.course-content-main-sessions span i 
{
    color: #511b51;
}
.blogs-title span 
{
    margin-right: 10px;
    background: #f47a43;
    color: white;
    padding: 2px 5px;
    font-size: 14px;
    font-weight: 700;
}
.blog-title-head 
{
        font-size: 35px;
    margin-top: 20px;
    color: #511b51;
    font-weight: 700;
    margin-bottom: 20px;
}
.blog-title-head:after 
{
    color: orange;
    color: "";
    height: 10px;
    width: 10px;
    text-align: center;
}
.blog-content
{
    margin-top: 20px;
}
.blog-content p span {
    color: #511b51;
    font-size: 25px;
    font-weight: 700;
}
.blog-content p {
font-size: 17px;
    color: #4B464A;
    text-align: justify;
}
.blog-subheading
{
    font-size: 25px;
    color: #511b51;
    font-weight: 700;
}
.blog-benifits-list li 
{
   margin-bottom: 20px;
    font-size: 17px;
    font-weight: 700;
    color: #4B464A;
    text-align: justify;
    line-height: 25px;
}
.blog-benifits-list li i 
{
    margin-right: 5px;
        color: #511b51;
}
.app_heading_top
{
       color: #f47a43;
    font-size: 50px;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 40px;
}
.app_heading_middle
{
   font-size: 70px;
    color: white;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 90px;
}
.app_heading_end
{
   color: #f47a43;
    font-size: 50px;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 30px;
}
.download-app-image
{
    display: flex;
    margin-top: 30px;
   
    align-items: center;
    
}
.qr-code img 
{
   width: 200px;
    margin-right: 30px;
    margin-left: 15px;
}
.app-store img 
{
    width: 200px;
}
.text-wrapper-app
{
    flex-direction: column;
}
.mobile-app-image img 
{
    width: auto;
    height: 400px;
}
.download-app-section
{
    margin-bottom: 50px;
}
.download-app-section .gradient-back
{
    background-image: linear-gradient(#511b51, #a02470e8)!important;
    padding-top: 0px!important;
    padding-bottom: 0px!important;
}
@media only screen and (max-width: 600px) {
 .app_heading_top
{
       color: #f47a43;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 40px;
}
.app_heading_middle
{
   font-size: 40px;
    color: white;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 90px;
}
.app_heading_end
{
   color: #f47a43;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 2px;
    line-height: 30px;
}
.download-app-section .gradient-back
{
    background-image: linear-gradient(#511b51, #a02470e8)!important;
    padding-top: 20px!important;
    padding-bottom: 20px!important;
}

}
.app-reg-outer
{
    margin: 0 auto;
    padding: 0px;
}
.app-reg-outer .card-header .card-title
{
    margin-bottom: 0px;
}
.app-reg-outer .card-header 
{
    background: white;
}
.app-reg-outer .card-header .card-title .card-label 
{
    font-size: 20px;
}
.app-registration-form label i
{
color: #511b51!important;
    margin-right: 6px;
}
.app-registration-form label {
color: #511b51!important;
}
.app-registration-form input 
{
    background-color: #EBEDF3;
    border-color: #EBEDF3;
    color: #3F4254;
    -webkit-transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, -webkit-box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease;
height: calc(1.5em + 1.65rem + 2px);
    padding: 0.825rem 1.42rem;
    font-size: 1.08rem;
    line-height: 1.5;
    border-radius: 0.675rem;

}
.btn-submit
{
    background-color: #f47a43;
    border-color: #f47a43;
    color: white;
}