/* 
    Document : style of Nutripet Quiz
*/


/* HEADER */
header {
	background-image: url(../../../img/quiz/nutripet/pattern.png);
	background-repeat: repeat;
	-moz-box-shadow: inset 0px 0px 80px 0px #DDD;
	-webkit-box-shadow: inset 0px 0px 80px 0px #DDD;
	box-shadow: inset 0px 0px 80px 0px #DDD;
	border-top-color: #ddd;
}
header hgroup h2 {
	position: absolute;
	right: 180px;
	margin: 0;
}
header hgroup span.rotate {
	display: block;
}
header hgroup h2 {
	font-size: 26px;
	font-family: 'Pacifico', cursive;
	color:#DE000B;
	line-height: 42px;
	font-weight: normal;
}
header hgroup h2 span.rotate {
	font-size: 34px;
	-webkit-transform: rotate(-6deg);
	-moz-transform: rotate(-6deg);
	-ms-transform: rotate(-6deg);
	-o-transform: rotate(-6deg);
}

/* CONTENT */
.box-big {
	position: relative;
	margin: 20px 10px 20px 10px;
	padding: 10px;
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	
	-moz-box-shadow: 0 2px 6px #999;
	-webkit-box-shadow: 0 2px 6px #999;
	box-shadow: 0 2px 6px #999;
	
	background-image: url(../../../img/quiz/nutripet/texture-box.png);
	background-repeat: repeat;
	background-color: #ccc;
}
.box-big .box-content {
	padding: 50px 40px 40px 40px;
	
	border: 5px solid #fff;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	
	background-color: #fff;
		
	-moz-box-shadow: inset 0 0 6px 1px #ccc, 0 0 2px 0 #999;
	-webkit-box-shadow: inset 0 0 6px 1px #ccc, 0 0 2px 0 #999;
	box-shadow: inset 0 0 6px 1px #ccc, 0 0 2px 0 #999;
}
.box-small {
	position: relative;
	margin: 20px 10px 20px 10px;
	padding: 20px 30px 25px 30px;
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	
	-moz-box-shadow: 0px 5px 7px #ccc;
	-webkit-box-shadow: 0px 5px 7px #ccc;
	box-shadow: 0px 5px 7px #ccc;
	
	background-color: #fff;
}
.label-big .money {
	font-size:50px;
}
.label-small .money {
	font-size: 45px;
	float: left;
	display: block;
	line-height: 64px;
	margin-left: 43px;
}
.label-small .two-line {
	line-height: 24px;
	float: right;
	text-align: left;
	font-size: 21px;
	margin-right: 11px;
	margin-top: 23px;
}
.sepa-container {
	width: 100%;
}
.sepa-shadow {
	border-top: 5px dotted #DA001A;
	width: 49%;
	margin: auto;
}
.button {
	display: block;
	width: 200px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	overflow: hidden;
	
	font-size: 32px;
	color: #fff;
	text-shadow: 0px -1px 1px #650509;
	font-family: 'Pacifico', cursive;
	
	border: 2px outset buttonface;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	
	-moz-box-shadow: inset 0px -3px 20px 0px #570300, 0 0 2px 0 #999;
	-webkit-box-shadow: inset 0px -3px 20px 0px #570300, 0 0 2px 0 #999;
	box-shadow: inset 0px -3px 20px 0px #570300, 0 0 2px 0 #999;
	
	background: #a00500;
	background: -moz-linear-gradient(left, #a00500 0%, #c10e00 55%, #a00500 99%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#a00500), color-stop(55%,#c10e00), color-stop(99%,#a00500));
	background: -webkit-linear-gradient(left, #a00500 0%,#c10e00 55%,#a00500 99%);
	background: -o-linear-gradient(left, #a00500 0%,#c10e00 55%,#a00500 99%);
	background: linear-gradient(to right, #a00500 0%,#c10e00 55%,#a00500 99%);
}
.button.disable {
	text-shadow: 0px -1px 1px #333;
	-moz-box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	-webkit-box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	background: #999;
}
.button.small {
	height: 30px;
	line-height: 30px;
	font-size: 20px;
	width: 130px;
}
button.button {
	height: auto;
}
.button:hover, button.button:hover {
	text-shadow: 0px -1px 1px #333;
	background: #f00d1a;
	border: 2px outset #999;
	color:#fff;
}

.button.disable:hover, button.button.disable:hover {
	cursor: default;
	text-shadow: 0px -1px 1px #333;
	-moz-box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	-webkit-box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	box-shadow: inset 0px -3px 20px 0px #555, 0 0 2px 0 #999;
	border: 2px outset buttonface;
	background: #999;
}
.button.aside {
	width: 180px;
	margin: auto;
}
.button.single {
	width: 200px;
	margin: auto;
}
.button.left {
	margin: left;
}
aside h2 {
	font-size: 30px;
	font-family: 'Pacifico', cursive;
	color:#DE000B;
	line-height: 45px;
	text-transform: none;
	font-weight: normal;
}
.oppure{
	float: left;
	margin-left: 30px;
	margin-top:20px;
}
#form-scontrino ul {
	margin: 0;
	padding:0;
}
#form-scontrino ul li {
	list-style: none;
}
#form-scontrino ul li input, #form-scontrino ul li select {
	background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    font: 16px Arial,Times,serif;
    outline: medium none;
    padding: 10px;
	width: 215px;
	color:#808082;
}
.centered-link {
	width: 200px;
	display: block;
	margin: auto;
	text-align: center;
	font-weight: bold;
	font-family: arial;
}
.placeholder {
	margin-top: 5px;
	display: block;
	font-size: 11px;
	font-style: italic;
	text-align: center;
}
#quiz label {
	display: block;
	margin-bottom: 10px;
}
#quiz label input {
	margin-right: 10px;
}
.link-prodotto
{
	font-weight: bold;
	color:#DE000B;
}

/* HEADING STYLE */
h1 {
	font-size: 35px;
	color:#DE000B;
	line-height: 46px;
	font-family: 'Pacifico', cursive;
	letter-spacing: 0px;
	font-weight: normal;
}
h2 {
	font-size: 26px;
	font-family: 'Pacifico', cursive;
	font-weight: normal;
}
h3 {
	font-size: 24px;
	font-family: 'Pacifico', cursive;
	font-weight: normal;
}
.box-big p, .box-small p {
	color:#58585A;
	font-family: arial;
}
p.red {
	color:#DE000B;
}
.fs11 {
	font-size: 11px;
	line-height: 14px;
}
.fs12 {
	font-size: 12px;
	line-height: 16px;
}
.fs13 {
	font-size: 13px;
	line-height: 18px;
}
.fs14 {
	font-size: 14px;
	line-height: 20px;
}
.fs18 {
	font-size: 18px;
	line-height: 22px;
}
.mr0 {
	margin: 0;
}
.pd0-15 {
	padding:0 15px;
}

/* DEFAULT STYLE */
.fLeft {
	float: left;
}
.fRight {
	float: right;
}
.sepa40 {
	height: 40px;
}
.sepa60 {
	height: 60px;
}
.sepa100 {
	height: 100px;
}
.gray {
	color:#878E95;
}
.red {
	color:#DE000B;
}
.w300 {
	width: 300px;
}
.imgC {
	display: block;
	margin:auto;
}
.ln50 {
	line-height: 56px;
}

/* SPRITE */
.sprite-jpg {
	background-image: url(../../../img/quiz/nutripet/sprite-nutripet.jpg);
	background-repeat: no-repeat;
}
.sprite-png {
	background-image: url(../../../img/quiz/nutripet/sprite-nutripet.png);
	background-repeat: no-repeat;
}
.logo-purina {
	background-image: url(../../../img/quiz/nutripet/logo-purina.jpg);
}
.logo-nutripet {
    background-position: 0 0;
    left: 210px;
	position: absolute;
}
.foto-header {
	background-position: -280px 0;
	position: absolute;
	right: -8px;
	top: -10px;
}
.corner-big {
	background-position: 0 -327px;
	background-repeat: no-repeat;
	position: absolute;
	left: -6px;
	top: -4px;
}
.corner-small {
	background-position: -396px -406px;
	background-repeat: no-repeat;
	position: absolute;
	right: -3px;
	top: -4px;
}
.label-big {
	background-position: -57px -235px;
	background-repeat: no-repeat;
	position: absolute;
	width: 412px;
	height: 92px;
	right: -8px;
	color: #fff;
	padding-right: 10px;
	text-align: right;
	line-height: 75px;
	text-shadow: -1px -1px 1px #650509;
}
.label-small {
	background-position: -191px -327px;
	background-repeat: no-repeat;
	position: absolute;
	width: 287px;
	height: 79px;
	right: -20px;
	color: #fff;
	padding-right: 10px;
	text-align: right;
	line-height: 20px;
	text-shadow: -1px -1px 1px #650509;
}
.icons {
	background-position: 0 -352px;
	background-repeat: no-repeat;
	display: block;
    margin: auto;
}
.logo-esselunga {
	background-position: 0 -282px;
	background-repeat: no-repeat;
}
.scontrino {
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
    margin: auto;
}
.fb-button {
	background-position: 0 -93px;
	background-repeat: no-repeat;
	position: absolute;
	left: 130px;
	bottom: -11px;
}
.tw-button {
	background-position: -89px -93px;
	background-repeat: no-repeat;
	position: absolute;
	left: 265px;
	bottom: -11px;
}
.gp-button {
	background-position: -178px -93px;
	background-repeat: no-repeat;
	position: absolute;
	right: 130px;
	bottom: -11px;
}