/*
*
* General CSS Styles for Bean to Cup
*
*/


body p.back-to-parent {
	padding-top: 30px;
	margin-top: 50px;
	border-top: 1px solid #ddd;
}
.red-span a img{
	display:inline-block;
	height:30px;
	width: auto;
}
.red-span span{
	font-weight:bold;
	text-align:left;
	margin-right:60px;
}
.red-span{
	width:100%;
	text-align:right;
	padding: 6px 0;
	background-color:#a91e29;
	color:white;
}
.red-span a {
	display: inline-block;
	height: auto;
	overflow: hidden;
	position: relative;
	margin-left: 6px;
}
header#masthead{
	height:auto;
	display:inline-block;
	position: relative;
	width:100%;
	background-color:#1b1b1b !important;
	height:160px;
}
span.main-name.title{
	font-size:26px;
	font-weight:bold;
	font-family:inherit;
}
body * {
	box-sizing: border-box;
}
header .menu {
	margin: 0;
	padding: 0;
	width: auto;
}
header .menu > li.menu-item > ul.sub-menu {
	display: none;
	background-color: #fff;
	border: 1px solid #ddd;
	position: absolute;
	width: 180px;
	margin: 0;
	margin-top: 70px;
	height: auto;
	padding: 0;
	overflow: hidden;
	visibility: hidden;
}
ul.sm-icons a:hover{
	color:#333221;
	background-color:white; 
	border:2px solid #7d9700;
}
ul.sm-icons a{
	text-align:center;
	display:inline-block;
	color:white;
	background-color:#7d9700;
	padding:10px 20px;
	font-weight:bold;
	font-size:20px;
	text-decoration:none;
}
.row .sm-row{
	display:block;
	width:100%;
	margin:50px 0;
}
ul.sm-icons li#sm-icon{
	display:inline-block;
	width:100%;
	max-width:400px;
	padding:20px 40px;
	text-align:center;
	margin:0 auto;
}
ul.sm-icons li#sm-icon.trip {
	padding:10px 5px;
}
ul.sm-icons li#sm-icon img{
	height:150px;
	width:auto;
}
h2.roast{
	font-size:48px !important;
}
span.top-red img{
	height:50px;
	width:auto;
}
span.ready{
	color:white;
	display:block;
	text-align:center;
	margin:0 auto;
	width:100%;
	margin:20px 0 50px 0;
	font-weight:bold;
}
.row.trip a:hover,span.order-btn a:hover{
	opacity:0.8;
}
.row.trip a{
	color:white;
	background-color:#871821;
	font-size:30px;
	display:block;
	width:100%;
	padding:20px 30px;
	text-decoration:none;
	text-align:center;
	margin:20px 0;
	border-radius:10px;
	font-weight:bold;
}
.row.trip .leftside{
	min-height:400px;
}
span.order-btn a{
	color:white;
	background-color:#871821;
	font-size:30px;
	display:block;
	width:100%;
	padding:20px 30px;
	text-decoration:none;
	max-width:400px;
	margin:20px 0;
	border-radius:10px;
	font-weight:bold;	
}
span.baked{
	position:absolute;
	bottom:200px;
	width:100%;
	background-color:#1b1b1b;
	display:block;
}
span.baked p{
	color:white;
	font-size:24px;
	padding:0 100px;	
}
span.baked h2{
	margin-top:50px;
	color:white;
	font-size:30px;
	display:block;
	text-align:center;
	width:100%;
}
span.order-btn{
	display:block;
	text-align:center;
	justify-content:center;
	width:100%;
	margin-left:100px;
}
.row.contact .rightside img{
	margin-top:50px;
	margin-left:150px;	
}
.row.hours ul li{
	font-size:30px;
	color:#871821;
	font-weight:bold;
}
.row.hours ul{
	display:grid;
	grid-template-columns:auto auto auto auto auto auto auto;
	text-align:center;
}
span.baked{
	opacity: 0.7;
}
.row.trip .leftside img{
	margin-left:170px;
	margin-top:80px;
}
.row.trip{
	background-color:#efefef;
}
.row.trip .rightside h3{
	font-size:40px;
	text-align:center;
}
.row.trip .rightside p{
	font-size:22px;
	text-align:center;
	padding:20px 50px;
}
.row.trip .rightside h3,.row.trip .rightside p{
	color:#871821;
}
.row.contact .rightside{
	opacity:0.95;
}
.row.contact .leftside h4{
	font-size:40px;
	background-color:white;
	border-radius:10px;
	margin-left:100px;
}

.row.contact .leftside p,.row.contact .leftside h2{
	padding:0;
}
.row.contact .leftside{
	height:100% auto;
}
.page-id-188 h1.page-title{
	text-align:center;
	margin:50px 0;
	display:block;
	font-size:40px;
	color:#871821;
}

.row.contact{
	display:block;
	width:100%;	
}
span.welcome img{
	float:left;
	display:block;
	height:40px;
	width:80px;
	margin-right:20px;
}
span.ready h2{
	font-size:50px;
	margin-bottom:20px;
}
.row.order a.del-btn{
	display:inline-block;
	border-radius:3px;
	border:2px solid white;
	color:white;
	text-align:center;
	padding:10px 25px;
	font-size:28px;
	font-weight: bold;
	width: auto;
	text-decoration:none;
	background-color:#a91e29;
}
ul.bottom li.menu-item.phone:hover {
	opacity:1;
}
ul.bottom .menu-item.phone a{
	padding:10px 20px;
	font-weight:bold;
	text-decoration:none;
	display:block;
}
ul.bottom .menu-item.phone{
	position:absolute;
	right:60px;
	bottom:60px;
	background-color:#a91e29 !important;
}
.row.order{
	color:#a91e29;
	background-color: #fff;
	width:100%;
}
#topbar p {
	display: inline-block;
	margin: 0;
	padding-right: 20px;
	line-height: 28px;
	vertical-align: top;
}
body.home .row.roast ul.products > li.product a > h2{
		color:black;
}

.woocommerce-loop-product__title:nth-last-child(4){
		padding-top:-20px !important;
}
.row.roast ul.products > li.product {
		height:400px;
}
#page.site .row.order .sitewidth h2 {
	color: #a91e29;
}
footer#colophon li#footer-info > a{
	float:none !important;
}
span.phone{
	font-weight:bold;
	font-size:22px !important;
}
#colophon amp-img{
	float:none;
	padding-bottom:30px;
}
#colophon .sitewidth a{
	float:none;
}
ul.sm-icons{
	display:inline-block;
}
body.scrolled header .menu > li.menu-item > ul.sub-menu{
	margin-top: 60px;
}
header .menu > li.menu-item:hover > ul.sub-menu {
	display: block;
	visibility: visible;
}
header .menu > li.menu-item > ul.sub-menu > li.menu-item {
	display: block;
	clear: both;
	width: 100%;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #ddd;
}
.i-amphtml-notbuilt:not(.i-amphtml-layout-container){
	display:none;
	visibility:hidden;
}
.rightside a.del-btn{
	margin-right:50px;
}
.leftside a.del-btn{
	margin-left:50px;
}
span.head-review h4{
	font-size:24px;
}
span.head-review p,span.head-review h4{
	color:white;
	font-weight:bold;
	padding-left:60px;
}
span.head-review h2{
	padding-top:150px;
	color:white;
	padding-left:60px;
	font-size:40px;
	max-width:300px;
}
.row.roast .rightside img{
	height:350px;
	width:auto;
}
.row.qual h3,.header-latte h2.entry-title,.header-latte h4.name,.header-latte p{
	color:#333112 !important;
}
.overlay.header-latte{
	height:600px;
	width:40%;
	background-color:#dedede;
	opacity:0.85;
	margin-top: 0;
   padding-top: 0;
   position: absolute;
}
a.learn-btn:hover{
	color:#ccab4d !important;
	background-color:white;
	border:5px solid #ccab4d;
}
#con span{
	font-size:22px;
	font-weight:bold;
	padding:40px 0;
	text-align:center;
	margin:0 auto;
	color:#ccab4d;
}
a.learn-btn{
	color:white !important;
	background-color:#ccab4d;
	text-decoration:none !important;
	text-align:center;
	margin:0 auto;
	padding:40px 5px;
	font-weight:bold;
	border-radius:50%;
	margin-top:50px;
	margin-bottom:50px;	
}
.del-btn.leftside{
	margin-left:200px;
}
.row.latte .rightside h1{
	padding:30px 0;
	font-size:60px;
	max-width:300px;
}
.row.latte .rightside p.name{
	font-size:26px;
}
.row.latte .rightside h1{
	font-size:66px;
}
.trip-row{
	display:grid;
	grid-template-columns:22% 22% 22% 22%;
}
p.name,p.insta{
	text-align:right;
}
span.lattes{
	position:absolute;
	margin-left:80px;
	top:80px;
}
.row.latte .rightside h1{
	text-align:right;
}
.row.latte .rightside h1,.row.latte .rightside p{
	color:white;
}
.row.latte .leftside{
	width:60%;
	max-height:600px;
	opacity:0.7;	
}
.row.latte .rightside{
	background-color:#1b1b1b;
	height:600px;
	width:40%;
}
.row.latte .leftside img{
	width:100%;
	height:auto;
	background-size:cover;
	min-height:600px;
}
h2#under.wht{
	padding-left:150px;
	padding-right:150px;
}
.row.seo p.wht{
	padding-left:150px;
	padding-right:150px;
}
h2.spin.white{
	margin-left:20px;
}
.row.white{
	padding-top:20px;
	padding-bottom:20px;
}
.link-header h3{
	font-size:28px;
}
header .menu > li.menu-item > ul.sub-menu > li.menu-item > a {
	color: #777;
	line-height: 110%;
	padding: 8px 10px;
	text-align: left;
	display: block;
	height: auto;
	width: 100%;
}
.row.btn{
		padding:50px 0;
}
#carousel .slide-1,
#carousel .slide-2,
#carousel .slide-3 {
	height:100%;
	background-size:cover;
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.2), rgba(0,0,0,0.0) 70%, transparent);
	padding: 150px 0;
	display: block;
	height: auto;
	overflow: hidden;
	height: 650px;
	background-position:center center;
	background-repeat: no-repeat;
}
.slide-1 p,.slide-2 p,.slide-3 p{
	color:white;	
}
.micromodal-slide[aria-hidden="false"] .wfsmodal-container{
		margin-top:220px;
}
ul.maintain li#steps{
		color:white;
		font-weight:bold;
		padding:10px 0;
		font-size:18px;
		border-bottom:2px solid white;
		
}
ul.stars li i{
		color:white;
		display:inline-block;
}
ul.stars{
		display:inline-block;
}
ul.stars,ul.stars li {
		display:inline-block;
		width:auto;
		
		text-align:center;
		margin:0 auto;
		
		
}
span.roast h4{
		color:white;
		font-size:26px;
}
span.roast h2{
		color:white;
		font-size:56px;
		padding:0 0 50px 0;
		
}
span.roast{
		position:absolute;
		bottom:150px;
		text-align:center;
		margin:0 auto;
		width:100%;
		
}
ul.stars li.star i{
		height:50px;
		width:50px;
		display:inline-block;
		font-weight:bold;	
}
h2.spin{
	margin-bottom:20px;
	padding:0 !important;
	margin-top:0;
}
.row.qual li.lunch h4{
	text-align:center;
}

span.view-order a{
	color:white;
	font-size:18px;
	text-decoration:none;
	font-weight:bold;
}
span.view-order {
	width:100%;
	color:white;
	background-color: #a91e29;
	text-align:center;
	margin:0 auto;
	display: block;
	clear: both;
	float: none;
	margin: 0;
	position: relative;
	padding: 10px 0px;
}
.row.welcome .leftside{
	width:60%;
	
}
span.welcome{
	text-align:left;
}
.row.insta-main a:hover{
	opacity:0.7;
}
.row.insta-main a{
	font-size:16px;
	color:white;
	text-decoration:none;	
	text-align:center;	
	background-color:#408bd1;
	padding:10px 20px;
}
a.del-btn:hover{
		opacity:0.8;
}
.row.insta-main{
		display:block;
		width:100%;
		height:600px;
		background-size:cover;
		background-position:center center;
		text-align:center;
		margin:0 auto;
}
ul.sm-icons li.icon i{
		height:50px;
		width:50px;
		display:block;
}
ul.sm-icons{
		display:block;
		width:100%;
		text-align:center;
		z-index:-1;
		color:white;
}
span.welcome a{
		color:white;
		font-size:36px;
		text-decoration:none;
		font-weight:bold;
		display:inline-block;
		text-align:left;
		width:100%;
		padding:0 50px;
}
.row.welcome{
		display:block;
		position:relative;
		width:100%;
}
.row.welcome .rightside img{
		height:570px;
		width:100%;
}
.row.welcome .leftside p{	
	font-size:18px;
}
.row.welcome .leftside h2{
	font-size:46px;
}
.row.feed{
	height:auto;
	width:100%;
}
.row.welcome .leftside p{
	line-height:1.2;
}
.row.welcome .leftside h2,
.row.welcome .leftside p {
	display:block;
	width:100%;
	text-align:left;
	max-width:600px;
	color:#a91e29;
	padding:10px 80px 10px 50px;
	line-height:2;
}
.row ul.menu-list.bottom {
	margin-top: 0;
}
.row.welcome .rightside{
	width:40%;
	display:block;
	height:100%;
	background-size:cover;
	opacity:0.7;	
}
.row.qual li:hover{
	opacity:0.4;
	cursor:pointer;
}
.row.latte{
		margin-top:0;
}
.row.qual li.lunch img{
		width:450px;
		height:auto;
		border:2px solid white;
}
ul.menu-list {
		padding-inline-start:0;
}
ul.menu-list.bottom{
		display:grid;
		grid-template-columns:25% 25% 50%;
		margin-block-end:0;
}
li.mwc-foot{
		display:block;
		width:100% !important;
		text-align:center;
}
ul.menu-list.top{
		display:grid;
		grid-template-columns:50% 25% 25%;
		
		width:100%;
		justify-content:center;
		margin-top:0;
		margin-bottom:0;
}
.logo-head{
		background-color:#7d9700;
}
li.menu-item.order a{
		color:#871821;
		margin-top:0;
		padding-top:0;
		font-size:20px;
}
.menu-item.phone{
	background-color: #a91e29;
	border-radius:20px;
}
.menu-item.phone a{
	font-size:20px;
	color:white;	
}
li.menu-item.order{
	color:#871821;
	background-color:white;
}
h2.qual{
	color:#7d9700;
	font-family:'Raung Rivs';
}
h2#under{
	padding:30px;
	font-family:'Raung Rivs';
}
.row.seo p{
	color:white;
	font-size:22px;
	padding:0 80px;
	font-weight:bold;
}
.row.feed{
   padding: 50px 0;
   color: #fff;
   display: block;
   background-size:cover;
   background-repeat:no-repeat;
   overflow: hidden;
   /* background-image: url(/wp-content/uploads/2021/04/the-background-1304387_1280.png); */
   background-position: center center;
   background-attachment: fixed;
   height:auto;
   width:100%;

}
.row.sem{
		background-color: #1f70b0;
    padding: 50px 0;
    color: #fff;
    display: block;
    background-size:cover;
    background-repeat:no-repeat;
    overflow: hidden;
    /* background-image: url(/wp-content/uploads/2021/04/the-background-301145_1280.png); */
    background-position: center center;
    background-attachment: fixed;
    height:auto;
    width:100%;

}
.row.seo{
		background-color: #1f70b0;
    padding: 50px 0;
    color: #fff;
    display: block;
    background-size:cover;
    background-repeat:no-repeat;
    overflow: hidden;
    /*background-image: url(/wp-content/uploads/2021/04/the-background-1304387_1280.png); */
    background-position: center center;
    background-attachment: fixed;
    height:auto;
    width:100%;

}
.row.dev{
		background-color: #1f70b0;
    padding: 50px 0;
    color: #fff;
    display: block;
     background-size:cover;
    background-repeat:no-repeat;
    overflow: hidden;
    /* background-image: url(/wp-content/uploads/2021/04/the-background-301145_1280.png); */
    background-position: center center;
    background-attachment: fixed;
    height:auto;
    width:100%;

}
.row.plan{
		background-color: #1f70b0;
    padding: 50px 0;
    color: #fff;
    display: block;
    background-size:cover;
    background-repeat:no-repeat;
    overflow: hidden;
    /* background-image: url(/wp-content/uploads/2021/04/the-background-1304387_1280.png); */
    background-position: center center;
    background-attachment: fixed;
    height:auto;
    width:100%;

}
.row.design{
		background-color: #1f70b0;
    padding: 50px 0;
    color: #fff;
    display: block;
     background-size:cover;
    background-repeat:no-repeat;
    overflow: hidden;
    /* background-image: url(/wp-content/uploads/2021/04/the-background-301145_1280.png); */
    background-position: center center;
    background-attachment: fixed;
    height:auto;
    width:100%;
}
form#megaemailer-subscribe-form input{
	margin:10px 0;
	padding:10px ;
}
ul.maintain{
	display:block;
	list-style-type:circle;	
}
#carousel {
	display: block;
	background-image: url(/wd/wp-content/uploads/2021/05/btc-esp.jpg);
	background-size: auto 650px;
	background-repeat: no-repeat;
	background-attachment: fixed;
}
body {
	display:block;
	height:auto;
}
#menu-toggle {
	position: fixed;
	display: block;
	right: 20px;
	top: 20px;
	background-color: #000;
	color: #fff;
	font-weight: bold;
	width: 40px;
	height: 40px;
	line-height: 40px;
	z-index: 99999;
	padding: 9px;
	border-radius: 20px;
}
li.coffee a{
	color:#7d9700;
	background-color:white;
}
.row.roast ul.products {
	margin-top: 30px;
}
.row.roast ul.products > li.product {
	background-color: #fff;
	padding: 10px;
	margin-bottom: 0;
	text-align: center;
}
body.home .row.roast ul.products > li.product a > h2 {
	text-align: center;
}
.row.roast ul.products > li.product img {
	margin-bottom: 0;
}
.row.qual .sitewidth p {
	padding:20px 130px;
}
.row.roast .rightside {
	width:30%;
}
.row.roast .leftside {
	width:70%;
}
.row.roast span.bean {
	font-size:22px;
	font-weight:bold;
}
.row.roast li.coffee a {
	font-weight:bold;
	text-decoration:none;
}
.lower-view .more a#cater:hover {
	color:#333112;
	background-color:white;
}
.lower-view .more a#cater {
	width:50%;
	float:right;
	display:block;
	color:white;
	background-color:#333112;
	padding:10px 50px;
	font-weight:bold;
	font-size:22px;
	text-decoration:none;
}
.lower-view .more a#view:hover {
	border:solid #333112;
	border-width:0 3px 3px 0;
}
.lower-view .more a#view{
	width:50%;
	float:left;
	display:block;
	color:#7d9700;
	background-color:white;
	padding:10px 50px;
	font-weight:bold;
	font-size:22px;
	text-decoration:none;
}
.row.roast li.coffee{
	padding:15px;
	text-align:center;
}
.row.roast span.price{
	font-size:22px;
	font-weight:bold;
}

body .row.roast div.products.beans ul {
	width: 100%;
	max-width: 505px;
	display: grid;
	padding: 0;
	margin: 0;
	grid-template-columns: 250px 250px;
	column-gap: 5px;
	row-gap: 5px;
}
body .row.roast div.products.beans ul > li.product {
	background-color: #fff;
	display: block;
	width: 100%;
}
.row.roast div.products.beans ul > li span.bean  {
	font-size: 22px;
	text-align: center;
	display: block;
	clear: both;
	color: #1b1b1b;
	margin: 0 0 30px 0;
}
.row.roast div.products.beans ul > li span.price {
	font-size: 18px;
	text-align: center;
	display: block;
	clear: both;
	position: relative;
}
.row.roast h3{
	color:#333112;
	text-align:center;
}
.row.roast h2{
	color:white;
	text-align:center;
}
.row.roast a.buy:hover{
	color:#333112;
}
.row.roast a.buy{
	text-align:center;
	margin: 50px 0 0 0;
	background-color: #a91e29;
	color: #fff;
	font-size: 30px;
	max-width: 400px;
   padding: 10px 30px;
   float: none;
   clear: both;
   display: inline-block;
   font-weight: bold;
   text-decoration: none;
}
.row.roast {
	background-color:#e8e6bd;
	padding: 60px 0;
}

.row.roast .sitewidth{
	width: 90%;
	text-align:left;
	margin:0 auto;
}
.row.qual .sitewidth{
	text-align:center;
	margin:0 auto;
}
span.roast h2,span.roast h4{
	display:block;
	text-align:center;
	margin:0 auto;
	width:100%;
}
li.lunch h4{
	margin-top:280px;
	color:white;
	font-size:50px;
}
li.lunch{
	height:400px;
	background-size:cover;
	background-repeat:no-repeat;
}
body.page:not(.home) .row.mainimage {
	background-image: none;
	height: 350px;
	background-image: url(/wd/wp-content/uploads/2021/06/bean-to-cup_coffehouse_vernon-1024x576.jpg);
	background-position:center center;
	background-size: 100% auto;
}
body.home .row.mainimage {
	background-size:100%;
	height: 650px;
	display: block;
	background-position:center center;
}

body.home .foot-icon a.icon{
	color:#1f70b0;
	font-size:22px;
}
.foot-icon{
	display:inline-block;
	width:100%;
	text-align:center;
	font-size:20px;
	justify-content:center;
	margin-left:50px;
}
#colophon .sitewidth:first-child {
	border-top: 1px solid #fff;
	padding-top: 100px;
}
#colophon .sitewidth > a {
	color: #777;
	display: block;
	font-size: 20px;
	text-decoration: none;
	padding: 5px 10px;
	font-weight: bold;
	clear: both;
}
#colophon .sitewidth p.copyright {
	color: #777;
	text-align: center;
}
#colophon .sitewidth > amp-img {
	margin-top: 80px;
	width: 150px;
	height: 150px;
	display: block;
}
#colophon .sitewidth img {
	margin: 0;
	padding: 0;
	display: block;
	width: 150px;
	height: auto;
}
footer .menu {
	padding: 0;
	margin: 0 0 30px 0;
	width: auto;
	display: inline-block;
	width: 100%;
}
footer .menu > li.menu-item {
	font-size: 16px;
	color: #333;
	width: auto;
	
	margin-right: 50px;
	float: left;
}
footer#colophon .menu > li.menu-item > a {
	font-size: 16px;
	color: #333;
	margin-bottom: 10px;
}
footer .menu > li.menu-item ul.sub-menu {
	margin: 0;
	padding: 0;
	display: block;
	position: relative;
}
footer#colophon .menu > li.menu-item ul.sub-menu > li > a {
	font-size: 14px;
	color: #777;
	font-weight: 300;
}
#menu-toggle > span.bar {
	width: 100%;
	height: 2px;
	vertical-align: middle;
	background-color: #fff;
	display: block;
	margin: 4px auto;
	padding: 0;
	position: relative;
	clear: both;
}
ul,li{
	list-style-type:none;
	text-decoration:none;
}
nav.desktop ul.menu li{
	display:inline-block;
	float:none;
	text-decoration:none;
}

.row.test{
	background-color:#f1f1f1;
}
ul.thirds h3{
	text-align:center;
}

nav.desktop ul.menu li a{
	display: block;
   margin: 0;
   padding: 0 10px;
   line-height: 40px;
   min-height: 40px;
   color: #aaa;
   font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    position: relative;
    text-transform: uppercase;
    float:right;
    text-decoration:none;
}
.client > amp-img {

	display: block;
}
nav.desktop {
	display: inline-block;
   width: 50%;
   float: right;
   clear: right;
}
#footer-widgets img{
	height:120px;
}
header#masthead #site-title {
   margin: 0;
   padding: 0;
   font-weight: bold;
   color: #333;
   border: 0;
   float:none;
   display:block;
}
.hover-text{
	max-width:50%;
}
.fs-row a,.fs-row p.price{
		margin:10px 0;
}
body.logged-in #topbar {
	top: 32px;
}
#topbar .menu {
	color: #fff;
	font-weight: bold;
}
footer{
	padding: 50px 0 0 0;
   background-color: #124064;
   bottom: 0;
   display: block;
   height: auto;
   overflow: hidden;
}
#page {
	display: block;
	clear: both;
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	height: auto;
	overflow: hidden;
}
#home1.full {
    /* background-image: url(/wp-content/uploads/2021/02/pexels-thijs-van-der-weide-876453.jpg); */
    background-size: 100% auto;
    background-position: center center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 50px 0;
    display: block;
    float: left;
    width: 100%;
    height: auto;
    overflow: hidden;
}
ul.thirds > li:first-child {
    clear: left;
}
ul.thirds > li > a > img {
    display: block;
    width: 100%;
    margin: 0 20px;
    max-height:200px;
}
ul.thirds {
    display: inline-block;
    clear: both;
    position: relative;
    margin: 30px 0;
    padding: 0;
    float: none;
}
#website-setup {
    padding-top: 50px;
}
 ul.thirds > li {
    display: inline-block;
    clear: none;
    float: left;
    width: 30%;
    padding: 0;
    position: relative;
    text-align: left;
    margin:0 5px;
    
}
.thin{
	
		    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    float: none;
    display: block;
    clear: both;
    padding: 0;
    font-size: 1.2em;
}
}
ul.thirds > li {
    display: inline-block;
    clear: none;
    float: left;
    width: 33%;
    padding: 0;
    position: relative;
    text-align: left;
    margin:0 auto;
}
body .full {
    width: 100%;
    margin: 0;
    padding: 0;
    min-height: 150px;
    background-color: #f1f1f1;
}
.sitewidth {
	width: 94%;
	box-sizing: border-box;
	padding: 0 20px;
	display: block;
}
footer {
	font-size: 0.8em;
}
.thin.compat p{
		font-size:22px;
}
.thin.help{
		padding:40px 0;
}
.thin.setup li a{
		
}
.thin.setup a.read-more {
    display: inline-block;
    clear: both;
    text-decoration:none;
    width: auto;
    text-align:center;
    background-color: #fff;
    padding: 10px 15px;
    position: relative;
    font-size: 18px;
    font-weight: bold;
    margin-left:60px;
    color: #5DA1CD;
    box-shadow: 3px 3px 5px rgb(0 0 0 / 60%);
    border-bottom: 4px solid #5DA1CD;
}
.thin.help a.read-more,.thin.compat a.read-more {
    display: inline-block;
    clear: both;
    text-decoration:none;
    width: auto;
    background-color: #fff;
    padding: 10px 15px;
    position: relative;
    font-size: 22px;
    font-weight: bold;
    margin-left: 15px;
    color: #5DA1CD;
    
}
ul.port li#client:hover{
	background-color: #d9dcea;




}
ul.port li#client img{
		max-height:200px;
		background-position:center center;
		justify-content:center;
		position:relative;
		width:100%;
		text-align:center;
}
ul.port h4{
		text-align:center;
}
ul.port{
		display:grid !important;
		grid-template-columns:21% 21% 21% 21%;
		max-width:1000px !important;
		grid-column-gap:5%;
		grid-row-gap:50px;
}
label megaemailer_subscriber-email{
		margin-right:40px;
}
.row.test h2.entry-title {
	margin-bottom: 0;
}
.thin.compat p{
		color:black;
		background-color:white;
		text-shadow:1px 1px 1px rgb(0 0 0 / 50%);
		padding:20px 0;
}
.thin.compat h2{
		color:white;
		text-shadow:1px 1px 1px rgb(0 0 0 / 50%);
}

section.grid.quarters .quarter {
	background-color: #fff;
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	padding: 20px;
	display: inline-block;
	font-size: 20px;
}
.menu-header-menu-container ul{
		    margin: 0;
    padding: 0;
    display: block;
}
.menu-header-menu-container{
		    display: inline-block;
    height: 80px;
    width: auto;
    float: right;
    clear: right;
    background-color: rgba(0,0,0,0.5);
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 20px;
}
.menu-header-menu-container ul li{
		    display: inline-block;
    margin: 0;
    padding: 0;
    height: 50px;
    overflow: visible;
}
span.copyright{
		float:right !important;
		clear:right;
		background-color:#124064;
		width:100%;
		display:block;
}
#footer-widgets ul li a{
		color:white;
		text-decoration:none;
}
#footer-widgets h3{
		display:block;
		font-size:26px;
}
#footer-widgets ul{
		display:inline-block;
		font-size:26px;
}
#footer-widgets {
    padding-bottom: 10px;
    padding-right: 20px;
    margin: 10px auto;
    text-align: center;
    display: inline-block;
    height: auto;
    overflow: hidden;
    width: 92%;
    
}
#page .site-content-contain {
	
}
.menu-header-menu-container ul li a {
    display: block;
    margin: 0;
    padding: 0 10px;
    line-height: 40px;
    min-height: 40px;
    color: #aaa;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 1px;
    position: relative;
    font-family: Arial, sans-serif;
    text-transform: uppercase;
}

img{
		background-size:cover;
		background-position:center center;
}
#carousel h1.main-title {
	position: relative;
	margin-top: 50px;
	text-align: left;
	width: 100%;
	font-size: 48px;
	display: block;
	padding: 0;
}
#subscribe ul{
	list-style-type: disc;
}
#subscribe ul li {
	text-align: left;
	display: list-item;
}
body.page #primary main .entry-content {
	
}
.row.test h3 {
	color: #999;
	font-weight: 300;
}
body.blog a.post {
	display: block;
	width: 100%;
	margin: 0 auto 20px auto;
	padding: 0;
	height: 350px;
	box-shadow: none;
	overflow: hidden;
	text-decoration: none;
	background-color: #333;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
body.blog a.post .shadow {
	float: left;
	width: 100%;
	padding: 40px;
	height: 350px;
	display: block;
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.6), rgba(0,0,0,0.2));
	transition: all 0.3s ease;
}
body.blog a.post:hover .shadow {
	background-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0.6));
}
body.blog a.post h3.entry-title {
	color: #fff;
	font-size: 32px;
	margin-top: 10px;
	text-shadow: 0 0 5px rgba(0,0,0,0.6);
	margin-bottom: 0;
}
body.blog a.post .meta {
	color: #000;
	display: inline-block;
	clear: both;
	height: 30px;
	line-height: 30px;
	width: auto;
	margin-top: 10px;
	font-size: 12px;
	background-color: #fff;
	padding: 0px 8px;
	border-radius: 8px;
	display: none;
	visibility: hidden;
}
body.blog .thecontent {
	color: #fff;
	padding-top: 30px;
	font-size: 18px;
}
.row.connectivity .rightside,
.review.hide-review {
	display: none;
	visibility: hidden;
}
body *:selected,
body *:active,
body *:focus,
body * {
	outline: 0;
}
.row p {
	color: #333122;
	font-weight:bold;
	line-height: 140%;
}
.row .blue p {
	color: #fff;
}
body.home .blog-post {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border-left: 2px solid #2babfd;
	transition: all 0.3s ease;
	min-height: 250px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

body.home .blog-post .shadow {
	display: block;
	color: #fff;
	text-decoration: none;
	padding-right: 70px;
	transition: all 0.3s ease;
}
#carousel .next-slide,
#carousel .prev-slide {
	top: 40%;
	position: absolute;
	z-index: 999;
	display: block;
	left: 10px;
}
#carousel .next-slide{
	right: 10px;
	left: auto;
}
body.home .blog-post .shadow h3 {
	text-decoration: none;
	box-shadow: none;
	font-size: 26px;
	text-align: left;
	margin-top: 0;
	margin-bottom: 0;
}
body.home #blog .blog-post .shadow .meta {
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
}
body.home .blog-post:first-child .shadow h3 {
	font-size: 32px;
}
.code-packages {

}
.code-packages ul {
	margin: 0;
	padding: 0;
	display: block;
	width: 100%;
	position: relative;
	text-align: center;
}
.code-packages ul li {
	width: auto;
	display: inline-block;
	max-width: 80px;
}
.row.test .review {
	width: 100%;
	display: block;
	position: relative;
	margin-bottom: 20px;
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 0 0 3px rgba(0,0,0,0.6);
	color: #777;
	margin-top: 20px;
	padding: 10px;
	text-align: left;
}
.row.test .review h4 {
	text-align: left;
	margin: 0;
	display: inline-block;
	float: left;
	width: 100%;
	clear: right;
}
.row.test .review span.name-icon.leftside {
	color: #fff;
	text-transform: uppercase;
	font-size: 30px;
	width: 48px;
	display: inline-block;
	height: 48px;
	float: left;
	clear: left;
	padding: 0;
	border: 0;
	border-radius: 24px;
	margin-right: 10px;
	background-color: #9970ff;
	text-align: center;
	line-height: 48px;
} 
.row.test .review .stars {
	float: left;
	clear: left;
	position: relative;
	display: inline-block;
	margin: 0 10px 0 0;
	padding: 0;
}
.row.test .review p {
	display: block;
	clear: both;
	text-align: left;
	font-size: 13px;
	color: #777;
}
.row.test .review span.time {
	font-size: 13px;
	color: #999;
	margin-left: 20px;
}
header.review-header {
	display: block;
	clear: both;
	margin-bottom: 10px;
	width: 100%;
	float: none;
	height: auto;
	overflow: hidden;
}
.row.test .box > h3 {
	margin-top: 0;
}
.row.test .box > p {
	margin-bottom: 0;
}
.row.test .box .code-packages,
.row.test .leftside > .box {
	padding-bottom: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #fff;
}
.row.test .leftside > .box:last-child {
	border-bottom: 0;
	padding-bottom: 0;
	margin-bottom: 0;
}
.row.test header.review-header .leftside {
	width: auto;
	float: left;
	margin-top: 0;
	margin-bottom: 0;
	clear: left;
}
.sitewidth{
	padding:0;
}
.row.test header.review-header .rightside {
	width: auto;
	float: left;
	max-width: 100%;
	min-width: 70%;
	margin-top: 6px;
	margin-bottom: 0;
	display: inline-block;
}
body .entry-content p,
body .entry-content ul li,
body .entry-content ol li {
	line-height: 140%;
	color: #777;
}
body .row .sitewidth > h2 {
	text-align: center;
}
body .row.order .sitewidth h2 {
	color: #fff;
	margin-top: 0;
}
body .row.order {
	padding: 40px 0;
}
.row.qual ul.menu-list li h4 {
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.8) 70%, transparent 100%);
	margin-top: 0;
	padding: 50px;
	text-align: left;
	margin-bottom: 0;
	display: block;
	font-weight: bold;
	font-family: 'Montserrat', Arial, sans-serif;
}
body.home .row.qual ul.menu-list li a,
body.home .row.qual ul.menu-list li a h4 {
	text-decoration: none !important;
}
.row.qual ul.menu-list li:hover {
	opacity: 1;
}
.row.qual ul.menu-list li:hover h4 {
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.3) 70%, transparent 100%);
	transition: all 0.2s ease;
}
.row.welcome {
	
}
body {
	font-family: 'Montserrat', Arial, sans-serif;
}
body.single-product div.single-product {
	padding-top: 50px;
}
span.stars {
	background-image: url(/wd/wp-content/themes/BeanToCup2021/icons/star.svg);
	background-repeat: repeat-x;
	background-size: 30px auto;
	display: block;
	margin-right: 0;
	float: right;
	clear: both;
	height: 30px;
	width: 150px;
}
.row.latte .rightside {
	padding-bottom: 100px;
}
.row.latte .rightside h1 {
	float: right;
	clear: right;
	margin-top: 0;
	margin-bottom: 0;
}
.row.latte span.lattes > * {
	display: block;
	float: right;
	clear: right;
}
body.woocommerce .quantity .qty {
	font-size: 22px;
	font-family: 'Montserrat', Arial, sans-serif;
	line-height: 46px;
	height: 46px;
	border-radius: 0;
	border: 1px solid #d1d1d1;
}
body.woocommerce div.single-product .summary form button.single_add_to_cart_button,
body.single-product div.single-product .product_type_simple.add_to_cart_button,
body.woocommerce-checkout .woocommerce form button.button {
	height: 46px;
	line-height: 46px;
	padding-top: 0;
	font-size: 18px;
	color: #fff;
	padding-bottom: 0;
	border-radius: 0;
	background-color: #a91e29;
	text-transform: uppercase;
}
body.single-product div.single-product .product_type_simple.add_to_cart_button  {
	font-size: 14px;
}
body.single-product ul.products li.product{
	text-align: center;
}
body.single-product ul.products li.product h2 {
	color: #1d1d1d;
	text-align: center;
}
body.single-product ul.products li.product img {
	margin-bottom: 0;
}

@media (max-width:650px){
	img#mobile-logo{
		height:60px;
		top:0;
		display:block;	
		text-align:center;
		float:none;
	}
	.site-branding a img {
		height:60px;
		display:inline-block;
	}
	span.baked h2{
			margin-top:50px;
			padding:50px 0 0 0;
	}
	body.home .row.mainimage{
			max-height:500px;
			background-repeat:no-repeat;
			background-size:cover;
			height:auto;
	}
	span.baked p{
			padding:20px 10px;
	}
span.baked{
		position:relative;
		bottom:0;
		opacity:0.7;
}
	ul.maintain{
			padding:0 50px;
	}
	ul.top-red{
			display:grid;
			grid-template-columns:30% 30% 30%;
	}
	
	h2.roast{
			font-size:20px;
	}
	.del-btn.leftside{
			margin-left:0;
	}
	.foot-icon{
			margin-left:10px;
}
	.foot-icon a{
			display:block;
			width:100%;
			font-size:20px;
			color:#871821;
			border:2px solid #871821;
			background-color:white;
			text-decoration:none;
			margin:10px 0;
			font-weight:bold;
			padding:20px;
			border-radius:10px;
	}
	span.main-name.title{
			width:100%;
			display:inline-block;
	}
	span.roast{
			position:relative;
			bottom:0;
	}
.site-branding{
		text-align:center;
		width:100%;
}
	header#masthead #site-title{
			width:100%;
			display:inline-block;
			color:#871821;
	}
	.row.contact{
			background-position:top center;
	}
	.row.hours ul li{
			padding:20px 0;
	}
	.row.hours ul {
			grid-template-columns:auto;
			padding-inline-start:0;
	}
	.row.trip .rightside h3{
			padding:10px 30px;
	}
	.row.trip .leftside img{
			margin-left:0;
	}
.row.contact .rightside img{
		margin-top:0;
		margin-left:0;
		padding:10px 20px;
}
	span.order-btn{
			margin-left:0;
	}
	.row.contact .leftside p, .row.contact .leftside h2{
			padding:10px 20px;
	}
	.row.contact .leftside h4{
			margin-left:0;
			width:auto;
	}
	ul.menu-list li{
			margin:5px 0;
	}
	.row.insta-main a{
			font-size:18px;
	}
	.row.welcome .rightside{
			width:100%;
	}
	.row.welcome{
		height:auto;
	}
	.row.welcome .leftside h2, .row.welcome .leftside p{
		text-align:center;
		display:block;
	}
	span.welcome{
			position:relative;
			bottom:0;
			margin-left:0;
			width:auto;
	}
	.row.welcome .leftside{
			width:100%;
			height:auto;
	}
	.red-span a img{
			display:inline-block;
	}
	span.roast h2{
			font-size:44px;
	}
	span.roast{
			bottom:0;
			margin-top:80px;
			display:block;
	}
	.row.latte .rightside,.row.latte .leftside{
			width:100%;
	}
	ul.menu-list.bottom,ul.menu-list.top{
			grid-template-columns:100%;
	}
	.rightside,.leftside{
			width:100% !important;
			float:none;
	}
	.link-header h3{
		margin-top:140px;
}
	header .menu > li.menu-item > ul.sub-menu{
			background-color:transparent;
			position:relative;
			margin-top:0;
			width:auto;
	}
	.childpages > a .shadow{
			width:100%;
	}
	h2#under.wht{
		padding:20px;
		font-size:20px;
	}
	.link-header h3{
			font-size:32px;
	}
	.childpages > a{
			width:100%;
			padding:0;
			margin:10px 0;
	}
	.home #carousel .slide-1{
			height:auto !important;
			padding:20px 0;
	}
	ul.port li#client h4{
			width:100%;
			text-align:center;
			display:block;
	}
	ul.port li#client img{
			max-width:200px;
			margin-left:70px;
	}
	ul.port{
			grid-template-columns:100%;
			grid-row-gap:20px;
			display:block;
			margin-left:0;
			padding-left:0;
	}
	.row.seo p.wht{
		color:white;
		font-size:18px;
		padding:20px;
		font-weight:bold;
	}
	ul.port li{
			width:100%;
			border:2px solid #777;
	}
	.row.btn{
			padding:50px 0 40px 0;
	}
	.row.white{
			padding-top:20px;
			padding-bottom:20px;
	}
	#mobile-info h2{
		font-size:18px;
	}
	.site-info {
    	float:none;
    	display: block;
    
	}
	footer .menu > li.menu-item a{
		margin:8px 0;
	}
	footer .menu > li.menu-item {
    	font-size: 16px;
    	color: #333;
    	width:100%;
    	max-width:100%;
    	margin-right: 0;
    	float: none;
    
	}
	body.home .blog-post:first-child .shadow h3{
		padding:20px;
		font-size:26px;
	}
	ul.thirds{
		padding-inline-start:0;
	}

	ul.thirds li{
		width:100%;
	}
	h4.fname{
		margin:0 0 20px 0;
	}
	.review p{
		margin:20px 0;
		font-size:16px;
	}
	.review{
		display:block;
		width:100%;
		height:auto;
	}
	a.read-more{
		margin:20px 0;
		font-size:16px;
	}
	header#masthead{
		background-color:transparent;
	}
	.mobile#mobile#info{
		font-size:16px;
		background-color:transparent !important;
	}
	ul.thirds > li > a > img{
		margin:0;
	}
	body .row.test .sitewidth {
		margin: 0;
		padding: 0;
		width: 100%;
		max-width: 100%;	
	}
	body .row.test .rightside .box {
		padding: 30px;
		border-top: 1px dashed #ccc;	
	}
	body .row.test .rightside .box:first-child {
		background-color: #2bacff;
	}
	body .row.test .rightside .box:last-child {
		background-color: #4d4d4d;	
	}
	body .row.test .leftside .box {
		padding: 30px;
		margin: 0;	
	}
	body .row.test .rightside h3{
		font-weight: bold;
		font-size: 32px;	
	}
	body .row.test .rightside h3,
	body .row.test .rightside p {
		color: #fff;	
	}
	body .row.test .rightside p{
		text-transform: uppercase;	
	}
	body .row.test .rightside .code-packages {
		border-bottom: 0;
		margin-bottom: 0;
		padding-bottom: 0;	
	}
	.code-packages ul {
		grid-template-columns: 30% 30% 30%;
		column-gap: 5%;
		display: grid !important;	
	}
	.code-packages ul > li {
		display: block;
		width: auto;
		max-width: 100%;	
	}
	body .row.test .leftside > .box:last-child {
		padding-bottom: 30px;
	}
	body.menu-open nav.desktop ul.menu  {
		padding-top: 80px;
		display: block;
		margin: 0 auto;
		float: none;
	}
	body.menu-open nav.desktop ul.menu > li.menu-item {
		display: block;
		clear: both;
		margin: 0;
		padding: 0;
		position: relative;
		max-width: 100%;
		width: 100%;	
	}
	body.menu-open nav.desktop ul.menu > li.menu-item a {
		color: #fff;
		font-size: 22px;
		padding: 20px 10px;
		line-height: 110%;
		display: block;
		text-align: left;
		margin: 0;
			
	}
	footer ul.menu {
		margin: 0 auto;
		float: none;
		clear: both;
		max-width: 150px;
		display: block;
		padding: 0;	
	}
	footer ul.menu > li{
		margin-bottom: 15px;	
	}
	footer ul.menu > li > a {
		font-size: 22px;
		text-transform: none;
		text-decoration: none;
		font-weight: bold;	
	}
	footer#colophon {
		padding-top: 0;	
	}
	body.home .blog-post{
		margin-bottom: 20px;	
		min-height: 100px;
		padding: 20px;
	}
	body.home .blog-post:first-child {
		min-height: 250px;
		padding: 0;	
	}
}
@media All and (max-width: 1000px) {
	/* Mobile Styles - less than 1000px! */
	.desktop {
		display: none !important;
		visibility: hidden !important;	
	}
	body nav.desktop {
		opacity: 0;
		top: -1000px;
		position: fixed;
		background-color: #000;
		transition: all 0.3s ease;	
	}
	body.menu-open nav.desktop {
		display: block !important;
		visibility: visible !important;
		opacity: 1;	
		top: 0;
		left: 0;
		width: 100%;
		min-height: 300px;
		z-index: 99999;
	}	
	body.menu-open div#menu-toggle {
		background-color: #fff;	
	}
	body div#menu-toggle > span {
		transition: all 0.3s ease;
	}
	body.menu-open div#menu-toggle > span {
		background-color: #000;	
	} 
	body.menu-open div#menu-toggle > span:nth-child(2) {
		opacity: 0;	
	}
	body.menu-open div#menu-toggle > span:first-child {
		margin: 0 auto;
		margin-top: 9px;
		height: 5px;
		transform: rotate(-45deg);
	}
	body.menu-open div#menu-toggle > span:last-child {
		transform: rotate(45deg);	
		margin: 0 auto;
		height: 5px;
		margin-top: -14px;
	}
}
@media (max-width:900px){
		header#masthead #site-title{
				color:white;
		}
		header#masthead #site-title span.main-name{
				font-size:24px;
		}
		header #site-branding #mobile-info h2{
				margin-top:50px;
		}
		#mobile-info p{
				font-size:16px;
		}
		.row.mainimage span.roast h2.entry-title.roast,.row.mainimage span.roast h2.entry-title{
				font-size:36px !important;
				
		}
		.row.order ul.order {
			width: 100%;
			margin: 0;
			text-align: center;		
		}
		.row.order ul.order li{
				margin:10px auto;
				float: none;
				display: inline-block;
		}
		.row.order ul.order li a {
			margin: 0 auto;
			float: none;		
		} 
		ul.bottom .menu-item.phone{
				position:relative;
				right:0;
				bottom:0;
		}
		body.home h2.woocommerce-loop-product__title{
				color:black;
		}
		li.product a.button{
				position:absolute;
				bottom:0;
		}
		li.product{
				height:300px;
				margin:10px 0;
				padding:10px;
		}
		span.stars{
				margin:0 auto;
		}
		span.lattes{
				position:relative;
				margin-left:0;
		}
		.row.latte .rightside h1{
				text-align:center;
				margin-block-start:0;
				margin-block-end:0;
		}
		.site-branding{
				padding:0;
		}
		body.page:not(.home) .row.mainimage{
				background-repeat: no-repeat;
				
		}
		.row.welcome .leftside.bean{
				margin-left:10px;
		}
		.row.welcome .leftside.bean h2, .row.welcome .leftside.bean p{
				padding:0;
		}
		.row.welcome .leftside h2, .row.welcome .leftside p{
				max-width:100%;
		}
		.row.latte span.lattes > *{
				float:none;
				clear:none;
				margin:0 auto;
				text-align:center;
		}
		.row.trip .leftside img{
				margin-top:30px;
				position: absolute;
    left: 0;
		}
		.row.trip .rightside h3{
				padding:10px;
				margin-block-start:0;
				margin-block-end:0;
		}
		.row.contact .leftside h4{
				padding:0;
				margin:20px 0;
		}
		.page-id-188 h1.page-title{
				margin:0;
		}
		#mobile-info a{
				font-size:26px;
		}
		.woocommerce-Price-amount.amount bdi{
				margin-top:20px;
		}
		.woocommerce-Price-amount.amount{
				font-size:22px;
				padding:10px 0;
		}
		.wfs-food-item-summery{
				text-align:right;
		}
		img.wfs-lazy-load{
				width:330px !important;
		}
		body.home .row.mainimage{
				min-height:350px;
		}
		.row.trip .leftside{
				min-height:360px;
		}
		.row.trip .rightside p{
				padding:0 10px;
		}
		.row.trip a,span.order-btn a{
				max-width:300px;
				margin-left:30px;
		}
		.row.contact .leftside p{
				font-size:26px;
		}
		.row.contact{
				text-align:center;
		}
		.site-branding #site-logo{
				display:block;
				height:150px;
				width:auto;
				margin:0 auto;
				text-align:center;
		}
		span.roast{
				margin-top:0;
		}
		.row.roast a.buy,ul.bottom .menu-item.phone a{
				margin:0 auto;
				text-align:center;
				display:block;
		}
		.row.qual ul.menu-list li h4{
				text-align:center;
		}
		.row.order ul.order{
				display:block;
				margin:0 auto;
				text-align:center;
				padding-inline-start:20px;
		}
		.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
				padding:10px 20px;
				margin:0 auto;
				display:block;
				text-align;center;
		}

}
@media All and (min-width: 650px) {
	.row.welcome {
		background-size: 50% auto; 
		background-repeat: no-repeat; 
		background-position: top right;
	}
	.mw-head{
		float:left;
		clear:left;
		width:50%;
	}
	body .site-branding {
		padding-top: 0;
		height:100px;
		padding-bottom: 10px;	
	}
	.rightside{
		float:right;
		clear:right;
		width:50%;
	}
	.leftside{
		width:50%;
		float:left;
		clear:left;
	}
	
	.row.roast .leftside {
		text-align: left;	
	}
	.row.roast .leftside h2{
		font-size: 42px;	
	}
	.row.roast .leftside h2,
	.row.roast .leftside h3 {
		text-align: left;
		color: #1b1b1b;
		margin-top: 0;
		margin-bottom: 0;	
	}
	.row.roast div.products.beans ul {
		margin: 30px 0;
		padding: 0;
		max-width: 505px;
		display: grid;
		grid-template-columns: 250px 250px;
		column-gap: 5px;
		row-gap: 5px;
		width: 100%;	
	}
	.row.roast div.products.beans ul li.coffee {
		border: 1px solid #fff;
		transition: all 0.3s ease;
	}
	.row.roast div.products.beans ul li.coffee:hover {
		border: 1px solid	#1b1b1b;
	}
	#carousel {
		background-size: cover;	
	}
	body.home .row.welcome .leftside {
		padding-bottom: 60px;
		padding-top:100px;	
		width: 59.5%;
	}
	.row.latte .lattes p {
		margin-bottom: 0;	
	}
	body .red-span a img {
		width: auto;
		height: 24px;
		margin: 0;
		padding: 0;
		display: block;
	}
	#page.site .row.order .sitewidth h2{
			padding-left:50px;
	}
	.row.order p{
			max-width:600px;
			padding: 10px 80px 10px 50px;
line-height: 2;
	}
	body.blog a.post {
		width: 48%;	
		display: block;
		float: left;
		text-align: left;
		margin-bottom: 40px;
		background-size: cover cover;
	}
	body.blog a.post:nth-child(3),
	body.blog a.post:nth-child(5),
	body.blog a.post:nth-child(7),
	body.blog a.post:nth-child(9) {
		float: right;
		clear: right;
			
	}
	body.blog a.post.large-photo {
		width: 100%;
		float: left;	
	}
	body span.view-order {
		height: 0;
		padding: 5px 0;
		z-index: 99;	
	}
	body span.view-order > a {
		background-color: #a91e29;
		display: inline-block;
		float: none;
		margin: 0 auto;
		color: #fff;
		padding: 20px 40px;
		line-height: 60px;
		margin-top: -60px;
		z-index: 9999999; 
		font-size: 24px;
		font-family: 'Montserrat', Arial, sans-serif;	
	}
	ul.menu-list.bottom li.lunch:nth-child(3) > h4,
	ul.menu-list.bottom li.lunch > a {
		bottom: 0;
		position: absolute;
		z-index: 1;
		width: 50%;
		background-image: linear-gradient(to bottom, transparent, rgba(0,0,0,0.8));
	}
	
	ul.menu-list > li.lunch > a {
	 	height: 400px;	
	 	display:block;
	 	width: 100%;
	 	z-index: 2;
	}
	body .row.qual ul.menu-list.bottom li.lunch > a {
		width: 25%;	
		background-image: linear-gradient(to bottom, transparent, rgba(0,0,0,0.8));
	}
	body .row.qual ul.menu-list.bottom li.lunch > a {
		height: 400px;
		position: relative;
		z-index: 1;
		display: block;
		width: 100%;
	}
	body .row.qual ul.menu-list.bottom li.lunch > a > h4 {
		bottom: 0;
		position: absolute;	
	}
	body .row.qual ul.menu-list.bottom li.lunch:hover > a,
	ul.menu-list.bottom li.lunch:nth-child(3):hover > h4 {
		background-image: none;	
	}
	body .row.qual ul.menu-list.bottom li.lunch > a > h4 {
		background-image: none;	
	}
	body .row.qual ul.menu-list.bottom li.lunch  h4 {
		text-shadow: 0 0 15px rgba(0,0,0,0.6);
		line-height: 105%;	
	}
	.row.latte .leftside {
		min-height: 600px;
		width: 30%;	
	}
	.row.latte .rightside {
		background-color: transparent;
		background-image: url(/wd/wp-content/uploads/2021/06/latte-overlay-beantocup-1.svg);
		background-repeat: no-repeat;		
		background-size: 100% auto;
		width: 50%;
	}
	.row.latte {
		background-color: transparent;
		background-size: 70% auto;
		background-position: center left;
		background-repeat: no-repeat;	
	}
	.row.latte span.lattes {
		margin: 0 auto;
		float: none;
		width: 30%;
		margin-right: 30%;
		margin-left: 10%;	
	}
	nav.desktop ul.menu li a {
		color: #fff;	
		transition: all 0.3s ease;
	}
	nav.desktop ul.menu > li > ul.sub-menu > li:hover > a {
		color: #000;
		display: block;
		padding-left: 15px;
	}
	footer ul.menu li a {
		transition: all 0.3s ease;	
	}
	footer#colophon ul.menu > li.menu-item {
		width: 160px;	
	}
	footer#colophon ul.menu > li.menu-item > a::after {
		content: '';
		width: 4px;
		height: 2px;
		background-color: #777;
		display: block;
		margin-top: 12px;
		margin-left: 4px;
		transition: all 0.2s ease;
	}
	footer#colophon ul.menu > li.menu-item:hover > a::after{
		background-color: #000;
		width: 15px;
		margin-left: 10px;
	}
	footer ul.sub-menu li,
	footer ul.sub-menu li a {
		display: block;
		width: 100%;	
	}
	body footer#colophon ul.menu > li ul.sub-menu li:hover > a {
		padding-left: 5px;
		color: #2babfd;	
	}
	body .row.connectivity {
		padding: 0;
		height: 600px;
	}
	body .row.connectivity .leftside {
		padding: 100px 40px 100px 40px;
		height: 600px;
		z-index: 999;
		position: relative;
	}
	a.section-link {
		float: right;
		clear: right;
		display: inline-block;
		width: auto;
		padding: 10px 15px;
		color: #1f70b0;
		font-size: 16px;
		text-transform: uppercase;	
	}
	#blog .sitewidth > h3 {
		margin-top: 0;	
		text-align: left;
	}
	body .row.connectivity .shadow {
		display: block;
		width: 100%;
		position: absolute;
		height: 600px;
		z-index: 1;
		background-color: rgba(0,0,0,0.2);	
	}
	body .row.connectivity .leftside p {
		color: #fff;
		font-size: 22px;	
	}
	body #colophon .sitewidth > a {
		float: left;	
		clear: none;
	}
	#colophon .sitewidth > amp-img {
		margin-top: 0;	
	}
	body #colophon .sitewidth > a {
		vertical-align: bottom;	
		font-size: 14px;
		font-weight: 300;
	}
	.row.connectivity p.button.white > a {
		font-size: 24px;
		background-color: #ccc20c;
		background-image: linear-gradient(to right, #ccc20c, #af5b66);
		border: 0;	
	}
	nav.desktop ul.menu li.order {
		border-radius: 20px;	
	}
	nav.desktop ul.menu li.order a {
		color: #871821;
		text-transform: none;	
	}
	nav.desktop ul.menu li a {
		font-size: 24px;	
	}
	body .sitewidth {
		width: 90%;
		max-width: 1250px;
		margin: 0 auto;
		float: none;
		position: relative;
		display: block;	
	}
	nav.desktop ul.menu{
		margin: 0;
   	padding: 0;
   	display: inline-block;
   	float:right;
  		position: relative;
	}
	nav.desktop ul.menu li.burger > a > img {
		width: 22px;
		vertical-align: middle;
		height: 22px;
	}
	#site-logo {
    	display: inline-block;
    	float: left;
    	clear: left;
    	margin-top: 0px;
    	height: 50px;
    	width: auto;
    	position: relative; 
	} 
	.site-branding > a {
		display: block;
		float: left;
		clear: left;
		width: auto;
		height: 50px;
		margin-top: 20px;
		position: relative;	
		margin-right: 15px;
	}
	.site-branding > #site-title > span {
		clear: both;
		float: left;
	}
	#site-title span.main-name.title {
		font-size: 32px;
		font-weight: bold;	
	}
	.site-branding > a > img,
	.site-branding > a > ampimg {
		width: 150px;
		height: 50px;
		max-height: 50px;
		display: block;	
	}
	body header#masthead nav.desktop {
		padding-top: 40px;
	}
	body.scrolled header#masthead {
		height: 90px;
		transition: all 0.3s ease;	
	}
	body.scrolled header#masthead #site-title {
		color: #fff;
		padding-top: 10px;	
	}
	body.scrolled header#masthead #topbar {
		margin-top: -40px;
		transition: all 0.3s ease;	
	}
	body.scrolled .site-branding {
		height: auto;
		max-height: 80px;	
	}
	body.scrolled header#masthead nav.desktop {
		padding-top: 25px;
	}
	body.scrolled .site-branding > a {
		margin-top: 0;	
	}
	body header#masthead nav.desktop li.phone a {
		color: #fff;
		letter-spacing: 0;	
	}
	span.roast h2, 
	span.roast h4 {
		padding-bottom: 0;
	}
	span.roast h2 {
		font-size: 48px;	
	}
	span.roast h2.roast {
		font-size: 28px;	
	}
	ul.order{	
		width: 100%;
		text-align: center;
		padding: 0;
		margin-bottom: 0;
	} 
}

@media All and (min-width: 1001px) {
	/* Laptop & Desktop Styling Only */
	.mobile {
		display: none !important;
		visibility: hidden !important;	
	}
	nav.desktop {
		margin-top: 0px;
	}
	nav.desktop ul.menu li {
		margin-left: 10px;	
	}
	nav.desktop ul.menu li a {
		margin: 0;
		padding: 0 10px;
		line-height: 40px;
		height: 40px;
	}
	nav.desktop ul.menu li.burger {
		background-color: #a91e29;
		color: #fff;
		width: 40px;
		padding: 0;
		height: 40px;
		border-radius: 20px;
		text-align: center;
		line-height: 40px;	
	}
	nav.desktop ul.menu li.burger > a {
		margin: 0;
		padding: 0;
		width: 100%;
		display: block;	
	}
	nav.desktop ul.menu li.burger > a > img {
		width: 22px;
		height: 22px;
	}
	body.scrolled header#masthead{
		box-shadow: 0 0 3px rgba(0,0,0,0.5);	
	}
	ul.order li{
		padding:10px;
		display:inline-block;
		border-radius:2px;
	}
	body header#masthead #site-title {
		float: left;
		padding-top: 30px;
		color: #fff;
		cursor:pointer;
		display: inline-block;
		text-align: left;
		font-size: 16px;	
		text-transform: uppercase;
	}
	.site-branding > a > img {
		width: 60px;
		height: 60px;
		display: block;	
	}
	#carousel .car-text {
		max-width: 1000px;
		width: 94%;
		margin: 0 auto;
		display: block;
		float: none;
		clear: both;	
	}
	#carousel .car-text > *,
	#carousel h1.main-title {
		width: 50%;
		float: right;
		clear: both;	
	}
	#carousel h1.main-title {
		color: #fff;
		text-shadow: 1px 1px 2px rgba(0,0,0,0.5);	
	}
	body.scrolled header#masthead {
		position: fixed;
		animation: headerSlideDown 0.5s ease;
		top: 0;
		left: 0;
		background-color: rgba(255,255,255,1);
		width: 100%;	
	}
	body.scrolled header#masthead:hover {
		background-color: rgba(255,255,255,1.0);
		background-image: none;
		box-shadow: 0 0 3px rgba(0,0,0,0.5);	
	}
	body.scrolled header#masthead nav ul li a {
		color: #777;
		font-weight: 300;
	}
	body.home .blog-post:first-child {
		width: 50%;
		float: left;
		clear: left;
		height: 400px;
	}
	body.home .blog-post:first-child .shadow {
		height: 400px;	
	}
	body.home .blog-post:nth-child(2),
	body.home .blog-post:nth-child(3) {
		height: 190px;
		min-height: 190px;
		float: right;
		width: 48%;
		clear: right;
		margin-bottom: 20px;	
	}
	body.home .blog-post:nth-child(2) .shadow,
	body.home .blog-post:nth-child(3) .shadow {
		height: 190px;
	}
	body.home .blog-post:nth-child(3) {
		margin-bottom: 0;	
	}
	body.home .blog-post .shadow {
		padding: 30px;
		color: #fff;
		background-image: linear-gradient(to bottom right, rgba(0,0,0,0.7), transparent);	
	}
	.row.test .leftside {
		width: 40%;
		padding-right: 5%;
		margin-right: 5%;
		float: left;
		clear: left;
		display: inline-block;
		margin-top: 30px;
		margin-bottom: 30px;	
		border-right: 1px solid #fff;
	}
	.row.test .rightside {
		margin-top: 30px;
		margin-bottom: 30px;	
	}
}

@media (min-width:768px) and (max-width:1024px){
		footer ul.menu {
				display:grid !important;
				grid-template-columns:45% 45%;
				width:100%;
				grid-column-gap:5%;
				margin-left:50px;
				min-width:750px;
		}
		footer#colophon ul.menu > li.menu-item{
				width:auto !important;
				padding:20px 0;
		}
		footer li#footer-info.mwc-foot{
				width:500px !important;
				text-align:center;
				float:none;
				margin:0 auto;
				margin-left:230px;
				max-width:100%;
		}
		header .site-branding ul.menu li a{
				font-size:40px;
				padding:40px 0;
		}
		.row.test .review{
				width:85%;
		}
		.code-packages ul li{
				
		}
		body .row.test{
				background-image: linear-gradient(to right, #555 0%, #555 45%, #4d4d4d 45%, #4d4d4d 100%);
		}
		.code-packages ul{
				display:grid !important;
				grid-template-columns:30% 30% 30%;
				grid-column-gap:5%;
		}
		body .row.subscribe-email {
    background-image: linear-gradient(to bottom right, #61717d 0%, #2bacff 80% );
    padding-bottom: 20px;
}
		.row.white p{
				font-size:18px;
				padding:0 40px;
		}
		header .site-branding ul.menu{
				width:100%;
				
		}
}
.apps {
	display: grid;
	grid-template-columns: auto auto auto;
}

.apps amp-img {
	display:grid-item;
}

ul.processors {
	display:grid;
	grid-template-columns: auto auto auto;
}
@media (min-width:768px) and (max-width:1024px){
		.row.mainimage{
					background-repeat:no-repeat;
					height:500px;
				}
				ul.menu-list.top,ul.menu-list.bottom{
						grid-template-columns:100%;
				}
				.row.order{
						display:block;
						text-align:center;
				}
				.row.hours ul.hours{
						grid-template-columns:100%;
				}
				.row.trip .leftside img{
						display:block;
						width:400px;
						height:auto;
						margin-left:180px;
						
				}
				ul.hours li.hour.right{
						display:block;
						width:50%;
						float:right;
						clear:right;
				}
				ul.hours li.hour.left{
						display:block;
						width:50%;
						float:left;
						clear:left;
				}
				.row.welcome p{
						font-size:20px;
						text-align:center;
				}
				.row.contact .rightside img{
						margin-left:40px;
						width:700px;
						height:auto;
				}
				.row.contact .leftside h4{
						margin-left:0;
				}
				span.order-btn{
						margin-left:180px;
				}
				.leftside,.rightside{
						display:block;
						width:100% !important;
						float:none;
						clear:none;
				}
				.row.contact{
						text-align:center;
				}
}
body #b2c-messages {
	z-index: 999999999999;
}
body nav.desktop {
	display: block !important;
	visibility: visible !important;
}