body{
    font-size:.85rem;
    font-weight:400;
    font-family:'Poppins', Arial, Helvetica, sans-serif;
}
a{
    color:#429DE3;
    -webkit-transition: all .25s linear;
    -moz-transition:    all .25s linear;
    -o-transition:      all .25s linear;
    transition:         all .25s linear
}
a:hover{
    color:#002B4C
}
h2{
    font-size:1.85rem;
    font-weight:600;
    text-transform:uppercase
}
.col-lg-20{
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
.highlight{
    color:#429DE3
}
p.pre{
    color:#429DE3;
    font-weight:600;
    text-transform:uppercase
}
header{
    color:#EAE9E9;
    background-color:#000;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image:url("../img/bg.jpg");
    min-height:80vh;
    padding-bottom: 40px;
}
header nav .navbar-toggler-bar svg{
    color:#EAE9E9;
    height:28px !important;
    width:28px !important
}
header a svg{
    color:#FFF;
    height:72px !important;
    width:72px !important;
    -webkit-transition: all .25s linear;
    -moz-transition:    all .25s linear;
    -o-transition:      all .25s linear;
    transition:         all .25s linear
}
header a:hover svg{
    color:#429DE3
}

header a.sing-up,
a.call,
a.btn{
    color:#FFF;
    border:2px solid #BC252B;
    background:#BC252B;
    border-radius:4px;
    text-transform:uppercase
}
header a.sing-up:hover,
a.call:hover,
a.btn:hover{
    color:#BC252B;
    border:2px solid #BC252B;
    background:transparent;
}
header a.sing-in,
a.btn-blue{
    color:#FFF;
    border:2px solid #429DE3;
    background:#429DE3;
    border-radius:4px;
    text-transform:uppercase
}
header a.sing-in:hover,
a.btn-blue:hover{
    color:#429DE3;
    border:2px solid #429DE3;
    background:transparent;
}
a.call span{
    display: block;
    font-size: 10px;
    word-spacing: .1rem;
}
header nav p,
header nav a{
    color:#EBEBEB;
    text-transform:uppercase
}
header h1{
    color:#FFF;
    font-size:3rem;
    font-weight:900;
    word-spacing:.75rem;
    text-transform:uppercase
}
header p{
    color:#B9BBBD;
    margin-bottom:.1rem
}
header .navbar-nav a{
    line-height: 1.65;
}
#menu{
    z-index:100
}
#welcome .bg-bl{
    background:#002744 url("../img/pattern.png") repeat;
    border-radius:5px
}
#welcome h2,
#welcome .benefits p.digit{
    color:#FFF;
    font-size:1.85rem;
    font-weight:600;
    text-transform:uppercase
}
#welcome .benefits p.digit{
    font-size:2.6rem;
    margin-bottom:.1rem
}
#welcome p:not(.pre){
    color:#C7CACC
}
#welcome .benefits p{
    font-weight:600;
    text-transform:uppercase
}
#welcome .bg-red{
    background:#BB2329;
    border-radius:5px
}
#welcome .bg-red p{
    color:#DFAAAB
}
#welcome .bg-blue{
    background:#429DE3;
    border-radius:5px
}
#welcome .bg-blue p{
    color:#B1D2F1
}
#welcome .bg-darkblue{
    background:#001D33;
    border-radius:5px
}
#wheel{
    position:relative;
    background:#FFF
}
#sponsors .moving-mice-holder{
    position:absolute;
    left:0;
    right:0;
    top:-15%;
    margin:0 auto;
    background:#F1F5F7;
    border-radius:50%;
    width:100px;
    height:100px;
    z-index:0
}
#sponsors .moving-mice-holder .mice {
  width:22px;
  height:34px;
  position:relative;
  right:0;
  left:0;
  top:7px;
  margin:0 auto;
  border-radius: 22px;
  border:2px solid #429DE3;
}

#sponsors .moving-mice-holder .mice-button {
  background-color: #429DE3;
  width: 3px;
  height: 8px;
  border-radius: 2px;
  position: absolute;
  top: 6px;
  left: 50%;
  margin: 0 0 0 -2px;
  animation: mice-scroll 1.4s infinite alternate;
}
@keyframes mice-scroll {
  to {
    transform: translate(0, 14px) scale(1, 0.5);
  }
}
#wheel .wheel{
    background:url("../img/house.png") 50% 43% no-repeat;
}
#wheel .wheel:lang(es){
    background:url("../img/house-es.png") 50% 43% no-repeat;
}
#wheel .wheel img{
    animation: rotation 5s linear 1s infinite;
}
#wheel h3{
    font-size:1.2rem;
    font-weight:700;
    text-transform:uppercase;
    margin-bottom:.15rem
}
#sponsors{
    position: relative
}
#sponsors picture,
#sponsors picture img{
    opacity:.65
}
#sponsors picture:hover,
#sponsors picture:hover img{
    cursor:pointer;
    opacity:1
}
#sponsors,
#community{
    background:#F1F5F7
}
#community h2{
    color:#429DE3
}
#community picture,
#community picture img{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter: gray;
	-webkit-filter: grayscale(1);
    opacity:.75;
    -webkit-transition: all .25s linear;
    -moz-transition:    all .25s linear;
    -o-transition:      all .25s linear;
    transition:         all .25s linear
}
#community picture:hover,
#community picture:hover img{
    cursor:pointer;
    filter: none;
    -webkit-filter: grayscale(0);
    opacity:1
}
#community .owl-carousel .owl-stage {
  display: flex;
  align-items: center;
}
#community .owl-carousel .owl-stage img{
    margin:0 auto;
    width:auto
}
#teachers figure h3,
#teachers figure figcaption{
    position:absolute;
    left:0;
    right:0
}
#teachers figure h3{
    bottom:70px;
    font-size:1.4rem;
    text-transform:uppercase
}
#teachers figure h3 span,
#teachers figure h3 a{
    color:#FFF
}
#teachers figure h3 a:hover{
    color:#429DE3;
    text-decoration:none
}
#teachers figure figcaption{
    color:#FFF;
    font-weight:500;
    bottom:40px
}
#video{
    background-size: cover;
    background-position: 0 30%;
    background-repeat: no-repeat;
    background-image:url("../img/video-bg.jpg");
    box-shadow:inset 0 0 0 1000px rgb(0 39 68 / 65%);
    height:80vh
}
#video a svg{
    color:#FFF;
    height:96px !important;
    width:96px !important;
    border-radius:50%;
    -webkit-transition: all .25s linear;
    -moz-transition:    all .25s linear;
    -o-transition:      all .25s linear;
    transition:         all .25s linear;
    animation: play 5s linear 5s infinite;
}
#video a:hover svg{
    color:#429DE3;
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:   paused;
    -o-animation-play-state:     paused;
    animation-play-state:        paused
}
#testimonials svg{
    color:#429DE3;
    height:36px;
    width:36px
}
#testimonials .testimonial{
    background:aliceblue url("../img/pattern-alpha.png") repeat;
    border-radius:5px;
    margin-bottom:75px
}
#testimonials .testimonial h3{
    color:#429DE3;
    font-size:1rem;
    font-weight:600;
    text-transform:uppercase
}
#testimonials .testimonial p.company-name{
    font-weight:600
}
#testimonials .testimonial img{
    border-radius: 50%;
    position:absolute;
    left:0;
    right:0;
    top:-60px;
    margin:0 auto;
    width:auto
}
#testimonials .owl-carousel .owl-item{
    padding-top:60px
}
#pricing-area{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image:url("../img/bg-dark.jpg")
}
#pricing-area h2,
#pricing-area h2 + p,
#pricing-area p.markup{
    color:#FFF
}
#pricing-area h3{
    color:#429DE3;
    font-size:1rem;
    font-weight:600;
    text-transform:uppercase
}
#pricing-area thead h3 + p{
    font-size:2.4rem
}
#pricing-area thead .sign{
    color:#BCBCBC;
    font-size:1rem;
    vertical-align:text-top
}
#pricing-area thead .sub{
    color:#BCBCBC;
    font-size:1rem
}
#pricing-area thead .pricing-action{
    color:#FFF;
    border:2px solid #BB2329;
    border-radius:10px;
    background:#BB2329;
    font-weight:400;
    text-transform:uppercase;
    white-space:nowrap
}
#pricing-area thead .pricing-action:hover{
    color:#BB2329;
    background: #FFF;
    text-decoration:none
}
#pricing-area p.markup{
    font-style:italic;
    font-weight:600
}
#pricing-area .table-responsive{
    background:#FFF;
    border: 1px solid #fff;
    border-radius:5px
}
#pricing-area #pricing-table{
    margin-bottom:0
}
#pricing-area #pricing-table tbody tr:nth-of-type(2n+1){
    background:rgba(239, 243, 245, .75)
}
#pricing-area #pricing-table thead th,
#pricing-area #pricing-table td{
    text-align:center;
    vertical-align:middle
}
/*
#pricing-area #pricing-table th:first-child{
    background:rgba(239, 243, 246, .75);
    padding: 10px 25px
}
#pricing-area #pricing-table thead th:first-child{
    background-color: #18374d;
    color:#fff
}
#pricing-area #pricing-table thead th:first-child p{
    text-align:left;
    text-transform:uppercase
}
#pricing-area #pricing-table thead th:first-child li {
    text-align:left;
    font-weight: 400;
}
#pricing-area #pricing-table thead th:nth-child(4),
#pricing-area #pricing-table td:nth-child(4){
    opacity: .25;
}
*/
#pricing-area #mobile-price .description p,
#pricing-area #pricing-table tbody th p{
    font-size:1rem;
    font-weight:600;
    text-transform:uppercase
}
#pricing-area #pricing-table tbody th li{
    font-weight:400
}
#pricing-area #mobile-price svg,
#pricing-area #pricing-table svg{
    height:1.2rem;
    width:1.2rem
}
#pricing-area #mobile-price svg{
    vertical-align: text-top;
}
#pricing-area #mobile-price svg.fa-check-circle,
#pricing-area #pricing-table svg.fa-check-circle{
    color:#00A108
}
#pricing-area #mobile-price svg.fa-times-circle,
#pricing-area #pricing-table svg.fa-times-circle{
    color:#CECECE
}
#pricing-area #en-mobile-price,
#pricing-area #es-mobile-price{
    background:#FFF;
    border-radius:5px
}
#pricing-area #mobile-price .head,
#pricing-area #mobile-price .col-4,
#pricing-area #mobile-price .col-6{
    border-right: 1px solid #CECECE;
    padding: 15px;
    text-align: center;
}
#pricing-area #mobile-price .head:last-child{
    border-right: none
}
#pricing-area #mobile-price .description{
    border-top: 1px solid #CECECE;
    border-bottom: 1px solid #CECECE;
    text-align: center;
    padding: 1.5rem .5rem .5rem;
}

#pricing-area #mobile-price .head h3{
    font-size: 1.3rem;
}
#pricing-area #mobile-price .head h3 + p + p,
#pricing-area #mobile-price .head h3 + p{
    font-weight: 600
}
#pricing-area #mobile-price .head h3 + p{
    font-size: 1.6rem;
}
#pricing-area #mobile-price .head h3 + p .sign{
    color: #BCBCBC;
    font-size: .8rem;
    vertical-align: text-top
}
#pricing-area #mobile-price .pricing-action{
    display: block;
    text-align: center;
    color:#FFF;
    border:2px solid #BB2329;
    border-radius:4px;
    background:#BB2329;
    font-weight:400;
    text-transform:uppercase;
    white-space:nowrap
}
#pricing-area #mobile-price .pricing-action:hover{
    color:#BB2329;
    background: #FFF;
    text-decoration:none
}
#package .price{
    font-size: 2.6rem;
    font-weight: 600
}
#package .price .sign{
    color: #BCBCBC;
    font-size: 1.5rem;
    vertical-align: text-top
}
#package a.btn{
    padding: .5rem 2rem
}
#package ul{
    margin: 0
}
#package li.item{
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    padding: 23.5px 40px 23.5px 70px
}
@media (min-width:576px) and (max-width: 991.98px){
    header .container .row-menu,
    header .container nav{
        width: 100vw;
        margin-left: calc(50% - 50vw + 5px)
    }
    header nav #logo img{
        width:140px
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    #package li.item{
        font-size: .8rem;
        padding: 8px 16px 8px 20px
    }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    #package li.item{
        padding: 15px 30px 15px 40px
    }
}
#package li.item:nth-of-type(2n+1){
    background:rgba(239, 243, 245, .75)
}
#package li.item svg.fa-check-circle{
    color:#00A108;
    margin-right: 25px;
    height: 1.2rem;
    width: 1.2rem
}
.accordion{
    background:aliceblue url("../img/pattern-alpha.png") repeat;
    border-radius:5px 0 0 5px;
}
#accordion .item{
    background: #fff;
    border-radius: 5px
}
#accordion .item .btn{
    color:#000;
    font-size:1rem;
    font-weight:600;
    text-align: left
}
#gallery picture:hover{
    cursor:pointer;
    opacity:.65
}
#events{
    background:linear-gradient(90deg, white 40%, transparent 40%) right top, aliceblue url("../img/pattern-alpha.png") repeat
}
#events .event{
    background:#FFF;
    border-radius:5px;
}
#events .event p{
    margin-bottom:0
}
#events .event .col-3,
#events .event .col-md-2{
    background:#429DE3;
    border-radius:5px
}
#events .event .month{
    color:#B1D2F1
}
#events .event .date{
    color:#FFF;
    font-weight:600;
    font-size:3rem;
    line-height:1
}
#events .event .status{
    color:#0E9200;
    border:2px solid #0E9200;
    border-radius:4px;
    font-size:.65rem;
    font-weight:600;
    text-transform:uppercase;
    padding:1px 10px
}
#events .event .city{
    color:#002744;
    font-weight:600;
    font-size:1.2rem
}
#events .event .location{
    color:#3A5B73;
    text-transform:uppercase
          
}
footer .footer{
    color:#D5DADE;
    background:#002B4C
}
.teacher a svg,
footer .footer a svg{
    color:#FFF;
    background:#021D3A;
    border-radius:50%;
    padding:10px;
    height:42px;
    width:42px !important;
    -webkit-transition: all .25s linear;
    -moz-transition:    all .25s linear;
    -o-transition:      all .25s linear;
    transition:         all .25s linear
}
footer .footer a:hover svg{
    color:#429DE3
}
footer .footer ul{
    list-style:none
}
footer .footer ul li a{
    color:#D5DADE
}
footer .footer ul li a:hover{
    color:#388BCB
}
footer .footer .title p{
    color:#FFF;
    font-size:1rem;
    font-weight:600
}
footer .footer .date{
    color:#419CE2
}
footer .footer svg{
    color:#429DE3;
    height:16px;
    width:16px !important;
    margin-right:10px
}
footer .copyright{
    color:#C2C9CF;
    background:#001D33
}
.teacher{
    display:none;
    background:linear-gradient(90deg, white 37%, transparent 37%) right top, aliceblue url("../img/pattern-alpha.png") repeat
}
.teacher a svg.fa-facebook-f{
    background:#4267B2
}
.teacher a svg.fa-instagram{
    background:#833AB4
}
.teacher a svg.fa-twitter{
    background:#1DA1F2
}
.teacher a svg.fa-linkedin-in{
    background:#2867B2
}
.teacher a svg.fa-youtube{
    background:#FF0000
}
.teacher a:hover svg{
    opacity:.5
}
.teacher .info{
    background:#FFF;
    border-radius:5px
}
.teacher .info ul {
    list-style: none
}
.teacher .info ul li::before {
    content: "\2022";
    color: #429DE3;
    font-weight: 600;
    display: inline-block; 
    width: 1em;
    margin-left: -1em
}
.teacher .info ul li{
    font-weight:600;
    text-transform:uppercase
}
#call{
    display:none
}
@keyframes rotation {
  0% {
    transform: rotate(0deg)
  }
  5% {
    transform: rotate(90deg)
  }
  20% {
    transform: rotate(270deg)
  }
  30%, to {
    transform: rotate(360deg)
  }
}
@keyframes play {
	 0% {box-shadow: 0 0 8px 6px rgba(66, 157, 227, 0), 0 0 0px 0px rgba(0,0,0,0), 0 0 0px 0px rgba(66, 157, 227, 0)}
	 5% {transform: scale(1.25);}
	 7% {transform: scale(1);}
	 10% {box-shadow: 0 0 8px 6px rgba(66, 157, 227, .65), 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px rgba(66, 157, 227, .3);}
	 15% {box-shadow: 0 0 8px 6px rgba(66, 157, 227, .25), 0 0 0px 20px rgba(0,0,0,0), 0 0 0px 20px rgba(66, 157, 227, .15);}
	 20% {box-shadow: 0 0 8px 6px rgba(66, 157, 227, .1), 0 0 0px 30px rgba(0,0,0,0), 0 0 0px 40px rgba(66, 157, 227, .05);}
	 25%, to {box-shadow: 0 0 8px 6px rgba(66, 157, 227, .05), 0 0 0px 40px rgba(0,0,0,0), 0 0 0px 60px rgba(66, 157, 227, 0);}
}
@media all and (max-width:576px){
    header nav #logo img{
        width:100px
    }
    header #menu ul{
        background: rgba(0, 0, 0, .45)
    }
    #wheel .wheel{
        background:url("../img/house.png") 50% 50% no-repeat
    }
    #pricing-area{
        background:#1C3B4F url("../img/pattern-alpha.png")
    }
    #pricing-area #mobile-price .head{
        padding: 7px
    }
    #pricing-area #mobile-price .head h3{
        font-size: .6rem;
    }
    #pricing-area #mobile-price .head h3 + p{
        font-size: 1rem;
    }
    #pricing-area #mobile-price .pricing-action {
        padding: .3rem .5rem !important;
    }
    #pricing-area #mobile-price .trial-action{
        font-size: .75rem;
        padding: .3rem !important
    }
    #video{
        background-position: 65% 30%
    }
}
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) and (max-width:576px){
    #sponsors .moving-mice-holder{ 
        top:-15%
    } 
}
@media screen and (min-height:520px) and (max-height: 580px){
    header .embed-responsive{
        top:30px
    }
}
