h1,
h2,
h3,
h4,
h5,
h6{
  font-family: 'Josefin Sans', sans-serif;  
}

h1{
    font-size: 5em;
}

h2{
    font-size: 3em;
}

body{
  font-family: 'Noto Serif', serif;  
}

.section a, .modal-content a{
    color:black;
    
}

.welcome-pack a:hover, a:hover h3, .carousel-item a:hover{
    text-decoration: none !important;
    color: #ff9900 !important;
}

.carousel-item, .carousel-item a{
    color: #fff;
}

.teaser{
    background-image:linear-gradient(rgba(0, 0, 0, .1), #1a1a1a88), url('../img/teaser.jpg');
    height: auto;
    background-size: cover;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.img-responsive, .img-responsive img{
   width: 100%;
   height: auto;
}

.relative{
    position:relative;
}

.bottom{
    position: absolute;
    bottom: 0;
    width: 60%;
}

.idiomas a{
    color: #ffffff;
    font-family: 'Josefin Sans', sans-serif;  
}

/*----------------------MARGIN Y PADDINGS--------------------*/

.m-top-10{
    margin-top:10px;
}

.m-top-20{
    margin-top:20px;
}

.m-top-30{
    margin-top:30px;
}

.m-top-40{
    margin-top:40px;
}

.m-top-50{
    margin-top:50px;
}

.m-top-60{
    margin-top:60px;
}

.m-top-70{
    margin-top:70px;
}

.m-top-80{
    margin-top:80px;
}

.m-top-90{
    margin-top:90px;
}

.m-top-100{
    margin-top:100px;
}

.m-top-300{
    margin-top:300px;
}


.m-top-400{
    margin-top:400px;
}

.m-bottom-10{
    margin-bottom:10px;
}

.m-bottom-20{
    margin-bottom:20px;
}

.m-bottom-30{
    margin-bottom:30px;
}

.m-bottom-40{
    margin-bottom:40px;
}

.m-bottom-50{
    margin-bottom:50px;
}

.m-bottom-60{
    margin-bottom:60px;
}

.m-bottom-70{
    margin-bottom:70px;
}

.m-bottom-80{
    margin-bottom:80px;
}

.m-bottom-90{
    margin-bottom:90px;
}

.m-bottom-100{
    margin-bottom:100px;
}

.p-10{
    padding:10px;
}

.p-20{
    padding:20px;
}

.p-30{
    padding:30px;
}

.p-40{
    padding:40px;
}

.p-50{
    padding:50px;
}

.p-top-10{
    padding-top:10px;
}

.p-top-20{
    padding-top:20px;
}

.p-top-30{
    padding-top:30px;
}

.p-top-40{
    padding-top:40px;
}

.p-top-50{
    padding-top:50px;
}

.p-top-60{
    padding-top:60px;
}

.p-top-70{
    padding-top:70px;
}

.p-top-80{
    padding-top:80px;
}

.p-top-90{
    padding-top:90px;
}

.p-top-100{
    padding-top:100px;
}

.p-bottom-10{
    padding-bottom: 10px;
}

.p-bottom-20{
    padding-bottom: 20px;
}

.p-bottom-30{
    padding-bottom: 30px;
}

.p-bottom-40{
    padding-bottom: 40px;
}

.p-bottom-50{
    padding-bottom: 50px;
}

.section-cajas{
    background-color: #000000;
}

.caja-1{
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, .1), #1a1a1aaf),url('/img/welcome-pack/ciudad.jpg');
    background-size: cover;
    position: relative;
    background-position: left bottom;
    transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
}

.caja-1:hover{
    background-position: right top;
    background-image: linear-gradient(rgba(0, 0, 0, .3), #4977acde),url('/img/welcome-pack/ciudad.jpg');
}


.caja-2{
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, .1), #1a1a1aaf),url('/img/welcome-pack/mercado.jpg');
    background-size: cover;
    position: relative;
    background-position: left bottom;
    transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
}

.caja-2:hover{
    background-position: right top;
    background-image: linear-gradient(rgba(0, 0, 0, .3), #4977acde),url('/img/welcome-pack/mercado.jpg');
}


.caja-3{
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, 0.734), #1a1a1aaf),url('/img/welcome-pack/web.jpg');
    background-size: cover;
    position: relative;
    background-position: left bottom;
    transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
}

.caja-3:hover{
    background-position: right top;
    background-image: linear-gradient(rgba(0, 0, 0, .3), #4977acde),url('/img/welcome-pack/web.jpg');
}

.caja-4{
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, .1), #1a1a1aaf),url('/img/welcome-pack/fonseca.jpg');
    background-size: cover;
    position: relative;
    background-position: left bottom;
    transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
}

.caja-4:hover{
    background-position: right top;
    background-image: linear-gradient(rgba(0, 0, 0, .3), #4977acde),url('/img/welcome-pack/fonseca.jpg');
}


.caja-5{
    min-height: 500px;
    background-image: linear-gradient(rgba(0, 0, 0, .1), #1a1a1aaf),url('/img/welcome-pack/intermodal.jpg');
    background-size: cover;
    position: relative;
    background-position: left bottom;
    transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
}

.caja-5:hover{
    background-position: right top;
    background-image: linear-gradient(rgba(0, 0, 0, .3), #4977acde),url('/img/welcome-pack/intermodal.jpg');
}



.cajas a{
    color:#ffffff;
}

.descripcion-caja{
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    width: 70%;
    margin: auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.cajas-como-llegar{
    min-height: 500px;;
}


.cajas-como-llegar h2, .cajas-tips h3{
    margin:auto;
    width: 70%;
}

.section-gray{
    background-color: rgb(226, 226, 226);
}

.section-blue{
    background-color: rgb(73, 119, 172);
}

li{
    list-style-type: none;
}

.lista li {
    list-style-type: disclosure-closed;
}

.lista li{
    margin: 15px;
}

.section-tips{
    background: rgb(242,242,242);
background: linear-gradient(180deg, rgba(242,242,242,1) 0%, rgba(255,255,255,1) 100%);
}

.box{
    padding:30px;
    border-radius: 10px;
    box-shadow: 5px 5px 16px -10px #000000;
    margin: 5px;
}


#tips-deporte .modal-header, #tips-deporte button{
    background: rgb(37,230,153);
background: linear-gradient(176deg, rgba(37,230,153,1) 0%, rgba(22,177,116,1) 100%);
}

#tips-productos .modal-header, #tips-productos button{
    background: rgb(133,223,251);
    background: linear-gradient(180deg, rgba(133,223,251,1) 0%, rgba(44,152,186,1) 100%);
}   


.verde{
    background: rgb(37,230,153);
background: linear-gradient(176deg, rgba(37,230,153,1) 0%, rgba(22,177,116,1) 100%);
}

.azul{
    background: rgb(133,223,251);
    background: linear-gradient(180deg, rgba(133,223,251,1) 0%, rgba(44,152,186,1) 100%);
}

.rosa{
    background: rgb(247,165,255);
    background: linear-gradient(180deg, rgba(247,165,255,1) 0%, rgba(173,44,186,1) 100%);   
}

.naranja{
    background: rgb(255,162,103);
background: linear-gradient(180deg, rgba(255,162,103,1) 0%, rgba(246,124,47,1) 100%);
}

.carousel-item{
    padding: 50px;
}

.carousel-control-prev{
    left:-60px;
}

.carousel-control-next{
   right:-60px;
}

@media only screen and (max-width: 600px){
    .carousel-control-prev{
        left:0px;
    }
    
    .carousel-control-next{
       right:0px;
    }
}

.cajas-tips a{
    color: #ffffff;
    text-decoration: none;
}

.cajas-tips a:hover{
    color: #2c2c2c;
    text-decoration: none;
}

.modal{
    top: 50px;
}

.blue{
    color: rgb(73, 119, 172);
}

.fondo{
    background-image: url('/img/welcome-pack/fondo.jpg');
    background-size: cover;
}

.section-cajas a{
    color: #fff !important;
}

.modal-header{
    background-color: #e6e6e6;
}




@media only screen and (min-width: 992px){
    .mobile{
        display: none;
    }

    .desktop{
        display: block;
    }
    
}


@media only screen and (max-width: 991px){
    .mobile{
        display: block;
    }

    .desktop{
        display: none;
    }

    .texto-teaser h1, .texto-teaser h3{
            font-size: 1.2em;
    }
    
}

.teaser{
    padding-bottom: 25px;
}

.carousel-control-next, .carousel-control-prev{
width: auto !important;
}

.carousel-item img{
    margin-bottom:25px;
}

.banner{
    margin: 50px 0;
}

.w-100 h3{
    padding: 20px;
}

.section-cajas p{
    color: #fff;
}

.modal-body a{
    color: #ff9900;
}

.modal-body a:hover{
    color: #ff9900 !important;
}

.banda-wp{
    background-color: #ff9900;
    padding: 20px;
}

.welcome-pack.single a{
    color: #000000;
}

.welcome-pack .idiomas a{
    color: #ffffff;
}