@import url('reset.css');

body{
 	font-family: 'Open Sans', sans-serif;
	color:#000;
	margin:0;	
	-webkit-font-smoothing: subpixel-antialiased;
	 background:url(../images/bg.png) no-repeat;
}


#toptab{display: block;}
#navtabl{display: block;}
#navbs{display: none;}

@media (max-width: 767px){
#toptab{display: none;}
#navtabl{display: none;}
#navbs{display: block;}
}
			 

/*----------------------------header----------------------------------*/
	
#header{ width:100%; margin: 0 auto;}
.header{max-width:992px; margin: 0 auto; margin-top:20px; margin-bottom:20px;}

#toptab{ width:100%; height:30px; background:#000;}
.toptab{ max-width:992px; margin: 0 auto; padding:2px 10px 0 0; font-family: 'Raleway', sans-serif; font-size:12px; color:#fff; text-align:right;}
.toptab a{color:#fff;}
.toptab a:hover{color:#F7941E; text-decoration:none;}

/*----------------------------footer----------------------------------*/

.footer{  font-family: 'Open Sans', sans-serif; font-size:11px; max-width:992px; color:#000; margin: 0 auto; padding:10px;}

/*----------------------------content----------------------------------*/
	 
#wrapper{ margin:0 auto; width:100%; color:#000; background:url(../images/bg2.png) no-repeat left bottom;}

.wrapper{max-width:992px; padding:10px;  margin:0 auto;} 

.idxbox{height:380px; }
.idximg{-webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);  border-radius:10px;}

.titleShop{ font-family: 'Raleway Light', sans-serif; font-size:28px; color:#FFF; padding:10px 0; background:#AE1E2D; border-top-left-radius:10px; border-top-right-radius:10px; text-align:center; }

.hr{border-bottom:thin solid #BCBEC0; margin:10px 25px; clear:both;}
/*----------------------------type setting----------------------------------*/

.title{font-family:  'Raleway', sans-serif; font-size:32px; font-weight:bold; color:#AE1E2D; font-weight:bold;  margin-bottom:10px;}

.text-reflect {
    position: relative;
}
.text-reflect:before, .text-reflect:after {
    display: block;
    position: absolute;
    bottom: -.8em; /* You should change this value to fit your font */
    left: 0;
    right: 0;
}
.text-reflect:before {
    content: attr(data-text);
    opacity: .3;

    /* This is how the text is flipped vertically */
    -webkit-transform: scaleY(-1);
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    transform: scateY(-1);
}
.text-reflect:after {
    /* Fading using CSS gradient */
    /* Don't forget to change the colors to your background color */
    background: -webkit-gradient(linear, left top, left center, from(rgba(255,255,255,0)), to(rgb(255,255,255)));
    background: -moz-linear-gradient(top, rgba(255,255,255,0), rgb(255,255,255));
    background: linear-gradient(top, rgba(255,255,255,0), rgb(255,255,255));

    /* I left out the `filter` property, because IE doesn't know `:before` and `:after` pseudo-elements anyway */
    content: ' ';
    height: 1em;
}
	
.idxul{margin:10px 25px;}
.idxul li{margin-bottom:10px; list-style:url(../images/icon-li.png); padding-top:-10px; margin-left:25px; text-align:justify;}