/*==============================================

[Main stylesheet style.css]



Author:	SINDEVO.COM - Smart Interface Development

Version:	2.0

Created:	22 January 2018

Last updated:	05 July 2018

Template:	BLIX - Mobile HTML Template

================================================*/

/*

[Table of Contents]



1. RESET

2. GENERAL

3. H TITLES

4. HEADER AND HEADER NAVIGATION

5. CUSTOM BUTTONS

6. LEFT AND RIGHT SLIDE PANELS

    6-1. USER ACCOUNT SIDEBAR RIGHT

    6-2. MAIN NAVIGATION SIDEBAR LEFT

7. PAGES LAYOUT GENERAL

    7-1. SWIPE SLIDER

    7-2. FEATURED LISTS

    7-3. TEAM DESIGN LAYOUT

    7-4. MUSIC LIST DESIGN LAYOUT

8. POPUPS

9. SHOP LAYOUT

     9-1. SHOP ITEM PAGE

     9-2. SHOPPING CART - CECKOUT

     9-3. SUCCESS PAGE

10. PHOTO GALLERY

11. BLOG LAYOUT

12. FORMS

      12.1 LOGIN FORM

      12.2 CONTACT FORM

13. TABS / ACCORDION / TABLES

14. MEDIA QUERIES

*/

/*===============================================*/

/* 1. RESET		 						 */

/*===============================================*/

@import "css/reset.css";



/*===============================================*/

/* 2. GENERAL		 						 */

/*===============================================*/

.pages
{
  font-family: Lato!important;
}
/*=============== header ===================*/
.arrow-left
{
  width: 20px;
}
#header2-section {
  display: inline-block;
}

.title-logo
{
  width: 100px;
  display:block;
  margin:auto;
}

.profile,.login
{
     display: inline-block;
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
    font-family: Rubik, sans-serif;
    padding-top: 2%;
    font-weight: 600;
    color: #434b53;
}
.back-button-area {
  display: inline-block;
  margin-top: 20%;
  height: 20px;
  float: left;
  background: white;
  padding: 9px;
  border-radius: 5px;
  box-shadow: 4px 8px 16px 2px rgb(0 0 0 / 10%);
}
.navigation-button{
  position: absolute;
  right: 5%;
  display: inline-block;
  margin-top: 0%;
  z-index:999;
  background: white;
  padding: 9px;
  border-radius: 5px;
  box-shadow: 4px 8px 16px 2px rgb(0 0 0 / 10%);
  max-width: 20px;

}
.navigation-bar
{

  width: 20px;

}


/*=============== menu ===================*/


#menu_modal
{

  right: 0px;
  position: absolute;
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0px;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

}

#modal-content-menu
{
  z-index: 999;
  background-color: #fefefe;
  margin: auto;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  border: 1px solid #888;
  width: 80%;
  border-radius: 12px;
}


.close-modal
{
 height: 22px;
 width: 22px;
 background-color: grey;
 opacity:0.8;
 border-radius: 5px;
 text-align: center;
 margin-bottom: 10px;

}


.close-item
{
    margin: 0;
    background-color: grey;
    opacity: 0.8;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 10px;
    padding: 3px;
}
.close-option
{
    margin: 10;
    background-color: grey;
    opacity: 0.8;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 10px;
    padding: 3px!important;
    float: right;
}
.close-modal-login
{
/* height: 22px;
 width: 22px;
 background-color: grey;
 opacity:0.8;
 border-radius: 5px;
 text-align: center;
 margin-bottom: 10px;
 float: right;
 color: white;*/
 float: right;

}
.close-modal2
{
  margin-top: 10px;
  margin-right: 10px;
  float: right;
  height: 22px;
  width: 22px;
  background-color: grey;
  opacity:0.8;
  border-radius: 5px;
  text-align: center;

}


.close-modal span{
  color: white;
  font-size:20px;
  bottom: 4px;
  right: 3.5px;
  position: relative;

}
.close-text{
 color: white!important;
 font-size:20px!important;
 bottom: 13px!important;
 left: 2.5px!important;
 position: relative!important;
}
.modal-close
{
  display: none;
}



/*=============== body ===================*/

html,

body {

  position: relative;

  height: 100%;

  width: 100%;

  overflow-x: hidden;

}

body {

  font-family: Lato!important;

  margin: 0;

  padding: 0;

  color: #232323;

  font-size: 14px;

  line-height: 1.4;

  width: 100%;

  -webkit-text-size-adjust: 100%;

  overflow: hidden;

  font-weight:300;

}

.clear{

  clear:both;

  display:block;

}

.clearleft{

  clear:both;

  float:left;

  display:block;

}

a {

  text-decoration: none;

  color: #484848;

}

p{

  padding:0px;

  margin:0px;

  line-height:20px;

}

blockquote{

  background:#dfe0e3;

  padding:20px;

  margin:0 0 20px 0;

  font-size:22px;

  line-height:30px;

  font-weight:300;

}

blockquote span{

  display:block;

  color:#222222;

  font-weight:700;

  font-size:18px;

  text-transform:uppercase;

  line-height:30px;

}

.videocontainer{

  max-width:100%;

  padding:0;

  display: block;

  margin:0;

}

#mobile_wrap{

  width:100%;

  margin:auto;

}

.info_popup{

  width:90%;

  padding:10px 2%;

  position:fixed;

  bottom:30px;

  left:3%;

  font-size:12px;

  z-index:999999;

  background-color:#000;

  color:#fff;

  font-weight:300;

  border-radius:5px;

  -moz-border-radius:5px;

  -webkit-border-radius:5px;

}

.info_popup:before{

  content:"";

  position:absolute;

  bottom:-15px;

  left:45%;

  border-width:15px 15px 0 15px;

  border-style:solid;

  border-color:#000 transparent;

  display:block;

  width:0;

}

.info_popup h2{

  width:100%;

  text-align:center;

  color:#fff;

  font-size:18px;

  font-weight:700;

  letter-spacing:-0.2px;

  padding:0;

  margin:0px;

}

.info_popup h3{

  width:100%;

  text-align:center;

  color:#fff;

  font-size:13px;

  font-weight:700;

  letter-spacing:-0.2px;

  padding:0 0 5px 0;

  margin:0px;

}

.info_popup p{

  text-align:center;

  line-height:16px;

}

.info_popup i{

  text-align:center;

  line-height:16px;

  width:100%;

  display:block;

  font-style:italic;

  padding:0 0 10px 0;

  color:#ddd;

}

.info_popup span{

  font-weight:700;

}

.close_info_popup{

  position:absolute;

  top:0px;

  right:-30px;

  z-index:9999999;

  cursor:pointer;

}

.close_info_popup img{

  display:block;

  width:50%;

}

/*===============================================*/

/* 3. H TITLES		 						 */

/*===============================================*/

/*h1, h2, h3, h4, h5, h6{

	font-weight:300;

	letter-spacing:0.5px;

	color:#fff;

	padding:0 0 20px 0;

	margin:0;

}*/

h1{

	font-size:60px;



}
/*
h2{

	font-size:26px;

}*/

h3{

	font-size:22px;

}

h4{

	font-size:20px;

}

h5{

	font-size:18px;

}

h6{

	font-size:16px;
  font-weight: 600;

}

h2.page_title{

  width:90%;

  font-size:20px;

  line-height:25px;

  font-weight:300;

  padding:20px 0 15px 0;

  margin:12% 4% 15px 4%;

  border-bottom:1px #f0f0f0 solid;

  display:inline-block;

  letter-spacing:-0.5px;

}

h2.page_title span{

  font-size:12px;

  font-weight:700;

  letter-spacing:0.5px;

  background-color:#0be0af;

  padding:5px;

  margin:0 0 0 5px;

}

h2.blog_title{

  width:90%;

  font-size:24px;

  line-height:28px;

  font-weight:300;

  padding:10px 0 15px 0;

  margin:0px 5% 15px 5%;

  border-bottom:1px #f0f0f0 solid;

  display:inline-block;

  letter-spacing:-0.5px;

}

h3.page_subtitle{

  width:95%;

  font-size:16px;

  line-height:25px;

  font-weight:300;

  padding:10px 0 10px 5%;

  margin:0px 0 15px 0;

  background-color:#0be0af;

  display:inline-block;

  letter-spacing:-0.5px;

}

/*===============================================*/

/* 4. HEADER AND HEADER NAVIGATION */

/*===============================================*/

.navbarpages{

  position: fixed;

  top:0;

  left:0;

  width:100%;

  z-index:999999;

}

/* HEADER LEFT */

.navbar_left{

  float:left;

  width:20%;

  padding:0 0 0 2%;

}

.navbar_left a img{

  display:inline-block;

  width:24px;

  padding:12px 0 0 0;

}

.arrow--left{

  border: solid #fff;

  border-width: 0 2px 2px 0;

  margin:18px 0 0 0;

  display: inline-block;

  padding: 6px;

  transform: rotate(135deg);

  -webkit-transform: rotate(135deg);

}

.page-content{
  max-width: 500px;
  margin: 0 auto;
}

.logo_text{

  font-size:34px;

  line-height:70px;

  font-weight:900;

  padding-bottom: 15px;

}

.logo_text a{

  color:#ffffff;

}

.logo_text a span{

  color:#0be0af;

}

.logo_image a img{

  display:inline-block;

  max-width:17%;

  padding:23px 0 0 0;

}

/* HEADER CENTER */

.navbar_center{

  position:absolute;

  left:25%;

  width:50%;

  padding:0;

  text-align:center;

}

.navbar_center h2{

  padding:0px;

  margin:0px;

  line-height:70px;

  font-size:16px;

  font-weight:300;

}

.navbar_center h2 a{

  display:inline-block;

  color:#FFFFFF;

}

/* HEADER RIGHT */

.navbar_right{

  float:right;

  width:55px;

  height:55px;

  text-align:center;

  margin:10px 0 0 0;

  position:relative;

}

.navbar_right.navbar_right_menu{

  padding-right:2%;

}

.navbar_right span{

  position:absolute;

  top:5px;

  right:0;

  font-size:10px;

  width:15px;

  height:15px;

  background-color:#445cfd;

  color:#fff;

  -webkit-border-radius:50%;

  -moz-border-radius:50%;

  border-radius:50%;

  text-align:center;

  line-height:15px;

  -webkit-box-shadow: 0px 0px 4px 0px #303030;

  -moz-box-shadow:    0px 0px 4px 0px #303030;

  box-shadow:         0px 0px 4px 0px #303030;

}

.navbar_right img{

  display:inline-block;

  max-width:55%;

  padding:12px 0 0 0;

}

.navbarpages.navbarpagesbg{

  background-image: url(https://d208quqxsjalxm.cloudfront.net/coverimage/taiwan-recipe.jpeg);
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;

}

/*===============================================*/

/* 5. CUSTOM BUTTONS */

/*===============================================*/

a.button_full{

  width:100%;

  display:inline-block;

  padding:20px 0;

  margin:0 auto 20px auto;

  font-size:18px;

  text-align:center;

}

a.button_small{

  background-color:#0be0af;

  display:inline-block;

  color:#222222;

  padding:10px 20px;

  text-align:center;

  -webkit-appearance: none;

}

.button {

  border: none;

  color: #222222;

  text-decoration: none;

  text-align: center;

  display: block;

  border-radius: 0px 0px 0px 0px;

  line-height: 38px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  -webkit-appearance: none;

  -moz-appearance: none;

  -ms-appearance: none;

  appearance: none;

  background: none;

  padding: 0 10px;

  margin: 0;

  height:40px;

  white-space: nowrap;

  position: relative;

  overflow: hidden;

  text-overflow: ellipsis;

  font-size: 14px;

  font-family: Lato!important;

  cursor: pointer;

  background-color:#f7f7f7;

}

.button.active {

  background: #0be0af;

  color: #222222;

}

.buttons-row .button:first-child {

	border-radius: 0px 0px 0px 0px;

	border-left-width: 0px;

}

.buttons-row .button:last-child {

	border-radius: 0px 0px 0px 0px;

}

.btyellow{

  background-color:#0be0af;

  color:#222222;

}

.btmint{

  background-color:#61bb7e;

  color:#fff;

}

/*===============================================*/

/* 6. LEFT AND RIGHT SLIDE PANELS */

/*===============================================*/

.panel {

  z-index: 1000;

  display: none;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  overflow: auto;

  -webkit-overflow-scrolling: touch;

  position: absolute;

  width: 300px;

  top: 0;

  height: 100%;

  -webkit-transform: translate3d(0, 0, 0);

  transform: translate3d(0, 0, 0);

  -webkit-transition-duration: 400ms;

  transition-duration: 400ms;

  color:#222222;

}

.panel-left, .pagepanel{

  background-color:#445cfd;

}

.panel-right{

  background-color:#445cfd;

}



/* 6-1. USER ACCOUNT SIDEBAR RIGHT */



.user_login_info{

  padding:0px;

}

.user_thumb{

  width:100%;

  margin:auto;

  position:relative;

}

.user_thumb img{

  display:block;

  max-width:100%;

  z-index:777;

}

.user_details{

  position:absolute;

  bottom:0px;

  left:0px;

  width:100%;

  height:132px;

  z-index:888;

  background:url(images/trans_black_gradient.png) repeat-x;

}

.user_details p{

  padding:70px 0 0 10px;

  text-align:left;

  font-size:14px;

  color:#eaca02;

}

.user_details p span{

  display:block;

  font-size:22px;

  padding:5px 0 0 0;

  color:#ffffff;

}

.user_avatar{

  z-index:999;

  position:absolute;

  bottom:15px;

  right:15px;

  width:30%;

}

.user_avatar img{

  display:block;

  max-width:100%;

  margin:10px 0 0 0;

  border-radius:50%;

}

.user-nav{

  padding:20px 5% 0 5%;

  width:90%;

}

.user-nav ul{

  width:100%;

  list-style:none;

  padding:0px;

  margin:0px;

  display:block;

}

.user-nav ul li{

  width:90%;

  list-style:none;

  padding:5px 0 10px 0;

  margin:0 0 0 5%;

  display:inline-block;

  text-align:center;

  border-bottom:1px #556afb solid;

}

.user-nav ul li img{

  display:inline-block;

  max-width:12%;

  float:left;

}

.user-nav ul li span{

  display:block;

  float:left;

  text-align:left;

  padding:5px 0 0 20px;

}

.user-nav ul li strong{

  display:block;

  float:right;

  text-align:left;

  margin:0 5px 0 0;

  width:30px;

  height:30px;

  line-height:30px;

  text-align:center;

  -webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;

  background-color:#eaca02;

  color:#445cfd;

}

.user-nav ul li a{

  font-size:14px;

  font-weight:300;

  color:#d1d7ff;

}



/* 6-2. MAIN NAVIGATION SIDEBAR LEFT */



/* NAVIGATION STYLE UNDERLINE */

.main_nav_underline{

  padding:10px 1%;

  width:98%;

  float:left;

  clear:both;

}

.main_nav_underline ul{

  width:96%;

  list-style:none;

  padding:0 0 60px 0;

  margin:0 auto;

  display:block;

}

.main_nav_underline ul li{

  width:96%;

  list-style:none;

  padding:5px 0 10px 0;

  margin:0 2%;

  display:block;

  float:left;

  clear:both;

  text-align:left;

  border-bottom:1px #556afb solid;

}

.main_nav_underline ul li.subnav{

  background:url(images/subnav_white.png) no-repeat right top;

}

.main_nav_underline ul li img{

  display:inline-block;

  max-width:8%;

  float:left;

  opacity:0.8;

  margin:5px 0 0 0;

}

.main_nav_underline  ul li span{

  display:block;

  float:left;

  text-align:left;

  padding:5px 0 0 20px;

}

.main_nav_underline ul li a{

  width:96%;

  float:left;

  clear:both;

  display:block;

  font-size:14px;

  font-weight:300;

  color:#d1d7ff;

  line-height:20px;

}

/* NAVIGATION STYLE 2 ICONS ON ONE ROW WITH BORDER */



.main_nav_icons_inline_2{

  padding:0px;

  width:100%;

}

.main_nav_icons_inline_2 ul{

  width:90%;

  list-style:none;

  padding:0px;

  margin:5%;

  display:block;

  float:left;

  clear:both;

}

.main_nav_icons_inline_2 ul li{

  width:44%;

  list-style:none;

  padding:25px 2%;

  display:inline-block;

  float:left;

  text-align:center;

  border-bottom:1px #7586fe solid;

  border-right:1px #7586fe solid;

}

.main_nav_icons_inline_2 ul li:nth-child(2n) {

  border-right:none;

}

.main_nav_icons_inline_2 ul li:last-child, .main_nav_icons_inline_2 ul li:nth-last-child(2) {

  border-bottom:none;

}

.main_nav_icons_inline_2 ul li img{

  display:inline-block;

  max-width:25%;

}

.main_nav_icons_inline_2 ul li span{

  display:block;

  text-align:center;

  padding:5px 0 0 0;

}

.main_nav_icons_inline_2 ul li a{

  font-size:10px;

  font-weight:400;

  color:#fff;

  letter-spacing:1px;

  text-transform:uppercase;

}

.main_nav_icons_inline_2 ul li.subnav{

  background:url(images/subnav_white.png) no-repeat right top;

}



/* NAVIGATION STYLE 2 ICONS ON ONE ROW WITH BORDER */

.main_nav_icons_inline_3{

  padding:0px;

  width:100%;

}

.main_nav_icons_inline_3 ul{

  width:90%;

  list-style:none;

  padding:0px;

  margin:5%;

  display:block;

  float:left;

  clear:both;

}

.main_nav_icons_inline_3 ul li{

  width:33%;

  list-style:none;

  padding:15px 0;

  display:inline-block;

  float:left;

  text-align:center;

  border-bottom:1px #7586fe solid;

  border-right:1px #7586fe solid;

}

.main_nav_icons_inline_3 ul li:nth-child(3n) {

  border-right:none;

}

.main_nav_icons_inline_3 ul li:last-child, .main_nav_icons_inline_3 ul li:nth-last-child(2), .main_nav_icons_inline_3 ul li:nth-last-child(3) {

  border-bottom:none;

}

.main_nav_icons_inline_3 ul li img{

  display:inline-block;

  max-width:35%;

}

.main_nav_icons_inline_3 ul li span{

  display:block;

  text-align:center;

  padding:0 0 0 0;

  letter-spacing:0.5px;

}

.main_nav_icons_inline_3 ul li a{

  font-size:8px;

  font-weight:400;

  color:#fff;

  text-transform:uppercase;

}

.main_nav_icons_inline_3 ul li.subnav{

  background:url(images/subnav_white.png) no-repeat right top;

}







.subnav_header{

  width:90%;

  margin:0;

  float:left;

  clear:both;

  padding:10px 5%;

  background-color:#4155db;

}

.subnav_header a{

  display:block;

  width:100%;

  color:#d1d7ff;

}

.subnav_header a img{

  display:inline-block;

  max-width:8%;

  float:left;

  opacity:0.8;

  margin:5px 0 0 0;

}

.subnav_header a span{

  display:block;

  float:left;

  text-align:left;

  padding:5px 0 0 20px;

}



.tc { text-align: center; }

/*===============================================*/

/* 7. PAGES LAYOUT GENERAL */

/*===============================================*/


.homepage{

  background-color: #cdb6e9;
  background-image: linear-gradient(315deg, #cdb6e9 32%, #37d5d6 74%);

}

/* updated 13/9/2021 */
.fixed-bottom-footer{
 
}
/* added 3 lines */
/* modified 1 line */
#pages_maincontent{
  width:100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /* added  */
  height:100%;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* updated 13/9/2021 */
/* added 1 line */
#pages_maincontent::-webkit-scrollbar {
  display: none;
}

#pages_maincontent.chat{

	bottom: 50px;

}

#pages_maincontent p{

  padding:0px;

  clear:both;

}

#pages_maincontent img{

  display:block;

  max-width:100%;

}

.layout_fullwidth{

  width:100%;

}

.layout_fullwidth_padding{

  width:90%;

  margin:0 5%;

}

.page_single ul.simple_list{

  padding:0px 0 20px 10px;

  margin:0px;

  list-style:none;

}

.page_single ul.simple_list li{

  margin:0 0 10px 0;

  padding:0 0 0 20px;

  background:url(images/bullet.png) no-repeat left;

}





.bottom_menu_open{

  position: fixed;

  bottom:0px;

  right:0px;

  overflow: hidden;

  z-index: 999999;

  height:60px;

  background-color:#0be0af;

  width:20%;

}

.bottom_menu_open a{

  display:block;

  width:100%;

  text-align:center;

  padding:0;



}

.bottom_menu_open a img{

  display:inline-block;

  max-width:10%;

  padding:10px 0 0 0;

}

/* 7-1. SWIPE SLIDER */

/*.swiper-wrapper{
  padding-top: 30px;
}
*/
.swiper-container {

  height:100%;

}

.swiper-container-pages {

  height: auto;

  margin: 0 auto 20px auto;

  position: relative;

  overflow: hidden;

  /* Fix of Webkit flickering */

  z-index: 1;

}

.swiper-container-team {

  height: auto;

  margin: 0 auto 20px auto;

  position: relative;

  overflow: hidden;

  /* Fix of Webkit flickering */

  z-index: 1;

}

.swiper-container-toolbar {

  width:100%;

  padding:0 0 1% 0;

  height: auto;

  margin:auto 0;

  bottom:0;

  left:0px;

  overflow: hidden;

  z-index: 999999;

  height:auto;

}

.swiper-slide {

  height:auto;

  width:100%;

  text-align:left;

  -webkit-background-size: 100%;

  -moz-background-size: 100%;

  -o-background-size: 100%;

  background-size: 100%;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

  background-position:center center;

}

.toolbar-icon a{

  display:block;

  width:30.4%;

  margin:1.4%;

  padding:1% 0;

  float:left;

  height:auto;

  text-align:center;

  /* background-color:#fff; */

  background-color:#fff;

  -webkit-border-radius: 6px;

  -moz-border-radius: 6px;

  border-radius: 6px;

}

.toolbar-icon a img{

  display:block;

  max-width:30%;

  margin:0 auto 10px auto;

  text-align:center;

  width: 49%;

}

.toolbar-icon a span{

  color:#3f5761;

  font-weight:500;

  font-size:16px;

  letter-spacing:0.5px;

}

.slider_trans{

  position:absolute;

  top:0px;

  left:0px;

  width:100%;

  height:100%;

  z-index:9999;

  background:url(images/trans_black.png) repeat;

}

.slider-caption{

  margin-bottom: 60px;

}

.slidertoolbar .slider-caption{

  bottom:46%;

  width: 100%;
  text-align: center;

}

.slider-caption h2{

  width:100%;

  display:block;

  padding:0px;

  margin:-4px 0 -2px 0;

  font-size:47px;

  font-weight:900;

  letter-spacing:1px;

  color:#ffffff;

  text-shadow: -3px 2px 11px rgb(150 147 150);

  line-height:50px;

}

.slider-caption span.subtitle{

  width:100%;

  margin:0;

  font-size:12px;

  padding:5px;

  font-weight:300;

  color:#fff;

  background-color:#445cfd;

  display:inline;

}

.slider-caption p{

  color: #fff;

  text-shadow: -2px 1px 2px rgb(150 147 150);

  font-size:22px;

  line-height:22px;

  letter-spacing: 0.5px;

}

.swiper-container > .swiper-pagination {

  bottom: 5%;

  left: 0;

  width: 95%;

}

.slidertoolbar > .swiper-pagination {

  bottom: 22%;

  left: 2%;

  width: 95%;

}

.swiper-pagination-bullet {

  width: 6px;

  height: 6px;

  display: inline-block;

  border:1px solid #fff;

  background:none;

  opacity: 0.5;

  -webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;

}

.swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet {

  margin: 0 2px;

}

.swiper-container-pages > .swiper-pagination {

  bottom: 5%;

  left: 5%;

  width: 95%;

}

.swiper-container .swiper-pagination-bullet-active {

  opacity: 1;

  border:1px solid #445cfd;

}

.swiper-container-pages .swiper-pagination-bullet-active {

  opacity: 1;

  background: #445cfd;

}

.swiper-pagination-toolbar{

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  text-align:center;

}

.swiper-container-toolbar .swiper-pagination-bullet {

  width: 6px;

  height: 6px;

  display: inline-block;

  background: #000;

  opacity: 0.2;

  margin:0 2px;

  border:none;

}

.swiper-container-toolbar .swiper-pagination-bullet-active {

  opacity: 1;

  background: #000;

}

.swiper-pagination-team, .swiper-pagination-teambigger{

  width: 100%;

  text-align:center;

}

.swiper-container-team .swiper-pagination-bullet {

  width: 4px;

  height: 4px;

  display: inline-block;

  background: #000;

  opacity: 0.2;

  margin:0 2px;

}

.swiper-container-team .swiper-pagination-bullet-active {

  opacity: 1;

  background: #000;

}

.swiper-button-prev, .swiper-button-next {

  position: absolute;

  top:auto;

  -webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;

}

.swiper-button-next{

	background:url(images/nav-next.png) no-repeat center #445cfd;

	width: 40px;

  height: 40px;

  bottom:22%;

  right:2.5%;

}

.swiper-button-prev{

	background:url(images/nav-prev.png) no-repeat center #445cfd;

	width: 40px;

  height: 40px;

  bottom:22%;

  right:6%;

  left:auto;

}

.swiper-container-pages .swiper-button-next{

	bottom:6%;

}

.swiper-container-pages .swiper-button-prev{

	bottom:6%;

}



/* 7-2. FEATURED LISTS */



ul.features_list{

  padding:0 0 20px 0;

  width:100%;

  margin:0px;

  list-style:none;

  float:left;

  clear:both;

}

ul.features_list li{

  border-bottom:1px #e6e6e6 solid;

  padding:0 2% 20px 2%;

  margin:0 0 20px 0;

  display:block;

  width:43%;

  float:left;

  font-size:18px;

}

ul.features_list li:nth-child(even){

  float:right;

}

ul.features_list li a{

  color:#000;

  padding:0px;

  margin:0px;

}

ul.features_list li img{

  display:inline-block;

  width:10%;

  float:left;

  margin:0px;

  padding:0px;

}

ul.features_list li span{

  display:inline-block;

  max-width:90%;

  padding:2% 0 0 5%;

  font-weight:400;

  float:left;

}





ul.features_list_detailed{

  padding:0 0 20px 0;

  width:100%;

  margin:0px;

  list-style:none;

  float:left;

  clear:both;

}

ul.features_list_detailed li{

  padding:20px 2%;

  margin:0;

  display:block;

  width:43%;

  float:left;

  border-bottom:1px #ddd solid;

}

ul.features_list_detailed li:nth-child(even){

  float:right;

}

ul.features_list_detailed li .feat_small_icon{

  width:10%;

  float:left;

  margin:2px 0 0 0;

}

ul.features_list_detailed li .feat_small_details{

  width:85%;

  float:left;

  padding:0 0 0 5%;

}

ul.features_list_detailed li .feat_small_details p{

  padding:0 0 10px 0;

}

ul.features_list_detailed li .feat_small_details a{

  color:#232323;

}

ul.features_list_detailed li .feat_small_details h4{

  font-weight:700;

  font-size:20px;

  padding:0 0 5px 0;

  margin:0px;

}



/* 7-3. TEAM DESIGN LAYOUT */



.team-block{

  width:46%;

  background-color:#f7f7f7;

  text-align:center;

  padding:20px 0 0 0;

}

.team-block a img{

  display:block;

  width:50%;

  border-radius:50%;

  margin:auto;

}

.team-block strong{

  display:block;

  font-weight:700;

  font-size:15px;

  padding:10px 0;

}

.team-block span{

  display:block;

  font-weight:300;

  font-size:14px;

  letter-spacing:0.5px;

  background-color:#0be0af;

  padding:10px 0;

}

ul.team_socials{

  width:100%;

  text-align:center;

  padding:10px 0;

  margin:0px;

  list-style:none;

}

ul.team_socials li{

  width:15%;

  padding:0px;

  margin:0px;

  display:inline-block;

}

ul.team_socials li a img{

  display:block;

  max-width:100%;

  text-align:center;

  border-radius:0px;

  margin:auto;

}



/* 7-4. MUSIC LIST DESIGN LAYOUT */



.audiojs{

  width:100%;

  margin:auto;

  box-shadow:none;

  background-image:none;

}

.audiojs .scrubber{

  position: relative;

  float: left;

  width: 45%;

}

.audiojs .time {

  float: left;

  width:25%;

  height: 36px;

  line-height: 36px;

  margin:0px;

}



ul.music_list{

  padding:0 0 20px 0;

  width:100%;

  margin:0px;

  list-style:none;

  float:left;

  clear:both;

}

ul.music_list li{

  border-top:1px #e6e6e6 solid;

  background-color:#f8f8f8;

  padding:0 0 0 0;

  margin:0 0 10px 0;

  display:block;

  width:100%;

  float:left;

  font-size:18px;

}

ul.music_list li h4{

  font-size:14px;

  padding:0 0 0 10px;

  margin:0px;

  font-weight:300;

  line-height:40px;

}

ul.music_list li h4 span{

  font-weight:700;

  background-color:#0be0af;

  display:inline-block;

  padding:5px 10px;

  float:right;

  margin:0px;

  line-height:30px;

}

/*===============================================*/

/* 8. POPUPS */

/*===============================================*/

.popup{

  background-color:#FFFFFF;

}

.popup h4{

  color:#222222;

  font-size:22px;

  font-weight:700;

  text-align:center;

  padding:0 0 20px 0;

  margin:0px;

}

.popup h5{

  color:#222222;

  font-size:14px;

  font-weight:300;

  text-align:center;

  padding:20px 0 10px 0;

  margin:0px;

}

.popup p{

  text-align:center;

  padding:0px 0 20px 0;

  margin:0px;

  font-size:14px;

}

.content-block {

  padding:75px 10% 0 10%;

}

ul.social_share{

  list-style:none;

  padding:10px 0 0 0;

  margin:0px;

}

ul.social_share li{

  width:32%;

  text-align:center;

  display:inline-block;

  padding:15px 0;

  margin:0px;

}

ul.social_share li img{

  width:50%;

  display:block;

  margin:auto auto 10px auto;

}

ul.social_share li a{

  color:#222222;

  font-size:12px;

  font-weight:900;

}



.close_popup_button{

  display:block;

}

.close_popup_button a{

  display:inline-block;

  width:60px;

  height:60px;

  margin:auto;

  padding:0;

  text-align:center;

  position:absolute;

  top:10px;

  right:0px;

}

.close_popup_button a img{

  display:block;

  max-width:60%;

  margin:auto;

}

/*===============================================*/

/* 9. SHOP LAYOUT */

/*===============================================*/

ul.shop_items{
  padding-bottom: 50px;

  height: 70%;

  overflow: auto;

  width:100%;

  margin:0px;

  list-style:none;

  float:left;

  clear:both;

}

ul.shop_item_search{
  padding-bottom: 0px;
  height: auto!important;
  overflow: auto;
  width:100%;
  margin:0px;
  list-style:none;
  float:left;
  clear:both;
}

ul.shop_items li:last-child{
  border-bottom:60px solid #fff !important;
  padding: 0;
}

ul.shop_item_search li:last-child
{
    padding: 0 0 15px 0;
    margin: 0 0 15px 0;
    display: block;
    width: 100%;
    float: left;
    clear: both;
    border-bottom: 1px solid #e4e4e4!important;
    position: relative;
}


ul.shop_items li{

  padding:0 0 15px 0;

  margin:0 0 15px 0;

  display:block;

  width:100%;

  float:left;

  clear:both;

  border-bottom:1px solid #e4e4e4;

  position:relative;

}

/* updated 14/9/2021 */
ul.shop_items li .shop_thumb{

  width:30%;

  float:left;

  padding:0;

  margin:0;

  cursor: pointer;

}

ul.shop_items li .shop_thumb img{

  display:inline-block;

  /* max-width:100%; */

  margin:0px;

}

.shop_item_details h3{

  font-weight:400;

  font-size:16px;

  padding:0;

  margin:0px;

  width:100%;

  clear:both;

  border-bottom:1px #ddd solid;

  padding:10px 0;

  margin:0 0 15px 0;

}

ul.shop_items li .shop_item_details h4{

  font-weight:900;

  font-size:16px;

  padding:0;

  margin:0px;

}

ul.shop_items li .shop_item_details h4 a{

  color:#2a3452;

}

ul.shop_items li .shop_item_details{

  width:65%;

  float:left;

  padding:0 0 0 5%;

}

ul.shop_items li .shop_item_details p{

  padding:0 0 10px 0;

  margin:0px;

}

ul.shop_items li .price{

  font-size:17px;

  font-weight:700;

 padding: 5px 0 7px 0;

  text-align: center;

}

ul.shop_items li a#addtocart{

  width: 47%;

  float: right;

  color: orange;

  border: 2px solid orange;

  border-radius: 4px;

  display: inline-block;

  padding: 4px 0;

  text-align: center;

  font-size: 17px;

  font-weight: 400;

}

ul.shop_items li a.shopfav{

  position:absolute;

  top:15px;

  right:0px;

  z-index:9999;

  width:25px;

}

ul.shop_items li a.shopfav img{

  width:100%;

  display:block;

}

.shop_pagination{

  width:100%;

  clear:both;

  margin:25px 0;

  float:left;

}

.shop_pagination a{

  display:block;

  padding:10px 0;

  text-align:center;

  width:40%;

  font-size:12px;

  font-weight:900;

}

.shop_pagination span.shop_pagenr{

  width:18%;

  display:block;

  float:left;

  text-align:center;

  padding:10px 0;

}

a.prev_shop{

  float:left;

}

a.next_shop{

  float:right;

}



/* 9-1. SHOP ITEM PAGE */



.shop_item{

  width:100%;

}

.shop_item h4{

  width:100%;

  padding:5px 0;

  font-size:14px;

  margin:5px 0 20px 0;

  clear:both;

  font-weight:400;

}

.shop_item .shop_thumb{

  width:100%;

  padding:0;

  margin:0;

  position:relative;

}

.shop_item a#addtocart{

  width:100%;

  color:#fff;

  display:block;

  padding:15px 0;

  text-align:center;

  font-size:14px;

  font-weight:900;

  clear:both;

}

.shop_item .shop_item_details{

  width:100%;

  padding:0;

}

.shop_item .price{

  position:absolute;

  top:10px;

  right:10px;

  color:#222222;

  width:50px;

  height:50px;

  line-height:50px;

  border-radius:50%;

  font-size:14px;

  font-weight:300;

  text-align:center;

  padding:0;

  background-color:#0be0af;

}

.shop_item a.shopfav{

  position:absolute;

  bottom:10px;

  right:20px;

  z-index:9999;

  width:10%;

}

.shop_item a.shopfriend{

  position:absolute;

  bottom:10px;

  right:25%;

  z-index:9999;

  width:10%;

}

.shop_item a.shopfav img, .shop_item a.shopfriend img{

  width:100%;

  display:block;

}

.size_selectors{

  width:100%;

  margin:0 0 20px 0;

  float:left;

  display:block;

}

.size_selectors label {

  display:inline-block;

  width:18%;

  float:left;

  cursor: pointer;

  padding:10px 0 10px 0;

  margin:0 1% 0 0;

  font-size:14px;

  text-align:center;

}

.size_selectors input[type=radio] {

  display: none;

}

.size_selectors input[type=radio] + label {

  display: block;

  border:1px #ebebeb solid;

  color:#375a70;

}

.size_selectors input[type=radio]:checked + label {

  background-color:#0be0af;

}

.color_selectors{

  width:100%;

  margin:0 0 20px 0;

  float:left;

  display:block;

}

.color_selectors label {

  display:block;

  width:14%;

  height:25px;

  float:left;

  cursor: pointer;

  padding:0;

  margin:0 1% 0 0;

}

.color_selectors label.colorred{

  background-color:#ed434b;

}

.color_selectors label.colororange{

  background-color:#f2901d;

}

.color_selectors label.coloryellow{

  background-color:#e8d503;

}

.color_selectors label.colorgreen{

  background-color:#6fe803;

}

.color_selectors label.colorblue{

  background-color:#0394e8;

}

.color_selectors label.colormagenta{

  background-color:#b60cc5;

}

.color_selectors input[type=radio] {

  display: none;

}

.color_selectors input[type=radio] + label {

  border:2px #fff solid;

}

.color_selectors input[type=radio]:checked + label {

  background-image:url(images/bullet.png);

  background-position:center center;

  background-repeat:no-repeat;

}



/* 9-2. SHOPPING CART - CECKOUT */



.cart_item{

  width:100%;

  float:left;

  clear:both;

  border-bottom:1px #3d3e50 solid;

  padding:10px 0;

  margin:0 0 10px 0;

}

.item_thumb{

  width:30%;

  float:left;

  clear:both;

}

.item_thumb img{

  max-width:80%;

  display:block;

}

.item_title{

  width:80%;

  float:left;

  padding:5px 0 15px 0;

}

.item_title span{

  font-weight:900;

}

.item_price{

  width:20%;

  text-align:center;

  padding:5px 0;

  float:right;

  color:#222222;

  background-color:#0be0af;

  font-size:12px;

  font-weight:900;

  letter-spacing:0.5px;

}

a.item_delete{

  width:10%;

  float:right;

  text-align:right;

  padding:5% 0 0 0;

}

a.item_delete img{

  max-width:80%;

  display:block;

}

.item_qnty{

  width:50%;

  float:left;

  margin:0 0 10px 5%;

  border-right:1px #3d3e50 solid;

}

.item_qnty_shop{

  width:50%;

  float:left;

  margin:0;

}

.item_qnty_shopitem{

  width:50%;

  float:left;

  margin:0 0 20px 0;

}

.item_qnty label{

  width:60%;

  display:block;

  text-align:center;

  font-size:14px;

  padding:0 0 10px 0;

}

input.qntyminus, input.qntyplus, input.qntyminusshop, input.qntyplusshop{

  width:30px;

  float:left;

  background:none;

  border:none;

  height:30px;

  border-radius:15px;

  font-weight:400;

  font-size:20px;

  text-align:center;

  margin:0px;

  padding:0px 0 3px;

  cursor:pointer;

  line-height:5px;

  -webkit-appearance: none;

}

input.qnty{

  width:20%;

  height:25px;

  float:left;

  margin:0 2%;

  padding:0px;

  color:#222222;

  background:none;

  border:none;

  text-align:center;

  font-size:18px;

  -webkit-appearance: none;

}

input.qntyshop{

  width:20%;

  height:25px;

  float:left;

  margin:0 1%;

  padding:0px;

  color:#000;

  background:none;

  border:none;

  text-align:center;

  font-size:18px;

  -webkit-appearance: none;

}

.shop_pagination a, input.qntyminus, input.qntyplus, input.qntyminusshop, input.qntyplusshop{

  border: 1px solid #222222;

  color: #222222;

}

h4.checkout_title{

  width:93%;

  margin:0 0 20px 0;

  padding:10px 0 10px 5%;

  background-color:#f7f7f7;

  float:left;

  clear:both;

  font-size:14px;

  font-weight:700;

  border-left:5px solid #0be0af;

}

.order_item{

  width:100%;

  float:left;

  clear:both;

  border-bottom:1px solid #d6d6d6;

  padding:5px 0;

  margin:0 0 10px 0;

}

.order_item_thumb{

  width:20%;

  float:left;

  clear:both;

}

.order_item_thumb img{

  max-width:80%;

  display:block;

}

.order_item_title{

  width:60%;

  float:left;

  padding:5px 0 15px 0;

}

.order_item_title span{

  font-weight:900;

}

.order_item_price{

  width:20%;

  text-align:center;

  padding:5px 0;

  float:right;

  color:#1b1b25;

  font-size:12px;

  font-weight:900;

  letter-spacing:0.5px;

}

.checkout_select{

  padding:10px 0 20px 5%;

}

.carttotal{

  width:90%;

  float:right;

  clear:both;

  padding:0 0 20px 0;

}

.carttotal_full{

  width:100%;

  float:left;

  clear:both;

  padding:0 0 20px 0;

}

.carttotal_row{

  width:100%;

  float:left;

  clear:both;

  padding:5px 0;

  border-bottom:1px #3d3e50 solid;

}

.carttotal_row_full{

  width:100%;

  float:left;

  clear:both;

  padding:8px 0;

  border-bottom:1px #d6d6d6 solid;

}

.carttotal_row_last{

  width:100%;

  float:left;

  clear:both;

  padding:5px 0;

  font-size:17px;

  font-weight:900;

}

.carttotal_left{

  width:60%;

  float:left;

  text-align:left;

}

.carttotal_right{

  width:40%;

  float:left;

  text-align:right;

}

a.checkout{

  width:100%;

  clear:both;

  display:block;

  float:left;

  padding:15px 0;

  margin:15px 0;

  font-weight:normal;

  text-align:center;

  cursor:pointer;

  font-size:14px;

  color:#FFFFFF;

  -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;

  border: none;

  cursor:pointer;

  -webkit-appearance: none;

}

/* 9-3. SUCCESS PAGE */

.success_message{

  width:100%;

  text-align:center;

  font-size:24px;

  font-weight:300;

  color:#2d2e3e;

  padding:20px 0 0 0;

}

.success_message img{

  text-align:center;

  display:inline-block;

  margin:20px auto;

}

.success_message span{

  font-weight:900;

  font-size:40px;

  display:block;

}

.success_message p{

  line-height:35px;

}

/*===============================================*/

/* 10. PHOTO GALLERY */

/*===============================================*/

.bottombarpages{

  position: absolute;

  bottom:0;

  left:0;

  width:100%;

  height:80px;

  text-align:center;

  z-index:999;

  background-color:#0be0af;

}

.switch_button{

  display:block;

  float:left;

}

.switch_button a{

  display:block;

  width:23px;

  height:23px;

}

.switch13{

  background:url(images/switch_13.png) no-repeat center;

}

.switch12{

  background:url(images/switch_12.png) no-repeat center;

}

.switch11{

  background:url(images/switch_11.png) no-repeat center;

}

.gallery_switch{

  width:100%;

  text-align:center;

  padding:10px 0 0 0;

}

.gallery_switch a{

  display:inline-block;

  padding:0 5px;

  width:5%;

}

.gallery_switch a img{

  display:inline-block;

  max-width:70%;

}

ul.photo_gallery_13, ul.photo_gallery_12, ul.photo_gallery_11{

  width:90%;

  list-style:none;

  padding:0px;

  margin:15px 5% 70px 5%;

  float:left;

  clear:both;

}

ul.photo_gallery_13 li{

  width:33.3%;

  padding:0;

  float:left;

  margin:0;

}

ul.photo_gallery_13 li img{

  max-width:100%;

  display:block;

}

ul.photo_gallery_12 li{

  width:50%;

  padding:0;

  float:left;

  margin:0;

}

ul.photo_gallery_12 li img{

  max-width:100%;

  display:block;

}

ul.photo_gallery_11 li{

  width:100%;

  padding:0;

  float:left;

  margin:0;

}

ul.photo_gallery_11 li img{

  max-width:100%;

  display:block;

}

.photo-categories{

  width:90%;

  padding:0;

  font-size:14px;

  font-weight:400;

  margin:0 5% 0 5%;

  display:block;

}

.photo-categories a{

  width:32%;

  margin:0 1% 0 0;

  display:block;

  float:left;

  text-align:center;

  padding:10px 0;

  color:#2d2e3e;

}

.photo-categories a.active{

  background-color:#0be0af;

}



/*===============================================*/

/* 11. BLOG LAYOUT */

/*===============================================*/

.list-block {

  margin:0px 0;

}

.list-block ul::before {

  content: '';

  position: absolute;

  left: 0;

  top: 0;

  bottom: auto;

  right: auto;

  height: 1px;

  width: 100%;

  background-color: #fff;

}

.list-block ul::after {

  background-color: #fff;

}

.list-block li{

  border-bottom:1px #f0f0f0 solid;

  margin:0;

}

.list-block .item-content {

  padding-left:0px;

  padding-top:0px;

}

.list-block .swipeout-actions-left a,

.list-block .swipeout-actions-right a {

  padding:0 10px;

  margin:0 0 0 0px;

  color: #000;

  text-align:center;

}

.list-block .swipeout-actions-right a:nth-child(1){

  background:#0be0af;

}

.list-block .swipeout-actions-right a:nth-child(2){

  background:#21d3c5;

}

.list-block .swipeout-actions-right a:nth-child(3){

  background:#705abc;

}

#pages_maincontent .list-block .swipeout-actions-left a img,

#pages_maincontent .list-block .swipeout-actions-right a img{

  display:inline-block;

  width: 40%;

  margin:auto;

}

ul.posts li{

	padding:10px 0 0 0;

}

.post_thumb{

  width:25%;

  float:left;

}

.post_thumb img{

  display:inline-block;

  max-width:100%;

}

.post_details{

  width:62%;

  float:left;

  margin:0 0 0 4%;

}

.post_details h2{

  font-size:14px;

  line-height:20px;

  font-weight:400;

  margin:10px 0 10px 0;

  padding:0px;

}

.post_category a{

  font-size:14px;

  font-weight:700;

  padding:0;

  display:inline-block;

}



.post_swipe{

  width:6%;

  height:100%;

  position:absolute;

  right:0px;

  top:0px;

  background-color:#f7f7f7;

}

.post_swipe img{

  position: relative;

  top: 50%;

  transform: translateY(-50%);

  margin:auto;

}

.post_details span, .post_single span{

  display:inline-block;

  padding:0 5px;

}



.post_single span.post_date{

  background:url(images/date.png) no-repeat left;

  padding:10px 0 5px 25px;

  margin:0 0 0 0;

}

.post_single span.post_author{

  background:url(images/author.png) no-repeat left;

  padding:10px 0 5px 25px;

  margin:0 0 0 10px;

}

.post_single span.post_comments{

  background:url(images/comments.png) no-repeat left;

  padding:10px 0 5px 23px;

  margin:0 0 0 10px;

}

#loadMore{

  display:block;

  width:100%;

  margin:10px 0;

  padding:10px 0;

  text-align:center;

  background-color:#0be0af;

  color:#000000;

  font-size:20px;

  cursor:pointer;

}

#showLess{

  display:none;

  width:100%;

  margin:10px 0;

  padding:10px 0;

  text-align:center;

  background-color:#f7f7f7;

  color:#ddd;

  font-size:20px;

}

.post_single{

  border-bottom:1px #f0f0f0 solid;

  padding:10px 0 10px 0;

  margin:0 0 20px 0;

}

.post_single img{

  display:block;

  max-width:100%;

  margin:0 0 20px 0;

}

a.backto{

  width:10%;

  float:left;

  margin:10px 0 0 5%;

}

a.backto img{

  width:90%;

  display:block;

}

ul.comments{

  list-style:none;

  padding:0px;

  margin:0px;

}

ul.comments li{

  list-style:none;

  float:left;

  clear:both;

  padding:5% 5% 0 5%;

  margin:0px 0 10px 0;

  background-color:#f0f0f0;

}

.comm_avatar{

  width:15%;

  display:inline-block;

  float:left;

}

.comm_avatar img{

  display:inline-block;

  max-width:100%;

}

.comm_content{

  width:80%;

  float:left;

  display:inline-block;

  padding:0 0 0 5%;

}

.comm_content p{

  padding:0px;

  margin:0px;

  font-style:italic;

}





/*===============================================*/

/* 12. FORMS */

/*===============================================*/

/* 12.1 LOGIN FORM */

.loginform{

  width:90%;

  padding:0 0 15px 5%;

}

.loginform label.error{

  padding:0 0 20px 0;

  margin:0px;

  line-height:10px;

  width:100%;

  text-align:left;

  font-size:14px;

  color:#f65821;

  font-weight:400;

  clear:both;

  float:left;

}

.loginform input.form_input{

  padding:10px 3%;

  width:93%;

  margin:0 0 15px 0;

  border-bottom:1px solid #d5d5d5;

  border-left:none;

  border-right:none;

  border-top:none;

  background-color:#ffffff;

  color:#000000;

  -webkit-appearance: none;

}

.loginform input.form_input:focus{

 background-color:#f5f5f5;

}

.loginform .form_select{

  padding:2% 3%;

  width:100%;

  margin:20px 0 10px 0;

  border-bottom:1px solid #d5d5d5;

  border-left:none;

  border-right:none;

  border-top:none;

  -webkit-appearance: none;

  color:#000000;

  background:url(images/dropdown.png) no-repeat right;

}

.loginform .form_select option{

  padding:3px;

}

.loginform input.form_submit{

  width:100%;

  padding:12px 0;

  margin:10px 0 0 0;

  text-align:center;

  cursor:pointer;

  font-size:18px;

  font-weight:300;

  color:#222222;

  border: none;

  cursor:pointer;

  -webkit-appearance: none;

  background-color:#0be0af;

}

.forgot_pass{

  width:100%;

  text-align:right;

  font-size:12px;

}

.forgot_pass a{

  font-weight:700;

  color:#7cbe55;

}

.signup_bottom{

  width:100%;

  text-align:center;

  padding:30px 0 0 0;

}

.signup_bottom p{

  opacity: 1;

  padding:0px 0 10px 0;

  font-size:16px;

}




.signup_bottom a{

  background-color:#7cbe55;

  color:#fff;

  font-weight:300;

  font-size:16px;

  padding:5px 10px;

  border-radius:15px;

}

.signup_social{

  width:100%;

  text-align:center;

  padding:20px 0 0 0;

}

a.signup_facebook{

  background-color:#38579a;

  width:47%;

  display:inline-block;

  padding:12px 0;

  margin:0 4% 0 0;

  color:#FFFFFF;

  font-size:12px;

  font-weight:700;

}

a.signup_twitter{

  background-color:#0cacea;

  width:47%;

  padding:12px 0;

  display:inline-block;

  color:#FFFFFF;

  font-size:12px;

  font-weight:700;

}



/* 12.2 CONTACT FORM */



.contactform{

  width:100%;

  padding:0 0 15px 0;

}

.form_row{

	float:left;

	clear:both;

	width:100%;

}

.contactform label{

  width:100%;

  padding:5px 0 3px 0;

  display:block;

  font-size:16px;

  font-weight:700;

}

.contactform label.error{

  padding:0 0 10px 0;

  width:100%;

  text-align:left;

  font-size:14px;

  color:#f65821;

  font-weight:400;

}

.contactform input.form_input{

  padding:3%;

  width:93%;

  margin:0 0 5px 0;

  border:1px solid #ddd;

}

/* --------Custom select input----------- */

.selector_overlay{

  padding:0;

  width:100%;

  float:left;

  margin:0 0 5px 0;

  overflow: hidden;

  background-color: #fff;

  background:url(images/dropdown.png) no-repeat top right;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}

.selector_overlay select{

  padding:8px 0 8px 1%;

  width:99.5%;

  margin:0 0 5px 0;

  border:1px solid #ddd;

  box-shadow: none;

  background-color: transparent;

  background-image: none;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

}

.custom_select a label{

	color:#000;

}

.custom_select .item-after{

  padding:8px 0 8px 2%;

  width:97%;

  float:left;

  margin:0 0 5px 0;

  overflow: hidden;

  background-color: #fff;

  background:url(images/dropdown.png) no-repeat top right;

  border:1px solid #ddd;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}

.list-block .item-title {

  -webkit-flex-shrink: 1;

  -ms-flex: 0 1 auto;

  flex-shrink: 1;

  min-width: 0;

  white-space: nowrap;

  position: relative;

  overflow: hidden;

  text-overflow: ellipsis;

  max-width: 90%;

  padding:0 5%;

}

.navbar, .toolbar, .subnavbar {

  background: #445cfd;

}

.navbar a.link, .toolbar a.link, .subnavbar a.link {

	color:#fff;

}

.picker-modal .toolbar {

  position: relative;

  width: 100%;

  background: #445cfd;

}

.picker-modal .toolbar a{

	color:#fff;

}

.picker-modal.smart-select-picker .toolbar::after {

  content: '';

  position: absolute;

  left: 0;

  bottom: 0;

  right: auto;

  top: auto;

  height: 1px;

  width: 100%;

  background-color: #445cfd;

  display: block;

  z-index: 15;

  -webkit-transform-origin: 50% 100%;

  transform-origin: 50% 100%;

}

.picker-modal .toolbar::before {

  content: '';

  position: absolute;

  left: 0;

  top: 0;

  bottom: auto;

  right: auto;

  height: 1px;

  width: 100%;

  background-color: #445cfd;

  display: block;

  z-index: 15;

  -webkit-transform-origin: 50% 0%;

  transform-origin: 50% 0%;

}

.picker-calendar-month-picker span, .picker-calendar-year-picker span {

	color:#fff;

}

i.icon.icon-next, i.icon.icon-prev {

  width: 21px;

  height: 21px;

}

i.icon.icon-prev {

  background-image: url(images/nav-prev.png);

}

i.icon.icon-next {

 background-image: url(images/nav-next.png);

}

i.icon.icon-back {

  width: 21px;

  height: 21px;

  background-image: url(images/nav-prev.png);

}

.contactform .item-content{

  padding:2px 0 2px 0;

  margin:0px;

}

.contactform .form_row_right{

  margin:0 0 20px 5%;

  padding:0 0 10px 0;

  border-bottom:1px solid #d6d6d6;

}

.contactform .form_row_right .item-title{

	font-size:14px;

	font-weight:400;

}

.contactform label .item-media{

  display:inline-block;

}

.contactform label .item-inner{

  display:inline-block;

}



.contactform label.label-switch{

  display:inline-block;

  width:auto;

}

.contactform textarea.form_textarea{

  padding:3%;

  width:93%;

  height:50px;

  margin:0 0 5px 0;

  border:1px solid #ddd;

  font-family: Lato!important;
  font-size:14px;

}

.contactform input.form_submit{

  width:100%;

  padding:4% 0 4% 0;

  margin:10px 0 0 0;

  font-weight:normal;

  text-align:center;

  cursor:pointer;

  font-size:20px;

  background-color:#0be0af;

  color:#222222;

  border: none;

  cursor:pointer;

}

h2#Note{

	display:none;

}



/*===============================================*/

/* 13. TABS & ACCORDION & TABLES */

/*===============================================*/

.tabs-animated-wrap, .tabs-simple{

  position: relative;

  width: 100%;

  overflow: hidden;

  height: auto;

  margin:20px 0 0 0;

}

.tab h4{

  padding:0 0 10px 0;

  margin:0px;

  font-size:16px;

}

.custom-accordion{

  padding:0;

}

.custom-accordion .accordion-item-toggle{

  padding:0px 0px;

  height:44px;

  line-height:44px;

  font-size:17px;

  cursor:pointer;

}

.custom-accordion .accordion-item-toggle:active{

  background:rgba(0,0,0,0.15);

}

.custom-accordion .accordion-item-toggle span{

  display:inline-block;

  margin-left:15px;

}

.custom-accordion .icon-plus,.custom-accordion .icon-minus{

  display:inline-block;

  width:22px;

  height:22px;

  border:1px solid #000;

  border-radius:100%;

  line-height:20px;

  text-align:center;

}

.custom-accordion .icon-minus{

  display:none;

}

.custom-accordion .accordion-item-expanded .icon-minus{

  display:inline-block;

}

.custom-accordion .accordion-item-expanded .icon-plus{

  display:none;

}

.custom-accordion .accordion-item-content{

  padding:0px 15px;

}



/* TABLES */

ul.responsive_table{

  width:100%;

  float:left;

  clear:both;

  margin:0 0 10px 0;

  padding:0px;

  list-style:none;

}

li.table_row{

  width:100%;

  float:left;

  clear:both;

  line-height:30px;

  padding:0px;

  list-style:none;

  margin:0 0 1px 0;

  background-color:#f5f5f4;

}

.table_section_small{

  width:14%;

  float:left;

  padding:0 0 0 2%;

}

.table_section{

  width:40%;

  float:left;

  padding:0 0 0 2%;

}

.table_section_14{

  width:23%;

  float:left;

  padding:0 0 0 2%;

  text-align:center;

  display:block;

}

.table_section_14 img{

  display:inline-block;

  text-align:center;

  padding:10px 0 0 0;

  margin:0px;

  line-height:10px;

}

.table_section_14 strong{

  font-size:18px;

}

.table_section_14 a.buy_now{

  display:inline-block;

  text-align:center;

  padding:0 5px;

  margin:5px 0;

  background-color:#94cb01;

  color:#FFFFFF;

  font-size:12px;

  -moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;

}

ul.responsive_table li:first-child{

  background-color:#0be0af;

  color:#222222;

}

.message-sent .message-text {

  background-color: #0be0af;

}
/* -----------------phone frame ---------------- */

/* updated 13/9/2021 */
/* added 4 lines */
/* modified 1 line */
.phone {
  position: relative;
  margin: auto;
  width: 400px;
  height: 100%;
  border: 1px solid rgb(223, 223, 223);

}

.phone-frame {
  position: absolute;
  width: 100%;
}

.phone-screen {
  position: absolute;
  top: 33px;
  left: 33px;
  width: 100px;
  height: 100px;
  background-color: #0be0af;
}
/* -----------------NEW---------------- */

#greet {

  text-shadow: -2px 3px 3px rgba(150, 147, 150, 1);
}

.separator {
  /* box-shadow: 6px 3px 3px #00000024; */
  box-shadow: rgb(0 0 0 / 14%) 0px 3px 4px;
  margin-bottom: 28px;
}

.delivery-icon {
  width: 53px;
}

.discount-icon{
  width: 37px;
}

.guest {
  position: relative;
  left: 30%;
  margin-top: 13%;
}

.offer {
  margin-top: 15px;
  color: #2e2e2e;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 13px;
}

.starts {
  background-color: #1baa54;
  text-shadow: 0px 2px 4px rgb(150 147 150);
  font-weight: bold;
  font-size: 18px;
  border-style: none;
  padding: 14px;
  border-radius: 6px;
  width: 80%;
  color: #fff;
  letter-spacing: 0.5px;
  margin: 0 auto;
}

img.coupon_bg {
  width: 90%;
  max-width:400px;
}

p .method {
  font-size: 30px !important;
  font-weight: normal !important;
}

.method-desc {
  margin-bottom: -53px;
}

.guest, .guest-img, .guest-name,
.container, .part-1, .part-2, .name, .location,
.container-2, .part-3, .part-4, .delivery, .time,
.container-3, .voucher, .upper, .lower, .voucher-img, .voucher-value {
  display: flex;
}

.guest {
  flex-direction: row;
}

.guest-name {
  margin-left: 52%;
}

.guestimage {
  width: 42px;
}

.wrapper
{

}
::-webkit-scrollbar
{
display: none;

}

.scrollbar
{
scrollbar-width: none;
}

.scrollmenu {
/*overflow: overlay;*/
white-space: nowrap;
overflow: scroll;
scrollbar-width: none;
}


/*h2 {
  font-size: 41px;
  color: white;
  font-weight: 900;
  margin-top: 19%;
}*/

.container {

  box-shadow: 0px 0px 6px #00000024;
  border-radius: 10px;
  background: white;
  margin: 2% 5% 1% 5%;
  padding: 1%;
}

.container-2 {
  margin-left: 6%;
}

.container-3 {
  margin: 1% 0% 2% 4%;
}

.container-4 {
  margin: 1% 6% 2% 4%;
}
/* updated 13/9/2021 */
/* modified 1 line */

.part-1, .part-3 {
  flex: 20%;
  justify-content: center;
}

.part-2 {
  flex: 80%;
  flex-direction: column;
}


.name {
  color: black;
  font-weight: 500;
  font-size: 36px;
  padding-top: 2%;
}

#search-btn, #filter-btn {
  width: 21px;
  height: 21px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgb(0 0 0 / 10%);
  padding: 10px;
  margin-right: 16px;
  float: right;
  border-radius: 5px;
}

#food-type {
  font-weight: 600;
}

ul.shop_items li .shop_item_details h4 a {
  font-weight: 500;
}

/*=============== Quantity area ===================*/

.item_quantity_area {
  width: 100%;
  height: 2em;
}

/* updated 13/9/2021 */
/* added 1 line */
.add_item_button {
  height: 2.5em;
  border-radius: 0.3em;
  border: solid orange 2px;
  background: rgba(0, 0, 0, 0);
  color: orange;
  display: block;
  float: right;
  /* added */
  cursor: pointer;
}

button {
  outline: none !important;
  border: none;
  background: transparent;
}

/* updated 13/9/2021 */
/* modified 1 line */
.item_quantity_numeric_area {
  /* width: 30%; */
  width: 50%;
  height: 100%;
  border-radius: 0.3em;
  /* border: solid green 2px; */
  border-style: solid;
  border-color: rgb(0, 204, 0);
  border-width: 2px;
  background: rgba(0, 204, 0, 1);
  vertical-align: middle;
  float:right;
}

/* updated 13/9/2021 */
/* added 1 line */
.item_quantity_numeric_area button {
  width: 33%;
  height: 100%;
  vertical-align: middle;
  display: inline-block;
  /* added */
  cursor: pointer;
}

.item_quantity_change_button {
  /* background: #00cc00; */
  width: 25px;
  font-size: 19px;
  font-weight: bold;
  /* padding-top: 2px; */
}

.item_quantity_numeric {
  height: 100%;
  /* line-height: 2em; */
  min-width: 30px;
  font-weight: bold;
  background: white;
  font-size: 14px;
  color: black;
  padding-top: 2px;
}

/*====================== Tabs =========================*/

.tab button {
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  margin: 0px 7px 0px 7px;
  transition: 0.3s;
  font-size: 13px;
  color: #434b53;
  padding-bottom: 12px;
  font-weight: bold;
}

.tab button.active:before {
  content: ' ';
  border:10px solid transparent;
  border-top:10px solid rgb(255, 255, 255);
  border-left:10px solid transparent;
  display:inline-block;
  height:0;
  width:0;
  position:absolute;
  margin-left:40px;
  top: 138px;
  display: none;
}

.tab button.active {
	/*color: #FEA428;*/
  color:#326EAB;
  font-size: 13px;
  font-weight: bold;
}

.tabcontent {
  display: none;
  padding: 6px 12px;
  border-top: none;
}

/*=============== Modal ===================*/

h4#modal-text{
  position: absolute;
  left: 0%;
  top: 71%;
  font-size: 18px;
  font-weight: 600;
  padding: 11px;
  color: black;
}
button.close-modal{
	float: right;
	/*font-size: 1.5rem;*/
/*	font-weight: 700;
	line-height: 1;
	color: #000;
	text-shadow: 0 1px 0 #fff;
	opacity: .5;
	cursor: pointer;*/
}


.cart_item_item_field{
	height: 100%;
	margin: auto;
	width: 50%;
	text-align: center;
	border-radius: 0.3em;
	border: 2px solid rgb(0, 204, 0);
	background: #00cc00;
}
.cart_item_item_field button{
	width: 33%;
  height: 100%;
  vertical-align: middle;
  display: inline-block;
  cursor: pointer;
}
.cart_item_item_field .cart_item_change_button{
	font-size: 19px;
	font-weight: bold;
}
.cart_item_qty{
	background-color: white;
}
/* end of added 14/9/2021 */
/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: initial;
  height: 278px;
  border-radius: 12px;

}

.close {
  cursor: pointer;
  position: relative;
  left: 95%;
  top: -7%;
  font-size: 52px;
  padding: -5px -13px;
  transform: translate(0%, -50%);
  z-index: 1;
  color: white;
}

.close-back {
  position: absolute;
  z-index: -2;
  width: 28px;
  height: 28px;
  top: 22px;
  border-radius: 5px;
  background: rgba(0,0,0,1.5);
}


.image-modal {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  border-radius: 11px 11px 0px 0px;
}

.box-action {
  position: absolute;
  left: 4%;
  bottom: 4%;
  width: 92%;
  height: 50px;
  border: none;
  background: #FEA428 0% 0% no-repeat padding-box;
  box-shadow: 0px -3px 20px #0000001a;
  border-radius: 6px;
  color: white;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}


/* Next & previous buttons */
.prev, .next {
  z-index: 1;
  cursor: pointer;
  position: absolute;
  top: 30%;
  padding: 16px;
  margin-top: -22px;
  color: #fefefe;;
  font-weight: bold;
  font-size: 41px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

.prev {
  left: 0;
}

.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.5);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}


/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}

/*=============== Footer ===================*/
/* updated 14/9/2021 */
.footer_button_area div{
	color: white;
	margin: 5%;
}

/* updated 13/9/2021 */
.footer_button_area,
#free_delivery {
  /* position: fixed; */
  position: sticky;
  left: 0;
  bottom: 0;
  height: 4em;
  width: 100%;
}

/* updated 14/9/2021 */
#free_delivery {
  display: flex;
  justify-content: center ;
  background-color: #1365FB;
  color: #fff;
  height: fit-content;
  /* removed */
  /* padding: 3px; */
}

/* updated 14/9/2021 */
.free_delivery_title {
  background: #007CFA;
  font-weight: bolder;
  font-size: 10px;
  padding: 3px 15px 3px 15px;
  border-radius: 4px;
  border: 1px solid #FFFFFF2E;
  width: 100px;
  text-align: center;
  /* modified */
  /* margin-left: 15px; */
  margin: auto 15px;
  /* added */
  padding: 3px 10px;
}


#footer_cart_button_area {
  display: none;
  font-family: Rubik, sans-serif;
}
/* updated 14/9/2021 */
.footer_button_area{
  background: #326EAB;
  border-radius: 8px;
  justify-content: space-between;
}

#flex-bottom {
  display: flex;
  justify-content: space-between;
  margin: 20px;
  color: #ffffff;
}

#view-cart {
  font-weight: 700;
}


/*===============================================*/

/* 14. MEDIA QUERIES */

/*===============================================*/

/* -------------SMALL DESKTOP--------- */

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

  .logo_image a img{

    max-width:22%;

    padding:25px 0 0 0;

  }

  .bottombarpages{

    height:70px;

  }

  .gallery_switch a{

    width:8%;

    padding:0px;

  }

  .gallery_switch a img{

    max-width:60%;

  }

  .bottom_menu_open a img{

    max-width:20%;

  }

  .swiper-button-prev{

   right:10%;

 }

 .container-2 {
  padding: 1.5%;
}

.voucher {
  padding: 1.5% 5.5% 1.5% 1.5%;
  margin: 0.8%;
}

.guest, .guest-img, .guest-name,
.container, .part-1, .part-2, .name, .location,
.container-2, .part-3, .part-4, .delivery, .time,
.container-3, .voucher, .upper, .lower, .voucher-img, .voucher-value {
  flex-shrink: 0;
}

}


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

  .name {
    padding-top: 1.5% !important;
  }

  .location {
    font-size: 20px;
  }

  #search-btn, #filter-btn {
    margin-top: 9px;
  }

  .free_delivery_title {
    font-size: 14px;
  }

  #free_delivery_content {
    padding: 4px;
  }
}

/* -------------TABLET PORTRAIT--------- */

@media screen and (max-width: 900px){
	/* updated 14/9/2021 */
	.footer_button_area{
		border-radius: 0;
	}
	/* updated 13/9/2021 */
	/*.footer_button_area,*/
  #free_delivery {
   position: fixed;
   width: 100%;
 }

 /* updated 13/9/2021 */
 .phone{
  background-image: none;
}
.voucher-value {
  font-size: 16px;
}

#free_delivery_content {
  font-size: 12px;
  padding: 5px;
}

.free_delivery_title{
  font-size: 12px;
}
}

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


  #pages_maincontent{

    top: 0px;

  }

  .logo_image a img{

    max-width:30%;

    padding:22px 0 0 0;

  }

  blockquote{

    font-size:15px;

    line-height:22px;

  }

  blockquote span{

    font-size:14px;

    line-height:22px;

  }

  ul.features_list li{

    width:96%;

    clear:both;

    font-size:14px;

    padding:0 2% 15px 2%;

    margin:0 0 15px 0;

  }

  ul.features_list li:nth-child(even){

    float:left;

  }

  ul.features_list li span{

    padding:2% 0 0 5%;

    font-weight:700;

  }

  ul.features_list_detailed li{

    width:96%;

    clear:both;

    padding:10px 2%;

  }

  ul.features_list_detailed li .feat_small_details h4{

    font-size:16px;

  }

  a.button_full{

    padding:10px 0;

  }

  .bottombarpages{

    height:60px;

  }

  .gallery_switch a{

    width:8%;

    padding:0px;

  }

  .gallery_switch a img{

    max-width:60%;

  }

  .slidertoolbar .slider-caption{

    bottom:40%;

    text-align: center;

  }

  .swiper-container {

    height: 100%;

  }

  .toolbar-icon a{

    width:31%;

    margin:1.1%;

    padding:5% 0;

  }

  .part-4 {
    margin-left: -3%;
  }

}

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


  .navbarpages.navbarpagesbg{

    background-size: contain;

  }

  .voucher {
    padding: 2.5% 9.5% 2.5% 2.5%;
    margin: 1.1%;
    width: 27%;
  }

  .delivery-icon {
    width: 29px;
  }

  .tab button {
   padding: 12px 0px 12px 0px;
 }

 .container-4 .vege {
  padding: 7px 19px 6px 5px !important;
}


}
@media screen and (max-width: 680px)
{
  .footer_button_area,
  #free_delivery {
   position: fixed;
   width: 100%;
 }

}



@media only screen and (min-width: 600px) {
	.container {
    margin: 5.5% 5% 1% 5%;
  }

  .name {
    padding-top: 3%;
  }

  .location {
    font-size: 18px;
  }

  .modal-content {
    width: 454px;
    height: 477px;
  }

  h4#modal-text {
    top: 63%;
  }
}

@media only screen and (min-width: 768px) {
  .navbarpages.navbarpagesbg {
    background-size: 100% auto;
    height: 228px;
  }

  img.img {
    width: 70%;
  }

  h4#modal-text {
    font-size: 24px;
  }

}
/* -----------------floating button---------------- */
.float{
  position:absolute;
  width:60px;
  height:60px;
  bottom:40px;
  right:40px;
  background-color:#25d366;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  box-shadow: 2px 2px 3px #999;
  z-index: 10;
}


.my-float{

  margin-top:15px;
  /*  margin-left:4px;*/
}

/*===============================================*/

/* ewarehouse*/
#order_button{
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  border: none;
}
#order_button:active {
  background-color: #3e8e41;
  transform: translateY(4px);
}

.company-detail
{  
 display: inline-block; 
 text-align: justify;
 margin-left: 4%;
 margin-right: 4%;
 margin-top: 8px;
 font-size: 12px;
 
}

.company-address
{
  margin-top: 8px;
  display: block;
}

.company-ssncode
{ margin-top: 8px;
  display: block;
  text-align: left;
}
/*===============================================*/

/* -----------------MOBILE---------------- */

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

  /* -----------------floating button---------------- */
  .float{
   position:fixed;
   width:60px;
   height:60px;
   bottom:40px;
   right:40px;
   background-color:#25d366;
   color:#FFF;
   border-radius:50px;
   text-align:center;
   font-size:30px;
   box-shadow: 2px 2px 3px #999;
   z-index:100;
 }
 .my-float{
  margin-top:15px;
  /* margin-left:4px;*/
}
/* updated 13/9/2021 */
.phone{
	background-image: none;
	width: 100%;
    border: none;
}
/* 5.1 TOP NAVIGATION AND HEADER */

.navbar_left{

  padding:0 0 0 4%;

}

.navbar_right{

  width:40px;

  height:40px;

  margin:0;

}

.logo_text{

  font-size:22px;

  line-height:50px;

}

.logo_image a img{

  max-width:50%;

  padding:17px 0 0 0;

}

/* HEADER RIGHT */

#pages_maincontent{

  top: 50px;

}



/* PANEL RIGHT AND LEFT */

.panel {

  width: 85%;

}

.panel.panel-left.panel-cover {

  left: -85%;

}

.panel.panel-left.panel-reveal {

  left: -85%;

}

.panel.panel-right.panel-cover {

  right: -85%;

}

.panel.panel-right.panel-reveal {

  right: -85%;

}

body.with-panel-left-reveal .views {

  -webkit-transform: translate3d(85%, 0, 0);

  transform: translate3d(85%, 0, 0);

}

body.with-panel-left-reveal .panel-overlay {

  margin-left: 85%;

}

body.with-panel-left-cover .panel-left {

  -webkit-transform: translate3d(85%, 0, 0);

  transform: translate3d(85%, 0, 0);

}

body.with-panel-right-reveal .views {

  -webkit-transform: translate3d(-85%, 0, 0);

  transform: translate3d(-85%, 0, 0);

}

body.with-panel-right-reveal .panel-overlay {

  margin-left: -85%;

}

body.with-panel-right-cover .panel-right {

  -webkit-transform: translate3d(-85%, 0, 0);

  transform: translate3d(-85%, 0, 0);

}

h2.page_title{

  font-size:16px;

  line-height:25px;

  font-weight:400;

  padding:5px 0;

}



.swiper-container-toolbar {

  padding:0 0 5% 0;

}

.slider-caption{

  padding:0;

}

.slider-caption h2{

  font-size:30px;

  line-height:30px;

}

.slider-caption p{

  font-size:14px;

  line-height:18px;

}



.swiper-button-next{

	width: 21px;

  height: 21px;

  bottom:22%;

  right:3%;

}

.swiper-button-prev{

	width: 21px;

  height: 21px;

  bottom:22%;

  right:12%;

  left:auto;

}

.slidertoolbar > .swiper-pagination {

  left: 3%;

}

.content-block {

  padding:25px 5%;

}

.bottombarpages{

  height:50px;

}

.gallery_switch a{

  width:10%;

  padding:0px;

}

.gallery_switch a img{

  max-width:60%;

}

.bottom_menu_open a img{

  max-width:40%;

}



}


/* -----------------SMALL MOBILE---------------- */

@media screen and (max-width: 470px) {
/*  .funnel-container>.funnel-name>span {
color: #333;
    font-size: 12px;
    line-height: normal!important;
    position: absolute;
    bottom: 10%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
    width: 100px;
}*/


  .logo_image a img{

    display:inline-block;

    max-width:60%;

    padding:17px 0 0 0;

  }

  .gallery_switch a{

    width:8%;

    padding:0px 5px;

  }

  .gallery_switch a img{

    max-width:100%;

  }

  .bottom_menu_open a img{

    max-width:45%;

    padding:13px 0 0 0;

  }

  .swiper-button-prev{

   right:15%;

 }

 .toolbar-icon a span {
  font-size: 14px;
}

/* updated 13/9/2021 */
#pages_maincontent {
  /* width: 106%; */
}

.starts {
  width: 90%;
  margin-top: 5%;
}

.name {
  font-size: larger;
  padding-top: 4%;
}

.voucher {
  width: 53%;
  padding: 3.5% 15.5% 3.5% 3.5%;
  margin: 2.5%;
}

.part-4 {
  margin-left: 3%;
}

.container-2 {
  padding: 4.5%;
}

.container-3 {
  margin: -2% 0% 2% 2%;
}

.container-4 {
  margin: 8% 3% 2% 4%;
}

.discount-icon {
  width: 23px;
}

.voucher-value {
  font-size: 14px;
}

.delivery {
  font-size: 16px;
}

#search-btn, #filter-btn {
  width: 13px;
  height: 13px;
  margin-right: 9px;
}

.item_quantity_numeric_area,
.add_item_button {
	/* removed */
  width: 60%;
}

h4#modal-text {
  font-size: 20px;
  top: 49%;
}


}


@media screen and (max-width: 376px){
  .starts {
    margin-top: 7%;
  }

  h6 {
    font-size: 12px;
  }

  .slider-caption h2 {
    font-size: 28px;
  }

  .free_delivery_title {
    padding: 3px 2px 3px 2px;
  }
}



/* -----------------SMALLER MOBILE---------------- */

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

  .gallery_switch a{

    width:10%;

    padding:0px 3px;

  }

  .bottom_menu_open a img{

    max-width:50%;

    padding:15px 0 0 0;

  }

  .toolbar-icon a span {
    font-size: 11px;
  }

  .starts {
    font-size: 13px;
    margin-top: 7%;
  }

}

/* Hi Guest - Header */


@media screen and (width: 1024px){
  .toolbar-icon a img {
    margin: 15px auto 23px auto;
  }

  img.coupon_bg {
    margin-bottom: -2.5%;
  }

  .voucher-value {
    font-size: 18px;
  }

}

@media screen and (width: 768px){
  .method-desc {
    margin-bottom: -2.5%;
  }

  img.coupon_bg {
    margin-bottom: -20px;
  }

  #pages_maincontent {
    width: 103%;
  }

  #search-btn, #filter-btn {
    margin-top: 14px;
  }
}


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

  .container {
    margin: -1% 5% 1% 5%;
  }
  .starts {
    margin-top: 12%;
  }

  .name {
    padding-top: 2.5%;
  }

  .guestimage {
    width: 30px;
    margin: 9px 0px 0px -18px;
  }

/*  h2 {
    font-size: 21px;
    margin: 16px 0px 0px -49px;
  }
*/
  h6 {
    font-size: 14px;
  }

  ul.shop_items li a#addtocart {
    margin-right: -10px;
  }

  #free_delivery_content {
    font-size: 10px;
    padding: 4px;
  }

  .free_delivery_title {
    padding: 3px 1px 3px 1px;
  }

  .modal-content {
    width: 245px;
    height: 342px;
  }

  .close {
    left: 93%;
    top: -12%;
  }

  .prev, .next {
    top: 26%;
    padding: 9px;
    font-size: 27px;
  }
}

@media only screen and (min-width: 321px) and (max-width: 376px) {

  .guestimage {
    width: 38px;
    margin: 10px 0px 0px -19px;
  }

/*  h2 {
    font-size: 28px;
    margin: 18px 0px 0px -58px;
  }*/

  h6 {
    font-size: 16px;
  }

  h4#modal-text {
    top: 57%;
  }

  .modal-content {
    width: 292px;
    height: 346px;
  }

  .close {
    left: 94%;
    top: -10%;
  }

  .prev, .next {
    top: 26%;
    padding: 9px;
    font-size: 27px;
  }

}

@media only screen and (min-width: 377px) and (max-width: 600px){

  .guestimage {
    width: 42px;
    margin: 11px 0px 0px -22px;
  }

/*  h2 {
    font-size: 30px;
    margin: 20px 0px 0px -65px;
  }
*/
  h4#modal-text {
    top: 63%;
  }

  .modal-content {
    height: 400px;
  }
}

@media only screen and (min-width: 601px) and (max-width: 769px){
  .guestimage {
    width: 68px;
    margin: 29px 0px 0px -28px;
  }

/*  h2 {
    font-size: 48px;
    margin: 42px 0px 0px -104px;
  }
*/
  .item_quantity_numeric_area,
  .add_item_button {
    /* removed */
    width: 60%;
  }


}

/* updated 13/9/2021 */
/* removed 1 line */
@media only screen and (min-width: 1024px) and (max-width: 1439px){

  .guestimage {
    width: 97px;
    margin: 34px 0px 0px -38px;
  }
/*
  h2 {
    font-size: 51px;
    margin: 74px 0px 0px -132px;
  }*/

  .item_quantity_numeric_area,
  .add_item_button {
    /* removed */
    width: 60%;
  }


}

@media only screen and (min-width: 1440px){
  .guestimage {
    width: 121px;
    margin: 46px 0px 0px -50px;
  }

/*  h2 {
    font-size: 81px;
    margin: 80px 0px 0px -195px;
  }*/

  ul.shop_items li a#addtocart {
    width: 23%;
    margin-left: 205px;
  }

  .item_quantity_numeric_area,
  .add_item_button {
   /* removed */
   width: 60%;
 }



}
.page-content{
  overflow: none !important;
}
/* loading screen */
.loading-screen{
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1000;
  background: rgba(255,255,255,0.8);
  border: none;
 
}

/* loading screen */
.loading-screen img{
  margin: 90% auto;
  width: 50px;
}

.grid-funnel {
  overflow: auto!important;
  display: grid;
  grid-template-columns: 45% 45%;
  grid-auto-rows: 130px;    
  grid-gap: 10px;
  background-color: #fff;
  color: #444;
  justify-content: center;
  align-content: center;
}

.funnel-container {
  position: relative;
  overflow: auto!important;
  border: 1px solid rgb(220,220,220);
  color: #fff;
  border-radius: 5px;
  padding: 10px;
  font-size: 150%;
  align-content: center;
  text-align: center;
  line-height: 0.6;

}
/*.funnel-container>.funnel-name {
  position: absolute;
  bottom: 6%;
  left: 0;
}*/
.funnel-image {
    position: relative;
    height: 70%;
    display: flex;
    align-items: center;
}
.funnel-container>.funnel-name {
    color: #333;
    font-size: 12px;
    line-height: normal!important;
    height: 30%;
    display: flex;
    /* bottom: 10%; */
    /* margin-left: auto; */
    /* margin-right: auto; */
    /* left: 0; */
    /* right: 0; */
    /* text-align: center; */
    /* width: 125px; */
    align-items: flex-end;
    justify-content: center;
}
funnel>a:hover {

  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}

.funnel-container:focus-within {
  border: 1px solid #326EAB ;
 background-color: #326EAB ;
 box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}
/*
.funnel-image
{
  height: 50px;
}*/