/*INIZIO MOBILE#############*/ @media screen and (max-width: 899px) { 
    
    
    #menu-principale {
    position: relative;
    width: 100%;
    top: 0px;
    display: none;
    margin-bottom: 7%;
}          

    li {
    display: block;
    height: auto; width: 100%;
    text-align: left;
    padding: 10px 0px 10px;
    background-color: white;
    border-bottom: solid 1px lightgray;
    text-transform: uppercase;    
    
    
}     
    
    li a:link,li a:visited,li a:active  {
    margin-left: 2.5%;
    font-family: Dosis-light;
    font-size: 150%;
    color: dimgrey;
    text-decoration: none;
}    
    
    li a:hover {
    color: lightgrey;
}    
    
    
    .hidden {
        display:block;
        margin-top: 10px;
    }
    
    .hidden li {
        background-color: white;
        display: block;
        height: auto;
        padding: 10px 0px 10px;
        border-bottom: solid 0px gray;
        text-transform:none;    

        
    }
    
    .hidden li a:link,li a:visited/*,li a:active*/  {
     margin-left: 6%;
        font-size: 120%;
   
    }    

    #menu-label-open, #menu-label-close {
    display: block;
    height: 40px;
    width: 40%;
    text-align: center;
    background-color: #FFF;
    margin: 10px 30%;
} 
    
    #menu-label-close {
    display: block;
}    

    #menu-label-open img {
    height: 20px; width: auto;
    margin-top: 0px
}
    
    #menu-label-close img {
    height: 20px; width: auto;
    margin-top: 10px;
}

    #menu-label img a {
    border: 0px;
}   
    

    
    
    
    
    .simbolo-menu {
         color: lightgray;
        font-size: 70%;
    }

    
    
    
/* fine MOBILE ###############################*/}




/*inizio DESK##############*/ @media screen and (min-width:900px) {

/*Strip the ul of padding and list styling*/
ul {
	list-style-type:none;
	margin:0;
	padding:0;
	position: absolute;
}

/*Create a horizontal list with spacing*/
li {
	display:inline-block;
	float: left;
/*	margin-right: 1px;*/
}
    
    /*Style for menu links*/
li a {
	display:block;
/*	min-width:140px;*/
/*	height: 50px;*/
	text-align: left;
/*	line-height: 50px;*/
	font-family: "Josefin Sans", sans-serif;
    font-size: 86%;
    text-transform: uppercase;
	color: black;
/*	background: #2f3036;*/
	text-decoration: none;
    margin: 0px 27px 0px 0px;
}

/*Hover state for top level links*/
li:hover a {
/*	background: #19c589;*/
    color: firebrick;
}

/*Style for dropdown links*/
li:hover ul a {
	background-color: rgba(230,230,230,0.85);
	color: black;
	height: 40px;
	line-height: 40px;
}

/*Hover state for dropdown links*/
li:hover ul a:hover {
	background: rgba(178,34,34,0.85);
	color: #fff;
}
    
    /*Hide dropdown links until they are needed*/
li ul {
	display: none;
}

/*Make dropdown links vertical*/
li ul li {
	display: block;
	float: none;
}

/*Prevent text wrapping*/
li ul li a {
	width: auto;
	min-width: 100px;
	padding: 0 20px;
}

/*Display the dropdown on hover*/
ul li a:hover + .hidden, .hidden:hover {
	display: block;
}
    
/*aggiunge uno pseudoelemento alla voce con dropdown    */
    
    .sub::after {
        content: " ";
        display: inline-block;
        width: 10px;
        height: 10px;
        background-image: url(/2015/comuni/freccia-giu.png);
        background-size:contain;
        background-repeat: no-repeat;
        margin-left: 5px
    }

    
    
/**************************************************************    */
    
    
    #menu-label-open, #menu-label-close {
    display: none;
    
} 
      
    
    
    .simbolo-menu {
         color: lightgray;
    }
    


/* fine DESK ###########################*/ }