﻿/*
Theme Name: CoffeeBeaned Spacious Child Theme
Theme URI: http://coffeebeaned.com/
Description: Child Theme for Spacious
Author: T
Author URI: http://coffeebeaned.com
Template: spacious
Version: 1.0
*/



.postid-633 .header-post-title-class {
	color: red;
	text-shadow: 0 0 10px red, 0 2px 0 #000;
}

/* Header */
.header-image {
	display:none;
}
.home .header-image {
	display:block;
}



#site-title, #site-title {
	padding-bottom: 0;
}

/* above header image */
#header-text-nav-container {
	box-shadow: 0 0 .8em .1em rgba(90,53,45, 0.8) inset;
	border-bottom: solid 1px #666;
}

/* Main Menu Full Screen */
/* Main Menu Full Screen */
.main-navigation a:hover,
.main-navigation ul li.current-menu-item a,
.main-navigation ul li:hover > a,
.main-navigation ul li.current_page_item a,
.main-navigation ul li.current-menu-item a:hover, 
.main-navigation ul li.current_page_item a:hover {
	color: #333 !important;
	background-color: #0aac8e !important;
}
.main-navigation ul li.current-menu-item ul li a,
.main-navigation ul li ul li.current-menu-item a,
.main-navigation ul li.current_page_item ul li a,
.main-navigation ul li:hover > a {
	color: #333 !important;
	background-color: #0aac8e !important;
}
.main-navigation {
	padding-top: 0;
	float:none;
}
.main-navigation a {
	color: #333;
	padding: 7px 7px 6px;
	height: 36px;
	line-height: 1.0;
}
p#site-description {
	margin-bottom: 5px;
	padding-left: 0;
	margin-left: 10px;
}
.main-navigation li {
	padding: 0 0 0 5px;
}
.main-navigation ul li a {
	border: solid 1px #FFF;
	border-radius: 4px;
	font-weight:500;
}
.main-navigation ul li a:hover {
	background-color: #0aac8e !important;
	color: #FFF !important;
	border-color: #777;
}
.main-navigation ul li ul {
	background-color: #FFF;
    background: #FFF;
    border-top: 1px solid #333 !important;
    top: 32px;
    left: 5px;
    width: 200px;
	box-shadow: -8px 10px 6px 1px #000, 8px 10px 6px 1px #000;
}
.main-navigation ul li ul li a {
 	font-weight:500;
 	color: #000;
}

/* added on update spacious 1.6.6 */
.main-navigation ul li ul, .main-navigation ul li:hover ul ul {
	display: none;
	z-index: 9999;
}
.main-navigation ul li:hover ul {
	display: block;
}
/* end */


.site-header .menu-toggle:hover {
	color: #000;
	font-weight: 500;
}
.current-menu-item a {
	color: #333 !important;
}
/* Small menu */
.main-small-navigation a {
	border-bottom: solid 1px #DDD;
}



/** Changes to fix Google isues 11-2020 **/

.main-small-navigation a {
	display: block;
	color: #FFFFFF;
	padding: 10px 40px 20px;
	text-decoration: none;
	font-size: 120%;
}
.main-small-navigation li {
	background: #3A3A3A;
	position: relative;
	padding-top:10px;
	padding-bottom: 0px;
}




/* Below Header Image */
.header-post-title-container {
    border-bottom: 1px solid #EAEAEA;
    padding: 20px 0;
    box-shadow: 0 0 30px 5px rgba(90, 53, 45, 0.5) inset;
}
.header-post-title-class {
	font-size: 2em;
}
a img:hover {
	opacity: 1.0;
	filter:alpha(opacity=99); /* For IE8 and earlier */
	box-shadow: #000 0 0 0;
}
/* Content Area */
.comment-content {
	background-color: #F0F0F0;
	border: 1px solid #EEE;
}
.comments-area .comment-edit-link, .comments-area .comment-permalink, .comments-area .comment-date-time, .comments-area .comment-author-link {
    display: inline-block;
    margin-left: 30px;
    color: #999999;
}
.post .entry-meta .by-author, .post .entry-meta .category {
	display: none;
}
/* Footer Stuff */
.footer-socket-area {
	color: #333;
	text-align: center;
	margin: 0 auto;
}
.footer-socket-wrapper {
	background-color: #EEE;
	border-top: solid 1px #CCC;
}


/* Bew is Mostly MY CSS for MY Content */
/* ======== My Tables Pages - CA,US,& UK  ========= */

/* The U.S. Table Page */
/* state CSS for US CA & UK pages */
.the-state-list {
	margin: 2em auto 1.7em auto;
	text-align: center;
	width: 100%;
}
.the-state-list div {
	border: 1px solid #000000;
	margin: 4px 3px;
	background: #FFF;
	padding: 4px 8px;
	display: inline-block;
	font-weight: 500;
	color: #000;
}
.the-state-list div:hover {
	background: #0aac8e;
	color: #FFF;
}

/* the table are for the US page only - 01-12-2017 */
.the-tables div {
	margin: 30px auto 40px auto;
	padding: 0;
	display: none;
	width: 100%;
	background-color: #F7F7F7;
	text-align: center;
	color: #000000;
}
.visibleClass{
	display: block !important;
	width: 100%;
	background-color: red;
}
.tablepress-table-name {
	margin-bottom: 10px !important;
	line-height: 1;
	font-size: 2.2em;
	text-transform: capitalize;
	text-align: center;
}
.tablepress-table-description {
	margin: 0.3em auto 0.9em auto; 
	font-size: 1.5em !important; 
	line-height: 1; 
	font-weight: 600;
	text-align: center;
}
.crl2 {
	font-size: 16px;
}
.crl2 .blue, a.blue {
	color: #2DABFF !important;
	background-color: transparent !important;
	background: transparent;
}
.crl2 .gray, .crl2 .closed, .gray, .closed {
	color: #999  !important;
	border: none !important;
	background-color: transparent !important;
}
.closed {background-color: transparent !important; color: #999 !important;}

@media screen and (max-width: 480px) {
    .tablepress-table-name {
        font-size: 1.4em !important;
        color: red;
    }
    .tablepress-table-description {
        font-size: 1.2em !important;
    }
    .the-tables div {
        width: 100%;
        padding: 0px;
    }
    .crl2 {
	font-size: 18px;
	}
	.site-title {
		font-size:1.4em;
		line-height: 1.4em;
	}
}
@media screen and (max-width: 700px) {
	.site-banner-header .highlight {
		font-size:0.7em;
		line-height: 0.7em;
	}
}
@media screen and (min-width: 1080px) {
	.the-tables div {
        width: 60%;
    }
    .crl2 {
	font-size: 18px;
	}
}

/* ===================================================== */

/* UK & CA list pages & Chains page */

/*   ----- START Roastery Location LIST  ----- */
#roastery-list {
	padding: 0 0 3em 0;
	margin: 0.3em auto 0.5em auto;
	width: 95%;
}
/*   ----- CRL = Coffee Roastery Location  ----- */
#state-index {
	width: 100%;
	padding: 0.5em 0;
	margin: 1.0em auto 1.4em auto;
	text-align: center;
	display: inline-block;
	position: relative;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-color: #333333;
	border-bottom-color: #333333;
}
#state-index a {
	padding: 0.1em 0.3em;
	margin: 0.2em 0.2em;
	font-size: 1.2em;
	text-decoration: none;
	text-transform: uppercase;
	color: #000000;
	text-align: center;
	border: 1px solid #999;
	line-height: 1.2em;
	position: relative;
	display: inline-block;
}
#state-index a:hover, .crl .locator:hover, .crl .chains:hover, .state a:hover, #roasters .crl:hover,  .crl:hover     {
	border: 1px solid #000;
	background-color: #0AAC8E;
	color: #FFF;
}
#roasters .crl a:hover {
	color: #FFF;
}
/*   ----- List Headers  ----- */
.each-state {
	width: 100%;
	margin: 0 auto 2px auto;
	position: relative;
}
.state {
	border-style: none none ridge none;
	border-width: 0 0 1px 0;
	margin: 1.2em auto;
	text-align: center;
	background-color: #FFF;
	padding-top: 0;
	border-bottom-color: #333;
font-weight: bold;
font-size: 1.4em;
line-height: 1.4em;
}
.state a {
	margin: 0 auto;
	border: 1px solid #000;
	font-size: 1.5em;
	padding: 0 0.5em;
	letter-spacing: 3px;
	text-align: center;
	color: #000;
	font-weight: bold;
	display: inline-block;
	position: relative;
	line-height: 1.5em;
}
.state .top-arrow {
	margin: 0 0 0 10px;
	padding: 0 1px 0 5px;
}
.center {
	display: inline-block;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	width: 100%;
}
.crl {
	margin: 5px 3px;
	border: 1px solid #333;
	padding: 0;
	text-align: left;
	display: inline-block;
	position: relative;
	width: 100%;
	max-width: 350px;
}
#chain .crl {
	height:3.7em;
}
.crl a {
	padding: 5px 0;
	color: #333;
	font-size: 1.1em;
	text-decoration: none;
	width: 100%;
	line-height: 1.23em;
	display: inline-block;
	margin:0 5px 0 10px;
}
.crl img {
	top: 1px;
	right: 1px;
	position: absolute;
	width: 56px;
	height: 56px;
}
.crl .locator, .crl .chains {
	margin: 0;
	width: 100%;
	line-height: 1.32em;
	padding: 3px 0 0 0;
	text-indent: 10px;
	border: 1px solid transparent;
}
.crl, .gray, .closed {
	margin: 4px 2px;
	border: 1px solid #333;
	padding: 0;
	text-align: left;
	display: inline-block;
	position: relative;
	width: 100%;
	max-width: 350px;
}
.crl a, .gray a, .closed a {
	padding: 5px 0;
	color: #333;
	font-size: 1.1em;
	text-decoration: none;
	width: 100%;
	line-height: 1.23em;
	display: inline-block;
	margin:0 5px 0 10px;
}
.crl .blue2, .blue2 {background-color: #C9E9FF; color: #C9E9FF !important; }
.crl .gray a, .crl .gray {background-color: #CCC;}
.closed {background-color: #555;}
.bull {
    width: 20px;
    height: 20px;
    border: 1px solid #000000;
    border-radius: 50%;
    float: left;
    margin:0 0.5em 0 0 !important;
}
.note {
	margin:0.5em 0 1em !important;	
}
.note p {padding:0 !important;  line-height: 1.4em !important;}

#header-logo-image {
	padding: 0 5px 0 0 !important;
	margin-top: -5px;
}
#header-text-nav-container {
	margin-top: -20px;
}

.footer-socket-wrapper .copyright {
	display:none;
}

.footer-socket-wrapper .my-copyright {
	display:block;
}

/* Narrow Spacing on Contact page */
input[type="text"], input[type="email"], input[type="password"], textarea {
	margin: 0 0 18px;
	background-color: #EEE;
}
.my-subtitle {
	font-size: 1.3em;
	text-decoration: underline;
	color: #0aac8e;
	margin-bottom: 1.3em;
}
.my-hr {
	width: 90%;
	border-color: #CCC;
	color: #999999;
	margin-top: 3em;
	margin-bottom: 3em;
}
.gray {
    color: #555 !important;
}

/* Yellow Block for Affiliate Support  */
.yellow-block {margin: 1em auto; width: 100%; text-align: center; background: linear-gradient(to bottom, #f0f9ff 0%,#cbebff 47%,#a1dbff 100%);}
.cb-support {margin: 1em auto; font-size: 1.0em !important; width: 100%; text-align: center; padding: 10px !important; color:#000 !important;}
.under-line {text-decoration: underline !important;}
/*  Ends  */

/*
.tablepress .sorting, .tablepress .sorting_asc, .tablepress .sorting_desc {
  padding-right: 16px !important;}
 */


/* This for Sate map index page only */

.tablepress .sorting, .tablepress .sorting_asc, .tablepress .sorting_desc {
  padding-right: 16px !important;}

.indicator span {margin-left: 8px;}
.indicator img {margin-bottom: 5px; margin-right: 7px;}
span.wpcf7-list-item{ display: block !important; width: 100%; }

.us-list {
  margin: 2em auto 1.7em auto;
  text-align: center;
  width: 100%;
  display: inline-block;
}
.us-list li {display: inline-block; text-align: center; margin: 0 auto; float: none !important;}
.us-list a {
  border: 1px solid #000000;
  margin: 4px 3px;
  background-color: #FFF;
  padding: 4px 8px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  display: inline-block;
}
.us-list a:link {
  background-color: #FFF;
  color: #000;
}
.us-list a:hover {
  background: #0aac8e;
  color: #FFF;
  text-decoration: underline;
}
.us-list a:visited {
  background-color: #6f4e37;
  color: #FFF;
}

/* for Table Selection JS is in Page.php */
 .zap {display: none;}

/* For Selectable Map Placement */
 .mapWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
    box-sizing: border-box;
}
#us-map {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
    margin: 0 auto;
}
.center-map {
	 margin: 0 auto 2em;
     text-align: center;
     width: 75%;
     border: solid 1px #CCC;
     padding: 3%;
}
@media only screen and (max-width: 721px) {
  .center-map {
     width: 85%;
  }
}
@media only screen and (max-width: 481px) {
  .center-map {
     width: 100%;
  }
  p {font-size:125%;}
}

/* try to Fix Google Small text Issue  11-2020 */
@media only screen and (max-width: 481px) {
  #cn-notice-text {font-size:125%;}
  #site-description {font-size: 125%;}
  .footer-widgets-wrapper li a {font-size: 125%;}
  .us-list li {margin: 6px;}
	.us-list a {font-size: 125%;}
}




#roastery-list {
	padding-bottom: 0; margin-bottom: 0;
}
.cb-support {
	margin-bottom: 0;
}
#content .page {
	padding-bottom: 0;
}
.us-list {
    margin: 0.5em auto 1.7em auto;
}
.centered {
	margin: -0.5em auto 1em; width: 100%; text-align: center;
}

/* === END US State Index === */

/* Google State Map placement */
.go-map {position: relative; padding-bottom: 56.25%; /* 16:9 */  padding-top: 25px; margin:3em auto; width: 100%; height: auto; max-width:1100px;}
.go-map iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#mapper {padding: 2px 5px 2px 9px; margin-bottom: 9px;}
.darrow {transform: rotate(90deg); display: inline-block;}
.uparrow {transform: rotate(-90deg); display: inline-block;}

.my-button {
	 border: solid 1px #0aac8e; padding: 3px; border-radius: 5px; margin:5px; line-height: 110%; display: inline-block;
}
.my-button:hover {
	border-color:#333; color: #fff; background-color: #0aac8e;
}
/* end Google map placment */


.promo-code-wrapper {
	width:100%;
	max-width: 250px;
	border: solid 1px #DDD;
	padding: 15px;
}
.promo-code-box {
	width: 90%;
	margin: 0 auto;
}

/* Amazon native ads single row */
.amazon-single {
	height: 360px;
	max-height: 360px;
	width: 100%;
	box-sizing: border-box;
	margin: 10px auto 10px;
	text-align: center !important;
	padding: 0 3% 12px; 
	background-color: #EEEEEE;
}
.aad {
	padding: 1px 10px;
	background-color: #EEE !important;
}
/* end Amazon single */

/* Remove Border on image Captions */
.post-content img, .wp-caption {
   border: none !important;
 }
 .wp-caption .wp-caption-text {
	font-weight: 600;
}
 /* END */
 .mez {text-align: center; margin: 2em auto; width: 100%; border-color: #FFF;}
 h4 {width:100%; margin: 0.5em auto 0;}
 
<!-- +++ MY ADD Ticker +++ -->
@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.ticker-wrap {
  width: 100%;
  overflow: hidden;
  height: 1.5rem;
  background-color: rgba(240, 240, 240, 0.7);
  padding-left: 100%;
  box-sizing: content-box;
  border-top: solid 1px #ddd;
  border-bottom: solid 1px #ccc;
}
.ticker-wrap .ticker {
  display: inline-block;
  height: 1.5rem;
  line-height: 1.5rem;
  white-space: nowrap;
  padding-right: 100%;
  box-sizing: content-box;
  animation: ticker 60s linear infinite;
  overflow: hidden;
}
.ticker-wrap .ticker-item {
  display: inline-block;
  padding: 0 4rem;
  font-size: 1rem;
  color: #0aac8e;
}
.amazon-ticker {
    text-align: left; margin: 0; line-height: 15px; padding: 0 5px 0 12px; margin-bottom: 0; width: 100%; background: rgba(0, 0, 0, 0.1); border-top: solid 1px #000;font-size: 10px; color: #888;
}
.ticker-box {
    width: 100%; overflow: hidden; height: 40px;
}
.ticker:hover{animation-play-state:paused; cursor: pointer;}
	.ticker a {padding: 0 10px;}

/* api stuff */

.amazon-products-container-search .amazon-product-container {border-bottom: 1px solid #999 !important;}


/* CSS for US map Page iFrame */
    .map-page-container {
      max-width: 1200px;
      margin: 0 auto;
    }

    .iframe-wrapper {
      max-width: 900px;
      margin: 0 auto;
    }

    .iframe-container {
      position: relative;
      width: 100%;
      padding-bottom: 56.25% !important;
      height: 0;
      overflow: hidden;
    }

    .iframe-container iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
.iframe-map-base {
	z-index: 2;
}
.iframe-map-top {
   	z-index: 10;
}
#state-index a:hover,
    #state-index a:visited { /* Apply the same style for visited links */
      border: 1px solid #000;
      background-color: #0AAC8E;
      color: #FFF;
    }
/* ============== */