/*
Theme Name: The Orchard Tea Garden – Child 2018/2022
Theme URI: https://wordpress.org/themes/twentyseventeen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
Version: 1.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/



@font-face {
    font-family: Avenir;
    src: url(/wp-content/themes/OTG/fonts/Avenir-Medium.otf); 
} 

@font-face {
    font-family: Avenir-Light;
    src: url(/wp-content/themes/OTG/fonts/Avenir-Light.otf); 
} 

@font-face {
    font-family: Poppins-Bold;
    src: url(/wp-content/themes/OTG/fonts/Poppins-SemiBold.ttf); 
} 





html {
}

body {
	margin: 0;
    font-family: Avenir-Light;
    font-weight: normal;
	font-style: normal;
	font-size: 18px;
	line-height: 150%;
	background-color: #FFF;
	color: #022D16;
	letter-spacing: 0.5px;
}

p {
	font-size: 18px;
	line-height: 150%;
	margin: 0;
    font-family: Avenir-Light;
    font-weight: normal;
	font-style: normal;
	color: #022D16;
	letter-spacing: 0.5px;
}

p a {
}

a {
	text-decoration: none;
}

p.gold {
	color: #9F8F6B;
}

.white {
	color: #FFF;
}

h1, h2, h3, h4, h5, h6 {
	color: #022D16;
    font-family: Avenir;
} 

h1 {
    font-weight: normal;
	font-style: normal;
	padding: 0;
	margin: 0;
	font-size: 60px;
	line-height: 120%;
}

h2 {
    font-weight: normal;
	font-style: normal;	
	padding: 0;
	margin: 0;
	font-size: 40px;
	line-height: 130%;
}

h3 {
    font-weight: normal;
	font-style: normal;    
	padding: 0;
	margin: 0;
	font-size: 28px;
	line-height: 140%;
}

h3.gold {
	color: #9F8F6B;
}

h4 {
    font-weight: normal;
	font-style: normal;    
	padding: 0;
	margin: 0;
	font-size: 25px;
	line-height: 140%;
}

h5 {
    font-weight: normal;
	font-style: normal;    
	padding: 0;
	margin: 0;
	font-size: 20px;
	line-height: 140%;
}

#wrapper {
    margin: 0;
	float: left;
	width: 100%;
	position: relative;
	overflow: hidden;
}

#fixie {
    margin: 0 auto;
}

#header {
	height: 120px;
	z-index: 888;
	width: 90%;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
    padding: 0 5% 0;
    float: left;
	position: fixed;
	text-align: center;
	margin-top: 0;
	background-color: #FFF;
}

#logo {
	height: 110px;
	width: 250px;
	margin-top: 5px;
	display: inline-block;
	background-image: url("/wp-content/themes/OTG/images/OTG-Logo-New.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

.woocommerce #logo {
}

#logo img {
	height: auto;
	width: 100%;
	float: left; 
}

#bag {
	height: 40px;
	width: 50px;
	display: inline-block;
	background-image: url("/wp-content/themes/OTG/images/bag-green.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right center;
	position: absolute;
	top: 40px;
	right: 5%;
}

#bag a {
	color: #FFF;
	position: absolute;
	font-size: 16px !important;
	right: 7px;
	top: 12px !important;
	width: 26px;
	text-align: center;
    font-family: Avenir;
	color: #022D16;
}

#bag.log {
	display: none;
}

#scroll {
	position: fixed;
	top: 82.5vh;
	z-index: 666;
	color: #FFF;
	width: 100%;
	text-align: center;
	opacity: 1;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
	font-size: 90%;
}

#content {
    background-color: #FFF;
    float: left;
	width: 100%;
	height: auto;
	position: relative;
	z-index: 1;
	margin-top: 120px;
}

#access {
	height: 120px;
	width: auto;
	float: right;
	line-height: 120px;
    padding: 0;
    margin: 0;
}

#access ul li {
	list-style: none;
	float: left;
    padding: 0;
    margin: 0;
	line-height: 120px;
	height: 120px;
}

#access ul li a {
	line-height: 120px;
	text-decoration: none;
	margin: 0 0 0 40px;
    padding: 0;
    color: #FFF;
	float: left;
	transition-property: all;
	transition-duration: .55s; 
	transition-timing-function: ease-in-out;
	font-size: 23px;
}

#access ul li a:hover {
	color: rgb(8,189,113);
}







#panel {
	padding: 10vh 5%;
	width: 90%;
	height: auto;
	float: left;
    background-color: #FFF;
	position: relative;
}

#panel.feature {
	padding: 0 5%;
	width: 90%;
}

#panel.scroll {
	padding: 10vh 0;
	width: 100%;
	text-align: center;
}

#panel.center {
	padding: 10vh 20%;
	width: 60%;
	text-align: center;
}

#panel.green {
	background-color: #022D16;
}

#button {
	background-color: transparent;
	display: inline-block;
	margin-top: 50px;
	padding: 14px 30px 12px;
	border-radius: 30px;
    font-family: Avenir;
	color: #022D16;
	font-size: 80%;
	line-height: 100%;
	text-transform: uppercase;
	border: 1.5px solid #9F8F6B;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
	cursor: pointer;
}

#button:hover {
	background-color: #9F8F6B;
	color: #FFF;
}

#button.white {
	color: #FFF;
}

a.button {
	background-color: transparent;
	display: inline-block;
	padding: 12px 25px 10px;
	border-radius: 30px;
	margin-top: 10px;
    font-family: Avenir;
	color: #022D16;
	font-size: 80%;
	line-height: 100%;
	text-transform: uppercase !important;
	border: 1.5px solid #9F8F6B;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
	cursor: pointer;
}

#scroller {
	width: 100%;
	padding: 0 0;
	white-space: nowrap;
	margin: 5vh 0 0 0;
	overflow-x: scroll /* Hide horizontal scrollbar */;
	overflow-y: hidden /* Hide vertical scrollbar */;
	-webkit-overflow-scrolling: touch;
	float: left;
}

/* Hide scrollbar for Chrome, Safari and Opera */
#scroller::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
#scroller {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

#feature {
	width: 47%;
	height: 400px;
	float: left;
	margin: 1.5%;
	position: relative;
	overflow: hidden;
}

#feature-overlay {
	width: 100%;
	height: 400px;
	position: absolute;
	background-image: linear-gradient(0deg, rgba(0,0,0,0.2), rgba(0,0,0,0.6));
	display: table;
	text-align: center;
	z-index: 222;
}

#feature-overlay h2 {
	display: table-cell;
	vertical-align: middle;
	color: #FFF;
}

#feature img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	float: left;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

#feature:hover img {
	transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

#ad {
	width: 100%;
	height: auto;
	float: left;
	position: relative;
	background-color: #022D16;
	margin-top: 1.5%;
}

#ad-image {
	width: 50%;
	min-height: 400px;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
	background-color: #0F0;
	position: absolute;
	float: left;
}

#ad-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	float: left;
}

#ad-text {
	width: 40%;
	height: auto;
	display: inline-block;
	vertical-align: middle;
	padding: 15vh 5%;
	margin-left: 50%;
	text-align: center;
}

#ad-text h4 {
	color: #FFF;
}

#ad-text p {
	color: #9F8F6B;
}

#panel-image {
	width: 100%;
	height: auto;
	float: left;
	background-image: url("/wp-content/uploads/2022/11/OTG-Rupert-Robin.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

#panel-image-text {
	width: 45%;
	padding: 15vh 0 15vh 5%;
	background-image: linear-gradient(-90deg, rgba(0,0,0,0), rgba(0,0,0,0.6));
}

#panel-image-text h3 {
	color: #FFF;
}

#item {
	width: 300px;
	white-space: normal;
	padding-right: 2.5%;
	display: inline-block;
	vertical-align: top;
	text-align: left;
}

#item-image {
	width: 300px;
	height: 400px;
	float: left;
	margin-bottom: 20px;
}

#item-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	float: left;
}




#image-wrapper {
	width: 100%;
	height: 50vh;
	float: left;
	position: relative;
}

#image-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

#image-wrapper-overlay {
	background-image: linear-gradient(0deg, rgba(0,0,0,0), rgba(0,0,0,0.6));
	position: absolute;
	top: 0;
	width: 100%;
	height: 50vh;
	z-index: 222;
	display: table;
	text-align: center;
}

#image-wrapper-overlay h2 {
	color: #FFF;
}

#page {
	padding: 10vh 20%;
	width: 60%;
	float: left;
}

#page img {
	width: 100%;
	height: auto;
	float: left;
	padding: 10px 0 40px;
}

#page h3 {
	border-top: 1.5px solid #9F8F6B;
	border-bottom: 1.5px solid #9F8F6B;
	padding: 20px 0;
	margin: 20px 0;
}

#page h3 em {
    font-family: Avenir;
	font-weight: normal;
	font-style: normal;
	float: right;
	font-size: 80%;
}

#page h3 a {
	color: #9F8F6B;
}

#page h4 {
	padding: 15px 10% 0 0;
	font-size: 110%;
}

#page h4 em {
    font-family: Avenir-Light;
	font-weight: normal;
	font-style: normal;
	float: right;
	margin-right: -10%;
	font-size: 80%;
}

#page p {
	font-size: 90%;
	padding: 0 10% 5px 0;
}

#page p strong {
    font-family: Avenir;
	font-weight: normal;
	font-size: 105%;
}

#page p em {
	font-weight: normal;
	font-style: normal;
	float: right;
	margin-right: -10%;
}

#page p a {
	text-transform: inherit;
	color: #9F8F6B;	
	text-decoration: underline;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

#page p a:hover {
	text-decoration: none;
}

#page p a.button {
	text-decoration: none;
	color: #022D16;
}







.woocommerce .woocommerce-tabs {
	display: none !important;
	visibility: hidden !important;
}

.woocommerce section.related {
	display: none !important;
	visibility: hidden !important;
}

.woocommerce .summary h3 {
	font-size: 180%;
	text-transform: inherit;
}

.woocommerce .summary h4 {
	font-size: 110%;
	padding: 10px 0 0;
	text-transform: uppercase;
	color: #E7480F !important;
}

.woocommerce .summary p strong {
	font-size: 120%;
	padding: 10px 0;
}

.woocommerce .summary p {
	font-size: 90%;
	padding: 10px 0;
}

.woocommerce p.price {
	font-size: 140% !important;
	padding: 20px 0 !important;
	color: #022D16 !important;
}

.woocommerce .product_meta {
	display: none !important;
}

.woocommerce div.product form.cart div.quantity {
	float: none;
	margin: 10px 10px 0 0;
}

.woocommerce div.product form.cart div.quantity input {
	border: solid 1px #E4E6E5;
	font-size: 100%;
}

.woocommerce div.product form.cart div.quantity:before {
	content: 'How many?';
	width: 100% !important;
	float: left;
	padding-bottom: 5px;
}

.woocommerce div.product form.cart .button {
	float: none;
	background-color: transparent;
	display: inline-block;
	margin-top: 30px;
	padding: 15px 30px;
	border-radius: 30px;
	color: #022D16 !important;
	font-size: 90%;
	text-transform: uppercase !important;
	display: block;
	font-weight: normal;
	text-transform: uppercase;
	border: 1.5px solid #9F8F6B;
}

.woocommerce ol.flex-control-nav {
	display: block !important;
}

.woocommerce div.product .flex-control-nav {
	width: 100%;
}

.woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) {
	clear: none;
}

.woocommerce div.product div.images .flex-control-thumbs li {
	width: 10%;
	float: left;
	margin: 2% 2% 2% 0;
	list-style: none;
}

.woocommerce-message {
	background-color: #F4F6F5;
	border: none;
	border-radius: 30px;
	color: #022D16;
	font-size: 90%;
	padding: 15px 25px !important;
}

.woocommerce-message::before {
	color: #E50051;
	display: none;
}

.woocommerce-message a {
	color: #E50051;
}

.woocommerce-notices-wrapper {
	background-color: #F4F6F5 !important;
	color: #022D16;
	font-size: 90%;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
	background-color: #F4F6F5 !important;
	color: #022D16;
	font-size: 90%;
}

.woocommerce-error {
	border-top-color: #E50051; 	
}

.woocommerce-error::before {
	color: #E50051; 	
}

.woocommerce button[name="update_cart"],
.woocommerce input[name="update_cart"] {
	display: none;
}

.woocommerce .cart_totals h2 {
	display: none;
}

.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
	background-color: #022D16;
	margin-top: 30px;
	padding: 15px 30px;
	border-radius: 30px;
	color: #FFF;
	font-size: 100%;
	font-weight: normal;
	text-transform: uppercase;
}

.woocommerce table.shop_table a {
	color: #022D16;
}

.woocommerce a.remove {
	color: #022D16;
}

.woocommerce a.remove:hover {
	background-color: #022D16;
}

.woocommerce input {
	background-color: #F4F6F5;
	padding: 10px;
	border: none;
	font-size: 90%;
	border-radius: 5px;
}

.woocommerce textarea {
	background-color: #F4F6F5;
	padding: 10px;
	border: none;
	font-size: 90%;
	border-radius: 5px;
	font-family: Avenir;
}

.woocommerce h3 {
	margin: 40px 0 10px;
}

.woocommerce .woocommerce-info, .woocommerce .cart-empty.woocommerce-info {
	background-color: #F4F6F5;
	border: none;
	border-radius: 30px;
	color: #022D16;
	font-size: 90%;
	padding: 15px 25px !important;
}

.woocommerce .woocommerce-info a {
	color: #022D16;
}

.woocommerce-info::before {
	color: #1e85be;
	display: none;
}

.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
	border: 1px solid #F4F6F5;
	padding: 20px;
	text-align: left;
	border-radius: 30px;
}

.woocommerce form.checkout_coupon p, .woocommerce form.login p, .woocommerce form.register p {
	font-size: 90%;
}

.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	background-color: #022D16;
	padding: 8px 20px;
	border-radius: 30px;
	color: #FFF !important;
	font-size: 80%;
	font-weight: normal;
	text-transform: uppercase;
}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
	background: transparent;
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
	background-color: #F4F6F5;
	border-radius: 10px;
	padding: 20px;
}

.woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

.wc-stripe-elements-field, .wc-stripe-iban-element-field {
	border: none !important;
	margin: 0 !important;
	padding: 10px !important;
	background-color: #fff;
	outline: 0;
	font-size: 90%;
	border-radius: 5px;
}

.woocommerce-checkout #payment div.form-row {
	padding: 0;
}

#payment fieldset {
	border: none;
}

.woocommerce #content table.cart img, .woocommerce table.cart img, .woocommerce-page #content table.cart img, .woocommerce-page table.cart img {
	height: auto;
	width: 70px;
	padding: 0;
}

.woocommerce .woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.woocommerce .woocommerce-MyAccount-navigation ul li {
	list-style: none;
	padding: 0;
	margin: 0;
}

.woocommerce .woocommerce-MyAccount-navigation ul li a {
	color: #022D16;
}

.woocommerce .woocommerce-MyAccount-navigation ul li.is-active a {
	color: #E50051;
}

.woocommerce .woocommerce-MyAccount-navigation ul li a:hover {
	color: #E50051;
}

.woocommerce .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--dashboard {
	display: none;
}

.woocommerce .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--downloads {
	display: none;
}

.woocommerce-account .addresses .title .edit {
	float: left;
	display: block;
	position: absolute;
	bottom: 0px;
	color: #C4C6C5;
	border-bottom: 2px solid #C4C6C5;
}

.woocommerce-Address {
	width: 100% !important;
	position: relative;
	padding-bottom: 40px;
}

.woocommerce p.woocommerce-customer-details--phone::before {
	display: none;
}

.woocommerce p.woocommerce-customer-details--email::before {
	display: none;
}

.woocommerce mark {
	background-color: transparent;
}









.visual-form-builder fieldset {
	clear: both;
	margin: 0 0;
	padding: 0;
	border:none;
	border-radius: none;
	background-color: #FFF;
}

.visual-form-builder .vfb-legend {
	margin: 5px 14px;
	padding: 0 6px;
	border-bottom: 1px solid #ccc;
	color: #900;
	font-size: inherit;
	display: none;
}

.visual-form-builder ul {
	margin: 0 !important;
	padding: 0;
}

.visual-form-builder ul li {
	margin: 0 !important;
	padding: 0;
}

.visual-form-builder ul li a {
	color: #632B54;
}

.vfb-section input.vfb-text {
	border: none;
	padding: 10px;
	box-shadow: none;
	background-color: #F4F6F5;
	color: #022D16;
	font-size: 100%;
	width: calc(100% - 20px);;
}

.vfb-section textarea {
	border: none;
	padding: 10px;
	box-shadow: none;
	background-color: #F4F6F5;
	color: #022D16;
	font-size: 100%;
	width: calc(100% - 20px);;
}

label.vfb-desc {
	font-weight: normal;
	font-size: 100%;
}

.vfb-submit, input[type="submit"].vfb-submit {
	font-size: 100%;
	background-color: #632B54;
	display: inline-block;
	margin-top: 30px;
	padding: 10px 30px;
	border-radius: 30px;
	color: #FFF;
	text-transform: uppercase;
	box-shadow: none;
	border: none;
	cursor: pointer;
	font-weight: normal;
}















#footer {
	padding: 10vh 5%;
	width: 90%;
	float: left;
    background-color: #FFF;
}

#third {
	width: 30%;
	float: left;
	height: auto;
}

#third.first {
	width: 40%;
	float: left;
	height: auto;
}

#third.first img {
	height: 40px;
	width: auto;
	float: left;
	margin-top: 10px;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

#third.first img:hover {
	margin-top: 5px;
}

#third h4 {
	font-size: 120%;
	line-height: 150%;
	padding-bottom: 10px;
}

#third a h4 {
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

#third a h4:hover {
	color: #9F8F6B;
}

#third a p:hover {
	color: #9F8F6B;
}


#third p a {
	color: #9F8F6B;
	text-decoration: underline;	
}

#third p a:hover {
	text-decoration: none;
}

#third.first h4 {
	padding-right: 15%;
}

#footer #copy {
	width: 50%;
	float: left;
	margin-top: 5vh;
}

#footer #design {
	width: 50%;
	float: left;
	text-align: right;
	margin-top: 5vh;
}

#footer #design a {
	color: #022D16;
	border-bottom: 1.5px solid #9F8F6B;
	transition-property: all;
	transition-duration: .55s;
	transition-timing-function: ease-in-out;
}

#footer #design a:hover {
	border-bottom: 1.5px solid transparent;
}

#footer #design a:hover {
	text-decoration: none;
}









@media only screen and (max-width: 1400px) {

p, body {
	font-size: 15px;	
}
	
h1 {
	font-size: 50px;
}

h2 {
	font-size: 30px;
}
	
h3 {
	font-size: 25px;
}

h4 {
	font-size: 22px;
}

#logo {
}

#scroll {
	top: 87.5vh;
}

#feature {
	width: 47%;
	height: 350px;
}

#feature-overlay {
	width: 100%;
	height: 350px;
}

#bag a {
	font-size: 15px !important;
	top: 14px !important;
}
	
#image-wrapper {
	width: 100%;
	height: 70vh;
	float: left;
	position: relative;
}

#image-wrapper-overlay {
	background-image: linear-gradient(0deg, rgba(0,0,0,0), rgba(0,0,0,0.6));
	position: absolute;
	top: 0;
	width: 100%;
	height: 70vh;
	z-index: 222;
	display: table;
	text-align: center;
}
	
}






@media only screen and (max-width: 1024px) {

h1 {
	font-size: 45px;
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 22px;
}

h5 {
	font-size: 17px;
}
	
#feature {
	width: 47%;
	height: 300px;
}

#feature-overlay {
	width: 100%;
	height: 300px;
}

#item {
	width: 220px;
}

#item-image {
	width: 220px;
	height: 280px;
	margin-bottom: 15px;
}

#page {
	padding: 10vh 10%;
	width: 80%;
	float: left;
}
	
}





/* iPad & iPhone simulate :hover */
@media (min-device-width:320px) and (max-device-width:1024px) {

#access ul li ul {
	display: none;
}


#access ul li:hover ul {
	display: block;    	
}
	
}





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

#access {
	display: none;	
}	

h1 {
}

h2 {
	font-size: 25px;
}

h3 {
	font-size: 20px;
}
	
#panel.center {
	padding: 10vh 10%;
	width: 80%;
}
	
#feature {
	width: 47%;
	height: 220px;
}

#feature-overlay {
	width: 100%;
	height: 220px;
}
	
#page {
	padding: 10vh 7.5%;
	width: 85%;
	float: left;
}

#third {
	width: 100%;
	float: left;
	height: auto;
	padding: 0 0 2vh;
}

#third.first {
	width: 100%;
	float: left;
	height: auto;
}

#footer #copy {
	width: 100%;
	float: left;
	margin-top: 2.5vh;
}

#footer #design {
	width: 100%;
	float: left;
	text-align: left;
	margin-top: 0;
}
	
}





@media only screen and (max-width: 700px) {

h1 {
	font-size: 30px;
}

h2 {
	font-size: 25px;
}

h3 {
	font-size: 18px;
}
	
h4 {
	font-size: 18px;
}

#header {
	height: 80px;
}

#logo {
	height: 80px;
	width: 150px;
	margin-top: 0;
}

#content {
	margin-top: 80px;
}
	
#scroll {
	top: 72.5vh;
	font-size: 80%;
}

#button {
	margin-top: 20px;
}

#panel.center {
	padding: 10vh 7.5%;
	width: 85%;
}
	
#feature {
	width: 100%;
	height: 220px;
	margin: 1.5% 0;
}

#feature-overlay {
	width: 100%;
	height: 220px;
}

#ad {
	width: 100%;
	height: auto;
	float: left;
	position: relative;
	background-color: #022D16;
	margin-top: 1.5%;
}

#ad-image {
	width: 100%;
	min-height: 250px;
	height: 250px;
	position: relative;
	float: left;
}

#ad-text {
	width: 90%;
	padding: 7.5vh 5%;
	margin-left: 0;
}

#panel-image {
	width: 100%;
	height: auto;
	float: left;
}

#panel-image-text {
	width: 90%;
	padding: 7.5vh 5% 7.5vh 5%;
	background-image: linear-gradient(-90deg, rgba(0,0,0,0.4), rgba(0,0,0,0.6));
	text-align: center;
}

#bag {
	top: 20px;
}
	
}