/* 
    Document   : responsive
    Created on : 2013-07-31, 09:54:00
    Author     : Maciek
    Description:
        Purpose of the stylesheet follows.
*/

@media (max-width: 999px) {
    
    #layout #accessibility,
    #bottom,
    #bottom_boxes,
    #top_wrapper,
    #middle_wrapper{
        width: 100%;
    }

    #bottom_wrapper{
        background: #727b91;
    }
    
    .content_item_table .top{
        background: none;
        border-width: 2px 1px 0px 2px;
        border-style: solid;
        border-radius: 5px 5px 0 0;
        border-color: #b9b9b9;
        filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#FFFFFFFF, endColorStr=#f1f1f1, GradientType=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF, endColorstr=#f1f1f1, GradientType=0)";
        background:-webkit-gradient(linear, left bottom, left top, from(#f1f1f1), to(#fff), color-stop(0.7, #fff));
        background:-moz-linear-gradient(bottom, #f1f1f1, #fff 70%);
        background:-o-linear-gradient(bottom, #f1f1f1, #fff 70%);
        background:linear-gradient(bottom, #f1f1f1, #fff 70%);
        background-color:#d8d8d8;
    }
    
    .content_item_table .top h2{
        padding: 17px 19px 17px 19px;
    }
    
    .gallery .thumb {
        float: none;
    }
    
    #product_badge{
        margin-left: 39%;
    }
    #product_photo{
        width: 50%;
    }
}

@media (max-width: 960px) {

    #layout #top #logo{
        float: none;
        text-align: center;
        padding-top: 30px;
        margin-left: 0;
    }
    
    #layout #top #logo a{
        margin: 0 auto;
    }
    
    #layout #top #right_side {
        float: none;
        clear: both;
    }
    #layout #top #top_links{
        float: none;
        display: inline-block;
    }
    #layout #top #infoline{
        text-align: center;
    }
    #layout #top #infoline .info_text{
        line-height: 36px;
    }
    #layout #top #infoline .info_small_text{
        margin-top: 5px;
    }
    #layout #top #infoline .info_phone{
        float: none;
    }
    #layout #top #infoline .info_phone .phone_small{
        padding-top: 10px;
    }
    .content_item_table{
        width: 47%;
        margin-left: 2%;
    }
    .content_item_table.first{
        margin-left: 2%;
    }
    
    #product_tabs .t_header{
        width: 23%;
    }
}

@media (max-width: 719px) {
    
    .column_1{
        width:96%;
    }
    .column_2{
        width:96%;
    }
    #layout_wrapper.home .column_2{
        width: 96%;
        margin: 0 2% 20px;
    }
    .column_1 .box{
        max-width: 300px;
        width: 100%;
        margin: 0 auto;
        margin-bottom: 10px;
    }
    .product_badge{
        /*position: static;
        height: auto;
        float: none;*/
    }

    #product_badge{
        margin-left: 74%;
    }
    #product_photo{
        width: 100%;
        float: none;
    }
    #product_photo .shadow{
        margin-left: auto;
        margin-right: auto;
    }
    #product_desc{
        float: none;
    }
    #product_tabs{
        margin-top: 20px;
    }
}

@media (max-width: 620px) {
    
    .form{
        width: 100%;
    }
    
    .bottom_form{
        float: none !important;
        width: 72% !important;
        margin: 0 auto !important;
    }
    
    #bottom .bottom_form .form_wrapper .label_wrapper{
        width: 40% !important;
    }
    
    #bottom .bottom_form .form_wrapper .field_wrapper{
        width: 45% !important;
    }
    
    #bottom .bottom_form form input[type="text"], form input[type="password"], .page_input_width{
        width: 100% !important;
    }
    
    #bottom .bottom_form form textarea{
        width: 99% !important;
    }
    
    #bottom .bottom_form .form_element .button{
        margin-right: 9% !important;
    }
    
    .movie_wrapper,
    .movie_wrapper div,
    .gmap{
        width: 100% !important;
    }
    
    #layout #top #right_side{
        margin-right: 2%;
        margin-left: 2%;
    }
}

@media (max-width: 540px) {
    
    #contact_info{
        max-width: 320px !important;
        width: 100% !important;
        background: url("../images/ew_map.jpg") no-repeat scroll center/contain !important;
        margin-bottom: 20px !important;
    }
    #contact_info div{
        margin-top: 0 !important;
        position: absolute !important;
    }
    #contact_info div#contact_1 {
        margin-left: 20px !important;
        margin-top: 370px !important;
        color: #698400 !important;
    }
    #contact_info div#contact_2 {
        margin-left: 0 !important;
        margin-right: 20px !important;
        right: 0 !important;
        color: #585858 !important;
    }
    
    .content_item_table{
        float: none;
        width: 300px;
        margin: 0 auto;
    }
    .content_item_table.first{
        margin-left: auto;
    }
}

@media (max-width: 480px) {
    
    #bottom_boxes .box.box_first,
    #bottom_boxes .box{
        float: none;
        width: 320px;
        margin: 5px auto;
    }
    
    #bottom .bottom_form .form_header h3{
        font-size: 14px;
    }
    
    #product_tabs .t_header{
        width: 23%;
    }
    
    #product_tabs .t_header {
        padding-left: 3px;
        padding-right: 3px;
        width: auto;
        max-width: 85px;
    }
}

@media (max-width: 380px) {
    
    #layout #accessibility{
        padding: 20px 0 10px;
    }
    #accessibility .facebook{
        top: 10px;
        left: 39%;
    }
    #layout #accessibility #font_size{
        display: inline-block;
    }
    #layout #accessibility #contrast{
        margin-right: 6%;
    }
}

@media (max-width: 320px) {
    
    #bottom_boxes .box.box_first,
    #bottom_boxes .box{
        width: 100%;
    }
    
    #bottom .bottom_form .form_header h3{
        font-size: 12px;
    }
    
}