/*   1200px  */

@media screen and (max-width: 1200px),
only screen and (max-device-width:1200px) {
    
.layout {width:1170px}
    
}


/*   1024px  */

@media screen and (max-width: 1024px),
only screen and (max-device-width:1024px) {
    
.layout {width:940px!important}
.main ul li a, .mobile ul li a {padding: 0.7em 20px}

}



/*   854px  */

@media screen and (max-width: 854px),
only screen and (max-device-width:854px) {
    
.layout {width:800px!important}
.main > .layout > ul, .mobile ul, .mobile > .layout > ul {border-bottom:none}
.main ul li {display:none}
.mobile ul li {display:block; width:90%; float:none}
.mobile ul li a {color:#fff; text-decoration:none;font-weight:bold}
.mobile ul li a:hover {color:#fff; text-decoration:underline}
.mobile ul li:first-child a {padding: 0.7em 20px}
.mobile .submenu li a {font-weight:normal}
.mobile .submenu li {padding-left:20px}
.maincol_min, .sidebar {width:100%; float:none}
.soc_buttons {width:36%}
.contact_box {width:30%}
.mobile ul.submenu {display:block}
.mobile ul.submenu > li a {padding: 0.3em 10px}
}




/*   768px  */

@media screen and (max-width: 768px),
only screen and (max-device-width:768px) {
    
.layout {
width:95%!important;
}
}



/*   640px  */

@media screen and (max-width: 640px),
only screen and (max-device-width:640px) {

.logo, .contact_box, .soc_buttons {width:100%; float:none; text-align:center}
.header {flex-direction:column}
#cartbox {position:fixed; top:93%; bottom:0; width:100%; text-align: center; padding:0.5em 20px}
.soc_buttons li, .logo img {float:none; display:inline-block}
.slogan {display:block}
.Window > div, #ModalCustomPay > div {width:92%; margin: 1% auto; padding: 1em 1%;}
#page .bm_subs_form {width: auto}
.carttable {overflow:auto; display:block}
.catalog_desc {width:55%}
.price_box {width:16%}
.course_category_item {width:auto; float:none; margin:0 0 1em 0}
.course_cover, .course_desc {height:auto}
.course_data {position:static}
.lesson_desc {width:78%}
#footer {margin: 1em 0 3em 0}
.lesson_info, .span6.form textarea {width:99%}
}



/*   480px  */

@media screen and (max-width: 480px),
only screen and (max-device-width:480px) {
.product_price_box, .product_price_box2, .product_price_box3 {width:100%}
.product_price_box > div, .product_price_box2 > div, .product_price_box3 > div {width:100%; margin:1em 0; float:none}
.catalog_item img, .catalog_desc, .price_box, #blog .blog_img, #blog .intro {width:100%}
#feedback textarea {width:95%}
#toTop {display:none!important}
.span6 {width:100%; float:none}
    
}



/*   375px  */

@media screen and (max-width: 375px),
only screen and (max-device-width:375px) {
    
    
    
    
}