@import url(https://fonts.googlepis.com/css?family=Open+Sans);

/* Clases para la pagina nosotros.html
   INICIO */

.nosotros{
    position: fixed;
    padding: 10px;
    top: 10%;
    width: 100%;
    height: 73%;
    z-index: -50;
    overflow: auto;
    box-sizing: border-box;
}

.cuerpoizquierdo{
    position: fixed;
    height: 70%;
    width: 34%;
    top: 12%;
    overflow-y: auto;
    box-sizing: border-box;
    font: 85%/1.5  Verdana, 'Trebuchet MS', arial, sans-serif;

}
.cuerpomedio{
    position: fixed;
    height: 70%;
    width: 25%;
    top: 12%;
    left: 38%;
    overflow-y: auto;
    box-sizing: border-box;
    font: 85%/1.5  Verdana, 'Trebuchet MS', arial, sans-serif;
}
.detalleproduct{
    position: fixed;
    padding: 20px;
    height: 65%;
    width: 46%;
    top: 12%;
    left: 20px;
    overflow-y: auto;
    box-sizing: border-box;
    font: 80%/1.5  Verdana, 'Trebuchet MS', arial, sans-serif;
    color: black;
    background-color: #fff;
    z-index: -100;
    opacity: 0.65;
}
.portafolio{
    position: absolute;
    height: 60%;
    width: 50%;
    left: 80%;
    top: 40%;
}
.titulo{
    color: red;
    margin-top: auto;
    text-align: center;
}
.linea{
    height: 2px;
    background-color: #fff;
}

.videoti{
    position: absolute;
    max-width: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: -50;
}    
.videot2{
    position: fixed;
    margin-top: 315px;
    max-width: 28%;
    max-height: 28%;
    top: 160px;
    left: 670px;
    transform: translateX(-50%) translateY(-50%);
}    
.parrafo1{
    /* background-color: #081323; */
    background-color: #fff;
    text-align: justify;
    color: black;
    margin-left: 10px;
    margin-right: 10px;
    opacity: 0.50;
}
.parrafoproduct{
    font-size: 100%;
    color: black;
    margin-left: 30px; 
    text-align: justify; 
}

.mapa{
    position: fixed;
    height: 300;
    width: 400;
    left: 65%;
    top: 28%;
    border: 2px solid green
} /*FIN*/

/* Clases para la Página de servicios educativos 
   INICIO */

.eduserv{ /* DIV Contenedor */
    position: absolute;
    padding: 0;
    height: 100%;
    width: 100%;
    top: 70px;
    left: 0%;
    box-sizing: border-box;
    font: 80%/1.5  Verdana, 'Trebuchet MS', arial, sans-serif;
    opacity: 1;
    z-index: -100;
    /*background-image: url("../images/fondo.jpg") no-repeat;*/
}

.papeltapiz{
    height: 130%;
    z-index: -1000;
}

.mkt{
    position: fixed;
    float: right;
    right: 5px;
    top:260px;
    width:25%;
    height:250px;
    /* right:-310px; */
}

.desserv{ 
    position: relative;
    padding: 30px;
    /* border: greenyellow 2px solid; */
    width: 74%;
    height: 100%;
    top:0px;
    box-sizing: border-box;
    opacity: 0.85;
    z-index: 0;
}
.frmcontacto{
    position: fixed;
    top: 480px;
    left: 98%;

}
.fondotab{
    background-image: url("../images/fondo.jpg") no-repeat; 
}

.fondobody{
    background-color: #081323;
    background: url("../images/fondo.jpg") no-repeat center fixed;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size: cover;
}

.imgfondo{
    z-index:-500;
}
.imagen{  /* Estilo del DIV */
    position: absolute;
    padding: 5px;
    height: 95%;
    width: 50%;
    top: 1%;
    left: 0%;
    box-sizing: border-box;
    opacity: 1;
} 
.edulogin{
    position: fixed;
    float: right;
    right: 0px;
    top: 75px;
    width: 25%;
    height: 200px;
    box-sizing: border-box;
    overflow: auto;
    word-break: break-all;
} /* FIN */

/*  Clases para pagina de llenado de ficha de solicitud de inscripcion para colegios 
    INICIO */

.fichacolegio{
    position: absolute;
    box-sizing: border-box;
    padding: 15px;
    height: 95%;
    width: 40%;
    right: 5%;
    overflow-y: auto;
    background-color: white;
}

.registracolegio{
    position: absolute;
    box-sizing: border-box;
    padding: 15px;
    height: 95%;
    width: 50%;
    right: 5%;
    overflow-y: auto;
    background-color: white;
}

.fila{
    height: 30px;
}

/* Configuracion de resoluciones para la pagina nosotros.html */

 @media screen and (max-width:1200px){
     .mapa{
         display: none;
     }
 }

 @media screen and (max-width:500px){
    .detalleproduct{
        width: 90%;
    }
    .imagen{
        top: 1%;
        left: 25%;
    }
    .eduserv{
        height: 210%;
        width: 120%;
        z-index: -500;
    }

    .desserv{
        top: 258px;
        width: 98%;
        height: 100%;
        left: 5px;
    }
    .edulogin{
        position: relative;
        width: 300px;
        height: 200px;
    }
    .mkt{
        display: none;
    }

    .imgfondo{
        display: none;
    }

    .papeltapiz{
        width: 125%;
    }

}