/* only ipad 1024 and bigger screen landscape screen */
@media only screen and (min-width: 1001px) {
	#mainmenu > ul { display:block !important; }
	#slogan { background:#dc1d43; width: 100%; padding:10px 0 13px 0; font-family:'SegoePrint-Bold', Arial, Helvetica, sans-serif; float:left; font-size:20px; text-align:center; color:#fff; line-height:1.1; border-bottom: 1px solid #fff; }
}

	/*==========================================================================================================*/
@media screen and (max-width: 1000px) {
	
	@font-face {
	font-family: 'Gadugi';
	src: url('../fonts/Gadugi-Bold.eot');
	src: url('../fonts/Gadugi-Bold.eot?#iefix') format('embedded-opentype'),
	url('../fonts/Gadugi-Bold.woff') format('woff'),
	url('../fonts/Gadugi-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

	@font-face {
  	font-family: 'SegoePrint-Bold';
  	src: url('../fonts/SegoePrint-Bold.eot') format('embedded-opentype'),
  	url('../fonts/SegoePrint-Bold.woff') format('woff'),
  	url('../fonts/SegoePrint-Bold.ttf') format('truetype');
  	font-weight: bold;
  	font-style: normal;
} 
	
	body { min-width:320px; }
	img { max-width: 100%; width:auto; height:auto; }
	.wrap { width:auto; }
	.main { padding:5px 5px 5px 5px; }
	.default-grid.form-grid.cols2 .col { width:auto; float:none; }
	.buttonset .col a { margin:0 5px 8px 0; }
	.default-grid.cols4 .col { width:50%; }
	.cols2.default-grid.tab-grid .col { width:100%; }
	.default-grid.cols3 .col { width:100%; }
	.cols3 .col { width:100%; }	
	.image-block figure { width:45%; }
	
	#mainbanner > .wrap { position:relative; padding-top:0; overflow:hidden; }
	.banner-slider { background:#000; border:#000 solid 0px; border-bottom:0; overflow:hidden; }
	.banner-slider .item figure { margin:0; padding-top:0px; }
	.banner-slider .item figure:after { content:''; display:table; clear:both; }
	.banner-slider .item figure img { margin:0 auto; }
	.banner-slider .item figure.img-right img { float:right; }
	
	
	#header { padding:8px 0 10px; }
	.social { margin:22px 0 0; float:left; }
	.slick-dots { display:none !important; }
	#logo { width:100%; }
	
	
	/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */

  	.column {
    width: 100%;
    height: auto;
  	}

	
	
	/* =LOGO BAR
	========================================================================================*/
	.logo-md-wrapper { position: relative; bottom: 0; z-index:2; margin-bottom:0; overflow:hidden; width:100%; }
	.logo-md-wrapper:after { content:''; display: table; clear:both; }

  	#slogan { background:#dc1d43; width: 100%; padding:10px 0 15px 0; font-family:'SegoePrint-Bold', Arial, Helvetica, sans-serif; float:left; font-size:16px; text-align:center; color:#fff; line-height:1.1; }
  
  	.aboutus-section { margin:-20px 0 0 0; padding: 20px; }
	.aboutus-section:after { content:''; display:table; clear:both; }
	.aboutus-content { width:100%; float:left; }
  

	#mainmenu { float:none; clear:both; margin-top:0; padding-top:30px; display:table; width:100%; position:relative; }
	#mainmenu:before, #mainmenu:after  { display:none; }
	#mainmenu > ul { display:none; position:absolute; left:0; width:100%; top:calc(100% + 18px); background:#000000; border:0; z-index:5; padding:0; }
	#mainmenu ul li { float:none; margin:0; padding:0; border-bottom:solid 0px #454545; }
	#mainmenu ul li a { padding:15px 15px; display:block; color:#fff; }
	#mainmenu ul li.active a, #mainmenu ul li a:hover { background:#454545; }
	#mainmenu ul li a:after { display:none; }
	
	/* Responsive Menu line icon*/
	#menu { float:right; margin-top:-20px; }
	.menulines-button { padding:0; cursor: pointer; user-select: none; text-transform:uppercase; font-size:16px; color:#fff; text-decoration:none; }
	.menulines-button em { font-style:normal; font-weight:bold; margin-left:10px; display:inline-block; line-height:1.4; }
	.menulines-button:hover { text-decoration:none; }
	.menulines { display: inline-block; width: 20px; height: 3px; background: #fff; position: relative; float: left; margin:9px 0 0 0; -moz-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); opacity:1; }
	.menulines:before, .menulines:after { display: inline-block; width:20px; height: 3px; background: #fff; position: absolute; left: 0; content:''; -moz-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transform-origin: 0.28571rem center; -moz-transform-origin: 0.28571rem center; -ms-transform-origin: 0.28571rem center; transform-origin: 0.28571rem center; }
	.menulines:before { top: 7px; }
	.menulines:after { top: -7px; }
	.menuopen .menulines { background:none; }
	.menuopen .menulines:before, .menuopen .menulines:after {  -webkit-transform-origin: 50% 50%;  -moz-transform-origin: 50% 50%;  -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; top: 0; } 
	.menuopen .menulines:before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); } 
	.menuopen .menulines:after {  -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }
	
	#mainbanner > .wrap { padding-top:0; } 
	.banner-slider .slick-arrow { opacity:0.5; visibility:visible; }
	.banner-slider .slick-prev.slick-arrow, .banner-slider .slick-next.slick-arrow { transform:none; }
	.social { margin:15px 0 0; }	
	#footer { font-size:15px; }
	
	/* =ECWID NAV BAR 
========================================================================================*/

#newnav { background:#71bd10; max-width:990px; width: 100%; padding:0 0 0 0; float:left; font-size:12px; text-align:center; color:#fff; }

/* Navbar container */
.navbar {
  overflow: hidden;
  background-color: #71bd10;
  font-family: 'Gadugi'; font-weight: normal;
  
}

/* Links inside the navbar */
.navbar a {
  float: left;
  font-size: 12px;
  color: white;
  text-align: center;
  padding: 10px 16px;
  margin: 0 0 0 10px;
  text-decoration: none;
}

/* The dropdown container */
.dropdown {
  float: left;
  overflow: hidden;

}

/* Dropdown button */
.dropdown .dropbtn {
  font-size: 12px;
  border: none;
  outline: none;
  color: white;
  padding: 10px 18px;
  background-color: inherit;
  font: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: rgba(0,0,0,0.9);
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgba(0,0,0,0.9);
  margin:auto;
  left: 20px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.9);
  width:240px;
  z-index: 10000;
}

/* Mega Menu header, if needed */
.dropdown-content .header {
  background: red;
  padding: 16px;
  color: white;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 20%;
  padding: 7px;
  height: 100%;
  color:#fff;
}

/* Style links inside the columns */
.column a {
  float: none;
  color: #fff;
  padding: 7px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a background color on hover */
.column a:hover {
  background-color: #262626;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
	
	/* =ROUND SQUARES
	========================================================================================*/
	#roundsquares { position:relative; padding-top:20px; overflow:hidden; background-color:#fff; margin: 0 0 50px 0; }
	img.roundsquares { padding:20px 0 0 0; max-width: 100%; }
	
	/* =ABOUT US
	========================================================================================*/
	#aboutus > .wrap { position:relative; overflow:hidden; background-color:#ffcc00; padding:20px; }
	p.about { font-size:18px; line-height:1.2; color:#000; }
	h5.about { font-family:'Gadugi', Arial, Helvetica, sans-serif; font-size:30px; color:#000; padding:0; }
	
	/* =TWO BOXES
	========================================================================================*/
	#twoboxes { display: block; z-index: 100; }
	#left { flex: 1; padding:20px 10px 20px 10px; margin:10px 0 0 0; background: #8bc53f; color:#fff; }
	#right { flex: 1; padding:20px 10px 20px 24px; margin:10px 0 0 0; background: #dc1d43; color:#fff; }
	h5.boxes { font-family:'Gadugi', Arial, Helvetica, sans-serif; font-size:30px; color:#fff; margin:0; }
	#greenbag { position:relative; float:left; padding: 0 0 0 0; margin: 0 0 0 0; z-index:1; }
	
} 

/*==========================================================================================================*/
@media only screen and (max-width: 767px) {
	
	#header { position:relative; }
	
	/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */

  	.column {
    width: 100%;
    height: auto;
  	}
	
	
	.default-grid.cols3 .col { width:50%; }
	.default-grid.cols3 .col:nth-child(3) { clear:left; }
	.tabnav { display:none; }
	.tab-container { padding:0; border:none;}
	.tab-data { margin:0 0 30px; }
	.tab-data .tabnav { display:none; }
	.tab-container .tabMobiletrigger { background:#f3f3f3; border:medium none; font-size:15px !important; text-transform:uppercase; margin:0 0 7px; padding:16px 54px 16px 16px; position:relative; cursor:pointer; font-weight:bold; }
	.tabMobiletrigger:after { border-left:8px solid rgba(0, 0, 0, 0); border-right:8px solid rgba(0, 0, 0, 0); border-top:8px solid #848690; content:""; margin-top:-3px; position:absolute; right:19px; top:50%; }
	.tabMobiletrigger:before { background:rgba(0, 0, 0, 0.08); content:""; height:100%; position:absolute; right:0; top:0; width:54px; z-index:1; }
	.tabcontent { padding:15px 0; margin:0; }
	.tabMobiletrigger.rotate:after { border-top-color:#272c2f; -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg); }
	
	.heading-listblock.cols2 .col, .dropcaps-box.cols2 .col { width:100%; float:none; }
	h1, h2 { font-size:20px; }
	.banner-slider .item figure.img-right img { float:none; }
	.aboutus-content { font-size:16px; }
	.aboutus-sidebar { padding-left:24px; width:42%; }
	.aboutus-content { width:58%; }
	.brand-logo-section { padding:0 20px; }
	.aboutus-section { margin-bottom:35px; }
	.brand-logo-section li { width:20%; }
	.brand-logo-section li img { max-width:100%; width:100%; height:auto; }
	.brand-logo-section li:last-child img { width:auto; }
}
/*==========================================================================================================*/
/* only iphone4 landscape & Potriat 300 by 480*/
@media only screen and (max-width: 567px) {	
	
	.default-grid.cols3 .col, .default-grid.cols2 .col, .default-grid.cols4 .col { width:auto; float:none; }
	table.res-table tr th { display:none; }
	table.res-table tr td { display:block; position:relative; padding-left:50%; }
	table.res-table td:before { content: attr(data-th) ": "; font-weight: bold; width: 50%; display:block; padding-right:10px; position:absolute; left:0; top:0; padding:10px 10px; } 
	table.res-table { border-top:0; }	
	#logo { width:100%; }
	
	.list-block.cols3 .col { width:100%; float:none; }
	.image-block figure { width:100%; float:none; padding-right:0; }
	.image-block.right-align figure { padding-left:0; }
	
	#header { padding:14px 0; }
	#logo { width:100%; }
	#menu { margin-top:-26px; }
	#mainmenu > ul { top:calc(100% + 14px); }
	.social { margin:0; }
	.social li { padding:0 2px; margin-right:-5px; -webkit-transform:scale(0.85); transform:scale(0.85); }
	.social-icon.fb { padding-right:0; }
	.aboutus-section { margin-bottom:25px; }
	.content-md-wrapper { padding-bottom:36px; }
	.content-md-box { width:auto; float:none; }
	.content-md-box:first-child { border-right:0; border-bottom:1px solid #fff; }
	.content-md-box:first-child::after, .content-md-box:last-child:after { display:none; }
	
	#footer { padding:34px 0; font-size:14px; }
	.aboutus-content, .aboutus-sidebar { float:none; width:auto; }
	.aboutus-sidebar { padding:0; margin-top:25px; }
	
}
/*==========================================================================================================*/
/* only iphone landscape 340 by 478*/
@media only screen and (max-width: 480px) {

	 .form-inline .form-group label, .form-inline .form-group .field-box { float:none; display:block; width:auto; }
	.form-inline .form-group label.blank { display:none; }
}
/*==========================================================================================================*/
/* only iphone portrait 300 by 479*/
@media only screen and (max-width: 479px) {
	
	#logo { width:100%; }
	#mainmenu { margin:0; font-size:14px; }
	.content-md-wrapper { padding-bottom:26px; }
	.social { margin:-5px 0 0; }
	.social li { padding:0 1px; margin-right:-9px; -webkit-transform:scale(0.65); transform:scale(0.65); }
	.social-icon.fb { padding-right:0; }
	p { margin:0 0 15px; }
	.what-we-offer { margin-bottom:15px; }
	h3 { font-size:16px; }
	.content-md-box p { font-size:14px; }
	.header-right { margin-bottom:12px; }
	#menu { margin-top:-23px; }
} 
/*==========================================================================================================*/
/* Retina css */ 
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2) {
	.sprites, .sp-after:after, .sp-before:before, .slick-prev.slick-arrow:before, .slick-prev.slick-arrow:after, .social li.social-icon a { background-image:url(../images/bgi/sprites@2x.png);
	-moz-background-size:237px 207px; -ms-background-size:237px 207px; -o-background-size:237px 207px; -webkit-background-size:237px 207px; background-size:237px 207px;}
}