/**
VISTA MOVIL
*/
@media only screen and (max-width: 765px) {

    .img-principal{
        height: 140%;
        z-index: 1;
        position: fixed;
        margin-top: -34%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 125%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 47%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 150%;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 115%;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 30px;
    }

    .vertical-menu {
        float: right;
        margin-top: 50%;
        position: relative;
        z-index: 11;
        margin-right: 2%;
    }

    .img-100-home{
        width: 50%;
        margin-left: 50%;

    }
    
    .vertical-menu-home{
        height: 20%;
        margin-left: 53%;
        margin-top: 82%;
    }

    .logo-home{
        height: 13%;
        margin-left: 48%;
        position: absolute;
        
    }


    /**responsive about*/

    .video-container {

        margin-top: 500px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }
    
    /**Resposive contact*/

    .form-contact .form-control{
        margin-left: 10%;
    }
    
    .form-contact{
        margin-top: 35%;
        margin-left: 24%;
    }
    
    .form-contact label {
        font-size: 30px;
        font-family: "TitliGothic";
        margin-top: -20px;
    }



      
    .form-style{
        width: 60%;
    }

    .vertical-menu-contact{
        margin-top: 60%;
    }

}

/**
 Iphone 6 7 y 8 plus
*/

@media only screen and (max-width: 414px) {

    .img-principal{
        height: 100%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 85%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 190%;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 17px;
    }

    .vertical-menu{
        margin-top: 75%;
      }

    .vertical-menu a{
        font-size: 30px;
    }

    .img-principal-home {
        height: 109%;
        margin-left: -80%;
    }

    .logo-home {
        height: 10%;
        margin-left: 42%;
        position: absolute;
    }

    .vertical-menu-home{
        margin-top: 112%;
        margin-right: 0%;
    }
    .vertical-menu-home a{
        font-size: 20px;
    }

    .form-contact label {
        font-size: 20px;
    }

    .form-contact {
        margin-top: 51%;
    }

}


/**
LG optimus
*/


@media only screen and (max-width: 384px) {

    .img-principal{
        height: 100%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }

    .vertical-menu{
        margin-top: 75%;
      }

    .vertical-menu a{
        font-size: 30px;
    }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 85%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 657px;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 17px;
    }

    .vertical-menu-home {
        margin-top: 95%;
        margin-right: 0%;
    }

    .vertical-menu-home a{
        font-size: 20px;
    }

    /**responsive about*/

    .video-container {

        margin-top: 400px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }
        


}



/**
iphone x
*/


@media only screen and (max-width: 375px) {

    .img-principal{
        height: 100%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 107%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 875px;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 20px;
    }

    .vertical-menu-home{
        margin-top: 140%;
    }


    /**responsive about*/

    .video-container {

        margin-top: 550px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }

    .form-contact label {
        font-size: 20px;
    }

    .form-contact {
        margin-top: 106%;
        margin-left: 0;
    }

    .form-style {
        width: 71%;
    }
        
}



/**
Galaxy s5
*/

@media only screen and (max-width: 360px) {

    .img-principal{
        height: 100%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 85%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 657px;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 17px;
    }

    .vertical-menu {
        float: right;
        margin-top: 73%;
        position: relative;
        z-index: 11;
        margin-right: 2%;
    }

    .vertical-menu-home{
        margin-top: 103%;
        margin-right: 0%;
    }

    .vertical-menu-home a{
        font-size: 18px;
    }

    /**responsive about*/

    .video-container {

        margin-top: 400px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }

    .form-contact label {
        font-size: 20px;
    }

    .form-contact {
        margin-top: 84%;
        margin-left: 10%;
    }
    

    .form-style {
        width: 71%;
    }
        
    
}


@media only screen and (max-height: 512px) {

    .img-principal{
        height: 124%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 56%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 130%;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 17px;
    }

    .vertical-menu {
        float: right;
        margin-top: 40%;
        position: relative;
        z-index: 11;
        margin-right: 2%;
    }

    .vertical-menu-home{
        margin-top: 92%;
        margin-right: 0%;
    }

    .vertical-menu-home a{
        font-size: 13px;
    }

    /**responsive about*/

    .video-container {

        margin-top: 300px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }

    .form-contact label {
        font-size: 15px;
    }

    .form-contact {
        margin-top: 60%;
        margin-left: 10%;
    }
    

    .form-style {
        width: 71%;
    }
        


}


/**
Iphone 6/7/8
*/
@media only screen and (height: 667px) {

    .img-principal{
        height: 100%;
        z-index: 1;
        position: fixed;
        margin-top: -5%;
        margin-left: -20%;
      }


    .col-50{
        width: 20%;
        height: 100%;
        float: left;
        margin-left: 0%;
        overflow-y: auto;
        margin-top: 107%;
        overflow-y: auto;
      }
   

    .text-container {

        position: absolute;
        z-index: 13;
        margin-left: 3%;
        margin-top: 757px;
        font-family: "TitliGothic";
        background-color: rgba(0, 0, 0, 0.5);
        
      
      }


  
    .div-selector {
        width: 134%;
        height: 8%;
        margin-top: 40px;
    }

    
    .img-container {

        height: 50%;
    }

    .text-container h3 {
        color:#fff;
        font-size: 20px;
    }

    .vertical-menu-home{
        margin-top: 140%;
    }

    .vertical-menu-home{
        margin-top: 104%;
    }


    /**responsive about*/

    .video-container {

        margin-top: 400px;
        margin-left: 1%;
    }
    
    .video-height {
        height: auto;
        width: 99%;
    }

    .form-contact label {
        font-size: 20px;
    }

    .form-contact {
        margin-top: 70%;
        margin-left: 10%;
    }
    

    .form-style {
        width: 71%;
    }
        
}