body { color: #000; font: 300 12px/1.625 Arial, sans-serif; background-color:#E5E5E5; margin:0;}
body.simple {background-color:#fff;}

.row { width: 100%; max-width: 760px; min-width: 727px; margin: 0 auto; background-color:#FFF;}
@media only screen and (max-width: 760px) {
	.row {min-width:300px;}	
}

.splashbody { background-color: #ccc; }
.splashbody .row { background-color: #fff; }

h1 {margin:0;padding:16px 0 17px 0;}
h2 { margin: 0; padding: 34px 0 0; font-size:30.5px; text-align:center; }
h4 { font-weight: 700; }
p {line-height:16px;color: #666;}

body.simple h1 {text-align:center;padding:44px 0 37px 0;}
#splash h2 {padding-bottom:16px;}

.contentcontainer h2 {font-size:26px;color:#000;}
.contentcontainer p {font-size:16px;line-height:25px;color:#000;text-align:center;}

a, a:hover, a:visited, a:active { color: #06C; text-decoration: none; }

a.button, button.button { color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);font-size:23px;
background-color: #fc0000; 
background: -moz-linear-gradient(top,  #fc0000 0%, #a61d1d 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fc0000), color-stop(100%,#a61d1d));
background: -webkit-linear-gradient(top,  #fc0000 0%,#a61d1d 100%); 
background: -o-linear-gradient(top,  #fc0000 0%,#a61d1d 100%);
background: -ms-linear-gradient(top,  #fc0000 0%,#a61d1d 100%); 
background: linear-gradient(top,  #fc0000 0%,#a61d1d 100%);
filter: progid:dximagetransform.microsoft.gradient( startColorstr='#fffc0000', endColorstr='#ffa61d1d',GradientType=0 ); 
filter: progid:dximagetransform.microsoft.gradient(enabled=false);
border-color: #970f0f;
height:auto;
padding:8px 0 10px;
border-radius:8px;
max-width:300px;
margin-left:auto;
margin-right:auto;
}

a.button:hover {color:#fff;}

.lastword {color:#eb2604;vertical-align:baseline;}

.header { height: 129px; background-color: #1C1C1D; background-image:url('../images/waterstones_header_line.png');background-repeat:repeat-x;background-position:bottom left;}
body.simple .header {background-image:url('../images/waterstones_simple_header_line.png');height:auto;}
.header .row {background-color:transparent;}
.splashheader { height: 120px; background-color: #000; }

.header > .row {position:relative;}
.header .menucontainer {padding-right:0;position:absolute;top:0;right:0;}
.header .logocontainer {padding-left:4px;padding-right:100px;}
.header .logocontainer h1 {padding:34px 0 17px 20px;}

.navbar { display: block; height: 47px !important; margin: 0 0 30px; padding: 0; line-height: 45px; width: 100% !important; background: #444; }
.navbar a { color: #fff; text-decoration: none; }
.navbar { list-style-type: none; }
.navbar li { float: left; list-style:none;}
.navbar li h3 {color: white; line-height: 18px; margin-right: 20px; }
.navbar > li.divider { background: black; -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1); height: 100%; margin-right: 1px; width: 1px; }
.navbar > li:hover a { background: black; }
.navbar > li a { color: white; display: block; font-size: 13px; font-weight: bold; height: 45px; line-height: 45px; padding: 0 15px; }
.navbar > li { position: relative; }
.navbar > li a { padding-right: 15px; }
.navbar > li a:after { content: ""; display: block; width: 0; height: 0; border: solid 5px; border-color: white transparent transparent transparent;
 margin-right: 15px; margin-top: -2.5px; position: absolute; right: 0; top: 50%; }
.navbar > li .drop { background: #333; left: 0; margin: 0; padding: 9px 0; position: absolute; visibility: hidden; z-index: 99; }
.navbar ul > li .drop.expanded  { display: block; visibility: visible; }
.navbar > li .drop li { float: none; }
.navbar > li .drop li a { font-weight: normal; height: 100%; line-height: 1; padding: 5px 17px 5px 15px; white-space: nowrap; }
.navbar > li .drop li a:after { border: none; }
.navbar > li .drop li a:hover { background: #3c3c3c; }
.navbar > li .drop li.divider { border-top: solid 1px black; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; height: 10px; padding: 0; margin: 10px 0 0 0; width: 100%; background: transparent; }

.header .navbar {background-color:transparent;}
.header .navbar > li .drop {background-color:#1c1c1d;}
.header .navbar > li a:after {display:none;}
.header .navbar > li .drop {padding:16px 0;left:auto;right:0;}
.header .navbar {margin-top:32px;margin-bottom:0;}
.header .navbar > li a {background-color:#1c1c1d;}
.header .navbar > li .drop li a {padding:8px 25px;font-size:16px;text-align:right;}
.header .menuButton {height:auto;margin-bottom:-6px;cursor:pointer;}
.header .menuButton img {display:block;clear:both;margin:6px auto;}


.grid { padding: 0 20px; }

.container {margin-top:-3px;}
body.simple .container {margin-top:0;}

body p.entrytext {text-align:left; margin: 60px 0 30px; font-size:26px;line-height:32px;color:#000;}
input[type=text] {box-sizing: border-box;-moz-box-sizing: border-box; -webkit-box-sizing: border-box;font-size:20px;padding:10px;border-radius:8px;width:100%;margin:0 0 16px 0;-webkit-box-shadow:inset 0px 1px 3px #ddd;border:1px solid #ddd;box-shadow:inset 0px 1px 3px #ddd;border:1px solid #ddd;}
input:-moz-placeholder, textarea:-moz-placeholder { color: #DDDDDD; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #DDDDDD; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #DDDDDD; }

body.simple input[type=checkbox] {margin-right:5px;}
body.simple label {color:#000;font-size:16px;line-height:20px;margin:6px 0 14px;}
body.simple form a {color:#000;text-decoration:underline;}

.contentcontainer {padding:0 38px;}

.accent { width: 100%; margin: 30px 0 80px; }

.contentblock { padding: 0px 20px 32px 20px; overflow:hidden;}
.contentblock {padding:0 29px 32px 29px;}
.contentblock h3 { border-top: 1px solid #B6B2AC; border-bottom: 1px solid #D2DFCB; padding: 5px 0; font-size:20px; margin-bottom:13px;}
.contentblock .imagecontainer {padding:0 13px 0 0;}
.contentblock .description {padding:0 0 0 106px;}
.contentblock .description h4 {margin-top:0;font-size:15px;line-height:18px;color:#212121;font-weight:normal;}
.contentimage img {float:left; padding-right: 15px; max-height: 125px;}
.left {padding-left:29px;padding-right:20px;}
.right {padding-left:20px;padding-right:29px;}

.waterstonescard {text-align:center;padding:0 14px;}
.facebook,
.twitter {margin-top:37px;padding: 0 20px 0 29px;}
.facebook h3,
.twitter h3 {border-top: 1px solid #B6B2AC; border-bottom: 1px solid #D2DFCB; padding: 5px 0; font-size:20px; margin-bottom:13px;}
.tweet1 {padding: 22px 20px 30px 0;}
.tweet2 {padding: 22px 29px 50px 0;}
.posted {vertical-align:baseline;}

.facebook { padding-bottom: 50px; padding: 0 29px 0 20px;}

.twitter-timeline, .fb-like-box.fb_iframe_widget { margin-top: 22px; height: 300px; }
.row.main { padding-bottom: 50px; }

.terms h2 {text-align:left;}
.terms p { text-align:left; font-size: 12px; }

.footer { text-align: center; height: 60px; background-color: #000; }
.footer .row {background-color:transparent;}
.footer .footerinner {padding:0;text-align:left;}
.footer a { margin: 23px 0; display: inline-block; color: #fff; text-decoration: none; font-size: 12px; line-height:13px; }
.footer a ~ a {margin-left:6px;padding-left:9px;border-left:1px solid #a0a0a0;}
.footer a:hover { text-decoration: underline; }

.splashfooter { text-align: left; background-color: #333; }


h3 a { color: #000 !important; }
h3 a:hover { color: #000; text-decoration: underline; }

/* carousel */
.carouselcontainer {padding:0;}
.carouselcontainer img {width:100%;}
.carousel {background-color:#000;overflow:hidden;padding:0;cursor:pointer;}
.carousel h2, .carousel p {font-family:"Lucida Grande",Verdana,Arial,Helvetica,Sans-serif;}
.carousel li {position:relative;}
.carousel li img {width:100%;}
.carousel .details {padding:5px;position:absolute;bottom:0;width:100%;background-image:url('../images/background_details.png');background-repeat:repeat;}
.carousel h2 {color:#fff;font-size:20px;font-weight:bold;text-align:left;padding:5px 5px 0 5px;}
.carousel p {color:#fff;font-size:16px;text-align:left;padding:5px;margin:0;}
.carousel a {color:#fff;}

.overlay {position:absolute;top:0;left:0;z-index:98;background-color:#000;-webkit-opacity:0.5;-moz-opacity:0.5;opacity:0.5;filter:alpha(opacity=50);width:100%;height:100%;}

.blog-image { max-width: 27%; }

p.events { color: #333; font-size: 14px; }

/* adjustments for mobile */
@media only screen and (max-width: 480px) {
	body p.entrytext {font-size:20px;line-height:25px;margin-top:30px;}
	.header h1 {margin-left:20px;margin-right:20px;}
	.accent {margin-bottom:40px;}
}

@media only screen and (max-width: 760px) {	
	.left {padding-left:20px;padding-right:20px;}
	.right {padding-left:20px;padding-right:20px;}
	.facebook,
	.twitter {padding-left:20px;padding-right:20px;}
	.tweet1 {padding-bottom:10px;}
	.footer .footerinner {padding:0 20px;}
}
