/*!
Theme Name: John Bishop Winging It
Author: LUA Design

*/
/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:

	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com

-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
@import url("http://fast.fonts.net/t/1.css?apiType=css&projectid=711d3134-ccd0-4770-bc0c-a4770b5df714");
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { margin: 0; padding: 0; border: 0; font-size: 100%; font-weight: normal; vertical-align: baseline; background: transparent; }

article, aside, figure, footer, header, nav, section, details, summary { display: block; }

/* Handle box-sizing while better addressing child elements: http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
html { box-sizing: border-box; }

*, *:before, *:after { box-sizing: inherit; }

/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Responsive images and other embedded objects Note: keeping IMG here will cause problems if you're using foreground images as sprites. If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img, object, embed { max-width: 100%; }

/* force a vertical scrollbar to prevent a jumpy page */
html { overflow-y: scroll; }

/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse: collapse; border-spacing: 0; }

th { font-weight: bold; vertical-align: bottom; }

td { font-weight: normal; vertical-align: top; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

pre { white-space: pre; /* CSS2 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ word-wrap: break-word; /* IE */ }

input[type="radio"] { vertical-align: text-bottom; }

input[type="checkbox"] { vertical-align: bottom; }

.ie7 input[type="checkbox"] { vertical-align: baseline; }

.ie6 input { vertical-align: text-bottom; }

select, input, textarea { font: 99% sans-serif; }

table { font-size: inherit; font: 100%; }

small { font-size: 85%; }

strong { font-weight: bold; }

td, td img { vertical-align: top; }

/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp { font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable, label, input[type=button], input[type=submit], input[type=file], button { cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }

/* make buttons play nice in IE */
button, input[type=button] { width: auto; overflow: visible; }

/* scale images in IE7 more attractively */
.ie7 img { -ms-interpolation-mode: bicubic; }

/* prevent BG image flicker upon hover (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }

.clearfix:after { clear: both; }

.clearfix { zoom: 1; }

/* colours */
/* media queries */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.chromeframe { position: absolute; top: 0; }

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/
html { -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; }

body { font: 13px; background-image: url(images/JohnBishop-homebackground.jpg); background-color: #b3b3bb; background-position: center top; background-repeat: no-repeat; background-size: contain; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
@media only screen and (max-width: 979px) { body { background-position: center 50px; } }
@media only screen and (max-width: 599px) { body { background-position: center 80px; } }

body, select, input, textarea { color: #1c2834; }

::-moz-selection { background: #fcd700; color: #1c2834; text-shadow: none; }

::selection { background: #fcd700; color: #1c2834; text-shadow: none; }

/*	j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: none; }

ins { background-color: #fcd700; color: #000; text-decoration: none; }

mark { background-color: #fcd700; color: #000; font-style: italic; font-weight: bold; }

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color: #1c2834; }

textarea:-moz-placeholder { color: #1c2834; }

input:focus, textarea:focus { outline: none; }

[placeholder]:focus::-webkit-input-placeholder { transition: opacity 0.5s 0.5s ease; opacity: 0; }

a, input[type=button], input[type=submit], button, .gigbookings:hover, .gigbookings:focus { color: #a71c20; text-decoration: none; -webkit-transition: all 0.9s ease-in-out; -moz-transition: all 0.9s ease-in-out; -ms-transition: all 0.9s ease-in-out; -o-transition: all 0.9s ease-in-out; transition: all 0.9s ease-in-out; }

a:hover, a:focus, input[type=button]:focus, input[type=submit]:focus, button:hover, input[type=button]:hover, input[type=submit]:hover { color: #2a83c8; }

input, button { background: none; -webkit-appearance: none; border-radius: 0; }

button:focus { outline: 0; }

@font-face { font-family: "socicon"; src: url("Fonts/socicon-webfont.eot"); src: url("Fonts/socicon-webfont.eot?#iefix") format("embedded-opentype"), url("Fonts/socicon-webfont.woff") format("woff"), url("Fonts/socicon-webfont.ttf") format("truetype"), url("Fonts/socicon-webfont.svg#sociconregular") format("svg"); font-weight: normal; font-style: normal; }
@font-face { font-family: "Futura W01 Light"; src: url("Fonts/2c660b2f-8645-4b31-89fe-1c017eeb5e85.eot?#iefix"); src: url("Fonts/2c660b2f-8645-4b31-89fe-1c017eeb5e85.eot?#iefix") format("eot"), url("Fonts/28b3ece5-82e3-4a7d-b043-3141dba45141.woff2") format("woff2"), url("Fonts/e80a3257-e0b2-4f7c-b4e8-0167c9adb7c0.woff") format("woff"), url("Fonts/5426d3ca-532d-4e71-a700-0a22917df569.ttf") format("truetype"), url("Fonts/67fb5232-0944-4965-8594-ed2972b84950.svg#67fb5232-0944-4965-8594-ed2972b84950") format("svg"); }
@font-face { font-family: "Futura W01 Book"; src: url("Fonts/57a6731b-fa5c-4c8a-bea8-e2f1a287f309.eot?#iefix"); src: url("Fonts/57a6731b-fa5c-4c8a-bea8-e2f1a287f309.eot?#iefix") format("eot"), url("Fonts/febf3d0c-873f-4285-8ab4-77c31b26e747.woff2") format("woff2"), url("Fonts/4d0e252c-d811-4a5d-a7f3-6ad72c6b76f2.woff") format("woff"), url("Fonts/54250d43-02be-4ff9-b802-a4ea104a0611.ttf") format("truetype"), url("Fonts/15c556fc-4608-4b01-8a0d-9c8631c8bd74.svg#15c556fc-4608-4b01-8a0d-9c8631c8bd74") format("svg"); }
@font-face { font-family: "Futura W01 Medium"; src: url("Fonts/f0052336-792e-4fcf-8750-fe6d7d5dccba.eot?#iefix"); src: url("Fonts/f0052336-792e-4fcf-8750-fe6d7d5dccba.eot?#iefix") format("eot"), url("Fonts/d50a1cc0-9e70-4383-b170-6570062160a4.woff2") format("woff2"), url("Fonts/1b696b29-a6bd-4411-a50f-37fd8a209b36.woff") format("woff"), url("Fonts/a3931c31-5998-4dbd-b7d5-d310e4ed3d60.ttf") format("truetype"), url("Fonts/6779412d-2ea7-4f1a-acfd-f6a527baaee7.svg#6779412d-2ea7-4f1a-acfd-f6a527baaee7") format("svg"); }
@font-face { font-family: "Futura W01 Bold"; src: url("Fonts/3b3d00eb-6d89-47ec-83ee-48276a47ad94.eot?#iefix"); src: url("Fonts/3b3d00eb-6d89-47ec-83ee-48276a47ad94.eot?#iefix") format("eot"), url("Fonts/04a4ca93-1306-487e-a524-e798404c93a7.woff2") format("woff2"), url("Fonts/2a65cbfc-5071-4b4d-bfc2-e052bb091ee2.woff") format("woff"), url("Fonts/812f781d-aa66-47a1-b6a2-7941effc1527.ttf") format("truetype"), url("Fonts/2a371030-ff67-40ac-8307-082c1fccf151.svg#2a371030-ff67-40ac-8307-082c1fccf151") format("svg"); }
@font-face { font-family: "Futura W01 ExtraBold"; src: url("Fonts/e516390d-3788-4c01-aa7c-b3e02513fed3.eot?#iefix"); src: url("Fonts/e516390d-3788-4c01-aa7c-b3e02513fed3.eot?#iefix") format("eot"), url("Fonts/cfdf2a9f-47ad-459a-a427-912b771caf18.woff2") format("woff2"), url("Fonts/71412249-2d57-471a-a4d5-981114297382.woff") format("woff"), url("Fonts/8ccb8a63-e876-4780-a50f-bcc566888d2a.ttf") format("truetype"), url("Fonts/91e409d1-261c-43dd-8ab7-32f46c395b1c.svg#91e409d1-261c-43dd-8ab7-32f46c395b1c") format("svg"); }
.socialmedia, ul.socialmedia li a { font-family: FontAwesome; }

h1, h2, h3, span.writtenby, .gigdetails, span.availability, .shopitem { font-family: "Futura W01 ExtraBold", Futura, Trebuchet MS, Arial, sans-serif; font-weight: normal; }

strong, input[type=submit], button, #header-supersonic, #announcement p { font-family: "Futura W01 Bold", Futura, Trebuchet MS, Arial, sans-serif; font-weight: normal; }

body, #nav, ul#carousel, h2 span.sectionheader, .gigdetails span.venue, span.subtitle, input[type=text], input[type=email], #announcement h3, li.monthheader h2 { font-family: "Futura W01 Medium", Futura, rebuchet MS, Arial, sans-serif; }

#top { padding: 4.5em 10px 10px; margin-bottom: 1em; }
@media only screen and (max-width: 979px) { #top { background-position: -530px bottom; padding-top: 6em; } }
@media only screen and (max-width: 740px) { #top { background-position: -610px bottom; } }
@media only screen and (max-width: 599px) { #top { background: none; min-height: 100px; margin-bottom: 0em; } }

#header-info { width: 100%; float: none; max-width: 1050px; margin: 0 auto; }

#top h1 { width: 100%; font-size: 7em; font-size: 7rem; text-transform: uppercase; line-height: .9em; margin: 0 auto; letter-spacing: -5px; text-align: left; }
@media only screen and (max-width: 1080px) { #top h1 { font-size: 6em; font-size: 6rem; } }
@media only screen and (max-width: 740px) { #top h1 { font-size: 5em; font-size: 5rem; } }
@media only screen and (max-width: 599px) { #top h1 { font-size: 3.5em; font-size: 3.5rem; letter-spacing: -2px; width: 100%; } }

#top h1 a { color: #a71c20; text-stroke: 2px #fff; -webkit-text-stroke: 2px #fff; }

#MyCarousel { width: 100%; margin-bottom: 10px; }
@media only screen and (max-width: 979px) { #MyCarousel { margin: 10px 0; } }

ul#carousel { width: 75%; display: block; text-align: center; font-size: 1.8em; font-size: 1.8rem; text-align: left; z-index: 1; }
@media only screen and (max-width: 979px) { ul#carousel { font-size: 1.4em; font-size: 1.4rem; width: 60%; } }
@media only screen and (max-width: 740px) { ul#carousel { font-size: 1.3em; font-size: 1.3rem; } }
@media only screen and (max-width: 599px) { ul#carousel { width: 50%; margin: 10px 0 0; font-size: 1.2em; font-size: 1.2rem; } }

ul#carousel li { min-height: 50px; }
@media only screen and (max-width: 979px) { ul#carousel li { min-height: 4em; } }
@media only screen and (max-width: 740px) { ul#carousel li { margin-left: 0%; } }
@media only screen and (max-width: 599px) { ul#carousel li { width: 100%; } }

ul#carousel li p, ul#carousel li span.writtenby { display: inline-block; }

ul#carousel span.writtenby { font-size: 80%; text-transform: uppercase; }

.socialmedia { overflow: hidden; max-width: 70%; margin: 25px 0; }
@media only screen and (max-width: 599px) { .socialmedia { max-width: 90%; } }

.socialmedia li { float: left; display: block; text-align: left; font-size: 2.25em; font-size: 2.25rem; padding-right: 5%; }
@media only screen and (max-width: 599px) { .socialmedia li { font-size: 1.75em; font-size: 1.75rem; } }

.screen-reader-text { position: absolute; top: -9999px; left: -9999px; }

#announcement h2 { color: white; font-size: 3.25em; font-size: 3.25rem; text-transform: uppercase; }
@media only screen and (max-width: 599px) { #announcement h2 { font-size: 2.5em; font-size: 2.5em; text-align: center; } }

#announcement h3 { color: #a71c20; font-size: 2.75em; font-size: 2.75rem; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 10px; }
@media only screen and (max-width: 599px) { #announcement h3 { font-size: 2em; font-size: 2em; text-align: center; } }

#announcement p { font-size: 1.85em; font-size: 1.85rem; max-width: 55%; color: #1771c1; text-transform: uppercase; background: white; padding: 10px; -webkit-box-shadow: 10px 10px 0px -3px rgba(0, 0, 0, 0.5); -moz-box-shadow: 10px 10px 0px -3px rgba(0, 0, 0, 0.5); box-shadow: 10px 10px 0px -3px rgba(0, 0, 0, 0.5); }
@media only screen and (max-width: 1080px) { #announcement p { max-width: 55%; } }
@media only screen and (max-width: 979px) { #announcement p { max-width: 90%; } }
@media only screen and (max-width: 599px) { #announcement p { font-size: 1.2em; font-size: 1.2em; text-align: center; margin: 0 auto; } }

#announcement p a { display: inline-block; line-height: 1.2em; margin-top: 10px; background: #a71c20; border: 2px solid #fff; padding: 10px; color: #fff; text-align: center; }

#announcement p a:hover { background: #2a83c8; }

#announcement p span.smalldate { font-size: 75%; color: black; }

span.extradate { background: #a71c20; padding: 4px; border: 1px solid white; margin-top: 10px; display: inline-block; }

.pulsate { -webkit-animation: pulsate 2s ease-out; -webkit-animation-iteration-count: infinite; opacity: 0.5; }

@-webkit-keyframes pulsate { 0% { opacity: 0.5; }
  50% { opacity: 1.0; }
  100% { opacity: 0.5; } }
.fixedhead { background-image: url(images/JohnBishop-homebackground.jpg); background-color: #b3b3bb; background-position: center top; background-repeat: no-repeat; background-size: cover; width: 100%; overflow: hidden; padding: 15px 10px; position: fixed; top: 0; left: 0; z-index: 4; }
@media only screen and (max-width: 1080px) { .fixedhead { background-image: url(images/JohnBishop-navbackground.jpg); } }
@media only screen and (max-width: 979px) { .fixedhead { padding: 5px 10px 10px; z-index: 2; background-image: none; background-color: #254a71; } }

.navcontainer { max-width: 1050px; margin: 0 auto; }

#nav, #mailersignup { overflow: hidden; width: 55%; display: inline-block; }

ul.menu { overflow: hidden; }
@media only screen and (max-width: 979px) { ul.menu { margin-bottom: 10px; } }
@media only screen and (max-width: 599px) { ul.menu { margin: 10px 0 0; } }

ul.menu li { float: left; text-transform: uppercase; padding-right: 2em; display: block; font-size: 1.25em; letter-spacing: 3px; }
@media only screen and (max-width: 1080px) { ul.menu li { padding-right: 1.6em; } }
@media only screen and (max-width: 979px) { ul.menu li { width: 20%; padding-right: 0; } }
@media only screen and (max-width: 599px) { ul.menu li { overflow: hidden; height: auto; font-size: 1em; letter-spacing: 0; line-height: .7em; } }

ul.menu li a { color: #fff; }

ul.menu li a:hover, ul.menu li a:focus { color: #fff200; }

ul.menu li.current-menu-item a { color: #a71c20; }

#mailersignup { width: 44%; }
@media only screen and (max-width: 979px) { #mailersignup { width: 70%; text-align: center; margin: 0 auto; display: block; } }
@media only screen and (max-width: 599px) { #mailersignup { width: 100%; } }

#mailersignup label { display: none; }

input { border: 0px; background: white; margin: 0; vertical-align: middle; line-height: 1.4em; width: 50%; float: left; overflow: hidden; text-align: center; }

input[type=submit], #header-supersonic a.supersoniclink { background: #a71c20; color: white; }

input[type=submit]:hover, input[type=submit]:focus, #header-supersonic a.supersoniclink:hover, #header-supersonic a.supersoniclink:focus { color: white; background: #2a83c8; }

fieldset { font-size: 1.25em; text-transform: uppercase; }
@media only screen and (max-width: 599px) { fieldset { font-size: .9em; } }

label, input, button { font-size: inherit; padding: 0.1em 0; margin: 0; /* the following ensures they're all using the same box-model for rendering */ -moz-box-sizing: content-box; /* or `border-box` */ -webkit-box-sizing: content-box; box-sizing: content-box; }

@media only screen and (max-width: 979px) { #nav { width: 100%; text-align: center; } }

#menu-menu-home li a { display: block; }

@media only screen and (max-width: 599px) { #menu-menu-home li a span { visibility: hidden; font-size: 1em; z-index: 3; display: block; } }

#menu-menu-home li a:before { visibility: hidden; width: 0; }
@media only screen and (max-width: 599px) { #menu-menu-home li a:before { visibility: visible; display: block; width: 100%; margin: 0 auto; text-align: center; line-height: 1em; font-size: 1.4em; font-size: 1.4rem; overflow: hidden; } }

@media only screen and (max-width: 599px) { #menu-menu-home li#menu-item-3556 a:before { font-family: FontAwesome; content: '\f015'; } }

@media only screen and (max-width: 599px) { #menu-menu-home li#menu-item-3557 a:before { font-family: FontAwesome; content: '\f07a'; } }

@media only screen and (max-width: 599px) { #menu-menu-home li#menu-item-3558 a:before { font-family: FontAwesome; content: '\f130'; } }

@media only screen and (max-width: 599px) { #menu-menu-home li#menu-item-3559 a:before { font-family: FontAwesome; content: '\f10d'; } }

@media only screen and (max-width: 599px) { #menu-menu-home li#menu-item-3560 a:before { font-family: FontAwesome; content: '\f003'; } }

.section-box { min-height: 768px; }

.clouds { background-image: url(images/JohnBishop-clouds.png); background-repeat: repeat-y; background-size: contain; background-color: transparent; }

.section-heading { padding: 70px 0px 30px 0px; width: auto; color: #254a71; text-transform: uppercase; }
@media only screen and (max-width: 1080px) { .section-heading { width: 98%; margin: 0 auto; } }
@media only screen and (max-width: 979px) { .section-heading { padding: 120px  0 30px; } }
@media only screen and (max-width: 599px) { .section-heading { padding: 120px 0 10px; } }

.section-box h2 { max-width: 1050px; margin: 0 auto; font-size: 3em; }
@media only screen and (max-width: 599px) { .section-box h2 { font-size: 1.6em; text-align: center; } }

h2 span.sectionheader { color: #1c2834; padding-left: 5%; letter-spacing: 4px; }

.entry { max-width: 1050px; margin: 0 auto; padding-bottom: 40px; overflow: hidden; color: #254a71; }
@media only screen and (max-width: 1080px) { .entry { width: 98%; margin: 0 auto; padding: 0 0 40px; } }

ul.archivegigs { font-size: 0; }
@media only screen and (max-width: 1080px) { ul.archivegigs { width: 98%; margin: 0 auto; } }

.archivegigs li { width: 100%; margin: 0 0 10px; padding: 6px; display: block; position: relative; overflow: hidden; font-size: 1.35em; font-size: 1.35rem; border-radius: 3px; -moz-border-radius: 3px; background-color: rgba(0, 0, 0, 0.6); color: #fff; position: relative; overflow: hidden; }

.gigdate, .gigdetails { display: inline-block; vertical-align: middle; }

.gigdate, .ticketbox { width: 9%; text-align: center; color: white; text-transform: uppercase; background-color: #a71c20; border: 2px solid white; font-size: 1.2em; font-size: 1.2rem; padding: 4px; margin-right: 3%; line-height: 1.5em; }
@media only screen and (max-width: 979px) { .gigdate, .ticketbox { width: 100%; margin-right: 0; } }

span.thedate { font-size: 200%; display: block; width: 100%; }
@media only screen and (max-width: 979px) { span.thedate { font-size: 100%; display: inline; width: auto; } }

.gigdetails { width: 40%; }
@media only screen and (max-width: 979px) { .gigdetails { width: 100%; padding-left: 0; text-align: center; padding: 10px 0; } }

span.town { text-transform: uppercase; display: block; width: 100%; font-size: 1.75em; font-size: 1.75rem; }

@media only screen and (max-width: 979px) { span.venue { width: 100%; display: block; } }

.gigbookings { position: absolute; top: 0; right: 0; bottom: 0; background-color: #a71c20; width: 15%; border-left: 2px solid #b3b3bb; text-align: center; padding: 5px; }
@media only screen and (max-width: 979px) { .gigbookings { width: 100%; margin-left: 0; position: relative; border-left: none; border-radius: 3px; -moz-border-radius: 3px; } }

.gigbookings a, .ticketbox a { width: 100%; vertical-align: middle; color: #fff200; display: block; }

.ticketbox:hover, .ticketbox:focus { background-color: #2a83c8; }

.gigbookings a:hover, .ticketbox a:hover { color: white; }

.ticketbox { width: 20%; display: inline-block; margin-right: 0; margin-left: 2%; }
@media only screen and (max-width: 979px) { .ticketbox { width: 100%; display: block; margin-left: 0; margin-top: 10px; } }

li.monthheader { background: transparent !important; }

li.monthheader h2 { color: #1c2834; text-transform: uppercase; margin: 0; padding: 0; font-size: 2em; font-size: 2rem; }

span.availability { font-size: 85%; padding-left: 10px; }

.archivegigs li.nogigmessage { font-size: 1.2em; font-size: 1.2rem; line-height: 1.8em; margin: 10px 0; background-color: transparent !important; color: #1c2834; }
@media only screen and (max-width: 979px) { .archivegigs li.nogigmessage { text-align: center; } }

.shopitem { border: 1px; float: left; margin-right: 5%; text-align: center; text-transform: uppercase; }
@media only screen and (max-width: 599px) { .shopitem { float: none; margin: 0 auto 30px; } }

@media only screen and (max-width: 599px) { .AUDIO a { max-height: 240px; overflow: hidden; display: block; } }

.shopitem p { margin: 15px 0; color: #254a71; }
@media only screen and (max-width: 599px) { .shopitem p { max-width: 280px; margin: 5px auto 0; } }

.shopitem p a { width: 100%; color: white; background: #a71c20; display: block; padding: 10px; }
@media only screen and (max-width: 599px) { .shopitem p a { max-width: 280px; } }

.shopitem p a:hover { width: 100%; color: white; background: #254a71; display: block; padding: 10px; }

h3 { font-size: 1.5em; color: #254a71; }
@media only screen and (max-width: 599px) { h3 { font-size: 1.2em; text-align: center; } }

.entry h3 { padding: 0 0 30px; }
@media only screen and (max-width: 599px) { .entry h3 { padding: 10px 0; } }

.contactbox1 { width: 60%; float: left; }
@media only screen and (max-width: 599px) { .contactbox1 { width: 94%; margin: 0 3%; } }

.charity-box { width: 40%; float: left; }
@media only screen and (max-width: 599px) { .charity-box { text-align: center; width: 94%; margin: 0 3%; } }

@media only screen and (max-width: 599px) { .charity-box li { width: 25%; display: inline-block; text-align: center; } }

.charity-content, .charity-box ul.socialmedia { padding: 0 0; margin: 0 0; max-width: 100% !important; }

.charity-box h4 { font-size: 1.4em; font-size: 1.4rem; margin-bottom: 20px; }

.charity-box ul.socialmedia { font-size: .7em; width: 100%; margin-left: 0; }

.agent-prbox { width: 100%; overflow: hidden; margin-bottom: 40px; }

.imgbox { width: 15%; display: block; margin-right: 5%; float: left; overflow: hidden; }

.addressbox { width: 80%; display: block; float: left; overflow: hidden; }

.charity-box p, .addressbox p { margin: 10px 0; line-height: 1.8em; }

.section-box .entry { padding-top: 20px; }
@media only screen and (max-width: 599px) { .section-box .entry { padding: 10px 0; } }

.column { width: 50%; float: left; overflow: hidden; }
@media only screen and (max-width: 979px) { .column { width: 100%; float: none; text-align: center; } }

@media only screen and (max-width: 979px) { .column img { max-width: 90%; margin: 10px auto; } }

blockquote { margin-bottom: 30px; font-size: 1.2em; padding-left: 0.4em; text-indent: -0.4em; color: #1c2834; }
@media only screen and (max-width: 599px) { blockquote { font-size: 1.1em; padding-left: 0; text-indent: 0; text-align: center; } }

.clearfix { width: 100%; clear: both; display: block; overflow: hidden; }

body.page #top { margin-bottom: 1em; }

body.page h2, body.error404 h2 { font-size: 2em; text-transform: uppercase; margin: 1em 0 .5em; }

#footer { width: 100%; background: #254a71; width: 100%; padding: 20px 10px; color: white; text-transform: uppercase; font-size: 0.9em; letter-spacing: 1px; overflow: hidden; }
@media only screen and (max-width: 599px) { #footer { text-align: center; font-size: .7em; } }

#footer .entry { padding: 10px; color: white; }

#footer span.footerlinks { float: right; width: 50%; }
@media only screen and (max-width: 599px) { #footer span.footerlinks { float: none; width: 100%; margin-top: 10px; display: block; } }

#footer a { padding-left: 12%; display: inline-block; text-align: right; color: #fff200; }
@media only screen and (max-width: 599px) { #footer a { float: none; width: 100%; text-align: center; padding-left: 0; line-height: 2em; } }

body.page-id-3705 #top h2 { font-size: 1.5em; font-size: 1.5rem; text-align: center; padding: 0 50px 20px; font-weight: normal; }
@media only screen and (max-width: 599px) { body.page-id-3705 #top h2 { font-size: .8em; font-size: .8rem; text-align: center; padding: 0 4px 10px; } }