/*
Theme Name:		NMLC - Storefront Child
Theme URI:		https://woocommerce.com/storefront/
Description:	Theme is a Storefront child theme
Author:			AP
Author URI:		
Template:		storefront
Version:		1.0
License:		GNU General Public License v2 or later
License URI:	http://www.gnu.org/licenses/gpl-2.0.html
Tags:			e-commerce, two-columns, right-sidebar, left-sidebar, responsive-layout, accessibility-ready
Text Domain:	deli
*/
/* =Custom styles starts here */

html {scroll-behavior: smooth;}
body { padding-top: 0; font-size: 22px; line-height: 1.6em; color: #5f7d8b; font-weight: 600; font-family: 'Karla', sans-serif; position: relative; background-color: #fff; } 
iframe, object, embed{ max-width:100%; }
sup{ vertical-align: super; font-size: smaller; }
sub{ vertical-align: sub; font-size: smaller; }
code{ font-family: Monaco, "Andale Mono", "Courier New", Courier, monospace; }
.navbar-fixed-top {top: auto;}
.alignleft { float: left; margin: 1% 2% 2% 0}
.alignright { float: right; margin: 1% 0 2% 2%}
.aligncenter { clear: both; text-align: center; margin: 1%}
.alignnone { float: none; margin: 1% } 
.text-center, .has-text-align-center {text-align: center;}
.text-right {text-align: right;}
.text-left {text-align: left;}
.padding-left {padding-left: 0;}
.padding-right {padding-right: 0;}
.padding-none {padding: 0;}
.row {margin-left: 0; margin-right: 0;}
.uppercase {text-transform: uppercase;}
.white {color: #fff;}


/* #Images
/***********************************************************/
img, a img { border-radius: 0; border:none; padding: 0; margin:0; display:inline-block; max-width: 100%; height:auto; width:auto; image-rendering: optimizeQuality; }

/* #Links
/***********************************************************/
	a { text-decoration: none; outline: 0; max-width:100%; max-width:none\9;  }
	a:hover, a:focus, a:visited, button:hover, button:focus, button:visited { outline: 0; text-decoration: none;}
	p a, p a:visited { line-height: inherit; }
	a img { border: 0}
	#navbar li.dropdown:hover .dropdown-menu {display: block;}
	hr {background-color: #E1F0FF; opacity: 1; margin: 30px 0; clear: both;}
	.sticky .entry-title::before {display: none;}
	
/***********************************************************/
/***** MISC                   ******************************/
/***********************************************************/
input[type='text'], input[type='number'], input[type='email'], input[type='tel'], input[type='url'], input[type='password'], input[type='search'], textarea, .input-text {
	border: 1px solid #ccc;
	background: #fff;
	width: 100%;
}

#social_links {margin-bottom: 20px;}
#social_links ul{padding: 0; margin: 0;}
#social_links li:first-child {margin-left: 0}
#social_links li {list-style: none; display: inline-block; margin: 0 10px; }
#social_links li:before {display: none;}
#social_links li a {
	font-size: 20px;
    color: #fff;
    display: block;
    text-align: center;
    background-color: #15b9dd; 
    width: 50px;
    height: 50px; 
    line-height: 50px;
    border-radius: 100%;
}
#social_links li.fa-facebook-f a {background-color: #537abc;}
#social_links li.fa-twitter a {background-color: #77cbef;}
#social_links li.fa-linkedin-in a {background-color: #1284c7;}
#social_links li.fa-youtube a{background-color: #e96349;}

#social_links li:hover a {background-color: #f15958;}


.fa, .fas, .far, .fal, .fab {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.flex {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.parallax {
    background-attachment: fixed;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
} 

.ease,
.btn,
.btn-solid,
.btn-bordered,
.btn-bordered-white {
	-webkit-transition: all .6s ease;
	-moz-transition: all .6s ease;
	-ms-transition: all .6s ease;
	-o-transition: all .6s ease;
	transition: all .6s ease;
}

.masonry { 
    column-count: 3;
    column-gap: 30px;
}

.masonry-item {
    background-color: #f4f4f4;
    display: inline-block;
    margin: 0 0 1em;
    width: 100%;
}


/* #Default
/***********************************************************/

.site-header .col-full {
	max-width: -webkit-fill-available;
}	

.padded-top {
	padding-top: 80px;
}

.padded-bottom {
	padding-bottom: 80px;
}

.padded-right {
	padding-right: 80px;
}

.padded-left {
	padding-left: 80px;
}


@media (min-width: 768px) {
	.col-full, .footer-widgets, .related.products,
	.parallax-container,
	.footer-widgets{
		margin: 0 auto;
		width: 100%;
	}
	
	.main-navigation {
		display: none;
	}
	
	.storefront-secondary-navigation .site-header .site-branding {
		width: 250px;
		margin-right: 0;
		margin-bottom: 0;
	}
	
	.storefront-secondary-navigation .site-header .secondary-navigation {
		width: calc(100% - 250px);
	}
	
	.site-header .site-branding img {
		height: auto;
		max-width: 206px;
		max-height: none;
	}
	
	.site-header .col-full {
		display: flex;
		align-items: center;
	}	
}

@media (min-width: 1601px) {
	.site-header .col-full {
		max-width: 1600px;
	}	
	
	.secondary-navigation .menu a {
		padding: 1em 1.5em; 
	}
}

.right-sidebar .content-area {
	width: 100%;
	float: none;
	margin-right: 0;
}

.content-area, .widget-area,
.site-main, .hentry,
.no-wc-breadcrumb .site-header {
	margin-bottom: 0;
}

.edit-link {
	display: none;
}

.home.blog .site-header, .home.page:not(.page-template-template-homepage) .site-header, .home.post-type-archive-product .site-header,
.site-header {
	margin-bottom: 0;
	border: 0;
}

.site-header {
	padding-top: 20px; 
	padding-bottom: 20px;
}

.btn-bordered,
.btn,
.btn-solid, 
.hentry .entry-content a.btn,
.hentry .entry-content a.btn-solid,
.hentry .entry-content a.btn-bordered,
.btn-bordered-white {
	text-decoration: none;
	display: inline-block;
}

.btn-bordered,
.btn-solid,
.btn-bordered-white {
	border-radius: 50px;
	min-width: 160px;
}


.main-navigation ul li.btn-bordered, .secondary-navigation ul li.btn-bordered,
.main-navigation ul li.btn-solid, .secondary-navigation ul li.btn-solid {
	padding: 0;
	min-width: 140px;
	margin: 0 10px;
	text-align: center;
}

.main-navigation ul li.btn-solid a, .secondary-navigation ul li.btn-solid a {
	color: #fff;
}
 
.main-navigation ul li.btn-bordered a, .secondary-navigation ul li.btn-bordered a {
	color: #004b99;
}

.main-navigation ul li.btn-bordered:hover a, .secondary-navigation ul li.btn-bordered:hover a {
	color: #000;
}

.main-navigation ul li.btn-bordered:hover a, .secondary-navigation ul li.btn-bordered:hover a {
	color: #e5cd34;
}

.main-navigation ul li a, .secondary-navigation ul li a,
.secondary-navigation .menu a {
	font-weight: 600;
	color: #000;
}

.secondary-navigation .menu {
	font-size: 16px;
}

.header_banner img{
	width: 100%;
	opacity: 0;
}

.header_banner {
	max-height: 500px;
	overflow: hidden;
	position: relative;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.hentry .entry-content a {
	text-decoration: none;
	font-weight: 500;
}

.site-header {
    position: relative;
    width: 100%;
    top: auto;
}


@media (min-width: 768px) {
	.sticky .site-header {
		position: fixed;
		width: 100%;
		top: 0;
	}
	
	.logged-in .sticky .site-header {
		top: 32px;
	}
}

/*** Blocks
*****************************************************************************/

.content_block_wrapper {
    padding-bottom: 80px;
    padding-top: 80px;
}

.padding-none .content_block_wrapper,
.padding-none .content-block-col {
	padding: 0;
}

.parallax_block  {
	background-repeat: no-repeat;
	background-size: cover;
}

.parallax_block img {
	opacity: 0;
	width: 100%;
}

.parallax_block img,
.parallax_block,
.content-block,
.bg_block  {
	position: relative;
	z-index: 3;
}

.site-content,
.content-area {
	position: relative;
}

.radius  {
	position: absolute;
    z-index: 3;
    width: 100%;
	transform: rotate(-180deg);
	overflow: hidden;
	bottom: -1px;
}

.radius.wave_top {
	bottom: auto;
	top: -100px;
}

.wave_top_wrapper {
	padding-top: 50px;
	margin-top: 50px;
}

.page-content .radius.wave_top {
	top: 0;
    bottom: 0;
    position: relative;
	margin-bottom: -50px;
}

.slider_caption {
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.3) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#4d000000',GradientType=0 ); /* IE6-9 */
	z-index: 5;
} 

.slider_caption h1, 
.slider_caption h2 {
	color: inherit;
	font-weight: 700;
	font-size: 72px;
}
 
.slider_caption p {
	font-size: 32px;
	max-width: 50%;
	font-family: 'Merriweather', serif;
}

.slider_caption a.btn-solid {
	font-family: 'Montserrat', sans-serif;
}

.section_title  {
	color: inherit;
}

.image_block_title {
    font-size: 20px;
    font-weight: 400;
	margin-top: 0;
	margin-bottom: 20px;
}

.image_block_bottom {
	padding-left: 80px;
}

.right_image .image_block_bottom {
	padding-left: 0;
	padding-right: 80px;
}

.image_block_bottom ul {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

.image_block_bottom ul li {
	display: inline-block;
	vertical-align: top;
	width: 49%;
	padding-right: 10px;
	margin-bottom: 10px;
}

.image_block_bottom ul li:before {
	content: "\f061";
	display: inline-block;
	width: 30px;
	height: 30px;
	color: #004b99;
	position: relative;
	font-family: FontAwesome;
}

#achievements .row {
	align-items: center;
}

#achievements .content-block-col-1 > div { 
	background-color: #fff;
	box-shadow:0px 0px 5px 5px rgb(221 221 221 / 50%);
	border-radius: 20px;
    padding: 50px;
}

#achievements .content-block-col-1 > div ul {
	padding: 0;
	margin: 0;
}

#achievements .content-block-col-1 > div ul li {
	list-style: none;
	display: inline-block;
	width: 49%;
	padding-right: 15px;
	font-family: 'Merriweather', serif; 
	font-size: 20px;
	text-align: center;
	vertical-align: top;
	margin-bottom: 20px;
}

#achievements .content-block-col-1 > div ul li img {
	display: inline-block;
	margin-bottom: 15px;
}

#achievements .content-block-col-1 > div ul li strong {
	color: #004b99;
	font-size: 52px;
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
}

@media (min-width: 768px) {
	#achievements .content-block-col-2 > div {
		padding-left: 50px;
	}
}

.widget blockquote,
blockquote {
	background-color: #E1F0FF;
	border: 0;
	padding: 50px 30px;
	text-align: center;
	font-size: 20px;
}

blockquote cite {
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
}

#sidebar-1 .widget:first-child {
	margin-top: 0;
}

#sidebar-1 .widget {
	margin-bottom: 20px;
    margin-top: 40px;
}

.img-btn, .img-btn img {
	position: relative;
    display: block;
    margin: 0;
    width: 100%;
	text-align: center;
}

.img-btn a {
	position: relative;
	bottom: 100px;
	left: 0;
    right: 0;
}

/*** Footer 
*****************************************************************************/
@media (min-width: 768px) {
	.before_footer_2 > div {
		width: 33.3334%;
	}
}

.before_footer_2 {
	align-items: center;
	background-color: #004b99;
	color: #fff;
}

.before_footer_2 *,
.before_footer_2 h2,
.before_footer_2 h3 {
	color: #fff;
}

.before_footer_2 > div {
	text-align: center;
	margin-bottom: 0;
}

.before_footer_2 > div img {
	width: 100%;
}

.before_footer_2 #block-6 {
	padding: 30px;
}

.site-footer a:not(.button):not(.components-button),
.site-footer a:not(.btn-bordered-white) {
    color: #004b99; 
	text-decoration: none;
} 

.site-footer {
	padding: 0;
}

.before_footer_1 {
	background-color: #e1f0ff;
}

.before_footer_1 .widget {
	margin-bottom: 30px;
}

.recent-item-wrapper {
	box-shadow:0px 0px 5px 5px rgb(221 221 221 / 50%);
	background-color: #fff;
}

.recent_content {
	padding: 20px;
}

.recent_content h5 {
	font-size: 16px;
	font-weight: 600;
	min-height: 50px;
}

.recent_thumbnail img,
.blog-loop-image img {
	width: 100%;
}

.recent_thumbnail {
	max-height: 200px;
	overflow: hidden;
}

.blog-loop-image {
	max-height: 300px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	margin-bottom: 30px;
}

.blog-loop-image img {
	opacity: 0;
}

.blog-loop-title {
	margin: 0;
}

.pagination, .woocommerce-pagination {
	border: 0;
}

.footer-widgets .widget {
	margin-bottom: 0;
}

@media (min-width: 768px) {
	.footer-widgets.col-4 .block {
		width: 28.73913%;
	}
}

.footer-widgets.col-4 .footer-widget-4 {
	float: none;
	width: 100%;
    margin-right: 0;
    display: flex;
    text-align: center;
    justify-content: center;
	padding: 30px 0;
	margin-top: 30px;
	border-top: 1px solid #eee;
}

.footer-widgets.col-4 .footer-widget-4 .widget {
	margin: 0 15px;
}

.site-info {
	padding: 12px 0;
	color: #444;
	font-size: 14px;
	background-color: #eee;
}

.back-top {
	position: fixed;
    right: 13px;
    bottom: 100px;
	background-color: #004b99;
    z-index: 9999;
    transition: all 0.25s ease-in-out;
	height: 42px;
    width: 42px;
    line-height: 42px;
    text-align: center;
    color: #fff!important;
}

.back-top a {
	display: block;
	 color: #fff!important;
}

.back-top:hover {
	background-color: #e5cd34;
	transition: all 0.25s ease-in-out;
}

/***Media Queries***/

@media screen and (max-width: 767px) {
	
	.parallax_block img {
		width: 130%;
		max-width: 170%;
	}
	
	.slider_caption h1, .slider_caption h2 {
		font-size: 35px;
	}
	
	.slider_caption p {
		max-width: 100%;
		font-size: 20px;
	}
	
	#content .col-full {
		margin: 0;
	}
	
	#marine-animals-help .image_block {
		display: block; 
	}
	
	#marine-animals-help .image_block .image_block_bottom {
		padding: 20px 15px;
	}
	
	.image_block_bottom ul li {
		display: block;
		width: auto;
	}
	
	#achievements .content-block-col-1 > div ul li {
		width: auto;
	}
	
	
}

@media screen and (max-width: 420px) {
	
	.parallax_block img {
		width: 150%;
	}

	.slider_caption h1, .slider_caption h2 {
		font-size: 30px;
	}
	
	.slider_caption p {
		font-size: 17px;
	}
}