article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display: block; margin: 0; padding: 0;}
* {box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}
html {font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
html, body, div, h1, h2, h3, h4, h5, h6, p, ul, li, form {margin: 0; padding: 0; list-style: none; font-weight: normal;}
body {font-family: 'Dosis', sans-serif; font-size: 14px; color: #000000;}
a, a:hover, a:focus {text-decoration: none; outline: none;}
img {border: none; vertical-align: middle;}
/****************
 * Common Css
 ****************/
.listingpage{overflow: hidden; float: left; width: 100%;}
.container {width: 1100px; margin: 0 auto;}
#topheaderpart {float: left; width: 100%; position: relative; padding:8px 0px; background-color: #9ad2ed;}
#topheaderpart .notice {float: left; width: 100%; text-align: center;}
#headerpart {float: left; width: 100%; position: relative; padding:29px 0px;}
#headerpart .logo {float: left; width: 100%; text-align: center;}
nav.nav {float: left; width: 100%; position: relative; background-color: #9ad2ed;}
nav.nav ul.menus {float:left; width:100%;}
nav.nav ul.menus > li {float: left; position: relative; padding:18px 30px 0px 0px;}
nav.nav ul.menus > li:last-child {padding-right: 0px;}
nav.nav ul.menus > li > a {float: left; color: #ffffff; font-size: 15px; padding-bottom: 18px; font-weight: 600; text-transform: uppercase;}
nav.nav ul.menus > li:hover > a {color: #707070;}
nav.nav ul.menus > li .submenus {position: absolute; z-index: 11; display: none; padding:0px; top:55px; left: 0px; background-color: #ffffff; width: 200px; box-shadow: 0px 2px 7px rgba(0,0,0,0.1); -moz-box-shadow: 0px 2px 7px rgba(0,0,0,0.1); -webkit-box-shadow: 0px 2px 7px rgba(0,0,0,0.1);}
nav.nav ul.menus > li .submenus ul {width: 100%; float: left;}
nav.nav ul.menus > li .submenus li {float: left; width: 100%; border-top:1px solid #f5f5f5;; position: relative;}
nav.nav ul.menus > li .submenus li a {color: #707070; font-size: 13px; font-weight: 600; float: left; padding:8px 15px; text-align: left; width: 100%;}
nav.nav ul.menus > li .submenus li:hover a {background-color: #f5f5f5;}
@media only screen and (min-width:1200px){
	nav.nav ul.menus > li:hover .submenus {display: block;}
}
.contentpart {float: left; width: 100%;}
.productbox {float: left; width: 100%; padding: 50px 0px 0px; text-align: center;}
.productbox h1 {font-size: 32px; line-height: 27px; color: #9ad2ed; font-weight: 700; text-align: center; padding:0px 30px 40px;}
.productbox .prod-gallery {width:680px; display: inline-block; position: relative; height: 510px; padding-left: 550px;}
.productbox .prod-gallery .content {display: none; overflow: hidden; background-color: #ffffff; width: 550px; height:510px; text-align: center; position: absolute; top: 0px; left: 0px;}
.productbox .prod-gallery .content img, .productbox .prod-gallery label img {max-width: 100%; max-height: 100%; position: relative; top: 50%; transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.productbox .prod-gallery input {display: none;}
.productbox .prod-gallery label {float: left; background-color: #ffffff; cursor: pointer; margin:0px 0px 10px 10px; border:1px solid #e2e2e2; width:120px; height: 120px; text-align: center;}
.productbox .prod-gallery label.last {margin-bottom: 0;}
.productbox .prod-gallery input:checked + label {border-color: #9ad2ed;}
#prod1:checked ~ #content1,
#prod2:checked ~ #content2,
#prod3:checked ~ #content3,
#prod4:checked ~ #content4 {
  display: block;
}
.prodetails {float: left; width: 100%; margin-top:35px;}
.contentpart .ctitle {float: left; width: 100%; text-transform: uppercase; position: relative; line-height: 18px; color: #ffffff; text-align: center; background-color: #9ad2ed; font-size:20px; font-weight: 700; padding: 14px 28px; letter-spacing: 1px; border-radius: 4px 4px 0px 0px; -webkit-border-radius: 4px 4px 0px 0px; -moz-border-radius: 4px 4px 0px 0px;}
.prodetails .proinner {float: left; width: 100%; padding:30px 30px 30px; border:1px solid #9ad2ed;}
.prodetails h3 {float: left; width: 100%; letter-spacing: 1px; padding-bottom: 3px; text-transform: uppercase; line-height: 20px; color: #707070; font-size:15px; font-weight:600;}
.prodetails p {float: left; width: 100%; font-size:15px; color: #707070; line-height: 22px; letter-spacing: 0.2px; margin: 10px 0px;}
.prodetails ul {float: left; width: 100%;}
.prodetails ul li {color: #707070; padding-left: 15px; font-size: 15px; background-image: url(../images/point.png); background-position: 0px 6px; font-weight: 500; background-repeat: no-repeat; float: left; width: 100%; margin:5px 0px;}
.buying p {width: 50%; padding-right: 50px;}
.tabs {margin: 40px 0px 0px; float: left; width: 100%;}
.tabs input {display: none;}
.tabs label {float: left;  font-weight: 700; letter-spacing: 0.5px; font-size: 16px; color: #707070; background-color: #f1f1f1; padding:14px 30px; margin-right:3px; text-transform: uppercase; cursor: pointer; border-radius: 4px 4px 0px 0px; -moz-border-radius: 4px 4px 0px 0px; -webkit-border-radius: 4px 4px 0px 0px;}
.tabs label:hover, .tabs input:checked + label {background-color: #9ad2ed; color: #ffffff;}
.tabs label.last {margin-right: 0;}
.tabs .content {display: none; float: left; width: 100%; border: 1px solid #9ad2ed;}
.tabs #tab1:checked ~ #content1,
.tabs #tab2:checked ~ #content2,
.tabs #tab3:checked ~ #content3, 
.tabs #tab4:checked ~ #content4, 
.tabs #tab5:checked ~ #content5 {
	display: block;
}
.tabs .innerbox {float: left; width: 100%;  padding:20px 28px;}
.tabs .innerbox p {font-size: 15px; width: 100%; float: left; line-height: 22px; color: #707070; margin:10px 0px; letter-spacing: 0.2px; margin: 10px 0px;}
.prodetails ul {float: left; width: 100%;}
.prodetails ul li {color: #707070; padding-left: 15px; font-size: 15px; background-image: url(../images/point.png); background-position: 0px 6px; font-weight: 500; background-repeat: no-repeat; float: left; width: 100%; margin:5px 0px;}
.services {float: left; width: 100%;}
.services ul {float: left; width: 100%; text-align: center; padding:40px 0px;}
.services li {display: inline-block; padding: 0px 40px;}
.services li .icon {float: left; height: 44px; background-repeat: no-repeat; background-position: 50% 50%;}
.services li .icon1 {background-image: url(../images/icon1.png); width: 52px;}
.services li .icon2 {background-image: url(../images/icon2.png); width: 62px;}
.services li .icon3 {background-image: url(../images/icon3.png); width: 39px;}
.services li h3 {float: left; font-size: 18px; color: #9ad2ed; font-weight:600; text-transform: uppercase; padding-left: 12px; line-height:44px;}
.footerpart {float: left; width: 100%; padding:35px 0px 40px; background-color: #23c7de;}
.footerpart .copyright {float: left; width: 100%; position: relative;}
.footerpart .copyright .bttn {float: left; font-size: 16px; height: 38px; position: absolute; left: 50%; transform: translateX(-50%); width: 134px; line-height: 38px; letter-spacing: 0.1px; font-weight: 700; text-align: center; background-color: #ffffff; text-transform: uppercase; color: #23c7de; padding:0px 22px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
.footerpart .copyright .bttn:hover {background-color: #000000;}
.footerpart .copyright p {float: left; color: #ffffff; font-size: 16px; font-weight: 500; padding-top:10px;}
.footerpart .copyright .paypal {float: right; padding-top:10px;}