@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700,300);
body{font-family: 'Open Sans', sans-serif; background:url(../images/bg.jpg) 0 0 no-repeat; background-attachment:fixed; background-size:cover;}
body .container{ max-width:885px; margin:0 auto}
a:focus {
    outline: none;
    outline-offset: -2px;
}
.header{ margin-top:10px;}
.product_area img:hover{ opacity:.8;}
.top_drss{
	background-color: rgba(255,255,255,.3); /* layer fill content */
	border-radius:6px;
	margin-top:30px;
	}
.col-md-3{ padding-left:7px; padding-right:7px;}
.top_drss {
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 6px;
    margin-top: 30px;
    padding: 15px 7px;
}
.product_area {
    margin: 0 auto 10px;
    max-width: 195px;
	width: 244px !important;
    height: 365px !important;
    position: relative;
	
    list-style: none;
    float: left;
    min-height: 250px;
    overflow: hidden;
    padding: 0 1px 1px 0;
    border: none!important;
    background-position: 50% 50%;
    background-repeat:   no-repeat;
    background-size:     cover;
}
.price_pro {
    background: rgba(0, 0, 0, 0) url("../images/price_bg.png") no-repeat scroll 0 50%;
    bottom: 0;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 5px 10px 5px 27px;
    position: absolute;
    right: 0;
}
.top_drss h1{ color:#fff; font-size:40px; margin:0 0 15px; text-shadow:0 1px 1px #666;}
.top_drss h1 span{ font-size:30px; padding:1px 10px; background:#2ecc71;}
.goto_site{ max-width:264px; margin:30px auto;}
.goto_site a {
    background: rgba(0, 0, 0, 0) url("../images/btn_bg.png") no-repeat scroll 0 0;
    color: #fff;
    display: block;
    font-size: 25px;
    font-weight: bold;
    height: 72px;
    padding: 11px 30px 14px 17px;
    text-decoration: none;
    text-transform: uppercase;
    width: 264px;
}
.goto_site a:hover { background: rgba(0, 0, 0, 0) url("../images/btn_bg.png") no-repeat scroll 0 -84px; transition:all ease .3s}

@media screen and (min-width : 768px) and (max-width : 1024px) {

}
@media screen and (min-width : 360px) and (max-width : 640px) {

}
@media screen and (min-width : 320px) and (max-width : 340px) {

}