﻿@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=latin-ext');
html {width:100%;}
body {width:100%;margin:0px;padding:0px;font-family: 'Open Sans', sans-serif;font-size:16px;font-weight:400;color:#333333;background-image:url('/Content/Images/bg.gif');background-repeat:repeat;}
form {width:100%;margin:0px;padding:0px;}
section{width:980px;margin:auto;padding:30px 0;border-bottom:6px #fbb900 solid;z-index:99;position:relative;}
img {vertical-align:text-bottom;}
div.container{width:980px;margin:auto;padding:0px;position:relative;}
div.clear-both{clear:both;}
/*header*/
header{width:980px;margin:auto;border-top:5px #fbb900 solid;border-bottom:1px #cccccc solid;z-index:501;position:relative;}
header div.logo{padding:20px 0;display:inline-block;vertical-align:top;}
header div.menu{display:inline-block;width:763px;text-align:right;padding-top:25px;vertical-align:top;}
header div.menu ul.social{display:inline-block;margin:0px;padding:0 10px 0 0;list-style:none;border-right:1px #cccccc solid;}
header div.menu ul.social li{display:inline-block;padding:0;margin:0;vertical-align:middle;}
header div.menu ul.social li a{width:40px;height:20px;display:inline-block;background-position-x:50%;background-position-y:50%;background-repeat:no-repeat;}
header div.menu a.phone{padding-left:25px;margin-left:25px;line-height:20px;display:inline-block;color:#333333;text-decoration:none;background-image:url('/Content/Images/phone.png');background-position-x:0;background-position-y:50%;background-repeat:no-repeat;}
header div.menu nav{width:100%;padding-top:5px;}
header div.menu nav ul{display:inline-block;margin:0px;padding:0;list-style:none;}
header div.menu nav ul li{display:inline-block;margin:0;padding:0;vertical-align:middle;padding-left:75px;height:65px;}
header div.menu nav ul li a{display:inline-block;line-height:62px;font-weight:600;font-size:15px;color:#000000;text-decoration:none;}
header div.menu nav ul li a:hover{border-bottom:3px #fbb900 solid;}

div.nav-icon{display:none;}
div.mobilemenumask{display:none;width:100%;height:100%;position:fixed;top:0;left:0px;background-color:rgba(0,0,0,0.80);z-index:500;}
/*detail*/
div.content{}
div.content h1{margin:0;padding:0;padding-bottom:20px;display:block;color:#000000;font-size:24px;font-weight:600;}
div.content h2{margin:0;padding:0;padding-bottom:20px;display:block;color:#000000;font-size:18px;font-weight:600;}
div.content div.image{width:40%;display:inline-block;vertical-align:top;text-align:center;}
div.content div.image img{max-width:75%;text-align:center;display:inline-block;}
div.content div.text-home{width:55%;display:inline-block;padding-top:55px;margin-left:5%;vertical-align:top;}
div.content div.text{width:55%;display:inline-block;margin-left:5%;vertical-align:top;}
/*dealers*/
div.dealers{}
div.dealers div.header{margin-bottom:30px;}
div.dealers div.header span{display:inline-block;color:#000000;font-weight:600;font-size:14px;margin-right:10px;}
div.dealers div.header span.all-count{display:block;padding-bottom:20px;}
div.dealers div.header span.selected-count{display:none;padding-top:20px;}
div.dealers div.header .select2{width:40%;display:inline-block;}
div.dealers div.item{display:none;width:49%;height:100px;padding-bottom:10px;margin:0 1% 10px 0;border-bottom:1px #cccccc solid;vertical-align:top;font-size:14px;}
div.dealers div.item span{display:block;padding-left:30px;background-position-x:0;background-position-y:50%;background-repeat:no-repeat;}
div.dealers div.item span.title{font-weight:600;color:#000000;padding-left:0;margin-bottom:10px;}
div.dealers div.item span.address{background-image:url('/Content/Images/localation.png');background-position-y:0;line-height:21px;margin-bottom:10px;}
div.dealers div.item span.phone{background-image:url('/Content/Images/phone1.png');line-height:21px;}
/*brands*/
div.brands{margin:20px 0 0 0;}
div.brands h1{margin:0;padding:0;margin-bottom:20px;display:block;font-size:17px;color:#010101;font-weight:600;text-align:center;background-image:url('/Content/Images/brands-bg.png');background-position-x:50%;background-position-y:50%;background-repeat:no-repeat;}
div.brands div.items div.item{}
div.brands div.items div.item a{width:100%; text-decoration:none;display:inline-block;outline:none;}
div.brands div.items div.item a img{width:100%;height:auto;border:1px #fbb900 solid;border-top:none;border-bottom:none;-webkit-border-radius:30px 0 30px 0;-moz-border-radius:30px 0 30px 0;border-radius:30px 0 30px 0;}
div.brands div.items div.item a span{height:36px;display:block;padding:2px 0 2px 60px;color:#333333;font-size:13px;background-image:url('/Content/Images/glasses.png');background-position-x:0;background-position-y:50%;background-repeat:no-repeat;}
/*contact*/
div.contact{}
div.contact div.left{width:45%;display:inline-block;vertical-align:top;font-size:15px;}
div.contact div.left div.map{border:5px #e2e2e2 solid;height:320px;margin-bottom:20px;}
div.contact div.left a{display:inline-block;padding-left:30px;margin-bottom:15px;color:#333333;line-height:20px;text-decoration:none;background-position-x:0;background-position-y:50%;background-repeat:no-repeat;}
div.contact div.left a:hover{text-decoration:underline;}
div.contact div.left a.phone{background-image:url('/Content/Images/phone1.png');}
div.contact div.left a.gsm{background-image:url('/Content/Images/gsm.png');}
div.contact div.left a.email{background-image:url('/Content/Images/mail.png');}
div.contact div.left span{display:inline-block;padding-left:30px;margin-bottom:15px;color:#333333;line-height:20px;background-position-x:0;background-position-y:50%;background-repeat:no-repeat;}
div.contact div.left span.fax{background-image:url('/Content/Images/fax.png');}
span[x-apple-data-detectors].fax {
  color: inherit !important;
  text-decoration: none !important;
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}
div.contact div.left span.address{background-image:url('/Content/Images/localation.png');background-position-y:0;}
div.contact div.right{width:50%;display:inline-block;vertical-align:top;margin-left:5%;}
/*contact form*/
.input-text{width:96%;margin-bottom:10px;background-color:#fff;border:1px #bbbbbb solid;padding:2%;outline:none;font-family: 'Open Sans', sans-serif;font-size:16px;font-weight:400;color:#404149;text-align:left;}
.input-textarea{width:96%;height:150px;margin-bottom:10px;background-color:#fff;border:1px #cccccc solid;padding:2%;outline:none;font-family: 'Open Sans', sans-serif;font-size:16px;font-weight:400;color:#404149;text-align:left;}
.input-button{width:100%;margin:0;margin-top:10px;border:none;background-color:#fbb900;font-family: 'Open Sans', sans-serif;font-size:16px;font-weight:400;color:#000;padding:15px 0;outline:none;cursor:pointer;}
/*form*/
.input-validation-error{border:1px #9c0000 solid;background-image:url('/Content/Images/valid1.png');background-position-x:98%;background-position-y:50%;background-repeat:no-repeat;background-size:auto 15px;}
span.form-alert{display:inline-block;color:#cf8d4c;padding-top:15px;text-align:center;}
div.form-loading{display:none;position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,0.40);background-image:url('/Content/Images/loading.gif');background-position-x:50%;background-position-y:50%;background-repeat:no-repeat;}
div.form-success{display:none;text-align:center;position:relative;padding:15px 0;font-size:15px;color:#cf8d4c;}

/*foooter*/
footer{background-color:#252525;padding:30px;margin-top:-3px;z-index:1;color:#888888;font-size:13px;line-height:25px;}
footer span{display:inline-block;width:50%;}
footer span i{font-style:normal;}
footer span i br {content: '';}
footer ul.social{display:inline-block;margin:0px;padding:0;list-style:none;width:50%;text-align:right;}
footer ul.social li{display:inline-block;padding:0;margin:0;vertical-align:middle;}
footer ul.social li a{width:40px;height:20px;display:inline-block;background-position-x:50%;background-position-y:50%;background-repeat:no-repeat;}
@media screen and (max-width:980px) {
    body {font-size:15px;}
    section{width:96%;padding:20px 2%;}
    div.container{width:96%;}
    /*header*/
    header{width:100%;padding:0 0;border-top:none;border-bottom:none;}
    header div.logo{display:block;width:96%;padding:10px 2%;border-top:5px #fbb900 solid;border-bottom:1px #cccccc solid;background-image:url('/Content/Images/bg.gif');background-repeat:repeat;}
    header div.logo img{height:50px;}
    header div.nav-icon{display:block;}
    header div.menu{display:block;width:100%;text-align:center;top:-250px;left:0;padding-top:12px;position:absolute;background-color:rgba(255,255,255,1);-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;z-index:-500;opacity:0;filter: alpha(opacity=0);}
    header div.menu ul.social{padding:0 10px 0 0;}
    header div.menu ul.social li a{width:30px;height:20px;}
    header div.menu nav{width:100%;padding-top:0;margin-top:10px;}
    header div.menu nav ul{width:100%;display:block;border-bottom:1px #cccccc solid;}
    header div.menu nav ul li{width:100%;display:inline-block;vertical-align:middle;padding-left:0;height:auto;}
    header div.menu nav ul li a{width:100%;display:inline-block;line-height:normal;border-top:1px #cccccc solid;line-height:40px;font-size:14px;}
    header div.menu nav ul li a:hover{border-bottom:none;color:#fbb900;}
    /*detail*/
    div.content{}
    div.content h1{padding-bottom:10px;font-size:18px;}
    div.content h2{padding-bottom:10px;font-size:16px;}
    div.content div.image{width:100%;text-align:center;}
    div.content div.image img{max-width:60%;}
    div.content div.text-home{width:100%;padding-top:20px;margin-left:0;vertical-align:top;}
    div.content div.text{width:100%;margin-left:0;padding-top:20px;}
    /*dealers*/
    div.dealers div.header span{display:block;}
    div.dealers div.header .select2{width:100%;display:block;margin-top:10px;}
    div.dealers div.item{width:96%;height:auto;margin:0 2% 10px 2%;font-size:13px;}
    /*contact*/
    div.contact div.left{width:100%;}
    div.contact div.right{width:100%;margin-left:0;margin-top:20px;}
    /*contact form*/
    .input-text{margin-bottom:5px;font-size:14px;}
    .input-textarea{height:80px;margin-bottom:5px;font-size:14px;}
    .input-button{margin-top:5px;font-size:14px;padding:10px 0;}
    /*foooter*/
    footer{padding:20px;}
    footer span{width:100%;margin:auto;text-align:center;display:block;}
    footer span i br:after {content: '\a';white-space: pre-line;}
    footer ul.social{width:100%;text-align:center;margin-top:20px;}
}
/*Menu icon*/
#nav-icon {
    width: 35px;
    height: 30px;
    position: absolute;
    right:2%;
    top:23px;
    margin: 0px auto;
    z-index:503;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}
#nav-icon span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background:#fbb900;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
#nav-icon span:nth-child(1) {
  top: 0px;
}
#nav-icon span:nth-child(2) {
  top: 10px;
}
#nav-icon span:nth-child(3) {
  top: 20px;
}
#nav-icon.open span {
  background-color:#fbb900;
}
#nav-icon.open span:nth-child(1) {
  top: 10px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}
#nav-icon.open span:nth-child(3) {
  top: 10px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}