/* #Table of Contents

1.  Site Styles
2.  Header
3.  Navigation
4.  About
5.  Services
6.  Portfolio
7.  Pricing
8.  Blog
9.  Contact
10.  Footer
11. Media Queries
================================================== */


/* ========================= Site Styles ========================= */

body{
    padding:0px!important;
	font-family: 'Roboto Slab', serif;
}

::selection {
	background: #5c6062; /* Safari */
	color: #fff;
}


h1{
	
    color:#fff;
}


h2,h3,h4,h5,h6{
	
    color:#252839;
}

/* Links */

a{
    color:#000;
	text-decoration:none;
}

a:hover,
a:active,
a:focus{
    outline:0;
	text-decoration:none;
}

/* Site Elements */

.btn {
	padding: 5px 10px;
	background: #333;
	border: none;
	border-radius: 0;
	color: #FFF;
	transition: all linear 0.25s;
	-ms-transition: all linear 0.25s;
	-moz-transition: all linear 0.25s;
	-webkit-transition: all linear 0.25s;
	-o-transition: all linear 0.25s;
}
.btn:hover, .btn:focus, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
	color: #FFF;
	background:#f44a56;
	transition: all linear 0.25s;
	-ms-transition: all linear 0.25s;
	-moz-transition: all linear 0.25s;
	-webkit-transition: all linear 0.25s;
	-o-transition: all linear 0.25s;
}
.btn-large {
	padding: 10px 20px;
}
.btn-small {
	padding: 0px 10px;
}
.btn-mini {
	padding: 0px 5px;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
	background: #333 !important;
}

.page{
    text-align:center;
}

iframe{
    border:0;
}

hr{
    border-top-color:#a3a3a3;
}

.full-width{
    width:100%;
}

.wow{
	visibility:hidden;
}

.text-lines{

	font-size:20px;
	line-height: 1.3;
	letter-spacing:1px;
	margin-top:30px;
	margin-bottom:40px;
	font-weight: 300;
}

.title{
    text-align:center;

	font-size:60px;
	font-weight:600;
	line-height:1.2;
	margin-top:100px;
	margin-bottom:20px;
	color:#fff;
}

.color-1{
    background:#f44a56;
    padding:0 10px;
}

.scale-img{
    width:100%;
	height:auto;
}

.color-2{
    color:#f44a56;
}

/* ========================================================
   Header
======================================================== */

#header{
    position: fixed;
    top: 0;
    left: 0;
    display: inline-block;
    width: 100%;
    z-index: 1;
}

#home{
  width: 100%;
  display: table;
  margin: 0;
  max-width: none;
  height: 100vh;
  padding:0px 0px 0px 0px;

}


.welcome-note{
	font-family: 'Oswald', sans-serif;
	font-size: 55px;
	background:none;
	letter-spacing:1px;
	line-height:1.7;
	text-align:center;
	margin:50px 0px 130px 0px;
	text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
	padding-top:100px;
	color:#fff;
}


.welcome-note-mobile{
	font-family: 'Oswald', sans-serif;
	font-size: 16px;
	background:none;
	letter-spacing:1px;
	line-height:1.7;
	text-align:center;
	margin:50px 0px 130px 0px;
	text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
	padding-top:100px;
	color:#fff;
}


.welcome-note p{
    font-size:25px; 
	font-family: 'Raleway', sans-serif;
}	
.welcome-note-mobile p{
    font-size:16px; 
	font-family: 'Raleway', sans-serif;
}


/* ========================================================
   Navigation
======================================================== */
.navbar{
    width:100%;
	margin-bottom:0px! important;
	background:#1f2329;
	background-color: rgba(0, 0, 0, 0.6);
	border:0;
	-webkit-border-radius: 0px;
        -moz-border-radius: 0px;
            border-radius: 0px;
	z-index:8000;
}

.navbar img {
        
    display: inline-block;
    margin: auto;
    height: 300%;
        
}

.navbar-brand{
	font-size:50px;
    text-align:left;
	margin-top:5px;
}


.navbar-lang{
	font-size:50px;
    text-align:right;
	margin-top:10px;
}

.navbar-brand{
    color:white;
}
.nav .active a{
    background:none;
}

.nav li {
    font-size:16px;
	font-weight:200;
	letter-spacing:3px;
}
.nav li a{
    color:#fff;
	padding-top:35px;
	padding-bottom:40px;
	margin-right:5px;
}





.brand-text{
    color:#fff;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #ffffff;
  text-decoration: none;
  background-color: #f44a56;
  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#bf6f9a), to(#964b73));
  background-image: -webkit-linear-gradient(top, #bf6f9a, 0%, #964b73, 100%);
  background-image: -moz-linear-gradient(top, #bf6f9a 0%, #964b73 100%);
  background-image: linear-gradient(to bottom, #bf6f9a 0%, #964b73 100%);
  background-repeat: repeat-x;
}

.dropdown-menu{
   margin-left:-40px;
}


.responsive {
    padding: 0 6px;
    float: left;
    width: 24.99999%;
}


@media only screen and (max-width: 700px){
    .responsive {
        width: 49.99999%;
        margin: 6px 0;
    }
}

@media only screen and (max-width: 500px){
    .responsive {
        width: 100%;
    }
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}


.menu-phone-view .menu-phone-view__menu-bar {
    background: #fff;
    box-shadow: 0 0 2px rgba(0,0,0,.5);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 500;
    
}

.menu-phone-view .menu-phone-view__menu-bar-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    width: 15px;
    margin-top: -9px;
}


.menu-phone-view .menu-phone-view__menu-item .menu-phone-view__menu-item-link {
    display: block;
    font-size: 18px;
    padding: 15px;
    text-transform: uppercase;
    border-bottom: 1px solid transparent;
    border-left: 3px solid transparent;
    text-decoration: none;
}


#hero{
	width:100%;
	background-color: rgba(0, 0, 0, 0.6);
	text-align:left;
	color:#fff;
	padding-top:10px;
	padding-bottom:25px;
	position: absolute;
	bottom: 0;
}

#hero p{
	font-size:17px;
}

#hero .buttons{
	list-style:none;
	font-family: 'Oswald', sans-serif;
	padding-top:60px;
	float:right;
}

#hero .buttons li{
	float:left;
	padding-left:10px;
	font-size:25px;
}

.buttons .hero-btn-1{

	background:#f44a56;
	color:#fff;
	padding:14px 16px 14px 16px;
	transition:.5s;
}

.buttons .hero-btn-1:hover{
	background:#191919;
	transition:.5s;
}


#hero_mobile{
	width:100%;
	background-color: rgba(0, 0, 0, 0);
	text-align:left;
	padding-top:10px;
	padding-bottom:20px;
	position: absolute;
	bottom: 0;
}

#hero_mobile p{
	font-size:17px;
}

#hero_mobile .buttons{
	list-style:none;
	font-family: 'Oswald', sans-serif;
	padding-top:60px;
	float:right;
}

#hero_mobile .buttons li{
	float:left;
	padding-left:10px;
	font-size:25px;
}

.hero_mobile .hero-btn-1{

	background:#f44a56;
	color:#fff;
	padding:14px 16px 14px 16px;
	transition:.5s;
}

.hero_mobile .hero-btn-1:hover{
	background:#191919;
	transition:.5s;
}




/* ========================================================
   About
======================================================== */

#about{
    background: #eae5e5;
	padding-bottom:60px;
	text-align:justify;
}




#parallax-1{
    padding-top:80px;

}

.parallax-text{
	font-family: 'Oswald', sans-serif;
	font-size:45px;
	font-weight:600;
	line-height:2;
	color:#fff;
	padding-top:60px;
	padding-bottom:120px;
	text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.90);
	margin-left:200px;
	padding-left:100px;
	text-align:center;
}

/* ========================================================
   Services
======================================================== */

#services{
    background:#eae5e5;
	padding-bottom:40px;
	
}

.circle{
    background: #424242;
    display: inline-block;
    height: 200px;
    position: relative;
    width: 200px;
    margin-top:40px;
	-webkit-border-radius: 999px;
	-moz-border-radius: 999px;
	border-radius: 999px;
	-webkit-transition-duration: 1.5s;
    -moz-transition-duration: 1.5s;
    -o-transition-duration: 1.5s;
    transition-duration: 1.5s;
}

.circle:hover {
    -webkit-transform: rotate(-360deg);
    -moz-transform:    rotate(-360deg);
    -ms-transform:     rotate(-360deg);
    -o-transform:      rotate(-360deg);
    transform :        rotate(-360deg);
}


.icon{
   margin-top:35px;
   background:#eae5e5;
}

.services-area h2{
    color:#1f2329;
	font-family: 'Lato', sans-serif;
}

.services-area p{
font-size: 15px;
	text-align:justify;
	font-weight: 200;
	line-height:1.6;
	margin-top:20px;
	margin-bottom:20px;
}


#video{
    background: url(../images/bg-3.jpg) fixed;
}

#video h2{
    font-family: 'Lato', sans-serif;
	margin-top:80px;
}

.vendor{
    margin-top:40px;
	margin-bottom:40px;
	display:block;




}

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.5%;
}
.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}
                                               
					

/*  GRID OF TWO  */
.span_2_of_2 {
	width: 100%;
}
.span_1_of_2 {
	width: 49.25%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 480px) {
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%;
	}
}


.smallvideo{
    margin-top:20px;
	margin-bottom:20;
}


/* ========================================================
   Portfolio
======================================================== */

#portfolio .cbp-l-filters-alignRight {
    margin: 0 auto 50px;
    text-align: center;
}

#portfolio .cbp-caption-defaultWrap img{
	width:100%;
}
/* ========================================================
   teachers
======================================================== */

#teachers{
	padding-bottom:60px;
	text-align:justify;

}

#teachers .cbp-l-filters-alignRight {
    margin: 0 auto 50px;

}

#teachers .cbp-caption-defaultWrap img{
	width:100%;
}




/* ==================================================
	Our Clients
================================================== */
#parallax-2{
    padding-top:80px;
    background: url(../images/bg-3.jpg) fixed;
}

.client-text{
	margin-bottom:40px;
}

.clients{
    margin-top:20px;
    margin-bottom:80px;
}

.clients img{
    opacity:0.6;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.clients img:hover{
    opacity:1;
}

/* ==================================================
	Pricing
================================================== */
#pricing{
    background: url(../images/patterns/triangular.png) 0 0 repeat fixed;
}

.pricing-offer{
	background: #fcfcfc;
	text-align: center;
	padding:40px 0 40px 0;
	font-size:18px;
	border-top:1px solid #e6e6e6;
	border-bottom:1px solid #e6e6e6;
}

.pricing-box.special .pricing-offer{
	color:#fff;
}

.pricing-offer strong{
	font-size:78px;
	line-height:89px;
}

.pricing-offer sup{
	font-size:28px;
}

.pricing-content{
	background: #fff;
	text-align:center;
	font-size:16px;
}

.pricing-content strong{
color:#353535;
}

.pricing-content ul{
	list-style:none;
	padding:0;
	margin:0;
}

.pricing-content ul li{
	border-bottom:1px solid #e9e9e9;
	list-style:none;
	padding:15px 0 15px 0;
	margin:0 0 0 0;
}

.pricing-content ul li i{
    background:#fff;
}

.pricing-content ul img{
    height:20px;
	width:20px;
}

.pricing-action{
	margin:0;
	background: #fcfcfc;
	text-align:center;
	padding:20px 0 30px 0;
}

.pricing-wrapp{
	margin:0 auto;
	width:100%;
	background:#fd0000;
}

/* --- pricing box alt --- */
.pricing-box-alt {
border: 1px solid #e6e6e6;
	background:#fcfcfc;
	position:relative;
	margin-bottom:60px;
	margin-top:40px;
	padding:0;
    -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.03);
    -moz-box-shadow: 0 2px 0 rgba(0,0,0,0.03);
    box-shadow: 0 2px 0 rgba(0,0,0,0.03);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.pricing-box-alt .pricing-heading {
	background: #fcfcfc;
	text-align: center;
	padding:40px 0 0px 0;
	display:block;
}
.pricing-box-alt.special .pricing-heading {
	background: #fff;
	text-align: center;
	padding:40px 0 1px 0;
	border-bottom:none;
	display:block;
	color:#fff;
}
.pricing-box-alt.special .pricing-heading h3 {
	color:#000;
}

.pricing-box-alt .pricing-heading h3 strong {
	font-size:32px;
	font-weight:700;
	letter-spacing:-1px;
}
.pricing-box-alt .pricing-heading h3 {
	font-size:32px;
	font-weight:300;
	letter-spacing:-1px;
	color:#000;
}

.pricing-box-alt .pricing-terms {
	text-align: center;
	background:#f44a56;
	display:block;
	overflow:hidden;
	padding:30px 0 20px;
}

.pricing-box-alt .pricing-terms  h6 {
	margin-top:10px;
	color:#fff;
	font-size:18px;
}

.pricing-box-alt .icon .price-circled {
    margin: 10px 10px 10px 0;
    display: inline-block !important;
    text-align: center !important;
    color: #fff;
    width: 68px;
    height: 68px;
	padding:12px;
    font-size: 16px;
	font-weight:700;
    line-height: 68px;
    text-shadow:none;
    cursor: pointer;
    background-color: #888;
    border-radius: 64px;
    -moz-border-radius: 64px;
    -webkit-border-radius: 64px;
}

.pricing-box-alt  .pricing-action{
	margin:0;
	text-align:center;
	padding:30px 0 30px 0;
}

/* ==================================================
   Blog
================================================== */

#blog{
    background:#eae5e5;
	width: 100%;
	padding:0px 0px 0px 0px;
}





@media screen and (min-width: 641px){


  .blog__title{
    font-size: 4.8rem;
  }



}


@media screen and (max-width: 640px){

  .blog__title{
    font-size: 3.3rem;
  }




}



@media screen and (min-width: 1201px){




  .blog-posts{
  
  
	  margin-top:40px;
	  margin-bottom:40px;
	  text-align:left;
  }

  .media{
    padding-bottom:20px;
}

}


@media screen and (max-width: 1200px){




  .blog-posts{

    margin-top:40px;
    margin-bottom:40px;
    text-align:left;
}

   .media{
    margin: auto;
	padding: 5%;
    padding-bottom:20px;
}

}



.blog-posts h3, h5{
    color:#55606A;
}

.blog-posts p{
    margin-top:20px;
}

.blog-icons img{
    height:22px;
	width:22px;
}



.categories ul {
    list-style:none;
}

.categories ul li{
    margin-bottom:20px;
}

.recent-posts ul{
    list-style:none;
}

.recent-posts ul li{
    margin-bottom:20px;
}

.recent-posts .media img{
    height:60px;
	width:70px;
}

.recent-posts p{
    margin-top:3px;
	font-size:12px;
}

.color-8{
	color:#55606A;
}

.previous-1{
	float:left;
}

.space-bottom{
	 padding-bottom: 40px;
}
/* ==================================================
   Contact Section
================================================== */

#contact{
    background: url(../images/patterns/geometry.png) 0 0 repeat fixed;
    color: #55606A;
    text-align: center;
}

.contact-details{
    margin-top:30px;
}

.contact-details h3 {
	color: #55606A;
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 5px;
	line-height: 1em;
    text-transform: uppercase;
}

.contact-details ul {
	margin: 0;
	padding: 0;
	list-style: none;	
}

.contact-details ul li {
    margin-top:10px;
}
.contact-details img{
    width:20px;
	height:20px;
}


#contact-form {
	margin-bottom: 30px;
    margin-top:60px	
}

#contact-form p {
	margin-bottom: 1px;	
}

#contact-form input,
#contact-form textarea {
    border: 1px solid #d0d6da;
	background-color: #FFFFFF;
    color: #55606A;
    font-size: 16px;
    height: auto;
    padding: 15px;
	margin-bottom: 5px;
    resize: none;
}

#contact-form input {
    width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contact-form textarea {
    width: 100%;
	resize: vertical;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contact-form .submit {
    background: #E0E0E0;
    color: #55606A;
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    padding: 16px 40px;
    text-align: center;
    vertical-align: middle;
    width: auto;
	margin-top: 30px;
	
	-webkit-transition: background 0.1s linear 0s, color 0.1s linear 0s;	
	   -moz-transition: background 0.1s linear 0s, color 0.1s linear 0s;
		 -o-transition: background 0.1s linear 0s, color 0.1s linear 0s;
		    transition: background 0.1s linear 0s, color 0.1s linear 0s;
}

#contact-form .submit:hover {
    background: #f44a56;
	color: #FFFFFF;
	text-decoration:none;
}


#map{
	display: block;
	height: 315px;
	width: 100%;
	min-width: 100%;
	max-width:1350px;
	margin-left:auto;
	margin-right:auto;
	border:2px solid #f44a56;
}

/* ==================================================
   Footer
================================================== */

#footer{
    text-align: center;
	padding-bottom: 30px;
    background: url(../images/patterns/triangular.png) 0 0 repeat fixed;
    color: #fff;
}


.social-icons-footer{
   margin-right:0px;
   padding-top:20px;
   text-align:center;
}

.social-icons-footer ul{
    margin-right:20px;
}

.social-icons-footer ul li{
    display: inline-block;
	margin-left: 30px;
	cursor: pointer;
}

.social-icons-footer ul li a {
	display: block;
	
	-webkit-transition: all 800ms ease-out 0s;	
	   -moz-transition: all 800ms ease-out 0s;
		 -o-transition: all 800ms ease-out 0s;
		    transition: all 800ms ease-out 0s;
	
	-webkit-transform: rotateY(0deg);
	   -moz-transform: rotateY(0deg);
		-ms-transform: rotateY(0deg);
		 -o-transform: rotateY(0deg);
			transform: rotateY(0deg);
}

.social-icons-footer ul li a i {
	display: inline-block;
	margin: 0;
	color: #fff;
	line-height: 70px;
	opacity: 0.9;
	
	-webkit-transition: all 800ms ease-out 0s;	
	   -moz-transition: all 800ms ease-out 0s;
		 -o-transition: all 800ms ease-out 0s;
		    transition: all 800ms ease-out 0s;
		  
	-webkit-transform: rotateY(0deg);
	   -moz-transform: rotateY(0deg);
		-ms-transform: rotateY(0deg);
		 -o-transform: rotateY(0deg);
			transform: rotateY(0deg);
}

.social-icons-footer ul li:hover a,
.social-icons-footer ul li.active a {	
	
	-webkit-transform: rotateY(360deg);
	   -moz-transform: rotateY(360deg);
		-ms-transform: rotateY(360deg);
		 -o-transform: rotateY(360deg);
		    transform: rotateY(360deg);
}

.social-icons-footer ul li:hover a i,
.social-icons-footer ul li.active a i {
	color: #FFFFFF;
	opacity: 1;
	
	-webkit-transform: rotateY(180deg);
	   -moz-transform: rotateY(180deg);
		-ms-transform: rotateY(180deg);
		 -o-transform: rotateY(180deg);
			transform: rotateY(180deg);
}


/* ==================================================
   Media Queries
================================================== */

/* Large desktop */
@media (min-width: 1200px) {  }
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 

    /* nav */
    .navbar ul {
        display: none;
    }
	
    .btn-group{
	    margin-top:-100px;
	}
	
	.mobile-nav{
	    text-align:center;
	}
	
	
 }
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    .container{
	padding:0px 10px 0px 10px;
	}
	
	.navbar-toggle {
	top:30px;
	}
	.parallax-text{
	    margin-left:100px;
		padding-left:100px;
	}
	
    .option-set {
	    margin-top:15px;
	}
	
	.btn-group{
	    margin-top:-20px;
	}
	
	.mobile-nav{
	    text-align:center;
	}

 }
 
/* Landscape phones and down */
@media (max-width: 480px) { 
   .container{
	padding:0px 10px 0px 10px;
	}
	
	.title{
	font-size:40px;
	margin-top:50px;
	}
	
	#portfolio-items ul{
	padding:0px 10px 0px 10px;
	}
	
	.option-set {
	    margin-top:10px;
	}
	
	.navbar-toggle {
	top:30px;
	}
	
	.parallax-text{
	    margin-left:10px;
		padding-left:0px;
	}
	

	
    .mobile-nav{
	    text-align:center;
	}
	
	.btn-group{
	  margin-top:-20px;
	}
	
	.navbar-brand{
	    margin-top:0px;
	}

}

/*--- Preloader ---*/

#preloader {
	position:fixed;
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	vertical-align: middle;
	background: #fff;
	z-index:999999;
}
.preloader-container {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	z-index: 3;
	text-align:center;
}

@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
.loader {
  position: relative;
  margin: auto;
  width: 350px;
  color: white;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 250%;
  background: linear-gradient(180deg, #222 0, #444 100%);
  box-shadow: inset 0 5px 20px black;
  text-shadow: 5px 5px 5px rgba(0,0,0,0.3);
}

.loader:after {
  content: "";
  display: table;
  clear: both;
}

.loader span {
  float: left;
  height: 100px;
  line-height: 120px;
  width: 50px;
}

.loader > span {
  border-left: 1px solid #444;
  border-right: 1px solid #222;
}

.covers {
  position: absolute;
  height: 100%;
  width: 100%;
}

.covers span {
  background: linear-gradient(180deg, white 0, #ddd 100%);
  animation: up 2s infinite;
  -webkit-animation:up 2s infinite;
  -moz-animation:up 2s infinite;
}

@keyframes up {
  0%   { margin-bottom: 0; }
  16%  { margin-bottom: 100%; height: 20px; }
  50% { margin-bottom: 0; }
  100% { margin-bottom: 0; }
}

@-webkit-keyframes up {
  0%   { margin-bottom: 0; }
  16%  { margin-bottom: 100%; height: 20px; }
  50% { margin-bottom: 0; }
  100% { margin-bottom: 0; }
}

@-moz-keyframes up {
  0%   { margin-bottom: 0; }
  16%  { margin-bottom: 100%; height: 20px; }
  50% { margin-bottom: 0; }
  100% { margin-bottom: 0; }
}

.covers span:nth-child(2) { animation-delay: .142857s; -webkit-animation-delay: .142857s; -moz-animation-delay: .142857s;}
.covers span:nth-child(3) { animation-delay: .285714s; -webkit-animation-delay: .285714s; -moz-animation-delay: .285714s;}
.covers span:nth-child(4) { animation-delay: .428571s; -webkit-animation-delay: .428571s; -moz-animation-delay: .428571s;} 
.covers span:nth-child(5) { animation-delay: .571428s; -webkit-animation-delay: .571428s; -moz-animation-delay: .571428s;}
.covers span:nth-child(6) { animation-delay: .714285s; -webkit-animation-delay: .714285s; -moz-animation-delay: .714285s;}
.covers span:nth-child(7) { animation-delay: .857142s; -webkit-animation-delay: .857142s; -moz-animation-delay: .857142s;}