/* ==========================================================================
   Base & Common Elements
   ========================================================================== */

.uho {
    display: table;
    margin: 20px;
    border: 1px solid rgb(209, 212, 214);
    padding: 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
    background-color: rgb(238, 238, 238);
}

.people { padding: 10px; }
.wrapper-label { margin: 5px 0 15px 0; display: block; font-weight: 400; color: #7f7f7f; font-size: 10px; font-style: italic; }
.total_voters { cursor: default; color: #aeaeae; font-size: 8px; height: 18px; left: 13px; position: relative; text-align: right; top: -35px; width: 18px; }
.ip_name { color: #aaaaaa; font-size: 8px; }
.imgBig { width: 95%; }
.imgSmall { max-width: 95%; }

.sidebox { background: url(../images/sbbody-r.png) no-repeat bottom right; font-size: 100%; }
.boxhead { background: url(../images/sbhead-r.png) no-repeat top right; margin: 0; padding: 0; text-align: center; }
.boxhead h1 { background: url(../images/sbhead-l.png) no-repeat top left; margin: 0; padding: 22px 30px 5px; color: #fff; }
.boxbody { background: url(../images/sbbody-l.png) no-repeat bottom left; margin: 0; padding: 5px 30px 31px; }

#header, #header-back { background: #333333 url(http://magspace.ru/templates/skin/new/images/logobg.gif) repeat scroll 0 0; }
.my_head_top { background: transparent url(../images/pagenav_bg.gif) repeat-x scroll 0 0; width: 100%; height: 30px; }
.my_head_bottom { width: 135px; height: 221px; position: absolute; z-index: 5000; top: 0; margin-left: 63%; background: transparent url(../images/S_logo182.png) no-repeat; }

#gototop { position: fixed; background: url("../img/return_top.png") no-repeat scroll left top transparent; display: block; height: 66px; right: 0; bottom: 15px; width: 20px; }
#gototop:hover { background-position: right top; }
.ads_map { background: transparent url(../images/mapbaner.png) no-repeat 0 0; height: 312px; width: 100%; overflow: hidden; }

/* ==========================================================================
   Spoilers, Topics & Video
   ========================================================================== */

.topic h1.title, .topic h1.title a { font-family: 'Exo 2', sans-serif; font-weight: inherit; letter-spacing: normal; }
.topic .content img { margin: 0 !important; }

.spoiler-title { cursor: pointer; border: 1px dotted #ccc; background-color: #f0f0f0; padding: 3px 5px; text-decoration: underline; }
.spoiler-body { display: none; border: 1px solid #ccc; border-top: 0; padding: 3px 5px; }
.new-spoiler-title { cursor: pointer; border-bottom: 1px dashed #f00 !important; color: red !important; text-decoration: none !important; }
.spoiler-vote { cursor: pointer; border: 1px dotted #ccc; background-color: #f0f0f0; padding: 3px 5px; text-decoration: underline; display: block; font: 12px/18px Tahoma, Arial, sans-serif; color: #333; }

.video_small, .video_uncnown {
    box-shadow: 0 0 15px #000000;
    background: #111111;
    margin: 10px auto;
}
.video_small { width: 320px; padding: 0 !important; }
.video_uncnown { border-bottom: 1px solid #000000; padding: 10px 10px 40px !important; }

.b-media-copyright { color: #7c7c7c; text-align: left; font-weight: 400; padding-top: .5em; margin: 0 -1em; line-height: 1.1; display: flex; justify-content: space-between; flex-wrap: wrap; }

/* ==========================================================================
   Blocks & Sidebar
   ========================================================================== */

.block {
    box-sizing: border-box;
    border-radius: 4px;
    line-height: 16px;
    margin: 7px 7px 20px 7px;
}

.block h1 { font-family: Tahoma, Verdana, sans-serif; font-size: 20px; color: #333; padding-bottom: 5px; margin-bottom: 0; }

.block.follow, .block.stream, .block.blogs, .block.images {
    background-color: #FAFAFA;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1));
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 -2px 0 rgba(0, 0, 0, 0.1) inset, 0 0 10px rgba(255, 255, 255, 0.5) inset, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.2);
}

.block.tags {
    background: #f7f8f9;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2) inset;
}

.block.navigation { font-size: 11px; color: #888; }
.block.navigation ul li { padding: 10px 0; border-bottom: 1px dotted #ddd; }
.block.navigation ul li.last { border: 0; }
.block.navigation .blog { color: #999; }

.follow .cr h1, .stream .cr h1 {
    padding: 5px 20px;
    margin-bottom: 10px;
    border-radius: 4px 4px 0 0;
    box-sizing: border-box;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
}
.follow .cr h1 { background: linear-gradient(to bottom, #fefcea 0%, #f1da36 100%); }
.stream .cr h1 { background: linear-gradient(to bottom, #fefcea 0%, #cdf5a6 100%); }

.follow .cr .block-nav, .follow .cr .block-content,
.stream .cr .block-nav, .stream .cr .block-content { padding: 0 20px; }
.bd .block-content { padding: 0 5px; }

/* ==========================================================================
   Buttons (Bootstrap-like)
   ========================================================================== */

.btn {
    display: inline-block;
    padding: 4px 14px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    color: #333333;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    background-color: #f5f5f5;
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #ccc;
    border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    text-decoration: none !important;
}

.btn:hover, .btn:focus {
    color: #333333;
    text-decoration: none;
    background-color: #e6e6e6;
    background-position: 0 -15px;
    transition: background-position 0.1s linear;
}

.btn.active, .btn:active {
    background-image: none;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
    outline: 0;
}

.btn.disabled, .btn[disabled] {
    cursor: default;
    background-image: none;
    opacity: 0.65;
    box-shadow: none;
}

.btn-large { padding: 9px 14px; font-size: 16px; border-radius: 5px; }
.btn-small { padding: 3px 9px; font-size: 12px; line-height: 18px; }
.btn-mini  { padding: 2px 6px; font-size: 11px; line-height: 16px; }
.btn-block { display: block; width: 100%; box-sizing: border-box; padding-left: 0; padding-right: 0; }
.btn-block + .btn-block { margin-top: 5px; }

/* Variations */
.btn-primary { background-color: #006dcc; background-image: linear-gradient(to bottom, #0088cc, #0044cc); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-primary:hover, .btn-primary:active { background-color: #0044cc; color: #fff; }

.btn-warning { background-color: #faa732; background-image: linear-gradient(to bottom, #fbb450, #f89406); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-warning:hover, .btn-warning:active { background-color: #f89406; color: #fff; }

.btn-danger { background-color: #da4f49; background-image: linear-gradient(to bottom, #ee5f5b, #bd362f); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-danger:hover, .btn-danger:active { background-color: #bd362f; color: #fff; }

.btn-success { background-color: #5bb75b; background-image: linear-gradient(to bottom, #68bf46, #51a351); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-success:hover, .btn-success:active { background-color: #51a351; color: #fff; }

.btn-info { background-color: #49afcd; background-image: linear-gradient(to bottom, #5bc0de, #2f96b4); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-info:hover, .btn-info:active { background-color: #2f96b4; color: #fff; }

.btn-inverse { background-color: #363636; background-image: linear-gradient(to bottom, #444444, #222222); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
.btn-inverse:hover, .btn-inverse:active { background-color: #222222; color: #fff; }

.btn-link { background: transparent; border-color: transparent; color: #0088cc; cursor: pointer; box-shadow: none; }
.btn-link:hover { color: #005580; text-decoration: underline; background: transparent; }

/* Button Groups */
.btn-group { position: relative; display: inline-block; white-space: nowrap; font-size: 0; }
.btn-group + .btn-group { margin-left: 5px; }
.btn-group > .btn { position: relative; border-radius: 0; font-size: 14px; }
.btn-group > .btn + .btn { margin-left: -1px; }
.btn-group > .btn:first-child { border-radius: 4px 0 0 4px; }
.btn-group > .btn:last-child { border-radius: 0 4px 4px 0; }

/* ==========================================================================
   Badges (Base64 Sprite)
   ========================================================================== */

.badge {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    height: 48px;
    width: 48px;
    background-image: url("data:image/png;base64,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");
}
.badge-hot  { background-position: 0 0; }
.badge-top  { background-position: 0 -50px; }
.badge-free { background-position: 0 -100px; }
.badge-new  { background-position: 0 -150px; }

/* ==========================================================================
   Meter & Progress (Polls)
   ========================================================================== */

.meter {
    height: 10px;
    position: relative;
    background: #f7f8f9;
    border-radius: 10px;
    padding: 5px;
    box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.3);
}

.meter > span {
    display: block;
    height: 100%;
    border-radius: 20px 8px 8px 20px;
    background-color: rgb(43, 194, 83);
    background-image: linear-gradient(to top, rgb(43, 194, 83) 0%, rgb(84, 240, 84) 100%);
    box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
    position: relative;
    overflow: hidden;
}

.orange > span {
    background-color: #f1a165;
    background-image: linear-gradient(to bottom, #f1a165, #f36d0a);
}

.red > span {
    background-color: #f0a3a3;
    background-image: linear-gradient(to bottom, #f0a3a3, #f42323);
}

/* ==========================================================================
   Tables
   ========================================================================== */

table { max-width: 100%; background-color: transparent; border-collapse: collapse; border-spacing: 0; }
.table { width: 100%; margin-bottom: 20px; }
.table th, .table td { padding: 8px; line-height: 20px; text-align: left; vertical-align: top; border-top: 1px solid #ddd; }
.table th { font-weight: bold; }
.table thead th { vertical-align: bottom; }
.table tbody + tbody { border-top: 2px solid #ddd; }
.table-condensed th, .table-condensed td { padding: 4px 5px; }

.table-bordered { border: 1px solid #ddd; border-collapse: separate; border-left: 0; border-radius: 4px; }
.table-bordered th, .table-bordered td { border-left: 1px solid #ddd; }

.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th { background-color: #f9f9f9; }

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th { background-color: #f5f5f5; }

/* Status rows */
.table tbody tr.success td { background-color: #dff0d8; }
.table tbody tr.error td   { background-color: #f2dede; }
.table tbody tr.warning td { background-color: #fcf8e3; }
.table tbody tr.info td    { background-color: #d9edf7; }



.paste-info-tooltip {
    background: #333;
    color: #fff;
    padding: 10px 14px;
    border-radius: 4px;
    font-size: 13px;
    max-width: 280px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
    line-height: 1.4;
}
.paste-info-tooltip:before {
    content: '';
    position: absolute;
    top: -6px;
    left: 12px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #333;
}

.markItUpButton.editor-pasteinfo a {
    display: block;
    width: 16px;
    height: 16px;
    overflow: hidden;
    text-indent: -9999px;   /* прячем текст за пределы видимой области, как у остальных кнопок */
    position: relative;
}
.markItUpButton.editor-pasteinfo a:before {
    content: '🚀';
    position: absolute;
    left: 0;
    top: 0;
    text-indent: 0;         /* возвращаем иконке нормальное позиционирование */
    font-size: 14px;
    line-height: 16px;
}




.paste-upload-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
}
.paste-upload-spinner {
    width: 40px;
    height: 40px;
    border: 5px solid rgba(0, 0, 0, 0.15);
    border-top-color: #333;
    border-radius: 50%;
    animation: paste-upload-spin 0.8s linear infinite;
}
@keyframes paste-upload-spin {
    to { transform: rotate(360deg); }
}


.top_in_blog {
   margin: 10px 0 5px 0; 
}
.tib-grid {
    list-style: none;
    margin: 0;
    padding: 0 0 10px;
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
}
.tib-grid::-webkit-scrollbar {
    height: 6px;
}
.tib-grid::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,.2);
    border-radius: 5px;
}
.tib-card {
    position: relative;
    flex: 0 0 auto;
    width: 220px;
    aspect-ratio: 4 / 3;
    border: 1px solid rgb(209, 212, 214);
    border-radius: 5px;
    overflow: hidden;
    cursor: pointer;
    background: #eee;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px;
    scroll-snap-align: start;
}
.tib-card .tib-image,
.tib-card .tib-alt {
    position: absolute;
    inset: 0;
}
.tib-card .tib-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
    max-width: none;
    filter: grayscale(70%);
    transition: 1s;
}
.tib-card:hover .tib-image img {
    filter: grayscale(0%);
}
.tib-card .tib-alt {
    padding: 14px;
    font-size: 13px;
    line-height: 1.4;
    color: #fff;
    background: linear-gradient(135deg, #556270, #4ecdc4);
    overflow: hidden;
}
.tib-card .tib-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 10px 12px;
    background: linear-gradient(to top, rgba(0,0,0,.88), rgba(0,0,0,.5) 70%, rgba(0,0,0,0) 100%);
}
.tib-card .tib-title a {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.3;
    display: block;
    max-height: 19px;
    overflow: hidden;
    transition: max-height .3s ease;
}
.tib-card:hover .tib-title a {
    max-height: 38px;
}
.tib-badge {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(0,0,0,.6);
    border-radius: 5px;
    padding: 5px 9px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}
.tib-badge .tib-rating {
    color: #7ed957;
}
.tib-badge .tib-divider {
    width: 1px;
    height: 12px;
    background: rgba(255,255,255,.3);
}
.tib-badge .tib-comments {
    color: #fff;
}
@media (max-width: 600px) {
    .tib-card {
        width: 150px;
    }
}