html, html body { height: 100%; color: #FFF; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;}
p, li, h2 { font-size: 13px; line-height: 22px;}
a { color: #FFF;}
body {background: url('images/background.jpg') top center no-repeat #1da0eb; height: 100%;}
li {list-style: disc;}
strong {font-weight: bold;}
em {font-style: italic;}

h1, p.subtitle {display: inline; margin-bottom: 20px;}
h1 {font-size: 40px;}
h2 {font-weight: bold;}
p.subtitle {font-size: 24px; margin-left: 40px;}
p {margin-top: 20px;}

div#content a { color: #FFF; text-decoration: none; border-bottom: 1px dashed #FFF;}
div#content a:hover { color: #FFF; border-bottom: 1px solid #FFF;}

div#header, div#content, div#footer {margin: 0 auto;}
div#header {background: url('images/menu/background.png'); width: 992px; height: 212px; margin-top: 30px;}
div#content {background: url('images/contentbackground.png'); width: 820px; padding: 25px;}
div#footer {background: url('images/footerbackground.png') no-repeat; width: 930px; margin-top: 20px; margin-bottom: 20px;}

div#header ul .row-alpha {margin-top: 67px;}
div#header ul .row-omega {margin-top: 4px;}
div#header ul {padding-top: 17px; padding-left: 58px;}
div#header ul li.separator {width: 3px; height: 31px; background: url('images/menu/separator.png'); padding-top: 3px;}
div#header ul li, div#header ul div {float: left; list-style: none;}
div#header ul a#logo img {margin-top: 7px;}
div#header ul li.about {margin-right: 30px;}
div#header ul li.mollegard {margin-left: 39px; margin-right: 30px;}
div#header ul li.store {margin-left: 16px; margin-right: 23px;}
div#header ul li.news {margin-left: 28px;}
div#header ul li.ice-cream {margin-left: 20px; margin-right: 32px;}
div#header ul li.ice-cream-truck {margin-left: 36px; margin-right: 35px;}
div#header ul li.production {margin-left: 26px; margin-right: 16px;}
div#header ul li.find-us {margin-left: 15px; margin-right: 23px;}

div.imagerotator {border: #0d486a 3px solid; float: right; margin-top: 25px; margin-left: 20px;}
div.imagerotator img {display: none;}
div.imagerotator img.alpha {display: inline;}

div.blackboard-top, div.blackboard-bottom, div.blackboard {width: 896px; margin-left: -40px;}
div.blackboard-top {height: 87px; background: url("images/blackboard-top.png"); margin-top: 20px;}
div.blackboard-bottom {height: 76px; background: url("images/blackboard-bottom.png"); margin-bottom: 40px;}
div.blackboard {width: 716px; padding: 0 90px; background: url("images/blackboard.png") repeat-y;}
div.blackboard p {margin-top: 0; padding-bottom: 20px;}
#tiptip_content {font-size: 13px;}


#notice {background: url('images/index/noticebg.png') repeat; padding: 10px; width: 370px; border: 1px solid #FFF; position: relative; margin-bottom: 30px;}
#notice p {margin: 0;}
#notice span {font-weight: bold;}
#notice a {position: absolute; right: 20px; text-decoration: underline !important;}


/* rails layout helpers */
div#errorExplanation {border: 1px solid #C61010; margin: 10px -10px; padding: 10px; background: #FF8080;}
div#errorExplanation li {list-style: disc inside;}
div.notice {border: 1px solid #005A75; margin: 10px -10px; padding: 10px; background: #D1F4FF; color: #00232E;}

div#footer ul {padding-top: 13px; padding-left: 35px; letter-spacing: 1px;}
div#footer ul li {color: #008dde; float: left; margin-right: 16px; list-style: none; font-size: 16px;}
div#footer ul li a {color: #008dde; text-decoration: none;}
div#footer ul li a:hover {color: #00a2ff; text-decoration: underline;}
div#footer p {float: left; color: #99daff; font-size: 11px;}
div#footer p a { color: #99daff; }
div#footer p a:hover { color: #FFF; }
div#footer p.copyright {margin-left: 50px;}
div#footer p.producedby {float: right; margin-right: 50px;}
div#footer p.producedby a {border-bottom: none; text-decoration: none;}

/* generic layout helpers */
.listrow {margin-top: 20px;}
.listrow ul {float: left;}
.listrow ul li {margin-left: 20px;}
.icon-link {margin-left: 20px}
.icon-link img {margin: 0 5px -4px -20.5px;}

/* page specific */
html#index, html#index body { height: 100%; }
html#index body {background: url("images/index/bg.png") no-repeat center #1DA0EB;}

html#index #content {
	width: 820px;
	height: 670px;
	position: relative;
	left: 50%;
	top: 50%;
	margin-left: -410px; 
	/* Half the width of the DIV tag which is 50 pixels */
	margin-top: -310px; 
	/* Half the height of the DIV tag which is also 50 pixels */
	overflow: hidden;
	background: none;
	margin: none;
}
html#index .planet {position: absolute; top:0; left: 0; z-index: -20; float: left;}
html#index #clouds {}
html#index #back_layer {}
html#index #planet {}
html#index #bus {}
html#index #front_layer {}

html#index a, html#index h1 {position: absolute; border-bottom: none;}
html#index a {
	opacity: 0.6;
	-webkit-transition-property: opacity; 
	-webkit-transition-duration: 1s;
	}
html#index a:hover {background: none; opacity: 1; border-bottom: none;}
html#index h1 {top: 210px; left: 260px;}
html#index #store {top: 0px; left: 310px;}
html#index #mollegard {top: 90px; left: 575px;}
html#index #news {top: 266px; left: 650px;}
html#index #find-us {top: 440px; left: 570px;}
html#index #ice-cream {top: 480px; left: 100px;}
html#index #production {top: 539px; left: 310px;}
html#index #ice-cream-truck {top: 240px; left: 0px;}
html#index #about {top: 90px; left: 90px;}

html#index #social-media {position: absolute; right: 0px; top: 0; width: 224px; height: 84px;
	padding-top: 19px; padding-left: 24px; background: url('images/index/smbg.png') no-repeat;}
html#index #social-media img {vertical-align: -30%; margin-right: 5px; }
html#index #social-media a {position: static; display: block; line-height: 24px; font-size: 12px;}
html#index #social-media a.twitter {color: #00acdb; margin-bottom: 4px;}
html#index #social-media a.facebook {color: #0065fd;}

html#index #notice {position: absolute; left: 155px; top: 350px; width: 490px; }


html#ice-cream ul#moreinfo {margin-left: 200px;}
html#ice-cream ul#moreinfo li.assortment, html#ice-cream ul#moreinfo li.allergy, html#ice-cream ul#moreinfo li.cakes {line-height: 35px; list-style: none; margin-left: 0; padding-left: 45px; margin-bottom: 5px;}
html#ice-cream ul#moreinfo li.assortment {background: url('images/ice-cream/assortment.png') no-repeat;}
html#ice-cream ul#moreinfo li.allergy {background: url('images/ice-cream/allergy.png') no-repeat;}
html#ice-cream ul#moreinfo li.cakes {background: url('images/ice-cream/cakes.png') no-repeat;}


html#production p.subtitle {font-size: 22px;}
html#production .imagerotator {margin-top: 10px;}

html#find-us div.imagerotator {margin-top: 10px;}
html#find-us #content a img {margin-left: -10px;}
html#find-us #content a {border-bottom: none;}
html#find-us div.blackboard {position: relative; padding-top: 20px;}
html#find-us div.blackboard h2 {position: absolute; top: -15px; font-size: 20px;}
html#find-us div.blackboard p {padding-bottom: 0;}
html#find-us div.blackboard .col1, html#find-us div.blackboard .col2 {float: left;}
html#find-us div.blackboard .col1 {width: 360px; background: url("images/blackboard-sep.png") no-repeat right;}
html#find-us div.blackboard .col2 {width: 320px; padding-left: 30px;}

html#find-us #notice {width: 490px;}

html#news h2 {margin-bottom: 20px; font-size: 23px; width: 100%; padding-bottom: 2px; }
html#news div.story {width: 820px; margin-top: 50px; border-bottom: 1px solid #FFF; padding-bottom: 50px;}
html#news div.story div {float: right;}
html#news div.story div.image {width: 320px; text-align: center; padding-bottom: 1px;}
html#news div.story div.text {padding-left: 20px; width: 480px;}

html.store .hr {height: 6px; width: 700px; background: url('images/store/hr.png') repeat-x; margin: 30px auto;}
html#store-cart .hr {margin: 5px auto;}
html#store-cart .hr-omega {margin-bottom: 0;}
html#store-cart #top-buttons {margin-top: 20px;}
html.store .blackboard{text-align: center; padding: 0 60px; width: 776px;}
html.store a {border-bottom: none !important;}
html.store a:hover {border-bottom: none !important;}
html.store h2 {font-size: 36px; border-bottom: 1px solid #FFF; display: inline;}
html.store h3 {font-size: 20px;}
html.store #content {position: relative;}
html.store #cart-buttons {position: absolute; top: 25px; right: 0;}
html.store #cart-buttons a {display: block; float: left;}
html.store #cart-buttons #cart {margin-top: 1px; margin-right: 10px;}
html.store div#cart-btn {background: url("images/store/cart-btn-bg.png"); width: 171px; height: 22px; color: #6faa22; font-weight: bold; font-size: 12px; padding-top: 33px; text-align: center;} 
html.store .item {text-align: left; height: 70px; margin-top: 20px;}
html.store .item-alpha {margin-top: 0;}
html.store .item p {padding-bottom: 0;}
html.store .item .image, html.store .item .description, html.store .item .price, html.store .item .buttons, html.store .item .count, html.store .item .sum {float: left;}
html.store .item .image {position: relative; width: 162px; height: 70px;}
html.store .item .image img {position: absolute; z-index: 1;}
html.store .item .image img.image-clip {position: absolute; z-index: 20; top: -2px; left: 74px;}
html.store .item .image img.image-zoom {position: absolute; z-index: 20; bottom: 7px; right: 2px;}
html.store .item .description {margin-left: 25px; padding: 10px 0; width: 340px;}
html.store .item .description p {color: #008dde; margin-top: 3px;}
html.store .item .price, html.store .item .sum, html.store .item .count {height: 70px; margin-top: 20px; width: 78px; text-align: right; font-size: 20px;}
html.store .item .count {margin-top: 18px; margin-left: 15px; width: 50px;}
html.store .item .sum {width: 70px;}
html.store .item .count span, html.store .item .count input {float: left; display: block;}
html.store .item .count span {margin-top: 7px; font-size: 10px;}
html.store .item .count input[type=hidden] { border:none; display: none;}
html.store .item .count input { margin-left: 10px; width: 20px; text-align: right;margin-top: 2px;}
html.store .item .buttons { margin-left: 17px; font-size: 11px; padding-top: 8px;}
html.store .item .buttons a {display: block;}
html.store .cake .description {width: 296px;}
html.store .cake .price {font-size: 12px; width: 122px; margin-top: 0; line-height: 31px; padding-right: 10px;}
html.store .cake .buttons { margin-left: 7px; padding-top: 0;}
html.store .cake .buttons a { padding-top: 4px;}
html#store-index .ice-cream .price { width: 88px;}
html#store-index .ice-cream .description { width: 330px;}

html#store-cart .blackboard-top img {display: block; float: left; margin-top: 5px;}
html#store-cart .blackboard-bottom {margin-bottom: 0; z-index: 20; position: relative;}
html#store-cart div#order-wrapper {margin-bottom: 40px; padding: 0 50px; }
html#store-cart #price-label { margin-left: 585px; display: inline;}
html#store-cart #count-label { margin-left: 6px;}
html#store-cart #total-label { margin-left: 4px;}
html#store-cart .item .description { width: 320px;}
html#store-cart .item .buttons { margin-top: 8px;}
html#store-cart .count .submit {width: 100px;}
html#store-cart h2 { border-bottom: none; color: #000; display: block; margin-bottom: 10px;}
html#store-cart span.total{ color: #0092e5; font-size: 30px; margin-bottom: 9px; display: block;}
html#store-cart span.total span {font-size: 20px;}
html#store-cart div#order {background: url('images/store/order-bg.png') bottom; width: 708px; padding: 10px 20px 20px; z-index:10; margin-top: -20px; color: #4ab3ef; float: right;}
html#store-cart div#order div.col1 label {display: block; width: 200px; font-size: 13px;}
html#store-cart div#order div.col1, html#store-cart div#order div.col2 {float: right;}
html#store-cart div#order div.col1, html#store-cart div#order div.col1 div.wrapper, html#store-cart div#order div.col1 div.wrapper h2 {width: 520px;}
html#store-cart div#order div.col2 {width: 188px; text-align: center; padding: 50px 0 8px; right: 20px; height: 100%;}
html#store-cart div#order .field {margin: 2px 10px 10px; width: 241px; border: 1px solid #4ab3ef; padding: 3px 2px; border-radius: 5px; -o-border-radius: 5px; -icab-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #000; display: block;}
html#store-cart div#order select.field {width: 247px; color: #4AB3EF;}
html#store-cart div#order .label {color: #4ab3ef}
html#store-cart div#order .fieldWithErrors .field, html#store-cart div#order .fieldWithErrors label {border-color: #FF8080; color: #FF8080;}
html#store-cart div#order .alpha {margin-left: 0;}
html#store-cart div#order .omega {margin-right: 0; margin-left: 0;}
html#store-cart div#order div.wrapper div.sub-col1 {width:auto;float: left;}
html#store-cart div#order div.wrapper div.sub-col2 {width:auto; text-align: left; padding: 0; position: static; right: 0; float: left; margin-left: 10px;}
html#store-cart div#order div#errorExplanation {margin: 20px 0; color: #222;}

html#store-cart body.has-js div#order .col1 {display: none;}
html#store-cart body.has-js div#order .col1 label {}
html#store-cart body.has-js div#order {width: 198px;}
html#store-cart body.has-js div#order .col2 {padding-top: 0;}
html#store-cart body.has-js div#order .errorExplanation {display:none;}
html#store-cart body.has-js .count .submit {display: none;}

#store-choose-gift-card label {display: inline; width: 200px; font-size: 17px;}
#store-choose-gift-card h1 {display: block;}
#store-choose-gift-card input.field {font-size: 15px; margin: 10px 0; width: 41px; border: 1px solid #094263; padding: 1px 2px; border-radius: 5px; -o-border-radius: 5px; -icab-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #000; display: inline; text-align: right;}
#store-index #store-choose-gift-card #form {width: 320px; height: 70px; text-align: center;}
#store-index #store-choose-gift-card  {background: url('images/blackboard-sans-border.png') center;}

#store-choose-ice-cream h1 {display: block;}

html.admin div.item {margin-bottom: 20px; border: 1px solid #000; padding: 12px; background: url('images/admin/bg.png');}
html.admin div.section {margin-bottom: 50px;}
html.admin a {font-size: 13px;}
html.admin div.item h3 {}
html.admin div.item p {margin: 0; margin-bottom: 1px;}
html.admin h1 {margin-bottom: 30px;display: block;}
html.admin h2 {margin-bottom: 20px; font-size: 23px; width: 100%; border-bottom: 1px solid #FFF; padding-bottom: 2px;}
html.admin div.cake {float: left; width: 280px; text-align: center; margin-right: 20px; border: 1px solid #630909;}
html.admin div.flavour {float: left; width: 280px; text-align: center; margin-right: 20px; border: 1px solid #630909;}
html.admin div.in-stock {border: 1px solid #096309; background: url('images/admin/bg-green.png');}
html.admin div.flavour h3 {margin-bottom: 10px;}
html.admin div#content div a.icon-link {padding: 0 10px; border-bottom: none; text-decoration: underline; padding-bottom: 3px;}
