body {
	-webkit-background-size: cover;
	-moz-background-size : cover;
	-o-background-size: cover;
	background-size: cover;
	color: #FFF;
}

div { margin: 2em 0; }

div div { sans-serif; margin: 0; }

blockquote { color: #363; padding: 1em 2em; font-style: italic; text-align: left; }

A:link	{ color: #FC0; text-decoration: none; }
A:visited { color: #FC0; text-decoration: none; }
A:active { color: #B90; text-decoration: none; }
A:hover { color: #B90; text-decoration: none; }
A.def { font-weight: bold; text-decoration: underline; }

hr { margin: 0 1em; border: none; border-bottom: 1px solid #FD0; }

TD { padding: 0 0 1em 0; vertical-align: top; }

sup { color: #FC0; font-style: italic; font-weight: bold; }

#home {
	background-color: #D00;
	border-radius: 1em;
	color: #FFF;
	display: inline-block;
	font: normal 1.6666em 'Economica', sans-serif; 
	font-weight: bold;
	padding: .25em 1em;
	text-align: center;
}

h1 {
	color: #fc0;
	font-family: 'Great Vibes', cursive;
	font-size: 3em;
	font-weight: normal;
	line-height: 1.0;
	margin: 0 auto;
	text-align: center; 
}

h2 { color: #FF0; margin: 0; font-size: 1.5em; text-align: center; }

#main {
	padding: 1em 0 0 0;
	height: auto;
	text-align: center;
	background: url('/images/main-bg.png') repeat fixed left top;
}


img { outline: 6px double #FFF; border: 2px solid #060; }
img: hover { border: 1px solid #D00; }
img.no { border: none; }
img.gold: hover { border: 2px solid #D00; }
.mip { border: 6px double #FFF; outline: 2px solid #060; }


p {  text-align: left; margin: 0 0 1em; }

TD.lg { line-height: 1.3333; padding: 0; text-align: right; }

.text { height: auto; line-height: 1.3333; text-align: left; padding: 1em; }

.text img { clear: left; float: left; margin: 0 1em 1em 0; }

#table1 { margin: 50px auto 0 0; }

#popup {
	position: absolute;
	display: none;
	z-index: 100;
	background-color: white;
	color: #080;
	width: 300px;
	text-align: left;
	line-height: 1.2;
	opacity: .9;
	filter: alpha(opacity=90);
}

#popup .red { text-align: justify; }
#popup H3 { margin: 0 auto; font-size: 1.5em; text-align: center; }

#popup.santa {
/*	border: 2px solid #C78A37;	*/
	outline: 3px ridge #080;
    border: 6px double #B00;
	font-family: inherit;
/*	height: 100px; width: 305px;	*/
	opacity: 1;
	filter: alpha(opacity=100);
	padding: 1em;
}

#star_label { display: inline-block; font-weight: bold; margin: 0; }

#starbox {
	background-image: url(images/0star.png);
	background-repeat: no-repeat;
	background-position: left top;
	display: inline-block;
	width: 155px;
	margin: 0;
	padding: 0;
	text-align: left;
}

#stars {
	background-image: url(images/5star.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 30px;
	margin: 0; padding: 0;
	overflow: hidden;
}

#star_votes { display: inline-block; margin: 0; }

form#radio { display: inline-block; }

.green { border: 4px dotted #336633; }
/*
.gold { border: 2px solid #FD0; outline: 1px solid #B90; }
.red { border: 3px double #B00; background-color: white; padding: 10px; }
*/

.survey {
	background-image: url(images/cookies_08_wash.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	color: green;
	width: 100%;  height: 618px;
}

.survey_col { float: left; }

.submit_vote {
	background-color: #fffaaa;
	background-image: linear-gradient(#fffaaa, #FC0);
	border: 1px solid #fffaaa;
	color: #D00;
	font-size: .9em;
	font-weight: bold;
	margin: 0 1em 0 0; padding: .5em;
	border-radius: .5em;
	-moz-border-radius: .5em;
	-khtml-border-radius: .5em;
	-webkit-border-radius: .5em;
	-moz-box-shadow:    0px 0px 0px 2px #FC0;
	-webkit-box-shadow: 0px 0px 0px 2px #FC0;
	box-shadow:         0px 0px 0px 2px #FC0;
	text-align: center;
	text-shadow: 1px 1px #fffaaa;
	position: absolute;
}

.submit_vote: hover {
	background-color: #FC0;
	background-image: linear-gradient(#FC0, #fffaaa);
	cursor: pointer;
}

div.cookies { background-color: #B00; padding: 0 0 1em 0; }

/* div.cookies input[type=checkbox] { visibility: hidden; display: none; } */
div.cookies input[type=checkbox] + label:hover { cursor: pointer; }

div.cookie { line-height: 1.25; margin: 0 0.667em; text-align: left; }

div.cookie label { font-size: 1.667em; font-weight: bold; }

div.cookie img { float: left; margin: .333em .667em .333em 8px; width: 200px; height: auto; }
div.cookie + input[type=checkbox]:checked ~ img { width: 300px; }

.ribbon { background-color: #B00; outline: 3px ridge #080; border: 6px double #fff; box-sizing: border-box; font: normal 1.6666em 'Economica', sans-serif; margin: .5em; }


.rating { color: #fc0; display: inline-block; margin: .5em 0 0 1em; position: relative; }
.rating legend { display: inline-block; font-weight: bold; }

.rating label span { color: #fd0; }

/* :not(:checked) is a filter, so that browsers that don’t support :checked don't 
   follow these rules. Every browser that supports :checked also supports :not(), so
   it doesn't make the test unnecessarily selective */

.rating:not(:checked) > input[type=radio] {
    position: absolute;
/*    top: -9999px; */
	left: 105%;
    clip: rect(0,0,0,0);
}

.rating input[type=submit] { left: 105%; top: 50%; clip: auto; }

.rating:not(:checked) > label {
    float: right;
    width: 1em;
    padding: 0 .1em;
    overflow: hidden;
    white-space :nowrap;
    cursor: pointer;
    font-size: 1.333em;
    line-height: .9;
    color: #fd0;
/*    text-shadow: -1px -1px #b90, 1px -1px #b90, -1px 1px #b90, 2px 2px #b90 ; */
}

.rating:not(:checked) > label:before {
    content: '★ ';
}

.rating > input:checked ~ label {
    color: #d00;
/*    text-shadow: 1px 1px #c60, 2px 2px #940, .1em .1em .2em rgba(0,0,0,.5); */
}

.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
    color: #d00;
/*    text-shadow: 1px 1px goldenrod, 2px 2px #B57340, .1em .1em .2em rgba(0,0,0,.5); */
}

.rating > input:checked + label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
    color: #d00;
/*    text-shadow: 1px 1px goldenrod, 2px 2px #B57340, .1em .1em .2em rgba(0,0,0,.5); */
}
/*
.rating > label:active {
    position: relative;
    top: 2px;
    left: 2px;
}
*/


@media handheld, screen and (max-width: 1280px) {
	.ribbon { font-size: 2em; margin: 1.6667em auto; width: 94% }
}