@charset "UTF-8";
/* CSS Document 27/04/2020 */
.row.forzar-flexbox, .boxitems.forzar-flex, .single.forzar-flex{display: -webkit-box;display: -moz-box;display: box;display: -webkit-flex;display: -moz-flex;display: -ms-flexbox;display: flex;display: -webkit-box;display: -webkit-flex;-webkit-flex-direction: row;-ms-flex-direction: row;display: -ms-flexbox;flex-direction: row;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;width: 100%;text-indent: 0;margin-left: 0;margin-left: auto;margin-right: auto;box-sizing:border-box;padding-left:0;padding-right:0}
.boxitems.forzar-flex{background:none}
.boxitems.forzar-flex.arreglar-cuadricula-categoria{margin-left: -15px;margin-right: -15px;width: calc(100% + 30px);}
.row.forzar-flexbox .beige{width:calc(32.33% - 1px);box-sizing:border-box;}
.row.forzar-flexbox .beige:nth-child(1){margin-left:0}
.row.forzar-flexbox .beige:nth-child(2) {margin-left:1.5%;margin-right:1.5%}
.row.forzar-flexbox .beige:nth-child(3){margin-right:0}
.borde-home{overflow:hidden}
/** iconos videos */
article.category-videos-es .img-float-left, article.category-videos-en .img-float-left, article.category-videos-en .mini-post-img, article.category-videos-es .mini-post-img, .cajas-blog .hthumb{position:relative}
.category-videos-en .hthumb:before, .category-videos-es .hthumb:before, article.category-videos-es .img-float-left:before, article.category-videos-en .img-float-left:before, article.category-videos-es .mini-post-img:before, article.category-videos-en .mini-post-img:before, .cajas-blog .hthumb.category-videos-en:before, .cajas-blog .hthumb.category-videos-es:before{content:'\f04b';font-family:"FontAwesome";font-size:21px;color:#fff;position:absolute;z-index:9;position:absolute;top:50%;left:50%;margin-top:-22.5px;margin-left:-22.5px;border:1px solid rgba(255,255,255,1);background:rgba(0,0,0,0.5);border-radius:100%;padding:10px 12.20px;transition all .3s ease-in-out}
.hthumb:hover:before, article.category-videos-es .img-float-left:hover:before, article.category-videos-en .img-float-left:hover:before, article.category-videos-en .img-float-left:hover:before, article.category-videos-es .mini-post-img:hover:before, article.category-videos-en .mini-post-img:hover:before, .cajas-blog .hthumb.category-videos-en:hover:before, .cajas-blog .hthumb.category-videos-es:hover:before{display:none}
.campus ul li a, .campus a{
    color: #00a0e1;
}
.hthumb img{width:100%}
/*new menu*/
.col-sm-10.mainmenu{padding-right:0}
#submenu{float:right}
#submenu li a{text-transform: uppercase;font-size: 12px;color: #666;padding: 12px 12px;padding-right: 12px;font-weight: 600;}
/**********************************************************************************************************************
* Nuevo CSS para el menú sin ubermenú plugin última revisión 19-Mayo-16
***********************************************************************************************************************/
.site-branding {
    margin-bottom: 15px;
    margin-top: 15px;
    float: left;
}
.col-sm-10.mainmenu{padding-right:0}
#submenu{float:right}
#masthead #submenu{margin-top:40px}
#masthead.new-sticky-bar #submenu{margin-top:30px}
.site-branding.col-sm-2{position:relative}
#submenu li.menu-header-search a{padding-right:15px}
#masthead img{-webkit-transition: all 0.2s ease-in-out;    -moz-transition: all 0.2s ease-in-out;    -o-transition: all 0.2s ease-in-out;    transition: all 0.2s ease-in-out;}
#masthead img.img-modified{width:65px}
#masthead.new-sticky-bar{max-width:inherit;width:100%;background:#FFF;position:fixed;top:0;left:0;z-index:9999;background:#FFF;-webkit-box-shadow: 0px 1px 5px 0px rgba(24, 26, 29, 0.1);-moz-box-shadow: 0px 1px 5px 0px rgba(24, 26, 29, 0.1);box-shadow: 0px 1px 5px 0px rgba(24, 26, 29, 0.1);padding-top:0px !important;-webkit-transition: position 1.1s ease-in-out;    -moz-transition: position 1.1s ease-in-out;    -o-transition: position 1.1s ease-in-out;    transition: position 1.1s ease-in-out;}
#masthead.new-sticky-bar .row{width:94%;margin:0 auto;display:block;max-width:1170px;-webkit-transition: all 0.1s ease-in-out;    -moz-transition: all 0.1s ease-in-out;    -o-transition: all 0.1s ease-in-out;    transition: all 0.1s ease-in-out;}
#masthead.new-sticky-bar .site-branding{-webkit-transition: margin 0.2s ease-in-out;    -moz-transition: margin 0.2s ease-in-out;    -o-transition: margin 0.2s ease-in-out;    transition: margin 0.2s ease-in-out;z-index:99999;position:relative}
#masthead.new-sticky-bar #submenu{margin: 25px 0 0 0;}

/***********
* Search
*************/
#search {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background:rgba(255, 255, 255, 0.95) url(//johancruyffinstitute.com/wp-content/themes/Revera/images/graficos_cabecera3.jpg) top right;
    background-size:50% auto;
	background-repeat:repeat-y;
    -webkit-transition: all 0.55s ease-in-out;
	-moz-transition: all 0.55s ease-in-out;
	-o-transition: all 0.55s ease-in-out;
	-ms-transition: all 0.55s ease-in-out;
	transition: all 0.55s ease-in-out;

    -webkit-transform: translate(0px, -100%) scale(0, 0);
	-moz-transform: translate(0px, -100%) scale(0, 0);
	-o-transform: translate(0px, -100%) scale(0, 0);
	-ms-transform: translate(0px, -100%) scale(0, 0);
	transform: translate(0px, -100%) scale(0, 0);
    
    opacity: 0;
	z-index:9999
}

#search.open {
    -webkit-transform: translate(0px, 0px) scale(1, 1);
    -moz-transform: translate(0px, 0px) scale(1, 1);
	-o-transform: translate(0px, 0px) scale(1, 1);
	-ms-transform: translate(0px, 0px) scale(1, 1);
	transform: translate(0px, 0px) scale(1, 1); 
    opacity: 1;
}
#search h3 {
    position: absolute;
    top: 25%;
    width: 100%;
    color: #fff;
    text-align: center;
}
#search input[type="search"] {
    position: absolute;
    top: 50%;
    width: 90%;
    color: #999;
    background: rgba(0, 0, 0, 0);
    font-size: 60px;
    font-weight: 300;
    text-align: center;
    border: 0px;
    margin: 0px auto;
    margin-top: -91px;
    padding-left: 30px;
    padding-right: 30px;
	margin-left:auto;
	margin-right:auto;
    outline: none;
	display:block;
	margin-left:5%;
	margin-right:5%;
	box-sizing:border-box;
}
#search input:focus, #search input:active{outline:none;border:0;-webkit-appearance: none;outline-style:none;box-shadow:none;border-color:transparent;}
#search .btn:focus, #search .btn:active{outline:none;border:0;-webkit-appearance: none;outline-style:none;box-shadow:none;border-color:transparent;}
#search .btn {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100px;
    max-width: 200px;
    margin-top: 61px;
    margin-left: -45px;
	background:#00a0e1;
	color:#FFF;
	border-color:#00a0e1;
	color: #fff;
    background-color: #6d6d6d;
    cursor: pointer;
    padding: 15px 20px;
    width: auto;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border: none;
    font-weight: 600;
    text-transform: uppercase;
    text-shadow: none !important;
    box-shadow: none;
	
}
#search .btn:hover{background:#00a0e1}
#search .close {
    position: fixed;
    top: 15px;
    right: 15px;
    color: #00a0e1;
	opacity: 1;
	padding: 10px 17px;
	font-size: 27px;
	font-size: 60px;
	box-shadow:none;
}

.menu-item-has-children .sf-sub-indicator{display:none}
#submenu li a{text-transform:uppercase;font-size: 12px;    color: #666;    padding: 12px 12px;    font-weight: 600;}
#submenu li:hover, #submenu li a:hover, #submenu li:hover ul{background-color:#f9f9f9}
#submenu li a:hover ul{background-color:#f9f9f9}
#submenu li.menu-item-has-children ul li a{text-transform:none}
#submenu li.menu-item-has-children ul{min-width:220px;display:table;box-shadow: 0 20px 50px 10px rgba(0, 0, 0, 0.15);}
#submenu li ul{min-width:220px}
#submenu li a:hover, #submenu li ul li a:hover{color:#000}
#submenu li.menu-item-has-children ul li, #submenu li.menu-item-has-children ul li{min-width:220px;display:block;box-sizing:border-box;border:none}
#submenu li ul li a, #submenu li ul li a:link, #submenu li ul li a:visited, #submenu li ul li ul li a, #submenu li ul li ul li a:link, #submenu li ul li ul li a:visited, #submenu li ul li ul li ul li a, #submenu li ul li ul li ul li a:link, #submenu li ul li ul li ul li a:visited{min-width:220px;border:none;}
#masthead.new-sticky-bar #nav-icon1 {
    right: 0;
}
/* sliders categoria */
#slidebox{max-height:inherit}
#slidebox .flex-direction-nav{z-index:15}
.boxitems.forzar-flex .col-sm-3{width:25%;height:auto}
/**** Arreglo css caja comentarios */
textarea#comment{width:100%}
#comments .comment-form-author{width:50%;display:inline-block;clear:left;padding-left:10px}
#comments .comment-form-email{width:50%;display:inline-block;clear:right;padding-right:10px;float:left}
#comments .comment-form-email #email, #comments .comment-form-author #author, #comments .comment-form-url #url{width:100%}
#comments .comment-form-cookies-consent{padding:20px 0}
#comments .comment-form-cookies-consent #wp-comment-cookies-consent{display: inline-block;float: left;width: auto;}
#respond input[type="submit"]{width:auto}
/* testimonials nuevo */
.rounded-image-testimonials{border-radius:50%;overflow:hidden;border:5px solid #cbcbcb;width:140px;height:140px;display:block;margin-left:auto;margin-right:auto}
.testimonial-list{list-style:none;padding-left:0;margin-left:0;display:block;width:100%;text-align:center;margin-top:40px;margin-bottom:40px}
.testimonial-list li.testimonial{margin-bottom:30px}
.testimonial-body{margin-top:20px;margin-bottom:20px;position:relative;background-color: #f1f1f1;padding:30px 2%;text-align:center;border-top: solid thin #cbcbcb;
border-bottom: solid thin #cbcbcb;}
blockquote.testimonial-quote{padding:0}
.testimonial-body p{font-size:12px !important;text-align:center;margin: 0 0 10px;padding:0 15px}
.testimonial-body:before{content: "\e610";
font-family: Icomoon;
font-weight: 400;
position: absolute;
margin-top: -45px;
margin-left: -15px;
width: 30px;
height: 30px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
background-color: #cbcbcb;
text-align: center;
padding-top: 5px;}
.testimonial-body:after{content: "\e610";
font-family: Icomoon;
position: absolute;
margin-top: 15px;
margin-left: -15px;
width: 30px;
height: 30px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
background-color: #cbcbcb;
text-align: center;
padding-top: 5px;}
.testimonial-author{margin-top:40px;display:block;margin-bottom:80px;padding:0 15px}
.testimonial-author p{font-size:14px !important;text-align:center;color:#00a0e1 !important;margin-bottom:20px}
.testimonial-author p .position{line-height:normal;font-size:12px}
@media screen and (max-width: 1170px) {
#submenu{display:block;float:none}
#submenu li ul, #submenu li {display:block;width:100%}
.site-branding.col-sm-2{display:block;float:none;clear:both;width:100%;box-sizing:border-box}
.site-branding.col-sm-2 img{float:left}
.col-sm-10.mainmenu{display:block;float:none;clear:both;width:100%;box-sizing:border-box}
#masthead #submenu{display:none;height:auto}
#masthead #nav-icon1{display:inline-block;float:right}
#masthead #nav-icon1{  width: 60px;  height: 35px;  position: relative;   -webkit-transform: rotate(0deg);  -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  transform: rotate(0deg);  -webkit-transition: .5s ease-in-out;  -moz-transition: .5s ease-in-out;  -o-transition: .5s ease-in-out;  transition: .5s ease-in-out;  cursor: pointer;position:absolute;top:50%;margin-top:-17px;right:5px }
#masthead #nav-icon1 span {  display: block;  position: absolute;  height: 7px;  width: 100%;  background: #00a0e1;  border-radius: 0;  opacity: 1;  left: 0;  -webkit-transform: rotate(0deg);  -moz-transform: rotate(0deg);  -o-transform: rotate(0deg);  transform: rotate(0deg);  -webkit-transition: .25s ease-in-out;  -moz-transition: .25s ease-in-out;  -o-transition: .25s ease-in-out;  transition: .25s ease-in-out;}
#masthead #nav-icon1 span:nth-child(1) {  top: 0px;}
#masthead #nav-icon1 span:nth-child(2) {  top: 14px;}
#masthead #nav-icon1 span:nth-child(3) {  top: 28px;}
#masthead #nav-icon1.open span:nth-child(1) {  top: 18px;  -webkit-transform: rotate(135deg);  -moz-transform: rotate(135deg);  -o-transform: rotate(135deg);  transform: rotate(135deg);}
#masthead #nav-icon1.open span:nth-child(2) {  opacity: 0;  left: -60px;}
#masthead #nav-icon1.open span:nth-child(3) {  top: 18px;  -webkit-transform: rotate(-135deg);  -moz-transform: rotate(-135deg);  -o-transform: rotate(-135deg);  transform: rotate(-135deg);}
#masthead.new-sticky-bar #nav-icon1 span{background:#232a5c}
#slidebox.flexslider .slides li{max-height:inherit !important}
}
@media screen and (min-width: 769px) and (max-width: 1199px){
.container{width:96%;max-width:inherit }
#slidebox .flex-caption h2{font-size:28px}
#slidebox .flex-caption p{padding-left:5%;padding-right:5%;line-height:normal}
}
@media screen and (max-width: 999px) {
.campus{height:auto;padding-left:0;padding-right:0;padding-top:0}
.campus .container{display: -webkit-box;display: -moz-box;display: box;display: -webkit-flex;display: -moz-flex;display: -ms-flexbox;display: flex;display: -webkit-box;display: -webkit-flex;-webkit-flex-direction: row;-ms-flex-direction: row;display: -ms-flexbox;flex-direction: row;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;width: 100%;text-indent: 0;margin-left: 0;margin-left: auto;margin-right: auto;box-sizing:border-box;padding-left:0;padding-right:0}
.campus .alignright{width:50%;box-sizing:border-box;display:block;float:none;margin:0;padding-top:15px;padding-bottom:15px}
.campus .alignright:nth-child(1){order:3;text-align:right;padding-right:15px}
.campus .alignright:nth-child(2){order:2;text-align:left;padding-left:15px}
.campus .alignright ul{margin-left:0}
.campus .alignleft{width:100%;display:block;order:1;float:none;padding-bottom:10px;padding-left:0;padding-right:0;margin-right:0;padding:10px;background:#00a0e1/*#292929*/;color:#eee;margin-bottom:10px}
.alignleft span {display: block;font-size:13px}
.campus .alignleft a{color:#eee;font-size:13px}
.campus .lang-item, .campus a{font-size:17px}
.site-branding{padding-left:0}
}
@media screen and (max-width: 768px) {
/* Recolocación de elementos en el header */
.campus{height:auto;padding-left:0;padding-right:0;padding-top:0}
.campus .container{display: -webkit-box;display: -moz-box;display: box;display: -webkit-flex;display: -moz-flex;display: -ms-flexbox;display: flex;display: -webkit-box;display: -webkit-flex;-webkit-flex-direction: row;-ms-flex-direction: row;display: -ms-flexbox;flex-direction: row;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;width: 100%;text-indent: 0;margin-left: 0;margin-left: auto;margin-right: auto;box-sizing:border-box;padding-left:0;padding-right:0}
.campus .alignright{width:50%;box-sizing:border-box;display:block;float:none;margin:0;padding-top:15px;padding-bottom:15px}
.campus .alignright:nth-child(1){order:3;text-align:right;padding-right:15px}
.campus .alignright:nth-child(2){order:2;text-align:left;padding-left:15px}
.campus .alignright ul{margin-left:0}
.campus .alignleft{width:100%;display:block;order:1;float:none;padding-bottom:10px;padding-left:0;padding-right:0;margin-right:0;padding:10px;background:#00a0e1/*#292929*/;color:#eee;margin-bottom:10px}
.alignleft span {display: block;font-size:11px}
.campus .alignleft a{color:#eee;font-size:11px}
.campus .lang-item, .campus a{font-size:17px}
/*#masthead .site-branding{padding-left:0}*/
body{background-position: top 63px right}
/*.single-programa ul#menu-programas{margin-left:5px}
.single-programa .layout-programas{margin-left:185px}
.boton-preinscripcion{font-size:11px;padding:10px 3px}
#documentos.masters-2{border-left: 2px solid #e65a25 !important;}*/
.single-post #primary.col-sm-9, .single-post #secondary.col-sm-3{width:100%}
.single-post #comments{margin-right:0}
.single-post h2#titulo-relacionados{margin-right:0;margin-left:0}
.single-post #bloque_magazine.relacionados-magazine div.boxitems{width:102%}
.single-post textarea#comment{width:100%}
.single-post #secondary{padding-left:15px}
.col-sm-9.rotador{padding-left:0;padding-right:0;width:100%;clear:both}
.col-sm-3.columnas-laterales-banners-home .cuadro-imagen{padding-left:0;padding-right:0;width:100%;max-width:inherit;background:none}
.col-sm-3.columnas-laterales-banners-home .cuadro-imagen img{width: calc(100% - 30px) !important;}
.col-sm-3.columnas-laterales-banners-home .video img{width:100% !important}
#masthead #nav-icon1 {right: 0;}
.col-sm-3.columnas-laterales-banners-home .video {padding: 0;width: 100%;margin-top:10px}
.col-sm-3.columnas-laterales-banners-home {width: 100%;padding-right: 0;padding-left: 0;}
.row.forzar-flexbox .clear{display:none}
.row.forzar-flexbox h2.tit-programas{border-bottom:none;font-size: 15px !important;
margin-bottom: 20px;}
.row.forzar-flexbox h2.tit-programas a{margin-bottom:5px;display:inline-block}
.boxitems.forzar-flex.arreglar-cuadricula-categoria{margin-left:15px;margin-right: 15px;width: calc(100% - 30px);}
.row.forzar-flexbox .col-sm-4, .boxitems.forzar-flex.arreglar-cuadricula-categoria .col-sm-3{width:50%;}
#searchform{display:inherit}
#slidebox .flex-caption {display: block !important;width:100%;left:0;z-index:3;margin-left:0}
#slidebox .flex-caption p{display:none}
#slidebox .flex-caption h2{padding-right:5%;padding-left:5%;font-size:25px}
#slidebox .doverlay{z-index:2}
.boxitems.forzar-flex .col-sm-3{width:50%;height:auto;margin-bottom:0}
.contacto #cuadro-agents, .contacto #cuadro-campus {width: 100%;min-height:inherit}
@media screen and (max-width: 767px) {
	.campus .lang-item, .campus a {font-size: 13px;}
	.campus .alignleft{font-size:11px;line-height:normal}
	#masthead #nav-icon1{right:15px}
	.home .row, #masthead .row{padding-left:15px;padding-right:15px}
	#masthead.new-sticky-bar{padding-left:0;padding-right:0;width:100%}
	#masthead.new-sticky-bar .row{width:100% !important}
	.site-branding.col-sm-2{padding-left:0}
	.col-sm-3.columnas-laterales-banners-home .video img, .home .row .col-md-4{padding-left:0;padding-right:0}
	.home .new-sticky-bar .row{padding-left:0;padding-right:0}
	#bloque_introduccion h1{font-size:2.6em}
	#bloque_introduccion p{font-size:1.3em}
	.row.forzar-flexbox .beige{width:100%;box-sizing:border-box;}
    .row.forzar-flexbox .beige:nth-child(1), .row.forzar-flexbox .beige:nth-child(2), .row.forzar-flexbox .beige:nth-child(3){margin-left:0;margin-right:0;margin-bottom:15px}
	.row.forzar-flexbox, .col-md-12.no-padding{padding-left:0;padding-right:0}
	#slidebox .flex-caption h2{font-size:20px}
	#slidebox a.frmore{padding-top:5px;padding-bottom:5px }
	#slidebox.flexslider .slides li{max-height:inherit !important}
}
@media screen and (max-width: 660px) {
/*.col-sm-9.rotador{padding-right:0;padding-left:0}*/
.col-sm-3.columnas-laterales-banners-home .cuadro-imagen{padding-left:15px;padding-right:15px}
.col-sm-3.columnas-laterales-banners-home .video {padding-left:0 !important;padding-right:0 !important}
.col-sm-3.columnas-laterales-banners-home .cuadro-imagen img{width:100% !important;}
#search input[type="search"]{font-size:30px}
#masthead.new-sticky-bar .site-branding{padding-top:5px;padding-bottom:5px}
#masthead img.img-modified, #masthead img{width:180px;margin:5px 0 5px 0}
.entry-content .alignleft {width:40%}
#masthead #nav-icon1{width: 30px;height: 25px;margin-top:-9px}
#masthead #nav-icon1.open{margin-top:-21px}
#masthead #nav-icon1 span{height:3px}
#masthead #nav-icon1 span:nth-child(2) {top: 7px;}
#masthead #nav-icon1 span:nth-child(3) {top: 14px;}
#slidebox .flex-caption h2{font-size:17px}
#slidebox a.frmore{font-size:12px }
.boxitems.forzar-flex .col-sm-3{width:100%;}
#comments .comment-form-author, #comments .comment-form-email{width:100%;display:block;clear:left;padding-left:0;float:none;padding-right:0}
#respond input[type="submit"]{width:100%}
#content.cruyff-post #primary a.button-in-post{margin-bottom:20px}
}
@media screen and (max-width: 468px) {
.row.forzar-flexbox .col-sm-4, .boxitems.forzar-flex.arreglar-cuadricula-categoria .col-sm-3{width:100%;}
#slidebox .flex-caption h2{font-size:15px}
}
@media screen and (max-width: 375px) {
.col-sm-3.columnas-laterales-banners-home .cuadro-imagen{padding-left:0 !important;padding-right:0 !important}
#slidebox .flex-caption h2{font-size:14px}
}

.lds-ripple {
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #71a9d0;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}