/*
Theme Name: Pungles
Text Domain: mychildpunglestheme
Author: Lirva Productions
Author URI: https://www.lirvaproductions.com
Description: Child theme of Lirva-Gemini for Pungles
Template: Lirva-Gemini
Version: 1.0.0
*/ 

body {
	background-color:		#ffffff;
	font-family:			'Open Sans', sans-serif;
	font-size:				17px;
	line-height:   			27px;
	color:					#161616;
	margin:					0;
}

a, a:visited {
	color:					#161616;
  	text-decoration:		underline;
}

a:hover  {
	color:					#161616;
  	text-decoration:		underline;
}

h1, h2 {
	font-weight:			300;
	letter-spacing:			1px;
	text-transform:			uppercase;
}

h1 {
	font-size:				44px;
	line-height:      		52px;
	color:					#333333;
	margin:					4px 0 15px 0;
}

body.home h1 {
	display: 				inline-block;
}

h1, h1.wp-block-heading {
    position: 				relative;
	font-size:				42px;
	line-height:      		50px;
	margin:					0 0 45px 0;
	letter-spacing:			1px;
	text-transform:			uppercase;
}

h1:before {
    position: 				absolute;
    bottom: 				-10px;
    left: 					0;
    border: 				0px solid transparent;
    border-top: 			3px solid #fdc03c;
    content: 				'';
    height: 				0;
    width: 					118px;
}

h2 {
	font-size:				38px;
	line-height:      		48px;
	margin:					10px 0 8px 0;
}

h3 {
	font-size:				32px;
	font-weight:			300;
	line-height:      		48px;
	margin: 				10px 0 5px 0;
}

h4 {
	font-size: 				25px;
	font-weight:			400;
	line-height: 			1.2em;
	margin: 				10px 0 5px 0;
}

h5 {
	font-size: 				20px;
	font-weight:			500;
	line-height: 			1.2em;
	margin: 				10px 0 5px 0;
}

p { 
	margin-top: 			10px;
    margin-bottom: 			25px;
}

p.bold-heading { 
    margin-bottom: 			15px;
}

b, strong {
    font-weight: 			bold;
}


/* LAYOUT */
div#primary, #main-content {
	background:				#ffffff;
	padding:				25px 25px 45px 25px;
	margin:					0 auto;	
}

div#primary, #main-content, .container {
    max-width: 				1500px;
}

.is-layout-flex > :is(*, div) {
    margin: 				0 auto;
}

body.home #main-content {
    max-width: 				100%;
	padding:				0;
	margin:					0;
}

body.home div#content {
	margin:					0;
}

.container {
	padding-top:			5px;
	padding-bottom:			35px;
	margin:					0 auto;
}

.container p, .container-fluid p { 
	margin-top: 			10px;
    margin-bottom: 			25px;
}

.wp-block-columns {
	margin-bottom: 			0.8em;
}

div[class*="col-"] {
	margin-top: 			8px;
	margin-bottom: 			8px;
}

.overlay {
	background-color: 		rgba(247, 247, 247, 0.7);
}

.opaque {
	background-color: 		rgba(247, 247, 247, 0.9);
}

.box-style {
	border-radius:			4px;
	border:					2px solid #ffffff;
}

figure {
    margin: 				15px 0 10px 0;
}

img.responsive {
	max-width: 				100%;
	height: 				auto;	
}

img.align-right {
	float: 					right;    
	margin: 				0 0 0 15px;
}

img.align-left {
	float: 					left;    
	margin: 				0 15px 0 0;
}

img.align-none {
	float: 					none;    
	margin: 				5px 5px 5px 0;
}

.fade {
    opacity: 				0.5;
    transition: 			opacity .65s ease-in-out;
}

.fade:hover {
    opacity: 				1;
}

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

.shadow {
	box-shadow: 			-1px 5px 10px 2px rgba(204,204,204,1);
}

.w-border {
	border:					2px solid #ffffff;
}

.zoom:hover {
	transform: 				scale(1.15);
	font-size: 				18px;
}

.zoom {
	transition: 			transform .2s;
}

.fadein {
    opacity:				0;
}

.divider {
	width:					62%;
	height:					2px;
}

.fine-print {
	font-size:				14px;
	color:					#787878;
	font-weight:			bold;
}


/* SITE STYLES */
#right-sidebar .sidebar {
	height:					100%;
	padding-bottom:			5px;
}

#right-sidebar div.items {
	font-size:				14px;
	line-height:			22px;
}

#right-sidebar img {
	width:					100%;
	max-width: 				65px;
	height:					auto;
	float:					left;	
	margin:					4px 10px 4px 0;
}

#right-sidebar ul.post-categories {
	margin-top: 			0;
    margin-bottom: 			0;
    padding-left: 			0;
}

#right-sidebar ul.post-categories li {
	padding:				5px 5px 5px 0;
	margin-bottom:			10px;
	border-bottom:			1px solid #042957;

    border: 				none;
    border-radius: 			0;
}

#right-sidebar h3.sidebar-header {
	background:				#39b54a;
    font-size: 				20px;
	color:					#ffffff;
	line-height: 			28px;
	padding:				5px 8px 8px 8px;
    margin: 				0 0 5px 0;
}

#right-sidebar h3 ul.post-categories li a {
	color:					#ffffff;
}

#right-sidebar h3 ul.post-categories li {
    padding: 				0;
    margin: 				0;
}

#right-sidebar ul li a.entry-title {
    display: 				block;
    font-size: 				15px;
    font-weight: 			600;
	line-height: 			1.5em;
    text-decoration: 		none;
    margin: 				0 0 8px 0;
}

#right-sidebar div.related-items ul {
    border: 				none;
    border-radius: 			0;
}

#right-sidebar div.related-items ul li {
    border: 				none;
    border-radius: 			0;
    border-bottom: 			1px solid #cccccc;
    padding: 				4px 0 25px 0;
    margin: 				4px 0 10px 0;
}

#right-sidebar div.related-items ul li:last-child {
    border-bottom: 			none;
}

#right-sidebar ul li a.read-more {
	display:				block;
	font-size:				14px;
	line-height:			20px;
    text-decoration: 		underline;
    margin: 				6px 0 0 0;
}

.tags a {
	display:				inline-block;
	background:				#f7f7f7;
	font-size:				13px;
	line-height:			20px;
	text-transform:			uppercase;
	text-decoration:		none;
	border:					1px solid #cccccc;
	border-radius:			6px;
	padding:				2px 6px 2px 6px;
	margin:					5px 5px 5px 0;	
}

.tags a:hover {
	text-decoration:		underline;
}


/* PAGE HEADER */
#page-header {
	position:				relative;
    margin: 				0;
}

#page-header .page-title {
	padding:				0;
    margin: 				4px 0 45px 0;
}

#page-header .page-title, #page-header ul.post-categories li a {
	position:				relative;
	max-width: 				100%;

	font-size:				44px;
	line-height: 			52px;
    font-weight: 			300;
	text-transform:			uppercase;
	letter-spacing:			1px;
}

#category #page-header {
	position:				relative;
	min-height:     		135px; 
	text-align:				center;
    display: 				flex;
    flex-direction: 		column;
    align-items: 			center;
	justify-content:		center;
	margin-bottom:			10px;
}

#category #page-header .page-title {
	padding:				5px 45px 5px 45px;
    margin: 				4px 0 4px 0;
}

#page-header h1 {
	display:				inline-block;
	margin: 				0;	
}

#category h1.page-title, #category h2.page-title {
    font-size: 				34px;
    line-height: 			42px;
    letter-spacing: 		0;
    margin: 				0 0 15px 0;
}

#category h1.page-title:before {
    border-top: 			none;
}

div.parent-category-name {
	font-size:				22px;
	line-height: 			32px;
    font-weight: 			300;
	text-align:				center;
	text-transform:			uppercase;
	letter-spacing:			1px	
}


/* HOME PAGE */
div.media {
	position:				relative;	
	z-index: 				2;
	margin: 				0 0 45px 0;
}

div.media figure.wp-block-image {
	height:					600px;
	width: 					100%;
    margin: 				0;
}

div.media figure.wp-block-image img {
	width: 					100%;
	height: 				100%;
	object-fit:				cover;
}

div.media figure.wp-block-video {
	margin: 				0 0 10px 0;
}

div.media figure.wp-block-video video {
	height:					620px;
	object-fit: 			cover;
}


/* HOME PAGE PRODUCTS */
body.home div.home-products {
	text-align:				center;
	padding:				5px 35px 10px 35px;
}

body.home div.home-products h1 {
    margin: 				0 0 45px 0;
}

body.home div.sale-products .container {
    padding-top: 			2px;
    padding-bottom: 		2px;
}

body.search-results h1 {
    font-size: 				32px;
}


/* DEFAULT CATEGORY PAGE */
#category {
    padding-top: 			5px;
    padding-bottom: 		5px;
}

#category ul {
	margin-top: 			0;
    margin-bottom: 			0;
    padding-left: 			0;
}

#category ul li {
	display:				inline-block;
	border:					1px solid #cccccc;
	border-radius:			5px;
	padding:				4px 18px 4px 18px;
	margin: 				8px 5px 8px 5px;
}

#category ul li a {
	display:				inline-block;
	color:					#333333;
	font-size: 				20px;
	font-weight:			400;
	text-decoration:		none;
}

#category ul li.cat-item {
	color:					#333333;
}

#category #page-header ul li:hover, #category .sub-categories ul li.current-cat {
	background:				#39b54a;
}

#category #page-header ul li a:hover, #category .sub-categories ul li.current-cat, #category .sub-categories ul li.current-cat a {
	color:					#ffffff;	
}

#category .sub-categories {
	text-align:				center;
	margin-top: 			5px;
}

#category .category-content {
	margin-top: 			35px;	
}

#category .category-container {
	padding-top: 			15px;
    padding-bottom: 		35px;	
}

#category .content-container {
	padding-right: 			25px;
}


/* FAQ CATEGORY PAGE */
#category-faqs .sub-categories {
	margin-top: 			5px;
    margin-bottom: 			25px;
}



/* Print Style Sheet For Tutorials */
@media print {
	#category-faqss .container, #category-faqss #category-faqss .container div.row, #category-faqss div.col-left { width: 100%; max-width: 100%; }
	#right-sidebar, #category-faqss a.print-page, #category-faqss a.goback { display: none; }
	#category-faqss div.overlay { padding: 15px 35px 15px 35px; }
	#tutorials-page-header { min-height: 225px; }
	#tutorials-page-header h1.the-category { font-size: 42px; margin: 15px 0 10px 0; }
}


/* CONTACT PAGE / FORMS / DEFAULT STYLES */
.wpcf7 {
    margin: 				15px 0 4px 0;
}
	
.wpcf7-spinner {
    background-color: 		#23282d;
    opacity: 				0.75;
    width: 					24px;
    height: 				24px;
    margin: 				0 4px;
}

.wpcf7 form .wpcf7-response-output {
	font-size:				16px;
	text-align:				center;
    margin: 				0.1em 0.5em 1em;
    padding: 				0.25em 0.5em;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
	border-color:			#dc3232;
}

.wpcf7 label {
	margin-top: 			0.2rem;
    margin-bottom: 			0.45rem;
}

.wpcf7 input, .wpcf7 textarea, .wpcf7 select, input, select {
    background-color: 		#fff;
    color: 					#000;
	border: 				1px solid #cccccc;
	border-radius:			3px;
	padding:				6px 6px 6px 6px;
}

input[type="checkbox"] {
	margin:					0 2px 0 0;
}

.wpcf7-text:focus, .wpcf7-textarea:focus, .wpcf7 select:focus, input[type="date"]:focus {
	outline:				2px solid #684f40;
}

.wpcf7-not-valid-tip {
    color: 					#dc3232;
    font-size: 				0.8em;
    font-weight: 			bold;
}


/* CONTACT PAGE */
#contact-page {
    padding-top: 			0;
    padding-bottom: 		0;
	margin-top:				2px;
	margin-bottom:			15px;
}

#contact-page .contact-details {
	display: 				flex;
	align-items: 			center;
	justify-content: 		center;
	margin-top:				15px;
}

#contact-page .photo {
	height:					100%;
	text-align:				center;
}

#contact-page .photo img {
	width:					100%;
	max-width: 				580px;
	height: 				auto;
}

#contact-page .contact-form label span {
	display:				block;
	margin:					0 0 1px 0;
}

#contact-page label input, #contact-page label textarea {
	width:					100%;
    padding: 				9px 7px 9px 7px;
}

#contact-page label {
    width:					100%;
}

#contact-page .phone:before {
	font-family: 			'Material Symbols Outlined';
	font-size:				32px;
	vertical-align:			middle;
	margin-left:			-5px;
}

#contact-page .phone:before {
	content:				"\e0b0";
}

#contact-page .email:before {
	content:				"\e158";
}

#contact-page div.submit-btn input {
	width:					100%;
}

.grecaptcha-badge {
	visibility: 			hidden;
}

.google-tos {
	background:				#f7f7f7;
	font-size:				13px;
	text-align:				center;
	padding:				8px 7px 8px 7px;
	margin:					2px 0 5px 0;	
}


/* POST PAGE PAGINATION */
#paginator a.page-numbers, #paginator span.page-numbers {
	display:				inline-block;
	font-size:				16px;
	line-height:			26px;
	text-decoration:		none;
    margin: 				2px 10px 2px 0;
	padding:				1px 8px 1px 8px;
	border:					1px solid #cccccc;	
}

#paginator span.current, #paginator a.page-numbers:hover {
	background:				#2e6499;
	color:					#ffffff;
}

#paginator a:hover {
	text-decoration:		none;
}

.pagination {
	padding-left:			15px;
	padding-right:			15px;	
}

a.goback {
	display:				block;
	text-decoration:		none;
	text-transform:			uppercase;
	margin: 				0 0 10px 0;
}

a.goback:hover {
	text-decoration:		underline;
}

a.goback:before {
	font-family: 			'Material Symbols Outlined';
	content:				"\e5cb";
	font-size:				32px;
	vertical-align:			middle;
	margin-left: 			-12px;
}


/* REVEAL ANIMATION */
.reveal {
	position: 				relative;
	transform: 				translateY(150px);
	opacity: 				0;
	transition: 			0.9s all ease;
}

.reveal.active{
	transform: 				translateY(0);
	opacity: 				1;
}


/* REVEAL ANIMATION FROM LEFT */
.reveal-from-left {  
	/* This section calls the slideInFromLeft animation we defined below */
	animation: 2s ease-out 0s 1 slideInFromLeft;
}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}


/* SOCIAL MEDIA */
div.social ul {
    padding-left: 		0;
}

div.social .icon {
	font-size:			26px;
}

div.social ul li {
	list-style: 		none;
	display: 			inline-block;
    padding-left: 		4px;
    padding-right: 		4px;
}

div.social ul li a {
	position: 			relative;
	display: 			block;
	overflow: 			hidden;
	width: 				42px;
	height: 			42px;
	background:			#ffffff;
	text-align: 		center;
	line-height: 		42px;
	font-size: 			18px;
	border-radius: 		50%;
	border: 			3px solid #ffffff;
	z-index: 			1;
	margin: 			0;
}

div.social ul li a .icon {
	position: 			relative;
	color: 				#333333;
	transition: 		.5s;
	z-index: 			3;
}

div.social ul li a:hover .icon {
	color: 				#fff;
	transform: 			rotateY(360deg);
}

div.social ul li a:before {
	content: 			"";
	position: 			absolute;
	top: 				0;
	left: 				0;
	width: 				100%;
	height: 			100%;
	background: 		#ffffff;
	transition: 		.5s;
	z-index: 			2;
}

div.social li a:hover:before {
	top: 				0;
}

div.social ul li.facebook-icon a:hover:before {
	background: 		#3b5999;
}

div.social ul li.instagram-icon a:hover:before {
	background: 		#dd4b39;
}

.social.icon:before {
    font-family: 		'Font Awesome 6 Free';
	font-weight: 		900;
	vertical-align:		middle;
}

.social.brand:before {
	font-family: 			'Font Awesome 5 Brands';
	font-weight: 			900;
	vertical-align:			middle;
}

a.instagram-icon:before {
    content:				"\e055";
}

a.facebook-icon:before {
    content:				"\f09a";
}

a.twitter-icon:before {
    content:				"\e61b";
}

a.linked-in-icon:before {
    content:				"\f08c";
}

a.email-icon:before {
    content:				"\f0e0";
}



/* PRIVACY POLICY PAGE */
body.privacy-policy {
	font-size: 				15px;
	line-height:			22px;	
}

body.privacy-policy h5 {
	font-size: 				16px;
	font-weight:			500;
	line-height: 			1.1em;
	margin: 				10px 0 5px 0;
}



/* RESPONSIVE MEDIA */
#media video {
    width: 					100%;
    height: 				auto;
}

#media video[poster] {
    width: 					100%;
    height: 				auto;
}

#media iframe,
#media object,
#media embed {
	width:					100%;
/*	height:					100%;
	position:				absolute; */
	top:					0;
	left:					0;
	object-fit:				cover; /* This works also */
}


/* RESPONSIVE MAP */
.google-maps {
	position: 				relative;
	overflow: 				hidden;
}

.google-maps iframe {
	width: 					100%;
	height: 				100%;
	min-height: 			450px;
	overflow-y: 			hidden;
	overflow-x: 			visible;
}


/* COLLASPE CONTENT */
.collapse > a,
.collapse > a:hover, 
.collapse > a:active, 
.collapse > a:focus  {
    text-decoration:        none;
}

.collapse a, .collapse a:active, .collapse a:focus {
    outline: 				none; 
}

.collapse:before {
	font-family: 			'Material Symbols Outlined';
	font-weight:			400;
	vertical-align:			middle;
}

 /* Icon when the collapsible content is shown */
.collapse.collapsed:after  {
	content: 				"\e88e";
}

/* Icon when the collapsible content is hidden */
.collapse.collapse:after {
	content: 				"\e88e";
} 


/* BUSINESS HOURS */
ul.business-hours {
	position: 				relative;
	width:					85%;
	padding: 				10px 0;
    margin: 				5px 0 5px 0;
}

ul.business-hours li {
	color: 					#eeeeee;
	line-height: 			25px;
	border-bottom: 			1px solid #d4d4d4;
	padding:				2px 0 2px 0;
	margin-top:				2px;
	margin-bottom:			2px;
}

ul.business-hours li span.pull-right {
	float:					right;
}

ul.business-hours li:last-child {
	border-bottom: 			none; 
}

ul.business-hours li.today {
	color: 					#fff499; 
}


/* BUTTON STYLE */
.button, a.button, .button a, input[type="submit"] {
	display:				inline-block;
	text-align:				center;
	text-decoration: 		none;
	background-color:		#000000;
	color: 					#ffffff;
	font-size: 				21px;
	line-height:			28px;
	font-weight:    		400;
	text-transform:			uppercase;
	border-radius: 			1px;
	transition: 			0.8s;
	padding:				12px 28px;
	margin:					0;
	
	border-width: 			0 0 0 15px;  /* top right bottom left */
	border-style: 			solid solid solid solid;
	border-color: 			#ffffff #ffffff #ffffff #39b54a;
}

.button:hover, a.button:hover, input[type="submit"]:hover {
	background:				#000000;
	color:					#ffffff;
	border-left: 			15px solid #fdc03c;
}


/* LIST STYLE */
ul, ol {
	margin-top:				15px;
	margin-bottom:			25px;
	padding-left:       	32px;
}

li {
	margin-bottom:			8px;
	padding-left:       	8px;
}

ul.checkmarkList {
    list-style: 			none;
	padding-left: 			6px;
}
 
ul.checkmarkList li:before {
    color: 					#2e6499;
    content: 				'✓ ';
    font-size: 				1.2em;
    font-weight: 			bold;
}


/* BACK TO TOP / SCROLL TO TOP */
a#back-to-top {
    position: 				fixed;
    bottom: 				35px;
    right: 					5px;
    z-index: 				9999;
    cursor: 				pointer;
    text-decoration: 		none;
    transition: 			opacity 0.2s ease-out;
}

a#back-to-top:before {
	font-family: 			'Material Symbols Outlined';
	content:				"\f5d2";
	font-size:				45px;
	color:					#d4d4d4;
	vertical-align:			middle;
}

a#back-to-top:hover {
    opacity: 				0.7;
	text-decoration:		none;
}


/* COOKIE BANNER */
#cn-notice-text a {
	color:					#ffffff;
}

span.cn-buttons-container, span.cn-text-container {
    display: 				block;
}


/* MOBILE VIEW */
/* Extra Large Devices (large laptops and desktops - 1440px and Up) */
@media (min-width: 1440px) {
	
}

/* Large Devices (laptops/desktops - 1024px and LESS) */
@media (max-width: 1024px) {
	.container { padding-top: 15px; padding-bottom: 15px; }
	h1, h1.wp-block-heading, #page-header .page-title h1 { font-size: 38px; line-height: 46px; margin: 4px 0 35px 0; }
	h2 { font-size: 36px; line-height: 38px; margin: 15px 0 5px 0; }
	div.wp-block-columns.is-layout-flex { gap: 0.7em; }

	div.media figure.wp-block-image { height: 350px; }
	body.home div.home-products { padding: 5px 12px 5px 12px; }
}

/* Medium Devices (tablets - 768px and LESS) */
@media (max-width: 768px) {
	div#primary, #main-content { padding: 25px 20px 35px 20px; }
	div.wp-block-columns.is-layout-flex { gap: 0.5em; }	
	input, optgroup, select, textarea { width: 100%; display: block; }
	div.media figure.wp-block-image { height: 280px; }

	#contact-page { margin-top: 5px; margin-bottom: 5px; }
	#contact-page ul.business-hours { width: 100%; }
	#contact-page .item { padding: 15px 15px 15px 15px; }
	#contact-page select, #contact-page input, #contact-page textarea { width: 100%; }
	#contact-page .store-photo { height: 460px; }
} 

/* Extra Small Devices (phones - 480px and LESS) */
@media (max-width: 480px) {
	div#primary, #main-content { padding: 25px 15px 15px 15px; }
	.container { padding-bottom: 15px; }
	.nobr { white-space: normal; }
	.divider { width: 34%; }
	#page-header .page-title h1 { margin: 0 0 28px 0; }
	
	div.media { margin: 0 0 25px 0; }
	div.media figure.wp-block-image { height: 220px; }	
	
	#contact-page .contact-info .item { padding: 55px 15px 15px 15px; }
	#contact-page .hours-of-operation { font-size: 15px; padding: 4px 15px 2px 15px; }
	#contact-page .store-photo { height: 260px; }
}

/* Small Devices (phones - 425px and LESS) */
@media (max-width: 430px) {
	body.home div.home-products h1.wp-block-heading { text-align: left; }
} 

/* Extra Small Devices (phones - 375px and LESS) */
@media (max-width: 375px) {

} 

/* Extra Small Devices (phones - 320px and LESS) */
@media (max-width: 320px) {

}