/* ================================
HEADER WEX 
================================ */
#head-ombra {
	height:8vh;
}
#head {
	position: fixed;
	top: 0; left:0;
	width:100%;
	height: 8vh;
	display: flex; 
	z-index: 100;
background-color:#eee;
}
#head > div {
	position: relative;
}
#head > div > a {
	position: absolute;
	width: 100%;
	height: 100%;
	top:0; left:0;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #232323;
}
#head > div.mmex {
	width:10%;
}
#head > div.logex {
	width:20%;
	background-image:url('../../_pic/logo/new/musa-header.png')
}
#head > div > a > span {
	text-indent: 0.5rem;
}

@media all and (max-width: 1199.98px) and (min-width: 992px) {
    #head > div > a > span {
        font-size: 0.8rem;
		text-indent: 0.3rem;
    }
}

@media all and (max-width: 991.98px) and (min-width: 768px) {
    #head > div > a > span {
        font-size: 0.6rem;
		text-indent: 0.2rem;
    }
}

@media all and (max-width: 767.98px) {
	#head > div > a {
	flex-direction: column;
}
    #head > div > a > span.text {
        font-size: 0.5rem;
    }
   /* #head > div > a > span {
        display: none;
    }*/
	#head > div.mmex {
	width:20%;
	}
	#head > div.logex {
	width:60%;
	background-image:url('../../_pic/logo/new/musa-header.png')
	}
	.m-none {
		display: none;
	}
}

/* ================================
FASCIONE
================================ */
.fascione, .monte {
	font-family: 'Bernardo Moda', Calibri, Tahoma, sans-serif;
}
.fascione {
	width: 100%;
	height: 50vh;
	background-color: rgba(255,0,0,1);
}
.testa {
	width: 100%;
	height: 20%;
	background-color: rgba(255,255,255,0.4);

	-moz-box-shadow: 1px 1px 12px #000;
	-webkit-box-shadow: 1px 1px 12px #000;
	box-shadow: 1px 1px 12px #000;
}
.pantax {
	width: 100%;
	height: 80%;
	-moz-box-shadow: 1px 1px 12px #000;
	-webkit-box-shadow: 1px 1px 12px #000;
	box-shadow: 1px 1px 12px #000;
}
.pantax h1 {
	color: white;
	letter-spacing: 1px;
	line-height: 1em;
	font-size: 6em;
	text-align: center;
	text-shadow: 2px 2px 1px rgba(51,51,51,0.9);
}
/* ================================
PANTAMUSA
================================ */
.panta {
	height: 86vh;
	display: flex;
}
.panta-1 {width: 50%;}
.panta-2 {width: 50%;}

@media all and (max-width: 576px){
.panta {flex-direction: column;}
.panta-1 {width: 100%; height: 50%;}
.panta-2 {width: 100%; height: 50%;}
}
/* ===========================
CONTOBOX 
=========================== */
nav {display: block;}
nav ul, nav ol {
	list-style: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
}
nav.contobox {
	width: 100%;
	height: 44vh;
-moz-box-shadow:1px 1px 12px #000;
-webkit-box-shadow:1px 1px 12px #000;
box-shadow:1px 1px 12px #000;
}
.gridex {
	background-color: rgba(0,0,0,0.5);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	flex-flow: row wrap;
}
.gridex li {
	width: 20%;
	height: 50%;
	position:relative;
	background-color: rgba(0,153,204,0);
-webkit-box-shadow: inset 0 0 1px 0 rgba(0,0,0,0.6), inset 0 0 0 1px rgba(0,0,0,0.6);
-moz-box-shadow: inset 0 0 1px 0 rgba(0,0,0,0.6), inset 0 0 0 1px rgba(0,0,0,0.6);
box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.6),inset 0 0 0 1px rgba(0,0,0,0.6);
}
.gridex li a {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0; left: 0;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	font-family: "Bernardo Moda";
	text-transform: uppercase;
	font-size: 1.2rem;
	font-weight:600;
	color:rgba(255,255,255,0.8);
}
.gridex li a span{
	width:100%;
	height:25%;
	background-color:rgba(51,51,51,0.65);
	display:flex;
	justify-content:center;
	align-items:center;
}
.gridex.new li a span {
	font-size: 0.8rem;
	text-align:center;
}

.gridex li a:hover{
font-weight:900;
color:rgba(255,255,255,1);
background-color: rgba(0,0,0,0.6);
}

@media all and (max-width: 768px){
nav.contobox {height: 100vh;} 
.gridex li {width:50%; height:20%;}
.gridex li a{font-size: 0.8rem;}
}
@media all and (max-width: 768px){
nav.contobox {height: 150vh;} 
}


/* ===========================
CONTOBOX 
=========================== */
.panta-footer {
	width: 100%;
	height: 6vh;
	background-color: rgba(255,153,153,0.5);
	-moz-box-shadow: 1px 1px 12px #000;
	-webkit-box-shadow: 1px 1px 12px #000;
	box-shadow: 1px 1px 12px #000;
	display: flex;
}
.panta-footer div {
	flex:1;
	display: flex;
}
.fixty {
	align-items:center;
	font-size:0.75vw;
}
.nifty {
	width: 100%;
	height: 100%;
}
.nifty div {
	flex:1;
}
.nifty div:first-child {background-color:grey;display:flex;}
.nifty div:last-child {background-color:darkgray;display:flex;}

.btn-nifty {
	width:80%;
	height:80%;
	cursor: pointer;
}


@media all and (max-width: 600px){
.panta-footer div {font-size:1.75vw;}
}
/* ===========================
MONTE 
=========================== */
.monte {
	display: flex;
	flex-flow: wrap;
}
.monte div {
	/*overflow:hidden*/
}
a.monte-block {
	display: block;
	position: relative; 
}
.ab-monte {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
	font-size: 2rem;
	color: rgba(255,255,255,1);	
	text-transform: uppercase;
	text-shadow: 1px 1px 2px rgba(51,51,51,1);
	line-height: 1em;
}
.ab-monte span {
}
.ab-monte:hover {
	background-color: rgba(0,0,0,0);
	color: rgba(255,255,255,1);	
	transition: 2s;
}
@media all and (max-width: 600px){
.ab-monte {font-size:1rem;}
}