/**
 * Theme Name: fhsi
 * Theme URI: fhsi
 * Description:fhsi
 * Version: 1.0.0
 * Author: Julian
 * Author URI: fhsi
 * License: GNU General Public License v2.0
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Template: genesis
**/

@font-face { 
font-family: gelion; 
src: url(/wp-content/themes/startergeek/fonts/Gelion/Gelion-Regular.woff2); 
font-style:normal;
	font-weight:400
}

@font-face { 
font-family: gelion; 
src: url(/wp-content/themes/startergeek/fonts/Gelion/Gelion-Bold.woff2); 
font-style:normal;
	font-weight:800
}


@font-face { 
font-family: gelion; 
src: url(/wp-content/themes/startergeek/fonts/Gelion/Gelion-Black.woff2); 
font-style:normal;
	font-weight:900
}


html {-moz-osx-font-smoothing: grayscale;-webkit-font-smoothing: antialiased;}
body {background-color: #fff;color: #414141;font-family: "gelion";font-size: 18px;font-weight: 400;line-height: 1.5;margin: 0;overflow-x: hidden;}
button,input:focus,input[type="button"],input[type="reset"],input[type="submit"],.button,.gallery img {transition: all 0.2s ease-in-out;border: 0;padding: 0.7em;font-size: 1rem;font-family: inherit; }
input[type="submit"],.button{cursor: pointer;}

button, input, select, textarea { font-size: 1rem;font-family: inherit;     line-height: 1.5;width:100%;padding: 5px;border:none;box-sizing:border-box; background: #F3F3F3;}
input{height:41px}
textarea{height:120px}

a {color: #777;text-decoration: underline;	transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;}
a:focus,a:hover {color: #333;text-decoration: none;}
p {	margin: 0 0 20px;	padding: 0;}
ol,ul {	margin: 0;	padding: 0;}
article ol, article ul{padding-left:20px}

li {list-style-type: none;}
article li {padding-left: 10px; list-style:disc}
hr {border: none;	border-collapse: collapse;	border-top: 1px solid #707070;	clear: both;	margin: 30px 0;}
b,strong {font-weight: 700;}
blockquote,cite,em,i {font-style: italic;}
mark {background: #ddd;	color: #333;}
blockquote {margin: 30px;}
h1 {font-family: "gelion";	font-weight:900;	line-height: 1.2;	margin: 0 0 20px;}
h2,h3, h4,h5,h6{font-family: "gelion";	font-weight:900;	line-height: 1.2;	margin: 0 0 20px;}
h1 {font-size: 30px;}
h2 {font-size: 27px;}
h3 {font-size: 24px;}
h4 {font-size: 20px;}
.entry-content h3,.entry-content h4 {font-weight: 600;}
.entry-content h4 {	margin-top: 40px;}
h5 {font-size: 18px;}
h6 {font-size: 16px;}
embed,iframe,img,object,video,.wp-caption {	max-width: 100%;}
img {height: auto;	vertical-align: top;}
figure {margin: 0;}
*, ::before, ::after{-webkit-box-sizing: inherit;-moz-box-sizing: inherit;box-sizing: inherit;}
/*-------- constantes*/
.site-inner{width:100%;margin:0 auto;}



/*------------------------------------------------------------------------------------------------------------------------*/

/*-------- general*/
a {color:#414141;text-decoration:none;font-weight:bold}

.site-container{max-width:100%;box-sizing:border-box}

.telefonotop a{color:#fff}

.telefonotop a:hover{}


.telefonotop .redes{display:flex; justify-content:center;min-height: 60px;}
.telefonotop .redes img{padding:10px;box-sizing:border-box}

.entry-meta{display:none}

#social-container{display:none}
.correo{display:none}
.site-container{margin-top:150px}

/*logo*/
.site-header{background:#fff;position: relative;filter: drop-shadow(3px 0px 10px #000);}
.title-area img{padding:3% 0;max-width:100%;;margin:0 auto;display:block;max-width:60%; position:relative; }
.site-description{display:none}

/*menu*/

.mobmenu img{margin: 0 auto;	display: block;max-width: 16vw;}
.mobmenu {  cursor: pointer; color:#fff;font-weight:bold;font-size:2em;padding: 10px; background:#243E94}
.active, .mobmenu:hover { color:#fff}

.flexpos{   position: fixed;    top: 0;    left: 0;    right: 0;    padding: 0;    z-index: 98;}

/*menu*/
.site-header{width:100%;position:relative;z-index:2 }
.site-header > .wrap{margin:0 auto; position:relative}
.site-header>.wrap{display:flex;align-items: center;justify-content:space-around}

.nav-primary {    max-height: 0;    overflow: hidden;    transition: max-height .2s ease-out; text-transform:uppercase}

.nav-primary wrap{position:relative}
.nav-primary ul{text-align:center;list-style:none;padding-left: 0; background:#fff;}
.nav-primary li a{color: #313131;padding: 0.7em ;text-decoration: none;font-size: 1em;font-weight:normal;  height: 100%;  display: block;}
.nav-primary li:hover { background:#243E94;color:#fff;overflow:hidden}
.nav-primary li:hover > a{color:#fff}
.nav-primary li ul {display:none;position:absolute;	min-width:140px;top:57px;background:#414141}
.nav-primary li ul li, .nav-primary li ul li a{color:#fff}

/*slideshow*/
#contslider {
  position: relative;
  overflow: hidden;
}

.featured-slides {
  position: relative;
  transition: height 0.6s ease; /* transicion altura */
}

.mySlides {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 2s ease;
  pointer-events: none;
}

.mySlides.slideactive {
  opacity: 1;
  position: relative;
  pointer-events: auto;
}

.bottonessliders {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 10;
}
.previous_btn { left: 10px; }
.next_btn { right: 10px; }

.bannerdesc{color:#fff;font-weight:bold;text-align: center;left: 0;right: 0;    max-width: 950px;margin:0 auto;z-index:8; background:#243E94;padding:5px;box-sizing:border-box;position:relative;z-index:10}
.bannerdesc h2{font-size:16px;text-transform: uppercase;font-weight: bold;margin:0}
.bannerdesc a{background:#fff;color:#2A2A2A;display: flex; width:150px; justify-content: center;align-items: center;font-weight: bold;text-align:center;margin: 1em auto;font-size:16px}
.bannerdesc {display:none;}


#descripcionsitio{color:#fff;font-weight:bold;text-align: center;left: 0;right: 0;  margin:0 auto;z-index:8; background:#2D2D2D;padding:5px;box-sizing:border-box;position:relative;z-index:10;padding: 20px 10px; box-sizing:border-box}

#descripcionsitio h1{font-size:20px;text-transform: uppercase;font-weight: bold;margin:0;width:1200px;max-width:100%;text-align:center;margin:0 auto}
#descripcionsitio p{width:1200px;max-width:100%;text-align:center;margin:0 auto}

.bannerdesc a:hover{background:#243E94;color:#fff}
.placeholdban picture{margin:0 auto;display:block; max-width:1920px}
/*image*/
.featuredpost article{overflow:hidden}
.featuredpost a img{transition: .75s ease;margin:0 auto;display:block}
.featuredpost a:hover img {	opacity: 1;	-webkit-animation: flash 1s;	animation: flash 1s; transform: scale(1.1)}

video{margin:0 auto;display:block}





@-webkit-keyframes flash {	0% {		opacity: .4;	}	100% {		opacity: 1;	}}
@keyframes flash {	0% {		opacity: .4;	}	100% {		opacity: 1;	}}



#search-form-container {background:#fff;min-height:47px;display:none }
.telmail {min-height:47px;display: flex;justify-content: space-around;  align-items: center;flex-wrap: wrap;}
.telmail a{color:#fff ;display:flex;align-items:center}
.telmail img{margin:0 10px}

#social-container{background:#243E94;min-height:60px }
.horsocial {color:#fff; font-weight:bold;min-height:60px;display: flex;justify-content: space-around;align-items: center; flex-wrap: wrap;}
.horsocial img{margin:0 10px}
.horsocial a{transition: color .2s ease-in-out,background-color .2s ease-in-out;}
#search-form-container .redes img:hover,.horsocial div:hover{filter: invert(89%) sepia(2%) saturate(3%) hue-rotate(108deg) brightness(103%) contrast(86%);}
.horsocial div a {display:flex;align-items:center}

#search-form-container .redes{background-color:#585C5F}


#valores{display:flex;justify-content:space-around;align-items: center;width:100%;flex-wrap:wrap}
#valores > div{display:flex;flex-direction:column;margin: 10px;max-width:115px;}
#valores h4{text-transform:uppercase;text-align:center;font-weight:normal; color:#243E94}
#valores > div img{margin-bottom:10px}

#footmenu .redes a{padding: 1%;transition: color .2s ease-in-out,background-color .2s ease-in-out;}
#footmenu .redes a:hover{filter: invert(20%) sepia(10%) saturate(6739%) hue-rotate(195deg) brightness(95%) contrast(95%);}
.telmail a {padding: 1%;transition: color .2s ease-in-out,background-color .2s ease-in-out;}
.telmail a:hover{color:#bdbdbd}


#home-block1{position: relative;z-index: 4;     top: 0;max-width:100%;    overflow: hidden;}

#home-block2{ position:relative;}

#nosotros {max-width:1350px;margin:0 auto; margin-top:10px}
#nosotros > div{padding:1em;box-sizing:border-box}
#nosotros h2{text-transform:uppercase}
	#nosotros  div:first-child{display:flex;justify-content:center}


#nosotros div a{background-color:#2A2A2A;color:#fff;width:205px;height:43px;margin-left:auto;display:flex;justify-content:center;align-items:center;font-weight:normal;text-transform:uppercase;position:relative;overflow:hidden;transition .2s transform: ease-in-out;
  will-change: transform}


 


#nosotros div a:after{
    background-color: #243E94;
 
    content: '';
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transform: translate(-100%, 0) rotate(10deg);
    transform-origin: top left;
    transition: .2s transform ease-out;
    will-change: transform;
    z-index: -1;
    }

#nosotros div a:hover::after{
    transform: translate(0, 0);
    }

#nosotros div a:hover{
    
 color:#2A2A2A;
    transform: scale(1.05);
    will-change: transform

}






#servicios{background:#F5F5F5;padding-bottom:40px;box-sizing:border-box}


#serviciosint{ color:#fff;max-width:950px;margin:0 auto;display:flex;justify-content:center;flex-wrap: wrap;margin-top:40px}

#serviciosint .servicio{max-width:451px;width:100%;margin:12px;display:flex;flex-direction:column;background:#fff;color:#2d2d2d;font-size: 16px; text-align:center;}
 
#serviciosint .servicio a{margin:0 auto; margin-bottom:20px; background-color:#707070;color:#fff;width:135px;height:34px;display: flex;
  align-items: center;  justify-content: center;}
 
#servicios{position:relative}
#servicios > h2{background: #243E94;margin: 0; text-align: center;padding-right: 20px;text-transform:uppercase;position:relative;z-index:3;font-size:40px;padding:10px;box-sizing:border-box;color:#fff}

 
#serviciosint .servicio .servtitulo{background-color:#243E94;color:#fff;padding:10px;box-sizing:border-box}
#serviciosint .servicio .servtitulo p{margin-bottom:0}
.servcontent{display:flex;flex-direction:column;justify-content:space-between;padding:10px;box-sizing:border-box}

 
.imgservicio {position:absolute;top: -258px;;z-index: 12;left: calc(50% - 900px);}
.listasservicios{display:flex;flex-wrap:wrap;max-width:1900px;margin:0 auto;padding-top: 10px;
padding-bottom: 10px; justify-content: center;}

 



	/*	#serviciosint .listasservicios a{width:112px; height:37px;display:flex;justify-content:center;align-items:center;background:#FFFFFF;margin-left: auto;}
	#serviciosint .listasservicios a:hover{background:#243E94;}
	*/

.wpspw-post-categories{display: none !important;}


#clientes h2{text-align:center; text-transform:uppercase;background:#243E94;padding:20px;max-width: 1210px;
margin: 0 auto;box-sizing:border-box;font-size:48px}



.rl-gallery-container{max-width:1200px;margin:0 auto;}
.rl-basicgrid-gallery{justify-content:center}
.rl-basicgrid-gallery::after{content: none !important;
min-width: 0 !important;
height: auto !important;}
	
	
 

 


#actividades  h2 { color:#fff;margin: 0; text-align: center;font-size: 35px;padding:10px;box-sizing:border-box;	color:#fff;text-transform:uppercase;}

#actividadesint{  background-image: url("/wp-content/uploads/2025/11/Grupo-1825.jpg");  height: 100%;  min-height: 356px; max-height: 356px;  width: 100%;
  position: relative;  background-attachment: fixed;  background-repeat: no-repeat;  background-size: cover;display: flex;
align-items: center;
justify-content: center;}

 
.actividadesint{display:flex;justify-content:space-around;max-width:970px; color:#fff;flex-wrap: wrap;text-align: center;margin: 0 auto;
}

.actividadesint > div {display:flex;flex-direction:column;justify-content:flex-start;align-items:center;max-width:320px;padding:10px;box-sizing:border-box}



.imgacti{height:150px;margin-top: 25px;}


.footer-widgets-1{background-image: url("/wp-content/uploads/2025/11/Grupo-1826.jpg");

  position: relative;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
}
#footercontact{max-width:1122px;width:100%;margin:20px auto;display:flex;flex-wrap:wrap;justify-content:center}
#footerinfo, #footerinfo a {color:#fff}
#footerinfo{max-width:510px;width:100%;padding:10px 20px;box-sizing:border-box;color:#fff;display: flex;
  flex-direction: column;
  align-items: center;}
#formulario{max-width:520px;width:100%;padding:20px ;box-sizing:border-box;background-color:#243E94}
#formulario h2{color:#fff;text-align:center}
#formulario p{color:#fff;text-align:center}

.footerinfo{display:flex;align-items:center}
.footerinfo > img{margin-right:10px}
.footerinfo a img{margin-right:10px}
.footerinfo a {display:flex;align-items:center}
.footerinfo > div{display:flex;flex-direction:column;margin-left:10px}
.ubicacion{display:flex;margin: 10px 0;align-items: center;max-width:470px}
.ubicacion img{margin-right:10px}
.ubicacion span{text-align:center}


#copyrightfooter{color:#fff; text-align:center;background:#243E94;display:flex;justify-content:center;align-items:center;padding:20px}

/*pages*//*posts*//*archive category*/


.archive .content,.error404 article .entry-content, .single article .entry-content, .page article .entry-content{max-width:1200px;margin:0 auto;padding:1em;width:100%;box-sizing:border-box}


.entry-header{text-align:center; background:#243E94; color:#fff;position:relative;}
.entry-header h1{font-weight:400}
.entry-title{max-width:1200px;padding:10px;box-sizing:border-box;margin: 0 auto;}

.page article  .entry-header{text-align:center}


.entry-meta{display:none !important}



.formulario input, .formulario textarea{background:#414141;color:#fff;font-weight:bold}
.formulario textarea {height:156px}
.formulario .halfinp p{  display: flex;  justify-content: space-between;}
.formulario .halfinp p label{width:48%}

.footer-widgets{background:#F9F9F9}



#copyright {color:#fff; background:#414141;text-align:center;padding:20px;box-sizing:border-box;font-weight:normal}
#copyright h4{margin:0}


#contacto{margin:0 auto;padding:20px 10px; box-sizing:border-box; font-size:20px}

.wpcf7-form > div{margin-bottom:15px}
.wpcf7-submit {width:100% !important; background:#414141 !important; text-transform:uppercase}
.wpcf7-submit:hover{background:#fff !important;color:#414141 !important; }

div.wpcf7-response-output {	margin: 2em 0.5em 1em;	padding: 0.2em 1em;	color:#fff; text-align:center;font-weight:900}
div.wpcf7-mail-sent-ok {background: #eb2f35;}
div.wpcf7-mail-sent-ng {background: #ff0000;}
div.wpcf7-spam-blocked {background: #ffa500;}
div.wpcf7-validation-errors {background: #f7e700;color:#000}


.wpcf7-submit{color:#fff; background:#2A2A2A;width:200px}
.wpcf7-submit:hover{background:#243E94}
.page-id-12 .redes img{margin:10px}


header{transition: all 0.5s ease-out}
header.sticky{position: fixed;top: 0;left: 0;right: 0;padding: 0;z-index:98;}	
/*full site*/
@media screen and (min-width: 60em) {
	#social-container{display:block}
	.correo{display:flex}
.telefonotop{display:block; font-size:20px}
	.flexpos{   position: relative;    top: 0;    left: 0;    right: 0;    padding: 0;    z-index: 98;}

	.telefonotop .redes{width:240px;}	
	
	
	
	
	.site-container{margin-top:0}
		
	/*header*/
.headerdeart .radial-progress{top:15%;right:10%}	
	.site-header{background:none;filter:none}
	.site-header>.wrap{display:flex;align-items: center;justify-content:flex-end}
	.header-widget-area{max-width:70%;width:100%}
.whatscel{margin-left:1em}
	.headermail img{margin-top:5px}
	/*logo*/
.featured-image-class{ top:0}
.title-area {position:absolute;max-width: 30%;width: 100%;left: 0;top: 0;margin:0;background:#fff;display:flex;justify-content:flex-end;height:150px}

	.title-area img{max-width:90%;top:-25px}
	
	/*menu*/
	.mobmenu{display:none}
	.nav-primary { max-height: 100%;overflow:visible;position:relative }
	/*nav*/
	.nav-primary > ul{display:flex;flex-wrap:wrap;align-items: center;justify-content:center}
	.nav-primary .wrap{display: flex;justify-content: flex-start;align-items: center;padding-left: 80px; background:#fff}
	.nav-primary .wrap>ul{display:flex;flex-wrap:wrap;justify-content:space-around;align-items: center;position:relative;z-index:10; min-height:150px;max-width:57vw;width:700px}
	
	/*.nav-primary .wrap>ul:before{content: '';width: 0px;height: 0px;border-bottom: 75px solid #fff;border-left: 80px solid #fff;position: absolute;left: -80px;top: 0px;}*/
	.nav-primary li a{font-size: 0.75em;}
	.nav-primary .wrap>ul:after{content: '';width: 0px;height: 0px;border-top: 75px solid #fff;border-right: 45px solid transparent;position: absolute;right: -44px;top: 0px;}
	
	.nav-primary .wrap>ul>li{display:inline-block;}
	
				
	
				.nav-primary li:hover > ul {display:block;}
			
			.nav-primary li ul li {	position:relative;}
			
			.nav-primary li ul li ul {right:-140px;	top:0px;}
	
	h1{font-size: 48px;}
	
	.telefonotop .wrap{display:flex}
	#search-form-container {width: 50%;position:relative;display:flex;justify-content:flex-end}
	#search-form-container:after{    content: '';    width: 0px;    height: 0px;    border-top: 60px solid #585C5F;    border-right: 20px solid transparent;    position: absolute;    right: -19px;    top: 0px;
}
	.widget_text.search{position:relative}
		.widget_text.search:before{    content: '';
    width: 0px;
    height: 0px;
    border-bottom: 60px solid #585C5F;
    border-left: 20px solid transparent;
    position: absolute;
    left: -19px;
    top: 0px;
}
	
	#social-container {width: 50%}
	
	.telmail{display:flex;    justify-content: space-around;    align-items: center; }
	.telmail > div{display:flex;    justify-content: space-around;    align-items: center;}
	
	.horsocial{display:flex;    justify-content: flex-start;    align-items: center;margin-left:3vw}
	.horsocial > div{display:flex;    justify-content: space-around;    align-items: center; margin:0 20px}
	
	#home-block1{top:0}	
	
	
	#descripcionsitio h1{font-size:32px; }
	
.bannerdesc{color:#fff;font-weight:bold;text-align: center;left: 0;right: 0;    max-width: 1020px;margin:0 auto;bottom:3vw;margin-bottom:-2vw}
	.bannerdesc a{width:285px;height:60px;font-size:18px}
	.bannerdesc h2{font-size:1.5vw;padding:10px;box-sizing:border-box}
	

	
	#nosotros {display:flex;justify-content:space-around;
    z-index: 8;
    position: relative;}
	#nosotros > div{font-size:18px;width:50%}

	#nosotros h2{font-size:48px}
	

	#serviciosint .listasservicios{position:relative}
	

 
 
#serviciosint .listasservicios > div{width: calc(50% - 20px);max-width:100%} 	
	#serviciosint h2{font-size:24px}
	
	#servicios > h2{height: 92px; font-size:48px;display: flex;align-items: center;justify-content: center;position:relative;  width: 100%;}
	
	 
	
	
	
	
	#ofrecemos h2{font-size:48px; }
	
	.actividadesint{padding-top: 20px;margin-top: 80px;padding-bottom:60px;box-sizing:border-box}
	
	#actividades  h2{color:#fff;text-transform:uppercase;}
	
	

	
	#contacto{display:flex;justify-content:space-around;max-width:1100px; }
	
	#contacto > div:first-child{width:40%}
	#contacto > div:last-child{width:60%}
	.footinfo .redes {font-size:40px}
	.footinfo > h2 {font-size:40px}
	
	
	
	
	.entry-header{margin-top:-150px;margin-bottom:100px;background-color: rgba(36, 62, 148, 0.6);}
	
	
	
}


@media screen and (min-width: 1400px) {	
	
body {font-size: 20px;}
	#nosotros h2{font-size:40px}
		#nosotros > div{font-size:22px}
 
	.listasservicios{font-size:22px}
	
	}

	
	
	@media screen and (min-width: 1920px) {	
	.bannerdesc h2{font-size:50px;}
.bannerdesc p{font-size:40px}
	

		
		
	
	}
	
	
	
	




.animatable {
   opacity: 0;
  transition: opacity 500ms;

}

/* show objects being animated */
.animatable.animated {

opacity: 1;
}

/* CSS Animations (extracted from http://glifo.uiparade.com/) */


@keyframes bounce {
    20%,
    53%,
    80%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0, 0, 0);
    }
    40%,
    43% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -30px, 0);
    }
    70% {
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -15px, 0);
    }
    90% {
        transform: translate3d(0, -4px, 0);
    }
}
.animated.bounce {
    animation: bounce  2s ease-in-out both;
    transform-origin: center bottom;
}
@keyframes flash {
    50%,
    from,
    to {
        opacity: 1;
    }
    25%,
    75% {
        opacity: 0;
    }
}
.animated.flash {
    animation: flash 2s ease-in-out both;
}
@keyframes pulse {
    from,
    to {
        transform: scale3d(1, 1, 1);
    }
    50% {
        transform: scale3d(1.05, 1.05, 1.05);
    }
}
.animated.pulse {
    animation: pulse  2s ease-in-out both;
}
@keyframes rubberBand {
    from,
    to {
        transform: scale3d(1, 1, 1);
    }
    30% {
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        transform: scale3d(0.75, 1.25, 1);
    }
    50% {
        transform: scale3d(1.15, 0.85, 1);
    }
    65% {
        transform: scale3d(0.95, 1.05, 1);
    }
    75% {
        transform: scale3d(1.05, 0.95, 1);
    }
}
.animated.rubberBand {
    animation: 2s ease-in-out both;
}
@keyframes shake {
    from,
    to {
        transform: translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0);
    }
}
.animated.shake {
    animation: shake  2s ease-in-out both;;
}
@keyframes headShake {
    0% {
        transform: translateX(0);
    }
    6.5% {
        transform: translateX(-6px) rotateY(-9deg);
    }
    18.5% {
        transform: translateX(5px) rotateY(7deg);
    }
    31.5% {
        transform: translateX(-3px) rotateY(-5deg);
    }
    43.5% {
        transform: translateX(2px) rotateY(3deg);
    }
    50% {
        transform: translateX(0);
    }
}
.animated.headShake {
    animation-timing-function: ease-in-out;
    animation: 2s ease-in-out both;
}
@keyframes swing {
    20% {
        transform: rotate3d(0, 0, 1, 15deg);
    }
    40% {
        transform: rotate3d(0, 0, 1, -10deg);
    }
    60% {
        transform: rotate3d(0, 0, 1, 5deg);
    }
    80% {
        transform: rotate3d(0, 0, 1, -5deg);
    }
    to {
        transform: rotate3d(0, 0, 1, 0deg);
    }
}
.animated.swing {
    transform-origin: top center;
    animation: 2s ease-in-out both;
}
@keyframes tada {
    from,
    to {
        transform: scale3d(1, 1, 1);
    }
    10%,
    20% {
        transform: scale3d(0.9, 0.9, 0.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);
    }
}
.animated.tada {
    animation: 2s ease-in-out both;
}
@keyframes wobble {
    from,
    to {
        transform: none;
    }
    15% {
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }
    30% {
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }
    45% {
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }
    60% {
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }
    75% {
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }
}
.animated.wobble {
    animation: wobble  2s ease-in-out both;
}
@keyframes jello {
    11.1%,
    from,
    to {
        transform: none;
    }
    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }
    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg);
    }
    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }
    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }
    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }
    77.7% {
        transform: skewX(0.390625deg) skewY(0.390625deg);
    }
    88.8% {
        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    }
}
.animated.jello {
    animation: jello  2s ease-in-out both;
    transform-origin: center;
}
@keyframes bounceIn {
    20%,
    40%,
    60%,
    80%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3);
    }
    20% {
        transform: scale3d(1.1, 1.1, 1.1);
    }
    40% {
        transform: scale3d(0.9, 0.9, 0.9);
    }
    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        transform: scale3d(0.97, 0.97, 0.97);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}
.animated.bounceIn {
    animation: bounceIn  2s ease-in-out both;;
}
@keyframes bounceInDown {
    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0);
    }
    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0);
    }
    75% {
        transform: translate3d(0, -10px, 0);
    }
    90% {
        transform: translate3d(0, 5px, 0);
    }
    to {
        transform: none;
    }
}
.animated.bounceInDown {
    animation: bounceInDown  2s ease-in-out both;;
}
@keyframes bounceInLeft {
    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0);
    }
    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0);
    }
    75% {
        transform: translate3d(-10px, 0, 0);
    }
    90% {
        transform: translate3d(5px, 0, 0);
    }
    to {
        transform: none;
    }
}
.animated.bounceInLeft {
    animation: bounceInLeft  2s ease-in-out both;;
}




@keyframes bounceInRight {
    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        transform: translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0);
    }
    75% {
        transform: translate3d(10px, 0, 0);
    }
    90% {
        transform: translate3d(-5px, 0, 0);
    }
    to {
        transform: none;
    }
}
.animated.bounceInRight {
    animation: bounceInRight 2s ease-in-out both;
}
@keyframes bounceInUp {
    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        transform: translate3d(0, 3000px, 0);
    }
    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0);
    }
    75% {
        transform: translate3d(0, 10px, 0);
    }
    90% {
        transform: translate3d(0, -5px, 0);
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
.animated.bounceInUp {
    animation: bounceInUp  2s ease-in-out both;
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.animated.fadeIn {
    animation: fadeIn  1s ease-in-out both;
}
@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.animated.fadeInDown {
    animation: fadeInDown 1s ease-in-out both;
}
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.animated.fadeInLeft {
    animation: fadeInLeft  1s ease-in-out both;
}
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.animated.fadeInRight {
    animation: fadeInRight  1s ease-in-out both;
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.animated.fadeInUp {
    animation: fadeInUp  1s ease-in-out both;
}
@keyframes lightSpeedIn {
    from {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }
    60% {
        transform: skewX(20deg);
        opacity: 1;
    }
    80% {
        transform: skewX(-5deg);
        opacity: 1;
    }
    to {
        transform: none;
        opacity: 1;
    }
}
.animated.lightSpeedIn {
    animation: lightSpeedIn  2s ease-in-out both;
    animation-timing-function: ease-out;
}
@keyframes rotateIn {
    from {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;
    }
    to {
        transform-origin: center;
        transform: none;
        opacity: 1;
    }
}
.animated.rotateIn {
    animation: rotateIn  1s ease-in-out both;
}
@keyframes rotateInDownLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
    to {
        transform-origin: left bottom;
        transform: none;
        opacity: 1;
    }
}
.animated.rotateInDownLeft {
    animation: rotateInDownLeft  1s ease-in-out both;
}
@keyframes rotateInDownRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        transform-origin: right bottom;
        transform: none;
        opacity: 1;
    }
}
.animated.rotateInDownRight {
    animation: rotateInDownRight  1s ease-in-out both;
}
@keyframes rotateInUpLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
    to {
        transform-origin: left bottom;
        transform: none;
        opacity: 1;
    }
}
.animated.rotateInUpLeft {
    animation: rotateInUpLeft  1s ease-in-out both;
}
@keyframes rotateInUpRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;
    }
    to {
        transform-origin: right bottom;
        transform: none;
        opacity: 1;
    }
}
.animated.rotateInUpRight {
    animation: rotateInUpRight  1s ease-in-out both;
}
@keyframes rollIn {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.animated.rollIn {
    animation: rollIn  2s ease-in-out both;
}
@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}
.animated.zoomIn {
    animation: zoomIn  2s ease-in-out both;
}
@keyframes zoomInDown {
    from {
        opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}
.animated.zoomInDown {
    animation: zoomInDown  2s ease-in-out both;
}
@keyframes zoomInLeft {
    from {
        opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}
.animated.zoomInLeft {
    animation: zoomInLeft  2s ease-in-out both;
}
@keyframes zoomInRight {
    from {
        opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}
.animated.zoomInRight {
    animation: zoomInRight  2s ease-in-out both;
}
@keyframes zoomInUp {
    from {
        opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
    60% {
        opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}
.animated.zoomInUp {
    animation: zoomInUp  2s ease-in-out both;
}
@keyframes slideInDown {
    from {
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
.animated.slideInDown {
    animation: slideInDown  1s ease-in-out both;
}
@keyframes slideInLeft {
    from {
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
.animated.slideInLeft {
    animation: slideInLeft  1s ease-in-out both;
}
@keyframes slideInRight {
    from {
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
.animated.slideInRight {
    animation: slideInRight  1s ease-in-out both;
}
@keyframes slideInUp {
    from {
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        transform: translate3d(0, 0, 0);
    }
}
.slideInUp {
    animation: slideInUp  1s ease-in-out both;
}