/*
	Theme Name: Foamshore
	Theme URI: http://www.foamshore.co.uk
	Description: Made with love just for you
	Version: 1.4.3
	Author: Adam @ Foamshore
	Author URI: http://www.foamshore.co.uk
	Tags: Blank, HTML5, CSS3

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

.wp-block-image :where(figcaption) { text-align: center; }
.rmp-menu-subarrow { display: none !important; }

article a:not(.more), a.back { color: #6ba8a9; }
article a:not(.more):hover, a.back:hover { color: #444 !important; }

h2 a:not(.more),h2 a:not(.more):hover { color: #fff !important; }

.pagination { clear: both; padding-top: 45px; text-align: center; }
.pagination .page-numbers { padding: 5px 10px; min-width: 35px;  display: inline-block; }
.pagination .page-numbers:hover, .pagination .page-numbers.current { background: #fff; color: #24323e; }

.soliloquy-container, .soliloquy-container * { overflow: hidden !important; }
.soliloquy-container .soliloquy-pager { height: 20px!important; }
/*------------------------------------*\
    MAIN
\*------------------------------------*/

@media screen and (max-width: 800px){
#responsive-menu-container #responsive-menu li.responsive-menu-item a {
    
}
}

.responsive-menu-submenu-open{
	
	background-color:#212121 !important;
}

@media screen and (max-width: 800px){
#responsive-menu-container #responsive-menu ul.responsive-menu-submenu-depth-1 a.responsive-menu-item-link {
background:none !important;
	
	}
}

#maps #contentarea img{border-radius:0px;}

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}


.chapters{
    
    display:none;
}

.chaptersgallery{
    
    display:block;
}


.category-local-history .chapters{
    
    display:block;
}


.category-local-history .chaptersgallery{
    
    display:none;
}


/* html element 62.5% font-size for REM use */
html {
	font-size:100%;
}
body {
		background: #24323e;
	font-size:20px;
	line-height: 32px;
	color: #ffffff;
	margin: 0;
	padding: 0;
	word-wrap:break-word !important;
font-family: 'Cabin', sans-serif;
    overflow-x:hidden;
}
/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}



.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:#fff;
	text-decoration:none;
}
a:hover {
	color:#444;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}


.soliloquy-container .soliloquy-image {
   border-radius:10px;
       

}

#homeitem .more{width:100%;}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {
	max-width:1200px;
	width:100%;
	margin:0 auto;
	position:relative;
}
/* header */
.header {
    
    width:100%;
    position:relative;

}
/* logo */
.logo {
    
    width:26%;
    padding:2% 0%;

}
.logo-img {

}
/* nav */

/* sidebar */
.sidebar {
    
    display:none;

}
/* footer */
.footer {
    
float:left;
    width:100%;
    text-align:center;
    padding:20px;
    font-size:0.7em;
}


.panzoom-parent{
    
    border-radius:20px; margin-right:5%; float:left; width:45%; margin-bottom:30px; BACKGROUND-COLOR:#FFF; HEIGHT:300PX;
}
/* nav colours for areas */

.panzoom img{border-radius:0px;}

.eastern{
    
    background-color:#9fab55;
}

.category-eastern #pagefeature{
    
    background-color:#9fab55;
}


.child-category-of-eastern #pagefeature{
    
    background-color:#9fab55;
}

.child-category-of-eastern h2 a{
    
 color:#9fab55;   
    
}

.child-category-of-eastern .more{
    
 background-color:#9fab55;   
    
}

/* western */


.category-western #pagefeature{
    
    background-color:#425a30;
}


.child-category-of-western #pagefeature{
    
    background-color:#425a30;
}

.child-category-of-western h2 a{
    
 color:#425a30;
    
}

.child-category-of-western .more{
    
 background-color:#425a30;
    
}





/* western */


.category-north-western #pagefeature{
    
    background-color:#c49c08;
}


.child-category-of-north-western #pagefeature{
    
    background-color:#c49c08;
}

.child-category-of-north-western h2 a{
    
 color:#c49c08;
    
}

.child-category-of-north-western .more{
    
 background-color:#c49c08;
    
}


/* northern */


.category-northern #pagefeature{
    
    background-color:#9e4042;
}


.child-category-of-northern #pagefeature{
    
    background-color:#9e4042;
}

.child-category-of-northern h2 a{
    
 color:#9e4042;
    
}

.child-category-of-northern .more{
    
 background-color:#9e4042;
    
}





/* southern */


.category-southern #pagefeature{
    
    background-color:#bd6f07;

}


.child-category-of-southern #pagefeature{
    
    background-color:#bd6f07;
}

.child-category-of-southern h2 a{
    
 color:#bd6f07;
    
}

.child-category-of-southern .more{
    
 background-color:#bd6f07;
    
}





/* central */


.category-central #pagefeature{
    
    background-color:#457abb;

}


.child-category-of-central #pagefeature{
    
    background-color:#457abb;
}

.child-category-of-central h2 a{
    
 color:#457abb;
    
}

.child-category-of-central .more{
    
 background-color:#457abb;
    
}


/* far eastern */


.category-far-eastern #pagefeature{
    
    background-color:#b25c44;

}


.child-category-of-far-eastern #pagefeature{
    
    background-color:#b25c44;
}

.child-category-of-far-eastern h2 a{
    
 color:#b25c44;
    
}

.child-category-of-far-eastern .more{
    
 background-color:#b25c44;
}




.fareastern{
    
    background-color:#b25c44;
}

.central{
    
    background-color:#457abb;

}

.southern{
    
    background-color:#bd6f07;
}


.northern{
    
    background-color:#9e4042;
}


.northwestern{
    
    background-color:#c49c08;
}


.western{
    
    background-color:#425a30;
}

.start{
    
    border-top-left-radius:10px;

}


.end{
    border-top-right-radius:10px;

}

body.home .start { border-bottom-left-radius: 10px; }
body.home .end { border-bottom-right-radius: 10px; }

body.home nav ul:hover .start, body.home nav ul:hover .end { border-bottom-left-radius: 0px;border-bottom-right-radius: 0px;}


.toggle,
[id^=drop] {
	display: none;
}

/* Giving a background-color to the nav container. */
nav { 
	margin:0;
	padding: 0;
    z-index:999;
    font-weight:700;
}


/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

nav:after {
	content:"";
	display:table;
	clear:both;
}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul {
	float: left;
	padding:0;
	margin:0;
	list-style: none;
	position: relative;
    width:100%;
	}
nav ul.flex { display: flex; }

/* Positioning the navigation items inline */
nav ul li {
	margin: 0px;
	display:inline-block;
	float: left;
    width:calc(100% / 7);
    text-align:center;
	}
nav ul.flex li { flex: 1; }

nav ul li:hover { border-bottom: 0px !important;}
.child-category-of-eastern li.eastern, .child-category-of-western li.western, .child-category-of-north-western li.northwestern, .child-category-of-northern li.northern, .child-category-of-southern li.southern, .child-category-of-central li.central, .child-category-of-far-eastern li.fareastern { border-bottom: 0px !important;}
.category-eastern li.eastern, .category-western li.western, .category-north-western li.northwestern, .category-northern li.northern, .category-southern li.southern, .category-central li.central, .category-far-eastern li.fareastern { border-bottom: 0px !important;}


/* Styling the links */
nav a {
	display:block;
	padding:14px 5px;	
	color:#FFF;
	font-size:18px;
	text-decoration:none;
}


nav ul li ul li:hover { font-weight:bold; }

/* Background color change on Hover */
nav a:hover { 
font-weight:bold;
}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {
	display: none;
	position: absolute; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: 61px; 
    width: 100%;
    left:0%;
    border:1px solid #fff;
	border-top: 0px;
    background-color:#666;
    padding:1%;
    border-bottom-right-radius:10px;
    border-bottom-left-radius:10px;

}


nav ul ul ul{
	display: block;
	position: inherit; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: inherit; 
    width:inherit; 
    left:inherit; 
    width:100%;
    border:0px;
    background-color:inherit; 
    padding:1%;
    border-bottom-right-radius:inherit; 
    border-bottom-left-radius:inherit; 

}
	
/* Display Dropdowns on Hover */
nav ul li:hover > ul {
     display: grid;
}
	
/* Fisrt Tier Dropdown */
nav ul ul li {
	width:100%;
	float:left;
	position: relative;
    
}


nav ul ul li a{
padding:2% 2%;
        text-align:left;

    
}


.textwidget li{float:left; width:20%; padding:10px;}

/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {
	position: inherit;
	top:inherit;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:inherit; 
    width:20%;
}

	



/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {

    nav{display:none;}

}



/*------------------------------------*\
    PAGES
\*------------------------------------*/

#feature{
    
    float:left;
    width:100%;
    clear:both;
    z-index:-1;
    position:relative;
    margin-top:20px;
    border-radius:20px;
}


#pagefeature{
    
    float:left;
        background-color:#609e9e;
    border:1px solid #fff;
	border-top: 0px;
    width:100%;
    clear:both;
    z-index:-1;
    position:relative;
    padding:1% 3% 2% 3%;
    margin-bottom:50px;
    border-bottom-right-radius:10px;
    border-bottom-left-radius:10px;
}


.single #pagefeature{
    
    float:left;
    width:100%;
    clear:both;
    z-index:-1;
    position:relative;
    padding:1% 3% 2% 3%;
    margin-bottom:0px;
    border-bottom-right-radius:0px;
    border-bottom-left-radius:0px;
}

@media only screen and (max-width: 900px) {
#pagefeature{
 border-top:1px solid #fff;
    border-top-right-radius:10px;
    border-top-left-radius:10px;
 }
}

/*------------------------------------*\
    IMAGES
\*------------------------------------*/

#menu2{
    
    position:absolute;
    top:35%;
    right:0%;
    width:70%;
}

#title{
    
    position:absolute;
    top:15%;
    right:10px;
    width:70%;
    font-style:italic;
    text-align:right;
    font-size:0.8em;
    color:#609e9e;
}


.toggle,
[id^=drop] {
	display: none;
}

/* Giving a background-color to the nav container. */
#menu2 nav { 
	margin:0;
	padding: 0;
    z-index:9999;
    font-weight:700;
    text-align:right;
}


/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

#menu2 nav:after {
	content:"";
	display:table;
	clear:both;
}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
#menu2 nav ul {
	float: right;
	padding:0px;
	margin:0px;
	list-style: none;
	position: ABSOLUTE;
    width:100%;
    text-align:right;
	}
	
/* Positioning the navigation items inline */
#menu2 nav ul li {
	margin: 0px;
	display:inline-block;
    width:auto;
    text-align:right;
    float:right;
    POSITION:RELATIVE;
    z-index:999;
    TEXT-ALIGN:CENTER;
    
	}

/* Styling the links */
#menu2 nav a {
	display:block;
	padding:14px 10px;	
	color:#FFF;
	font-size:18px;
	text-decoration:none;
}

#menu2 nav ul li ul li:hover { font-weight:bold; }

/* Background color change on Hover */
#menu2 nav a:hover { 
font-weight:bold;
}


#menu2 nav ul ul ul{
	display: block;
	position: relative; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: inherit; 
    width:inherit; 
    left:inherit; 
    width:100%;

    background-color:#333; 
    padding:1%;
    border-bottom-right-radius:inherit; 
    border-bottom-left-radius:inherit; 
    z-index:999999;

}
	

	
/* Display Dropdowns on Hover */
#menu2 nav ul li:hover > ul {
     display: grid;
}
	
/* Fisrt Tier Dropdown */
#menu2 nav ul ul li {
	width:100%;
	float:none;
	display:list-item;
	position: relative;
        z-index:999999;

    
}


#menu2 nav ul ul li a{
padding:8% 8%;
        text-align:left;

    
}

#menu2 nav ul ul ul li a{
padding:3% 3%;
        text-align:left;

    
}

#menu2 nav ul ul {
    display: none;
    position: absolute;
    top: 50px;
    width: 100%;
    left: 0%;
    text-align:center;
    background-color: #24323e;
    padding: 1%;
    border: 0px;
	border-radius: 10px !important;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    width:220px;
}


#menu2 nav ul ul ul {
 
    top: 0px;
    
}



/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
#menu2 nav ul ul ul li {
	position: relative;
	top:inherit;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:0px; 
    padding:5px;
}



/*------------------------------------*\
BLOGS

\*------------------------------------*/

#stats{
    border: 1px solid #fff;
    border-top: 0px;
    float:left;
    width:100%;
    background-color:#609e9e;
    padding:15px 20px;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    margin-bottom:40px;
}


#stat4{
    
    float:left;
    width:25%;
    padding: 5px 20px 5px 70px;
    background:url(img/icon4.png);
    background-position:left center;
    background-repeat: no-repeat;
}

#stat3{
    
    float:left;
    width:25%;
    padding: 5px 20px 5px 70px;
    background:url(img/icon1.png);
    background-position:left center;
    background-repeat: no-repeat;
}
#stat2{
    
    float:left;
    width:auto;
    padding: 5px 20px 5px 70px;
  margin-left: 70px;
    background:url(img/icon2.png);
    background-position:left center;
    background-repeat: no-repeat;
}
#stat1{
    
    float:left;
    width:auto;
    padding: 5px 20px 5px 70px;
    background:url(img/icon3.png);
    background-position:left center;
    background-repeat: no-repeat;
}
#stat0{
    
    float:left;
    width:100%;
    padding: 10px 20px 10px 70px;
    background:url(img/icon0.png);
    background-position:left center;
    background-repeat: no-repeat;
}

#stat0:empty, #stat1:empty, #stat2:empty, #stat3:empty, #stat4:empty { display: none; }
#thumb{
    
    float:left;
    width:35%;
}


#thumb img{
    
    border-radius:10px;
}

#extract{
    
    float:right;
    width:60%;
}


#thumb2{
    
    float:left;
    width:20%;
}


#thumb2 img{
    
    border-radius:20px;
}

#extract2{
    
    float:right;
    width:70%;
}


article{
    
    float:left;
    width:100%;
    margin-bottom:50px;
}

#extract h2{margin-top:0px; padding-top:0px;}

#contentarea{
    
    float:left;
    width:100%;
    padding:0% 15%;
}


#mobilearea{
    
    float:left;
    width:100%;
    padding:0% 0%;
    margin-top:-20px;
}

#contentarea img{border-radius:10px;}
#gallery img{border-radius:10px;}
#pagethumb img{border-radius:10px;}

.gallery-item{float:left; width:25%; padding:1%; margin:0%;}
.gallery-item img{width:100%;}


#mapitem{
    
    float:left;
    width:100%;
    margin-top:20px;
}

#mapthumb{
    
    float:left;
    width:40%;
}

#mapextract{
    
    float:right;
    width:50%;
}

#maps{
    
    float:left;
    width:100%;
    margin-bottom:0px;
}
	
#gallery{
    
    text-align:center;
}

/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/

@font-face {
	font-family:'Font-Name';
	src:url('fonts/font-name.eot');
	src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
    font-weight:normal;
    font-style:normal;
}




.more{
    
    display:block;
    background-color:#609e9e;
    padding:10px;
    border-radius:10px;
    color:#fff;
    width:200px;
    text-align:center;
    transition-duration: 1s;
}



.more1{
    
    display:block;
    float:left;
    background-color:#ccc;
    padding:10px;
    height:55px;
    border-radius:10px;
    color:#fff;
    text-align:center;
    transition-duration: 1s;
    border:0px;
    margin:1%;
}

.more2{
    
    display:inline-block;

    background-color:#609e9e;
    padding:10px;
    border-radius:10px;
    color:#fff;
    width:200px;
        height:55px;

    text-align:center;
    transition-duration: 1s;
    border:0px;
 width:30%;
    margin:1%;}

#homethumb{
    
    float:left;
    width:100%;
    height:180px;
    margin-bottom:20px;
    border-radius:10px;
    background-repeat: no-repeat;
    background-position:center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#hometitle{
    
    float:left;
    width:100%;
    text-align:center;
    font-size:1.8em;
    margin-top:40px;
    margin-bottom:30px;
}


.single h3{
    
    border-bottom:solid 1px #666;
    padding-bottom:10px;
    margin-bottom:10px;
}


#gallery-1 img {
    border: 0px solid #cfcfcf;
}


#homeitem{
    
    float:left;
    width:33.333%;
    padding:25px;
    text-align:center;
}

.more:hover{background-color:#666;     transition-duration: 1s;
}


.category-local-history #maps{display:none;}
.category-local-history .go{display:none;}


.category-long-distance #maps{display:none;}
.category-long-distance .go{display:none;}
/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media only screen and (max-width:1000px) {
    
    
    
    .panzoom-parent{
    
    border-radius:20px; margin-right:0%; float:left; width:100%; margin-bottom:30px; BACKGROUND-COLOR:#FFF; HEIGHT:350PX;
}
    
    
    
    
    nav a {
	
	font-size:15px;
        	padding:14px 0px;	

}
    
    
    
    #menu2{
    
    top:25%;
  
}
    
    
     #title{
    
    top:10%;
  
}
    
    
    #menu2 nav a {
	display:block;
	padding:14px 10px;	
	color:#FFF;
	font-size:15px;
	text-decoration:none;
}
    

}



@media only screen and (max-width:900px) {
    
    
    .more1 {
 width:100%
}
    
     .more2 {
 width:100%
}   
    
    h1{line-height:1.2em; font-size:1.3em;}
    
    #thumb2 {
    float: left;
    width: 100%;
}
    
    #extract2 {
    float: right;
    width: 100%;
}
    
    
    
    #thumb {
    float: left;
    width: 100%;
        margin-bottom:20px;
}
    
    
    #homeitem{
    
    float:left;
    width:100%;
    padding: 2% 0px;
    text-align:center;
}
    
    
    #extract {
    float: right;
    width: 100%;
}
    
    
    .eastern {
    background-color: #9fab55;
        border-radius:10px; 
        padding:15px;
}
    
    
      .western {
        border-radius:10px; 
        padding:15px;
}
    
    
         .northwestern {
        border-radius:10px; 
        padding:15px;
}
    
    
    
        .northern {
        border-radius:10px; 
        padding:15px;
}
    
      .southern {
        border-radius:10px; 
        padding:15px;
}
    
    .central {
        border-radius:10px; 
        padding:15px;
}
    
     
    .fareastern {
        border-radius:10px; 
        padding:15px;
}
    
    #mobilearea li{list-style:none; font-weight:bold;}
    
    
    
    
    nav{
	
display:none;
    
    }
    
    
    #stat1 {
    float: left;
    width: 100%;
    
}
    
        #stat2{
    float: left;
    width: 100%;
          margin-left: 0px;
    
}
    
        #stat3 {
    float: left;
    width: 100%;
    
}
    
        #stat4 {
    float: left;
    width: 100%;
    
}
    
    
    #contentarea {
    float: left;
    width: 100%;
    padding: 0% 5%;
}
    
    
    
    #title{display:none;}
    
    
    
    
    .logo{
        
float:left;
       
        width:50%;
        padding:20px;
    }
    
    
    .header{
        
        border-bottom:solid 0px #fff;
    }
    

}

/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:0px 0px 5px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}


#features{
			
			margin-left:-25px;
			width: calc(100% + 50px);
			float:left;

		}
@media all and (max-width : 1025px) {

		#features{
			
			margin-left:-25px;
			width: calc(100% + 50px);
			float:left;

		}
	
}

@media all and (max-width :900px) {

		#features{
			
			margin-left:00px;
			width: calc(100% + 0px);
			float:left;

		}
}