﻿
/*
Theme Name: Travelling With Nikki
Description: Travelling With Nikki 2019. 2.0
Author: Beachshore Design Limited
Author URI: https://www.beachshore.co.uk/
Version: 2.0
Tags: bespoke
*/
@import url('css-Raleway400500600700300ClickerScript.css');
/*********************************************************************************/
/* Reset                                                                         */
/*********************************************************************************/
* {
	margin:0; padding:0;
	-webkit-overflow-scrolling: touch;
}
html {
	margin: 0;
	height: 100%;
}
html, body {
	width: 100%;
	overflow-x: hidden; /* Fix wider background */
}
body {
	font-family: 'Raleway', sans-serif;
	font-weight: normal;
	text-rendering: optimizeLegibility; 
	-webkit-font-smoothing: subpixel-antialiased;
}
img {
	display:block;
} /* Resets images to avoid gap beneath when using Strict doctype */
h1, h2, h3, h4, p, li {
	font-weight: 400;
	font-size: 1rem;
}
a {
	text-decoration: none;	
}
strong {
	font-weight: 700;
}
/*********************************************************************************/
/* Wrappers                                                                      */
/*********************************************************************************/
.wrapper {
	max-width: 990px;
	margin: 0 auto;
}
.overflow {
	overflow: hidden;
}
#contentpagewrapper {
	float: left;
	width: 73%;
	margin-right: 5%;
}
#sidewrapper {
	float: left;
	width: 22%;
}
/*********************************************************************************/
/* Colours                                                                       */
/*********************************************************************************/
.textcolour {
	color: #666;
}
.titlecolour {
	background: #918dbf;
}
/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/
#header {
	float: left;
	width: 100%;
	margin-top: 4em;
}
#header #logo,
#header #subtitle {
	float: left;
	width: 100%;
}
#header #logo {
	margin: 22px 0;
}
#header #logo h1 {
	font-size: 2.5rem;
	font-weight: 500;
	letter-spacing: .2rem;
	text-transform: uppercase;
	color: #918dbf;
	text-align: center;
}
#header #subtitle h1 {
	font-size: 28px;
	color: #918dbf;
	font-family: 'Clicker Script', cursive;
	text-align: center;
}
/*********************************************************************************/
/* Menu                                                                          */
/*********************************************************************************/
#menuwrapper {
	float: left;
	margin: 3em 0;
	width: 100%;
}
#menu {
	margin: .5em auto;
}
#menu ul {
	padding:0;
	z-index: 999;
	text-align: center;
}
#menu ul li {
	display: inline-block;
	list-style:none;
	font-size: .875rem;
	letter-spacing: .2rem;
	font-weight: 400;
	text-transform: uppercase;
}
#menu ul li a {
	text-decoration: none;
	color: #000;
	display: block;
	padding: .6em 1em;
}

#menu ul li a.selected,
#menu ul li a:hover {
	color: #666666;
}
#slicknav {
	float: left;
	width: 100%;
}
.slicknav_menu {
	display:none;
}

/*********************************************************************************/
/* Article                                                                       */
/*********************************************************************************/
#articletags {
	float: left;
	width: 100%;
	margin: 1em 0 2em 0;
}
#articletags ul {
	list-style-type: none;
	float: left;
	margin-left: 1em;
}
#articletags li {
	font-size: .875rem;
	margin-right: .75em;
	float: left;
}
#articletags p {
	font-size: 12px;
	font-weight: bold;
	color: #000;
	margin-right: 1em;
	float: left;
}
.mainarticle {
	float: left;
	margin: 1em 0;
	width: 100%;
}
.mainarticle ul {
	margin-left: 5%;
	width: 90%;
}
.mainarticle ul li {
	margin-bottom: 1rem;
	color: #918dbf;
}
.mainarticle img {
	float: left;
	margin-right: 1%;
	margin-bottom: 5px;
	width: 49%;
	height: auto;
}
.mainarticle .imgportrait {
	width: 32%;
	height: auto;
}
.mainarticle .imgcentre {
	display: block;
	margin: 0 auto;
	text-align: center;
	float: none;
}
.mainarticle .wp-post-image {
	text-align: center;
	float: none;
	clear: both;
	margin-bottom: 1em;
	display: block;
	margin: 0 auto;
	/* Make Featured Image Full Width (2 Lines Below) */
	width: 100%;
	height: auto;
}
.mainarticle div { /* Used to wrap Images */ 
	width: 100%;
	margin-bottom: 1em;
	float: left;
}
.mainarticle div img { /* Used to wrap Images */ 
	text-align: center;
	display: block;
}
/*.mainarticle .imgwrap { /* Used to wrap Images * / 
	width: 100%;
	margin-bottom: 1em;
	float: left;
}
.mainarticle .imgwrap img { /* Used to wrap Images * / 
	text-align: center;
	display: block;
}*/
.mainarticle .imgportraitwrap {
	text-align: center;
}
.mainarticle .imgportraitwrap img {
	float: none;
	display: inline-block;
	width: 32%;
}
.mainarticle .avatar {
	max-width: 50px;
	height: auto;
}
.navigation {
	float: left;
	width: 100%;
}
.navigation p {
	text-align: center;
	margin-bottom: 1em;
}
/*********************************************************************************/
/* Home Page                                                                     */
/*********************************************************************************/
.mainarticle .homeheaderwrap {
	float: left;
	width: 100%;
	margin: 0;
}
.mainarticle .homeheaderwrap .homeheader {
	float: right;
	width: 50%;
}
.mainarticle .homeheaderwrap .homeheader h2 {
	width: 95%;
	margin-left: 5%;
}
.mainarticle .homeheaderwrap .homeheader img {
	width: 100%;
	height: auto;
}
.mainarticle .content h1,
.mainarticle .content h3 {
	font-size: 125%;
}
/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/
.sidecontentwrapper {
	float: left;
	width: 100%;
	margin-bottom: 2em;
}
.sidecontentwrapper h1,
.widget-title {
	text-align: center;
	font-size: .875rem;
	text-transform: uppercase;
	font-weight: 400;
	color: #918dbf;
	letter-spacing: .2rem;
	margin-bottom: 1rem;
}
.icons {
	text-align: center;
	width: 100%;
}
.icons li {
	display: inline-block;
	margin: 2px;
}
/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/
#footer {
	float: left;
    width: 100%;
	margin-top: 2em;
}
#footer #creditswrapper #copyright,
#footer #creditswrapper a {
	color: #666666;
}
#footer #creditswrapper {
	float: left;
	width: 100%;
	margin: .75em 0;
}
#footer #creditswrapper #copyright,
#footer #creditswrapper #webcredit {
	font-size: 11px;
	float: left;	
}
#footer #creditswrapper #copyright {
	width: 65%;	
}
#footer #creditswrapper #webcredit {
	width: 35%;	
	text-align: right;
}
#footer #creditswrapper #copyright a:hover {
	text-decoration: underline;
}
#footer #creditswrapper #webcredit #beachshore:hover {
	color: #918dbf;
}
#footer #creditswrapper #webcredit #beachshore #beachshorebold {
	font-weight: 700;
}
/*********************************************************************************/
/* Wordpress Styling                                                             */
/*********************************************************************************/
.wpbodywrapper ol {
	list-style-type: none;
}
.wpbodywrapper h2 {
	font-size: 25px;
	color: #918dbf;
	margin-bottom: 30px;
	font-weight: 400;
}
.wpbodywrapper h3 {
	font-size: 1.125rem;
	color: #000;
	color: #918dbf;
	margin-bottom: 30px;
	font-weight: 700;
}
.wpbodywrapper a {
	color: #918dbf;
}
.wpbodywrapper a:hover {
	color: #666666;
}
.wpbodywrapper .content p {
	font-size: 1rem;
	color: #000;
	line-height: 150%;
	margin: 1rem 0;
}
.wpbodywrapper .content #articletags p {
	margin: 0;
}
.wpsidecontent ul {
	list-style-type: none;
	font-size: 0.875em;	
}
.wpsidecontent ul.icons li i {
	font-size: 2.5rem;
	color: #918dbf;
}
.wpsidecontent ul a {
	color: #918dbf;
	text-decoration: none;
}
.wpsidecontent ul a:hover {
	color: #666666;
}
.wpsidecontent li {
	font-weight: 400;
	margin-bottom: 1.125rem;
}
.wpcontent #searchform {
	float: left;
	width: 100%;
}
.wpsidecontent .formobject {
	color: #000;	
	font-size: 12px;
	padding: 0.5em;
	border: 1px solid #CCCCCC;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	width: 97%;
	float: left;
	margin: .25em 0;
}
.wpsidecontent .formsubmit {
	background-color: #918dbf;
	font-size: 1rem;
	color: #FFF;
	padding: .5rem 1rem;
	border: 0;
	margin: .25em auto;
	text-align: center;
	display: block;
}

.wpsidecontent .readmore a {
	color: #000;
	text-decoration: none;
}
.wpsidecontent #wp-calendar {
	color: #000;
	font-size: 0.9375em;
	margin-left: 1.25em;		
}
.wpsidecontent #wp-calendar td {
	padding-left: 0.1875em;
	padding-right: 0.1875em;	
}
.wpsidecontent #wp-calendar #next {
	text-align: right;	
}
.wpsidecontent #wp-calendar a {
	color: #726637;
	font-weight: bold;
	text-decoration: none;
}
.addthis_default_style {
	float: left;
	width: 100%;
	margin-bottom: 1em;
}
.nav-single {
	float: left;
	width: 100%;
	margin: 2em 0;
}
.nav-single h3 {
	color: #918dbf;
}
.nav-single p {
	text-align: center;
	margin-bottom: 1em;
}
#commentform {
	float: left;
	width: 100%;
	margin: 0 0 1em 0;
}
.comment-form-comment {
	float: left;
	width: 100%;
	margin: 1em 0;
}
.comment-form-comment label,
.comment-form-author label,
.comment-form-email label,
.comment-form-url label,
.comment-subscription-form label {
	color: #000;
	font-size: 1rem;
}
.comment-form-author label,
.comment-form-email label,
.comment-form-url label {
	width: 20%;
	float: left;
}
.comment-form-author #author,
.comment-form-email #email,
.comment-form-url #url {
	margin-bottom: 1em;
	color: #000;	
	font-size: 12px;
	padding: 0.5em;
	border: 1px solid #CCCCCC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	width: 50%;
}
.comment-form-comment #comment {
	color: #000;	
	font-size: 12px;
	padding: 0.5em;
	border: 1px solid #CCCCCC;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	width: 97%;
	float: left;
	margin: .25em 0;
}
.form-submit #submit,
.comment-form #submit {
	background-color: #918dbf;
	font-size: 1rem;
	color: #FFF;
	padding: .5em 1rem;
	border: 1px solid #CCCCCC;
	margin: 1em auto;
	text-align: center;
	display: block;
}
.comment-subscription-form {
	float: left;
	width: 100%;
	margin: 1em 0 0 0;
}
.comment-content p {
	color: #000;
	font-size: 14px;
}
/*********************************************************************************/
/* Related Posts                                                                 */
/*********************************************************************************/
.related_post_title {
}
ul.related_post {
}
ul.related_post li {
	list-style-type: none;
	display: inline-block;
	margin: .5em 1% 1em 0;
	font-size: .875rem;
	width: 24%;
	vertical-align: top;
}
ul.related_post li a {
	float: left;
	width: 98%;
	margin: .25em 1%;
}
ul.related_post li img {
	width: 100%;
	height: auto;
}

/*********************************************************************************/
/* Cookie widget fix                                                             */
/*********************************************************************************/
.widget-container.widget_eu_cookie_law_widget {
    margin: 0 auto;
    padding: 0;
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index:1000;
}
.widget_eu_cookie_law_widget {
    list-style: none;
}
/*********************************************************************************/
/* Hide the WordPress Stats Smiley                                               */
/*********************************************************************************/
img#wpstats{width:0px;height:0px;overflow:hidden}
/*********************************************************************************/
/* Below 1000px                                                                  */
/*********************************************************************************/
@media (max-width:1000px) {
	
	.wrapper {
		max-width: 800px;
		margin: 0 auto;
	}
	
}

/*********************************************************************************/
/* Below 800px                                                                   */
/*********************************************************************************/
@media (max-width:800px) {
	#contentpagewrapper {
		width: 94%;
		margin: 0 3%;
	}
	#sidewrapper {
		width: 98%;
		margin: 1em 1%;
	}
	#footer #creditswrapper #copyright,
	#footer #creditswrapper #webcredit {
		width: 98%;
		margin: 1em 1%;	
		text-align: center;
	}
	#header {
		margin-top: 1em;
	}
	#header #logo {
		margin: 16px 0;
	}
	#menuwrapper {
		display:none;
	}
	
	.slicknav_menu {
		display:block;
		margin: 2em 0;
	}
}
/*********************************************************************************/
/* Below 640px                                                                   */
/*********************************************************************************/
@media (max-width:640px) {
	ul.related_post li {
		width: 49%;
	}
	.mainarticle .homeheaderwrap .homeheader {
		width: 100%;
	}
	.mainarticle .homeheaderwrap .homeheader h2 {
		width: 100%;
		margin-left: 0;
	}
	.mainarticle img {
		float: left;
		margin: 5px 1%;
		width: 98%;
		height: auto;
		max-width: 630px;
	}
	.mainarticle .imgportrait {
		min-width: 32%;
		height: auto;
	}
}
