/* Global */
p, li {
    font-size:15px;
    font-family:"Lato",sans-serif;
    font-weight:normal;
}
p > a {
    color:#fe0002;
    text-decoration:underline;
    font-weight:700;
}
a:hover, a:active {
    text-decoration:none;
}

img {
    max-width:100%;
}
.icon-background {
							color: #fff;
						}
h3.iconyell {
			margin-top: 10px;
			padding-top: 10px;
	color: #212529;
		}
.smallmenu {
	color: 	color: #212529;
}
p.iconyell {
		color: #212529;
}


/*phone number and email at top of screen. breaks into 2 lines on mobile */
@media only screen and (min-width: 768px){
 .top{
    display: none;
  }
}

/*Header*/
#page-header nav.navbar.navbar-expand-lg.navbar-light.bg-light, .navbar {
    background-color: #ff000000!important;
    justify-content:flex-end;

}

#page-header a.nav-link.active, #page-header a.nav-link:hover, #page-header a.nav-link:active {
	color:#feae1d;
}

#page-header a.nav-link{
    color:#000000;
    font-family: "lato",sans-serif;
    font-weight: 700;
}

#page-header .fas{
    color:#feae1d;
    font-size: 22px;
}

#page-header .spangeader{
    color:#000000;
    padding:0px 20px;
}

#page-header .logo1{
    margin-top: 0px;
}
#page-header .li.nav-item {
    margin-right: 12px!important;
}
section#page-header .top-icons {
    text-align: right !important;
	font-size: 10px;
}
.carousel-control-prev, .carousel-control-next {
    display: none;
}

/*Main Header*/

#Afterheader{
	
}
#Afterheader .headertitle{
    color:#ffffff;
    letter-spacing: 10px;
    font-size:45px;
    color: #ffffff;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
}
.headersubtitle{
    color:#feae1d;
}
.headertext{
    color:#ffffff;
    font-size: 24px;
    font-family:"Lato", sans-serif;
    font-weight:700;
    letter-spacing: 5px;
}
.headerposition{
    padding-left: 38px;
}

.carousel-caption {
    left: 0;
    bottom: 25%;
}
.carousel-indicators {
    justify-content:flex-end;
    -ms-flex-pack: flex-end;
    bottom:70px;
}
.carousel-item img {
    max-width:100%;
    width:100%;
}
.carousel-indicators li {
    background-color: #fe0002;
}
.carousel-indicators li.active {
    background-color: #feae1d;
}

/*Yellow Section*/

#yello{
    background-image: url("image/yelloheader.png");
    background-size: cover;
    margin-top:-50px;
}

.yellopos{}

#yello button.btn {
    background-color: white;
    padding: 5px 55px 5px 55px;
	border-radius: 20px;
	font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    position: absolute;
    width: 215px;
    margin: auto;
    display: block;
    left: 22%;
    bottom: -30%;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
}

#yello button.btn:hover {
    background-color:#572e2a;
    color:#FFF;
}
#yello .yellopos h3 {
    text-transform: uppercase;
    font-size: 28px;
    letter-spacing: 6px;
    color: #572e2a;
    font-family: "Anton";
    /* font-weight: 400; */
    text-align: center;
}
.yellopos p {
    color: #533b3b;
    font-size: 18px;
    font-family: "Lato",sans-serif;
    font-weight: 700;
}

/*center Youtube*/
.su-youtube {
  margin: 0 auto;
  display: block;
}

#about, #whyUs, #currentevents, #yourInstructor, #whychoose {
	font-size: 22px;
	width: 95%;
}


/*About Section*/

.aboutimage{
    width:100%;
    max-width: 100%;
    height: 270px;
}

.aboutcol{
    padding:0px;
}

#about h2.aboutheader {
    padding-top:70px;
    padding-bottom:20px;
    letter-spacing: 10px;
    font-size: 45px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:55%;
    max-width:100%;
    margin:auto;
}
#about h2 span {
    color:#feae1d;
}



#about p.abouttitle {
    font-family: "lato",sans-serif;
    font-size: 18px;
    color: #000;
    font-weight:700;
    width:75%;
    max-width:100%;
    margin:auto;
}

#about button.btn {
    background-color: white;
    padding: 5px 55px 5px 55px;
	border-radius: 20px;
	font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    position: absolute;
    width: 215px;
    margin: auto;
    display: block;
    left: 22%;
    bottom: -6%;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    text-transform:uppercase;
}

#about button.btn:hover {
    background-color:#572e2a;
    color:#FFF;
}

#about h2 {
    padding-top:70px;
    padding-bottom:20px;
    letter-spacing: 10px;
    font-size: 45px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:55%;
    max-width:100%;
    margin:auto;
}
#about h2 span {
    color:#feae1d;
}

/*whyUS*/

.whyUsimage{
    width:100%;
    max-width: 100%;
    height: 270px;
}

.whyUscol{
    padding:0px;
}

#whyUs #yourInstructor, #viewVideo h2.whyUsheader {
    padding-top:70px;
    padding-bottom:20px;
    letter-spacing: 10px;
    font-size: 45px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:55%;
    max-width:100%;
    margin:auto;
}
.whyUstext, .yourInstructor {
	font-size: 22px;
	margin: 15px;
}
#yourInstructor, #viewVideo li {
	font-size: 22px;
	margin: 15px;
}
#whyUs h2 span {
    color:#feae1d;
}

#whyUs, #yourInstructor p.whyUstitle {
    font-family: "lato",sans-serif;
    font-size: 18px;
    color: #000;
    font-weight:700;
    width:75%;
    max-width:100%;
    margin:auto;
}



#whyUs button.btn {
    background-color: white;
    padding: 5px 55px 5px 55px;
	border-radius: 20px;
	font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    position: absolute;
    width: 215px;
    margin: auto;
    display: block;
    left: 22%;
    bottom: -6%;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    text-transform:uppercase;
}

#whyUs button.btn:hover {
    background-color:#572e2a;
    color:#FFF;
}

#whyUs h2 {
    padding-top:70px;
    padding-bottom:20px;
    letter-spacing: 10px;
    font-size: 45px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:55%;
    max-width:100%;
    margin:auto;
}
#whyUs h2 span {
    color:#feae1d;
}




/* Why Choose us */

#whychoose h2 {
    padding-top:70px;
    padding-bottom:20px;
    letter-spacing: 10px;
    font-size: 45px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:55%;
    max-width:100%;
    margin:auto;
}
#whychoose h2 span {
    color:#feae1d;
}

#whychoose p.whychoosetitle {
    font-family: "lato",sans-serif;
    font-size: 18px;
    color: #000;
    font-weight:700;
    width:75%;
    max-width:100%;
    margin:auto;
}
#whychoose p {
    margin-bottom:30px;
}
/*Testimonial Section*/
img.quote-img {
    z-index: 11000000000000000000000;
    position: relative;
    left: 45%;
    bottom: -110px;
}

#Testimonial{
    background-image: url("image/testimonial-back.png");
    background-size:cover;
    clip-path: polygon( 0% 13%, /* left top */ 100% 0%, /* right top */ 100% 100%, /* right bottom */ 0 100% /* left bottom */ );
    padding-top:7rem;
}

h3.what-student {
    font-size: 28px;
    letter-spacing: 6px;
    color: #ffffff;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    text-transform: uppercase;
}
p.what-student {
    font-size: 22px;
    color: #FFF;
    font-weight: 700;
}

h4.student-name {
    text-align: left;
    font-size: 16px;
    color: #FFFFFF;
    font-family: "Lato",sans-serif;
    font-weight: 700;
}

p.student-testi {
    text-align: left;
    font-size: 20px;
    color: #FFFFFF;
    font-family: "Lato",sans-serif;
    font-weight: 300;
    letter-spacing: 4px;
}
#Testimonial button.btn {
    background-color: white;
    padding: 5px 55px 5px 55px;
    border-radius: 20px;
    font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    position: absolute;
    width: 215px;
    margin: auto;
    display: block;
    right: 15%;
    bottom: -6%;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    text-transform: uppercase;
}

#Testimonial button.btn:hover {
    background-color:#572e2a;
    color:#FFF;
}
/*JoinUS Section*/

#joinus{
    background-color:#1d1d1d;
    padding-top:50px;
    padding-bottom:30px;
}
#joinus h2 {
    font-size: 28px;
    letter-spacing: 6px;
    color: #ffffff;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    text-transform: uppercase;
    display:inline-block;
}
#joinus h3 {
    background: #c9080a;
    padding: 10px;
    -webkit-transform: skew(-5deg);
    -moz-transform: skew(-5deg);
    -o-transform: skew(-5deg);
    transform: skew(5deg);
    color: #FFF;
    display:inline-block;
    text-transform: uppercase;
    font-weight:700;
}
button.join-us {
    background-color: #ffc81f;
    padding: 5px 55px 5px 55px;
    border-radius: 20px;
    font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    position: absolute;

    margin: auto;
    display: block;
    left: 45%;
    bottom: -50px;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    text-transform: uppercase;
}

button.join-us:hover {
    background-color:#572e2a;
    color:#FFF;
}

/* Current Events Section */
#currentevents {
    padding:100px 0px;
}
#currentevents h2 {
    font-size: 38px;
    letter-spacing: 8px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
}

.event h3 {
    font-size: 28px;
    letter-spacing: 3px;
    color: #572e2a;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    padding: 20px 0px;
    text-transform: uppercase;
}
.event h6 {
    font-size: 15px;
    line-height: 25px;
    color: #000000;
    font-family: "Lato";
    font-weight: 700;
    text-align: center;
}
.event h6 a, #currentevents a {
    color:#fe0002;
    text-decoration:underline;
}
.event p {
    font-size: 16px;
    line-height: 24px;
    color: #000000;
    font-family: "Lato";
    font-weight: 400;
    text-align: center;
}
.event p.cta {
    font-size: 15px;
    letter-spacing: 3px;
    line-height: 35px;
    color: #000000;
    font-family: "Lato";
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}
.event button {
    padding: 5px 25px 5px 25px;
    border-radius: 20px;
    font-family: "Lato",sans-serif;
    color: #572e2a;
    font-weight: 700;
    width: 215px;
    margin: auto;
    display: block;
    text-transform: uppercase;
    box-shadow: 0px 10px 20px rgba(21,18,21,0.2);
    background-color: #feae1d;
}

.event button:hover {
    background-color:#572e2a;
    color:#FFF;
}
.event2 p {
    padding-top: 170px;
}
.event3 p {
    padding-top: 15px;
}
.event-cta p {
    text-transform:uppercase;
    font-weight:700;
}
/*Viewourfeature Section*/

#viewourfeature{
    background-image: url("image/beforefooterback.png");
}
#viewourfeature h2 {
    font-size: 58px;
    letter-spacing: 12px;
    color: #000000;
    font-family: "Anton";
    font-weight: 400;
    text-align: center;
    width:75%;
    margin:auto;
}
#viewourfeature h2 span{
    color:#feae1d;
}

/*Logo Section*/

#logo{
    background-color:#d6d4d4;
    padding: 25px
}

/*After footer 2 Section*/

#footer2{
    background-color:#f7f7f7;
}

.footer2text{
    color:#f7f7f7;
    padding:5px;
    font-size:14px;
}

/*After footer 1 Section*/

#footer1{
    background-color:#ffffff;
    box-shadow: 0px 1px 70px rgba(21,18,21,0.2);
}
.footer1text{
    color:#000000;
    font-size:14px;
    padding:5px;
}
/*Footer Section*/

#footer{
    background-color:#000000;
}

.helplinks {
    font-size: 15px;
    color: #feae1d;
    font-family: "Lato";
    font-weight: 700;
    text-align: center;
    text-transform:uppercase;
    margin-top:10px;
}
.footer-navbar a {
    font-size: 13px;
    color: #ffffff;
    font-family: "Lato";
    font-weight: 300;
    text-align: center;
}
.fb-follow {
    color: #feae1d;
    font-family: "Lato";
    font-weight: 700;
    text-align: center;
    
}
.icon-circle {
    background: #FFF;
    color: #000;
    padding: 10px;
    height: 35px;
    width: 35px;
    border-radius: 50%;
}

/* Responsive */


/* Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
    #page-header .spangeader {
        padding:0px 10px;
    }
    section#page-header .top-icons {
        text-align: right !important;
    }

    .navbar {
        justify-content:flex-end;
    }
    #page-header a.nav-link{
        font-size:14px;
        padding:0px 8px;
    }
    #page-header .logo1 {
        width:40%;
        margin-top:10px;
    }
    .headertext {
        font-size:12px;
    }
    #Afterheader .headertitle {
        font-size:20px;
    }
    .carousel-caption {
        left: 0;
        bottom: 35%;
    }
   
    #yello {
        background-position:right;
    }
    
    #yello button.btn {
        position:relative;
        left:0;
        bottom:0;
    }
    .yellopos {
         padding:10px 0px;   
    }
    #about h2.aboutheader {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 100%;
        max-width: 100%;
    }
    #about button.btn {
        bottom:15%;
        left: 20%;
    }
    #whychoose h2 {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 85%;
        max-width: 100%;
    }
    img.quote-img {
        left: 45%;
        bottom: -20px;
    }
    #Testimonial {
        padding-top: 10rem;
        margin-top: -100px;
        background-position: right;
    }   
    #Testimonial button.btn {
        position:relative;
        left:0;
        bottom:15px;
        margin-top:10px;
    }
    p.student-testi {
        font-size:16px;
        letter-spacing:2px;
    }
    button.join-us {
        position:relative;
        left:0;
    }
    #currentevents h2 {
        font-size:24px;
    }
    .event {
        padding: 20px;
    }
    .event2 p {
        padding-top: 205px;
    }
    .event3 p {
        padding-top: 35px;
    }
    #viewourfeature h2 {
        font-size:24px;
    }
    
    .carousel-control-prev , .carousel-control-next {
        display:none;
    }

}


/* Medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) { 
     #page-header .spangeader {
        padding:0px 10px;
    }
        section#page-header .top-icons {
        text-align: right !important;
    }

    .navbar {
        justify-content:flex-end;
    }
    #page-header a.nav-link{
        font-size:14px;
        padding:0px 8px;
    }
    #page-header .logo1 {
        width:40%;
        margin-top:10px;
    }
    .headertext {
        font-size:12px;
    }
    #Afterheader .headertitle {
        font-size:20px;
    }
    .carousel-caption {
        left: 0;
        bottom: 35%;
    }
   
    #yello {
        background-position:right;
    }
    
    #yello button.btn {
        position:relative;
        left:0;
        bottom:0;
    }
    .yellopos {
         padding:10px 0px;   
    }
    #about h2.aboutheader {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 100%;
        max-width: 100%;
    }
    #about button.btn {
        bottom:15%;
        left: 35%;
    }
    #whychoose h2 {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 85%;
        max-width: 100%;
    }
    img.quote-img {
        left: 40%;
        bottom: -45px;
    }
    #Testimonial {
        padding-top: 10rem;
        margin-top: -100px;
        background-position: right;
    }   
    #Testimonial button.btn {
        position:relative;
        left:0;
        bottom:15px;
        margin-top:10px;
    }
    p.student-testi {
        font-size:16px;
        letter-spacing:2px;
    }
    button.join-us {
        position:relative;
        left:0;
    }
    #currentevents h2 {
        font-size:24px;
    }
    .event {
        padding: 20px;
    }
    .event2 p {
        padding-top: 0px;
    }
    #viewourfeature h2 {
        font-size:24px;
    }
    .carousel-control-prev , .carousel-control-next {
        display:none;
    }

}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) { 
    #page-header .spangeader {
        padding:0px 10px;
    }
    .navbar {
        justify-content:flex-end;
    }
    #page-header a.nav-link{
        font-size:14px;
        padding:0px 8px;
    }
    section#page-header .top-icons {
        text-align: center !important;
    }
    #page-header .logo1 {
        width:40%;
        margin-top:10px;
    }
    .headertext {
        font-size:12px;
    }
    #Afterheader .headertitle {
        font-size:20px;
    }
    .carousel-caption {
        left: 0;
        bottom: -18%;
    }
   
    #yello {
        background-position:right;
    }
    
    #yello button.btn {
        position:relative;
        left:0;
        bottom:0;
    }
    .yellopos {
         padding:10px 0px;   
    }
    #about h2.aboutheader {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 100%;
        max-width: 100%;
    }
    #about button.btn {
        bottom:15%;
    }
    #whychoose h2 {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 85%;
        max-width: 100%;
    }
    img.quote-img {
        left: 33%;
        bottom: -60px;
    }
    #Testimonial {
        padding-top: 10rem;
        margin-top: -100px;
        background-position: right;
    }   
    #Testimonial button.btn {
        position:relative;
        left:0;
        bottom:15px;
        margin-top:10px;
    }
    p.student-testi {
        font-size:16px;
        letter-spacing:2px;
    }
    button.join-us {
        position:relative;
        left:0;
    }
    #currentevents h2 {
        font-size:24px;
    }
    .event {
        padding: 20px;
    }
    .event2 p {
        padding-top: 0px;
    }
    #viewourfeature h2 {
        font-size:24px;
    }
    .carousel-control-prev , .carousel-control-next {
        display:flex;
    }
    .carousel-indicators {
        display:none;
    }
    
}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {

    #page-header .spangeader {
        padding:0px 10px;
    }
    .navbar {
        justify-content:flex-end;
    }
    #page-header a.nav-link{
        font-size:14px;
        padding:0px 8px;
    }
    #page-header .logo1 {
        width:40%;
        margin-top:10px;
    }
    .headertext {
        font-size:12px;
    }
    #Afterheader .headertitle {
        font-size:20px;
    }
    .carousel-caption {
        left: 0;
        bottom: -18%;
    }
    .carousel-indicators {
        display:none;
    }
    .carousel-control-prev , .carousel-control-next {
        display:flex;
    }
    #yello {
        background-position:right;
    }
    
    #yello button.btn {
        position:relative;
        left:0;
        bottom:0;
    }
    .yellopos {
         padding:10px 0px;   
    }
    #about h2.aboutheader {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 100%;
        max-width: 100%;
    }
    #about button.btn {
        bottom:15%;
    }
    #whychoose h2 {
        padding-top: 10px;
        padding-bottom: 20px;
        letter-spacing: 4px;
        font-size: 24px;
        width: 85%;
        max-width: 100%;
    }
    img.quote-img {
        left: 33%;
        bottom: -60px;
    }
    #Testimonial {
        padding-top: 10rem;
        margin-top: -100px;
        background-position: right;
    }   
    #Testimonial button.btn {
        position:relative;
        left:0;
        bottom:15px;
        margin-top:10px;
    }
    p.student-testi {
        font-size:16px;
        letter-spacing:2px;
    }
    button.join-us {
        position:relative;
        left:0;
    }
    #currentevents h2 {
        font-size:24px;
    }
    .event {
        padding: 20px;
    }
    .event2 p {
        padding-top: 0px;
    }
    #viewourfeature h2 {
        font-size:24px;
    }
}
