/******* Elenco anelli *******/

.pulsante_barra {
    padding: 10px 3px;
    box-shadow: 0 0 12px 2px rgb(0 0 0 / 30%);
    background-color: #fff;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 23vw;
    font-size: 20px;
    z-index: 11111;
    display: none;
}




 

.immagine_anelli {
    width: 100% !important;
    border-radius: 6px 6px 0 0 !important;
    height: 240px !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-origin: content-box !important;
    margin-bottom: 2px;
    background-position-y: 50%;
    background-position-x: 50%;
}


.tit_percorso {
    position: absolute;
    margin: 0 auto !important;
    text-align: left;
    z-index: 4444;
    background-color: #247a72;
    color: #fff;
    padding: 8px;
    border-bottom-right-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
}


.info_percorso {
    position: relative;
    color: #fff !important;
    font-size: 15px;
    line-height: 20px;
    background: #247a72;
    padding: 9px 10px;
    border-radius: 15px;
    text-align: center;
    margin-bottom: 12px;
}

    .info_percorso a {
        color: #ffffff !important;
    }


.mappa {
    width: 100% !important;
    height: 350px;
}


.sent_int {
    font-size: 17px;
    line-height: 30px;
}


.elenco_tratti {
}


    .elenco_tratti li {
        cursor: pointer;
        background-color: #774c2a;
        margin-top: 10px;
        margin-bottom: 10px;
        padding: 6px;
        color: #fff;
    }


        .elenco_tratti li a {
            color: #fff;
        }


/******* Elenco anelli *******/







.custom-logo{
    position:absolute !important;
    top:0px !important;
    z-index:555;
}


.elenco_eventi {
    width: 100%;
    position: relative;
    vertical-align: top;
    background-size: cover;
    background-position-x: 50%;
    height: 300px !important;
}

.anelli_elenco_image {
    max-width: 100%;
    position: relative;
    vertical-align: top;
    background-size: cover;
    background-position-y: 50%;
    background-position-x: 50%;
    height: 650px !important;
}


.scritta_2{
    font-weight:500 !important;
}


.attivita_elenco_image {
    width: 100%;
    position: relative;
    vertical-align: top;
    background-size: cover;
    background-position-y: 50%;
    background-position-x: 50%;
    height: 300px !important;
}

.elenco_image_schede {
    max-width: 100%;
    position: relative;
    vertical-align: top;
    background-size: cover;
    background-position-y: 50%;
    background-position-x: 50%;
    height:500px !important;
}



.gradient {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /* opacity: .60; */
    background: rgb(0,0,0);
    background: linear-gradient(180deg, rgba(0,0,0,0) 57%, rgba(0,0,0,1) 100%, rgba(0,212,255,1) 100%);
}


.sfondo_anelli {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-origin: content-box !important;
    background-position-y: 50%;
    background-position-x: 50%;
    top: 0;
    z-index: 55;
    position: absolute;
    width: 100%;
    height: 500px;
}




.anello_dettaglio_contenitore {
    margin-top: 0px;
    position: relative;
    height: 450px;
    border-bottom-right-radius: 10px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-origin: content-box !important;
    background-position-y: 50%;
    background-position-x: 50%;
}




.logo img {
    width:210px;
}


.scritta_comune{
    color:rgb(22, 22, 22);
    font-size:25px;
}

.logo_unione {
    background-color: #fff;
    border-radius: 6px;
    right: 4vw !important;
    top: 8px !important;
    position: absolute !important;
    width: 250px !important;
    height: 130px !important;
    z-index: 555555 !important;
    padding: 8px;
}

.logo_unione img{
    width:50px !important;
}

.main-menu .navigation a {
    color: #324b4a !important;
}


/**********************/

.box_outdoor {
    background-color: #814e21;
    color: #fff;
    width: 35%;
    padding:20px 30px 20px;
    border-top-right-radius: 25px;
    z-index: 555;
    position: relative;
    margin-top:-70px;
}

.box_up_outdoor {
    margin-top: 0px;
    width: 40%;
    z-index: 555;
    position: relative;
    height: 350px;
    border-bottom-right-radius:10px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-origin: content-box !important;
    background-position-y: 50%;
    background-position-x: 50%;
}


.img_outdoor{
    position:absolute;
    right:0px;
    top:0px;
    width:70%;
    height:450px;
}

.mt-15 {
    margin-top:70px !important;
}


.mt-30 {
    margin-top: 100px !important;
}



.dx_home {
    float: right;
}

.sx_home {
    float: left;
}






/*******  RESPONSIVE PERSONALIZZATO *******/

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {

    
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {

    
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {

    
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

     
}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {

    
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {

    .img_outdoor{
        position:relative;
        width:100%;
    }

    .box_up_outdoor {
        width:100%;
    }


    .box_outdoor {
        background-color: #814e21;
        color: #fff;
        width: 100%;
        padding: 20px 30px 20px;
        border-top-right-radius: 25px;
        position: relative;
    }


    .mappa {
        width: 100% !important;
        height:250px !important;
    }


    .dx_home {
        float: right;
    }

    .sx_home {
        float: left;
    }

    .dx_home {
        float: right;
        display:block;
        padding-left:15px;
    }

    .sx_home img{
        width:70px;
    }

    br{
        display:block !important;
    }
}