/******************************************************************
  Template Name: Phozogy
  Description:  Phozogy photography HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Service Section
6.  Categories Section
7.  Portfolio Section
8.  Trainer Section
9.  Contact
10.  Footer Style

-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Plus Jakarta Sans", sans-serif;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	margin: 0 !important;
	padding: 0  !important;
	font-weight: 400;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 200 to 800

.plus-jakarta-sans-<uniquifier> {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.julius-sans-one-regular {
  font-family: "Julius Sans One", sans-serif;
  font-weight: 400;
  font-style: normal;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 400 to 800

.eb-garamond-<uniquifier> {
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 600;
	font-family: "EB Garamond", serif;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 1em;
	font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 400;
	font-weight: 400;
	line-height: 26px;
	margin: 0 0 15px 0;
  font-size: 14px;
  line-height: 1.428571429;
  color: #333;
}

img {
	max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #fff;
}

ul,
ol {
	padding: 0;
	margin: 0;
}
 ul.lead {
 	list-style-type: circle;
 }
 .site-top-header {
    background: #ffef06;
    display: block;
 }
 .top-header {
 	background: #ffef06;
 	display: block;
 }
.top-header-left {
	float: left;
}
.top-header-left ul li {
	float: left;
  padding: 10px;
  list-style: none;
  color: #185702;s
}
.top-header-right {

}

.logo-text {
	float: left;
	line-height: 90px;
}
.logo-text img {
	height: 60px;
  margin-top: 7px;
  padding-left: 10px;
}
header {
  min-height: 70px;
}
.nav {
	float: right;
  line-height: 90px;
}


footer#contact {
	background: #00b915;
	padding: 70px 0;
}
footer#contact p {
	color: #fff;
	font-size: 18px;
}
footer#contact h5 {
	color: #ffffff;
  font-size: 26px;
  padding: 40px 0;
  text-align: left;
  text-transform: uppercase;
}
footer#contact .footer-box-title {
	text-align: center;
}

footer#contact .bookhotels {
	padding: 0 50px 50px 50px;
}

.nav-item a.nav-link {
	color: #000 !important;
	text-transform: uppercase;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	background: #ebf2ff !important;
}


.fs-widget ul li {
	color: #fff;
	padding: 5px;
  list-style-type: circle;
  margin-left: 35px;
  color: #8aee78;
}
.fs-widget ul li a {
	color: #d6fde3;
  text-decoration: none;
  text-transform: uppercase;
}

.fs-widget ul li a:hover {
  color: #fff;
}
.copyright-text {
	text-align: center;
	padding: 100px 0 0 0;
}

/*****    Hotel Section - Starts   **********/
.owl-prev, .owl-next
{
    position: absolute;
}
.owl-prev
{
    left: -60px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px !important;
    background-color: transparent !important;
    outline: none !important;
}
.owl-next
{
    right: -60px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px !important;
    background-color: transparent !important;
    outline: none !important;
}
section.hotel-section {
	margin: 70px 0px 70px 0px;
}
section.hotel-slider {
  margin-top: 150px;
}
section.hotel-section h3 {
	text-align: center;
	font-size: 2.5em;
}
section.hotel-section h4 {
	text-align: center;
	font-size: 1.1em;
  padding: 30px;
}
section.hotel-section div#hotels div.item div.hotel-item {
	border: 1px solid #eee;
	text-align: center;
}
section.hotel-section div#hotels div.item div.hotel-item div.hotel-price{
    text-decoration: line-through;
}
div.gift-item div.gift-price {
    text-decoration: line-through; 
}
div.sharebox div.rprice div.price{
   text-decoration: line-through; 
}
section.hotel-section div#hotels div.item div.hotel-item img {
	min-height: 300px;
}
section.hotel-section div#hotels div.item div.hotel-item h3 {
	font-size: 1.2em;
	padding: 10px 10px;
}

section.hotel-section div#hotels div.item div.hotel-item span.hotel-city {
	font-size: .8em;
	padding: 5px;
	display: block;
	text-align: center;
	color: #7d7d7d;
}
section.hotel-section div#hotels div.item div.hotel-item span.hotel-price {
	font-size: 1em;
	padding: 20px 10px;
	text-decoration: line-through;
}
section.hotel-section div#hotels div.item div.hotel-item span.hotel-final-price {
	font-size: 1em;
	padding: 20px 10px;
	font-weight: 800;
}

section.hotel-section div#hotels div.item div.hotel-item a.hotel_more {
  padding: 10px 15px;
  text-decoration: none;
  background-color: #f4fb26;
  color: #000;
  display: inline-block;
  margin: 15px; }

section.hotel-section div#hotels div.item div.hotel-item a.hotel_more:hover {
  background: #1abd24;
  color: #fff;
}
section.hotel-section div#hotels div.item div.hotel-item span.offer_percent {
  position: absolute;
  top: 10px;
  padding: 3px 5px;
  background: #8c0ef4;
  color: #fff;
  font-size: 13px;
  font-style: ;
  font-weight: bold;
  right: 0px;
}



/* hotel-city hotel-price hotel-final-price hotel_more */

/*****    Hotel Section - Ends   **********/



/*****    Gift Section - Starts   **********/

section.gift-section {
	margin: 100px 0px;
}
section.gift-section h3 {
  text-align: center;
  font-size: 2.5em;
}
section.gift-section h4 {
  text-align: center;
  font-size: 1.1em;
  padding: 30px;
}
section.gift-section div#gifts div.item div.gift-item {
	border: 1px solid #eee;
	text-align: center;
}
section.gift-section div#gifts div.item div.gift-item img {
	min-height: 300px;
	height: 300px;
}
section.gift-section div#gifts div.item div.gift-item h3 {
	font-size: 1.2em;
	padding: 10px 10px;
}
section.gift-section div#gifts div.item div.gift-item span.gift-city {
	font-size: .8em;
	padding: 5px;
	display: block;
	text-align: center;
	color: #7d7d7d;
}
section.gift-section div#gifts div.item div.gift-item span.gift-price {
	font-size: 1em;
	padding: 20px 10px;
	text-decoration: line-through;
}
section.gift-section div#gifts div.item div.gift-item span.gift-final-price {
	font-size: 1em;
	padding: 20px 10px;
	font-weight: 800;
}
section.gift-section div#gifts div.item div.gift-item a.gift_more {
  padding: 10px 15px;
  text-decoration: none;
  background-color: #f4fb26;
  color: #000;
  display: inline-block;
  margin: 15px; 
}
section.gift-section div#gifts div.item div.gift-item a.gift_more:hover {
  background: #1abd24;
  color: #fff;
}
section.gift-section div#gifts div.item div.gift-item span.gift_percent {
  position: absolute;
  top: 10px;
  padding: 3px 5px;
  background: #101115;
  color: #fff;
  font-size: 13px;
  font-style: ;
  font-weight: bold;
  right: 0px;
}

/*****    Gift Section - Ends   **********/

/*****    Products Section - Starts   **********/

section.product-section {
	margin: 150px 0px;
}
section.product-section h3 {
	text-align: center;
	font-size: 2.5em;
}
section.product-section h4 {
	text-align: center;
	font-size: 2.5em;
}
section.product-section div#products div.item div.product-item {
	border: 1px solid #eee;
	text-align: center;
}
section.product-section div#products div.item div.product-item img {
	min-height: 300px;
}
section.product-section div#products div.item div.product-item h3 {
	font-size: 1.2em;
	padding: 10px 10px;
}
section.product-section div#products div.item div.product-item span.product-city {
	font-size: .8em;
	padding: 5px;
	display: block;
	text-align: center;
	color: #7d7d7d;
}
section.product-section div#products div.item div.product-item span.product-price {
	font-size: 1em;
	padding: 20px 10px;
	text-decoration: line-through;
}
section.product-section div#products div.item div.product-item span.product-final-price {
	font-size: 1em;
	padding: 20px 10px;
	font-weight: 800;
}
section.product-section div#products div.item div.product-item a.product_more {
  padding: 10px 15px;
  text-decoration: none;
  background-color: #f4fb26;
  color: #000;
  display: inline-block;
  margin: 15px; 
}
section.product-section div#products div.item div.product-item a.product_more:hover {
  background: #fff;
  color: #08084a;
}

/*****    Products Section - Ends   **********/

header.sv-header .svmenu {
	display: inline-block;
	width: 100%;
	background: #ede6ff;
	color: #fff;
}
nav#menu {
	text-align: center;
	z-index: 99999;
}
ul.menu-section {
	margin-bottom:0;
}
.header .menu > ul > li {
	/*margin-left: 2.5rem !important;
	margin-right: 2.5rem !important;*/
	margin-left: 0.5rem !important;
	margin-right: 0.5rem !important;
	font-weight: bold;
	text-transform: uppercase !important;
}
.header .menu > ul > li > a {
	text-decoration: none;
  padding: 5px 18px;
}
.header .menu > ul > li > a:hover {
  color:#0e9d02 !important;
}
.header .menu > ul > li .menu-subs > ul > li > a {
	text-decoration: none;
}
.header .menu > ul > li .menu-subs > ul > li > a h3 {
	font-size: 20px;
}
.header .menu > ul > li.menu-item-has-children:hover .menu-subs {
	z-index: 999;
}
.header .menu > ul > li .menu-subs.menu-column-4 > .list-item .title h3 {
	font-size: 20px;
	text-decoration: none;
}
.header .menu > ul > li .menu-subs.menu-mega > .list-item > ul > li > a {
	text-decoration: none;
}


.banner-content {
	width: 100%;
	background: #1abd24;
}

.banner-content h3 {
	padding: 25px 50px;
	text-transform: uppercase;
	color: #fff;
	font-size: 40px;
}
.gallery-container {
	width: 100%;
}
.gallery-container .gallery-item img {
	width: 200px !important;
  height: 150px !important;
  float: left;
  margin: 10px 10px 10px 0 !important;
  border-radius: 5px;
}
.gallery-container .gallery-main img {
	width: 800px !important;
  height: 800px !important;
  margin: 10px !important;
  float: none;
}
section.hotel-gallery-section {
	display: inline-block;
  padding: 0px;
  width: 100%;
  margin: 20px auto;
}
section.hotel-gallery-section h1 {
  padding: 10px 0px;
  text-transform: uppercase;
  font-size: 23px;
  color: #26aa1a;
}
section.hotel-gallery-section h2 {
	padding: 10px 0px;
	text-transform: uppercase;
  font-size: 23px;
  color: #26aa1a;
}
section.hotel-gallery-section .gallery-box {
	background: #f7f5ff;
  border-radius: 10px;
}

section.hotel-gallery-section ul li {
  list-style-type: circle;
  margin: 20px;
}

section.gift-gallery-section {
  padding: 20px 0px;
}

section.gift-gallery-section .description-box {
  padding: 25px 0;
}

section.gift-gallery-section .description-box h2 {
  padding: 10px;
}
section.gift-gallery-section .description-box p {
  padding: 5px 10px;
}

.fa-social a i {
	padding: 5px;
  color: #004007;
  font-size: 25px;
}
.fa-social a i:hover {
	color:#fff;
}
footer p.footer-text {
	text-align: center;
  font-size: 20px;
}

.listings-details-desc .amenities-list {
  list-style-type: none;
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  margin: -20px -10px 35px;
}

.listings-details-desc .amenities-list li {
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 25px;
  list-style-type: none;
  margin: 0;
}

.listings-details-desc .amenities-list li span {
  display: block;
  color: var(--optionalColor);
  position: relative;
  padding-left: 38px;
  font-size: var(--fontSize);
  font-weight: 600;
}

.listings-details-desc .amenities-list li span i {
  width: 30px;
  height: 30px;
  display: inline-block;
  border-radius: 50%;
  line-height: 30px;
  color: var(--blackColor);
  background-color: #f5f5f5;
  text-align: center;
  font-size: 25px;
  position: absolute;
  left: 0;
  top: -5px;
  transition: var(--transition);
}

.listings-details-desc .amenities-list li span i {
  line-height: 30px;
  color: var(--blackColor);
  text-align: center;
  font-size: 20px;
}
.listings-details-desc .amenities-list li span:hover i {
  background-color: #29ec0e;
  color: #fff;
}

.bx-check::before {
  content: "\f00c";
}
.bx {
  font-family: FontAwesome !important;
  font-weight: 400;
  font-style: normal;
  font-feature-settings: normal;
  font-variant: normal;
  line-height: 1;
  text-transform: none;
}

.lines {
  top: 0;
  left: 0;
  right: 0;
  width: 90vw;
  z-index: -1;
  height: 100%;
  margin: auto;
  position: absolute;
}

.lines .line:nth-child(1)::after {
  animation-delay: 2s;
}
.lines .line::after {
  left: 0;
  top: -50%;
  content: "";
  width: 100%;
  height: 15vh;
  display: block;
  position: absolute;
  animation: run 7s 0s infinite;
    animation-timing-function: ease;
    animation-delay: 0s;
    animation-fill-mode: none;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(.4,.26,0,.97);
  background: linear-gradient(to bottom,rgba(255,255,255,0) 0%,#ca1313 75%,var(--whiteColor) 100%);
}

.ofrdetails-section h2 {
	font-size: 15px;
	padding: 20px 0px;
}

.details-box h3 {
	font-size: 18px;
  padding: 20px 0;
  color: #069d33;
}

.details-box .descbox {
	border: 1px solid #eee;
	background: #fbfbfb;
	border-radius: 10px;
}







div.boxproducts {
  width: 23%;
  margin: 10px;
  padding: 0;
  min-height: 520px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  position: relative;
  border: 1px solid #d3d3db;
}
div.boxproducts p {
  font-size: 14px;
  padding: 5px 0;
}
div.boxprice {
  color: #000;
  font-size: 13px;
  font-weight: bold;
  padding: 5px 0;
}
div.boxproname {
  color: #000;
  font-size: 15px;
  font-weight: bold;
}
span.boxcreated {
  color: #717171;
  font-size: 11px;
  bottom: 10px;
}
.boxname {
  font-size: 13px;
  color: #717171;
}
div.boximg {
  text-align: center;
}

.boximg img {
  height: 225px;
  text-align: center;
  display: inline-block;
}

.offer_percent {
  position: absolute;
  top: 10px;
  padding: 3px 5px;
  background: #06bb2b;
  color: #fff;
  font-size: 13px;
  font-style: ;
  font-weight: bold;
  right: 0px;
}
.boxviewmore {
	text-decoration: none;
  background: #0dc821;
  color: #fff;
  padding: 10px 10px;
  display: table;
  border-radius: 7px;
  transition: 0.3s;
  margin: auto;
  text-align: center;
  bottom: 0px;
  position: absolute;
  left: 30%;
  margin: 20px auto;
}
.boxviewmore:hover {
	background: #f7ff00;
  color: #2b7907;
  transition: .3s;
}

div.hotel_detailed_box {
	padding: 20px;
}
.loadmore {
	text-decoration: none;
  background: #0dc821;
  color: #fff;
  padding: 20px 20px;
  display: table;
  border-radius: 0px;
  transition: 0.3s;
  margin: auto;
  text-align: center;
  margin: 50px auto;
  border: none;
}


#result_para .searchbox {
  background: #fafeff !important;
  margin: 20px;
  width: 95% !important;
  color: #fff;
  padding: 9px !important;
  border-radius: 5px;
  border: 1px solid #ddd;
}

#result_para .searchbox h4 {
  padding: 2px 0;
  margin: 0;
    margin-bottom: 0px;
  font-size: 18px;
  font-weight: bold;
  color: #027b09;
}
#result_para .searchbox h3 {
  padding: 0;
  margin: 0;
    margin-bottom: 0px;
  font-size: 14px;
}

.top-header #search input {
  border: 0;
  border-radius: 3px;
  background-color: #fff;
  color: #28394c;
  padding: 10px 30px 10px 10px;
  width: 435px;
}
.top-header #search button {
  background: 0 0;
  border: 0;
  color: #28394c;
  cursor: pointer;
  padding: 0 10px;
  position: relative;
  top: 0;
  left: -55px;
  margin: 10px 20px 10px 10px;
}
.top-header #search {
  margin-top:1px;
}
#bookHotelRoom.btn-primary {
  text-decoration: none;
  background: #0dc821;
  color: #fff;
  border:none;
}
#bookHotelRoomcancel.btn-secondary {
  text-decoration: none;
  background: red;
  color: #fff;
  border:none;
}

.review-container {
  margin-top: 100px !important;
}

section.result-section {
  min-height: 500px;
  padding: 50px 50px;
}

.searchbox button {
  margin-top: 30%;
  position: relative;
  right: 30px;
  margin-left: 20px;
  background: #3bd510;
  border-radius:0;
  padding: 11px 12px;
  border: none;
}

.searchbox button:hover {
  background: #f7ff00 !important;
  color: #1b9103;
}

.time {
  color: #001505;
  font-weight: bold;
  font-size: 20px;
}

.offer_percent_search {
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  position: relative;
  top: 21px;
  background: #00cc17;
  width: 70px;
  left: 0px;
  padding: 0px 3px;
  border-radius: 0;
  float: right;
}
.homebanner {
  width:100%;
  height: 500px;
  object-fit: cover;
}
.homebanner img.home_banner_image {
  width:100%;
  height: 600px;
}

.owl-theme .owl-nav [class*="owl-"]:hover {
  color: #00b915 !important;
}

div.sharebox {
  text-align: left;
  padding-left: 20px;
  padding-right: 20px;
}
h2.ofrdetails {
  padding: 10px !important;
}

section.top-destination {
  margin: 20px 0px 100px 0px;
}
section.top-destination h3 {
  text-align: center;
  font-size: 2.5em;
}
section.top-destination h4 {
  text-align: center;
  font-size: 1.1em;
  padding: 30px 30px 0px 30px;
}
section.top-destination div span img {
  border-radius: 20px;
  width: 100%;
  padding: 0 0;
  margin: 0px;
}
section.top-destination div span span.text {
  font-size: 24px;
  position: relative;
  text-align: center;
  top: 110px;
  color: #fff;
  font-weight: 800;
  font-family: "Plus Jakarta Sans", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #1064e7;
  letter-spacing: 9px;
  border-bottom: 1px solid #1064e7;
  text-decoration: none;
}
section.top-destination a {
  text-decoration: none;
}
section.top-destination div span span.text:hover {
  color: black;
}

/*
div.reee {
  margin: 0;
  padding: 0;
  height: 200px;
  font-family: "Poppins", sans-serif;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

div.reee::before {
  content: "";
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #ffffff;
  mix-blend-mode: difference;
  pointer-events: none;
  z-index: 2;
}
div.reee::after {
  content: "";
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #110f10;
  pointer-events: none;
  z-index: -1;
}*/

div.reee marquee {
  color: #ffffff;
  font-size: 30px;
  font-weight: 700;
  text-transform: capitalize;
  background: #fdbe13;
}
div.reee marquee span{padding: 0 30px;}


















/**
 * Core, likely what you want to copy/paste with little change
 */
.marquee {
  overflow: hidden;
  display: block;
}

.marquee::before {
  display: block;
  white-space: pre;
  /* Abusing `content` property and `attr` function to duplicate content in CSS */
  content: attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text) "        " attr(data-text);
  width: fit-content;
  transform: translate3d(-2%, 0, 0);
  will-change: transform;
}

/**
 * Only run animations when reduced motion is not set
 * Thanks @patrick_h_lauke@mastodon.social for the heads up!
 */
@media (prefers-reduced-motion: no-preference) {
  .marquee::before {
    animation: marquee 6s linear infinite;
  }
  
  .marquee--reverse::before {
    animation-direction: reverse;
  }
}

@keyframes marquee {
  0% {
    /**
     * -2% is used to start scrolling with an offset (visual only)
     */
    transform: translate3d(-2%, 0, 0);
  }
  100% {
    /**
     * -2% offset has to be preserved
     *
     * Content is duplicated 20 times
     * 100% / 20 = 5 % = "1 content length"
     * 
     * -1px seems to prevent a small jump between each loop
     */
    transform: translate3d(calc(-2% - 5% - 1px), 0, 0);
  }
}

/**
 * From here, style marquee however you'd like
 */
.marquee {
  margin: 0;
  display: flex;
  align-items: center;
  font-size: clamp(1rem, 4vh, 3rem);
  flex: 1;
}

.marquee--navy {
  color: #ffffff;
  font-size: 30px;
  font-weight: 700;
  text-transform: capitalize;
  background: #fdbe13;
}
.marquee--beet {
  background: #a54a5e;
  color: #fff;
}
.marquee--flamingo {
  background: #e84311;
}
.marquee--ochre {
  background: #f27502;
}
.marquee--butter {
  background: #ffb005;
}
.marquee--mantis {
  background: #759f53;
}



.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}













@media only screen and (min-width: 320px) and (max-width: 480px) {
  div#navigation {
    position: absolute;
    top: 60px;
    padding-right: 20px !important;
  }
  div.top-header-left {
    display: none;
  }
  div.top-header {
    width: 100% !important;
  }
  .top-header #search input {
    font-size: 14px;
    width: 95% !important;
    margin: 2px 5px 2px 0px !important;
  }
  .top-header #search button {
    right: 0;
    position: absolute;
    left: 290px;
    padding: 0;
    margin: 0 !important;
    top: 15px;
    float: left;
  }
  div.boxproducts {
    width: 95%;
  }
  div#result_para div.searchbox div.linkbutton a {
    text-align: center;
    display: block;
  }
  div#animated-thumbnails-gallery {
    height: auto !important;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  .homebanner {
    width: 100%;
    height: 150px;
  }
  .homebanner img.home_banner_image {
    width: 100%;
    height: 280px;
    object-fit: contain;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
  .banner_image {
    min-height: 300px;
  }
}
@media (min-width: 481px) and (max-width: 568px) {
   div#navigation {
    position: absolute;
    top: 60px;
    padding-right: 20px !important;
  }
  .banner_image {
    min-height: 300px;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
  div.top-header-left {
    display: none;
  }
  div.top-header {
    width: 100% !important;
  }
  .top-header #search input {
    font-size: 14px;
    width: 340px;
    margin: 5px 5px 5px 0px;
  }
  div.boxproducts {
    width: 95%;
  }
  div#result_para div.searchbox div.linkbutton a {
    text-align: center;
    display: block;
  }
  div#animated-thumbnails-gallery {
    height: auto !important;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  .homebanner {
    width: 100%;
    height: 200px;
  }
  .homebanner img.home_banner_image {
    width: 100%;
    height: 320px;
    object-fit: contain;
  }
}
@media (min-width: 569px) and (max-width: 667px) {
  div.top-header-left {
    display: none;
  }
  div.top-header {
    width: 100% !important;
  }
  .top-header #search input {
    font-size: 14px;
    width: 375px;
    margin: 5px 5px 5px 0px;
  }
  div.boxproducts {
    width: 45%;
  }
  div#result_para div.searchbox div.linkbutton a {
    text-align: center;
    display: block;
  }
  div#animated-thumbnails-gallery {
    height: auto !important;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
}
@media (min-width: 667px) and (max-width: 768px) {
  div.top-header-left {
    display: none;
  }
  div.top-header {
    width: 100% !important;
  }
  .top-header #search input {
    font-size: 14px;
    width: 375px;
    margin: 5px 5px 5px 0px;
  }
  div.boxproducts {
    width: 45%;
  }
  div#result_para div.searchbox div.linkbutton a {
    text-align: center;
    display: block;
  }
  div#animated-thumbnails-gallery {
    height: auto !important;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
}
@media (min-width: 769px) and (max-width: 978px) {
  .top-header #search input {
    position: relative;
    top: 20px;
  }
  .top-header #search button {
    position: relative;
    top: -20px;
    left: 450px;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  div.boxproducts {
    width: 33%;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
}
@media (min-width: 979px) and (max-width: 1024px) {
.top-header #search input {
    position: relative;
    top: 20px;
  }
  .top-header #search button {
    position: relative;
    top: -20px;
    left: 450px;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
  .banner {
    min-height: 200px !important;
    max-height: 200px !important;
    height: 200px !important;
  }
  .banner-slider {
    height: 300px !important;
  }
  .banner_overlay_header {
    font-size: 30px !important;
  }
  .banner_overlay_subhead {
    font-size: 20px !important;
  }
  .banner_overlay_container {
    padding: 45px 50px !important;
    top: 0px !important;
  }
}
@media (min-width: 1025px) and (max-width: 1315px) {
.top-header #search input {
    position: relative;
    top: 20px;
  }
  .top-header #search button {
    position: relative;
    top: -20px;
    left: 450px;
  }
  div.sharebox {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }
  h2.ofrdetails {
    padding: 10px !important;
  }
}

@media (min-width: 1315px) and (max-width: 1824px) {}
@media only screen and (min-width: 320px) and (max-width: 480px) {}
@media (min-width: 481px) and (max-width: 568px) {}
@media (min-width: 569px) and (max-width: 667px) {}
@media (min-width: 667px) and (max-width: 768px) {}
@media (min-width: 769px) and (max-width: 978px) {}
@media (min-width: 979px) and (max-width: 1024px) {}
@media (min-width: 1025px) and (max-width: 1224px) {}
@media (min-width: 1225px) and (max-width: 1824px) {}