/* Letras */
.fonts-1{
    font-size: 18px;
}
.fonts-2{
    font-size: 16px;
}
.fonts-3{
    font-size: 20px;
}

.fonts-4{
    font-size: 30px;
}

.font-one{
    font-size: 60px;
    text-shadow: -1px -1px white, 1px 1px #121212
}
.font-one-2{
    font-size: 25px;
}

.radius-bordes-15px{
    border-radius: 15px;
}

.radius-bordes-30px{
    border-radius: 30px;
}

.radius-bordes-40px{
    border-radius: 40px;
}


.radius-bordes-50px{
    border-radius: 50px;
}

.size-div-heigth-60{
    height: 60px;

}

.size-div-heigth-380{
    height: 380px;

}



@media (max-width: 1300px) and (min-width: 10px) {

    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #b30505;
        overflow-x: hidden;
        
    }
    
        /*-TOP */
        .topnav {
            overflow: hidden;
            background-color: #b30505;
            position: relative;
        }
        
        /* Hide the links inside the navigation menu (except for logo/home) */
        .topnav #myLinks {
            display: none;
        }
        
        /* Style navigation menu links */
        .topnav a {
            color: #000;
            padding: 14px 16px;
            text-decoration: none;
            font-size: 17px;
            display: block;
        }
        
        /* Style the hamburger menu */
        .topnav a.icon {
            background: #b30505;
            display: block;
            position: absolute;
            right: 0;
            top: 0;
        }
        
        /* Add a grey background color on mouse-over */
        .topnav a:hover {
            background-color: #FFF;
            color: black;
        }
        
        /* Style the active link (or home/logo) */
        .active {
            background-color: #FFF;
            color: #b30505;
            height: 15px;
            
        }

        .size-logo{
            height: 20px;
        }

        .topnav #hiddenLogo {
            display: none;
        }

        


        /* BANNER */

        .banner{ 
            width: 100%;
            height: 790px;
            background-color: #000;
            margin-top: 5px;
            background-image: url('../images/background-playa-m.webp');
            background-image: no-repeat;
            background-image: fixed;
            background-image: center;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            text-align: center;
            border-radius: 0px 0px 50px 50px ;
        }

        .banner #hiddenimagenbanner {
            display: none;
        }

        .banner-text{
            position: relative;
            top:10px;
            left: 5%;
            float: left;
            width: 90%;
            height: 250px;
            color: #000;
        }

        .banner-button{
            position: relative;
            float: left;
            left: 6%;
            width: 280px;
            height: 50px;
            background-color: #cd411e;
            border-radius: 15px;
            padding: 10px;
            margin-top: 10px;
            margin-right: 10px;
            padding-left: 0px;
            padding-top: 25px;
            cursor: pointer;
            color: #FFF;
            text-align: center;
            font-size: 18px;
        }


       

        .container-1{
            position: relative;
            float: left;
            width: 100%;
            height: 30px;    
            margin-top: 0px;
            background-color: #b30505;
            color: #FFF;
            text-align: center;
            padding-bottom: 30px;
            font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            
        }

        .container-2{
            background-color: #e3e3e3;
            color: #000000;
            width: 100%;
            min-height: 1400px;
            margin-top: 0px;
            position: relative;
            text-align: center;
            padding-top: 25px;
            font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            border-radius: 50px 50px 0px 0px;
            
        }

            .container-2-box{
                width: 95%;
                min-height: 1400px;
                position: relative;
                float: left;
                left: 2%;
                

            }

                .container-2-box-center{
                    width: 100%;
                    height: 230px;
                    position: relative;
                    float: left;
                    left: 0%;                   
                    text-align: center;
                    margin-bottom: 25px;
                    text-align: center;

                }

                .container-2-box-left{
                    width: 99%;
                    min-height: 110px;
                    position: relative;
                    float: left;
                    left: 0%;
                    margin-top: 50px;

                }

                    .container-2-box-left-img{
                       width: 100%;
                        
                    }

                    .container-2-box-left-text{
                        width: 92%;
                        min-height: 100px;
                        position: relative;
                        float: left;
                        left: 0%;
                        margin-bottom: 30px;
                        margin-bottom: 10px;
                        padding-left: 4%;
                        padding-right: 3%;
                        padding-top: 0px;
                        padding-bottom: 20px;
                        text-align: center;
                        
                    }

                .container-2 #hidden-container-2-box-right {
                    display: none;
                }


                /* contaniner foot */

        .container-foot{
            background-color: #42414b;
            color: #FFFFFF;
            width: 100%;
            height: 420px;
            margin-top: 10px;
            position: relative;
            text-align: center;
            padding-top: 0px;
            margin-top: 25px;
            text-align: center;
            
            
        }

        .container-foot-text-1{
            width: 100%;
            height: 250px;
            position: relative;
            float: left;
            left: 0%;
            top: 25px;
            text-align: right;        
            
        }

            .container-foot-text-1-logo{
                width: 100%;
                height: 100px;
                position: relative;
                float: left;    
                

            }
            .container-foot-text-1-flags{
                width: 100%;
                height: 100px;
                margin-top: 20px;
                position: relative;
                float: left;    
                

            }

            .container-foot-text-1-text{
                width: 100%;
                height: 250px;
                margin-top: 20px;
                position: relative;
                float: left;    
                

            }

        .container-foot-text-2{
            width: 100%;
            height: 400px;
            position: relative;
            float: right;
            right: 0%;
            top: 80px;
            text-align: left;
            margin-top: 120px;
            text-align: center;
            padding-bottom: 25px;
            
            
        }

        .container-foot-text-name{
            width: 100%;
            height: 100px;
            position: relative;
            float: left;
            text-align: center;

        }

        .banner-textfiel-foot{
            width: 90%;
            height: 30px;
            background-color: #f1f3f4;
            border-radius: 30px;
            padding: 10px;
            margin-top: 10px;
            padding-left: 20px;
            position: relative;
            float: left;
            left: 5px;;
        }
        .banner-button-foot{
            width: 95%;
            height: 50px;
            background-color: #b30505;
            border-radius: 30px;
            padding: 10px;
            margin-top: 10px;
            margin-right: 10px;
            padding-left: 20px;
            cursor: pointer;
        }

       
    
                

}

@media (max-width: 2400px) and (min-width: 1300px) {

    /* Menus */

    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #FFF;
        overflow-x: hidden;
        
        
    }

    .menu_active{
        color: #b30505;
    }

    .menu-left{
        color:#000;
    }

    .container-2-box #hiddenLogoWeb {
        display: none;
    }


    
        .topnav {
            background-color: #f8f8f8;
            color: #000000;
            padding-top: 0px;
            padding-left: 30px;
            text-align: left;
            margin-top: 0;
            margin-left: 0;
            margin-bottom: 100px;
            width: 98%;
            height: 100px;      
            position: fixed;
            top: 0px;     
            z-index:100;
            border-bottom: 5px solid #3f3f3f;
            -webkit-box-shadow: -2px 8px 17px -2px rgba(84,84,84,1);
            -moz-box-shadow: -2px 8px 17px -2px rgba(84,84,84,1);
            box-shadow: -2px 8px 17px -2px rgba(84,84,84,1);
            border: 2px solid #b30505;
        }

        .topnav #hiddenMenu {
            display: none;
        }

        .active{
            width: 100px;
            height: 25px;
            top: 10px;
            border: 1px #000;
            position: relative;
            float: left;
            padding-left: 80px;
         
            
        }

        

        .size-logo{
            height: 55px;
        }

        .menu-home{
            width: 80px;
            height: 25px;
            margin-top: 10px;
            margin-left: 0px;  
            margin-right: 20px; 
            position: relative;
            float: left;
            left: 50px;
            padding-left: 10px;
            padding-top: 25px;
            font-size: 18px;
            font-weight: 400;
            color: #000; 
            
            
        }  

        .menu-left{
            min-width: 80px;
            height: 25px;
            margin-top: 10px;
            margin-left: 0px;   
            position: relative;
            float: left;
            left: 10px;
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 25px;
            font-size: 18px;
            font-weight: 400;
            color: #000; 
            
            
        }  

        .menu-right{
            min-width: 80px;
            height: 25px;
            margin-top: 10px;
            margin-left: 0px;   
            position: relative;
            float: right;
            right: 10px;
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 25px;
            font-size: 18px;
            font-weight: 400;
            color: #000; 
            
            
        }  

        

         .menu-home:hover, .menu-left:hover, .menu-right:hover{
            color: #b30505;
            
        }

        /* CONTENEDOR */
        .banner{
          
            color: #000;
            width: 100%;
            height: 750px;
            margin-top: 60px;
            position: relative;
            background-image: url('../images/background-playa.webp');
            background-image: no-repeat;
            background-image: fixed;
            background-image: center;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
            border-radius:  0px 0px 100px 100px;
           
        }

        .banner-text{
            position: relative;
            top:40px;
            left: 10%;
            float: left;
            width: 600px;
            height: 400px;
        }

        .banner-form{
            position: relative;
            top:10px;
            right: 12%;
            float: right;
            width: 400px;
            height: 500px;
            color: #000;
            text-align: center;
            margin-top: 60px;
            padding-top: 0px;
            border-radius: 30px;
           
            

        }

        .banner-textfiel{
            position: relative;
            float: left;
            left: 17%;
            width: 250px;
            height: 30px;
            background-color: #f1f3f4;
            border-radius: 30px;
            padding: 10px;
            margin-top: 10px;
            padding-left: 20px;
        }
        .banner-button{
            position: relative;
            float: left;
            left: 17%;
            width: 280px;
            height: 50px;
            background-color: #cd411e;
            border-radius: 15px;
            padding: 10px;
            margin-top: 10px;
            margin-right: 10px;
            padding-left: 20px;
            padding-top: 25px;
            cursor: pointer;
            color: #FFF;
            text-align: center;
            font-size: 18px;
            
        }

        

        .banner-imagen{
            position: relative;
            top:40px;
            left: 13%;
            float: left;
            width: 300px;
            height: 400px;

        }

        .banner-icono{
            display: inline-block;
            margin: 0 0.5rem;
            animation: bounce; /* referring directly to the animation's @keyframe declaration */
            animation-duration: 1s;
            
        }


        /* BODY ONE */
        .foot-one{
            background-color: #f1f3f4;
            color: #000000;
            width: 100%;
            height: 50px;
            margin-top: 0px;
            position: relative;
            text-align: center;
            padding-top: 25px;
            
        }

        .container-1{
            background-color: #b30505;
            color: #FFF;
            width: 100%;
            height: 50px;
            margin-top: 0px;
            position: relative;
            text-align: center;
            padding-top: 25px;
            padding-bottom: 30px;
            font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            
        }

        .container-2{
            background-color: #e3e3e3;
            color: #000000;
            width: 100%;
            min-height: 1600px;
            margin-top: 0px;
            position: relative;
            text-align: left;
            padding-top: 25px;
            font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            border-radius: 100px 100px 0px 0px;
            
        }

        .container-2-pages{
            margin-top: 80px;
        }

            .container-2-box{
                width: 80%;
                min-height: 1600px;
                position: relative;
                float: left;
                left: 10%;
                

            }

                .container-2-box-center{
                    width: 100%;
                    height: 220px;
                    position: relative;
                    float: left;
                    left: 0%;                  
                    text-align: center;
                    margin-bottom: 0px;
                    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

                }

                .container-2-box-center-pages{
                    margin-bottom: 20px;
                }


                .container-2-box-left{
                    width: 100%;
                    min-height: 600px;
                    position: relative;
                    float: left;
                    left: 0%;
                    
                    text-align: center;
                    

                }
                    .container-2-box-left-img{
                        width: 1200px;
                        height: 402px;
                        
                        
                    }
                    .container-2-box-left-text{
                        width: 78%;
                        min-height: 130px;
                        position: relative;
                        float: right;
                        left: 0%;
                        margin-bottom: 30px;
                        padding-top: 20px;
                        
                    }



                .container-2-box-right{
                    width: 37%;
                    min-height: 500px;
                    position: relative;
                    float: right;
                    left: 0%;
                    text-align: right;
                    

                }

        /* contaniner foot */

        .container-foot{
            background-color: #42414b;
            color: #FFFFFF;
            width: 100%;
            height: 420px;
            margin-top: 10px;
            position: relative;
            text-align: center;
            padding-top: 0px;
            margin-top: 25px;
            
            
        }

        .container-foot-text-1{
            width: 40%;
            height: 290px;
            position: relative;
            float: left;
            left: 10%;
            top: 25px;
            text-align: left;
            
            
        }

            .container-foot-text-1-logo{
                width: 100%;
                height: 100px;
                position: relative;
                float: left;    
                

            }
            .container-foot-text-1-flags{
                width: 100%;
                height: 100px;
                margin-top: 20px;
                position: relative;
                float: left;    
                

            }

            .container-foot-text-1-text{
                width: 100%;
                height: 100px;
                margin-top: 20px;
                position: relative;
                float: left;    
                

            }

        .container-foot-text-2{
            width: 50%;
            height: 300px;
            position: relative;
            float: right;
            right: 10%;
            top: 25px;
            text-align: right;
            
            
        }
        .container-foot-text-name{
            width: 100%;
            height: 100px;
            position: relative;
            float: left;
            text-align: center;

        }

        .banner-textfiel-foot{
            position: relative;
            float: right;
            right: 0%;
            width: 250px;
            height: 30px;
            background-color: #f1f3f4;
            border-radius: 30px;
            padding: 10px;
            margin-top: 10px;
            padding-left: 20px;
        }
        .banner-button-foot{
            position: relative;
            float: right;
            right: 0%;
            width: 280px;
            height: 50px;
            background-color: #1febfb;
            border-radius: 30px;
            padding: 10px;
            margin-top: 10px;
            margin-right: 10px;
            padding-left: 20px;
            cursor: pointer;
            color: #000;
        }

        



 } /* END RESOLUTION*/