/*******************************************************************************
 *                                                                             *
 *   Мост Безопасности // Адаптируемый стиль для экрана                        *
 *   ----------------------------------------------------------------------    *
 *   Copyright (C) 1998-2018 Studio "Cherry-Design"                            *
 *   URL: http://www.cherry-design.ru/                                         *
 *   E-mail: mike@cherry-design.ru                                             *
 *                                                                             *
 *******************************************************************************/

/* Максимальная ширина
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) and (max-width: 980px) {

    .header_inner, .main_menu_inner, .content_inner, .footer_inner, .copyright_inner {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media screen and (min-width: 981px) {

    .header_inner, .main_menu_inner, .content_inner, .footer_inner, .copyright_inner {
        width: 980px;
        padding-left: 0;
        padding-right: 0;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Заголовок сайта (логотип)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) {

    .header_title {
        width: 313px;
    }
    
    .header_title p {
        padding: 28px 0 28px 0;
    }

    .header_title p span,
    .header_title p a {
        width: 313px;
        height: 53px;
        background: transparent url("/pic/logo_big.png") left center no-repeat;
    }
}

/* Заголовок сайта (кнопки меню)
-------------------------------------------------------------------------------*/

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

    .header_user_menu {
        display: none;
    }

    .header_menu_buttons {
        width: calc(100% - 255px);
    }
    
    .header_menu_buttons ul li {
        margin-left: 12px;
    }
    
    .header_menu_buttons ul li:first-child {
        display: inline-block;
    }
}

@media screen and (min-width: 481px) {

    .header_user_menu {
        display: block;
    }

    .header_menu_buttons {
        display: none;
    }
}

/* Основное меню
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) {

    .main_menu_inner {
        display: block;
    }

    .main_menu_inner ul {
        padding: 0;
        margin: 0;
    }

    .main_menu_inner ul li {
        display: inline-block;
        margin-right: 20px;
    }

    .main_menu_inner ul li:last-child {
        margin-right: 0;
    }

    .main_menu_inner ul li a {
        padding: 6px 0;
    }
    
    .main_menu_inner ul li a:hover {
        background-color: transparent;
        color: #999999;
    }

    .main_menu_inner ul li.selected {
        background-color: transparent;
        color: #bf1617;
    }

    .main_menu_inner ul li.selected a {
        color: #bf1617;
    }
}

/* Меню пользователя
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) {

    .header_user_menu {
        width: calc(100% - 313px);
        border-top: none;
        text-align: right;
    }

    .header_user_menu ul {
        padding: 0;
        margin: 50px 0 0 10px;
        border-top: none;
    }

    .header_user_menu ul li {
        padding: 2px;
        margin: 0 0 0 10px;
        width: auto;
    }
    
    .header_user_menu ul li.authorized {
        min-width: none;
        border-radius: 6px;
        font-weight: 300;
        background: none;
        margin-left: 0;
    }

    .header_user_menu ul li.authorized a {
        display: inline;
        text-decoration: underline;
    }
}

@media screen and (min-width: 641px) {
    
    .header_user_menu ul li.authorized span {
        display: inline;
    }
    
    .header_user_menu ul li.loginout {
        min-width: 86px;
    }

    .header_user_menu ul li.signin {
        min-width: 124px;
    }
}

/* Меню второго уровня
-------------------------------------------------------------------------------*/

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

    .content_menu {
        width: 50%;
        margin: 30px 0 -30px 50%;
    }

    .content_menu ul li a {
        padding: 5px 9px;
    }
}

@media screen and (min-width: 769px) {
    
    .content_menu {
        margin: 98px 0 0 0;
    }
    
    .content_menu ul li a {
        padding: 5px 9px;
    }
    
    .content_menu ul li a:hover {
        background: #f0f0f0 url("/pic/arrow_menu.png") right center no-repeat;
    }

    .content_menu ul li.selected a {
        background: #bf1617 url("/pic/arrow_menu.png") right center no-repeat;
    }
}

/* Кнопка показа левой колонки
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) {

    .content_column_button {
        display: none;
    }
}

/* Колонка с основным содержимым
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) {

    .content_column {
        margin-top: 0px;
        display: block;
    }

    .content_text h1 {
        margin-top: 30px;
    }
}

@media screen and (min-width: 769px) {

    .content_column {
        width: 260px;
        padding-right: 20px;
    }

    .content_text {
        width: calc(100% - 260px);
        min-height: 450px;
    }
}

/* Основное содержимое (информация)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 550px) {

    .content_text dl.info dt {
    	width: 220px;
    }

    .content_text dl.info dd {
        margin: 2px 0 2px 230px;
    }
}

/* Основное содержимое (список категорий форума)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 480px) {

    .forum_categories {
        columns: 2;
    }
}

/* Таблица последних сообщений в форуме (выравнивание и ширины ячеек таблицы)
-------------------------------------------------------------------------------*/

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

    .forum_topics_table th:nth-of-type(1) { width: 100%; }

    .forum_topics_table th:nth-of-type(2) { display: none; }
    .forum_topics_table td:nth-of-type(2) { display: none; }

    .forum_topics_table th:nth-of-type(3) { display: none; }
    .forum_topics_table td:nth-of-type(3) { display: none; }

    .forum_topics_table th:nth-of-type(4) { display: none; }
    .forum_topics_table td:nth-of-type(4) { display: none; }

    .forum_topics_title_date {
        display: inline;
    }
    
    .forum_topics_title_views {
        display: inline;
    }
    
    .forum_topics_num_messages {
        display: inline;
    }
}

@media screen and (min-width: 361px) and (max-width: 640px), screen and (min-width: 760px) and (max-width: 800px) {

    .forum_topics_table th:nth-of-type(1) { width: 90%; }
    .forum_topics_table th:nth-of-type(2) { width: 10%; }

    .forum_topics_table th:nth-of-type(3) { display: none; }
    .forum_topics_table td:nth-of-type(3) { display: none; }

    .forum_topics_table th:nth-of-type(4) { display: none; }
    .forum_topics_table td:nth-of-type(4) { display: none; }

    .forum_topics_title_date {
        display: inline;
    }

    .forum_topics_num_messages {
        display: inline;
    }
}    

@media screen and (min-width: 641px) and (max-width: 761px), screen and (min-width: 801px) and (max-width: 980px) {

    .forum_topics_table th:nth-of-type(1) { width: calc(100% - 170px); }
    .forum_topics_table th:nth-of-type(4) { width: 170px; }

    .forum_topics_table th:nth-of-type(2) { display: none; }
    .forum_topics_table td:nth-of-type(2) { display: none; }

    .forum_topics_table th:nth-of-type(3) { display: none; }
    .forum_topics_table td:nth-of-type(3) { display: none; }

    .forum_topics_num_messages {
        display: inline;
    }

    .forum_topics_title_views {
        display: inline;
    }
}

/* Основное содержимое (формы)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 481px) and (max-width: 768px), screen and (min-width: 810px) {

    .general_form dl dt {
        position: absolute;
        padding: 14px 0 0 0;
        width: 220px;
        background-color: #ffffff;
    }

    .general_form dl dt label {
        position: absolute;
        margin: -12px 0 0 0;
        padding: 2px 4px 0 0;
        background-color: #ffffff;
        height: 1.5em;
        width: 100%;
        text-align: right;
    }

    .general_form dl dd {
        margin: 4px 0 14px 230px;
        padding: 0;
    }

    .general_form .middle {
        width: 50%;
        min-width: 200px;
    }

    .general_form .short {
        width: calc((50% - 10px) / 2);
        min-width: 95px;
    }

    .general_form_submit {
        margin-left: 230px;
    }    

    .general_form_submit input {
        width: 50%;
        min-width: 200px;
    }

    .general_form_submit_confirm {
        width: 50%;
    }
}

/* Основное содержимое (формы)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 980px) {

    .search_form input {
        width: calc(70% - 111px);
    }
}

/* Основное содержимое (баннеры)
-------------------------------------------------------------------------------*/

@media screen and (min-width: 760px) {

    .banner_728x90 {
        display: block;
    }
}

@media screen and (min-width: 769px) {

    .banner_240x400 {
        display: block;
    }
}

/* Блок ссылок внизу
-------------------------------------------------------------------------------*/

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

    .footer_inner section:nth-child(n) {
        width: 50%;
    }
}

@media screen and (min-width: 641px) and (max-width: 750px) {

    .footer_inner section:nth-child(n) {
        width: 33.33%;
    }

    .footer_inner section:nth-child(4) {
        display: none;
    }
}

@media screen and (min-width: 751px) {

    .footer_inner section:nth-child(n) {
        width: 25%;
    }
}

/* Копирайты
-------------------------------------------------------------------------------*/

@media screen and (min-width: 641px) {

    .copyright_inner ul {
        width: 60%;
        text-align: left;
    }

    .copyright_inner p {
        width: 40%;
        text-align: right;
    }
}