
body{font-family: "Verdana";margin:0; background:#fff;}
hr {border-top: 1px solid #ff6600}
.wrapper{width:1200px;margin:0 auto;}
.stock-image img {min-width: 1200px;width:100%;margin:0 auto;margin:20px 0 0px 0;}



/* Header */
#header{background:#fff;top:0;width:100%;margin:0 auto;}
#header a{font-size:13px;font-size:1.3rem}
#header .wrapper:after, #header .wrapper:before{content:" ";display:table}
#header .wrapper:after{clear:both}

#logo{display:block;width:181px;margin-left:10px;margin-top:30px;line-height:1;float:left}

#Header-Number {display: block;float:right;color: #ff6600;margin-right:10px;}

/* Navigation Menu */
#nav {margin:0 auto;min-width: 1200px; width: 100%;background-color: #4d4d4d;border-bottom: 4px solid #ff6600;border-top: 4px solid #ff6600;}
#nav ul {margin:0 auto;width: 1200px;list-style-type: none;padding: 15px 0 12px 0;overflow: hidden;background-color: #4d4d4d;text-align:center}
#nav ul li {display:inline-block; border-right: 1.5px solid #bbb;margin-left:-5px}
#nav ul li:last-child { border-right: none;}
#nav ul li a {font-size: 20px; display: inline-block; color: white; padding: 10px 40px; text-decoration: none;}
#nav ul li a:hover { background-color: #ff6600;}



/* Main content */
#main-content{padding:10px 40px 40px 40px;background:#FFF;width:1120px;margin:0 auto;clear:both}
#main-content .wrapper:after,#main-content .wrapper:before{content:" ";display:table}
#main-content .wrapper:after{clear:both}



/* Footer */
#footer{position:relative;bottom: 0;background: #4d4d4d;min-width: 1200px;width:100%; border-top: 4px solid #ff6600;}
#footer .wrapper:after, #header .wrapper:before{content:" ";display:table}
#footer .wrapper:after{clear:both}

/* Footer Sitemap */
#footer-links {margin:0 auto; width: 900px; padding: 0 0 20px 0;}
#footer-links ul{float:left; color: white; list-style-type: none;}
#footer-links ul li{display:block;}
#footer-links ul li a {font-size: 15px; display:block; color: white; text-decoration: none;}
#footer-links ul li a:hover { color: #ff6600; text-decoration: none;}
#footer-links ul:last-child {float:left; color: white; list-style-type: none; padding: 30px 0px 0px 300px; font-size:12px;}

/* Footer Info bar*/
#footer-company-info {background-color:#ff6600; width:100%}
#footer-company-info ul {margin:0 auto;padding: 4px 0 4px 0;text-align:center;color: white;}
#footer-company-info ul li{font-size: 12px;padding: 0 10px 0 5px;display: inline-block;border-right: 2px solid white;}
#footer-company-info ul li:last-child{border-right:none;}



/* Products */
.listing{background:#FFF;width:1200px;padding:0 0 50px 0;margin-bottom:10px;display:block;}

.listing-product:last-child{border-bottom:none}
.listing-product{padding:25px 0;border-bottom:1px solid #bbb;overflow:hidden;min-height:245px;background:#FFF}

.listing-image{width:300px;padding:;float:left;position:relative}

.listing-info{width:850px;float:right;padding-top:30px;padding-right:40px;}

.listing-price{width:250px;border:1px solid #fff;float:left;padding:20px 10px 0px 0px;font-size:40px;}
.listing-price ul {margin:30px 0 20px 0;}
.listing-price ul li {display: block;}

.vat{font-size:16px}
.price{font-size:35px;font-weight:bold;padding-bottom:40px;color:#ff6600;}

/* For epos system listings */
.listing-info-epos{width:450px;float:left;padding-top:30px;padding-right:40px;}	
.listing-info-epos ul{padding:10px 0 0 15px;font-size:15px;}
.listing-image-epos{width:400px;padding:;float:left;position:relative}


/* Product tabbed navigation */
.product-bar {margin:0 auto; width: 100%;padding-top:50px;text-align:center;}
.product-bar button{font-weight:bold; font-size:20px; display:inline-block; margin-bottom:55px; padding:15px 18px 15px; border:2px solid #ff6600; border-radius:4px;}
.product-bar button:hover:not(.active){background-color:#ff6600}
.active{color:white;background-color:#4d4d4d;}

/* Fading effect */
#main-content{-webkit-animation: fadeEffect 1s; animation: fadeEffect 1s;}
.listing {-webkit-animation: fadeEffect 1s; animation: fadeEffect 1s;}

@-webkit-keyframes fadeEffect {from {opacity: 0;} to {opacity: 1;}}
@keyframes fadeEffect {from {opacity: 0;} to {opacity: 1;}}


/* Contact */
#contact{width:100%;}
#contact .wrapper:after, #header .wrapper:before{content:" ";display:table}
#contact .wrapper:after{clear:both}

#contact-info {margin:0 auto; width: 1200px; padding: 0 0 20px 0;}
#contact-info ul{float:left; color: black; list-style-type: none;}
#contact-info ul li{display:block;}
#contact-info ul li a {font-size: 15px; display:block; color: black; text-decoration: none;}
#contact-info ul:last-child {float:left; color: black; list-style-type: none; padding: 30px 0px 0px 350px;text-align:left;}

/* Contact Form*/
#form input[type=text], input[type=number]{
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	font-family: "Verdana";
}

#form textarea {
   width: 100%;
    height: 150px;
    padding: 12px 20px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
    resize: none;
	font-family: "Verdana";
}

#form input[type=submit] {
    width: 100%;
    background-color: #ff6600;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

#form input[type=submit]:hover {
    background-color: #cc5200;
}

#form {
    border-radius: 5px;
    background-color: ;
    padding: 20px;
	font-family: "Verdana";
}







