/*===================================================================*/
/************************* CSS EXTERNOS ******************************/
/*===================================================================*/
@import url("/app_support/css/animate.css");

/*===================================================================*/
/*********************** FIN CSS EXTERNOS ****************************/
/*===================================================================*/


/*===================================================================*/
/****************** DEFINICIÓN ETIQUETAS HTML ************************/
/*===================================================================*/

html, html a{/*fontface*/-webkit-font-smoothing: antialiased !important; }
body{font-family: 'Roboto Slab', serif; color:#000; font-weight:300; font-size:16px; background-color:#fff; line-height:18px}
p{margin-bottom:20px;line-height: 27px;}
h1,h2,h3,h4,h5,h6{font-family: 'Montserrat', sans-serif; }
strong{}
h1{font-size:32px}
h1 a{}
h2{font-size:27px}
h2 a{}
h3{font-size:24px}
.dictado{font-family: 'Montserrat', sans-serif;}

/*a{text-decoration:underline}*/

/*============================================================*/
/****************FIN DEFINICIÓN ETIQUETAS HTML ****************/
/*============================================================*/

/*============================================================*/
/************************** PANES *****************************/
/*============================================================*/
.FooterPane{}
.LeftPane{}	
#ContenedorFijo{margin-bottom:50px;}

/*============================================================*/
/********************** FIN PANES *****************************/
/*============================================================*/

/*============================================================*/
/************************ MÓDULOS *****************************/
/*============================================================*/


/*============================================================*/
/************************ FIN MÓDULOS *************************/
/*============================================================*/

/*============================================================*/
/************************** ANIMACIÓN *************************/
/*============================================================*/

.anim{
	-webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
}


/*============================================================*/
/************************** VÍDEO *************************/
/*============================================================*/

.videoContainer {
	
height: 683px;
width: 100%;
overflow: hidden;
position: absolute;
top: 40px;
left: 0;
z-index: -1

}

.videoContainer video {
  /* Make video to at least 100% wide and tall */
  min-width: 100%; 
  min-height: 100%; 
  
  /* Setting width & height to auto prevents the browser from stretching or squishing the video */
  width: auto;
  height: auto;
  
  /* Center the video */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}


.BGvideo {

width: 100%;
	


}

.imagenBanner {
	background-color: #000000;
	width: 100%;
	height: 600px;
	overflow: hidden
}


/********************* Carousel fade ********************/


/*
inspired from http://codepen.io/Rowno/pen/Afykb 
https://stackoverflow.com/questions/26770055/bootstrap-carousel-fade-no-longer-working-with-maxcdn-3-3-bootstrap-min-css
*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
  transition-duration: 4s;
  transition-timing-function:linear;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
now override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

.carousel-inner .item {height: 600px}

/*********************** Verge3D ***********************/
.pepitoContainer {width:100%; height: 400px}
.pepitoContainer iframe {width: 100%; height: 600px; border:none}
.pepitoContainer v3d-container {width: 100%}
.pepitoContainer .interfazVerge {position: absolute; color: white; text-align: center; width: 100%; margin: 20px auto; filter: opacity(0.5)}

/*********************************************************/

/*============================================================*/
/******************* INTERFAZ DE USUARIO **********************/
/*============================================================*/

/**************** IMÁGENES *****************/
.cover {
  object-fit: cover;
  width: 50px;
  height: 100px;
}
/********************************************/

/************ TITULOS ***********/

/********************************/
/************** PADDINGS ***************/
/***************************************/
.paddingV30{padding:30px 0px}
.padding30{padding:30px;}
.paddingBottom30{padding-bottom:30px}

/************** MENUES ****************/
/**************************************/

/******** mainmenu ********/
.navbar{margin-bottom:9px}
.cabeceraMenu{background-color: #000;border: none;width: 100%;z-index: 1000;}
.cabeceraMenu .navbar-default {background-color: transparent;border: none;    font-family: 'Montserrat', sans-serif;color: #FFFFFF;font-weight: 500;}
.cabeceraMenu .navbar-default .navbar-nav>li>a, .cabeceraMenu .navbar-default a{color: #FFFFFF;}

.cabeceraMenu .navbar-default .navbar-nav>.active>a, .cabeceraMenu .navbar-default .navbar-nav>.active>a:hover, .cabeceraMenu .navbar-default .navbar-nav>.active>a:focus {color: #ca5279;background-color: transparent;border-bottom: 1px solid #50a9d8;}
/*** PRODUCTOS  */
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    z-index: 3;
    color: #fff;
    background-color: #ca5279;
    border-color: #ca5279;
    cursor: default;
}
.pagination-lg>li:first-child>a, .pagination-lg>li:first-child>span {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}
.HeaderPane .encabezado{height: 300px;background: url(/Portals/vsion/Images/bgSchool.jpg) bottom no-repeat;background-size: cover;}
#pID39631 .HeaderPane .encabezado {height: 400px;background: url(/Portals/vsion/ALBUM/3f8a1f5c-990b-4af0-aa29-45e3448925b5.jpg) center 86% no-repeat;background-size: cover;}
#pID39635 .HeaderPane .encabezado {background: url(/Portals/vsion/Images/bgCabeceraInterior.jpg) bottom no-repeat;background-size: cover;}
.breadcrumb>li a{color:#000;/*text-shadow: 0 1px 3px rgba(0,0,0,.4);*/}
.breadcrumb>.active {/*color: #fff;text-shadow:0 1px 3px rgba(0, 0, 0, 0.9);*/}

/****** HOME *****************/
#mID82565{height: 555px;overflow: hidden;position: relative;}
#mID82565 img{position:absolute;bottom:0}
#el-futuro{background:url(/portals/vsion/images/bgPuntos.jpg) no-repeat;min-height:585px;padding:100px 120px;background-size: cover;}
#el-futuro .claim{font-size: 27px;padding: 0px 80px;color: #727272;line-height: 42px;}
#el-futuro h3{text-transform:uppercase;text-align:center;font-size:42px;margin-bottom:50px;background: rgba(255,145,130,1);
background: -moz-linear-gradient(left, rgba(255,145,130,1) 0%, rgba(253,137,137,1) 34%, rgba(247,110,158,1) 47%, rgba(236,60,201,1) 71%, rgba(236,60,201,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,145,130,1)), color-stop(34%, rgba(253,137,137,1)), color-stop(47%, rgba(247,110,158,1)), color-stop(71%, rgba(236,60,201,1)), color-stop(100%, rgba(236,60,201,1)));
background: -webkit-linear-gradient(left, rgba(255,145,130,1) 0%, rgba(253,137,137,1) 34%, rgba(247,110,158,1) 47%, rgba(236,60,201,1) 71%, rgba(236,60,201,1) 100%);
background: -o-linear-gradient(left, rgba(255,145,130,1) 0%, rgba(253,137,137,1) 34%, rgba(247,110,158,1) 47%, rgba(236,60,201,1) 71%, rgba(236,60,201,1) 100%);
background: -ms-linear-gradient(left, rgba(255,145,130,1) 0%, rgba(253,137,137,1) 34%, rgba(247,110,158,1) 47%, rgba(236,60,201,1) 71%, rgba(236,60,201,1) 100%);
background: linear-gradient(to right, rgba(255,145,130,1) 0%, rgba(253,137,137,1) 34%, rgba(247,110,158,1) 47%, rgba(236,60,201,1) 71%, rgba(236,60,201,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9182', endColorstr='#ec3cc9', GradientType=1 ); -webkit-background-clip: text;  
  -webkit-text-fill-color: transparent;  }

#vsion-school{background: url(/portals/vsion/images/bgSchool.jpg) bottom no-repeat;padding: 150px 0 285px;color: #fff;background-size: cover;}
#vsion-school img{max-height:150px;margin-bottom:50px}
#vsion-school .vsion-art{margin-right: 80px;}
#vsion-school p.claim-art{font-size: 24px;padding: 0 90px 0 175px;line-height: 45px;font-style: italic;clear: both;}
#vsion-school .vsion-dev{margin-left: 80px;}
#vsion-school p.claim-dev{font-size: 24px;padding: 0px 205px 0 90px;line-height: 45px;font-style: italic;clear: both;}

#nuestros-trabajos{background:#dddddd; color:#fff;text-align:center;padding:60px 0}


#lista-trabajos{background:url(/portals/vsion/images/bgTrabajos.jpg) bottom no-repeat;background-size: cover;color:#fff;text-align:center;padding:160px 0 240px}
#lista-trabajos .slider-clientes{}
#lista-trabajos .slider-clientes img{}
#lista-trabajos h2{}

#nuestros-clientes{padding:60px 0}
#nuestros-clientes .slider-clientes{padding:20px 0}
#nuestros-clientes .slider-clientes img{max-height:145px;vertical-align:bottom;margin-bottom:15px}
#nuestros-clientes p.claim{color: #000;font-size: 31px;font-style: italic;padding-top: 20px;line-height: 42px;}
#nuestros-clientes .fila-opinion img{max-width:205px}

#conocenos{background:url(/portals/vsion/images/bgStudio.jpg) no-repeat;background-size: cover;min-height:705px}
#conocenos p.claim{padding-left: 70px;font-size: 42px;color: #fff;text-shadow: 2px 2px #000000;padding-top: 150px;padding-right: 80px;margin-bottom: 40px;font-family: 'Montserrat', san-serif;line-height: 60px;font-weight: bold;}
#conocenos .conocenos{font-size: 32px;color: #fff;text-shadow: 2px 2px #000000;text-transform: uppercase;font-family: 'Montserrat', san-serif;text-align: center;padding-top: 15px;}
#conocenos .conocenos a{color: #fff;font-weight:600}
/************* BLOG ********************/
.blog {}

/*.blog .imagen {height:300px; overflow:hidden;}*/
.blog .imagen img {border:1px solid #dddddd}

.detalleNoticia .descripcion img {width:100%; margin-bottom:20px; margin-top}
.wrapperBlogItem {margin-top:40px}
.articulos {overflow:hidden}
.articulos h2 {margin-top:0px; padding-top:0px}

.article_title a{
	font-family: 'Montserrat', sans-serif;
	font-weight: 600 !important;
    color: #000;
    font-size: 15px;
	text-transform: uppercase;
    text-align: justify;
}

.col-sm-6 .article_title a{font-size: 21px;}
.blog_latest article .meta .article_type {
    height: 70px;
    color: #fff;
    line-height: 70px;
    text-align: center;
    font-size: 33px;
}

.format-standard .article_type {
    background-color: #0087d1;
}



#mID82560 .article_content.textLight{background: #FFFFFF;
    border: 1px solid #E0E0E0;
    padding: 20px;
    -webkit-box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);
    box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);}

.article_container {margin-bottom:30px; border-bottom:1px solid #E0E0E0}

.articulos ul{padding:0 !important; margin:0 !important}
.articulos ul li{
	list-style:none;
	margin-bottom:20px;
	background:#FFFFFF;
	border:1px solid #E0E0E0;
	padding:20px;
	-webkit-box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);
	-moz-box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);
	box-shadow: 5px 6px 15px 1px rgba(0,0,0,0.1);
	

}

.articulos ul li:hover {
	background:#C4383F;
		
	}
.articulos ul li:hover a {color:#ffffff; text-decoration:none}

.articulos ul li a {color:#212121; }

.blog_latest article .meta {
    width: 70px;
    float: left;
}
.article_author {margin-right:20px; font-weight:bold}
.article_categories {font-weight:bold}

.article_date {background:#3B3B3B; color:#FFFFFF; padding:14px; width:fit-content; font-size:14px; font-weight:bold }

article .meta {
    width: 70px;
    float: left;
}

.detalleNoticia h2.titulo{margin-top:0;margin-bottom: 15px;}
.blog h3.article_title{margin: 10px 0 20px;height: 50px;overflow:hidden}
.detalleNoticia .addthis{margin-bottom:15px}
.article_type {display:none}
.blog .article_title a {font-weight: 100;}
.arrowLink {font-weight:bold; color:#000000}

.arrowLink:before {
    content: '\e804';
}
.breadcrumb{margin-top: 30px;padding: 0;font-size: 18px;color: #000;line-height: 37px;padding: 10px;}

.navDetalle{margin-bottom: 50px;margin-top: 15px;}
.detalleBlog .imagen{margin-bottom:30px}

.pagination-lg>li>a, .pagination-lg>li>span {
    padding: -3px 10px;
    font-size: 18px;
}
.tagsCategories{margin: 0 15px 5px 0;background-color: #b34e95;padding: 3px 10px;display: inline-block;font-size: 12px;color: #fff;}
.detalleProyecto{margin-bottom: 100px}
.detalleProyecto h2{font-weight: 900;}
.detalleProyecto .descripcion{font-size: 18px;line-height: 27px;}
.detalleProyecto .resumen{    font-weight: bold;line-height: 27px;margin: 15px 0;}
.detalleProyecto .descripcion p{line-height:27px;}
.galeriaAsociada h3{    margin: 0 0 15px 15px;
    font-weight: bold;}
.infoDatosProyecto{}
.infoDatosProyecto>div{margin-bottom:20px;font-size:21px;line-height:27px}
.detalleNoticia .resumen{font-weight:500; margin-bottom:20px; line-height:1.7em; text-align:justify}
.detalleNoticia .descripcion {margin-top:40px;    line-height: 27px;}
.listadoNoticiasresumen{font-weight:500; margin-bottom:20px; line-height:1.7em; text-align:justify;height: 110px;overflow:hidden}

.descripcion ul{margin-left:50px}
.descripcion ul li {margin-bottom: 5px;list-style-type: disc;font-size: 16px;}

.descripcion h3 {font-size:24px}

.pieFoto {margin-bottom:20px}

.lead {background:#eaeaea}
.lead img{margin:auto;}

.listado-proyectos {color: #131313}
.listado-proyectos .tloSeccion {}
.listado-proyectos h2 {margin-bottom:30px}
.listado-proyectos .nombre a {font-size: 22px; color: black; }
.listado-proyectos .resumen {line-height: 24px;}
.listado-proyectos .wrapperItem {margin-bottom: 40px}
.article_container{margin-top:30px;min-height: 390px;}
.listadoProyectosresumen{margin: 15px 0;}
.listadoProyectosresumen .imagen {height:200px}
.container.caja, .container.caja p{line-height: 27px;text-align: justify;}
p.claim{font-size: 24px;line-height: 32px;text-align: center;padding: 40px 130px;}
h2.tloSeccion{font-weight:900;font-size:42px;margin-top:30px}
.gridItem {height:400px; overflow: hidden; margin-bottom: 100px; border-bottom: 1px solid #E0E0E0}
/***************************/
.newsletter {font-weight:100; color:#000000!Important}
/************* DETALLE PRODUCTO ************/

/************* FORMULARIOS ************/

/************* FORMULARIOS ************/

/************* CABECERAS INTERNAS ************/
.textoCabeceraHome h2 {
	color: #FFFFFF;
    position: relative;
    top: 530px;
	font-weight:300; 
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 1); 
}
.cabeceraInterna{}
/************* CABECERAS INTERNAS ************/
#listaServicios{}
#listaServicios .itemServicio{    height: 330px;
    overflow: hidden;
    margin-bottom: 25px;}
#listaServicios .itemServicio h2{font-size: 20px;margin-bottom: 15px;    font-weight: 600;}
#listaServicios .itemServicio img{    width: 150px;
    margin: auto;
    margin-bottom: 15px;}
#listaServicios .itemServicio p{line-height: 24px;text-align: center;font-size: 15px;}

.equipoPage{}
.equipoPage .infoSchool{}
.equipoPage .infoSchool h2{font-weight: 600;font-size: 37px;margin-bottom: 15px;}
.equipoPage .infoSchool p{margin-bottom: 20px;line-height: 27px;font-size: 18px;}
.equipoPage .infoSchool ul{margin-left: 60px;line-height: 32px;}
.equipoPage .infoSchool ul li{list-style-type: disc;}
.nosotrosFoto {height:300px; overflow: hidden}

#listaServicios{}
#listaServicios .itemEquipo{padding:15px;background-color:#fff;margin-bottom:30px}
#listaServicios .itemEquipo .imagen{height:212px; overflow: hidden}
#listaServicios .ceoVsion  .itemEquipo .imagen{height:350px; overflow: hidden}
#listaServicios .itemEquipo h2{margin: 10px 0;font-size: 21px;font-weight:600}
#listaServicios .ceoVsion .itemEquipo{}
.listaTrabajosAlumnos{margin-bottom:30px}
.infoTrabajoAlumnos{margin-top:30px}
.infoTrabajoAlumnos p.claim{font-size: 24px;line-height: 37px;text-shadow: 0 1px 3px rgba(0,0,0,.4);color:#fff}
.infoTrabajoAlumnos h3{    font-weight: bold;margin-top: 70px;font-size: 42px;text-shadow: 0 1px 3px rgba(17, 17, 25, 0.4);color: #ca5279;}
.escuelaContainer{background: url(/portals/vsion/images/phobos.jpg) bottom no-repeat; background-size: cover}
.escuelaContainer .claim {color:#FFFFFF; margin-bottom: 40px}
.escuelaContainer .tloSeccion {color:#fff; margin-top: 40px}
.row.escuelaBloque{background-color: #fff; padding: 25px;}
.equipoContainer{padding:80px 0 0}

.franjaNegra{margin: 100px 0 40px;background-color: #000;padding: 50px 0 0 0;color: #fff;line-height: 24px;}
.franjaNegra h2{margin-bottom: 15px;font-weight: 600;font-size: 42px;}
.franjaNegra p{line-height: 32px;font-size: 18px;}
.franjaNegra p.firma{font-family: 'Montserrat', sans-serif;line-height: 35px;font-size: 27px;}

.wrapperFormulario{background-color: #ececec;padding: 15px;}
.datosProtec{margin-top:40px;font-size:15px}
.datosProtec table{}
.datosProtec table tr{    border: 1px solid #d2d1cf;background-color: #fdfdfd;}
.datosProtec table tr td{padding:3px 10px}
.wrapperFormulario .condiciones {margin: 25px 0 20px !important;}
/************** GALERÍA ***************/
.grid  {

	margin:0 0 30px 0;
	padding:0;
	column-count: 3;
    -webkit-column-count: 3;
    column-gap: 0;
    -webkit-column-gap: 0;
	
  }
  
.grid li{
		list-style:none;
		transition: .8s opacity;
		margin:10px;
}

.grid img { 
	width: 100%;
	transition: .8s opacity;
}
.grid:hover img {
	opacity: 0.3;
}
.grid:hover img:hover {
	opacity: 1;
	cursor:pointer
}

.grid li:first-child {
    margin-top: 0px !important;
}



/************ FIN GALERÍA **************/
.imagenSeccionCabecera{background: url(/Portals/vsion/images/cabeceras/apps.jpg) no-repeat;background-size: cover;}
.imagenSeccionCabecera.homePage{height:100%; background: none/*background: url(/Portals/vsion/Images/Pepito.jpg) no-repeat;background-size: cover;height: 680px;*/}
.imagenSeccionCabecera.UsPage{background: url(/Portals/vsion/Images/bgCabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.ProjectsPage{background-image: url(/Portals/vsion/Images/cabeceras/vsion_proyectos.jpg); background-size: cover; background-position:center -400px}
.imagenSeccionCabecera.NewsPage{background: url(/Portals/vsion/Images/bgCabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.ContactPage{background: url(/Portals/vsion/Images/bgCabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.AppsPage{background: url(/Portals/vsion/images/cabeceras/apps.jpg); background-size: cover;}
.imagenSeccionCabecera.schoolPage{background: url(/Portals/vsion/Images/bgCabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.cabeceraInterna.cabecera-proyecto-RiverUp{background: url(/Portals/vsion/Images/cabeceras/xuca_cabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.cabeceraInterna.cabecera-proyecto-Dinojitos{background: url(/Portals/vsion/Images/cabeceras/dinojitos_cabecera.jpg); background-size: cover;}
.imagenSeccionCabecera.cabeceraInterna.cabecera-proyecto-TierraDinosaurios{background: url(/Portals/vsion/Images/cabecera.jpg) top center no-repeat;background-size: cover;height:450px}
.imagenSeccionCabecera.cabeceraInterna.cabecera-proyecto-CuencaParaTi{background: url(/Portals/vsion/Images/cabeceras/ave_cabecera.jpg) top center no-repeat;background-size: cover}
.imagenSeccionCabecera.cabeceraInterna.UsPage{background: url(/Portals/vsion/Images/cabeceras/vsion_studio.jpg) top center no-repeat;background-size: cover;    height: 400px;}
.imagenSeccionCabecera.cabeceraInterna.cabecera-ciudad-suenos{background: url(/Portals/vsion/Images/cabeceras/ciudadSuenos_cabecera.jpg) top center no-repeat;background-size: cover;    height: 400px;}



.imagenSeccionCabecera h1{color: #fff;font-weight: 300;font-size: 56px;padding: 200px 0 40px 0px;text-shadow: 2px 2px #000000;}
.imagenSeccionCabecera h1 strong{color: #0096b3;}
.imagenSeccionCabecera.homePage h1{color: #fff;font-weight: 300;font-size: 42px;padding: 400px 0 100px 0px;line-height: 59px;}



/**** HOME *******/
.bloqueNegro{background-color:#000;padding:80px 0;color:#fff}
.bloque{padding:80px 0;}
#vsion-studio-presentacion p{font-size: 18px;line-height: 32px;}
h2.tloSombrero{margin-bottom: 30px;}
h2.tloSombrero span{padding-top: 20px;border-top: 5px solid #7a3367;}

#serviciosHome .bloqueNegro{padding: 0}
#serviciosHome{}
#serviciosHome p{font-size: 18px;margin-top: 80px;padding: 0 30px;}
#serviciosHome h2{margin-top: 60px;text-transform: uppercase;padding: 0 30px;}

.seccionVR {height:800px; overflow:hidden; position: relative; padding: 50px 0}
.seccionAR {height:800px; overflow:hidden; position: relative; padding: 50px 0}

.videosInicio .texto {padding:40px 80px; background-color:hsla(0,0%,0%,0.67); color: white; z-index: 1; top: -800px; position: absolute}
.CTA{margin:80px auto; width: 75% }
.CTA p{font-size: 32px; line-height:150% !important}
/******* APPS *****/
.pasosDiseno{}
.pasosDiseno p.claim{padding: 10px 40px;}
.pasosDiseno .item{margin-bottom:20px}
.pasosDiseno .item h4{font-size: 24px;text-transform: uppercase;font-weight: bold;line-height: 67px;vertical-align: middle;}
.pasosDiseno .item h4 strong{font-size: 48px;vertical-align: middle;}
.pasosDiseno .item p{line-height: 27px;font-size: 21px;}
.bloqueResumenVS{background-color: #000;padding: 25px;margin-bottom: 100px;margin-top: 100px;color: #fff;}
.cajaGris{background-color: #ededed;padding: 25px;margin: 50px 0;text-align: center;}
.cajaGris h3{margin: 15px 0 5px;font-size: 21px;font-family: "Roboto Slab", serif;}
.cajaGris h4{font-family: "Roboto Slab", serif}
.cajaGris p{margin-top: 10px;line-height: 24px;}
.bloqueMoradoVS{background-color: #aa458d;padding: 25px;margin: 100px 0 70px;}
.bloqueAzulVS{background-color: #4f75a6;padding: 25px;margin: 100px 0 70px;}
.bloqueAzulVS.AppDestacada{margin-bottom:0px}
.AppDestacada{color:#fff}
.AppDestacada h2{font-weight: 700;font-size: 32px;margin-top: 50px;}
.AppDestacada h3{font-weight: 100;margin-bottom: 30px;padding-left: 30px;}
.AppDestacada p{line-height: 32px;font-size: 21px;margin: 20px 0 40px;}
.AppDestacada .logoCliente img{margin-top: 50px;}

.bloqueFrase{padding: 120px;font-size: 24px;line-height: 37px;}
.bloqueFrase p{line-height: 42px;}
h2.tloSombrero.escuelaVS span {border-top: 5px solid #0096b3;}

.espacioBloques{margin-top: 50px;margin-bottom: 50px;}

.espacioMateriasAnimacion{position:relative; margin-bottom: 200px}
.espacioMateriasAnimacion .item {height:400px; width:100%}
.espacioMateriasAnimacion .item.photoshop{background:url("/Portals/vsion/Images/itemPs.jpg"); background-size: cover;}
.espacioMateriasAnimacion .item.blender{background:url("/Portals/vsion/Images/Aquis2.jpg"); background-size: cover;}
.espacioMateriasAnimacion .item.unity{background:url("/Portals/vsion/Images/itemApps.jpg"); background-size: cover;}
.espacioMateriasAnimacion .item.unreal{background:url("/Portals/vsion/Images/concept2.jpg"); background-size: cover;}
.espacioMateriasAnimacion{margin-top:50px}

.logoSoftware {
	margin: auto;
    width: 150px;
}


.espacioMateriasAnimacion .item{padding:60px}

.espacioMateriasAnimacion .item h2 {text-align:center}

#proyectosHome{background:padding-top: 300px; padding-bottom:50px}
.wrapperNoticiasHome{background-color: #fff;
    padding: 50px 50px 20px;
    color: #000;
	overflow:hidden
}
.wrapperNoticiasHome h4{font-size: 21px;margin-bottom: 15px;line-height: 32px;height: 60px;overflow: hidden;}
.wrapperNoticiasHome p{font-weight: 400;
    margin-top: 18px;
    line-height: 32px;
    text-align: justify;}
.wrapperNoticiasHome .carousel-inner {height: 400px;}
.titanosaurio {width:750px; height: 400px; right: 0; position: absolute; margin-top:20px; background: url("/Portals/vsion/Images/Lohuecotitan.png"); background-repeat: no-repeat; background-size: cover}
.logoPartner .st0{fill: red !important;}
.st0 {fill: red !important;}
/* BANNERS */
/* Layout 1 */

.layoutBanners{margin-top:50px;margin-bottom:50px}
.layoutBanners .itemBanner img {display: block;width: 100%;height: auto;}
.layoutBanners .itemBanner{position:relative}
.layoutBanners .itemBanner .overlay {position: absolute;top: 0;bottom: 0;left: 0;right: 0;height: 100%;width: 100%;opacity: 0;transition: .5s ease;background-color: #CF1839;}
.itemBanner:hover .overlay {opacity: 1;}
.layoutBanners .itemBanner .text {color: #fff;font-size: 20px;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);text-align: center;}
.layoutBanners .itemBanner a.linItem{display: block;position: absolute;width: 100%;height: 100%;z-index: 99;left: 0;top: 0;color: transparent!important;background-color: transparent!important;margin: 0!important;padding: 0!important;text-decoration: none;cursor: pointer;}
.layoutBanners h3{padding: 5px;background-color: #242424;font-size: 21px;text-align: center;margin-top: 0px;color:#CF1839;}
.layoutBanners h3 a{color:#fff;}
.layoutBanners h3 a:hover{color:#ae0e2c;text-decoration:none}

/* Layout 2 */
.bannersLayout2{margin-top: 50px;}
.bannersLayout2 .row.no-gutters {margin-right: 0;margin-left: 0;}
.bannersLayout2 .row.no-gutters > [class^="col-"],
.bannersLayout2 .row.no-gutters > [class*=" col-"] {padding-right: 0;padding-left: 0;}
.bannersLayout2 .Banners2 a {padding: 1px;display: block;}
.bannersLayout2 .Banners2ImageContainer {height: 350px;}
.bannersLayout2 .Banners2Image {display: block;object-fit: cover;height: 100%;width: 100%;font-family: 'object-fit: cover';}
.bannersLayout2 .Banners2Content {position: absolute;top: 32%;width: 100%;text-align: center;color: #fff !important;z-index: 11;}
.bannersLayout2 .Banners2Title {font-size: 1.5em;font-weight: 600;line-height: 24px;}
.bannersLayout2 .Banners2Subtitle {font-size: 1.0em;margin-top: 1em;padding: 0 15px;
    line-height: 24px;}
.Banners2ImageContainer::after {background-color: rgba(0, 0, 0, 0.4);content: '';height: 100%;left: 0;opacity: 1;position: absolute;top: 0;transition: 0.3s;width: 100%;z-index: 10;}
.bannersLayout2 .Banners2 > a:hover .Banners2ImageContainer::after {background-color: rgba(0, 0, 0, 0.2);}
.bannersLayout2 .Banners2Content::after {background-color: #ffffff;content: '';height: 1px;left: calc(50% - 2rem);position: absolute;bottom: -2rem;transition: 350ms ease;width: 4rem;}

/* Layout 3 */
.Banners3{margin-top:80px}
.Banners3 .bx-wrapper {-moz-box-shadow: none;-webkit-box-shadow: none;box-shadow: none;border: none;}

/************* SECCIONES TEXTO: AVISO LEGAL, COOKIES, CONDICIONES COMPRA ************/
.contenidoTexto p{margin: 20px 0px;}
.contenidoTexto a{}
.contenidoTexto h4{font-weight: bold;font-size: 21px;}
.contenidoTexto ul{margin-left:40px}
.contenidoTexto ul li{margin-bottom:10px}

/************* SECCIONES TEXTO ************/
/************************************************/
/******** fin mainmenu ********/


/************ FIN MENUES **************/
/**************************************/

/******* Headings - titulos ********/
/******* Fin Headings - titulos ********/

/******** Listas ********/
.lista li {
	margin-left: 10px;
	margin-bottom: 10px;
	padding-left: 20px;
	text-align: left;
}

.listaColumna {
	float:left
}

.tablaGroup h1 {
font-size: 28px;
margin: 0 0 10px 0;
padding: 0;
font-weight: 500;
color: #86754d;
}
/******** FIN LISTAS ********/



/******** BOTONES *********/
.btn {text-transform:uppercase}
.btn-transparent {
	
-webkit-box-shadow: inset -8px 6px 36px -17px rgba(0,0,0,0.18);
-moz-box-shadow: inset -8px 6px 36px -17px rgba(0,0,0,0.18);
box-shadow: inset -8px 6px 36px -17px rgba(0,0,0,0.18);
	padding:18px 40px;
	border:1px solid #DCDCDC
}

/******** FIN BOTONES ********/


/******** FORMULARIOS ********/

.fade{display:none;}
.seccionFormulario{margin:50px 0;font-size: 21px;line-height: 27px;}
.seccionFormulario h2{font-size: 24px;margin-bottom: 15px;font-weight: 900;}
.seccionFormulario .form-control{border-radius:0;margin-bottom:15px}
/****** FIN FORMULARIOS ******/


/********** ICONOS ***********/

/******** FIN ICONOS ********/



/******** VER TODOS / VER MÁS ********/

/****** FIN VER TODOS / VER MÁS ******/

/********* BREADCRUMBS **********/

/********** MAQUETACIÓN TEXTOS *************/

/*******************************************/

/*============================================================*/
/******************* FIN INTERFAZ DE USUARIO ******************/
/*============================================================*/


.adminBar {z-index:11; position:relative}
.adminBar>div{float: left;margin-right: 50px;margin-top: 15px;}
.adminBar .accesoUsuarios{color:#948664}
.adminBar>div span{margin-left:10px;}
.cabecera {z-index:10; background:#FFFFFF; /*width:100%*/left: 0;right: 0;padding: 0 50px;}
.cabecera .shareCabecera{border-right: 1px solid #ddd;margin-right: 25px;border-left: 1px solid #ddd;padding-left: 20px;padding-right: 25px;}
.cabecera .idiomas .itemSelected{font-weight:bold}

/*============================================================*/
/************************* FIN CABECERA ***********************/
/*============================================================*/

/*============================================================*/
/************************* CONTENIDO *************************/
/*============================================================*/
.carousel-inner {height:600px; position:static !important}
.carousel-inner>.active{position:static !important}


.itemCliente{height: 140px;}
.itemCliente img{transform: translateY(-50%);
    position: relative;
    top: 50%;}
p.informacionHome{text-align: justify;padding: 0;margin-bottom: 30px;font-size: 18px;line-height: 32px;}
#nuestros-acuerdos{margin-bottom:50px}
/*********************** CONTACTO ******************************/

/******************** FIN CONTACTO *****************************/

/*============================================================*/
/************************ FIN CONTENIDO ***********************/
/*============================================================*/

/*============================================================*/
/************************** PIE *******************************/
/*============================================================*/
#pie{padding: 45px 0 45px 0;background: #000 url(/portals/vsion/images/bgpie.png) bottom no-repeat;line-height:32px ;font-family: 'Montserrat', sans-serif;color: #FFFFFF;font-size: 18px;}
#pie a {padding-left: 0;color:#FFFFFF;font-weight: 300;}
#pie ul.azulVS a {color:#0096b3;}
#pie ul.moradoVS a {color:#a85498;}

.pie .copyright{font-size: 14px;line-height: 24px;margin-top:20px}
.pie .redesPie{font-weight:100;margin-top: 20px;}
.pie ul {font-size:15px}
/*============================================================*/
/************************** FIN PIE ***************************/
/*============================================================*/

/*============================================================*/
/******************* CLASES PERSONALIZADAS ********************/
/*============================================================*/


/************* maquetación textos *******************/

/************* fin maquetación textos *******************/


/********************************************************************************** GESTIÓN ****************************************************************************/

/************* Cookies ***************/
#stickyFooter{
    position:fixed;
    width:100%;
	left:0;
	margin:auto;
	bottom:-25000px;
    height:0px;
    background:#333;
    text-align:center;
    color:#fff;
	z-index:1000;
	padding-top:3px;
}
#stickyFooter p{padding:20px;}
#stickyFooter a{color:red}

.aceptarCookies{
	background-color: #4d90fe;
	background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed);
	border: 1px solid #3079ed;
	border-radius: 2px;
	color: #fff;
	cursor: default;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	height: 20px;
	line-height: 20px;
	margin-right: 0px;
	min-width: 26px;
	outline: 0;
	padding: 0 8px;
	text-align: center;
	white-space: nowrap;
}

.aceptarCookies:hover{
	background-color: #357ae8;
	background-image: -webkit-linear-gradient(top,#4d80fe,#357ae8);
	border: 1px solid #2f5bb7;
	border-bottom-color: 2f 5bb 7;
}

/*****************************/
.MobileChangeToMobileButton a{color: #000;text-decoration: underline;font-weight: bold;}


/*  =====================================================
    =            Bootstrap 3.3 Media Queries            =
    =====================================================   */
@media only screen and (min-width : 1200px) {
	.navbar-brand img {width:250px !important}

}

@media only screen and (min-width : 992px) and (max-width: 1199px) {
	.navbar-brand img {width:250px !important}
	.imagenBanner {height:400px}
	
}

@media only screen and (min-width : 768px) and (max-width: 991px) {
		.navbar-brand img {width:200px !important}
		.imagenBanner {height:300px}
}

@media only screen and (max-width : 767px) {
	.navbar-brand img {width:200px !important}
	p.claim {
		font-size: 21px;
		padding: 0;
	}
	.imagenSeccionCabecera h1 {font-size: 32px;padding: 54px 0 40px 0px;}
	.wrapperFormulario {background-color: #fff;padding: 0px;}
	#mapaInicio #map{height:280px !important}
	/*.imagenSeccionCabecera.homePage {height: 300px;background: url(/Portals/vsion/Images/Pepito.jpg) -117px 0px no-repeat;background-size: cover;}*/
	.videoContainer{height: 0;display:none;}
	.bloqueFrase p {line-height: 29px;}
	.bloqueFrase {padding: 20px 0px; font-size: 20px;}
	#nuestros-clientes .slider-clientes img {max-height: 90px;}
	#serviciosHome p {font-size: 18px;margin-top: 20px;}
	#serviciosHome h2 {margin-top: 60px;text-transform: uppercase;padding: 0 30px;font-size: 21px;}
	.wrapperNoticiasHome {padding: 15px;}
	.espacioMateriasAnimacion {margin-bottom: 0;}
	.titanosaurio{display:none}
	#serviciosHome {}
	.wrapperNoticiasHome .carousel-inner{height:auto !important}
	.imagenBanner {height:200px}
}