#main {
  width: 100vw;
  height: auto;
  font-family: "U-R";
  font-size: 0.85vw !important;
  background-color: transparent;
  margin-bottom: 5vw;
  overflow-x: hidden;
}
section {
  width: 100vw;
  /*height: 45vw !important;*/
  /*border: 1px solid yellow;*/
}

#nosotros{
    margin-bottom: 3vw;
    /*background-color: #131927;*/
}

#nosotros .front {
    width: 100%;
    height: 40vw;
    overflow: hidden;
    left: 0;
    opacity: 0;
    z-index: 1;
}

#nosotros:before{
    position: absolute;
    width: 120%;
    height: 100%;
    left: 0;
    top: 0vw;
    display: block;
    content: "";
    background-color: black;
    opacity: 1;
}

#nosotros .front img{
    width: 100%;
    height: auto;
    top: -35%
}


#nosotros .front :before{
    position: absolute;
    width: 100%;
    height: 5vw;
    top: 0;
    left: 0;
    display: block;
    content: "";
   
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0.3925945378151261) 0%, rgba(0,0,0,0.5) 4%, rgba(0,0,0,0.6) 8%, rgba(0,0,0,0.8) 19%, rgba(0,0,0,0.9) 31%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.8995973389355743) 70%, rgba(0,0,0,0.8071603641456583) 81%, rgba(0,0,0,0.6) 92%, rgba(0,0,0,0.5326505602240896) 95%, rgba(0,0,0,0.39539565826330536) 100%);
    z-index: 1;
}

#nosotros div{
    width: 100%;
    height: 20vw;
    bottom: 0;
}

#nosotros div h1 {
    width: 51%;
    /*height: 89%;*/
    padding: 2vw 3%;
    margin-right: 3vw;
    color: white;
    font-family: "U-B";
    font-size: 350%;
    letter-spacing: 0.75vw;
    text-align: right;
    border-bottom: 1vw solid #e9851e;
    border-radius: var(--border-radius);
    /*top: 1vw;*/
    left: -51%;
    z-index: 1;
    /*background-color: black;*/
}

#nosotros div p {
    float: right;
    width: 80%;
    height: auto;
    left: -10vw;
    bottom: 0vw;
    padding: 2vw 1.5vw !important;
    margin-top: -10% !important;
    color: white;
    font-size: 120%;
    /* letter-spacing: 0.3vw; */
    text-align: justify;
    z-index: 1;
}


.bg{
    width: 100%;
    /*height: 40vw;*/
    top: 35vw;
    left: 0;
    /*overflow: hidden;*/
    /*z-index: -1;*/
}

.bg img{
    width: 130%;
    height: auto;
    left: -30%;
    top: -50%;
}

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

.show:before{
    
    opacity: 0 !important;
    z-index: -1 !important;
}

.show span{
    opacity: 1 !important;
}

.show div h1 {
    left: 0 !important;
}

.show div p{
    /*left: -3vw !important;*/
    bottom: -9vw !important;
    /*z-index: 1 !important;*/
}




/*///////////////////////////////////////////////////////////////////////*/
/*//////////////////////////mision-vision////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/

#mision-vision{
    height: auto !important;
}

#mision-vision div {
    float: right;
    width: 32%;
    height: 50%;
    margin: 0 11.5% !important;
    border-top: 0.5vw solid orange;
    border-bottom: 0.5vw solid orange;
    border-radius: var(--border-radius);
    /* transform: scaleY(0); */
    color: white !important;
    z-index: 2;
}

.focus-mv div{ 
    transform: scaleY(1) !important;
}


#mision-vision div > span{
    color: white;
    width: 100%;
    height: 100%;
    padding: 3vw 0 !important;
}

#mision-vision div > span:nth-child(2){
    float: right;
}

.focus-mv div span{  
    color: white !important; 
}

#mision-vision div span span:nth-child(1){
    width: 100%;
    height: 27%;
    margin-bottom: 0.5vw !important;
    letter-spacing: 0.3vw;
    font-size: 350%;
    text-align: center;
}

#mision-vision div span span:nth-child(2){
    
    width: 100%;
    height: 72%;
    font-size: 120%;
    text-align: justify;
}






/*///////////////////////////////////////////////////////////////////////*/
/*//////////////////////////objetivos-servicios//////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/

#objetivos-servicios{
    height: 45vw;
    margin-top: 5vw !important;
    background-color: black;
    /*z-index: -1;*/
}

#objetivos-servicios div {
    position: absolute;
    width: 90%;
    height: auto;
    margin: 5% 5% !important;
    margin-top: 4% !important;
    z-index: 2;
}

#objetivos-servicios div:before{
    position: absolute;
    width: 0;
    height: 0;
    top: 18%;
    left: 50%;
    display: block;
    content: "";
    border: 0.25vw solid orange;
    margin-top: 3%;
    height: 15vw !important;
    border-radius: var(--border-radius);
}


#objetivos-servicios div > span {
    color: white;
    width: 46%;
    height: 100%;
    padding: 1vw 6vw !important;
    /* transform: scaleY(0); */
}


#objetivos-servicios div span:nth-child(1){
    margin-right: 1vw;
}
#objetivos-servicios div span:nth-child(2){
    float: right;
    margin-right: 1%;
}

#objetivos-servicios div span span:nth-child(1){
    width: 100%;
    height: 20%;
    margin-bottom: 1.5vw !important;
    letter-spacing: 0.3vw;
    font-size: 250%;
    text-align: center;
}

#objetivos-servicios div span ul{
    width: 100%;
    height: 72%;
}
#objetivos-servicios div span ul li{
    width: 100%;
    font-size: 120%;
    text-align: justify;
}

.focus-os div{
    /* transform: scaleY(1) !important; */
}

.focus-os div:before {
    
}

.focus-os div > span{
    /* transform: scaleX(1) !important; */
}




/*///////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/
/*//////////////////////////css mobile portrait//////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/
/*///////////////////////////////////////////////////////////////////////*/



@media screen and (max-width: 991px) and (orientation: portrait) {
    
    #main{
        background-color: transparent;
    }
    section{
        height: auto;
    }    
    
    .bg {
        /*position: fixed !important;*/
        width: auto;
        height: 100vh;
        top: 470vw;
    }
    .bg img{
        height: 100%;
        width: auto;
    }

    #nosotros{        
        margin-bottom: 5vw !important;
    }    
    #nosotros .front{
        height: 160vw !important;
    }
    #objetivos-servicios > span{
        height: 100% !important;
    }
    
    #nosotros span img,
    #objetivos-servicios > span img{
        width: auto !important;
        height: 100% !important;
    }  
    #nosotros span img{
        top: 0 !important;
        left: -50%;
    }    
    #nosotros div {
        width: 100%;
        height: auto;
        margin: 3vw 0;
    }
    #nosotros div h1 {
        width: 100%;
        height: 149%;
        font-size: 8vw;
        text-align: center;
    }    
    #nosotros div p {
        margin-top: -8% !important;
        font-size: 500%;
        width: 90%;
        left: -4vw;
    }
    
    #mision-vision{
        height: auto !important;
        font-size: 150%;
    }   
    #mision-vision div{
        height: auto;
        width: 85%;
        margin: 26% 7% !important;
        padding: 2.5vw 0 !important;
        transform: scaleY(1) !important;
        font-size: 150%;
    }
    #mision-vision div > span {
        color: white;
        width: 100%;
    }
    #mision-vision div span span:nth-child(1) {
        height: 21%;
        font-size: 450%;
    }
    #mision-vision div span span:nth-child(2) {
        letter-spacing: 0.25vw;
        font-size: 220%;
    }
    
    
    #objetivos-servicios {
        height: 275vw;
        background-color: transparent;
        
    }
    #objetivos-servicios:before {
        height: 30vw;
    }
    #objetivos-servicios  > span{        
        transform: scaleX(1) !important;
    }
    #objetivos-servicios > span img{
        left: -36%;
    }
    #objetivos-servicios div {
        height: auto;
        top: 20%;
        transform: scale(1.35);
        letter-spacing: 0.25vw;
    }
    #objetivos-servicios div:before{
        display: none;
    }
    #objetivos-servicios div > span {
        color: white;
        width: 100%;
        height: 100%;
        padding: 1vw 12.5vw !important;
        transform: scaleY(1);
        font-size: 320%;
    }
    #objetivos-servicios div span span:nth-child(1) {
         width: auto; 
        height: 20%;
        margin: 0 25%;
        margin-bottom: 2.5vw !important;
        letter-spacing: 0.3vw;
        font-size: 250%;
        text-align: center;
        border-bottom: 0.5vw solid orange;
    }
    #objetivos-servicios div span span:nth-child(2) {
        font-size: 135%;
    }
    

} 
@media screen and (max-width: 991px) and (orientation: landscape) {


}