/* CSS definition file containing sitestyle stylesheets AF&LL*/
/* tutta la classe BODY è inserita nelle singola pagine - non nel file bootstrap */
/* Per ridimesionare le immagini con effetto responsive assegnare all-immagine la classe: class="img-responsive"  */
/* questa classe assegna all’immagine le proprietà CSS max-width: 100%; e height: auto; in modo che l’immagine si ridimensioni automaticamente  */
/* queste sono le misure breakpoints:
    X-Small: None <576px
    Small: sm =576px
    Medium: md =768px
    Large: lg =992px
    Extra: large xl =1200px
    Extra extra large: xxl =1400px
line-height definisce interlinea
*/

@font-face {
  font-family: fontbama;
  src: url(webfont/bahamasn.eot) format('embedded-opentype'),
       url(webfont/bahamasn.ttf) format('truetype'),
       url(webfont/bahamasn.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family: fontavenbutton;
  src: url(webfont/avengeance.eot) format('embedded-opentype'),
       url(webfont/avengeance.ttf) format('truetype'),
       url(webfont/avengeance.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

.font-titlemark {font-family: sans-serif; font-size: 26pt; text-shadow:3px 3px 3px #000;}
.font-title {font-family: fontbama; font-size: 26pt; text-shadow:3px 3px 3px #000;}
.font-titlesub {font-size: 16pt;}
.font-text {font-size: 12pt;}
.font-textsub {font-size: 10pt;}
.font-button {font-family: fontavenbutton; text-shadow:2px 2px 2px #000;}

.flexpic {max-width: 100%;}

hr {color: #666; background: #666; border: 0; height: 1px; width: 100%;}
#rigascura {color: #151515; background: #151515; border: 0; height: 1px; width: 100%;}
#rigagrossa {color: #888; background: #aaa; border: 0; height: 8px; width: 100%;}

.vuoto {width: 100px; height: 100px; /* indicare sempre anche altezza  */}
.bordonero {border: 1px solid #000;}

/* crea style e margini nelle tabelle */ 
.contenuto-centrato {text-align: center; padding: 10px;}
.centrato {text-align: center;}
.stileriga {border: 1px solid #000; background-image: url(imag/trasparente.png); }
.stiletab {border: 1px solid #000; background-color: #333333; }
.stilecell {padding: 6px; }
/* margin: top, right, bottom e left  */
/* margin: 5px;  tutti i lati */


/* stile usato nella pagina gplayer - grario casella ricerca*/
.imputcasella {
background: #ddd; 
box-sizing: border-box;
border: 1px solid #999;
padding-left: 1em;
padding: 5px; 	
color:#000; 
font-size:12pt;
}

/* Stilearea sono le tabelle base per tutte le pagine  */
.stilearea {max-width: 100%;
background-image: url('images/xtabellabianca.png'); background-repeat: no-repeat; background-position: center;
background-size: 100% 100%;
background: rgba(255,255,255,.7);
box-sizing: border-box;
box-shadow: 0 6px 10px rgba(0,0,0,.8);
margin:0 auto; /* indica il margine fuori dalla tabella stessa-sposta anche lo sfondo */
border: 1px solid #666; 
padding-top: 10px;
margin-bottom:10px;
}
.stilearea:hover {border: 1px solid #fff; background-image: url(imag/trasparente-black22.png) }

.stile_errore {max-width: 500px; text-align:left;
background: rgba(255,0,0,.9);
box-sizing: border-box;
box-shadow: 0 6px 10px rgba(0,0,0,.8);
border: 1px solid #fff; 
border-radius: 10px;
padding: 15px;
margin:  15px;
color:#fff
}

.overflow-text {
      height: 400px;
      background: rgba(0,0,0,.5);
      box-sizing: border-box;
      box-shadow: 0 10px 20px rgba(0,0,0,.8);
      border: 2px solid #000;
      background-image: url(imag/trasparente.png);
      padding: 10px; 
      border-radius: 10px;    
      overflow: scroll visible;      
    }

A:link    {color:#009900; font-family : Trebuchet MS, Arial, Helvetica, Verdana; text-decoration: none;}
A:hover   {color:#00B433; font-family : Trebuchet MS, Arial, Helvetica, Verdana; text-decoration: none;}
A:visited {color:#999999; font-family : Trebuchet MS, Arial, Helvetica, Verdana; text-decoration: underline;}
A:active  {color:#FF0000; font-family : Trebuchet MS, Arial, Helvetica, Verdana; text-decoration: underline;}

.st8 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 8pt; }
.st9 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 9pt; }
.st0 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 10pt; }
.st1 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 11pt; }
.st2 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 12pt; }
.st3 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 13pt; }
.st4 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 14pt; }
.st5 { font-family : sans-serif; Arial, Helvetica, Verdana; font-size: 15pt; }


/***************   CONTENITORI NAVBAR SEMPRE VISIBILI  **************/
.navbar {position: relative; border-bottom: 0px rgba(0, 0, 0, 0.25); /* serve a eliminare riga nera bottom contenitore navbar */ }
.brand {position: absolute; left: 50%; margin-left: -66px !important;  /* 50% of your logo width */ display: block;}
/* STYLE DEL MENU RIDOTTO sempre visibile - ma nascosto sopra 768 */ 
#navigationsmall {background-image: url(http://www.grario.it/imag/abstrate.png);
    border-top:6px solid #006600;
    border-bottom:6px solid #006600;
    -moz-box-shadow:0px 0px 10px #000;
    -webkit-box-shadow:0px 0px 10px #000;
    box-shadow:0px 0px 10px #000;
    padding: 4px; 
}
#stemma {
    -moz-box-shadow:0px 0px 10px #000;
    -webkit-box-shadow:0px 0px 10px #000;
    box-shadow:0px 0px 10px #000;
    padding: 5px;
}

.navbarra { text-align:center;
    background: rgba(0,102,0,.6);
    background-image: url(images/trasparente.png);
    -moz-box-shadow:0px 0px 10px #000;
    -webkit-box-shadow:0px 0px 10px #000;
    box-shadow:0px 0px 10px #000;
    border: 2px solid #006600; 
    border-radius: 10px;
    padding: 10px;
}

a.navbutton {font-family: Calibri, Verdana; text-shadow:2px 2px 2px #000; font-size: 16pt;
    line-height:34px;
    background-color:#006600;
    border: 2px solid #003300;
    padding: 2px 18px 3px 18px;
    margin:5px;
    border-radius: 6px;
    font-size: 14pt;
    color:#ccc
    }
a.navbutton:hover {TEXT-DECORATION: none; 
    border: 2px solid #00cc00;
    background-color:#008800;
    color:#fff; 
}

a.navbuttonmin{font-family: Arial Narrow;
    line-height:36px;
    background-color:#006600;
    border: 1px solid #003300;
    padding: 4px 6px 4px 6px;
    margin:2px;
    border-radius: 6px;
    font-size: 12pt;
    color:#ccc
    }
a.navbuttonmin:hover {TEXT-DECORATION: none; 
    background-color:#008800;
    color:#fff;
    }

#Submitgrey { 
    font-family: Verdana, sans-serif, Arial, Helvetica; 
    width:100px; height:30px; 
    font-size: 11pt    
    }
#Submitgrey:hover { 
    background-color:#008800;
    color:#fff;    
    }


/****************** variazioni con pagina SOPRA 768px *************************/
@media (min-width: 768px) {
.nav navbar-nav { position: relative; height:110px; clear: left; float: left; margin: 0; padding: 0; left: 50%; text-align: center; } 
.navbar-inverse { background-color: transparent; background: transparent; background-image: url(imag/barra-navbar.png); } 
/* sopra 768 nasconde barra menu ridotto */
#navigationsmall {display:none;}
}


/************************** STYLE PER FOOTER-FIRMA *************************************/
#firma-contenuto {width: 100%; margin-top:30px; padding:30px; background:#003300; background-image: url(imag/); color:"#ccc" }
/* line-height:30px;*/ /*** indica lo spazio tra le righe di testo  ***/
.firmacell  {padding: 8px; background-color:"#009900";}




/************ CONTENITORE LOGO E MENU da verificare *************************/


#contenitoremenu {
	height: auto;
	width:100%; 
	margin:0 auto;
}
#contenitoretabmaxi {
	background-image: url(http://www.grario.it/imag/trasparente-white50.png);
	margin:20px 10px 1px 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
}
/* GRAFICA LISTA EVENTI */
#listaeventi {
	width:96%;
	height:26px;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}
