@charset "utf-8";
/*--------------------------------------------------------------- variables --*/
:root {
    --main-color: #017256;
    --color-bg-nav-selected: #01654c;
    --color-text-nav-selected: #CFD3D6;
    --color-bg-nav-submenu: #FFFFFF;
    --title-header-color: #FFFFFF;
    --title-color: #000000;
    --text-color: #000000;
    --footer-color: #FFFFFF;
    --color-bg-main-color: #FFFFFF;
}

/*------------------------------------------------------------------- icons --*/
.social a{
    background-color: #EEEEEE;
}

/*--------------------------------------------------------------- nav icon --*/
.launcher span{
    background: var(--main-color);
}

/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
/*--------------------------------------------------------------- al turrón --*/
html, body, input, textarea, select{
    font-family: 'Montserrat', sans-serif;
    color: var(--text-color);
}
h1, h2, h3, h4, h5, h6{
    color: var(--title-color);
}
.bgWhite{
    background: #FFFFFF;
}
.lang_area > a{
    color: var(--main-color);
}
main {
    padding-top: 3.75em;
}

.logo_area img {
    width: 130px;
}
/*--------------------------------------------------------------------- nav --*/
#main_launcher {
    transform: translateY(-14%);
}
#main_nav > ul{
    background: var(--main-color);
    box-shadow: 4px 4px 8px #151515;
}
.nav li.selected {
    background: var(--color-bg-nav-selected);
}
.nav a:link, .nav a:visited, .nav p {
    color: var(--color-bg-main-color);
}
.nav .selected>a:link, .nav .selected>a:visited {
    color: var(--color-bg-main-color);
}
.nav li:hover>a, .nav li:hover>p {
    color: var(--color-text-nav-selected);
}

.nav ul ul li {
    background-color: var(--color-bg-nav-submenu);
}
.nav ul ul a:link, .nav ul ul a:visited, .nav ul ul p {
    color: var(--main-color);
}
#main_nav .submenu button{
    color: var(--color-bg-main-color);
}

/*-------------------------------------------------------------- contenidos --*/
section header{
    background: var(--main-color);
}
section header h1{
    color: var(--title-header-color);
}
section{
    padding-top: 1em !important;
}
.search_btn {
    background: var(--main-color);
}
.search_btn:hover{
    background: var(--color-bg-nav-selected);
}

.gal6pag li {
    border: 2px solid #FFFFFF !important;
    background: var(--main-color) !important;
    width: 10px !important;
    height: 10px !important;
}
#slidexou_pagina .gal6selected{
    border: 2px solid var(--main-color) !important;
    background: #FFFFFF !important;
}
.search_term{
    background: var(--main-color);
}
a:visited, a{
    color: var(--main-color);
}
/*-------------------------------------------------------------------- home --*/
.welcome{
    position: inherit;
    top: 0;
    bottom: auto;
}
.welcome h1 {
    text-shadow: -6px 2px 0 #017256;
    color: #FFFFFF;
}
.welcome .editor_content {
    color: var(--main-color);
    position: inherit;
    margin: 0 auto;
}
.welcome h2{
    color: var(--main-color);
}
/*----------------------------------------------------------------- paginas --*/
.title-slidexou h1 {
    background: rgba(0,0,0,.5);
    color: var(--title-header-color);
}
/*---------------------------------------- inner pages --*/
.innerPages > div:not(:first-child):before {
    background: var(--main-color);
}

.custom_label {
    background: var(--main-color);
    color: var(--color-bg-main-color);
}
/*--------------------------------------------------------- contenidos item --*/
.contenidos-item .icon_text > .bgMainColor {
    background-color: var(--main-color);
}

.contenidos-item .redes-sociales > div {
    background-color: var(--main-color);
}

/*------------------------------------------------------------------ footer --*/

#main_footer {
    background: var(--main-color);
}
#main_footer .web-info, #main_footer .web-info a{
    color: var(--footer-color);
}

.home #wrapper #main_footer{
    top: 50px;
}

@media all and (max-width: 768px){
    .logo_area img {
        width: 160px;
    }
    .minify .logo_area img {
        width: 110px;
    }
    .guia-turistica-logo{
        align-items: center;
    }
    .guia-turistica-logo img{
        width: 45px !important;
    }
    .guia-turistica-logo span{
        padding-bottom: 0;
    }
    
    #main_launcher{
        top: -55px;
    }
}

@media all and (max-width: 499px){
    .guia-turistica-logo span{
        display: none;
    }
}




/*------------------------------------------------------------------ panel demo --*/

.f {
    display: flex;
    flex-wrap: nowrap;
}

.centerV{
    align-items: center;
}

main{
    top: 50px;
}

.menu_panel {
    font-size: 14px;
    display: block;
    width: 100%;
    z-index:11;
    position: -webkit-sticky;
    position: sticky;
    top:0;
    -webkit-box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.5);
    box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.5);
}

.menu_panel p{
    font-size: 14px !important;
    margin-bottom: 0;
}

.panel_info p{
}

.boto_info{
    background-color:#0099BF;
    padding:4px 12px;
    border-radius: 10px;
    margin-left: 20px;
}

.boto_info:hover{
    background-color:#0e709a;
    transition: .3s ease-in-out;

}

#wrapper {
    background-color: white;
}

.panel_info{
    font-weight: bold;
}

.panel_info a{
    color: white;
    text-decoration: none;
}

.panel_info img{
    height: 35px;
    margin-left: 20px;
}

.panel_select p{
    left:25px;
}

.panel_select .spr{
    margin-right: 20px;
    left:-25px;
}

.spr{
    height:20px;
    width:20px;
    cursor: pointer;
}

.selected p{
    color: white !important;
    font-weight: bold;
}

.panel_mbl {
    background: url(../images/bg/sprite2.png) no-repeat -20px -21px;
}

.panel_mbl:hover {
    background: url(../images/bg/sprite2.png) no-repeat -20px 0px;
}

.panel_mbl:hover + p{
    color:white;
}

.selected.panel_mbl{
    background: url(../images/bg/sprite2.png) no-repeat -20px 0px;
}




.panel_pc {
    background: url(../images/bg/sprite2.png) no-repeat 0px -21px;
}

.panel_pc:hover + p{
    color:white;
}

.panel_pc:hover {
    background: url(../images/bg/sprite2.png) no-repeat 0px 0px;
}



.selected.panel_pc{
    background: url(../images/bg/sprite2.png) no-repeat 0px 0px;
}


.img_mostrar {
    background: url(../images/bg/sprite2.png) no-repeat -21px -63px;
    transition: all .3s;

}

.img_mostrar:hover {
    background: url(../images/bg/sprite2.png) no-repeat -21px -42px;
}

.img_amagar {
    background: url(../images/bg/sprite2.png) no-repeat 0px -63px;
    transition: all .3s;
    position: absolute;
    right: 0;

}

.img_amagar:hover {
    background: url(../images/bg/sprite2.png) no-repeat 0px -42px;
}

.panel {
    font-family: 'Average Sans';
}



.panel{
    background-color: black;
    color: white;
    height: 50px;
    position: sticky;
    position: -webkit-sticky !important;
    z-index:1;
    padding: 0 2em 0 10em;
    font-size: 0.9em;
    font-family: 'Average Sans';
}

.panel_select{
    margin: auto;
}

.panel_select{
    font-size: 14px;
}

.panel_select p{
    color: #BBBDC0;
    margin-bottom: 0;
    cursor: pointer;
}

.panel_select p:hover{
    color: white;
}



.panel_select div{
    margin-left:2em;
    margin-right: 3px;
}

.desplegar{
    float: right;
    background-color: black;
    color: white;
    height: 50px;
    position: absolute;
    right: 0;
    display:none;
    z-index:50;
    padding-left:2em;
    padding-right:2em;
}

.img_mostrar{
    top:15px;
}




body{
    background-color: #d4d4d4;
}

@media all and (max-width: 768px){
    .panel_info a img{
        display: none;
    }
}
