@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css');
@import url('https://fonts.googleapis.com/css?family=Roboto&subset=cyrillic-ext');

@import url('weather-icons.css');
@import url('reformator.css');
@import url('cropper.css');

@import url('jssocials.css');
@import url('jssocials-theme-flat.css');

*
{
    line-height: inherit;
    font-family: inherit;
    vertical-align: top;
    font-size: 100%;
    padding: 0;
    outline: 0;
    margin:  0;
    border:  0;
}

html
{
    font-family: 'Roboto', sans-serif;
    color: rgba(0, 0, 0, .9);
    line-height: 20px;
    font-size:   15px;
    cursor: default;
}

.W-20p  { width: 20%; }
.W-25p  { width: 25%; }
.W-50p  { width: 50%; }
.W-100p { width: 100%; }
.W-L    { width: 800px; }
.W-R    { width: 380px; }

.H-100p { height: 100%; }

html._window
{
    overflow: hidden;
}
html._window #W
{
    overflow-y: auto;
}

.hidden,
[hidden]
{
    display: none !important;
}

a
{
    text-decoration: underline;
    transition: all .3s;
    color: #000000;
}
a:hover
{
    text-decoration: underline;
    color: #FF0000;
}

.b  { display: block        }
.ib { display: inline-block }

a.b,
a.ib
{
    text-decoration: none;
}

[data-area-image]
{
    background: no-repeat center;
    background-size: cover;
}

.ellipsis
{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.relative
{
    position: relative;
}
.absolute
{
    position: absolute;
    margin: auto;
    bottom: 0;
    right:  0;
    left:   0;
    top:    0;
}
.absolute.top    { bottom: auto; }
.absolute.bottom { top:    auto; }
.absolute.right  { left:   auto; }
.absolute.left   { right:  auto; }

/* Тени */
.b-shadow-15x8  { box-shadow: 0 0 15px rgba(0, 0, 0, .8); }
.b-shadow-15x5  { box-shadow: 0 0 15px rgba(0, 0, 0, .5); }
.b-shadow-15x2  { box-shadow: 0 0 15px rgba(0, 0, 0, .2); }
.b-shadow-10x5  { box-shadow: 0 0 10px rgba(0, 0, 0, .5); }
.b-shadow-5x2   { box-shadow: 0 0  5px rgba(0, 0, 0, .2); }

.t-shadow-1x3x2   { text-shadow: 1px 1px 3px rgba(0, 0, 0, .2); }

.float-l { float: left; }
.float-r { float: right; }

.b-radius   { border-radius: 100%; }
.b-radius-3 { border-radius: 3px; }
.overflow-h { overflow: hidden; }

.TT-U
{
    text-transform: uppercase;
}
.FW-N
{
    font-weight: normal;
}

.S-20x20   { height: 20px;  width: 20px; }
.S-25x25   { height: 25px;  width: 25px; }
.S-30x30   { height: 30px;  width: 30px; }
.S-35x35   { height: 35px;  width: 35px; }
.S-40x40   { height: 40px;  width: 40px; }
.S-45x45   { height: 45px;  width: 45px; }
.S-50x50   { height: 50px;  width: 50px; }
.S-55x55   { height: 55px;  width: 55px; }
.S-60x60   { height: 60px;  width: 60px; }
.S-70x70   { height: 70px;  width: 70px; }
.S-80x80   { height: 80px;  width: 80px; }
.S-90x90   { height: 90px;  width: 90px; }
.S-100x100 { height: 100px; width: 100px; }
.S-165x165 { height: 165px; width: 165px; }
.S-175x175 { height: 175px; width: 175px; }

.S-90x60   { height: 60px;  width:  90px; }
.S-105x70  { height: 70px;  width: 105px; }
.S-120x80  { height: 80px;  width: 120px; }
.S-360x240 { height: 240px; width: 360px; }
.S-250x165 { height: 165px; width: 250px; }

.M-R-30 { margin-right:  30px; !important; }
.M-L-30 { margin-left:   30px; !important; }
.M-R-15 { margin-right:  15px; !important; }
.M-L-15 { margin-left:   15px; !important; }
.M-T-15 { margin-top:    15px; !important; }
.M-B-15 { margin-bottom: 15px; !important; }
.M-R-10 { margin-right:  10px; !important; }
.M-L-10 { margin-left:   10px; !important; }
.M-T-10 { margin-top:    10px; !important; }
.M-B-10 { margin-bottom: 10px; !important; }
.M-R-5  { margin-right:  5px;  !important; }
.M-L-5  { margin-left:   5px;  !important; }
.M-T-5  { margin-top:    5px;  !important; }
.M-B-5  { margin-bottom: 5px;  !important; }
.M-R-1  { margin-right:  1px;  !important; }
.M-L-1  { margin-left:   1px;  !important; }
.M-T-1  { margin-top:    1px;  !important; }
.M-B-1  { margin-bottom: 1px;  !important; }

/* Выравнивание */
.h-l { text-align     : left   !important; }
.h-c { text-align     : center !important; }
.h-r { text-align     : right  !important; }
.v-t { vertical-align : top    !important; }
.v-m { vertical-align : middle !important; }
.v-b { vertical-align : bottom !important; }

.H-1  { height: 1px; }
.H-5  { height: 5px; }
.H-10 { height: 10px; }
.H-15 { height: 15px; }
.H-20 { height: 20px; }
.H-25 { height: 25px; }
.H-30 { height: 30px; }
.H-35 { height: 35px; }
.H-40 { height: 40px; }
.H-45 { height: 45px; }
.H-50 { height: 50px; }
.H-60 { height: 60px; }
.H-65 { height: 65px; }
.H-70 { height: 70px; }
.H-80 { height: 80px; }
.H-90 { height: 90px; }
.H-100 { height: 100px; }
.H-120 { height: 120px; }
.H-150 { height: 150px; }
.H-170 { height: 170px; }
.H-165 { height: 165px; }
.H-260 { height: 260px; }

.W-0   { width: 0; }
.W-1   { width: 1px; }
.W-5   { width: 5px; }
.W-10  { width: 10px; }
.W-15  { width: 15px; }
.W-20  { width: 20px; }
.W-25  { width: 25px; }
.W-30  { width: 30px; }
.W-35  { width: 35px; }
.W-40  { width: 40px; }
.W-50  { width: 50px; }
.W-60  { width: 60px; }
.W-70  { width: 70px; }
.W-80  { width: 80px; }
.W-100 { width: 100px; }
.W-115 { width: 115px; }
.W-120 { width: 120px; }
.W-150 { width: 150px; }
.W-160 { width: 160px; }
.W-180 { width: 180px; }
.W-185 { width: 185px; }
.W-210 { width: 210px; }
.W-220 { width: 220px; }
.W-330 { width: 330px; }
.W-360 { width: 360px; }
.W-380 { width: 380px; }
.W-400 { width: 400px; }
.W-800 { width: 800px; }
.W-1200 { width: 1200px; }

.P-5    { padding: 05px 05px 05px 05px; }
.P-5-0  { padding: 05px 00px 05px 00px; }
.P-10   { padding: 10px 10px 10px 10px; }
.P-10-5 { padding: 10px  5px 10px  5px; }
.P-15   { padding: 15px 15px 15px 15px; }
.P-15-5 { padding: 15px  5px 15px  5px; }
.P-20   { padding: 20px 20px 20px 20px; }
.P-5-10 { padding: 5px  10px 5px  10px; }
.P-5-15 { padding: 5px  15px 5px  15px; }
.P-10-0 { padding: 10px 0 10px 0; }
.P-0-5  { padding: 0  5px 0  5px; }
.P-0-10 { padding: 0 10px 0 10px; }

.M-5  { margin: -05px -05px -05px -05px; }
.M-10 { margin: -10px -10px -10px -10px; }
.M-15 { margin: -15px -15px -15px -15px; }
.M-20 { margin: -20px -20px -20px -20px; }

.table-1,
.table-5,
.table-10,
.table-15,
.table-20,
.table-list
{
    border-collapse: separate;
    table-layout: fixed;
    width: 100%;
}
.table-1  { border-spacing: 1px;  }
.table-5  { border-spacing: 5px;  }
.table-10 { border-spacing: 10px; }
.table-15 { border-spacing: 15px; }
.table-20 { border-spacing: 20px; }

.table-list
{
    background-color: #cccccc;
    border-spacing: 1px;
}
.table-list th
{
    background-color: #ebebeb;
    padding: 5px 5px 5px 5px;
    line-height: 14px;
    font-size: 12px;
}
.table-list td
{
    background-color: #ffffff;
    padding: 3px 5px 3px 5px;
    line-height: 14px;
    font-size: 12px;
}
.table-list td.link
{
    padding: 0;
}
.table-list td.link a
{
    background-color: rgb(250, 240, 250);
    padding: 3px 5px 3px 5px;
    text-decoration: none;
    text-align: center;
    display: block;
}
.table-list td.link a:hover
{
    background-color: rgb(240, 250, 240);
    text-decoration: none;
}

.FS-0 { font-size: 0; }
.FS-1 { line-height: 13px; font-size: 11px; }
.FS-2 { line-height: 15px; font-size: 13px; }
.FS-T { line-height: 17px; font-size: 15px; }
.FS-3 { line-height: 25px; font-size: 18px; }
.FS-4 { line-height: 25px; font-size: 22px; }
.FS-5 { line-height: 30px; font-size: 25px; }
.FS-H { line-height: 45px; font-size: 30px; }

.LH-15 { line-height: 15px; !important; }
.LH-20 { line-height: 20px; !important; }
.LH-25 { line-height: 25px; !important; }
.LH-30 { line-height: 30px; !important; }
.LH-35 { line-height: 35px; !important; }
.LH-40 { line-height: 40px; !important; }

.BG-E   { background-color: #ebebeb; }
.BG-F   { background-color: #FFFFFF; }
.BG-0x1 { background-color: rgba(0, 0, 0, .1); }
.BG-0x2 { background-color: rgba(0, 0, 0, .2); }
.BG-0x5 { background-color: rgba(0, 0, 0, .5); }
.BG-0x8 { background-color: rgba(0, 0, 0, .8); }

.BG-Fx1 { background-color: rgba(255, 255, 255, .1); }
.BG-Fx2 { background-color: rgba(255, 255, 255, .2); }
.BG-Fx5 { background-color: rgba(255, 255, 255, .5); }
.BG-Fx8 { background-color: rgba(255, 255, 255, .8); }

.BG_fb { background-color: rgba(40,   70, 125, .8); }
.BG_vk { background-color: rgba(75,  120, 170, .8); }
.BG_ok { background-color: rgba(240, 130,  10, .8); }

.FC-I { color: inherit; }
.FC-0 { color: #000000; }
.FC-3 { color: #333333; }
.FC-6 { color: #666666; }
.FC-9 { color: #999999; }
.FC-C { color: #CCCCCC; }
.FC-F { color: #FFFFFF; }
.FC-G { color: rgb(175, 250, 50);  }
.FC-Y { color: rgb(250, 175, 50);  }
.FC-R { color: rgb(200, 100, 100); }

/*
// Формы
*/
form.form
{
    background-color: #ebebeb;
    line-height: 30px;
}
form.form.transparent
{
    background-color: transparent;
}
form.form td div.label-top
{
    margin-bottom: -10px;
}
form.form td.w
{
    background-color: #cccccc;
    height: 1px;
}
form.form td.i
{
    background-color: rgba(255, 255, 255, 1);
    padding-right: 20px;
}
form.form td.i.transparent
{
    background-color: transparent;
}
form.form td.i.select,
form.form td.i.checkbox
{
    padding-right: 0;
}
form.form td.i.checkbox
{
    background-color: transparent;
}
form.form td.i > input,
form.form td.i > select,
form.form td.i > textarea,
form.form td.i.relative > .absolute > textarea
{
    background-color: transparent;
    padding: 5px 10px 5px 10px;
    transition: all .3s;
    line-height: 20px;
    display: block;
    resize: none;
    height: 20px;
    width: 100%;
}
form.form td.i > select
{
    background-color: rgba(255, 255, 255, 1);
    padding: 5px 6px 5px 6px;
    height: 30px;
}
form.form td.i > input:hover,
form.form td.i > select:hover,
form.form td.i > textarea:hover,
form.form td.i.relative > .absolute > textarea:hover
{
    background-color: rgba(255, 255, 0, .1);
}
form.form td.i > input:focus,
form.form td.i > select:focus,
form.form td.i > textarea:focus,
form.form td.i.relative > .absolute > textarea:focus
{
    background-color: rgba(255, 255, 0, .2);
}
form.form td.i > label
{
    padding: 5px 5px 5px 5px;
    line-height: 20px;
    display: block;
}
form.form td.i > label > input
{
    margin-right: 10px;
    height: 20px;
    width:  20px;
    float: left;
}
form.form td.i > label:hover
{
    background-color: rgba(255, 255, 255, .5);
}
form.form td.i.relative > .absolute
{
    position: absolute;
    right:  20px;
    bottom: 10px;
    left:   0;
    top:    0;
}
form.form td.i.relative > .absolute > textarea
{
    height: 100%;
}

form.form td.button
{
    padding: 0;
}
form.form td.button > a
{
    background-color: rgba(0, 0, 0, .2);
    text-decoration: none;
    text-align: center;
    line-height: 30px;
    display: block;
}
form.form td.button > a:hover
{
    background-color: rgba(0, 0, 0, .5);
    color: #FFFFFF;
}
form.form input[type='submit'],
form.form input[type='button']
{
    background-color: rgba(0, 0, 0, .2);
    padding: 0 10px 0 10px;
    cursor: pointer;
}
form.form input[type='submit']:hover,
form.form input[type='button']:hover
{
    background-color: rgba(0, 0, 0, .5);
    color: #FFFFFF;
}