/*!
Theme Name: h2o
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: h2o
Tags: custom-background, custom-logo, custom-menu, featured-images, 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.

h2o is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

@import url('https://fonts.googleapis.com/css2?family=Exo:wght@400;600;800&family=Poppins:wght@400;500;600;700&display=swap');

body {
	background-color: #fff;
	color: #3e4c66;
	font-family: 'Exo', sans-serif;
	font-size: 1rem;
	overflow-x: hidden;
}

h1,h2,h3,h4,h5,h6 {
	color: #1c1c1c;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
}

a {
	color: #00325c;
}

b, strong {
    font-weight: bold;
}

input[type="text"],input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {
    display: block;
    color: #666666;
    width: 100%;
    padding: .5rem 1rem;
    border-radius: 30px;
    font-size: 0.875rem;
    line-height: 1.5;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #000;
	height: 50px;
    margin-bottom: 10px;
}

input[type="number"] {
	border-radius: 5px;
	padding: .25rem;
}

select {
	border: 1px solid #000;
	border-radius: 5px;
	padding: 5px;
}

textarea {height: auto;}

button, input[type="button"], input[type="reset"], input[type="submit"], .btn {
	background-color: #00325c;
	border: 2px solid #00325c;
	color: #fff;
	border-radius: 30px;
	font-size: 1.125rem;
	font-weight: 600;
	width: 150px;
    height: 60px;
	cursor: pointer;
	padding: .75rem;
	line-height: 1.85;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.btn:hover {
	background-color: #fff;
	color: #00325c;
}

.owl-nav [class*=owl-] {
	width: 40px !important;
	height: 40px !important;
	border-radius: 5px !important;
	color: #fff !important;
	font-size: 40px !important;
	background: #000 !important;
	padding: 0 !important;
	margin: 5px;
	line-height: 0 !important;
}

.owl-nav [class*=owl-]:hover {
	background: #ccc !important;
}

.owl-dots .owl-dot {
	width: auto !important;
    height: auto !important;
}

/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/

.site-header {
	/*background-color: #00325c;*/
	background-color: #000;
	color: #fff;
	font-weight: 400;
	padding: 20px 0;
}

.home .site-header {
	background-color: transparent;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	padding: 50px 0 20px;
}

.site-header a {
	color: inherit;
	text-decoration: none;
}

.custom-logo {
    width: 350px;
    max-width: 100%;
    height: auto;
}

.cart-contents {
	position: relative;
	margin-right: 30px;
}

.cart-contents .count {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #fff;
	color: #1c1c1c;
	font-size: 0.75rem;
	font-weight: 600;
	text-align: center;
	line-height: 20px;
	position: absolute;
    top: -10px;
    right: -10px;
}


.search-form {
    background: #fff;
    border: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    border-radius: 30px;
    height: 50px;
    padding: 5px;
    max-width: 210px;
}

.search-form label {
	margin: 0;
	margin-right: 15px;
}

.search-form input[type="search"] {
    background: transparent;
    border: none;
    margin: 0;
    padding: 10px;
    border-right: 1px solid #e5e5e5;
    border-radius: 0;
    height: auto;
}

.search-form input[type="submit"] {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkY4MUJDMDJFMENFODExRUJBRjQwQzZCNDVDMzk5RTQyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkY4MUJDMDJGMENFODExRUJBRjQwQzZCNDVDMzk5RTQyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RjgxQkMwMkMwQ0U4MTFFQkFGNDBDNkI0NUMzOTlFNDIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RjgxQkMwMkQwQ0U4MTFFQkFGNDBDNkI0NUMzOTlFNDIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6zkPtnAAAArklEQVR42mJgQAL///9XAuKZQHz3PwS8A+IzQFwOxIIM+ABUET4AMtSYWM1noC5ZBXXFfyQXGaNrNkZT4ILFgg5kw9ElVyFJGuPx4kwkdS7IEnexmoxpgBKSAR0wcSYgVoKyz+IzgJGR8R4SVxDZAJiEMSEXIHHfUzUMKIsFHOngLo50AJMTJCclEmUItrywG5YX0MLrLsH8gSMwV+ENDxINuctALgBqDgV5GSDAAIzjxFXtsICIAAAAAElFTkSuQmCC');
	width: 42px;
	height: 42px;
    background-color: #00325c;
    border: none;
    border-radius: 50%;
    color: #000;
    text-indent: -9999px;
    background-position: center;
    background-repeat: no-repeat;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
	margin-top: 20px;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
	font-size: 1rem;
	font-weight: 600;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	left: 100%;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	display: inline-block;
	position: relative;
}

.main-navigation a {
	border-radius: 30px;
    display: block;
    padding: 10px 12px;
    text-decoration: none;
    line-height: 1.2;
}

.main-navigation li.current-menu-item > a {
	background-color: #fff;
	color: #1c1c1c;
}

.site-main .comment-navigation, .site-main
.posts-navigation, .site-main
.post-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}



/*--------------------------------------------------------------
## Homepage Sections
--------------------------------------------------------------*/

#rev_slider_1_1 .custom .tp-bullet {
    background: transparent;
    color: #fff;
    font-size: 1.125rem;
    font-family: 'Exo', sans-serif;
}

#rev_slider_1_1 .custom .tp-bullet.selected {
    font-size: 2rem;
    font-weight: 800;
}

#rev_slider_1_1 .custom .tp-bullet.selected::after {
    content: "";
    display: inline-block;
    border: 2px solid #fff;
    border-left: 2px solid transparent;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    position: absolute;
    top: -6px;
    left: -10px;
    transform: rotate(15deg);
}

h1,
h2.section-title {
	font-size: 3.125rem;
	margin-bottom: 40px;
}

#about {
	padding: 75px 0 80px;
}

#products {
	background-color: #fafafa;
	padding: 95px 0;
}

#products .container {
	max-width: 1600px;	
}

.product-box {
	background-color: #181818;
	border-radius: 10px;
	color: #fff;
	font-size: 1rem;
	padding: 70px 45px 75px;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
	margin-bottom: 30px;
}

.product-box h2 {
	color: #fff;
	margin-bottom: 15px;
}

#product-carousel-outer {
    max-width: 1400px;
    margin-left: auto;
}

.product-card--image {
	background-color: #fff;
	border: 1px solid #d7d7d7;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	overflow: hidden;
	text-align: center;
}

#product-carousel .owl-item img {
	width: auto;
}

.product-card--body {
	background-color: #00325c;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	color: #fff;
	padding: 20px 30px 30px;
	min-height: 210px;
}

#product-carousel .product-card--image,
#product-carousel .product-card--body {
	border-radius: 10px;
}

#product-carousel .product-card--body {
	margin-left: 25px;
	margin-right: 25px;
	margin-top: -30px;
	position: relative;
	z-index: 99;
}

.product-card--body h5 {
	color: inherit;
	font-weight: 500;
	margin-bottom: 20px;
}

.product-card--body .btn-link {
	color: #fff;
	font-size: 1.125rem;
	font-weight: 600;
	text-decoration: underline;
}

.product-card--body .btn-link:hover {
	text-decoration: none;
}


@media (min-width: 992px) {
	.product-box {
		-ms-flex: 0 0 26%;
		flex: 0 0 26%;
		max-width: 26%;
		margin-right: 30px;
		margin-bottom: 0;
	}
	
	#product-carousel {
		-ms-flex: 0 0 70%;
		flex: 0 0 70%;
		max-width: 70%;
	}
	
	#product-carousel .owl-stage, #product-carousel .owl-item {display: flex;}

	#product-carousel .owl-item {flex: 1 0 auto;}

	#product-carousel .product-card {
		max-width: 370px;
	}
	
	#product-carousel .owl-nav {
		position: absolute;
		top: -75px;
		right: 24%;
	}
}

#categories {
	padding: 55px 0 90px;
}

.tab-bar {
	margin-bottom: 20px;
	text-align: center;
}

.tab-bar .tablink {
	color: #1c1c1c;
	border-radius: 30px;
	display: inline-block;
	font-size: 1.125rem;
	font-weight: 600;
	padding: .5rem 1rem;
	text-decoration: none;
}

.tab-bar .tablink.active {
	background-color: #00325c;
	color: #fff;
}

#contact {
	position: relative;
}

#contact-bg {
	background: url('./images/contact-bg.jpg') no-repeat center / cover;
	padding-bottom: 430px;
	/*position: absolute;
	top: 70px;
	left: 0;
	right: 0;
	bottom: -50px;
	z-index: -1;*/
}

#contact .wpcf7 {
	max-width: 732px;
	margin: 0 auto;
	background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
}

#contact .form-header {
	background: #00325c;
    color: #fff;
    font-family: 'Poppins', san-serif;
    font-size: 3.125rem;
    text-align: center;
    padding: 30px 15px;
}

#contact .form-body {
	padding: 45px;
}

#contact .wpcf7 .btn {
	margin-top: 30px;
	width: 220px;
}

#testimonials {
	padding: 110px 0 90px;
}

.review {
	border: 1px solid #b7b7b7;
	border-radius: 10px;
	padding: 15px 20px;
}

.review .review-header {
	color: #333333;
	margin-bottom: 10px;
}

.review .review-header img.avatar {
	width: 79px;
	height: 79px;
	object-fit: cover;
	border-radius: 50%;
	border: 2px solid #00325c;
	padding: 2px;
	margin-right: 20px;
}

.review .review-header h5 {
	font-family: 'Exo', sans-serif;
	font-weight: 500;
	margin: 0;
}
.review .review-header h6 {
	font-family: 'Exo', sans-serif;
}

.review .review-body {
	color: #666666;
	text-align: justify;
}


.site-footer {
	background-color: #101010;
	color: #fff;
	font-size: 1rem;
}

.site-footer ul {
	list-style: none;
	padding: 0;
}

.site-footer p {
	font-weight: 300;
	margin-bottom: 20px;
}

.site-footer a {
	color: inherit;
    text-decoration: none;
}

.site-footer .fa-ul>li {
    margin: 0 0 1rem;
}

.footer-top {
	padding-top: 80px;
	padding-bottom: 40px;
}

.site-footer .current-menu-item a {
	font-weight: bold;
}

.footer-widgets .widget-title {
	color: #fff;
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
	text-transform: uppercase;
}

.site-footer .tnp-widget-minimal form {
	background: #fff;
    display: flex;
    border-radius: 30px;
    height: 55px;
    padding: 10px;
}

.site-footer .tnp-widget-minimal input.tnp-email {
	background: transparent;
    border: none;
    margin: 0;
    padding: 10px 20px;
    border-right: 1px solid #ccc;
    border-radius: 0;
    height: auto;
}

.site-footer .tnp-widget-minimal input.tnp-submit {
	width: 30%;
    background-color: transparent;
    color: #000;
    text-indent: -9999px;
    background-image: url('./images/send-icon.png');
    background-position: center;
    background-repeat: no-repeat;
}

.site-info {
	border-top: 2px solid #3d3d3d;
    font-size: .9375rem;
    line-height: 50px;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 1.5em;
	/* Make sure select elements fit in widgets. */
}

.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

.site-main {
	margin-top: 2em;
	margin-bottom: 2em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}


/*--------------------------------------------------------------
## Woocommerce Styles
--------------------------------------------------------------*/

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: #000;
    font-weight: bold;
}

.product_meta>span {
    display: block;
}

.related.products {
	clear: both;
}

.related.products h2 {
	margin-bottom: 30px;
}

.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
	border-radius: 30px;
	font-family: 'Playfair Display', sans-serif;
	padding: 1rem 1.5rem;
}

.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
    background-color: #000 !important;
	border: 2px solid #000;
	color: #fff;
}

.woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover {
    background-color: #fff !important;
    color: #000;
}


.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1,
.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
    padding-right: 0;
    padding-left: 0;
    max-width: 100%;
}

.woocommerce form .form-row {
    display: block;
}


/* Change WC Acct Page Column Widths */
@media only screen and (min-width: 769px) {
  .woocommerce-account .woocommerce-MyAccount-navigation {
    width: 22%;
  }
  .woocommerce-account .woocommerce-MyAccount-content { 
    width: 75%;
  }
}
/* Style WC Account Endpoint Links */
nav.woocommerce-MyAccount-navigation a,
.woocommerce-MyAccount-content a{color: #000;}
nav.woocommerce-MyAccount-navigation ul {
  list-style-type: none;
  padding-left: 0;
  max-width:220px;
  font-size: 17px;
  line-height: 26px;
}
nav.woocommerce-MyAccount-navigation ul li {
  padding: 8px 20px;
  background-color: rgba(0,0,0,0.05);
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
nav.woocommerce-MyAccount-navigation ul li.is-active {
  background-color: #000;
}
nav.woocommerce-MyAccount-navigation ul li.is-active a {
  color: #fff;
  cursor: default;
}
nav.woocommerce-MyAccount-navigation ul li.is-active:after {
  content: "";
  height: 0;
  width: 0;
  border-top: 20px solid transparent;
  border-left: 14px solid #000;
  border-bottom: 20px solid transparent;
  float: right;
  margin-right: -34px;
  margin-top: -7px;
}
nav.woocommerce-MyAccount-navigation ul li:not(.is-active):hover {
  background-color: rgba(0,0,0,0.07);
}
nav.woocommerce-MyAccount-navigation ul li:not(.is-active):hover:after { 
  content: "";
  height: 0;
  width: 0;
  border-top: 20px solid transparent;
  border-left: 14px solid rgba(0,0,0,0.07);
  border-bottom: 20px solid transparent;
  float: right;
  margin-right: -34px;
  margin-top: -7px;
}


@media (min-width: 1230px) {
	.container {
	    max-width: 1200px;
	}
}



