/* Общее */
body, html {
    font-family : Rubik, sans-serif;
    font-size   : 14px;
    color       : #0c0c0c;
    min-width   : 320px;
    margin      : 0 auto;
}

body.backend {
    background : #e5e5e5;
}

h1 {
    font-size     : 20px;
    font-weight   : bold;
    margin-bottom : 14px;
}

h2 {
    font-size   : 16px;
    font-weight : bold;
    margin      : 10px 0 5px;
}

a {
    color           : #844ce6;
    text-decoration : none;
}

a:active, a:focus {
    text-decoration : none;
}

a:hover {
    text-decoration : underline;
}

/* Отступы */

.gap--10 {height : 10px;} /* div.gap--10 */
.gap--12 {height : 12px;}
.gap--13 {height : 13px;}
.gap--14 {height : 14px;}
.gap--15 {height : 15px;}
.gap--17 {height : 17px;}
.gap--20 {height : 20px;}
.gap--25 {height : 25px;}
.gap--30 {height : 30px;}
.gap--35 {height : 35px;}
.gap--40 {height : 40px;}
.gap--50 {height : 50px;}
.gap--60 {height : 60px;}

.pit--5  {display : inline-block; width: 5px;}  /* span.pit--5 */
.pit--10 {display : inline-block; width: 10px;}
.pit--12 {display : inline-block; width: 12px;}
.pit--20 {display : inline-block; width: 20px;}
.pit--27 {display : inline-block; width: 27px;}


/* Wrapper */

.b-wrapper {
    position   : relative;
    display    : flex;
    min-height : 100vh;
}

.b-content {
    flex    : 1;
    padding : 40px;
}

/* Меню */

.b-left-column {
    flex        : 0 0 280px;
    text-align  : center;
    box-shadow  : 5px -3px 5px rgba(0, 0, 0, 0.05);
    padding-top : 40px;
}

.b-left-menu li.active a {
    color : #844ce6;
}

.b-left-menu a {
    font-size   : 14px;
    font-weight : 300;
    color       : #7b7b7b;
    padding     : 10px 0;
    display     : block;
}

/* Авторизация */

.b-reg-header {
    display         : flex;
    justify-content : space-between;
    font-size       : 22px;
    font-weight     : 500;
    margin          : 10px 0 25px;
}

.b-reg-header__h1, .b-reg-header__link {
    width : 250px;
}

/*.b-big-form__fields {*/
/*margin: 0 10px;*/
/*}*/
.b-reg .form-group.has-error {
    border : 2px solid #ff8370;
}

.b-reg .form-group {
    display       : flex;
    flex-wrap     : wrap;
    align-items   : center;
    font-family   : "museo-sans", sans-serif;
    font-size     : 18px;
    border-radius : 4px;
    background    : white;
    margin        : 0;
    min-height    : 80px;
    position      : relative;
    width         : 100%;
}

.b-reg .control-label {
    align-self   : stretch;
    display      : flex;
    align-items  : center;
    color        : #b9b9b9;
    padding-left : 25px;
    width        : 172px;
    cursor       : text;
}

.b-big-form-field__input {
    background   : #fafafa;
    flex         : 1;
    border       : none;
    font-family  : Rubik, sans-serif;
    font-size    : 18px;
    margin       : 0 30px 0 0;
    height       : 80px;
    padding-left : 20px;
}

.b-reg .help-block {
    margin    : 0 17px;
    font-size : 14px;
}

.b-reg .help-block.has-error {
    color : #ea4d43;
}

.b-reg .has-error .control-label {
    color : #b9b9b9;
}

.b-big-form__buttons {
    display    : flex;
    flex-wrap  : wrap;
    margin-top : 20px;
}

.b-big-form-button {
    display       : inline-block;
    flex          : 1;
    border        : 2px solid #844ce6;
    border-radius : 4px;
    padding       : 0 20px;
    min-width     : 170px;
    min-height    : 80px;
    line-height   : 80px;
    font-family   : "museo-sans", sans-serif;
    font-size     : 20px;
    text-align    : center;
    margin        : 10px 0;
    cursor        : pointer;
}

.b-big-form-button--theme_blue {
    background : #844ce6;
    color      : white;
}

.b-big-form-field {
    display       : flex;
    flex-wrap     : wrap;
    align-items   : center;
    font-family   : "museo-sans", sans-serif;
    font-size     : 18px;
    border-radius : 4px;
    background    : white;
    margin        : 20px 0 0;
    min-height    : 80px;
    position      : relative;
}

.b-form-label {
    align-self   : stretch;
    display      : flex;
    align-items  : center;
    color        : #b9b9b9;
    padding-left : 25px;
    width        : 172px;
    cursor       : text;
}

.b-form-input {
    flex         : 1;
    border       : none;
    font-family  : Rubik, sans-serif;
    font-size    : 18px;
    margin       : 0 30px 0 0;
    height       : 80px;
    padding-left : 20px;
    background   : #fafafa;
}

.b-form-textarea {
    height      : 105px;
    padding     : 20px;
    flex        : 1;
    border      : none;
    font-family : Rubik, sans-serif;
    font-size   : 18px;
    margin      : 0 30px 0 0;
    background  : #fafafa;
}

/* Админка */
.b-admin-block {
    /*margin        : 30px 20px;*/
    padding       : 40px;
    border-radius : 40px;
    background    : white;
}

.b-search-form__searching-text {
    font-size : 18px;
    padding   : 5px;
    width     : 400px;
}

.b-admin-button {
    text-align  : center;
    background  : #844ce6;
    border      : 2px solid #844ce6;
    color       : white;
    display     : inline-block;
    height      : 39px;
    line-height : 38px;
    padding     : 0 20px;
}

.b-admin-button:hover {
    background      : #9154fb;
    border          : 2px solid #9154fb;
    text-decoration : none;
    color           : white;
}

.b-admin-button--tiny {
    height      : auto;
    padding     : 5px 10px;
    font-size   : 12px;
    line-height : 1;
    background  : #aaa;
}

.b-admin-button--red {
    background : #f00;
    border     : 2px solid #f00;
}

.b-admin-blocked {
    padding       : 10px 0;
    margin        : 10px 0;
    border-top    : 2px solid #f00;
    border-bottom : 2px solid #f00;
}

.b-admin-blocked__title {
    color       : #f00;
    font-weight : bold;
}

/*** SERIOUS BUTTON ***/

.b-serious-button {
    display     : block;
    margin      : 5px 0;
    padding     : 5px 10px;
    background  : red;
    color       : white;
    font-weight : bold;
    white-space : nowrap;
    text-align  : left;
}

.b-serious-button--big {
    margin : 10px 20px 10px 0;
    padding : 10px 20px;
}

.b-serious-button--not-so-serious {
    background  : brown;
    font-weight : normal;
}

.b-serious-button--light {
    background  : grey;
    font-weight : normal;
}

.b-serious-button:hover,
.b-serious-button:focus {
    text-decoration : none;
    color: white;
    background : #1e87f0;
}


/*** TABLE ***/

table {
    width           : 100%;
    border-collapse : collapse;
    border          : 1px solid #88888830;
}

table thead {
    border-bottom : 1px solid #88888830;
    background    : #88888860;
    color         : white;
    font-weight   : bold;
    font-size     : 16px;
}

table th, table td {
    text-align : left;
    padding    : 5px 8px;
}

table td {
    word-break : break-all;
    overflow   : hidden;
}

table td:nth-child(1) {
    white-space : nowrap;
}

table tr:nth-child(2n) {
    background : #88888830;
}


/* EXTERNAL */

/* USER INFO */
.b-user-info__title {
    color           : #000;
    font-weight     : bold;
    padding         : 20px;
    display         : flex;
    justify-content : space-between;
    align-items     : center;
}

.icon-arrow {
    cursor    : pointer;
    color     : #888;
    font-size : 16px;
    display   : block;
}

.icon-arrow.opened {
    transform : rotate(90deg);
}

.b-user-info__sites {
    /*display: none;*/
    padding : 0 20px 20px;
}

.b-user-info__site-link a {
    color           : #2e72f6;
    text-decoration : underline;
}

.b-user-info__site-link a:hover {
    text-decoration : none;
}

.b-user-info__site-name {
    display         : flex;
    justify-content : space-between;
    margin-bottom   : 5px;
}

.b-user-info__site-url, .b-user-info__site-url a, .b-user-info__more, .b-user-info__site-link span {
    color : #b5b5b5;
}

.b-user-info__id {
    padding-top : 10px;
}

.b-user-info__visitors {
    padding : 10px 0;
}

.b-user-info__orders {
    padding-bottom : 10px;
}

.b-user-info__site {
    margin-bottom : 20px;
}

.b-user-info__more {
    display : none;
}

.b-admin-element {
    padding : 20px 0;
}

.b-admin-element--first {
    padding-top : 0;
}

.b-admin-label {
    display : block;
    /*font-weight: ;*/
}

.b-admin-violet-button {
    background : #844ce6;
    color      : #fff;
    display    : inline-block;
    min-width  : 130px;
    min-height : 40px;
    padding    : 10px 15px;
    cursor     : pointer;
    font-size  : 14px;
    outline    : none;
    border     : none;
}

.b-admin-violet-button:hover,
.b-admin-violet-button:focus {
    background      : #9154fb;
    color           : #fff;
    text-decoration : none !important;
}

.b-admin-violet-button a {
    color : #fff;
}

.b-admin-violet-button a:hover {
    text-decoration : none;
}

.b-admin-violet-button.small {
    padding    : 5px 10px;
    min-height : 20px;
}

.b-log-container {
    display : none;
}

.b-red-button {
    padding     : 10px 20px;
    background  : red;
    color       : white;
    font-weight : bold;
    white-space : nowrap;
    border      : none;
    font-size   : 14px;
    cursor      : pointer;
    display     : inline-block;
}

.b-red-button.small {
    padding : 5px 10px;
}

.b-admin-textarea {
    min-width  : 400px;
    min-height : 100px;
}

.page-block-container,
.page-logs-block-container {
    display : none;
}

.b-site-info-head h1, .b-site-info-head h2 {
    line-height : 1.8;
}

.b-reverse-proxies {
    margin-bottom: 8px;
}

.b-reverse-proxies label {
    font-weight: normal;
}

@media only screen and (max-width : 760px),
(min-device-width : 768px) and (max-device-width : 1024px) {

    body, html {
        padding : 2px;
    }

    .b-content {
        padding : 5px;
    }

    .b-wrapper {
        flex-direction : column-reverse;
    }

    .b-admin-block {
        margin        : 5px;
        padding       : 10px;
        border-radius : 10px;
    }

    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr {
        display : block;
    }

    tr {
        border : 1px solid #ccc;
    }

    td {
        /* Behave  like a "row" */
        border        : none;
        border-bottom : 1px solid #eee;
        position      : relative;
        padding-left  : 50%;
    }

    td:before {
        /* Now like a table header */
        position      : absolute;
        /* Top/left values mimic padding */
        top           : 6px;
        left          : 6px;
        width         : 45%;
        padding-right : 10px;
        white-space   : nowrap;
    }

}

@media only screen and (max-width : 582px) {
    .b-admin-button {
        margin-top : 10px;
    }
}

@media only screen and (max-width : 450px) {
    .b-search-form__searching-text {
        width : 100%;
    }

    .b-admin-button {
        margin-top : 10px;
    }

    .b-admin-textarea {
        min-width : 0;
        width     : 100%;
    }
}

.b-subscribe-settings .b-subscribe-container {
    display: none;
}
.b-subscribe-settings i {
    transform: rotate(0deg);
    transition: transform 200ms;
}
.b-subscribe-settings.opened i {
    transform: rotate(90deg);
}
.b-subscribe-settings label {
    font-weight: normal;
}
.b-expand-subscribe-settings {
    font-weight: bold;
}
.b-subscribe-checkboxes {
    margin-top: 6px;
}
.b-subscribe-settings input[type="submit"] {
    margin-top: 8px;
}

.b-bordered_button {
    border        : 2px solid #844ce6;
    color         : #844ce6;
    padding       : 5px 10px;
    margin        : 20px 10px 20px 0;
    border-radius : 10px;
}

.b-bordered_button:hover {
    text-decoration : none;
}

.b-plugin-categories {
    background      : white;
    border-radius   : 5px;
    margin-bottom   : 20px;
    display         : flex;
    justify-content : space-between;
    align-items     : center;
}
.b-cursor-pointer {
    cursor : pointer;
}

.b-template-category_header {
    display         : flex;
    justify-content : space-between;
    align-items     : center
}
.b-template-category_filter_inactive {
    color: #000;
}
.b-international__alert{
    background: #f00;
    color: #fff;
    padding: 10px 50px;
    font-weight: bold;
    margin-bottom: 20px;
    border-radius: 10px;
}