body{font: 400 16px/1.8 Roboto, sans-serif;margin:0px;font-size:16px; text-decoration:none; background-color:#eeeeee; color:#4c4c4c; font-weight:400;}
.br{border-radius:8px;}
.pimghgt{height:220px;}
.phgt{height:65px !important;line-height: 21px !important;font-weight:bold !important;overflow:hidden;}
.boxhgt{height:425px;}
.boxinhgt{height:375px;}
.boxhgt2{height:425px;}
.bannerbox{max-height:460px;width:100%;overflow:hidden;}
.pstatus1{color:green !important;font-size:18px;font-weight:bold;}

.status1{color:orange;font-size:14px;font-weight:bold;}
.status2{color:brown;font-size:15px;font-weight:bold;}
.status2{color:magenta;font-size:16px;font-weight:bold;}
.status3{color:blue;font-size:17px;font-weight:bold;}
.status4{color:green;font-size:18px;font-weight:bold;}

.ptop{padding-left:10px;padding-right:10px;}
.container {
	width: 99%;
	overflow-x: auto;
	white-space: nowrap;
	abox-shadow:5px 5px #eeeeee;
}
::-webkit-scrollbar {
  height: 4px;              /* height of horizontal scrollbar ← You're missing this */
  awidth: 4px;               /* width of vertical scrollbar */
  border: 8px solid #eeeeee;
}
.wht{color:#ffffff !important;}
.wht a{color:#ffffff  !important;}
.primary{color:#b2de01 !important;}
.primary a{color:#b2de01 !important;}
.secondary{color:#000000 !important;}
.secondary a{color:#000000 !important;}
b{font-weight:800 !important;font-size:110%;color:#000000 !important;}
.bgmain{background-color:#eeeeee !important;border-radius:5px;}
.bgmain a{background-color:#eeeeee !important;}

.abgmain{background-color:#F9F9F9;padding-left:5px;}
.bgmaindark{background-color:#eaeaea;}

.bgprimary {background-color:#b2de01;color:#000000;}
.bgprimary a{background-color:#b2de01;color:#000000;}

.bgsecondary{background-color:#000000;color:#ffffff;}
.bgsecondary a{background-color:#000000 !important; color:#ffffff;}

.greenbg{background-color:#59b524 !important;padding:9px;color:#ffffff;text-decoration:none; border-radius: 3px;}
.greenbg a{background-color:#59b524 !important;padding:9px;color:#ffffff;text-decoration:none; border-radius: 3px;}

.bredbg{background-color:#ec1c24 !important;padding:9px;color:#ffffff;text-decoration:none; border-radius: 2px;}
.bredbg a{background-color:#ec1c24 !important;padding:9px;color:#ffffff;text-decoration:none; border-radius: 2px;}


.boxhgt:hover{border-color:#cccccc;border-width:2px;}
.text{text-decoration:none;font-family:'Roboto',sans-serif; font-weight:normal; text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;text-align:justify;}
.f14{font-size:14px;}

.txt-area{font-size:16px; font-family:'Roboto',sans-serif; font-weight:400; text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important; line-height:30px;text-align:justify;}

.txt-area a {font-weight:400; font-size:16px; font-family:'Roboto',sans-serif;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important; line-height:30px; text-decoration:none;}

.top-row {font-size:15px; font-family:'Roboto',sans-serif;font-weight:normal; text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}
.top-row a {display: inline-block;padding-left: 29px; padding-right:29px;font-family:'Roboto',sans-serif;text-decoration: none;transition: 0.3s;font-size: 15px;  font-weight:normal;}


.add-to-cart {text-align:left;font-weight:normal;line-height:23px  !important;font-size:12px; border-radius:3px; font-family:'Roboto',sans-serif; text-shadow: none !important;
-webkit-box-shadow: none !important; box-shadow: none !important;padding:5px;}


.txt-areas {text-align:left;font-weight:normal;line-height:22px  !important;font-size:14px; font-family:'Roboto',sans-serif; text-shadow: none !important;
-webkit-box-shadow: none !important; box-shadow: none !important;padding-left:0px;}

.txt-areas a{font-weight:normal;font-size:14px !important; font-family:'Roboto',sans-serif;text-decoration:none; line-height:24px !important;text-shadow: none !important;	-webkit-box-shadow: none !important;box-shadow: none !important;}

.txt-areab a {font-weight:400;font-size:15px;font-family:'Roboto',sans-serif;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;line-height:30px;text-decoration:none;}

h1{font-size:35px !important;font-family:'Roboto',sans-serif;font-weight:300;padding:0px;padding-top:5px;padding-bottom:5px;margin:0px; line-height:41px;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}

h2{color:#000000;font-size:25px !important;font-family:'Roboto',sans-serif;font-weight:500;padding:0px;margin:0px;line-height:29px;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}

h2 a{color:#000000;font-size:25px !important;font-weight:500;line-height:29px;text-decoration:none; font-family:'Roboto',sans-serif; text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;padding:0px !important; margin:0px;}

.heading{color:#ffffff;font-size:21px !important;font-family:'Roboto',sans-serif;font-weight:500 ;padding:0px;margin:0px;line-height:23px;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}

h3{color:#000000;font-size:21px !important;font-family:'Roboto',sans-serif;font-weight:500 ;padding:0px;margin:0px;line-height:23px;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}

h3 a{font-size:21px !important; text-decoration:none; font-family:'Roboto',sans-serif;font-weight:400;padding:0px;margin:0px;line-height:23px;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}


.footer {background-color: #0099cc; color: #ffffff; text-align: center; font-size: 12px; padding: 15px;}
/* For mobile phones: */
[class*="col-"] {float:left; width: 100%;font-family:'Roboto',sans-serif;}
* {box-sizing: border-box;}
.row::after { content: "";  clear: both;  display: block;}
.quality{padding-top:190px;padding-right:20px;color:#C9C9C9;font-size:15px;}
.slideb{background-color:#000000;opacity:0.5;}

.col-15 {width:12%;}
.col-20 {width:20%;float:left;}
.col-16 {width:16.6%;float:left;}

.imgp{max-width:100%;}
.imgclients{width:auto;max-height:110px;}
.imgm{padding:15px;height:130px;}

@media only screen and (min-width: 1025px)
{
.ptop{padding-left:50px;padding-right:50px;}
/** Slide Show**/
/*** set the width and height to match your images **/
#slideshow {position:relative;height:450px;overflow:hidden;}
#slideshow IMG {position:absolute;top:0;left:0;z-index:8;opacity:0.0;}
#slideshow IMG.active {z-index:10;opacity:1.0;}
#slideshow IMG.last-active {z-index:9;}
.col-0 {width: 0%;}.col-1 {width: 8.33%;}.col-2 {width: 16.66%;}.col-3 {width: 25%;}.col-4 {width: 33.33%;}.col-5 {width: 41.66%;}
.col-6 {width: 50%;}.col-7 {width: 58.33%;}.col-8 {width: 66.66%;}.col-9 {width: 75%;}.col-10 {width: 83.33%;}.col-11 {width: 91.66%;}
.col-12 {width: 100%;}.col-44 {width: 40%;}
}



@media only screen and (min-width: 769px) and (max-width: 1024px)
{
.proImg{max-height:160px;width:auto;}
.desknodisplay{display:none;}
.lht{max-width:80%;}
.topwid{max-width:1000px; width:100%;}
.main-body{text-align:center;max-width:1000px;width:100%;	aborder: solid 0px #524d3a;}
.header-gap{height:13%;}.logo{max-width:80%;height:auto;}
.pname{font-size:9pt;font-family:sans-serif;font-weight:400;}
.pcode{font-size:8pt;font-family:sans-serif;font-weight:100;}
.pro-img{height:100%;margin:5px;text-align:center;}
.readmore {font-size:11px;font-weight:100;text-align:right;text-decoration:none;font-family:sans-serif;}
.readmore a{font-size:11px;font-weight:100;text-align:right;text-decoration:none;color:#ffffff;padding:5px;}
.col-0 {width: 0%;}.col-1 {width: 8.33%;}.col-2 {width: 16.66%;}.col-3 {width: 25%;}.col-4 {width: 33.33%;}.col-5 {width: 41.66%;}
.col-6 {width: 50%;}.col-7 {width: 58.33%;}.col-8 {width: 66.66%;}.col-9 {width: 75%;}.col-10 {width: 83.33%;}.col-11 {width: 91.66%;}
.col-12 {width: 100%;}.col-44 {width: 40%;}
/** Slide Show**/
/*** set the width and height to match your images **/
#slideshow {position:relative;height:370px;overflow:hidden;}
#slideshow IMG {position:absolute;top:0;left:0;z-index:8;opacity:0.0;}
#slideshow IMG.active {z-index:10;opacity:1.0;}
#slideshow IMG.last-active {z-index:9;}
}


@media only screen and (min-width: 600px) and (max-width: 768px)
{
.imgm{text-align:center;padding:10px;}
.lht{max-width:100%;}.proImg{max-height:160px;width:auto;}.topwid{max-width:768px;width:100%;}.tabnodisplay{display:none;}
.main-body{text-align:center;max-width:768px;width:100%;}
.header-gap{height:7%;}.top-row{abackground-image:url('images/top-bg.jpg');	line-height:40px;height:40px;}
.readmore {font-size:12px;font-weight:300;text-align:right;text-decoration:none;}
.readmore a{font-size:12px;font-family:arial;font-weight:300;text-align:right;text-decoration:none;color:#ffffff;padding:15px;}
.pcode{font-size:8pt;font-family:sans-serif;font-weight:100;}
.pro-img{height:100%;margin:5px;text-align:center;}
.col-t-0 {width: 0%;}.col-t-1 {width: 8.33%;}.col-t-2 {width: 16.66%;}.col-t-3 {width: 25%;}.col-t-4 {width: 33.33%;}
.col-t-5 {width: 41.66%;}.col-t-6 {width: 50%;}.col-t-7 {width: 58.33%;}.col-t-8 {width: 66.66%;}
.col-t-9 {width: 72%;}.col-t-10 {width: 83.33%;}
.col-t-11 {width: 91.66%;}.col-t-12 {width: 100%;}
.col-t-15 {width:15%;}.col-t-44{width:40%;}
/** Slide Show**/
/*** set the width and height to match your images **/
#slideshow {position:relative;height:330px;overflow:hidden;}
#slideshow IMG {position:absolute;top:0;left:0;z-index:8;opacity:0.0;}
#slideshow IMG.active {z-index:10;opacity:1.0;}
#slideshow IMG.last-active {z-index:9;}

}


@media only screen and (min-width: 300px) and (max-width: 599px)
{
.boxhgt{height:395px;}
.boxhgt2{height:245px;}
.pimghgt{height:200px;overflow-x:hidden !important;}
.boxinhgt{height:345px;}
.phgt{height:55px;line-height:24px;}
.bannerbox{height:160px !important;width:100%;overflow:hidden;}

.imgclients{max-width:250px;max-height:120px;}
.imgm{text-align:center;padding:15px;}
.topwid{max-width:600px;margin:0px;width:100%;}.proImg{height:auto;max-width:100%;}
.lht{max-width:90%;}
body {font-size:16px;}
.main-body{max-width:600px;width:100%; margin:0px;	border: solid 0px #524d3a;}
.mobnodisplay{display:none;}.header-gap{height:9%;}.comname{display:none;}.logo{max-width:60%;height:auto;}
.top-row{padding-left:7px;padding-right:7px;}
.top-row a{padding-left:7px;padding-right:7px;}
.col-m-0 {width: 0%;}.col-m-1 {width: 8.33%;}.col-m-2 {width: 16.66%;}.col-m-3 {width: 25%;}.col-m-4 {width: 33.33%;}.col-m-5 {width: 41.66%;}.col-m-6 {width: 50%;}.col-m-7 {width: 58.33%;}.col-m-8 {width: 66.66%;}.col-m-9 {width: 72%;}.col-m-10 {width: 83.33%;}
.col-m-11 {width: 91.66%;}.col-m-12 {width: 100%;}
.mobiledis {width: 100%;clear: both;  display: block;}
.pname{font-size:9pt;font-family:sans-serif;font-weight:400;}
.pcode{font-size:8pt;font-family:sans-serif;font-weight:100;}
.pro-img{height:100%;margin:5px;text-align:center;}
.readmore a{font-size:11px;font-family:sans-serif;font-weight:100;text-align:right;text-decoration:none;padding:5px;}

input[type="text"] {height:35px;width: 95%;font-family: sans-serif;font-size:14px !important;appearance: none;box-shadow: none;border-radius: none;border: solid 1px #707070;transition: box-shadow 0.3s, border 0.3s;padding:6px;}

input[type="text"]:focus {outline: none;	border: solid 1px #707070;	}
textarea{width:95%;font-size:16px;}
/** Slide Show**/
/*** set the width and height to match your images **/
#slideshow {position:relative;height:240px;overflow:hidden;}
#slideshow IMG {position:absolute;top:0;left:0;z-index:8;opacity:0.0;}
#slideshow IMG.active {z-index:10;opacity:1.0;}
#slideshow IMG.last-active {z-index:9;}
}

@media only screen and (max-width: 299px)
{
.boxhgt{height:365px;}
.pimghgt{height:200px !important;overflow-x:hidden !important;}
.boxinhgt{height:315px;}
.phgt{height:48px;}
.imgclients{max-width:250px;max-height:120px;}
.imgm{text-align:center;padding:15px;}
.topwid{max-width:600px;margin:0px;width:100%;}
.proImg{height:auto;max-width:100%;}
.lht{max-width:90%;}
.main-body{max-width:600px;width:100%; margin:0px;	border: solid 0px #524d3a;}
.mobnodisplay{display:none;}.header-gap{height:9%;}.comname{display:none;}.logo{max-width:60%;height:auto;}
.top-row{padding-left:5px;padding-right:5px;}
.top-row a{padding-left:5px;padding-right:5px;}

.col-n-0 {width: 0%;}.col-n-1 {width: 8.33%;}.col-n-2 {width: 16.66%;}.col-n-3 {width: 25%;}.col-n-4 {width: 33.33%;}.col-n-5 {width: 41.66%;}.col-n-6 {width: 50%;}.col-n-7 {width: 58.33%;}.col-n-8 {width: 66.66%;}.col-n-9 {width: 72%;}.col-n-10 {width: 83.33%;}
.col-n-11 {width: 91.66%;}.col-n-12 {width: 100%;}

.mobiledis {width: 100%;clear: both;  display: block;}
.pname{font-size:9pt;font-family:sans-serif;font-weight:400;}
.pcode{font-size:8pt;font-family:sans-serif;font-weight:100;}
.pro-img{height:100%;margin:5px;text-align:center;}
.readmore a{font-size:11px;font-family:sans-serif;font-weight:100;text-align:right;text-decoration:none;padding:5px;}
input[type="text"] {adisplay: block;margin: 0;width: 95%;font-family: sans-serif;font-size:14px;appearance: none;box-shadow: none;border-radius: none;border: solid 1px #707070;transition: box-shadow 0.3s, border 0.3s;padding:6px;}
input[type="text"]:focus {outline: none;	border: solid 1px #707070;	}
textarea{width:95%;font-size:16px;}
/** Slide Show**/
/*** set the width and height to match your images **/
#slideshow {position:relative;height:200px;}
#slideshow IMG {position:absolute;top:0;left:0;z-index:8;opacity:0.0;}
#slideshow IMG.active {z-index:10;opacity:1.0;}
#slideshow IMG.last-active {z-index:9;}
}

.tdnone {text-decoration:none;}
.tdnone a{text-decoration:none;}
.aleft{text-align:left;}
.ctr{text-align:center !important; }

input[type="text"] {height:40px;max-width:100%;margin:5px;width: 98%;font-family: 'Roboto',sans-serif;font-size:14px !important; appearance: none; box-shadow: none;border-radius: 3px;border: solid 1px #cccccc;transition: box-shadow 0.3s, border 0.3s;padding:6px;}
input[type="text"]:focus {outline: none;border: solid 1px #707070;}

input[type="submit"]{border:0px;font-size:14px;font-weight:400;font-family:'Roboto',sans-serif;padding:5px;}
input[type="button"]{border:0px;font-weight:400;font-size:14px;font-family:'Roboto',sans-serif;padding:5px;}

input[type="password"] {height:40px;max-width:100%;margin:5px;width: 98%;font-family: 'Roboto',sans-serif;font-size:14px !important; appearance: none; box-shadow: none;border-radius: 2px;border: solid 1px #cccccc;transition: box-shadow 0.3s, border 0.3s;padding:6px;}
textarea{width:98%;margin:5px;font-size:16px;font-size:14px;font-family:'Roboto',sans-serif;}

select{width:98%;padding:5px;height:30px;border-radius:5px;margin-bottom:12px;margin-top:5px;font-size:11px;font-family:'Roboto',sans-serif;border-color:#eeeeee;}

.rcor {    border-radius: 8px; border-color:#eeeeee; border-width:1px;border-style:solid;   apadding: 2px;}
.rcor2 {    border-radius: 2px; border-color:#eeeeee; border-width:1px;border-style:solid; }
.rcorbdr {border-radius: 3px 3px 0px 0px ; border-color:#cccccc; border-width:1px;border-style:solid;}
.rcorimg {    border-radius: 3px 3px 0px 0px ; border-color:#e7dac3; border-width:0px;border-style:solid;}
.readmore{padding:7px;color:#ffffff;font-weight:200;;font-size:13px;text-decoration:none; border-radius: 4px;}
img{max-width:100%;}
.imgs{max-width:150%;width:100%; height:auto;}
.bgwht{background-color:#ffffff !important;}
.bgwht a{background-color:#ffffff;}
.bgtwo{background-color:#FCFCFC;padding-left:5px;}
.bred{color:#ec1c24 !important;}
.bred a{color:#ec1c24 !important;}
.inquirybg{background-color:#f22c29;padding:9px;color:#ffffff;font-weight:400;font-size:13px;text-decoration:none; border-radius: 3px;}
.inquirybg a{background-color:#f22c29;padding:9px;color:#ffffff;font-weight:400;font-size:13px;text-decoration:none; border-radius: 3px;}

span.stars, span.stars span {display: block;background: url(images/stars.png) 0 -16px repeat-x;width: 80px;height: 16px;}
span.stars span {background-position: 0 0;}
.blk{color:#000000 !important;font-weight:500 !important;}
.blk a{color:#000000 !important;font-weight:500 !important;}
.grey{color:#4c4c4c !important;}
.grey a{color:#4c4c4c !important;}
.blue{color:#26bdec !important;}
.blue a{color:#26bdec !important;}
.green{color:#1da070 !important;}
.green a{color:#1da070 !important;}
.offwht{color:#C5C5C5;}
.offwht a{color:#C5C5C5;}
.offwht2{color:#595959;}
.offwht2 a{color:#595959;}
.golden{color:#888888;}
.golden a{color:#a45500;}
.bp5{padding-bottom:5px;}
.p5{padding:5px;}
.p3{padding:3px;}
.p10{padding:10px;}
.p10 a{padding:10px;}
.p15{padding:15px;}
.p20{padding:15px;}
.p25{padding:15px;}
.tborder{border-style:solid;border-width:3px;border-color:#eeeeee;}









hr{border:0px;color:#eeeeee;border-color:#ffffff; border-top:1px;border-style:solid;margin:0px;padding:1px;width:100%;}
.dropdown {overflow: hidden;display:inline;}
.dropdown .dropbtn {display:inline;font-size: 15px; border: none;outline: none;apadding: 3px 6px; background-color: inherit;font: inherit; margin: 0;text-align:center;cursor: pointer; outline: none;}
.dropdown:hover .dropbtn {background-color: inherit;}
.dropdown-content {display: none;position: absolute;background-color: #ffffff;width: 100%;left: 0;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 15;}

@media only screen and (min-width: 769px)
{
.dropdown:hover .dropdown-content{display: block;}
}
.dropdown-content a{padding-left:5px;padding-bottom:0px;padding-top:0px;acolor:#000000 !important;font-size:14px;}

.pac-container{z-index: 999999;}
/* code below for panel from left to right for mobile devices */





.overlay {height: 100%;width: 0; top:0px;right:0px;left:0px;bottom:0px; position: fixed;overflow-x: hidden;transition: 0.1s;}

.overlay-content {position: relative;top: 0%; width: 100%;padding:5px;text-align: left;margin-top: 0px;margin:0px;}
.overlay-content a{font-family:'Roboto',sans-serif;font-size:14px;line-height:22px;text-shadow: none;	-webkit-box-shadow: none;box-shadow: none;}

.overlay-content2 {background-color:#ffffff;position: relative;top: 0px; max-width:700px; width: 100%;height:auto;padding:0px;margin-top: 0px;margin:0px;border:solid 0px #cccccc;}

.overlay a {atext-decoration: none;}
.overlay a:hover, .overlay a:focus { color: #333366;}
.closebtn { top: 5px;right: 5px; position:absolute;color:#ffffff !important;}
.closebtn2 { top: 5px;left: 25px; font-size: 50px;position:absolute;float:left}



#anewPop.show
{
    visibility: visible; /* Show the snackbar */
    /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
   However, delay the fade out process for 2.5 seconds */
   -webkit-animation: fadein 0.5s, fadeout 0.0s 0.0s;
   animation: fadein 0.5s, fadeout 0.0s 0.0s;
}


/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 10px; /* Rounded borders */
    padding: 10px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    top: 30px; /* 30px from the bottom */
	font-family:roboto,sans-serif;text-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */
    /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
   However, delay the fade out process for 2.5 seconds */
   -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
   animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {top: 0; opacity: 0;}
    to {top: 30px; opacity: 1;}
}

@keyframes fadein {
    from {top: 0; opacity: 0;}
    to {top: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {top: 30px; opacity: 1;}
    to {top: 0; opacity: 0;}
}

@keyframes fadeout {
    from {top: 30px; opacity: 1;}
    to {top: 0; opacity: 0;}
}