@font-face {
font-family: 'Della Respira';
src: url('/f/dellarespira-regular.woff2') format('woff2'),
     url('/f/dellarespira-regular.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
unicode-range: U+000-5FF;
}

:root {
--gold:#fc0;
--red:#c03;
--green:#390;
--midgreen:#2C8500;
--darkgreen:#060;
--white:#fff;
}

/* reset  */

html {
font-family: sans-serif; 
-ms-text-size-adjust: 100%; 
-webkit-text-size-adjust: 100%; 
}

body {
margin: 0;
}

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

audio,canvas,progress,video {
display: inline-block; 
vertical-align: baseline; 
}

audio:not([controls]) {
display: none;
height: 0;
}

[hidden],template {
display: none;
}

a {
background-color: transparent;
}

b,strong {
font-weight: bold;
}

h1 {
font-size: 1.95em;
margin: 0.67em 0;
}

small {
font-size: 80%;
}

sub,sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}

sup {
top: -0.5em;
}

sub {
bottom: -0.25em;
}

img {
border: 0;
}

svg:not(:root) {
overflow: hidden;
}

figure {
margin: 1em 40px;
}

hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
margin: 2rem 0;
border: 0;
height: 1px;
background-image: -webkit-linear-gradient(left, rgba(51,153,0,0), rgba(51,153,0,0.75), rgba(51,153,0,0)); 
background-image:    -moz-linear-gradient(left, rgba(51,153,0,0), rgba(51,153,0,0.75), rgba(51,153,0,0)); 
background-image:     -ms-linear-gradient(left, rgba(51,153,0,0), rgba(51,153,0,0.75), rgba(51,153,0,0)); 
background-image:      -o-linear-gradient(left, rgba(51,153,0,0), rgba(51,153,0,0.75), rgba(51,153,0,0)); 
}

table {
border-collapse: collapse;
border-spacing: 0;
}

th,td {
padding: 10px 40px 10px 0;
text-align: left;
border-bottom: 0; 
}
th:first-child,td:first-child {
padding-left: 0; 
}
th:last-child,td:last-child {
padding-right: 0; 
}

ul {
list-style: circle inside; }
ol {
list-style: decimal inside; }
ol, ul {
padding-left: 0;
margin-top: 0; 
}
ul ul,ul ol,ol ol,ol ul {
margin: 1.5rem 0 1.5rem 3rem;
font-size: 90%; 
}
li {
margin-bottom: 1rem; 
}

/* Spacing */
pre,blockquote,dl,figure,table,p,ul,ol,form {
margin-bottom: 2.5rem; }

/* Self Clearing Goodness */
.container:after, .row:after {
content: "";
display: table;
clear: both; 
}


/* Grid / flex */

#pagearea, body#homepage main {
display: flex;
flex-flow: row wrap;
}

body#homepage #pagearea {
display: block;
}

.container {
position: relative;
width: 100%;
max-width: 1170px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box; }

#content {
order: 1;
flex: 1 100%;
padding-left: 0;
}

body#homepage article {
order: 2;
}

body#indexpage.map #mapholder {
flex: 1 100%;
margin-bottom: 45px;
order: 2;
}

body#indexpage.map #content {
flex: 1 100%;
order: 1;
}

#sidemenu{
overflow: auto;
-webkit-overflow-scrolling: touch;
flex: 1 100%;
padding: 15px 0 60px 0;
order: 2;
}

.homec19 {
order: 3;
}


/* For devices larger than 855px */
@media (min-width: 855px) {

#content {
flex: 3;
}

#content {
padding: 0 0 1rem 2.5rem;
}

body#indexpage #content {
flex: 4;
}

body#indexpage.map #mapholder {
flex: 2;
order: -1;
}

body#indexpage.map #content {
flex: 3;
}

#sidemenu{
flex: 1;
order: -1;
}

}


/* For devices larger than 550px */
@media (min-width: 550px) {

.halfcol {
float: left;
width: 47%;
margin-right: 2%;
}

}


/* Generic stuff  */

body { 
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1em;
line-height: 1.5;
text-align: left;
color: #000;
background-color: var(--gold);

background-image: url(../i/top-lights.png), url(../i/pageback.svg);
background-repeat: no-repeat, repeat-x;
background-position: 50% -10px, 0 0;
background-size: auto, 300px auto;
}

/*
[aria-hidden='true'],
[data-a11y-toggle]:not([aria-controls]) {
display: none;
}
*/

a:focus { outline: 2px solid #0A74A9; border-radius: 2px; }

a { 
text-decoration: none;
color: var(--darkgreen);
}
	
a:visited, a:hover { 
color: var(--red);
}

main p a, main li a, main dd a, .hometext a {
text-decoration: underline;
}

a:hover, a:focus { 
color: var(--red);
text-decoration: underline;
}

a:active { 
color: #000;
text-decoration: underline;
}

.hide a {
left: 50%;
position: absolute;
transform: translateY(-100%);
background: #fff!important;
color: #0A74A9!important;
border: 2px solid #0A74A9;
height: auto;
padding: 8px;
}

.hide a:focus {
transform: translateY(0%);
z-index: 1000000;
}

.hide-element {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px; 
} 

.hide-element-focusable:active, .hide-element-focusable:focus {
 clip: auto;
 height: auto;
 margin: 0;
 overflow: visible;
 position: static;
 width: auto;
} 	

.clearboth { clear: both; }

img {
max-width: 100%;
height: auto;
}

.img-mid {
vertical-align: middle;
}
 
#bible, .bible, blockquote {
font-style: italic;
}

#bible h2 {
font-style: normal;
}

#sister {
text-align: center;
background: #98C81C;
width: 80%;
padding: 20px;
margin: 15px auto;
box-shadow: 0px 2px 2px #888;
}
	
	
/* header bars */	

#siteheader {
min-height: 215px;
}

/* contact & search */

#utilbar {
clear: both;
text-align: right;
}

#utilbar ul {
list-style: none;
margin: 0;
}

#utilbar ul li {
list-style: none;
background: 0;
padding: 0;
margin: 0 0 0 10px;
display: inline;
}

#utilbar ul li a {
border: 1px solid var(--midgreen);
color: #fff;
display: inline-block;
font-size: .9em;
margin: 0;
padding: 4px 12px 4px 10px;
background: var(--midgreen); 
}

#utilbar ul li a:active, #utilbar ul li a:hover {
text-decoration: none;
background: var(--darkgreen);
}

#utilbar li.email a span {
padding: 0 0 0 22px;
background: url(../i/icon-email.svg) no-repeat 0 2px;
background-size: 16px 12px;
}

#utilbar li.search a span {
padding: 0 0 0 22px;
background: url(../i/icon-search.svg) no-repeat 0 0;
background-size: 16px 16px;
}


/* Main Content */

#pagearea {
clear: both;
margin-top: 1.3rem;
}

h1, h2, h3, h4 {
font-family: 'Della Respira', Baskerville, Georgia, serif;
font-style: normal;
font-weight: normal;
}

h1 { 
margin: .7rem 0 1.5rem 0;
font-size: 2em; 
text-align: center;
}

h1:before, h1:after {
display: inline-block;
content: '';
background-size: 32px auto;
background-position: center center;
height: 30px;
width: 32px;
background: url(../i/holly.svg) no-repeat; 
}

h1:before {margin-right: .3rem;}
h1:after {margin-left: .3rem;}

img.flag {
margin: -1.5rem auto .5rem auto;	
display: block;
}

h2 {
font-size: 1.7em;
margin: 1.2rem 0 .7rem 0;
clear: both;
}

h3 {
margin: .7rem 0;
font-size: 1.5em;
clear: both;
}

h4 {
margin: .7rem 0 .3rem 0;
font-size: 1.2em;
clear: both;
}

p { 
margin: 0 0 1.3rem 0;
}

p.b2t {
text-align: right;
margin-bottom: 1.3rem;
}

p.buttons {
clear: both;
margin-bottom: 2rem;
}

main p, main li {
font-size: 1.1em;
}

.scroll-to-top {
position: fixed;
background:url(../i/scroll-to-top.png) no-repeat;
cursor: pointer;
bottom: 3rem;
right: 0;
width:55px;
height: 55px;
padding-right: 1em;
display: none;
z-index: 999;
}

#back-to-top {
background: rgba(51,153,0,.7);
transition: all 200ms linear;
}

#back-to-top:hover, #back-to-top:focus {
background: rgba(51,153,0,1);
}

.imgr {
float: right;
margin: 0 0 1.3rem 1.3rem;
font-size: .9em;
}

.imgl {
float: left;
font-size: .9em;
margin: 0 1.3rem 1.3rem 0;
}

.imgrc {
float: right;
margin: 0 0 1.3rem 1.3rem;
clear: both;
}

.quote {
margin: .5rem 0;
display: block;
text-align: center;
}

figure {
margin: 0 0 1.3rem 0;
}

figcaption {
font-size: .9em;
clear: both;
margin: .7rem 0;
text-align: center;
line-height: 1.5em;
}

.getty {
margin-bottom: 1.3rem;
}

figure.imgc, figure.imgc img, .imgc img, .getty.imgc, img.imgc, .imgc .image, .flickrimg.imgc iframe.flickr-embed-frame {
margin: 0 auto 1.3rem auto!important;
display: block!important;
}

.small {
font-size: .8em;
}	

.error {
color: #f00;
}

.sectionhead {
width: 80%;
filter: drop-shadow(0 0.15rem 0.1rem rgba(0, 0, 0, 0.4));
}

.sectionhead.cultures {
width: 40%;
margin: 0 auto;
display: block;
}

ul.pagesubnav, ul {
margin: .7rem 0 3rem 0;
padding: 0;
list-style: none;
} 

ul.pagesubnav li, ul li {
margin-bottom: .7rem;
background: url(../i/bauble-stripe.svg) no-repeat 0 3px;
padding-left: 22px;
} 

ul.pagesubnav li {
background: url(../i/bauble-stripe.svg) no-repeat 0 3px;
} 

ul.nobullet {
margin: 1.3rem 0 3rem 0;
padding: 0;
} 

ul.nobullet li {
margin: 0 0 .5rem 0;
background: none;
padding: 0;
} 

ul.ulcolumns {
margin-top: 1rem;
clear: both;
list-style: none;

-webkit-column-width: 18em;
-moz-column-width: 18em;
column-width: 18em;
}

ul.ulcolumns.columnsfun {
-webkit-column-width: 20em;
-moz-column-width: 20em;
column-width: 20em;
}

ul.ulcolumns.maplist {
-webkit-column-width: 12em;
-moz-column-width: 12em;
column-width: 12em;
}

ul.ulcolumns li, ul.storylists li {
background: none;
padding-left: 0;
font-size: 1em;
}

ul.ulcolumns li li {
margin-bottom: .5rem!important;
}

ul.ulcolumns a, ul.storylists a {
display: block;

background: url(../i/bauble-stripe.svg) no-repeat 0 2px;
padding-left: 22px;

transition: 0.2s ease-in-out;
}

ul.ulcolumns.maplist a, ul.ulcolumns li li a {
background: none;
padding-left: 0;
}

ul.ulcolumns.maplist a img {
margin-right: 8px;
}

ul.ulcolumns a:hover, ul.storylists a:hover, ul.ulcolumns a:focus, ul.storylists a:focus {
margin-left: .7rem;
}

ul.ulcolumns li img, ul.nobullet.flags li img {
vertical-align: text-bottom;
}

ul ul {
margin: .5rem 1.3rem 1.3rem 1.3rem;
padding: 0;
font-size: inherit;
} 

ul ul ul {
margin: .5rem 1.3rem 0 1.3rem;
padding: 0;
font-size: inherit;
} 
 
ul.cols li {
margin: 0 0 1.3rem 0;
background: none;
}

ol {
margin: 1.3rem 0 1.3rem 2rem;
padding: 0;
} 

ol li {
margin: 0 0 .7rem 0;
} 
 
.spacel {
margin-left: .7rem;
}

dl {
margin: 1rem 0; 
padding: 0 0 2rem 0; 
text-align: left;
border-bottom: 1px dotted #ffc;
}

dl dt {
font-family: 'Della Respira', Baskerville, Georgia, serif;
font-style: normal;
font-weight: normal;
font-size: 1.4em;
margin-top: 2em;
margin-bottom: .5rem; 
text-align: left;
}

dl dd {
text-align: left;
padding-top: .5rem; 
padding-left: 1.5em;
margin: 0;
}

dl.theme dd.image img {
border: 2px solid var(--green);
}

p.redstar {
padding: 10px 0 10px 55px;
background: url(../i/star-red.svg) no-repeat 0 50%;
background-size: 48px 48px;
}

.highlight {
margin-bottom: .7rem;
}

.highlight img {
vertical-align: middle;
margin-right: .7rem;
}

.mep-container {
margin: 2rem .7rem;
}

ul.visitorcountries {
margin: 0 .7rem;
}

ul.sideways li {
float: left;
margin: 0 1rem 1rem 0;
font-size: .7em;
min-height: 225px;
}

ul.starslist li {
float: left;
margin: 0 5px 1px 0;
}

#video {
width: 100%;
height: auto;
padding: 0 0 4rem 0;
}

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 1.8rem;
height: 0;
}

.videoWrapper43 {
position: relative;
padding-bottom: 75%; /* 16:9 */
padding-top: 1.8rem;
height: 0;
}

.videoWrapper iframe, .videoWrapper43 iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

iframe {
border: 0;
}

iframe#gameembed {
width: 100%;
height: 600px;
}

.centerme {
text-align: center;
}


/* links display  */

dl.link dd.image img {
width: auto; 
}

dl.link dd.url  {
text-align: left;
margin-top: .5rem;
}
 
 
/* link to us buttons etc */

dl.linktous {
padding: 10px; 
background: #fff;
border:1px solid #960;
}

dl.linktous dd.image img {
width: auto; 
padding: 10px 0; 
}

dl.linktous dd.code  {
text-align: left;
margin-top: 5px;
padding: 10px;
border: 1px solid #bbb;
font-family: "Courier New", Courier, monospace;
}
 

/* simple tables */

.simple {
width: auto;
border: 0;
margin: 0 0 1.3rem 0;
}

.simple p {
font-size: inherit;
margin-left: 0;
}

.simple tr.head {
font-weight: bold;
color: #000; 
}

.simple tr td {
padding: 10px 40px 5px 0;
vertical-align: top;
}

.simple tr td.flag {
min-width: 64px;
padding-top: 0;
}

.simple ul {
margin: 0 2rem 1rem 0;
padding: 0;
list-style-type: none;
}

.simple ul li {
margin: 0;
padding: 0 0 5px 0;
background: none;
}

.simple td.chrismon {
text-align: center;
}


/* JS/SVG map */

#mapdiv {
width: 100%;
background: #00c;
height: 400px;
padding: 1.3rem 0;
margin: 0 auto 2rem auto;
}

body#indexpage #mapdiv {
margin-top: 20px;
height: 320px;
}


/* index banners & side images */

#indexsidelist li {
background: none;
padding: 0;
text-align: center;
}

#indexsidelist img {
transition: all 400ms ease-in-out;
transform: scale(0.9);
}

#indexsidelist img:hover, #indexsidelist img:focus {
transform: scale(.95);
}


/* home page */

body#homepage #pagearea {
margin-bottom: 1rem;
}	

body#homepage #content {
padding: 0;
}

body#homepage h1 {
flex: 1 100%;
}

body#homepage article {
padding: .5rem;
}

body#homepage h2 {
margin: 0 0 .5rem 0;
text-align: center;
display: block;
font-size: 1.6em;
}

body#homepage h2 a:before { 
display: block;
content: '';
background-size: 100px auto;
background-position: center bottom;
height: 100px;
margin-bottom: .7em;
filter: drop-shadow(0 0.15rem 0.1rem rgba(0, 0, 0, 0.4));
}

.home-customs a:before { 
background: url(../i/top-customs.svg) no-repeat; 
}

.home-cultures a:before { 
background: url(../i/top-cultures.svg) no-repeat; 
}

.home-story a:before { 
background: url(../i/top-story.svg) no-repeat; 
}

.home-fun a:before { 
background: url(../i/top-fun.svg) no-repeat; 
}

body#homepage article ul {
margin: 0 0 1.5rem 0;
}

body#homepage article p {
margin: .5rem 0;
}

body#homepage article p a {
text-decoration: none;
border: 1px solid var(--midgreen);
color: #fff;
display: block;
margin: 0;
padding: 4px;
background: var(--midgreen);
font-size: 103%;
text-align: center;
}

body#homepage article p a:active, body#homepage article p a:hover {
text-decoration: none;
background: var(--darkgreen);
}

.hometext {
margin-top: 3em;
}

.homec19 {
text-align:center;
}

#greenpanel {
background: var(--green);
margin: 1.7rem 0;
padding-top: 2rem;
box-shadow:0 0 20px rgba(0,0,0,0.8) inset;
}

.green-boxes {
display: flex;
flex-flow: row wrap;
justify-content: space-around;
padding-bottom: 15px!important;
}

li.homebox {
width: 18%;
margin: 0 auto;
background: none;
padding-left: 0;
text-align: center;
}

.green-boxes img {
width: 100%;
height: auto;
margin-bottom: 1.3rem;
}

.green-boxes a:hover, .green-boxes a:focus {
margin-left: 0;
}

.green-boxes img:hover, .green-boxes img:focus {
box-shadow:  0px 0px 20px 0px rgba(255, 255, 255, 1);
}


/* full width tables */

table.full {
width: 100%;
padding: 0;
margin: 0 .7rem;
}

table.full td {
padding: 0 2rem 1rem 0;
vertical-align: top;
}

table.full ul {
margin: 0 0 1rem 0;
padding: 0;
list-style-type: none;
} 


/* contact side */

aside .contact_side {
text-align:center; 
padding: 2rem 0; 
font-weight: bold;
}

.contact_side img {
text-align:center; 
margin: 0 auto; 
}

.contact_side a {
color: #ffc;
}


/* sidebar */

aside nav {
background: var(--midgreen) url(../i/sideholly.svg) no-repeat 50% 17px;
background-size: 80% auto;
color: #fff;
position: relative;
margin-left: 0!important;
}

aside nav:before, aside nav:after {
content:"";
position:absolute; 
z-index:-1;
box-shadow:0 0 20px rgba(0,0,0,0.4);
top:50%;
bottom:0;
left:50px;
right:50px;
border-radius:100px / 50px;
}

aside h2 {
margin: 0;
padding: 1rem .5rem 0 1rem;
font-size: 1.3em;
}

aside h2 a, aside h2 a:hover, aside h2 a:visited {
color: #fff; 
}

aside ul {
list-style: none;
margin: 0;
padding: 1.5rem 1rem .5rem 1rem;
display:block;
}

aside li {
margin: 0;
padding: 0 0 .7rem 0;
text-align: left;
font-size: 0.95em;
position:relative;
display:block;
background: none;
line-height: 1.3;
}

aside li.menuspace {
margin-top: .7rem;
}

aside a {
text-decoration: none; 
color: #fff;

transition: 0.2s ease-in-out;
}
 
aside a:hover, aside a:focus {
text-decoration: none; 
margin-left: -5px;
color: #ffc;
}

aside a:visited {
color: #ffc;
}

aside li a {
display:block;
}

aside ul ul {
margin: 0;
padding: .7rem 0 0 1rem;
}

aside ul ul li {
font-size: inherit;
list-style: none;
}

aside ul.info {
border-top: 1px solid #ffc;
}

aside ul.info img {
margin-top: 3px;
}

aside ul.sidecountries a img {
margin-right: 5px;
}

aside p {
margin: 1.5rem 1rem;
}

aside nav li img {
vertical-align: text-bottom;
}


/* footer */

#sitefooter {
display: block;
min-height: 260px;
margin-top: 2.5rem;
background: #9b0002; /* Old browsers */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9b0002', endColorstr='#cc0033',GradientType=0 ); /* IE6-9 */
background: linear-gradient(to top, #9b0002 0%,#cc0033 100%); /* W3C */

box-shadow:  0 0 10px 0 rgba(0, 0, 0, 0.7);
}

#footerin {
min-height: 260px;
background: url(../i/footerflake.svg) no-repeat 100% 50%;
background-size: 280px auto;
}

#sitefooter p {
clear: both;
margin: 0 0 4rem 0;
padding-top: 1.7rem;
font-size: .8em;
color: #fff;
}

#sitefooter a {
color: #fff;
text-decoration: underline;
}

#sitefooter ul.social {
float: left;
display: inline;
margin: 100px 0 0 0;
}

#sitefooter ul.social li {
position: relative;
float: left;
display: inline;
margin: 0 1rem 0 0 !important;
width: 4em !important;
height: 4em !important;
background: none;
padding: 0;
}

#sitefooter ul.social li a {
width: 4em;
height: 4em;
display: block;
text-indent: -9999em;
padding: 0 !important;
margin: 0 !important;
outline: none !important;
border-bottom: 0;
background-position: 50% 50%;
background-repeat: no-repeat;
opacity: 0.6;
}

#sitefooter ul.social li a:hover, #sitefooter ul.social li a:focus {
opacity: 0.8;
}

ul.social li.facebook a { background: url(../i/icon-facebook.svg); background-size: auto 100%; }
ul.social li.twitter a { background: url(../i/icon-x.svg); background-size: 100%; }
ul.social li.mastodon a { background: url(../i/icon-mastodon.svg); background-size: 100%; }
ul.social li.youtube a { background: url(../i/icon-youtube.svg); background-size: 100%; }
ul.social li.emaillink a { background: url(../i/icon-email.svg); background-size: 100%; }

#printfooter {
display: none;
}

#back-to-top {
bottom: 50px!important;
}

/* basic form CSS */

button, input, select, textarea {
font-family: inherit;
}

label {
margin:0 0 3px 0;
padding:0;
display:block;
font-weight: bold!important;
color: #000!important;
}
input[type=text], 
input[type=date],
input[type=datetime],
input[type=number],
input[type=search],
input[type=time],
input[type=url],
input[type=email],
textarea, select{
box-sizing: border-box;
background: #fff;
color: #111;
padding: 10px 15px;
margin:0;
border: 1px solid var(--red);
outline: none;	
font-size: inherit;
}
input[type=text]:focus, 
input[type=date]:focus,
input[type=datetime]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=email]:focus,
textarea:focus, 
select:focus{
border: 1px solid var(--midgreen);
}
input[type="checkbox"],input[type='radio'] {
width: 1.5em;
height: 1.5em;
margin-right: 0.5em;
vertical-align: text-top;
}
select{
width: 100%;
}
textarea{
min-height: 150px!important;
}
button, input[type=submit], input[type=button]{
background: var(--midgreen);
color: #fff;
padding: 12px 18px;
border: none;
font-size: inherit;
}
button:hover, input[type=submit]:hover, input[type=button]:hover{
background: var(--darkgreen);
}
.cog-form {
margin-bottom: 2em!important;
}
.cog-confirmation__message {
font-style: italic;
}
.cog-form [aria-hidden="true"], .cog-form [data-a11y-toggle]:not([aria-controls]) {
display: inline!important;
}

/* ddgsearch */

form.ddgsearch {
margin-bottom: 0;
display: inline;
}

.ddgsearchfields {
display: flex;
}

form.ddgsearch input[type=search] {
padding: 7px 12px 8px 12px;
border: 0;
font-size: .9em;
width: 180px;
}

form.ddgsearch input[type=search]:focus {
border: 0px solid var(--midgreen);
}

form.ddgsearch button {
 background: #fff url(../i/icon-search-black.svg) no-repeat;
 color: #111;
 margin-left: -35px;
 padding: 21px 14px 11px 16px;
 cursor: pointer;
 background-position: 50% 50%;
}

/* sharing */

#sharing {
width:100%;
/*height: 50px;*/
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 10000;
}

ul.share-buttons {
text-align: left;
list-style: none;
padding: 0;
margin: 0;
background: rgba(0,0,0,.7);
width: 100%;
}

ul.share-buttons img {
height: 24px;
}

ul.share-buttons li {
display: inline;
text-align: center;
margin: 0;
background: none;
padding-left: 0;
}

ul.share-buttons li a {
display: inline-block;
width: 12%;
padding: 5px 0 2px 0;
background: #000;
border-radius: 0px;
}

ul.share-buttons li.share {
padding: 0 5px;
}

ul.share-buttons li.share-fb a {
background: #3B5998;
}

ul.share-buttons li.share-tw a {
background: #000;
}

ul.share-buttons li.share-pn a {
background: #DB081c;
}

ul.share-buttons li.share-em a {
background: #444;
}

ul.share-buttons li.share-wa a {
background: #25d366;
}

ul.share-buttons li.share-pr a {
background: #3B5998;
}

ul.share-buttons li a:hover {
filter: brightness(70%);
}

ul.share-buttons .sr-only{
position: absolute;
clip: rect(1px 1px 1px 1px);
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
}

@media (min-width: 601px) {

ul.share-buttons li.share-wa {
display: none;
}

}


/* top logo */

#logo {
float: left;
width: 220px;
text-align: center;
background: var(--red);

box-shadow:  0 0 10px 0 rgba(0, 0, 0, 0.7); 
}

#logo img {
padding: 10px 15px;
margin-bottom: 5px;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc0033', endColorstr='#9b0002',GradientType=0 ); /* IE6-9 */
background: linear-gradient(to top, #cc0033 0%,#9b0002 100%); /* W3C */
border: 5px solid var(--green);
border-top: 0;

transition: 0.2s ease-in-out;
}
  
#logo img:hover, #logo img:focus {
padding-top: 15px;
}

[role="button"] {
cursor: pointer;
}


/* media queries */


/* Mobile to Tablet */
@media only screen and (max-width: 854px) {


.homeheading h1 {
font-size: 1.1em;
}

aside h2 {
font-size: 1.2em;
}

aside h2 a, aside h2 a:hover, aside h2 a:visited {
color: #000; 
}

aside li {
font-size: 1em;
}

aside p {
margin: 1.5rem 0;
}

.sectionhead {
width: 50%;
}

li.homebox {
width: 27%;
}

li.homebox.noshow {
display:none;
}


/* main stuff */

#logo {
margin: 0 0 0 20px;
}

#topnav {
float: left;
margin: 40px 0 0 25px;
}

#topnav ul {
margin: 0;
}

#topnav li {
background: none;
padding-left: 0;
}

#topnav a {
display: inline-block;
font-family: 'Della Respira', Baskerville, Georgia, serif;
font-size: 1.1em;
color: #000;
text-decoration: none;

transition: all 0.2s linear;
}

#topnav a:hover, #topnav a:focus { 
text-decoration: none;
padding-left: 1em;
}

#topnav a:before { 
display: inline-block;
content: '';
background-size: 24px auto;
background-position: center left;
height: 24px;
width: 24px;
margin-right: 8px;
vertical-align: top;
filter: drop-shadow(0 0.15rem 0.1rem rgba(0, 0, 0, 0.4));
}

.menu-customs a:before { 
background: url(../i/top-customs.svg) no-repeat; 
}

.menu-cultures a:before { 
background: url(../i/top-cultures.svg) no-repeat; 
}

.menu-story a:before { 
background: url(../i/top-story.svg) no-repeat; 
}

.menu-fun a:before { 
background: url(../i/top-fun.svg) no-repeat; 
}

#utilbar {
margin: 0;
}

.green-boxes { 
text-align: center;
}

h1 {
font-size: 1.5em;
}

h2 {
font-size: 1.2em;
}

h3 {
font-size: 1.1em;
}

body#homepage h2 {
font-size: 1.3em;
}

.imgr, .imgl, .imgrc {
float: none;
margin: 0 auto .7rem auto;
display: block;
font-size: .7em;
}

.indexheader h2 {
flex: 6;
}

.indexheader span {
flex: 1;
margin: 1.5rem 0 .5rem 0;
}

/* footer */

#sitefooter {
min-height: 160px;
margin-top: 1px;
display: block;
}

#footerin {
min-height: 160px;
padding: 5px 75px 35px 20px;
background-position: 100% 10px;
background-size: 230px auto;
}

#sitefooter p {
padding-top: 1rem;
}

#sitefooter a {
color: #fff;
}

#sitefooter ul.social {
margin: 1rem 0 0 0;
}

#sitefooter ul.social li {
margin: 0 .7rem 0 0 !important;
width: 1.5em !important;
height: 1.5em !important;
}

#sitefooter ul.social li a {
width: 1.5em;
height: 1.5em;
}

}


@media only screen and (max-width: 750px) {	

#topnav a {
font-size: 1em;
}

}


@media only screen and (min-width: 652px) {	

body#homepage article {
flex: 1 40%;
margin: 0 1rem 2rem 1rem;
}

}


/* Smartphones */
@media only screen and (max-width: 651px) {

body {
background-image: url(../i/greentop.svg), url(../i/top-lights-mob.png), url(../i/pageback.svg);
background-repeat: repeat-x, no-repeat, repeat-x;
background-position: 0 0, 50% 30px, 0 0;
background-size: auto 31px, auto, 300px auto;
}

.container.nomargin {
margin-top: 0!important;
}

#siteheader {
min-height: 80px;
}

#logo {
width: 60px;
margin: 0!important;
}

#logo img {
width: 30px;
margin-bottom: 0;
padding: 7px;
border: 3px solid var(--green);
border-top: 0;
}

#utilbar {
margin: 0!important;
position: absolute;
top: 0;
right: 0;
max-width: 77%;
padding: 0 10px 0 0;
}

#utilbar ul li {
margin: 0;
}

#utilbar ul li a {
padding: 4px 6px 3px 6px;
}

#topnav {
float: none!important;
margin: 0!important;
clear: both;
padding: 1rem 0 0 .5rem;
}

#topnav a {
font-size: 1em;
}

#topnav a:before { 
background-size: 20px auto;
height: 20px;
width: 20px;
}

body#homepage article {
flex: 1 100%;
margin-bottom: 2rem;
}

li.homebox {
width: 35%;
}

li.homebox.noshow {
display: block;
}

#pagearea {
margin-top: .8rem;
}

h1:before, h1:after {
background-size: 20px auto;
height: 18px;
width: 20px;
}

form.ddgsearch input[type="search"] {
padding: 7px 12px 7px 12px;
width: 130px;
border-radius: 0;
}
    
form.ddgsearch button {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px; 
}

}


/* Smartphones */
@media only screen and (max-width: 420px) {

li.homebox {
width: 60%;
}

}


/* Landscape Tablets and Desktop */
@media only screen and (min-width: 855px) {

/*  top logo & nav bar */

#topnav	{
float: left;
margin-left: 0;
}

#topnav ul {
list-style:none;
margin: 0;
}

#topnav li {
float: left;
background: none;
margin: 30px 6px 0 0;
padding: 0;
width: 130px;
}

#topnav a {
display: block;
font-family: 'Della Respira', Baskerville, Georgia, serif;
font-size: .95em;
color: #000;
text-decoration: none;
text-align: center;

transition: all 0.2s linear;
}

#topnav a:hover, #topnav a:focus { 
text-decoration: none;
margin-top: -.7em;
}

#topnav a:before { 
display: block;
content: '';
background-size: 100px auto;
background-position: center bottom;
height: 100px;
margin-bottom: .7em;
filter: drop-shadow(0 0.15rem 0.1rem rgba(0, 0, 0, 0.4));
}
 
.menu-customs a:before { 
background: url(../i/top-customs.svg) no-repeat; 
}

.menu-cultures a:before { 
background: url(../i/top-cultures.svg) no-repeat; 
}

.menu-story a:before { 
background: url(../i/top-story.svg) no-repeat; 
}

.menu-fun a:before { 
background: url(../i/top-fun.svg) no-repeat; 
}

body#homepage article {
flex: 1;
margin: 0 1rem;
}

#adcal {margin-right: 250px;}
}


/* Landscape Tablets */
@media only screen and (min-width: 768px) and (max-width: 979px) {

body#homepage h2 {
font-size: 1.2em;
}

body#homepage article p a {
font-size: 95%;
}

body#homepage article ul {
font-size: 85%;
}

#utilbar {
margin: 0;
}

}


/* Landscape Tablets */
@media only screen and (min-width: 980px) and (max-width: 1165px) {

#topnav	{
float: left;
margin-left: 25px;
}

#topnav li {
margin: 40px 20px 0 0;
padding: 0;
width: 140px;
}

body#homepage h2 {
font-size: 1.3em;
}

body#homepage article p a {
font-size: 95%;
}

body#homepage article ul {
font-size: 82%;
}

}

/* Desktop */
@media only screen and (min-width: 1025px) {

#topnav	{
float: left;
margin-left: 50px;
}

#topnav li {
margin: 40px 20px 0 0;
padding: 0;
width: 145px;
}

.homeheading h1 {
font-size: 2em;
}

.homeheading p {
font-size: 1.4em;
}

}

/* wide desktop */
@media only screen and (min-width: 1200px){

}