@font-face {
  font-family: 'FontAwesome';
  src: url('https://www.tuttosport.com/assets/font/fontawesome-webfont.eot?v=4.2.0');
  src: url('https://www.tuttosport.com/assets/font/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('https://www.tuttosport.com/assets/font/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('https://www.tuttosport.com/assets/font/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('https://www.tuttosport.com/assets/font/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

body {background: #ebebeb;font: 16px/120% 'Source Sans Pro',sans-serif;color: #000; margin:0px;}
body #page {background: #fff;width: 990px;margin: 0 auto;padding: 0 10px 10px;}
body #page span.web {float: left;width: 100%;margin: 2% 0 1%;}
body #page img { max-width:100%;}
body #page .container { display:none;}
#header {position: relative;text-align: center;z-index: 10;}
#header .container {height: 110px;position: relative;padding-top: 0;background-color: #9D3B21;width: 100%;}
#header .logo {width: 300px;height: 110px;margin: 0 auto 0;margin-top: 0;}
#header .logo a { cursor:pointer; display:block; width:300px; height:110px;}

.tooltip {display:none;position:absolute;border:1px solid #333;background-color:#161616;border-radius:5px;padding:10px;color:#fff;font-size:12px Arial;width:250px;}

.menu { float:left; width:100%;}
ul.menu { float:left; background-color:#6d2917; width:100%; margin:0px auto; padding:0px;}
ul.menu li.left { float:left; width:30%;  padding:0 10%; list-style-type:none; text-align:center;background: url(https://www.tuttosport.com/assets/img/separator_edizdig.png) repeat-y right;}
ul.menu li.right { float:left; width:30%; padding:0 10%; list-style-type:none; text-align:center;}
ul.menu li a { color:#ffffff; font-size:20px; text-decoration:none; font-weight:700;line-height: 55px;}

.accordion {margin: 15px 0 0 0;}
.accordion h1 { float:left; width:100%; color:#9D3B21; margin:2% 0 2% 0;}
.accordion span.subtitle { float:left; width:100%; color:#1a1a1a; margin:0 0 2% 0; font-size:1.2em;}
.accordion dt, .accordion dd { cursor: pointer; position:relative; padding: 0;border: 0px solid black;border-bottom: 0;margin-bottom: 1px;background-color: #eee;width: 100%;float: left;}

.accordion dt span.arrow_up { float: right;width: 26px;height: 12px;background: url(https://www.tuttosport.com/assets/img/arrow-up-first.png) no-repeat;cursor: pointer;margin: 20px;}
.accordion dt span.arrow_up_white { float: right;width:26px; height:12px; background: url(https://www.tuttosport.com/assets/img/arrow-up-second.png) no-repeat; cursor:pointer; margin:20px;}
.accordion dt span.arrow_down { float:right; width:26px; height:12px; background: url(https://www.tuttosport.com/assets/img/arrow-down-second.png) no-repeat; cursor:pointer; margin:20px;}

.accordion dt:last-of-type, .accordion dd:last-of-type {border-bottom: 0px solid black;}
.accordion dt a, .accordion dd a {color: black;font-weight: bold;text-decoration:none;font-size: 1.2em;text-transform: uppercase;line-height: 3em;display: block; float:left;    margin: 0 0 0 20px;}
.accordion dt a.icon img {}
.accordion dd {border-top: 0;font-size: 12px;margin:0px;padding:0px;}
.accordion_bis dd label {float: left;width: 90%;text-align: left;margin: 4% 5% 2%;font-weight: bold;font-size: 2em;}
.accordion dd:last-of-type {border-top: 1px solid white;position: relative;top: -1px;}
.accordion_bis {margin: 0px;}
.accordion_bis dt, .accordion_bis dd { position:relative;padding: 5px 0;border: 0px solid black;border-bottom: 0;margin-bottom: 1px;background-color: #1a1a1a;}
.accordion_bis dt:last-of-type, .accordion_bis dd:last-of-type {border-bottom: 0px solid black;}
.accordion_bis dt a {display: block;color: #ffffff;font-weight: 600;text-decoration:none;font-size: 1.4em!important;margin-left: 40px;text-transform: uppercase;}
.accordion_bis dd {border-top: 0;font-size: 12px;background-color: #eee;    padding: 30px 0;}
.accordion_bis dd:last-of-type {border-top: 1px solid white;position: relative;top: -1px;}

.selector {border: 1px solid #ddd;background: #fff;border-radius: 2px;height: 55px;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;padding: 0 26px 0 12px;font: 1.6em Gibson,sans-serif;
color: #202020;width: 90%; margin:0 5%;position: relative;line-height: 55px;transition: all .2s ease; float:left;}
.selector select {position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;background: #fffffe;opacity: 0; z-index: 1;}
.selector:after {content: "\f0d7";font: 16px/100% FontAwesome;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-indent: 0;position: absolute;top: 50%;right: 10px;margin-top: -8px;}

.accordion_bis dt .wrapper {text-transform: uppercase;background: #ececec;color: #555;cursor: help;font-family: "Gill Sans", Impact, sans-serif;font-size: 20px;margin: 100px 75px 10px 75px;padding: 15px 20px;position: relative;text-align: center;width: 200px;-webkit-transform: translateZ(0);/* webkit flicker fix */-webkit-font-smoothing: antialiased;/* webkit text rendering fix */}

.accordion_bis dt .wrapper .tooltip {background: #1496bb;bottom: 100%;color: #fff;display: block;left: -20px;margin-bottom: 15px;opacity: 0;padding: 20px;pointer-events: none;position: absolute;width: 100%;-webkit-transform: translateY(10px);-moz-transform: translateY(10px);-ms-transform: translateY(10px);-o-transform: translateY(10px);transform: translateY(10px);-webkit-transition: all .25s ease-out;-moz-transition: all .25s ease-out;-ms-transition: all .25s ease-out;-o-transition: all .25s ease-out;transition: all .25s ease-out;-webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);}

/* This bridges the gap so you can mouse into the tooltip without it disappearing */

.accordion dt .wrapper .tooltip:before {bottom: -20px;content: " ";display: block;height: 20px;left: 0;position: absolute;width: 100%;}

/* CSS Triangles - see Trevor's post */

.accordion dt .wrapper .tooltip:after {border-left: solid transparent 10px;border-right: solid transparent 10px;border-top: solid #1496bb 10px;bottom: -10px;content: " ";height: 0;left: 50%;margin-left: -13px;position: absolute;width: 0;}
.accordion dt .wrapper:hover .tooltip {opacity: 1;pointer-events: auto;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);-ms-transform: translateY(0px);-o-transform: translateY(0px);transform: translateY(0px);}


/* IE can just show/hide with no transition */

.accordion dt .lte8 .wrapper .tooltip {display: none;}
.accordion dt .lte8 .wrapper:hover .tooltip {display: block;}

span.info {float: left;width: 90%;margin: 5%; text-transform:capitalize; font-size:1.2em;}
input.acquista {width: 20%;margin: 4% 40% 0;background-color: #9D3B21;color: #ffffff;border: 0px;padding: 15px 0;font-size: 18px;font-weight: bold; cursor:pointer;}

#app { float:left; width:96%; font-size:14px; font-weight:normal; line-height:18px; padding:2%; margin: 20px 0;}
#app h1 {float: left;margin: 0;width: 100%;font-size: 1.4em;color: #9D3B21;font-weight: 600;}
#app ul { float:left; width:100%; margin:2% 0; padding:0px;}
#app ul li { list-style-type:none; float:left; margin:0px; padding:0px; margin:0 5px 0 0;}
#app ul li a { cursor:pointer;}

#footer {background-color: #1a1a1a;text-align: center;padding: 30px 0;font-size: 17px;line-height: 110%;}
#footer .container {width: auto;margin: 0 auto;position: relative;}
#footer ul.social {margin:0 0 18px; padding:0;}
#footer ul.social li {display: inline-block;margin: 0 5px;}
#footer ul.social a {display: block;height: 30px;width: 30px;text-indent: -999em;position: relative;color: #fff;transition: all .2s ease;}
#footer ul.social li.facebook a:before {content: "\f09a";}
#footer ul.social li.twitter a:before {content: "\f099";}
#footer ul.social a:before {content: "\f09a";font: 16px/100% FontAwesome;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-indent: 0;position: absolute;top: 50%;left: 5px;
font-size: 20px;line-height: 100%;margin-top: -10px;width: 20px;text-align: center;}
#footer a {color: #9D3B21;text-decoration: none;}
#footer p {margin-bottom: 18px; color:#ffffff;}

@media screen and (max-width:800px) {
	body #page {width: 780px;}
	ul.menu li a {font-size: 16px;}
	}

@media screen and (max-width:768px) {
	body #page {width: 748px;}
	ul.menu li a {font-size: 16px;}
	body #page span.web { display:none;}
	}

@media screen and (max-width:736px) {
	body #page {width: 716px;}
	input.acquista {width: 40%;margin: 3% 30% 0;}
	}

@media screen and (max-width:732px) {
	body #page {width: 712px;}
	ul.menu li.left {float: left;width: 90%;margin: 0 5%;list-style-type: none;text-align: center;background: none; padding:2% 0;border-bottom: 1px solid #9D3B21;}
	ul.menu li.right {float: left;width: 90%;padding: 0;list-style-type: none;text-align: center;margin: 0 5%; padding:2% 0;}
	}

@media screen and (max-width:667px) {
	body #page {width: 647px;}
	ul.menu li a {font-size: 18px;line-height: 30px;}
	}

@media screen and (max-width:640px) {
	body #page {width: 620px;}
	ul.menu li a {font-size: 16px;line-height: 40px;}
	ul.menu li.left {width: 90%;padding: 0 2%; margin:0 5%;}
	ul.menu li.right {width: 90%;padding: 0 2%; margin:0 5%;}
	ul.menu {margin: 0px auto 15px;}
	}

@media screen and (max-width:568px) {
	body #page {width: 548px;}
	ul.menu li.left {float: left;list-style-type: none;text-align: center;background: none; padding:1% 0;border-bottom: 1px solid #9D3B21;}
	ul.menu li.right {float: left;padding: 0;list-style-type: none;text-align: center;padding:1% 0;}
	}

@media screen and (max-width:480px) {
	body #page {width: 460px;}
	}

@media screen and (max-width:414px) {
	body #page {width: 394px;}
	.accordion dt a, .accordion dd a {font-size: 1.1em;line-height: 3.3em;}
	input.acquista {width: 50%;margin: 3% 25% 0;}
	.accordion h1 {margin: 4% 0 5% 0;}
	.accordion span.subtitle {margin: 0 0 5% 0;}
	body #page span.web {margin: 5% 0 1%;}
	}

@media screen and (max-width:412px) {
	body #page {width: 392px;}
	.accordion_bis dt a {font-size: 1.4em!important;}
	}

@media screen and (max-width:375px) {
	body #page {width: 355px;}
	.accordion_bis dd label {font-size: 1.7em;}
	#app ul {margin:4% 0;}
	}

@media screen and (max-width:360px) {
	body #page {width: 340px;}
	ul.menu li a {line-height: 40px;}
	.accordion dt span.arrow_up { display:none;}
	}

@media screen and (max-width:320px) {
	body #page {width: 300px;}
	.accordion_bis dd label {font-size: 1.4em;}
	.accordion dt a, .accordion dd a {font-size: 1em;line-height: 3.7em;}
	}
