/*BODY*/
body, html
{
height: 100%;
font-size: 1.2em;
font-weight: 600;
line-height: 1.5em;
font-family: 'Raleway', sans-serif;
color: #000;
margin: 0;
padding: 0;
border: 0;
}


/*------------------------------*/



/*BOX SIZING*/
* 
{
box-sizing: border-box;
}

* 
{
margin: 0;
padding: 0;
border: 0;
}


/*------------------------------*/


/*GENERAL TEXT STYLES*/
p
{
margin: 0 0 .8em 0;
}

p.plain
{
font-weight: 600;
color: #000;
margin: 0;
}

p.plain_centered
{
text-align: center;
margin: 0;
}

p.centered
{
text-align: center;
margin: 0 0 1em 0;
}

.red
{
color: red;
}

p.emphasised
{
font-size: 1.4em;
line-height: 1.4em;
margin: 0 0 .8em 0;
text-align: center;
}

p.emphasised_left
{
font-size: 1.4em;
line-height: 1.4em;
margin: 0;
text-align: left;
}

p.emphasised_left_white
{
color: #ffffff;
font-size: 1.4em;
line-height: 1.4em;
margin: 0;
text-align: left;
}

p.bold
{
font-weight: 700;
}

p.white
{
color: #fff;
margin: 0;
}

p.white_plain
{
color: #fff;
margin: 0;
}

p.white_small
{
font-size: .7em;
color: #fff;
line-height: 1.6em;
}

p.white_sub_title
{
display: none;
color: #fff;
font-size: .9em;
font-weight: 400;
margin: 0;
padding: 0;
}

@media all and (min-width: 35em) 
{
p.white_sub_title
{
display: block;
font-size: 1.2em;
}
}

@media all and (min-width: 70em) 
{
p.white_sub_title
{
font-size: 1.4em;
padding: 0;
}
}

h1
{
font-size: 1.6em;
font-weight: 400;
line-height: 1.4em;
margin: 0 0 .6em 0;
}

h1.white_title
{
color: #fff;
font-size: 1.7em;
font-weight: 300;
margin:  0 0 0 -.07em;
padding: 0;
}

@media all and (min-width: 50em) 
{
h1.white_title
{
font-size: 2.2em;
}
}

@media all and (min-width: 70em) 
{
h1.white_title
{
font-size: 2.1em;
}
}

h2
{
color: #0389c8;
font-size: 1.5em;
font-weight: 600;
line-height: 1.4em;
margin: 0 0 .1em 0;
}

h2.main
{
color: #0389c8;
font-size: 2em;
font-weight: 600;
line-height: 1.2em;
text-align: center;
margin: 0 0 .3em 0;
}

h2.main_white
{
color: #fff;
font-size: 2em;
font-weight: 600;
line-height: 1.2em;
text-align: center;
margin: .2em 0 .3em 0;
}

h2.telephone
{
font-size: 1em;
color: #fff;
margin: 0 0 1.2em 0;
}

h3.light
{
color: #5bc5f2;
font-size: 2em;
font-weight: 300;
line-height: 1.2em;
margin: -.3em 0 .3em 0
}

h3.light_editorial
{
color: #0389c8;
font-size: 2em;
font-weight: 300;
line-height: 1.2em;
text-align: center;
margin: -.3em 0 .3em 0
}

h3.light_smaller
{
color: #5bc5f2;
font-size: 1.4em;
font-weight: 300;
line-height: 1.2em;
margin: 0;
}

h3.feature_titles
{
color: #000;
font-size: 1.1em;
font-weight: 600;
line-height: 1.2em;
padding: .8em 1.05em 0 1.05em;
}

h3.feature_titles2
{
color: #000;
font-size: 1.1em;
font-weight: 600;
line-height: 1.2em;
padding: .8em 0 0 0;
}

h3.feature_titles_gray
{
color: #c6c3c3;
font-size: 1.1em;
font-weight: 600;
line-height: 1.2em;
padding: .8em 1.05em 0 1.05em;
}

h4.greener
{
color: #c8d400;
font-size: 1.4em;
font-weight: 500;
padding: .5em 0 .3em 0;
margin: 0;
}

.green_titles
{
color: #c8d400;
font-size: 1.2em;
font-weight: 600;
line-height: 1.1em;
margin: 0 0 .2em 0;
}

.bold
{
font-weight: 700;
margin: 0;
padding: 0;
border: 0;
}

.italic
{
font-style: italic;
margin: 0;
padding: 0;
border: 0;
}





/*------------------------------*/



/*LINK STYLES*/

a:link.general, a:visited.general
{
color: #0d7a2f;
font-weight: 600;
text-decoration: underline 2px solid #babdc0;
}

a:hover.general, a:active.general
{
color: #9ea0a2;
font-weight: 600;
text-decoration: none;
}

a:link.general_white, a:visited.general_white
{
color: #03c5da;
font-weight: 400;
text-decoration: none;
}

a:hover.general_white, a:active.general_white
{
color: #fff;
font-weight: 400;
text-decoration: none;
}

a:link.general_green, a:visited.general_green
{
color: #c8d400;
font-weight: 400;
text-decoration: underline 1px solid #c8d400;
}

a:hover.general_green, a:active.general_green
{
color: #fff;
font-weight: 400;
text-decoration: underline 1px solid #c8d400;
}

.appleLinksWhite a 
{
color:#fff;
text-decoration: none;
font-weight: 400;
font-size: 1.2em;
}

a:link.skip, a:visited.skip
{
text-decoration: none;
font-style: italic;
color: #83d0f5;
}

a:hover.skip, a:active.skip
{
text-decoration: none;
color: #fff;
}

a:link.location, a:visited.location
{
color: #0389c8;
font-weight: 600;
text-decoration: none;
}


a:hover.location, a:active.location
{
color: #a5a4a4;
text-decoration: none;
font-weight: 600;
}

a:link.image, a:visited.image
{
text-decoration: none;
}

a:hover.image, a:active.image
{
text-decoration: none;
cursor: pointer;
}



/*------------------------------*/



/*GENERAL UNORDERED LIST STYLES*/
ul.white
{
width: 100%;
color: #fff;
font-weight: 400;
text-align: left;
padding: 0 0 .8em 0;
}

ul.white li
{
list-style-type: none;
background: url(../common_images/bulletpic_white.png) no-repeat left .4em;
padding: 0 0 0 1.3em;
}



ul.standard
{
width: 95%;
font-weight: 600;
text-align: center;
margin: 0 auto 1.6em auto;
}

@media all and (min-width: 65em) 
{
ul.standard
{
width: 70%;
}
}

ul.standard li
{
display: block;
margin: 0 0 .5em 0;
padding: 0 0 .5em 0;
border-bottom: 1px solid #ccc;
}

ul.standard li.last
{
display: block;
margin: 0;
padding: 0;
border: 0;
}


ul.standard_plain
{
width: 100%;
text-align: left;
margin: 0;
}


ul.standard_plain li
{
list-style-type: none;
display: block;
margin: 0;
padding: .2em 0 .2em 0;
border:0;
}

ul.standard_plain li a:link, ul.standard_plain li a:visited
{
color: #000;
font-weight: 600;
text-decoration: underline 2px solid #878b87;
display: block;
background: url(../common_images/nav_arrow_white.png) .2em .56em no-repeat;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
}


ul.standard_plain li a:hover, ul.standard_plain li a:active
{
color: #fff;
font-weight: 600;
text-decoration: underline 2px solid #878b87;
background: url(../common_images/nav_arrow_white.png) .4em .56em no-repeat;
display: block;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}

ul.standard_plain_white
{
width: 100%;
text-align: left;
margin: 0;
}

ul.standard_plain_white li
{
list-style-type: none;
display: block;
margin: 0;
padding: .2em 0 .2em 0;
border:0;
}

ul.standard_plain_white li a:link, ul.standard_plain_white li a:visited
{
color: #fff;
font-weight: 600;
text-decoration: underline 2px solid #babdc0;
display: block;
background: url(../common_images/nav_arrow_white_on_blue.png) .2em .56em no-repeat;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
}


ul.standard_plain_white li a:hover, ul.standard_plain_white li a:active
{
color: #000;
font-weight: 600;
text-decoration: underline 2px solid #babdc0;
background: url(../common_images/nav_arrow_white_on_blue.png) .4em .56em no-repeat;
display: block;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}



/*------------------------------*/



/*FACILITIES LIST*/


.facilities
{
width: 100%;
font-size: .8em;
margin: 0 0 1.5em 0;
}


.facilities ul
{
width: 100%;
margin: 0;
text-align: center;
}

.facilities ul li
{
width: auto;
color: #000;
text-align: center;
list-style-type: none;
font-weight: 500;
display: inline-block;
margin: 0 .2em .6em .2em;
background-color: #9fdbf7;
padding: .1em .8em .1em .8em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
}
 


/*------------------------------*/


/*TEXT PAGE LINKS*/


.text_links
{
width: 100%;
font-size: .8em;
margin: 0 0 1em 0;
}


.text_links ul
{
width: 100%;
margin: 0;
text-align: center;
}

.text_links ul li
{
width: auto;
list-style-type: none;
display: inline-block;
margin: 0 .1em .5em .1em;
}

.text_links ul li a:link, .text_links ul li a:visited
{
display: block;
color: #000;
text-align: center;
text-decoration: none;
font-weight: 600;
background-color: #b0d600;
padding: .1em .8em .1em .8em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
}

.text_links ul li a:hover, .text_links ul li a:active
{
display: block;
color: #fff;
background-color: #e4e7b6;
text-decoration: none;
text-align: center;
padding: .1em .8em .1em .8em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}
 


/*------------------------------*/




/*IMAGE STYLES*/

img.standard
{
width: 100%;
height: auto;
display: block;
margin: 0;
padding: 0;
}


img.standard_wales
{
width: 70%;
height: auto;
display: block;
margin: 0;
padding: 0;
}

@media all and (min-width: 40em) 
{
img.standard_wales
{
width: 40%;
}
}

@media all and (min-width: 60em) 
{
img.standard_wales
{
width: 80%;
}
}

@media all and (min-width: 65em) 
{
img.standard_wales
{
width: 70%;
}
}

@media all and (min-width: 70em) 
{
img.standard_wales
{
width: 60%;
}
}

@media all and (min-width: 80em) 
{
img.standard_wales
{
width: 90%;
}
}

@media all and (min-width: 100em) 
{
img.standard_wales
{
width: 75%;
}
}

@media all and (min-width: 120em) 
{
img.standard_wales
{
width: 67%; 
}
}


img.standard_map
{
width: 100%;
height: auto;
display: block;
padding: .3em 0 1.2em 0;
}

img.standard_map_reduced_border
{
width: 100%;
height: auto;
display: block;
padding: .3em 0 .5em 0;
}

img.standard_border_bottom
{
width: 100%;
height: auto;
display: block;
margin: 0 0 .6em 0;
}

img.standard_full_width
{
width: 100%;
height: auto;
display: block;
margin: 0;
}

img.standard_full_width_last
{
width: 100%;
height: auto;
display: block;
margin: 0 0 1.6em 0;
}

img.standard_logo
{
width: 11%;
height: auto;
display: block;
margin: 0 auto;
}

@media all and (min-width: 50em) 
{
img.standard_logo
{
width: 6%;
}
}

img.test
{
width: 49.3%;
height: auto;
display: block;
float: right;
margin: 0 0 1em 1em;
padding: 0;
}

img.feature
{
width: 100%;
height: auto;
display: block;
margin: 0;
padding: 0;
transition: transform .2s;
-webkit-transition: transform .2s;
-moz-transition: transform .2s;
-o-transition: transform .2s;
-ms-transition: transform .2s;
}

img.feature:hover 
{
transform: scale(1.03);
-webkit-transform: scale(1.03);
-moz-transform: scale(1.03);
-o-transform: scale(1.03);
-ms-transform: scale(1.03);
box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-webkit-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-moz-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-ms-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-o-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
}

img.feature_static
{
width: 100%;
height: auto;
display: block;
margin: 0;
padding: 0;
}




/*------------------------------*/



/*MISC STYLES*/

.dont-break-out
{
word-wrap: break-word;
}


/*BACK TO TOP BUTTON*/
.back_to_top
{
width: 100%;
margin: 0 0 1.6em 0;
text-align: center;
}


.back_to_top ul
{
width: 100%;
}

.back_to_top ul li
{
width: auto;
list-style-type: none;
display: inline-block;
margin: 0;
}

.back_to_top ul li a:link, .back_to_top ul li a:visited
{
display: block;
color: #fff;
text-align: center;
text-decoration: none;
font-weight: 600;
background-color: #37853b;
padding: .2em .6em .2em .6em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
}

.back_to_top ul li a:hover, back_to_top ul li a:active
{
display: block;
color: #fff;
background-color: #e4e7b6;
text-decoration: none;
text-align: center;
padding: .2em .6em .2em .6em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}




/*------------------------------*/



/*FIGURE STYLES*/
figure.pics
{
width: 100%;
}

figure.pics figcaption
{
font-weight: 400;
color: #000;
font-size: .8em;
line-height: 1.6em;
margin: 0;
padding: .4em 0 0 0;
}

figure.featurebox
{
width: 100%;
box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-webkit-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-moz-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-ms-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
-o-box-shadow: 0 0 12px 0 rgba(255, 255, 255, 0.8);
}

figure.featurebox figcaption
{
width: 100%;
font-weight: 600;
color: #000;
font-size: .8em;
line-height: 1.4em;
margin: 0;
padding: .8em 1.4em 1.3em 1.4em;
}


figure.featurebox2
{
width: 100%;
}

figure.featurebox2 figcaption
{
width: 100%;
font-weight: 600;
color: #000;
font-size: .8em;
line-height: 1.4em;
margin: 0;
padding: .8em 0 1.3em 0;
}


figure.featurebox figcaption.gray
{
width: 100%;
font-weight: 600;
color: #c6c3c3;
font-size: .8em;
line-height: 1.4em;
margin: 0;
padding: .8em 1.4em 1.3em 1.4em;
}

.free
{
color: #fff;
background: #95c11f;
font-weight: 700;
display: inline-block;
margin: .6em 0 0 0;
padding: .1em .5em .15em .5em;
border: 0;
border-radius: .2em;
-webkit-border-radius: .2em;
-moz-border-radius: .2em;
-ms-border-radius: .2em;
-o-border-radius: .2em;
}

.parking
{
color: #fff;
background: #009fe3;
font-weight: 700;
display: inline-block;
margin: .6em 0 0 0;
padding: .1em .5em .15em .5em;
border: 0;
border-radius: .2em;
-webkit-border-radius: .2em;
-moz-border-radius: .2em;
-ms-border-radius: .2em;
-o-border-radius: .2em;
}

.entry
{
color: #fff;
background: #1fc160;
font-weight: 700;
display: inline-block;
margin: .6em 0 0 0;
padding: .1em .5em .15em .5em;
border: 0;
border-radius: .2em;
-webkit-border-radius: .2em;
-moz-border-radius: .2em;
-ms-border-radius: .2em;
-o-border-radius: .2em;
}




/*------------------------------*/




/*CONTAINERS*/
.container
{
width: 100%;
margin: 0 auto;
display: grid;
grid-template-columns: auto;
grid-template-rows: auto auto auto auto auto auto;
grid-template-areas:
"info"
"head"
"main"
"edit"
"bar_1"
"foot";
}

.container_2
{
width: 100%;
margin: 0 auto;
display: grid;
grid-template-columns: auto;
grid-template-rows: auto auto auto auto auto auto;
grid-template-areas:
"info"
"head"
"main"
"edit"
"bar_2"
"bar_1"
"foot";
}

.container_3
{
width: 100%;
margin: 0 auto;
display: grid;
grid-template-columns: auto;
grid-template-rows: auto auto auto auto auto auto;
grid-template-areas:
"info"
"head"
"main"
"edit"
"bar_2"
"bar_1"
"bar_3"
"foot";
}




/*------------------------------*/



/*COLOUR BARS*/
.bar_1
{
width: 100%;
grid-area: bar_1;
background-color: #b0d600;
padding: .9em 0 0 0;
}


.bar_2
{
width: 100%;
grid-area: bar_2;
background-color: #dddee4;
padding: .9em 0 0 0;
}


.bar_3
{
width: 100%;
grid-area: bar_3;
background-color: #0389c8;
padding: .9em 0 0 0;
}




/*------------------------------*/



/*INFO BAR*/
.info_bar
{
grid-area: info;
display: grid;
grid-template-columns: none;
grid-template-rows: auto;
grid-template-areas:
"info_content";
background-color: #c8d400;
}

.info_bar_content
{
width: 80%;
grid-area: info_content;
margin: 0 auto;
padding: .3em 0 .4em 0;
}

@media all and (min-width: 80em) 
{
.info_bar_content
{
width: 70%;
}
}


.info_bar_content p
{
color: #505405;
font-size: .9em;
font-weight: 400;
line-height: 1.4em;
text-align: center;
}




/*------------------------------*/




/*HEADER*/
.header
{
width: 100%;
grid-area: head;
background: url("../common_images/header_pattern.png") no-repeat top center #000;
}


/*------------------------------*/



/*HEAD CONTENT*/
.head_content
{
width: 90%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto;
grid-template-areas:
"logo" 
"link"
"nav";
margin: 0 auto;
}

.logo
{
width: 100%;
grid-area: logo;
margin: 0 0 .5em 0;
}

.logo img
{
width: 65%;
height: auto;
display: block;
margin: 0 auto .5em auto;
}

@media all and (min-width: 35em) 
{
.logo img
{
width: 46%;
}
}

@media all and (min-width: 50em) 
{
.logo img
{
width: 40%;
}
}

@media all and (min-width: 70em) 
{
.logo img
{
width: 38%;
}
}

@media all and (min-width: 80em) 
{
.logo img
{
width: 32%;
}
}

@media all and (min-width: 90em) 
{
.logo img
{
width: 22%;
}
}


.links
{
display: flex;
align-items: center;
text-align: center;
grid-area: link;
margin: 0 0 1.1em 0;
}

.links ul
{
width: 100%;
}

.links ul li
{
list-style-type: none;
width: auto;
display: inline-block;
}


.links ul li a:link, .links ul li a:visited
{
display: block;
color: #000;
text-align: center;
text-decoration: none;
font-weight: 700;
background: #fff;
padding: .2em .7em .2em .7em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
box-shadow: 0 0 9px 6px rgba(255, 255, 255, 0.7);
-webkit-box-shadow: 0 0 9px 6px rgba(255, 255, 255, 0.7);
-moz-box-shadow: 0 0 9px 6px rgba(255, 255, 255, 0.7);
-ms-box-shadow: 0 0 9px 6px rgba(255, 255, 255, 0.7);
-o-box-shadow: 0 0 9px 6px rgba(255, 255, 255, 0.7);
} 

.links ul li a:hover, .links ul li a:active
{
display: block;
color: #fff;
background: #000;
text-decoration: none;
text-align: center;
padding: .2em .7em .2em .7em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
transition: 0.2s ease-in 0.2s;
-webkit-transition: 0.2s ease-in 0.2s;
-moz-transition: 0.2s ease-in 0.2s;
-ms-transition: 0.2s ease-in 0.2s;
-o-transition: 0.2s ease-in 0.2s;
}




/*------------------------------*/




/*DROP DOWN NAV BOX*/
#nav
{
grid-area: nav;
width: 100%;
display: none;
animation: fadein 1s;
-webkit-animation: fadein 1s;
-moz-animation: fadein 1s;
-ms-animation: fadein 1s;
-o-animation: fadein 1s; 
}

@keyframes fadein 
{
from {opacity: .2;}
to {opacity: 1;}
}

@-moz-keyframes fadein 
{
from {opacity: .2;}
to {opacity: 1;}
}

@-webkit-keyframes fadein 
{
from {opacity: .2;}
to {opacity: 1;}
}

@-ms-keyframes fadein
{
from {opacity: .2;}
to {opacity: 1;}
}

@-o-keyframes fadein 
{
from {opacity: .2;}
to {opacity: 1;}
}


#nav ul
{
width: 100%;
float: left;
color: #fff;
margin: 0;
padding: 0;
border: 0;
}


#nav ul li
{
list-style-type: none;
display: block;
margin: 0;
padding: .2em 0 .2em 0;
border:0;
}

#nav ul li.static
{
color: 	#5d5b5b;
list-style-type: none;
font-weight: 400;
display: block;
margin: 0;
padding: .2em .8em .2em .8em;
border:0;
}

#nav ul li a:link, #nav ul li a:visited
{
color: #fff;
font-weight: 200;
text-decoration: none;
display: block;
background: url(../common_images/nav_arrow.png) .2em .56em no-repeat;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
}


#nav ul li a:hover, #nav ul li a:active
{
color: #0389c8;
font-weight: 200;
text-decoration: none;
background: url(../common_images/nav_arrow.png) .4em .56em no-repeat;
display: block;
margin: 0;
padding: 0 .8em 0 .8em;
border: 0;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}


/*------------------------------*/



/*MAIN PIC BOX*/
div.main_pic
{
grid-area: main;
display: grid;
}

div.main_pic img
{
width: 100%;
height: auto;
display: block;
grid-column: 1;
grid-row: 1;
}

div.main_pic picture
{
grid-column: 1;
grid-row: 1;
}

div.main_pic_text_wrapper
{
width: 100%;
height: auto;
grid-column: 1;
grid-row: 1;
background-color: rgba(0, 0, 0, 0.4);
align-self: start;
}

div.main_pic_text
{
width: 80%;
grid-column: 1;
grid-row: 1;
color: #fff;
align-self: start;
text-align: center;
padding: .2em 0 .4em 0;
margin: 0 auto;
}

@media all and (min-width: 45em) 
{
div.main_pic_text
{
padding: .2em 0 .4em 0;
margin: 0 auto;
}
}

@media all and (min-width: 80em) 
{
div.main_pic_text
{
width: 70%;
}
}



/*------------------------------*/



/*EDITORIAL*/
.editorial
{
width: 90%;
grid-area: edit;
margin: 0 auto;
}

@media all and (min-width: 80em) 
{
.editorial
{
width: 70%;
}
}



/*------------------------------*/



/*YOU ARE HERE*/
.you_are_here
{
width: 100%;
color: #8a8989;
font-size: .8em;
font-weight: 400;
text-align: center;
padding: .6em 2% .5em 0;
margin: .9em auto 1em auto;
}

.you_are_here span
{
color: #000;
font-weight: 700;
}


/*------------------------------*/




/*SUBNAV*/
nav.subnav
{
width: 100%;
margin: 0 0 1em 0;
text-align: center;
}

nav.subnav ul
{
width: 100%;
}

nav.subnav ul li
{
width: auto;
list-style-type: none;
display: inline-block;
margin: 0 .2em .6em .2em;
}

nav.subnav ul li a:link, nav.subnav ul li a:visited
{
display: block;
color: #000;
text-align: center;
text-decoration: none;
font-weight: 600;
background-color: #b0d600;
padding: .3em 1em .3em 1em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
}

nav.subnav ul li a:hover, nav.subnav ul li a:active
{
display: block;
color: #fff;
background-color: #e4e7b6;
text-decoration: none;
text-align: center;
padding: .3em 1em .3em 1em;
border-radius: .4em;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
-ms-border-radius: .4em;
-o-border-radius: .4em;
transition: 0.1s ease-in 0.1s;
-webkit-transition: 0.1s ease-in 0.1s;
-moz-transition: 0.1s ease-in 0.1s;
-ms-transition: 0.1s ease-in 0.1s;
-o-transition: 0.1s ease-in 0.1s;
}





/*------------------------------*/


/*WALES CENTERED IN TEXT*/
.wales_centered 
{
width: 100%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto;
margin: 0 auto .6em auto;
}


.wales_centered img 
{
width: 70%;	
margin: 0 auto 0 auto;
}

@media all and (min-width: 26em) 
{
.wales_centered img 
{
width: 50%;
}
}

@media all and (min-width: 46em) 
{
.wales_centered img 
{
width: 40%;
}
}

@media all and (min-width: 50em) 
{
.wales_centered img 
{
width: 25%;
}
}

@media all and (min-width: 60em) 
{
.wales_centered img 
{
width: 20%;
}
}

@media all and (min-width: 80em) 
{
.wales_centered img 
{
width: 18%;
}
}


/*------------------------------*/



/*1 COL GRID*/
.one_col_grid
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: none;
grid-template-areas:
"one_col";
margin: 0 auto 1.6em auto;
}

.one_col
{
grid-area: one_col;
}

@media all and (min-width: 55em) 
{
.one_col_grid
{
width: 90%;
}
}

@media all and (min-width: 70em) 
{
.one_col_grid
{
width: 80%;
}
}

@media all and (min-width: 80em) 
{
.one_col_grid
{
width: 70%;
}
}

/*1 COL GRID FOR PICS*/
.one_col_grid_for_pics
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: none;
grid-template-areas:
"one_col";
margin: 0 auto 1em auto;
}


.one_col_grid_nav
{
width: 80%;
display: grid;
grid-template-columns: none;
grid-template-rows: none;
grid-template-areas:
"one_col";
margin: 0 auto .8em auto;
}


.one_col_grid_nav_border
{
width: 80%;
display: grid;
grid-template-columns: none;
grid-template-rows: none;
grid-template-areas:
"one_col";
margin: 0 auto 1.1em auto;
padding-bottom: 1.1em;
border-bottom: .03em solid #5bc5f2;
}


/*2 COL GRID*/
.two_col_grid
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto;
grid-column-gap: 0;
grid-template-areas:
"two_col_left"
"two_col_right";
margin: 0 0 1em 0;
}

@media all and (min-width: 55em) 
{
.two_col_grid
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 1em;
grid-template-areas:
"two_col_left two_col_right";
}
}


.two_col_grid_reduced_margin
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto;
grid-column-gap: 0;
grid-template-areas:
"two_col_left"
"two_col_right";
margin: 0 0 1em 0;
}

@media all and (min-width: 55em) 
{
.two_col_grid_reduced_margin
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 1em;
grid-template-areas:
"two_col_left two_col_right";
}
}





.two_col_left
{
grid-area: two_col_left;
margin: 0 0 1em 0;
}

@media all and (min-width: 55em) 
{
.two_col_left
{
margin: 0;
}
}

.two_col_right
{
grid-area: two_col_right;
}


/*3 COL GRID*/
.three_col_grid
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto auto auto;
grid-column-gap: 0;
grid-template-areas:
"three_col_left" 
"three_col_middle" 
"three_col_right";
margin: 0 0 1em 0;
}

@media all and (min-width: 55em) 
{
.three_col_grid
{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-column-gap: 1em;
grid-template-areas:
"three_col_left three_col_middle three_col_right";
}
}



.three_col_grid_reduced_margin
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto auto auto;
grid-column-gap: 0;
grid-template-areas:
"three_col_left" 
"three_col_middle" 
"three_col_right";
margin: 0 0 1em 0;
}

@media all and (min-width: 55em) 
{
.three_col_grid_reduced_margin
{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-column-gap: 1em;
grid-template-areas:
"three_col_left three_col_middle three_col_right";
}
}





.three_col_left
{
grid-area: three_col_left;
margin: 0 0 1em 0;
background: #fff;
}

@media all and (min-width: 55em) 
{
.three_col_left
{
margin: 0;
}
}

.three_col_middle
{
grid-area: three_col_middle;
margin: 0 0 1em 0;
background: #fff;
}

@media all and (min-width: 55em) 
{
.three_col_middle
{
margin: 0;
}
}

.three_col_right
{
grid-area: three_col_right;
margin: 0;
background: #fff;
}


/*4 COL GRID WHITE BACKGROUND*/
.four_col_grid
{
width: 100%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto auto;
grid-template-areas:
"four_col_1" 
"four_col_2" 
"four_col_3" 
"four_col_4";
margin: 0;
}

@media all and (min-width: 35em) 
{
.four_col_grid
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2" 
"four_col_3 four_col_4";
margin: 0 1em 0 0;
}
}

@media all and (min-width: 70em) 
{
.four_col_grid
{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: none;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2 four_col_3 four_col_4";
}
}

.four_col_1
{
grid-area: four_col_1;
background: #fff;
margin: 0 0 1em 0;
}

.four_col_2
{
grid-area: four_col_2;
background: #fff;
margin: 0 0 1em 0;
}

.four_col_3
{
grid-area: four_col_3;
background: #fff;
margin: 0 0 1em 0;
}

.four_col_4
{
grid-area: four_col_4;
background: #fff;
margin: 0 0 1em 0;
}



/*4 COL GRID NO BACKGROUND*/
.four_col_grid_noback
{
width: 100%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto auto;
grid-template-areas:
"four_col_1" 
"four_col_2" 
"four_col_3" 
"four_col_4";
margin: 0;
}

@media all and (min-width: 35em) 
{
.four_col_grid_noback
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2" 
"four_col_3 four_col_4";
margin: 0 1em 0 0;
}
}

@media all and (min-width: 70em) 
{
.four_col_grid_noback
{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: none;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2 four_col_3 four_col_4";
}
}

.four_col_1_noback
{
grid-area: four_col_1;
margin: 0 0 1em 0;
}

.four_col_2_noback
{
grid-area: four_col_2;
margin: 0 0 1em 0;
}

.four_col_3_noback
{
grid-area: four_col_3;
margin: 0 0 1em 0;
}

.four_col_4_noback
{
grid-area: four_col_4;
margin: 0 0 1em 0;
}





/*4 COL GRID NAV*/
.four_col_grid_nav
{
width: 80%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto auto;
grid-template-areas:
"four_col_1" 
"four_col_2" 
"four_col_3" 
"four_col_4";
margin: 0 auto 1.1em auto;
font-size: .95em;
padding-bottom: 1.1em;
border-bottom: .03em solid #5bc5f2;
}


@media all and (min-width: 60em) 
{
.four_col_grid_nav
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_3" 
"four_col_2 four_col_4";
}
}

@media all and (min-width: 80em) 
{
.four_col_grid_nav
{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: none;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2 four_col_3 four_col_4";
}
}




.four_col_grid_nav_noborder
{
width: 80%;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto auto auto auto;
grid-template-areas:
"four_col_1" 
"four_col_2" 
"four_col_3" 
"four_col_4";
margin: 0 auto 1.1em auto;
font-size: .95em;
}


@media all and (min-width: 60em) 
{
.four_col_grid_nav_noborder
{
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_3" 
"four_col_2 four_col_4";
}
}

@media all and (min-width: 80em) 
{
.four_col_grid_nav_noborder
{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: none;
grid-column-gap: 1em;
grid-template-areas:
"four_col_1 four_col_2 four_col_3 four_col_4";
}
}

.four_col_1_nav
{
grid-area: four_col_1;
}

.four_col_2_nav
{
grid-area: four_col_2;
}

.four_col_3_nav
{
grid-area: four_col_3;
}

.four_col_4_nav
{
grid-area: four_col_4;
}





/*6 COL GRID*/
.six_col_grid
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto auto auto auto auto auto;
grid-row-gap: 1em;
grid-template-areas:
"six_col_1"
"six_col_2"
"six_col_3"
"six_col_4"
"six_col_5"
"six_col_6";
}

@media all and (min-width: 35em) 
{
.six_col_grid
{
grid-template-columns: repeat(2, 1fr);
grid-template-rows: auto auto auto;
grid-column-gap: 1em;
grid-row-gap: 0;
grid-template-areas:
"six_col_1 six_col_2" 
"six_col_3 six_col_4" 
"six_col_5 six_col_6";
}
}

@media all and (min-width: 69em) 
{
.six_col_grid
{
grid-template-columns: repeat(3, 1fr);
grid-template-rows: auto auto;
grid-column-gap: 1em;
grid-template-areas:
"six_col_1 six_col_2 six_col_3"
"six_col_4 six_col_5 six_col_6";
}
}


@media all and (min-width: 100em) 
{
.six_col_grid
{
grid-template-columns: repeat(6, 1fr);
grid-template-rows: none;
grid-column-gap: 1em;
grid-template-areas:
"six_col_1 six_col_2 six_col_3 six_col_4 six_col_5 six_col_6";
}
}

.six_col_1
{
grid-area: six_col_1;
margin: 0 0 1.6em 0;
}

.six_col_2
{
grid-area: six_col_2;
margin: 0 0 1.6em 0;
}

.six_col_3
{
grid-area: six_col_3;
margin: 0 0 1.6em 0;
}

.six_col_4
{
grid-area: six_col_4;
margin: 0 0 1.6em 0;
}

.six_col_5
{
grid-area: six_col_5;
margin: 0 0 1.6em 0;
}

.six_col_6
{
grid-area: six_col_6;
margin: 0 0 1.6em 0;
}



/*------------------------------*/



/*FEATURE GRID*/
.feature_grid
{
width: 100%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto auto auto;
grid-row-gap: .3em;
grid-template-areas:
"pictop" 
"number" 
"textblock";
}

.pictop
{
grid-area: pictop;
}

.number
{
grid-area: number;
background: #009fe3;
text-align: center; 
}

.textblock
{
grid-area: textblock;
}

.blue_titles
{
color: #0389c8;
font-size: 1.2em;
font-weight: 600;
line-height: 1.1em;
}

.special_number
{
color: #ffffff;
background: #009fe3;
font-size: 1.2em;
font-weight: 600;
}



/*------------------------------*/




/*FOOTER*/
.footer
{
grid-area: foot;
background-color: #000;
}


/*------------------------------*/



/*FOOT CONTENT*/
.foot_content
{
width: 90%;
display: grid;
grid-template-columns: none;
grid-template-rows: auto auto auto auto;
grid-row-gap: 0;
grid-template-areas:
"col_1"
"col_2"
"col_3"
"copyright";
margin: 0 auto;
}

@media all and (min-width: 80em) 
{
.foot_content
{
width: 70%;
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: auto auto;
grid-column-gap: 1.2em;
grid-template-areas:
"col_1 col_2 col_3"
"copyright copyright copyright";
}
}

.col_1
{
grid-area: col_1;
margin: 2em 0 2em 0;
}

@media all and (min-width: 80em) 
{
.col_1
{
margin: 2em 0 2em 0;
}
}

.col_2
{
grid-area: col_2;
margin: .4em 0 2em 0;
}

@media all and (min-width: 80em) 
{
.col_2
{
margin: 2em 0 2em 0;
}
}

.col_3
{
grid-area: col_3;
margin: .4em 0 2em 0;
}

@media all and (min-width: 80em) 
{
.col_3
{
margin: 2em 0 2em 0;
}
}

.copyright
{
grid-area: copyright;
margin: 0 0 3em 0;
}

img.standard_footer
{
width: 55%;
height: auto;
display: block;
}

@media all and (min-width: 45em) 
{
img.standard_footer
{
width: 40%;
}
}

@media all and (min-width: 55em) 
{
img.standard_footer
{
width: 30%;
}
}

@media all and (min-width: 70em) 
{
img.standard_footer
{
width: 30%;
}
}

@media all and (min-width: 75em) 
{
img.standard_footer
{
width: 30%;
}
}

@media all and (min-width: 80em) 
{
img.standard_footer
{
width: 80%;
}
}


