@import url(http://fonts.googleapis.com/css?family=Lato);

body, html { overflow-x:auto; }

body{
font-family: 'Lato', sans-serif;
}

*{
margin:0;
padding:0;

}


a{
outline:0;
text-decoration:none;
color:#999999;
font-size: smaller;
}

a img{
border:none; 
}

.fr{
float:right;
}

.fl{
float:left;
}

.clear{
clear:both;
}


.wrapper{
width:75vw;
margin:0 auto;
}

#logo{
float:left;
width: 30%;
}


.search{
float:left;
width:50%;
}

.search-resp{
    display: none;
    width:100%;
}

.search-resp input[type="text"]{
background:#fff;
color:#333333 !important;
font-style:italic;
border: 2px solid #aaa;
box-shadow: 1px 1px 1px #bbb;
height:25px;
width:360px;
margin-top: 20px;
padding-left:10px;
border-radius: 5px;
}

.search-resp .searchbutton{
    margin-left:5px;
    vertical-align:middle;
}

.cart-header{
float:right;
width:20%;
}

.search input[type="text"]{
background:#fff;
color:#333333 !important;
font-style:italic;
border: 2px solid #ddd;
/*box-shadow: 1px 1px 1px #bbb;*/
height:25px;
margin-top:30px;
width:90%;
padding-left:10px;
border-radius: 5px;

}

.search input[type="image"]{
vertical-align:middle;
margin-left:-30px;
}

.search-resp input[type="image"]{
vertical-align:middle;
margin-left:-30px;
}

.search p{
color:#666666;
font-size:13px;
}

.cart-icon{
   float:right;
   width:20%;
}

.shp{
font-weight:bold;
font-size:18px !important;
float:right;
margin-top:15px;

}


.shp a{
color:#666666;
padding-bottom:6px;

}
.shp2{
float:right;
color: white;
background-color: #666666;
border-radius: 12px !important;
font-weight:bold;
margin-left:3px;
padding: 1px 9px;
-webkit-transition-duration: 0.2s; /* Chrome, Safari, Opera */
    transition-duration: 0.2s;
}

.shp a:hover>.shp2{
  background-color: #C3CF21;
-webkit-transition-duration: 0.2s; /* Chrome, Safari, Opera */
    transition-duration: 0.2s;
}

.shp a:hover{
    border-bottom: 2px solid #C3CF21;
}

.header{
height:110px;
padding-top:10px;
background:white;
text-align: center;
width: 100%;
}

#techbroz-logo{
    width: 16vw !important;
    float:left;
}

#divbg{
/*background:url(../images/sliderbg.png) repeat-x;*/
/*height:320px;*/
background: #767561;	
}

#resp-nav{
    display:none;
}

.nav{
height:100%;
/*background:url(../images/nav.png) repeat-x;*/
background-color: #C3CF21;
font-size: small;
}

.nav li{
float:left;

list-style:none;
}



.nav li:hover{
    background-color: #767561;
}

.nav li:hover>a{
    color: #eee;
}

.nav li a{
display:block;
color:#333333;
/*text-shadow: -1px 0px 2px rgba(184, 192, 54, 1);*/
font-weight:bold;
line-height:36px;
/*background:url(../images/splitter.png) no-repeat top right;*/
padding:0px 15px;
}


.nav li a.first{
/*padding-left:0px;*/
}

.prod-dropdown{
  display:none;
  position:absolute;
  width: 30vw;
  z-index:9999;
  background: #767561;
  box-shadow: 1px 1px 4px #333;
}

.prod-dropdown li{
  padding: 0 10px;
  width:12vw;
}

.prod-dropdown li a{
  font-size: smaller;
  font-weight:300;
  color: #eee;
}

.prod-dropdown li a:hover{
  color: #C3CF21;
}

#default-nav ul li:hover > .prod-dropdown{
  display:block;
}



/* Start of repsonive menu -------------*/

/* Initial menu */
.resp-menu {
  display:none;
  background: #767561;
  right: -100vw;  /* start off behind the scenes */
  position: absolute;
  width: 100vw;
  z-index:9999;
}

/* Basic styling */

.jumbotron {
  background-image: url('http://s3.amazonaws.com/codecademy-content/courses/ltp2/img/uber/bg.png'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.resp-menu ul {
  border-top: 1px solid #555555;
  list-style: none;
  margin: 0;
  padding: 0;

}

.resp-menu li {
  border-bottom: 1px solid #555555;
  line-height: 40px;
  
}

.resp-menu a {
  color: #eee;
  /*font-size: 15px;
  text-decoration: none;
  text-transform: uppercase;*/
  padding-left: 20px;
}

.resp-subcat{
  display:none;
  background-color: #333333 !important;
  padding-left: 0px !important;
}

.resp-subcat li{
  

}

.resp-subcat a{
  padding-left:40px;

}

.current{
  background-color: #666;
  color: #C3CF21;
}

.icon-close {
  cursor: pointer;
  padding-left: 10px;
  padding-top: 10px;
  text-align:center;
}

.icon-close button{
  cursor: pointer;
  position: relative;
  display: inline-block;
  margin-bottom: 10px;
  padding: 6px 15px;
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  line-height: 1.42857143;
  background: transparent;
  border: 1px solid #C3CF21;
  color: #C3CF21;
  border-radius: 4px;
  white-space: nowrap;
  text-transform: uppercase;
}

.icon-menu {
  /*color: #fff;
  cursor: pointer;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-top: 25px;
  text-decoration: none;
  text-transform: uppercase;*/
}

.icon-menu i {
  margin-right: 5px;
}

/*End of responsive menu ---------------*/

.fbtwt{
float:right;
margin-top:7px;
}

#gplus{
	display:block;
	width:22px;
	height:22px;
	background:url(../images/gp.png) no-repeat;
	float:left;
	margin-left:5px;
	/*margin-right:52px;*/
}
#gplus:hover {
	background:url(../images/gpovr.png) no-repeat;
}


#fb{
	display:block;
	width:22px;
	height:22px;
	background:url(../images/fb.png) no-repeat;
	float:left;
	margin-left:5px;
	/*margin-right:22px;*/
}
#fb:hover {
	background:url(../images/fbovr.png) no-repeat;
}

#twt{
	display:block;
	width:27px;
	height:22px;
	float:left;
	margin-left:5px;
	background:url(../images/ln.png) no-repeat;
}
#twt:hover {
	background:url(../images/lnovr.png) no-repeat;
}

#twt2{
	display:block;
	width:27px;
	height:22px;
	float:left;
	margin-left:5px;
	background:url(../images/twt2.png) no-repeat;
}
#twt2:hover {
	background:url(../images/twt2ovr.png) no-repeat;
}

.catl{
width:140px;
float:left;
/*border-right:1px solid #cccccc;*/
min-height:410px;
background: #ddd;
}

.catl h4{
  background: #C3CF21;
  padding-left: 10px;
  color: #333333;
}

.catl ul{
margin-top:20px;
}

.catl li{
list-style:none;
position: relative;
line-height:25px;
padding-left:5px;
background:url(../images/arw.png) right bottom no-repeat;
}
.catl ul ul li, .catl li.nobg {
background:none;
}
.catl li:hover {
background: #000;
}
.catl ul ul li:hover {
background: #A2AD00;
}
.catl ul ul{
position: absolute;
visibility: hidden;
width:200px;
text-transform:uppercase;
left:140px;
padding:5px;
top:-20px;
border:1px solid #A2AD00;
background:#fff;
} 
.catl ul li:hover ul{
visibility:visible;
} 

.catl li a{
color:#999999;
font-size:15px;
display:block;
}
.catl li a:hover {
color:#FFFFFF;
}

.catr{
float:right;
width:100%;
text-align:center !important;
}

#index-content{
  width: calc(100% - 145px);
  margin-left:5px;
}

#index-content .prdrow{
  width: 110px;
}

.prdhr a{
width:102px;
height:24px;
display:block;
background:url(../images/atc.png) no-repeat;
margin:0 auto;
}



.prdrow{
float:left;
width:17.745%;
padding:10px;
text-align:center;
margin: 10px auto 30px auto;
}

.prdamount{
font-weight:bold;
font-size:18px;
margin-bottom:5px;
}

.prdtext{
font-size:13px;
height:50px;
overflow:hidden;
}

.prdrow .estormore{
color: #666666;
display:block;
text-align:center;
font-size:13px;
}

.gr .estormore{
color: #666666;
font-size:13px;
font-weight:bold;
}

.uparrow{
float:left;
}

.uparrow a{
float:none !important;
}

#main{
margin-top:20px;
width:100vw;
}

.dot{
/*background:url(../images/dot.png) repeat-x;*/
border-top: 1px solid #CCC;
}

.part{
float:left;
margin-top:10px;
}

.part p{
float:left;
width:300px;
padding-right:10px;
font-size:14px;
color:#999999;
line-height:20px;
padding-top:10px;
}

.part a{
color:#330033;
font-size:13px;
}

.part img{
float:right;
}

.part h3{
color:black;
}


/*headings*/
h3{
color:#333333;
font-size: 	18px;
font-weight:bold;
}

h2{
color:#333333;
font-size: 	18px;
font-weight:100;
}



#footer{

height:250px;
/*background:url(../images/footer.png) repeat-x;*/
background: #E9EAED;
margin-top:30px;
border-top:5px solid #C3CF21;
}

#ftf{
padding-top:26px;

}

.fta{
color:#6d6e70;
font-size:13px;
margin-left:30px;
}

.fti{
padding-top:3px;
}

.ftp a{
color:#6d6e70;
text-decoration:underline;
font-style:italic;
}

.ftbottom{
color:#6d6e70;
/*margin-top:5px;*/
}

.ftbottom .fl a{
color:#6d6e70;
padding-right:17px;
margin-right:21px;
float:left;
font-size:13px;
}

.ftbottom .fr{
font-size:12px;
}

.splitter{
padding-top:3px;
background:url(../images/dot.png) bottom left repeat-x;

}

.breadcrumb{
font-size:12px;
margin-bottom:10px;
}

.breadcrumb a{
color:black;
}

h4{
color:#6d6e70;
padding:5px 0px;
}

.spec{
/*margin-top:30px;*/
}

.specrow{
padding:10px 10px 25px 10px;
border-bottom: 2px solid white;
}


.specrow .prdhr a{
width:81px;
height:20px;
display:block;
background:url(../images/atc2.png) no-repeat;
}

.atc{
width:102px;
height:24px;
display:block;
background:url(../images/ats.png) no-repeat;
}

.gl{
float:left;
width:450px;
margin-left:10px;
}

.gr{
width:280px;
float:right;
padding:10px;
background:#ddd;
}

.gr h2{
color:#333333;
font-size:18px;
font-weight:bold;
}

.gr p{
font-size:11px;
padding:10px 0px;
}

.gr p span{
color:#cc3333;
}

h1{
color:#333333;
font-size:26px;
}

.wp{
font-size:13px;
}

.cl{
font-size:28px;
color:#660033;
font-weight:bold;
}

.str{
color:#333333;
text-decoration:line-through;
font-size:14px;
}

.qt{
}

.qt input[type="text"]{
width:30px;
border:1px solid #d9d9d9;
background:white;
text-align:right;
}

.qt a{
display:inline-block;
margin-left:25px;
}

.dnote{
padding-left:10px;
color:#333333;
padding-right:150px;
padding-bottom:50px;
font-size:13px;
}

.dnote a{
color:#333333;
font-weight:bold;
}

.repro{
padding-left:10px;
}

.repro .prdrow{
width:180px;
}

#heading h1{
float:left;
color:#6d6e70;
font-size:30px;
font-size:40px;
}

#heading a{
font-size: inherit;
margin-left: 5px;
}

#heading a:hover{
text-decoration: underline;
}

.pageselected{
  cursor: pointer;
  position: relative;
  display: inline-block;
  margin-bottom: 4px;
  padding: 0px 7px;
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  line-height: 1.42857143;
  background: #C3CF21;
  border: 1px solid #C3CF21;
  color: #C3CF21;
  border-radius: 9px;
  white-space: nowrap;
  text-transform: uppercase;
}

.page{
float:right;
font-size:13px;
color:black;
}

.page a{
color:black;
}

.page a b{
font-size:15px;
}

#subhead{
padding:20px 0px;
font-size:13px;
line-height:30px;
}


#subhead .fl{
float:left;
}

.sort{
float:left;
margin-left:75px;
}

.sortby{
width:182px;
height:30px;
line-height:30px;
font-size:14px;
background:url(../images/sort.png) no-repeat;
float:left;
margin-left:5px;
position:relative;
}

.top{
position:absolute;
top:0px;
right:14px;
width:14px;
cursor:pointer;
display:block;
height:14px;
}


.bottom{
position:absolute;
bottom:0px;
right:14px;
width:14px;
cursor:pointer;
display:block;
height:14px;
}


#go{
display:block;
width:33px;
height:32px;
float:right;
background:url(../images/go.png) no-repeat;
margin-left:5px;
}

#prds .prdrow{
/*width:180px;*/
text-align:center;
}


.ss{
padding-left:5px;
color:black;
font-weight:bold;
}

.cart{
width:100%;
float:right;
}

.item,.qnt,.price,.action{
float:left;
}

.item{
width:50%;
}

.qnt{
width:18%;
}

.price{
width:18%;
}


.cartheader{
height:30px;
line-height:30px;
font-weight:bold;
color:#333333;
border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;
margin-top:10px;
margin-bottom:10px;
}

.cartrow{
line-height:21px;
}
.cartrow .item{
/*padding-right:10px;*/
width:50%;
}

.cartrow .item img{
float:left;
width:103px;
margin-right:10px;
}

.cartrow .item h4{
color:#333333;
font-size: 9pt;
}


.cartrow .action{
padding-top:3px;
padding-left: 15px;
}

.cartrow .qnt span{
background:#e5e5e5;
border:1px solid #999999;
padding:5px 10px;
}

.cartrow{
padding:10px 0px 15px 0px;
border-bottom:1px solid #cccccc;

}

#total{
font-weight:bold;
}

#total .sss{
padding-left:110px;
}

.cbdr{
border-top:1px solid #cccccc;
margin: 15px 0px;
}

.dsd{
font-size:18px;
}

#billingdiv{
  width:47%; 
  margin-right: 15px;
  display: inline-block;
}

#shippingdiv{
  width:47%; 
  margin-left: 15px;
  display: inline-block;
}

.billrowl{
text-transform:uppercase;
font-size:12px;
font-weight:bold;
padding-bottom:3px;
}

.billrow2{

font-size:12px;

padding-bottom:3px;
}

.billrow input[type="text"]{
width:100%;
background:#e5e5e5;
border:1px solid #999999;
height:30px;
border-radius:3px;
}

.billrow input[type="password"]{
width:100%;
background:#e5e5e5;
border:1px solid #999999;
height:30px;
border-radius:3px;
}

.billrow a {
width:40%;
background:#A2AD00;
color:#FDFDFD;
font-size:180%;
-webkit-border-radius: 17px;
-moz-border-radius: 17px;
border-radius: 17px;
padding: 5px 20px;
}


.billrow select{
width:100%;
background:#e5e5e5;
border:1px solid #999999;
height:30px;
border-radius:3px;
}

.billrow  textarea{
width:100%;
background:#e5e5e5;
border:1px solid #999999;
height:81px;
border-radius:3px;

}

.billrow{
padding-bottom:10px;
    margin: 0 10px;
}

#procced{
width:203px;
height:23px;
cursor:pointer;
border:none;
background:url(../images/proceed.png) no-repeat;
}

#review{
width:203px;
height:23px;
cursor:pointer;
border:none;
background:url(../images/review.png) no-repeat;
}

.w238{
width:210px;
padding-left:18px;
border-right:1px solid #cccccc;
margin-top:30px;
float:left;
}

.w238 h1{
color:#6d6e70;
font-size:24px;

}

.w238 p b{
font-size:17px !important;
line-height:22px;
color:black;
}

.w238 p{
color:#666666;
}

.as{
padding-top:5px;
}

.wasd{
	
float:left;
width:353px;
margin-left:25px;
margin-top:30px;
}

.as a{
float:right;
margin-right:15px;
}

.wsl h1{
color:#643687;
font-size:26px;
text-transform:uppercase;
}

.pts{
color:#6d6e70;
font-weight:bold;
margin-top:10px;
}

.des{
color:#6d6e70;
font-size:13px;
margin-top:10px;
}

.des a{
color:black;
text-decoration:underline;
}
.pts b{
color:black;
}

.from{
margin-top:10px;
font-size:14px;
}

.from b{
font-size:18px;
}

.wsl{
width:150px;
float:left;
}

.wsr{
float:right;
padding-left:20px;
}

.htr{
border-right: 1px solid #CCCCCC;
float:left;
width:150px;
background:#dcd2e4;
margin-top:12px;
height:291px;
margin-left: 25px;
}

.htr1{
border-right: 1px solid #CCCCCC;
float:right;
width:150px;
background:#dcd2e4;
margin-top:12px;
height:291px;
}


.htr h1{
color:#333366;
font-size:28px;
text-align:center;
}

.htr p{
padding-left:14px;
font-size:12px;
}

.htr p a{
color:black;
text-decoration:underline;
}



.cart_bxtxt3 {
    float: left;
    padding-right: 10px;
    width: 17%;
}

.uparrow a {
    background: url("../images/arows.gif") no-repeat scroll 0 0 transparent;
    display: block;
    float: left;
    height: 13px;
    width: 12px;
}
.uparrow a.addup {
    background-position: 0 0;
}
.uparrow a.adddown {
    background-position: 0 -13px;
}
label.error {
    color: #920000;
    display: block;
}

#msgsucess {
    background: none repeat scroll 0 0 #57A100;
    border-bottom: 1px solid #E0E0E0;
    border-left: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;
    color: white;
    display: none;
    font-size: 14px;
    height: 30px;
    left: 0;
    line-height: 30px;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 9999;
}

#overlayestore{
width:100%;
position:fixed;
background:white;
opacity:0.5;
filter:alpha(opacity=50);
top:0;
left:0;
z-index:9995;
display:none;
}

#overlaymainestore{
width:635px;
min-height:393px;
position:fixed;
top:30px;
left:0px;
z-index:9999;
background:white;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border:2px solid #aaa;
display:none;
}

#closeest{
position:absolute;
right:-15px;
top:-15px;
background-image:url(../images/smestore/close.png);
display:block;
width:32px;
height:31px;
border-radius: 19px;
}

#addcontenthere{
padding:10px;
}

#overlayprodsl{
float:left;
width:435px;
padding:2px;
border:1px solid #e0e0e0;
}

#overlayprodsr{
float:left;
width:160px;
padding-left:5px;
}

.overprjhead{
color:#4a754a;
font-size:18px;
text-transform:uppercase;
}

.overprjdsr{
padding-top:10px;
font-size:13px;
max-height:210px;
color:#6d6e6d;
overflow:hidden;
}

.overprjprice{
font-size:16px;
padding-top:20px;
}

.overprjprice span{
color:#8c0b05;
font-size:24px;
}

.addtocartm {
width:102px;
height:24px;
display:block;
background:url(../images/ats.png) no-repeat;
text-indent:-9999px;

}


#partns{
float: left;
margin-left: 14px;
margin-top: 47px;
}

#partns img{
width: 80px;
margin-right: 5px;
}

.prdimg a{
display:block;
width:100px;
height:82px;
margin:0 auto;
overflow:hidden;
}

#submitme{
display:block;
width:73px;
height:22px;
background:url(../images/submit.png) no-repeat;
cursor:pointer;
border:none;
}

.as .estormore {
    color: #666666;
    display: block;
    font-size: 13px;
    text-align: center;
}

.wsl .estormore {
    color: #666666;
    display: block;
    font-size: 13px;
    text-align: center;
}
.htr  .estormore {
    color: #666666;
    display: block;
    font-size: 13px;
    text-align: center;
}

#sliderId {
    color: #FFFFFF;
    position: relative;
    width: 100%;
}

.unoSliderNav {
    position: absolute;
    right: 10px;
    top: 5px;
    z-index: 100;
}

/*Responsive CSS --------------------------*/
@media (max-width: 768px) {



#techbroz-logo{
    width: 30vw !important;
    margin-top: 8px;
}

.wrapper{
    width: 85vw;
}

.header{
    height:150px !important;
}

.search input[type="text"] {
    width:190px;
}

.search{
    display: none;
}

.search-resp{
    display:inline-block;
}

.search-resp input[type="text"]{
    width:70vw;
}

#default-nav{
    display:none;
}

#resp-nav{
    display:block;
}

.nav{
    height:36px;
}

.cart-header{
    width:40%;
}

.cart-icon{
width:22%;
}

#billingdiv, #shippingdiv{
  width: 100%;
}

}

@media (max-width: 480px) {
   .header{
    height:30vw !important;
}

#techbroz-logo{
    width: 33vw !important;
    margin-top:0px;
}


.login{
    display:none;
}

.prdrow{
  width:40%;
}

.catl{
  display: none;
}

#index-content{
  float:left;
  width:100%;
  margin-left: 0px;
}

.cartheader .qnt, .cartheader .price {
  display:none;
}

}