@charset "utf-8";
/* CSS Document */

/*canale multimedia città di torino - css copyright Redazione Web Città di Torino 2007*/

/* codici dei colori utilizzati nella pagina:

	blu: #1867b4;
	carta da zucchero: #6b78a9;
	grigio:#404040;
	grigio chiaro: #ccc;
	rosso titoli: #990000;
	giallo di sfondo attivo: #ffff99;
	grigio fondo altri_video: #eee;
	colore comunicati stampa: #909abe;
	azzurrino della lista canali: #edeef4;

*/

html {
	font-size:62.5%;
}

body {
	font-size:100%;
	font-family: arial, sans-serif;
	text-align:center;
	margin:0;
	padding:0;
	/*min-width:760px;
	max-width:1280px;*/
}

html, body {
	margin:0;
	padding:0;
	background:#fff;
}

html div, body div {text-align:left; font-size:1.1em;}

.alt {display:none;}

/*blocchi della pagina*/

#testata {
	width:960px;
	margin:0 auto 12px auto;
	padding:0 0 10px 0;
	position:relative;
	border-bottom:1px solid #1867b4;
	text-align:left;
}


#testata h1 {
	margin:0;
	padding:0;
	position:relative;
	width:208px;
	height:70px;
	background: #fff url(img/citta.png) no-repeat 0 0;
	text-indent:-9999px;
}

h1 a {
	display:block;
	margin:0;
	width:208px;
	height:70px;
	text-decoration:none;
}



h2 {
	position:absolute;
	/*top:14px;
	right:30px;*/
	top:10px;
	right:0;
	width:165px;
	height:48px;
	background: url(img/multimedia.png) no-repeat 0 0;
	text-indent:-9999px;
}


/*fasce orizzontali*/

.fascia, #footer {
	width:960px;
	margin:20px auto;
	position:relative;
	clear:both;
}


h3 {
	font-size:1.8em;
	font-family: "century gothic", "trebuchet ms", arial, helvetica, sans-serif;
	letter-spacing:0.1em;
	font-weight:normal;
	position:relative;
	margin-bottom:0.3em;
}

h4 {font-size:1.1em; text-transform:uppercase; font-weight:normal;}

#mainplayer h3 {font-size:2em; margin:0 0 0.5em 0; padding-top:0 }

/*aggiunte per nuovo canale*/

#mainplayer, #linktovideo, #archivio {margin:0; padding:0}
#mainplayer {width:560px; height:340px; position:relative; float:left;}
#archivio {width:560px; position:relative; float:left;}
#linktovideo {width:350px; float:left; margin:0 20px; }

.esterni *, #mainplayer *, #archivio * {margin:0; padding:0}
.esterni {margin-bottom:20px; padding-bottom:5px}
.esterni#diretta {margin-bottom:10px}
.esterni h3, .esterni ul, #twnbox p {margin-bottom:0.5em; padding-left:8px}

.esterni ul {margin-left:20px}
.esterni p {margin-bottom:20px}
.esterni h4 {text-transform:none; padding:0}
.esterni h4 em {font-size:0.5em; text-transform:uppercase; font-family:arial; font-weight:bold; background:#FFF785; color:#A61414; font-style:normal; padding:0.3em;
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
border-radius:5px;
}

.esterni h4 span {font-size:0.7em; font-family:arial; letter-spacing:0;}

#twnbox, #archivio #intro {
background: rgb(227,234,197);
background: rgba(221,236,155,0.4);
}



ul#twn, ul#twn li {list-style:none;}
ul#twn {position:relative; overflow:hidden; padding:0; margin:0 0 0 8px;}
ul#twn li {display:block; width:75px; margin:5px 3px 5px 0; padding:2px; float:left; border:1px solid #839823;}

ul#twn li a {display:block; width:75px; overflow:hidden;  padding: 56px 0 0 0;  margin:0; font-family:"trebuchet ms",serif; text-transform:uppercase;  height:44px; }

ul#twn li a:link, ul#twn li a:visited {text-decoration:none; color:#000;  font-size:0.8em; font-weight:bold;}
ul#twn li a:hover, ul#twn li a:active {text-decoration:underline; color:#000;}

ul#twn li a span {display:block; padding:5px 0 0 0; margin:0; text-align:center;}

#twn_mattino a {background: #fafafa url(img/twnquot.jpg) no-repeat center top; }
#twn_pom a {background: #fafafa url(img/twn_culturale.jpg) no-repeat center top;}
#twn_cultu a {background: #fafafa url(img/twnsett.jpg) no-repeat center top;}
#twn_stra a {background: #fafafa url(img/twnstra.jpg) no-repeat center top;}

#linkalladiretta {list-style:none; margin:0; padding:0; display:block;}

#linkalladiretta li {
	display:block; 
	font-size:0.9em;
	margin:0.5em 0; 
	font-weight:bold; 
	text-transform:uppercase;
	letter-spacing:1px;
}

#linkalladiretta li a {
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	border-radius:5px;
}

#linkalladiretta li a:link, #linkalladiretta li a:visited {padding:0.5em; display:block; color:#000; text-decoration:none;background:#ebf3ff url(img/frecciaon.gif) 95% 50%  no-repeat;; border:2px solid #cee1ff;}

#linkalladiretta li a:hover, #linkalladiretta li a:active {padding:0.5em; display:block; color:#000; text-decoration:none;background:#fdf7d5 url(img/freccia.gif) 95% 50%  no-repeat;border:2px solid #F0DD71;}

#linkalladiretta li a#tornahome:link, #linkalladiretta li a#tornahome:visited {padding:0.5em; display:block; color:#000; text-decoration:none;background:#fdf7d5 url(img/freccia.gif) 95% 50%  no-repeat;border:2px solid #F0DD71;
}

#linkalladiretta li a#tornahome:hover, #linkalladiretta li a#tornahome:active {	padding:0.5em; display:block; color:#000; text-decoration:none;background:#ebf3ff url(img/frecciaon.gif) 95% 50%  no-repeat;; border:2px solid #cee1ff;}



#live {margin:0; padding:0; font-size:1em;}

#mainplayer #oggi {margin:0 0 20px 0; background:#FAF4C5; border:1px solid #DEDE8E; padding:2px}

#sulvideo {margin:20px 0 0 0}

.esterni h4 {margin:7px 0 12px 0; font-weight:bold; text-transform:uppercase;}

#footer {clear:left; position:relative;}

#archivio {padding-bottom:30px}

#archivio ul h3 {margin:7px 0 7px 0; font-weight:bold; text-transform:uppercase; font-size:1.1em; font-family:arial, verdana, sans-serif; clear:left}

#archivio ul {list-style:none; padding:0; margin:35px 0 0 0}

#archivio ul p img {float:left; margin:0 2px 2px 0; padding:2px; border:1px solid #f0f0f0;}

#archivio ul li {margin:0 0 20px 0; border-bottom:1px dashed #f0f0f0; height:90px; min-height:90px}

#archivio ol {list-style:none; margin:20px 0 0 0; padding:0;}
#archivio ol li {margin:0 0 1em 0}


/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 480px) {
h2 {background:none;text-indent:0;font-family:"Trebuchet MS",sans-serif;color:#518DC7;width:30%;font-size:2em;}

#testata {width:100%;}
.fascia, #footer {width:95%;}
#mainplayer {float:none;height: auto;width: 100%;}
#mainplayer *,ul#twn {width:100%;}
#mainplayer embed {width:100% !important;}
#linktovideo {float: none;margin: 0;width: 100%;}

#linkalladiretta li a:link, #linkalladiretta li a:visited {width:96%;padding:0.5em 2%;}
ul#twn  {margin-bottom:1em;}
ul#twn li {width:22%;margin:0 1.5% 0 0;padding:0.5%;}
ul#twn li:last-child {margin-right:0;}

ul#twn li a {height:auto;width:100%;text-transform:none;}