
.body{
    background: url(../images/bg-slider.jpg)!important;
}

.logo-s{
    height: 100px;
}

.container-slider{
    margin: 10% 5% 5% 5%;
    height: 90% !important;
    max-height: 90% !important;
    font-family: 'Quicksand', sans-serif;
}

.logo{
    margin: 0px auto;
    float: none;    
}

.logo2{
    float: none;
    text-align: center;
} 

.logo2 img{
    max-width: 100%;
    width: 30%;
    margin-left: 18px;
}  


/*slogan/*/
#slogan{
     background: #e6a672;
    background-size: cover;
    color: #ffffff;
    padding: 100px 50px;
    height: 450px;
}

.slogan{
    font-size: 30px;
    padding: 40px 10px;
    margin: 10px;
    font-family: 'Quicksand', sans-serif;
    
}
.slogan span{
    font-size: 60px;
    font-family: 'Quicksand', sans-serif;
}

.flor{

    height: 90%;
    position: static;
}

.planta{
    margin-bottom: -375px !important;
}

/*nosotros*/

#nosotros{
    background: url(../images/bg-nosotros.jpg) no-repeat;
}

.nos{
    width: 100%;  
    margin-top: 20px;
    margin-bottom: 50px;
}  

.nosotros{
    background: #fff;
    color: #53291b;
    margin-top: 100px;
    padding: 50px 80px; 
    font-family: 'Quicksand', sans-serif;
}

.nosotros h3{
    font-size: 50px;
    margin-bottom: 40px;
    font-family: 'Quicksand', sans-serif;
}

.nosotros p{
    font-size: 18px;
    font-family: 'Quicksand', sans-serif;
}

/*servicios*/

#servicios{
     background: url(../images/bg-servicios.jpg) no-repeat;
}


#servicios h1{
    text-align: center;
    font-size: 50px;
    margin: 80px 20px;
    font-family: 'Quicksand', sans-serif;
} 

a.ser:hover{
    padding-top: 50px;
}

/*galeria*/


#galeria{
     background: url(../images/bg-galeria.jpg) no-repeat;
    padding: 5% 1%;
}

a span{
    font-size: 25px;
    line-height: 10px !important;
    font-family: 'Quicksand', sans-serif;
}

/*ubicacion*/

#ubicacion h1{
    background: #fff;
    color: #53291b;
    padding: 60px 60px;  
    text-align: center !important;  
    line-height: 25px;
    font-family: 'Quicksand', sans-serif;
    font-size: 50px;
}

.ubicacion p{
    font-size: 25px;
    text-align: center;
    margin: 50px 50px;
    color: #53291b;
    font-family: 'Quicksand', sans-serif;
}

/*contacto*/

#contacto{
     background: url(../images/bg-contacto.jpg) no-repeat;
    color: #53291b;
    padding: 100px 50px,
        font-family: 'Quicksand', sans-serif;
}

.contacto{
    margin: 200px 10px;
}

#contacto h1{
    text-align: center;
    font-size: 50px;
    margin: 50px 10px;
    font-family: 'Quicksand', sans-serif;

} 

.contacto p{
    text-align: right;
    font-size: 18px;
    font-family: 'Quicksand', sans-serif;
} 

.red{
    font-size: 20px !important;
    font-family: 'Quicksand', sans-serif;
    margin-left: 10px;
}

.redes{
    text-decoration: none;
    color: #53291b;
    font-family: 'Quicksand', sans-serif !important;
    font-size: 20px;
    margin: 70px 50px;
    line-height: 45px;
    font-family: 'Quicksand', sans-serif;  
}

.redes:hover{
    text-decoration: none;
    color: #8d432a;
    font-family: 'Quicksand', sans-serif;
}

/*bungalow*/

#subseccion{ 
    background: url(../images/bg-bungalow.jpg) no-repeat;
    color: #53291b;
    padding: 150px 50px;
    font-family: 'Quicksand', sans-serif;
}

#subseccion h1{
    text-align: left;
    font-size: 50px;
    font-family: 'Quicksand', sans-serif;  
}

#subseccion h1 span{
    margin-left: 15%;   
}

.img-sub{
    text-align: center !important;
    margin: 0px auto;
    margin-bottom: 150px !important;
    max-width: 800px;
    width: 100%;
    margin-top: -60px;   
}

.desc-sub{
    text-align: center;
    color: #53291b;
    padding: 5% 20%;
    font-family: 'Quicksand', sans-serif;
    font-size: 25px;
    background: #e7bea4;
    margin-top: -5px;
    line-height: 30px;
}

.servi{
    border-top: solid 3px #53291b;
    padding-top: 40px;
    margin: 0px auto;
}

.bungalow p{
    font-size: 25px !important;
}

.bungalow p span{
    font-size: 35px !important;
}

/*eventos sociales*/

.separador{
    height: 205px;
}

#secc-sociales{
    background: #fff;
    text-align: center;
    color: #53291b;
    font-family: 'Quicksand', sans-serif;
    margin: 30px 20px;
}

.secc-sociales{
    margin-bottom: 30px !important;
}

img.eventos{
    text-align: center !important;
    display: block;
    margin: 0px auto;
    max-width: 800px;
    width: 100%;
    margin-bottom: 50px;
    margin-top: -100px
}



p.bodas{
    margin-top: 40%;
    font-size: 38px;
}

.f-r{
    float: right;
}

.f-l{
    float: left;
}

.cont-sociales{
    text-align: left;
}
.cont-sociales h3{
    font-size: 35px;
}
.cont-sociales p{
    font-size: 20px;
    margin-bottom: 40px;
}


/*HOSPEDAJE*/


#secc-hospedaje{
    margin: 70px 5px;
}

.ico-hosp{
    width: 50px;
}

.cont-hosp{
    color: #53291b;
    font-family: 'Quicksand', sans-serif;
    margin: 15px 20px;
    font-size: 12px;
}

.creditos{
    font-size: 9px;
    color: #53291b;
    font-family: 'Quicksand', sans-serif;
    text-align: center;
}


/*GALERIA*/



#subseccion-galeria{ 
    background: #fff;
    color: #53291b;
    padding: 50px 50px 20px 50px;
    font-family: 'Quicksand', sans-serif;
}

#subseccion-galeria h1{
    text-align: center;
    font-size: 40px;
    font-family: 'Quicksand', sans-serif;   
}

#subseccion-galeria h1 span{
    margin-left: 15%;   
}

.gal{
    background: #fff;
    color: #53291b;
    margin-top: 100px;
    height: 10px;
}

.img-sub{
    text-align: center !important;
    margin: 0px auto;
    margin-bottom: 150px !important;
    max-width: 800px;
    width: 100%;
    margin-top: -60px;   
}

.desc-sub-gal{
    text-align: center;
    color: #53291b;
    padding: 1%;
    font-family: 'Quicksand', sans-serif;
    font-size: 25px;
    background: #e7bea4;
    margin-top: -5px;
}

.gale{
    margin-bottom: 30px;
}

.galeri{
    font-size: 40px;
    color: #53291b;
    font-family: 'Quicksand', sans-serif;
    text-align: center;
}

/*responsive*/

/* Desktops and laptops ----------- */
@media only screen and (max-width: 992px) {
    
    
/*contacto*/

#contacto{
     background: url(../images/bg-contacto.jpg) no-repeat;
    color: #53291b;
    padding: 100px 50px,
        font-family: 'Quicksand', sans-serif;
}

.contacto{
    margin: 50px 10px;
}

#contacto h1{
    text-align: center;
    font-size: 50px;
    margin: 50px 10px;
    font-family: 'Quicksand', sans-serif;

} 

.contacto p{
    text-align: right;
    font-size: 15px;
    font-family: 'Quicksand', sans-serif;
} 


  
    
    
}
/*Tablet Pottrait size to standerd 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    
    header .logo-container {
        top: 10px;
        left: 10px;
    }
    
    .menui {
        margin-left: 80px;
        margin-top: -10px !important;
    }
    
    
    #slogan{
        padding: 30px 20px 20px 20px;
        height: auto;
    }
    
    .slogan{
        font-size: 15px !important;
        padding: 40px 10px;
        margin: 15px;
        font-family: 'Quicksand', sans-serif;
    }
    
    .slogan span{
        font-size: 20px !important;;
        font-family: 'Quicksand', sans-serif;
    }
    
    .nosotros{
        margin-top: 100px;
        padding: 50px 20px; 
    }
    
    .nosotros h3{
        font-size: 30px;
        margin-bottom: 40px;
    }

    .nosotros p{
        font-size: 18px;
    }
    
    #servicios h1{
        font-size: 30px;
        margin: 40px 10px;
    } 
    
    #ubicacion h1{
        padding: 60px 10px;  
        font-size: 30px;
    }

    .ubicacion p{
        font-size: 15px;
        margin: 50px 10px;
    } 
    
    .red{
        font-size: 14px !important;
        margin-left: 10px;
    }

    .redes{
        font-size: 20px;
        margin: 60px 9px;
        line-height: 30px;   
    }
    
    .planta{
        margin-bottom: -170px !important;
        width: 100%;
    }
    
    p.bodas{
        margin-top: 40%;
        font-size: 35px;
    }
    
    .container-slider{
        margin: 1% 1% 1% 1%;
        height: 90% !important;
        font-family: 'Quicksand', sans-serif;
    }
    a span{
        font-size: 25px;
        line-height: 10px !important;
        font-family: 'Quicksand', sans-serif;
    }
    
    .separador{
        height: 160px;
    }
    
    .galeri{
        font-size: 30px;
        color: #53291b;
        font-family: 'Quicksand', sans-serif;
        text-align: center;
    }
    
    .carousel-indicators li {
        width: 25px;
    }
    
    .carousel-indicators .active {
        width: 25px;
    }
    
    .logo2 img{
            width: 80%;
    } 
}


/* All Mobile Sizes (devices and browers) */
@media only screen and (max-width: 767px) {
    
    header .logo-container {
        top: 10px;
        left: 10px;
    }
    
    .menui {
        margin-left: 80px;
        margin-top: -10px !important;
    }
    
    #slogan{
        padding: 30px 20px 20px 20px;
        height: auto;
    }

    .slogan{
        font-size: 12px !important;
        padding: 40px 10px;
        margin: 15px;
        font-family: 'Quicksand', sans-serif;
    }
    
    .slogan span{
        font-size: 20px !important;;
        font-family: 'Quicksand', sans-serif;
    }
    
    .nosotros{
        margin-top: 1px;
        padding: 50px 20px; 
    }  
    
    .nosotros h3{
        font-size: 30px;
        margin-bottom: 40px;
    }

    .nosotros p{
        font-size: 14px;
    }
    
    #servicios h1{
        font-size: 30px;
        margin: 40px 10px;
    } 
    
    #ubicacion h1{
        padding: 60px 10px;  
        font-size: 30px;
    }

    .ubicacion p{
        font-size: 11px;
        margin: 50px 10px;
    }
    
    #contacto{
        padding: 10px 15px;
    }

    .contacto{
        margin: 30px 5px;
    }

    #contacto h1{
        font-size: 30px;
    } 

    .contacto p{
        text-align: center;
        font-size: 15px;
    } 
    
    .red{
        font-size: 12px !important;
        margin-left: 10px;
    }

    .redes{
        font-size: 20px;
        margin: 40px 9px;
        line-height: 30px;
    }
    
    .container-slider{
        margin: 1% 1% 1% 1%;
        height: 90% !important;
        font-family: 'Quicksand', sans-serif;
    }
    
    a span{
        font-size: 25px;
        line-height: 10px !important;
        font-family: 'Quicksand', sans-serif;
    }
    
    .desc-sub{
        text-align: center;
        color: #53291b;
        padding: 10% 10%;
        font-family: 'Quicksand', sans-serif;
        font-size: 18px;
        background: #e7bea4;
        margin-top: -5px;
        line-height: 25px;
    }
    
    p.bodas{
        margin-top: 35%;
        font-size: 20px !important;
    }

    .cont-sociales h3{
        font-size: 20px !important;
    }
    
    .cont-sociales p{
        font-size: 20px !important;
        margin-bottom: 40px;
    }
    
    .cont-sociales h3{
        font-size: 20px;
    }
    
    .cont-sociales p{
        font-size: 13px;
        margin-bottom: 20px;
    }
    
    a span {
        font-size: 15px !important;
    }
    
    .separador{
        height: 170px;
    }
    
    
    .galeri{
        font-size: 20px;
        color: #53291b;
        font-family: 'Quicksand', sans-serif;
        text-align: center;
    }
    
    .carousel-indicators li {
        width: 20px;
    }
    
    .carousel-indicators .active {
        width: 20px;

    }
    .logo2 img{
        width: 30%;
    } 
}


/* All Mobile Sizes (devices and browers) */
@media only screen and (max-width: 567px) {
    
    header .logo-container {
        top: 10px;
        left: 10px;
    }
    
    .container-slider{
        margin: 1% 1% 1% 1%;
        height: 90% !important;
        font-family: 'Quicksand', sans-serif;
    }
    
    #slogan{
        padding: 30px 20px 20px 20px;
        height: auto;
    }
    
    .slogan{
        font-size: 30px;
        padding: 40px 10px;
        margin: 10px;
        font-family: 'Quicksand', sans-serif;
    }
    
    .slogan span{
        font-size: 60px;
        font-family: 'Quicksand', sans-serif;
    }
    
    .nosotros{
        margin-top: 100px;
        padding: 50px 20px; 
    }  
    
    .nosotros h3{
        font-size: 30px;
        margin-bottom: 40px;
    }

    .nosotros p{
        font-size: 14px;
    }
    
    #servicios h1{
        font-size: 30px;
        margin: 40px 10px;
    } 
    
    #ubicacion h1{
        padding: 60px 10px;  
        font-size: 30px;
    }

    .ubicacion p{
        font-size: 11px;
        margin: 50px 10px;
    } 
    
    .red{
    font-size: 11px !important;
        margin-left: 10px;
    }

    .redes{
        font-size: 20px;
        margin: 40px 9px;
        line-height: 30px;  
    }
    
    p.bodas{
        margin-top: 35%;
        font-size: 18px !important;
    }
    
    .galeria{
        width: 100%;  
    }

    .galeria a{
        padding: 10px 10px;  
        text-align: center !important;  
        line-height: 25px;
        font-family: 'Quicksand', sans-serif;
        font-size: 50px;
    }

    a span{
        font-size: 25px;
        line-height: 10px !important;
        font-family: 'Quicksand', sans-serif;
    }
 
    .cont-sociales h3{
        font-size: 20px;
    }
    
    .cont-sociales p{
        font-size: 13px;
        margin-bottom: 20px;
    }

    .contacto p {
        text-align:center;
        font-size: 18px;
        font-family: 'Quicksand', sans-serif;
    }
    
    a span {
        font-size: 15px !important;
    }
    
    .separador{
        height: 10px;
    }
  
    .cont-hosp{
        color: #53291b;
        font-family: 'Quicksand', sans-serif;
        margin: 15px 20px;
        font-size: 10px;
    }
    
    .galeri{
        font-size: 20px;
        color: #53291b;
        font-family: 'Quicksand', sans-serif;
        text-align: center;
    }
    
    .carousel-indicators li {
        width: 20px;
    }
    
    .carousel-indicators .active {
        width: 20px;
    }
    
    .logo2 img{
        width: 80%;
    } 
}




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

    .fill {
      width: 100% !important;
      /*height: 100% !important;*/
      margin: 0 !important;
    }

    .icon-arrow-right {
        margin-right: -15px !important;
    }

    .icon-arrow-left{
        margin-left: -15px !important;
    }
}




@media only screen and (min-width: 1000px) {

    .logo-s{
    margin-left: 70px;
    }
}
