/*
Theme Name: Rebecca Mays
Description: Child theme for the Responsive theme 
Author: Alex Pilcher
Template: responsive
*/

@import url("../responsive/style.css");

/* --- PAGE AREAS ---------------------------- */

body { 
	-webkit-font-smoothing: antialiased;
	font-smooth: always;
	background-color: #131313;
	background-image: url('images/page-border.jpg');
	background-position: top center;
	background-repeat: repeat-y;
	color: #b2b2b2;
	font-family: 'Averia Serif Libre', Arial, sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	padding-bottom: 20px;
}
#container { 
	background: transparent; 
	max-width: 960px;
	margin: 0px auto 0px; 
	padding: 0px 25px 0px;
}
#footer {
	background: #131313;
	min-height: 36px;
	max-width: 710px;
	padding: 0px 10px;
	font-size: 0.8em;
}
#footer  a, #footer a:hover { color: #b2b2b2; }
#footer .grid { margin-bottom: 10px; }

/* --- TEXT STYLES ---------------------------- */

p, div, li, td, th,
.menu li, .menu a, 
.widget-wrapper *, .post-meta, .read-more, .post-data,
.comment-author, .comment-meta, .reply { 
 font-family: 'Averia Serif Libre', Arial, sans-serif; 
 font-weight: 300;
}
#logo span, #logo span a,
h1, h1 a,
h2.post-title, h2.post-title a {
 font-family: Zeyada, cursive;
 font-weight: normal; 
}
h1 { font-size: 2em; margin-top: 0px; }
h2 { font-size: 1.4em; font-weight: normal; }
h3 { font-size: 1.3em; }
h1, h2, h3, h4, h5, h6 {
	color: #633B51;
}
a  { color: #9399DA; }
.post  a,
.type-page a,
.post-data a {
	color: #336BA8;
}
.post a:hover,
.type-page a:hover,
.post-data a:hover  {
	color: #133E6D;
}
p a:hover,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
li a:hover,
span a:hover ,
a:hover  span,
.read-more a:hover,
.post-data a:hover,
a.textlink:hover {
	border-bottom: 1px solid #133E6D;
}


/* --- BRANDING ---------------------------- */

#logo { 
	padding: 0px 0px 40px; 
	width: calc(100% - 30px);
	text-align: center;
	background: url('images/name-small.png') no-repeat top left;
	background-size: contain;
	max-width: 423px;
	margin: 20px auto 0px;
	float: none;
}
.site-name { 
	overflow: hidden;
	padding: 0px;
	display: block;
	float: none;
}
#logo .site-name a, #logo .site-name a:hover {
	display: block;
	width: 100%;
	height: 0px;
	padding-top: 17.5%;
	border-bottom: none;
}
.home #logo {
	max-width: 565px;
	background-image: url('images/name-large.png');
}
.home #logo .site-name a {
	padding-top: 17.7%;
}
.site-description { display: none; }
.home .site-description {
	padding: 0px;
	background: url('images/site-description.png') no-repeat top left;
	background-size: contain;
	overflow: hidden;
	display: block;
	max-width: 565px;
	width: 100%;
	margin: 10px auto 0px;
	text-align: center;
}
.home .site-description span {
	display: block;
	width: 100%;
	height: 0px;
	padding-top: 3.6%;
	line-height: 150%;
}

/* --- NAVIGATION ---------------------------- */

.breadcrumb-list { font-size: 1em; }
.main-nav {
	padding: 5px 0px 25px;
	width: 100%;
	text-align: center;
}
.menu {
	background: transparent; 
	filter: none;
	text-align: center;
}
.menu > li a {
	background: rgba(13,13,13,0.6);
	color: #b2b2b2;
	font-size: 1.3em;
	line-height: 1.5em;
	font-weight: 300;
	padding: 0 0.4em 0.1em;
	text-shadow: none;
	border: 0px none;
	height: auto;
	border-bottom: 2px solid #131313;
}
.menu > li a:hover {
	color: #fff;
	background: rgba(13,13,13,0.6);
	filter: none;
	border-bottom: 2px solid #b2b2b2;
}
.menu > li,
.main-nav .menu > li:hover { 
	padding: 0px;
	background: transparent;
	margin: 0px 2px 0px 2px;
	display: inline-block;
	float: none;
}
.main-nav .menu > .current_page_item > a,
.main-nav .menu > .current-menu-item > a:hover,
.main-nav .menu > .current-page-parent > a,
.main-nav .menu > .current-page-parent > a:hover {
	color: #fff;
	margin: 0px;
	background: #131313;
	border-bottom: 2px solid #C51973;
}

/* --- SECOND-LEVEL NAV ---------------------------- */
.menu li ul { margin-top: -2px; }

.menu li li {
	background: #b7b1b0;
	border-color: #131313;
	text-align: left;
}
.menu li li a { 
	font-size: 1em;
	color: #131313;
}
.main-nav .menu li li a:hover { 
	color: #131313;
	background: #fff !important;
	margin-bottom: 0px; 
}

/* --- HOME PAGE CONTENT ---------------------------- */

#featured { background: transparent; }
.featured-title, .featured-subtitle, #featured p { /* display: none; */ }
#featured {
	border: none;
	padding: 15px;
	width: calc(100% - 30px);
}
.featured-title {
	font-size: 2em;
	color: #8C818D;
}
#featured p {
	max-width: 565px;
	font-size: 1.3em;
	font-weight: 200;
	line-height: 1.3em;
	padding: 0px;
	text-align: left;
	margin: 0 auto;
}
#featured-image { 
	max-width: 565px;
	border: 1px solid #A28CAF;
	display: block;
	padding: 3px;
	margin: 0px auto;
	}
#featured-image img {
	width: 100%;
	height: auto;
	}
#home-feature { 
	width: 100%;
	height: 50%;
	max-height: 350px;
	display: block;
	border: 0px none;
	background: #131313;
	}
.home #container { padding-bottom: 0px; }
.home-content-wrapper  {
	background: rgba(0,0,0,0.4);
	color: #fff;
	max-width: 960px;
	margin: 20px auto 0px; 
	padding: 0px 25px 0px;
}
.home-content-wrapper  h1 { color: #fff; }
.home-content-wrapper .grid { float: none; }
.home-content-wrapper #featured {
	background: none;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	}
.home-content-wrapper #featured p {
	font-size: 35px;
	line-height: 40px; 
}
.home #footer { display: none; }

/* --- PAGE CONTENT ---------------------------- */

#wrapper { 
	background-color: transparent;
	border: none; 
	margin: 10px auto 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	max-width: 730px;
	padding: 0px 15px;
	}
#content {
	margin-top: 0px;
	margin-bottom: 0px;
}
#content-full, #content-archive { 
	max-width: 730px;
	margin: 0px auto;
	float: none;
}
#content-archive {
	background-color: rgba(255,255,255,0.8);
	width: 100%;
	float: left; 
}
.type-page, .type-post {
	background-color: rgba(255,255,255,0.8);
	color: #111;
	padding: 20px;
	font-size: 1.1em;
}
#content-archive .type-post {
	background: transparent;
	padding-top: 0px;
}
.type-page h1,
.type-page h2,
.type-page h3,
.type-page h4,
.type-page h5,
.type-page h6 {
	color: #633B51;
}
.clearboth { clear: both; }

/* --- WIDGETS ---------------------------- */

#widgets {
 background-color: rgba(0,0,0,0.8);
 margin-top: 0px;
}
#content-blog.grid,
#content-blog.grid-right,
#widgets.grid,
#content.grid,
#widgets.grid-right,
#content.grid-right {
	margin-right: 0px;
	width: 100%;
}
.widget-wrapper { 
	border: none;
	background: none; 
	padding: 15px;
	margin: 0px;
}
.widget-title, .widget-title-home h3 {
	font-size: 1.1em;
	font-weight: bold;
	color: #777;
	padding-bottom: 5px;
}
#widgets ul, #widgets ol {
	margin-bottom: 0px;
}
#widgets ul li a:hover, #widgets a:hover { 
	color: #fff;
	border-bottom: 1px solid #fff;  
	margin-bottom: -1px; 
}
#widgets .flickrtagcloud a:hover, #widgets .tagcloud a:hover { 
	border: none; 
	text-decoration: none;  
	margin-bottom: 0px; 
	color: #000; 
	background: #b8bff8; 
}

/* --- BLOG CONTENT ---------------------------- */
h6.title-archive {
	font-size: 2em;
	margin: 0px;
	padding: 20px;
	font-weight: normal;
}
#content-blog { margin: 0px auto; }
#content-blog .post-title {
	margin-top: 0px; 
	font-size: 1.7em; 
}
#content-archive .post-title {
	font-size: 1.4em;
	margin-top: 0px;
}
#content-archive .read-more { clear: none; }
#content-archive .post-edit {
  margin: 1em 0 0px;
  padding: 0px 0px 1em;
  border-bottom: 1px dotted #131313;
}
#content-archive .post:last-child .post-edit { border-bottom: 0px none; }

#content-blog .post:first-child .post-title { font-size: 2em; margin-top: 0px; }
#content-blog .post { border-bottom: 1px dotted #131313; }
.post-meta, .post-data, .read-more, 
.comment-body .comment-meta a, .reply { font-size: 0.9em; }

.wp-caption p.wp-caption-text {
 font-size: 14px;
 padding: 10px 10px 0px;
 color: #444;
}


/* --- FORM ELEMENTS ---------------------------- */

select, option, button, a.button, input[type='reset'], input[type='button'], input[type='submit'],
button:hover, a.button:hover, input[type='reset']:hover, input[type='button']:hover, input[type='submit']:hover {
 font-family: 'Averia Serif Libre', Arial, sans-serif;
 font-weight: normal; 
 color: #000;
 font-size: 1em;
}
select {
  border-style: none;
  border-radius: 0px;
}

/* --- SPECIAL PAGE CONTENT ---------------------------- */

.post-432 {
    /* background-image: url('http://www.rebeccamays.co.uk/wp-content/uploads/2020/11/wreath_workshop.png'); */
    background-repeat: no-repeat;
    background-size: contain;
}

/* --- Contact ---------------------------- */
#contactTable {
 border: 0px none; 
}
#contactTable td, #contactTable th {
	text-align: left;
	vertical-align: top;
	border: 0px none;
	padding: 0px 0px 15px 0px; 
}
#contactTable th img { padding-bottom: 10px; }

/* --- Testimonials ---------------------------- */
.testimonial {
	font-size: 1.2em;
	}
.test-credit {
	font-size: 0.95em;
	padding-bottom: 20px;
	}

/* --- Flowers ---------------------------------------- */
.page-id-15 .type-page ,
.page-id-17 .type-page,
.page-id-20 .type-page { background: rgba(19,19,19,0.7); color: #b2b2b2; }
.page-id-15 h1,
.page-id-17 h1,
.page-id-20 h1 { color: #8C818D; }
.page-id-15 h2,
.page-id-17 h2,
.page-id-20 h2  { color: #b2b2b2; font-size: 1.8em; }

.flowers-panel { width: 50%; float: left; }
.flowers-panel h2 { font-size: 1.3em; line-height: 1.5em; text-align: center; margin-top: 5px; }
.flowers-panel a { padding: 10px; display: block; }
.flowers-panel img { width: 100%; }
	
/* --- Seasonal options ---------------------------- */

.season {
	clear: left;
	float: left;
	padding-bottom: 20px;
}
.season-text { 
	float: left;
	width: 60%;
}
.season-left {
	width: 40%;
	float: left;
}
.seasonal-list {
	margin: 0px 15px 0px 0px;
	padding: 0px;
	font-size: 1.4em;
	line-height: 1.1em;
	color: #888;
	list-style-type: none;
}
.seasonal-list  li { padding: 0px 0px 15px; }
.seasonal-list .note {
	white-space: nowrap;
	font-size: 0.8em;
}

/* --- Language of flowers ---------------------------- */

img.full-width { width: 100%; }
.msn-panel a  { display: block; width: 100%; text-align: center; padding-bottom: 10px; }
.msn-text {  
	width: 100%;
	color: #b2b2b2;
}
.msn-text, .msn-title, .msn-desc { float: left; clear: left; } 
.msn-title,
a:hover .msn-title {
	color: #8C818D;
	font-size: 1em;
	font-weight: bold;
	padding: 15px 15px 0px;
	text-transform: uppercase;
}
.msn-desc { padding: 5px 15px 10px; }

/* --- Links ---------------------------- */
.page-id-33 #wrapper { padding: 0 5px 20px 5px; }
.page-id-33 .type-page {
	padding: 20px 10px 0px;
}
.page-id-33 h1 { padding: 0px 10px; }
.link-container { width: 33.32%; float: left; }
.msn-box,
.link-box { padding: 5px 10px 10px; }
.msn-panel,
.link-panel { 
	display: block;
	width: 100%;
	padding-bottom: 10px;
	min-height: 200px;
}
.link-panel { border-bottom: 1px solid #e2e2e2; }
.msn-category,
.link-category { 
	font-size: 0.75em;
	text-transform: uppercase;
	font-weight: bold;
	color: #633B51;
}
.link-icon { width: 100%; height: auto; border: none; padding: 5px 0px 10px; }
.link-text { display: block; min-height: 4.1em; }
.link-title, a:hover .link-title { color: #444; border: none; font-size: 0.9em; }
.link-url { font-size: 0.9em; display: block; overflow: hidden; max-height: 1.5em; padding-bottom: 1px; }

/* --- TEMPORARY FONTS ---------------------------- */

/* main body text font */
body, p, div, li, td, th,
.menu li, .menu a, 
.widget-wrapper *, .post-meta, .read-more, .post-data,
.comment-author, .comment-meta, .reply , .menu li li a, .menu a,
select, option, button, a.button, input[type='reset'], input[type='button'], input[type='submit'],
button:hover, a.button:hover, input[type='reset']:hover, input[type='button']:hover, input[type='submit']:hover
{
	font-family: cardo, serif;
}
/* heading font */
#logo span, #logo span a,
h1, h1 a,
h2.post-title, h2.post-title a  {
	font-family: cardo, serif;
}

/* --- LIGHTBOX (OVERRIDE) ---------------------------- */

#imageDataContainer { font-size: 1em; }
#imageDataContainer #caption p { margin: 0.4em 0; }
#imageData #caption p:first-child { font-weight: normal; }
#imageData #numberDisplay { font-family: 'Averia Serif Libre', Arial, sans-serif; font-size: 0.9em; }


/* --- MOBILE NAVIGATION ---------------------------- */

.sb-selector:link, .sb-selector:visited, .sb-selector:hover, .sb-options a {
	font-size: 18px;
	font-weight: 300;
}
.sb-holder { background-color: rgb(189, 63, 179); }
ul.sb-option {
	-moz-box-shadow: 0px 10px 5px -5px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 10px 5px -5px rgba(0,0,0,0.2);
	box-shadow: 0px 10px 5px -5px rgba(0,0,0,0.2);	
}
select.tinynav1 { /* prevents this popping into view when the lightbox is closed */
	position: absolute;
	top: -9999px;
	width: 1px;
	height: 1px;
}

/* =Responsive (Mobile) Design
-------------------------------------------------------------- */
@media screen and (max-width: 1010px) and (min-width: 651px) {
	body  { padding-bottom: 0px; }
	#container, .home-content-wrapper { 
		padding: 0px; 
		margin: 0 auto;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	#footer { margin-top: 0px; }
	/* main navigation */
	.menu a { font-size: 1.5em; }
	/* content */
	h1 { font-size: 2.2em; }
	}
@media screen and (min-width: 651px) {
    .row {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      width: 100%;
    }

    .column {
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      flex-shrink: 1;
      flex-basis: 50%;
      box-sizing: border-box;
    }
    .column-1 { order: 1; padding-right: 30px; }
    .column-2 { order: 2; padding-top: 20px; }
    .column-1 p { margin-bottom: 0; }
}

@media screen and (max-width: 650px) {
	body  { background-image: none; padding-bottom: 0px; }
	#container, .home-content-wrapper { 
		padding: 0px; 
		margin: 0 auto;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	#footer { margin-top: 0px; }
	#logo { padding-bottom: 25px; text-align: left; }
	.site-name { font-size: 3.3em; }
	.home #logo { text-align: center; float: none; }
	.home .site-name { float: none; font-size: 4.5em; }
	.home .site-description { 
		font-size: 1.8em; 
		margin: 0 auto;
		float: none;
	}
	/* main navigation */
	.js .main-nav { font-family: zeyada; background: #303030; }
	.main-nav #responsive_current_menu_item,
	.js .main-nav #responsive_current_menu_item	{ 
		line-height: 100%;
		font-family: zeyada;
		font-size: 1.7em;
		font-weight: normal;
		padding: 0.3em 0.3em 0em;
	}
	.js .main-nav .menu { 
		-moz-box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.5);
		-webkit-box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.5);
		box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.5);
		background: #fff;
		font-size: 1.7em;
		top: auto;
	}
	.js .main-nav .menu li,
	.menu > li { 
		padding: 0em 0.3em 0em;
		border-bottom: 1px solid #303030;
		display: block;
		clear: left;
	}
	.main-nav .menu li a, .js .main-nav .menu li a { border: 0 none; padding: 0; font-size: inherit; }
	.js .main-nav .menu li.current_page_item, 
	.js .menu .current_page_item a, 
	.js .menu .current-menu-item a,
	.js .main-nav .menu li a:hover	{
		background: transparent !important; 
	}
	.js .main-nav .menu li:hover { background-color: #e2e2e2; }
	.sub-menu,
	.js .main-nav .menu li ul { 
		display: none; 
	}
	.js .main-nav .menu li li a { font-size: 0.5em; }
	/* content */
	h1 { font-size: 2.2em; }
	.link-container { width: 50%; }
	}
@media screen and (max-width: 480px) {
	/* content */
	.col-620 { margin-right: 0; width: 100%; }
	#widgets { clear: left; margin-top: 15px; width: 100%; }
	#content-blog .post:first-child .post-title { font-size: 1.7em; }
	}
@media screen and (max-width: 400px) {
	#logo { padding-bottom: 20px; }
	.site-name { font-size: 3.3em; float: none; }
	.site-name a { color: #fff; }
	.home .site-name { font-size: 4em; }
	.home .site-description { 
		font-size: 1.8em; 
		margin: 0 auto;
		color: #fff;
	}
	h1 { font-size: 1.7em; }
	.link-text  { min-height: 0; }
	.link-container { width: 100%; }
	}
@media screen and (max-width: 320px) and (min-width: 241px) {
	.site-name { font-size: 3em; }
	.home .site-description { font-size: 1.8em; }
	}
@media screen and (max-width: 240px) {
	.site-name { font-size: 2.2em; }
	.home .site-description { font-size: 1.6em; line-height: 1.2em; }
	}