﻿/* =============================================================================
    16. RESPONSIVE - MEDIA QUERIES
============================================================================= */
@media only screen and (min-width: 876px) and (max-width: 1400px) {
    #context_boxes_pan {
        width: 100%;
    }
}

@media only screen and (min-width: 200px) and (max-width: 1000px) {
    #slider_pan {
        width: 100%;
    }

    #header_pan .header_logo {
        width: 100%;
        margin: 0 auto;
        text-align: center;
    }

        #header_pan .header_logo img {
            height: auto;
            width: 50%;
        }

    #card_pan_f .label_caption {
        font-family: Samim;
        font-size: 10pt;
    }

    #card_pan_f .label_field {
        font-family: Samim;
        font-size: 11pt;
    }
}

@media only screen and (min-width: 200px) and (max-width: 875px) {
    section {
        margin-top: 0;
    }

    #context_boxes_pan {
        width: 100%;
    }

        #context_boxes_pan .context_box {
            float: none;
            width: 90%;
            margin: 20px auto;
            background-color: #f3f7f7;
            background-size: 100%;
            border: 2px solid #CFD7D7;
            height: auto;
            min-height: 100px;
            display: inline-block;
        }

        #context_boxes_pan .context_box_flex {
            float: none;
            width: 90%;
            margin: 20px auto;
            background-color: #f3f7f7;
            background-size: 100%;
            border: 2px solid #CFD7D7;
            height: auto;
            display: inline-block;
        }

        #context_boxes_pan .context_box_big {
            float: none;
            width: 90%;
            margin: 20px auto;
            background-color: #f3f7f7;
            background-size: 100%;
            border: 2px solid #CFD7D7;
            height: auto;
        }

            #context_boxes_pan .context_box_big .inner_box_pic {
                float: none;
                width: 100%;
            }

            #context_boxes_pan .context_box_big .inner_box_text {
                float: none;
                width: 96%;
                text-align: right;
                margin: 5px;
            }

                #context_boxes_pan .context_box_big .inner_box_text .column_paraph {
                    margin-left: 0px;
                    width: 49%;
                }

    #topmenu_pan {
        display: none;
        width: auto;
    }

    #pn_main_keys {
        margin-top: 0;
    }

    #mobile_menu {
        display: block;
        margin-right: 10px;
        margin-top: -8px;
    }

    #pn_body {
        width: 100% !important;
        float: left;
    }

    header {
        position: relative;
    }

    #header_pan .menu_pan {
        width: 100%;
        margin-right: 0;
        margin-top: 0;
        float: right;
    }

    #header_pan .page_header {
        background-position: center;
        background-size: 120%;
        width: 100% !important;
        background-repeat: no-repeat;
    }

    #header_pan .page_slides {
        width: 100% !important;
        margin: 10px auto;
        height: auto;
    }

        #header_pan .page_slides .slide_pan {
            display: none;
            width: 100%;
            margin: 10px auto;
            float: left;
            height: auto;
        }

        #header_pan .page_slides .mainlogo_pan {
            width: 100%;
            float: right;
            margin-right: 0;
            text-align: center;
        }

    #header_pan .page_controls {
        width: 100%;
        margin: 0;
        float: right;
        background-color: #dfd5bf;
    }

    #header_pan .calendar_pan {
        width: 200px;
        height: 30px;
        margin-right: 15px;
        margin-top: 110px;
        float: right;
    }

    #main_body {
        margin-top: 10px;
    }

        #main_body .pn_ContentHolder {
            width: 100%;
        }

    #binder_pan {
        background-color: #0066b3;
        height: 10px;
        position: inherit;
        float: left;
    }

        #binder_pan .fix_img {
            display: none;
        }

    #inner_content {
        margin: 5px auto 10px auto;
    }

    #pn_langs {
        float: right;
        margin-right: 5px;
        margin-top: 5px;
    }

    #pn_calendar {
        width: 135px;
        margin-top: 9px;
        margin-left: 0;
    }

    img {
        max-width: 100%;
        height: auto;
    }

    #footer_pan {
        height: auto;
    }

        #footer_pan .footer_box {
            width: 100%;
            height: auto;
            float: left;
        }

        #footer_pan .logos img {
            margin-top: 20px;
            width: 80px;
        }

    #panelmenu_pan {
        font-size: 9pt;
        margin-top: 5px;
    }

        #panelmenu_pan .key_pan {
            width: auto;
        }

    #object_info_pan .field_pan .field_text {
        width: 100%;
    }

    #object_info_pan .field_pan .field_text_ltr {
        width: 100%;
    }

    .textbox {
        width: 92%;
    }

    #news_control {
        width: 98% !important;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    .address_map {
        width: 300px;
        height: 180px;
        text-align: right;
        float: right;
        background-color: #3d3d3d;
    }

        .address_map .inner_title {
            color: #ffffff;
            font-family: yekan;
            font-size: 10pt;
            margin-right: 20px;
            margin-top: -3px;
            height: 23px;
            width: 260px;
        }

        .address_map .inner_box {
            color: black;
            font-family: yekan;
            font-size: 10pt;
            margin-right: 20px;
            margin-top: 0;
            width: 260px;
            height: 140px;
            background-color: #ffffff;
        }

    #pn_objects .tb_objects .img_cell {
        width: 150px;
        text-align: center;
    }

        #pn_objects .tb_objects .img_cell img {
            width: 120px;
            border: none;
        }

    #body_pan1 {
        width: 100%;
        float: right;
        margin: 0;
    }

    #body_pan2 {
        width: 100%;
        float: right;
        margin: 0;
    }

        #body_pan2 .inner_pan {
            width: 100%;
            margin: 0;
        }

    #body_pan3 {
        width: 100%;
        float: right;
        margin: 0;
    }

    #davaran_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #calling_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #pdf_reports_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

        #pdf_reports_pan img {
            width: 30px;
            margin-right: 6px;
        }

    #shorahonary_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #picture_report_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #museum_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #pdf_infos_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

        #pdf_infos_pan img {
            width: 38px;
            margin-right: 10px;
            margin-top: 5px;
        }

    #building_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #publicbuilding_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #religiousbuilding_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
    }

    #workshop_reg_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
        display: none;
    }

    #reminder_pan {
        width: 98%;
        height: auto;
        float: right;
        margin: 10px auto auto auto;
        display: inline;
    }

    .person_info_box {
        width: 90%;
        height: auto;
        float: right;
        margin: 10px;
        text-align: center;
    }

    #video_pan .video_object {
        width: 94%;
    }

        #video_pan .video_object video {
            width: 100%;
        }

    #pn_controls {
        border-color: black;
        border-style: none none solid none;
        border-width: 2px;
        width: 100%;
        background-color: #ffffff;
        margin: 0px auto auto auto;
    }

    #pn_topmenu {
        display: none;
        width: auto;
        height: auto;
    }

    #hitcounter_tb_rtl {
        float: right;
        margin-right: 0;
        font-size: 8pt;
    }

    #news_pan {
        margin: 0;
    }

    #articles_pan {
        width: 100%;
        margin: 0;
    }

    .gallery_pic_pan {
        width: 90%;
    }

    #pay_pan {
        width: 100%;
    }

    .gridview .mobile_view {
        display: none;
    }

}

@media only screen and (min-width: 200px) and (max-width: 450px) {
    #header_pan .reg_pan {
        width: 110px;
        margin-left: 0px;
        margin-top: 8px;
        float: left;
    }

    .td_caption_rtl {
        width: 120px;
        font-size: 10pt;
    }

    #header_pan .header_logo img {
        height: auto;
        width: 70%;
    }

    #header_pan .user_info_pan {
        width: 96%;
        margin: 0 5px;
    }

        #header_pan .user_info_pan .caption_pan {
            display: none;
        }

        #header_pan .user_info_pan .field_pan {
            margin-right: 15px;
        }
}

@media only screen and (min-width: 200px) and (max-width: 550px) {
    #footer_pan .info_pan {
        width: 90%;
        height: auto;
        float: right;
        margin-right: 10px;
        margin-top: 20px;
    }

    #footer_pan .counter_pan {
        width: 90%;
        height: auto;
        margin-right: 10px;
        margin-top: 10px;
        float: right;
        text-align: right;
    }

        #footer_pan .counter_pan .calendar_pan {
            margin: 0;
            width: 100%;
            height: 30px;
            text-align: right;
        }

            #footer_pan .counter_pan .calendar_pan .MyCalendar {
                text-transform: none;
            }

        #footer_pan .counter_pan .hit_pan {
            margin: 10px auto auto auto;
            width: 100%;
            height: auto;
            text-align: right;
        }

        #footer_pan .counter_pan .zarinpal_pan {
            display: none;
        }

    #footer_pan .logos img {
        margin-top: 15px;
        margin-left: 20px;
        float: left;
    }

    #hitcounter_tb_rtl {
        margin-right: 0;
    }

    #pn_apps {
        width: 90px;
        height: 45px;
        float: left;
        margin-top: 5px;
        margin-left: 10px;
    }

    #header_pan .navigation_pan {
        text-align: right;
        margin: 0 5px;
        float: left;
        width: 90%;
    }

    #pn_objects .img_object_cell {
        max-width: 90%;
        max-height: 300px;
    }
}
