`/*
Author:            redissx (ICQ: 275116000, E-mail: redissx@gmail.com, Website: webrambo.ru )  */

@import "reset-settings.css" all;

.item-img img, .top-img img {width:100%; min-height:100%;}
a, button, .fa, .overlay-close, .item-img:before, .item-hd, .item-like, .item-box, .add-com-but, .comm-rate,
.comm-bottom-info, .alert-buttons span, .h-line-two-inner, .logotype {transition: all .5s;}

.clr {clear: both;}

/* FONTS
a, h1, h2, h3 {
font-family: arial;
}


/* KARKAS


----------------------------------------------- */
.all-wrap {height:auto; width:100%; padding:0; background: linear-gradient(to bottom, #28343b 0%,#f5f5f5 600px);}
.box-wrap {width:100%; min-width:320px; max-width:1400px; margin:0 auto;  background-color: #f6f6f6;
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.1);}
.header {position:relative; z-index:999; border-bottom:1px solid #cecece;}
.box-main {display: flex;position:relative; z-index:100;}

.main-left {float:left; width:80%; padding:0 20px; min-height:800px;}
.main-right {float:right; width:280px; position:relative; z-index:100;
padding:20px; background-color:#fff;}
.box-cat {padding:0 20px; min-height:800px;}
.full-left {float:left;width: 100%;min-height:800px;}

h1, h2, h3, {
	font-family: 'Roboto', sans-serif !important;
    font-weight: 700;
}
a, p {
	font-family: 'Roboto', sans-serif !important;
    font-weight: 400;
}
/* ALERT
----------------------------------------------- */
/*.alert-wrap {padding:20px 0;}*/
.alert-window {width:100%; max-width:800px; margin:0 auto; color:#fff; text-align:center;}
.alert-title {margin:0 0 10px 0; font-size:18px;}
.alert-text {font-size:14px;}
.alert-buttons {margin-top:20px;}
.alert-buttons span {cursor:pointer; display:inline-block; color:#fff; background-color:#FA3BA2; font-size:18px;
padding:5px 20px; margin:0 10px; border-radius:3px;}
.yes-but {}
span.no-but {background-color:#fff; color:#5c5c5c;}
.alert-buttons span:hover {color:#fff; background-color:#de436b;}


/* HEADER
----------------------------------------------- */
.TopHeaderMenu{
    height: 100px;
    line-height: 40px;
    padding-right: 20px;
    /* background-color: #1a3fa9;
    background: linear-gradient(to bottom, #2460b9 0%,#106394 100%);*/
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #035bbc;
}
.h-line-two {}
.h-line-three {height:40px; background-color: #333; padding: 0 20px; line-height: 40px; color: #FA3BA2; background: linear-gradient(to bottom, #666a70 0%,#28343b 100%);}
.h-line-two-inner {
    width: 100%;
    min-width: 320px;
    max-width: 1400px;
    margin: 0 auto;
    height: 50px;
    background-color: #fed401;
    position: relative;
    z-index: 2;
}
.h-line-two.fixed {position:fixed; width:100%; left:0; top:0;z-index: 1;}
.h-line-two.fixed .h-line-two-inner {background-color:#01375a); box-shadow:0 20px 20px -20px rgba(0,0,0,0.4);
height:60px;}



.h-line-one ul {display:inline-block; float:right;}
.h-line-one ul li {display:inline-block; padding:0 0 0 10px;}
.h-line-one ul li a {display:block;}
.h-line-one a, .top-nav a { color: #f0f0f0;}
.h-line-one a:hover, .top-nav a:hover { color: #FA3BA2;}
.logotype {height:100%; width:250px; display:block; position:absolute; left:0; top:0;
background:url(../images/logo.png) left center no-repeat; overflow:hidden; text-indent:-1000px; background-size:contain;}
.logotype:hover {opacity:0.8;}
.top-nav, .top-nav li {display:inline-block; float:left;}
.top-nav a {display:block; font-size:18px; padding:0 15px; line-height:50px;}
.icons-nav {float:right; display:inline-block; line-height:50px; font-size:24px;}
.icons-nav span, .icons-nav a {display:inline-block;width:50px;text-align:center;cursor:pointer;color: #1b1a1a;}
.icons-nav span:hover, .icons-nav a:hover, .icons-nav .active {color:#818B82;}
.h-line-three a {color:#f0f0f0; margin:0 3px;}
.h-line-three img {display:none;}
.h-line-three a:hover {color:#fff; text-decoration:underline;}

.search-wrap {
    width: 100%;
    position: absolute;
    left: 0;
    top: 100%;
    padding-top: 20px;
    background-color: #0b4a8a;
    z-index: 100;
    display: none;
    box-shadow: 0 20px 20px -20px rgba(0,0,0,0.4), inset 0 20px 20px -20px rgba(0,0,0,0.4);
}
.search-box {width:100%; position:relative; margin:0 auto; max-width:700px;}
.search-box input, .search-box input:focus {    width: 100%;
    height: 40px !important;
    line-height: 38px !important;
    padding: 0 100px 0 10px !important;
    border-radius: 3px !important;
    background-color: #fff !important;
    color: #999 !important;
    font: italic 14px Georgia;
    border: 1px solid #e3e3e3 !important;
}
.search-box input:focus {border:1px solid #FA3BA2; box-shadow:none;}
.search-box button {    position: absolute;
    right: 0px;
    top: 1px;
    padding: 0;
    text-align: center;
    width: 80px;
    height: 40px;
    line-height: 40px;
    left: 104.5%;
    background-color: #ff3636;
    }


/* SHORTS
----------------------------------------------- */
.top-title {font-size:28px; font-weight:300;}

.item-box {
    width: 100%;
    margin: 0 1% 20px 0;
    background-color: #fff;
    border-radius: 3px;
    position: relative;
    border: 1px solid #cecece;
    overflow: hidden;
}
.item-box a {
    text-decoration: none;
    margin-bottom: 3px;
}
.item-box a:hover{
    text-decoration: none;
}
.item-box a img {
    max-height: 173px;
    max-width: 230px;
    position: absolute;
    top: 6px;
    left: 6px;
}
.short_story b br {display: none}
.short_story {
    padding-left: 240px;
    height: 130px;
    overflow: hidden;
}
.main-left .items-wrap #dle-content > .item-box:nth-child(3n), .main-left .items-wrap > .item-box:nth-child(3n),
.full-left .items-wrap #dle-content > .item-box:nth-child(3n), .full-left .items-wrap > .item-box:nth-child(3n) {margin-right:0;}
.box-cat .items-wrap .item-box:nth-child(4n) {margin-right:0;}

.item-img {overflow:hidden; position:relative; border-radius:3px 3px 0 0}
.item-hd {display:inline-block; padding:5px 10px; position:absolute; bottom:10px; left:10px;
background-color:#FA3BA2; color:#fff; border-radius:3px; opacity:0.8;}
.prem-label:before {content:attr(data-prem); background-color:#FA3BA2; color:#fff; padding:3px 5px; text-align:center;
width:100px; position:absolute; left:-25px; top:17px; transform:rotate(-45deg); opacity:0.8;}
.item-desc {
    padding: 5px;
    color: #5c5c5c;
    display: flex;
    flex-direction: column;
}
.item-title {
    font-size: 20px;
    text-overflow: ellipsis;
    color: #0088cc;
    margin-left: 240px;
}
.item-info {height:20px; line-height:20px; overflow:hidden; color:#999;}
.item-info i {margin-right:5px;}
.item-info > span {display:inline-block; float:left; margin-right:15px; font-size:12px;}
.item-info > span:nth-child(3){float:right; margin-right:0;}
.item-info > span:first-child {font-weight:700; color:#858585;}
.item-info > span:nth-child(2n) {font-weight:700; color:#858585;}
.item-like {display:inline-block; position:absolute; right:10px; top:10px; z-index:100; opacity:0.8;}
.item-like a {display:block; min-width:30px; height:30px; padding:0 10px; line-height:30px; border-radius:3px;
background-color:#444; color:#fff; font-size:18px;}
.item-like a:hover {background-color:#FA3BA2; color:#fff;}
.item-box:hover { border-color:#aeaeae;}
.item-box:hover .item-hd, .item-box:hover .item-like, .item-box:hover .item-img:before {opacity:1;}
span.ItemViews {
    margin-left: 241px;
    margin-top: 3px;
    /* padding-top: 3px; */
    display: block;
    color: #8c8b8b;
}


/* SIDEBAR
----------------------------------------------- */
.side-box {margin-bottom:20px;}
.side-title {font-size:24px; margin:0px 0 20px 0; color:#3ba2fa;}
.side-title i {margin-right:10px;}
.dopRightMenu .catmenu {padding: 0;}
.catmenu {margin: 0px;list-style-type: none;}
.catmenu li a {display:block; padding:8px 0; border-top: 1px solid #cecece; line-height: normal;color: #08c;text-decoration: none;}
.catmenu li:last-child a {border-bottom: 1px solid #cecece;}

.top-item {display:block; float:left; width:49%; margin-bottom:10px;}
.top-item:nth-child(2n) {float:right;}
.top-img {height:90px; overflow:hidden; margin-bottom:10px;}
.top-item-title {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px;}

.side-rkl-section {text-align:center;}


/* SEO DESCRIPTION
----------------------------------------------- */
.site-desc, .site-desc-album {padding:20px; color:#5c5c5c; border:1px solid #cecece;
margin:0 0 20px 0; position:relative; background-color:#FFF;}
.site-desc {padding: 5px; height: 300px;}
.site-desc-album {display: flex; justify-content: space-between; flex-wrap: wrap; padding: 10px;}
.site-desc h1, .site-desc h2, .site-desc h3 {font-size:18px; color:#444; text-transform:uppercase; margin-bottom:10px; font-weight:300;}
.site-desc h1 span, .site-desc h2 span, .site-desc h3 span {color:#FA3BA2;}
.site-desc p {margin-bottom:5px;}


/* FOOTER
----------------------------------------------- */
.footer {position:relative;}
.footer a, .footer {color:#fff;}
.f-line-one {background-color:#01375a; padding:20px 150px 20px 20px;display: flex;justify-content: space-between;}
.f-line-two {background-color:#222; padding:10px 20px; font-size:12px;}
.f-line-one ul li {display:inline-block; float:left; margin-right:20px;}
.f-line-one ul li a {display:block; line-height:40px;}
.f-line-one a:hover {color:#FA3BA2;}
.f-line-two a {text-decoration:underline;}
.f-line-two a:hover {color:#fff; text-decoration:none;}
.counters-box {display:inline-block; background-color:#222; min-width:88px; height:31px;
position:absolute; right:20px; top:24px;}



/* SPEEDBAR
----------------------------------------------- */
.bread-crumbs {height:50px; padding:0 20px; line-height:50px; background-color:#FFF;
white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.bread-crumbs a {position:relative; display:inline-block; margin-right:30px;}
.bread-crumbs a:after, .bread-crumbs a:before {left: 100%;top: 50%;border: solid transparent;content: " ";
height: 0;width: 0;position: absolute;pointer-events: none;}
.bread-crumbs a:after {border-color: rgba(136, 183, 213, 0);border-left-color: #fff;border-width: 25px;margin-top: -25px;}
.bread-crumbs a:before {border-color: rgba(206, 206, 206, 0);border-left-color: #cecece;border-width: 26px;margin-top: -26px;}


/* FULL STORY
----------------------------------------------- */
.page-wrap {background-color:#FFF; border-bottom:1px solid #cecece;}
.pw-top-section {padding:20px;}
.pw-top-section h1 {
    font-size: 24px;
    margin-bottom: 20px;
    color: #0088cc;
}

.pw-description {
    color: #000000;
    line-height: 22px;
    font-size: 14px;
    padding: 10px;
}
.pw-description a { text-decoration:underline;}
.pw-player-section {}
.pw-player-section embed, .pw-player-section object, .pw-player-section video, .pw-player-section iframe, .pw-player-section frame {width: 100% !important; height:500px;}
.pw-video-info {padding:10px 20px; background-color:#333;}
.full-info-item {display:inline-block; float:left; height:30px; line-height:30px; margin-right:20px;
color:#CCC;}
.full-info-item i {color:#666; margin-right:5px;}
.full-info-item a {color:#ccc;}
.full-info-item a:hover {color:#fff;}

.full-rating {color:#FFF; font-size:18px; float:right; height:30px; line-height:30px;}
.full-rating2 i {color:#FA3BA2; margin-right:5px;}
.full-rating2 a {display:block; padding:0 10px; color:#FFF; border:1px solid #666; border-radius:3px;}
.full-rating2 a:hover {background-color:#FA3BA2; color:#FFF; border-color:#FA3BA2;}
.full-rating2 a:hover i {color:#FFF;}

.full-rating3 {color:#FFF; border:1px solid #666; border-radius:3px; overflow:hidden;}
.full-rating3 a {display:block; padding:0 10px; color:#FFF; float:left; margin-right:10px;}
.full-rating3 a:nth-child(2) {float:right; margin-right:0; margin-left:10px;}
.full-rating3 i {color:#ccc;}
.full-rating3 a:hover {color:#FFF; background-color:#03b020;}
.full-rating3 a:nth-child(2):hover {background-color:#c1050a;}
.full-rating3 a:hover i {color:#FFF;}

.pw-rkl-section {padding:5px 20px 20px 20px; background-color:#333; text-align:center;}

.pw-bottom-section {padding:20px 20px 0 20px;}
.info-line {margin-bottom:20px;}
.info-line i {margin-right:5px; font-size:18px;}
.info-line a {color:#5c5c5c;}
.info-line a:hover {color:#000; text-decoration:underline;}
.info-line > span {display:inline-block; float:right; margin-left:15px;}
.info-line > span:first-child {float:left; margin-left:0;}



/* FULL STORY STATIC
----------------------------------------------- */
.full-text embed, .full-text object, .full-text video, .full-text iframe, .full-text frame {width: 100% !important; height:400px;}
.full-text {line-height:24px; color:#5c5c5c}
.full-text img {margin:0 10px 10px 0; max-width:100%; border:5px solid #f0f0f0;}
.full-text a {text-decoration:underline; color:#06c;}
.full-text a:hover {text-decoration:underline; color:#C9070A;}
.full-text a:visited {text-decoration:underline; color:#06c;}
.full-text h2, .full-text h3 {font-size:20px;}
.full-text h4, .full-text h5 {font-size:18px;}
.full-text p {
margin-bottom: 15px;}
.full-text ul, .full-text ol, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {margin:0;}
.full-text ul li {list-style:disc; margin-left:40px;}
.full-text ol {counter-reset:li; padding:0;  list-style:none; margin-left:25px; }
.full-text ol li {position:relative; margin:0 0 5px 0; padding-left:30px; min-height:20px;}
.full-text  ol li:before {content:counter(li); counter-increment:li; font-size:11px;
position:absolute; top:0px; left:0; width:20px; height:20px; line-height:20px; text-align:center;
color:#fff; background:#0297dc; font-weight:bold; border-radius:50%;}
.full-text table {width:100%; text-align:left;}
.full-text table tr td {padding:10px; border:1px solid #ccc; font-size:12px; }
.full-text table tr:nth-child(1) {color:#FFF; font-size:14px !important;}
.full-text table tr:nth-child(2n+1) {background-color:#f9f9f9;}

.dcont {border:1px solid #e3e3e3; padding:0 15px 15px 15px; margin:20px 0; line-height:20px;}
.polltitle {display:block; padding:5px 15px; margin:0 -15px 15px -15px; font-size:18px; background-color:#f5f5f5; line-height:normal;}
.full-nav {text-align:center; margin-bottom:20px;}
.full-nav a {color:#06c; text-decoration:none;}
.full-nav a:hover {color:#06c; text-decoration:underline;}
.full-nav-pages {margin:0 15px;}
.full-nav-pages span, .full-nav-pages a {display:inline-block; margin:0 5px;}
.static-wrap {padding:10px; margin:10px;background-color: #fff;}

/* RELATED
----------------------------------------------- */
.related {border-top:1px solid #cecece; margin:0 -20px;}
.related-title {text-align:center; padding:20px 0; font-size:24px; font-weight:300;}
.related-items {
    padding: 0 20px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.related-items .item-box {width:24.25%;}
.related-items .item-box:nth-child(4n) {margin-right:0;}
.related-items .item-img {height:150px;}



/* COMMENTS
----------------------------------------------- */
.comments {padding:20px;}
.comments-title {text-align:center; font-size:24px; margin-bottom:20px; font-weight:300;}
.add-com {text-align:center; margin-bottom:20px;display: grid;;width: 100%;}
.add-com-but {display:inline-block; background-color:#FFF; border:1px solid #cecece; border-radius:3px;
padding:10px; font-size:16px; color:#aeaeae; cursor:pointer;margin: auto;}
.add-com-but i {margin-left:50px; font-size:24px; float:right;}
.add-com-but:hover {border-color:#FA3BA2;}
#addcform {display:none; margin:20px 0; text-align:left;}
.mass_comments_action { height: 1%; text-align: right; padding:5px 15px; background-color: #f6f6f6; margin:20px 0;}
.mass_comments_action .bbcodes { margin-bottom: 0 }

.comments-items {width:100%; max-width:700px; margin:0 auto;}

.comm-item {padding:0 0 0 50px; margin-bottom:10px}
.comm-left {float:left; margin-left:-70px; width:50px; height:50px; overflow:hidden; position:relative;}
.comm-right {float:right; width:100%; padding-left:10px;}
.comm-left img {width:100%; min-height:100%;}
.comm-left:after {content:""; width:6px; height:6px; position:absolute; left:0; bottom:0;
background-color:#ccc; border:2px solid #FFF;}
.status-online:after {background-color:#3C0;}
.comm-top-info {}
.comm-info-line {position:relative; padding-right:120px;}
.comm-id, .comm-author, .comm-date {float:left; color:#888; font-size:10px; display:inline-block;}
.comm-author {font-size:12px; font-weight:bold; margin:0 10px; color:#b43852;}
.comm-author a {color:#b43852;}
.comm-text {margin:10px 0; min-height:50px; background-color:#FFF; border-radius:3px; padding:10px;}
.comm-body {}
.signature {font:italic 11px Georgia, "Times New Roman", Times, serif; margin-top:10px; border-top:1px dashed #e3e3e3;}
.comm-bottom-info {margin-top:-10px; opacity:0;}
.comm-bottom-info ul {text-align:right; line-height:30px;}
.comm-bottom-info ul li {display:inline-block; margin-left:10px;}
.comm-bottom-info ul li a {font-size:11px;}
.comm-bottom-info ul li:first-child {font-weight:bold; float:left; background-color:#333; padding:0 10px; margin-left:0;}
.comm-bottom-info ul li:first-child a { color:#FFF;}
.comm-author a:hover, .comm-bottom-info ul li a:hover {text-decoration:underline;}
.comm-rate {position:absolute; right:0; top:0; line-height:20px; opacity:0;}
.comm-item:hover .comm-rate, .comm-item:hover .comm-bottom-info {opacity:1;}
.comm-rate span.ratingtypeplusminus {display:block; padding:0 30px;  color:#444;
font-weight:700; font-size:16px;}
.comm-rate a {display:block; width:20px; height:20px; position:absolute; top:0; left:0;
text-align:center; line-height:20px; font-size:28px; font-weight:700; color:#61b804;}
.comm-rate a:last-child {left:auto; right:0; line-height:20px;
color:#ec000b; top:-3px;}
.comm-rate a:hover {opacity:0.7;}
.comm-rate > span > span.ratingzero {color: #444444;}
.comm-rate > span > span.ratingtypeplus {color: #06b601;}
.comm-rate > span > span.ratingplus {color: green;}
.comm-rate > span > span.ratingminus {color: red;}

.pos-comm {background-color:#e5f7e5;}
.neg-comm {background-color:#f7e5e6;}

/*Карта проблем*/
.mapProblem {
    font-size: 22px;
    max-width: 100px;
    text-align: center;
    line-height: 1.2;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 25px;
    margin-bottom: 0px;

}
.mapProblem a {
    color: #f1f2f3;
    text-decoration: none;
}
.mapProblem a:hover {
    color: #f1f2f3;
}
.mapProblem a:focus {
    color: #f1f2f3;
}
/* GO TOP BUTTON */
#gotop{position:fixed;width:40px;height:40px;right:0px;bottom:0px;cursor:pointer;
background:url('../images/gotop.png') no-repeat;z-index:9998;display:none; opacity:0.8;}


/* LOGIN
----------------------------------------------- */
.overlay {position:fixed; left:0; top:0; z-index:999; width:100%; height:100%; background-color:#444;
 background: linear-gradient(90deg, #444 10%, #000 90%); display:none;}
.overlay-close {position:absolute; right:40px; top:40px; font-size:34px !important; color:#fff; cursor:pointer;}
.overlay-close:hover {transform:rotate(90deg) scale(1.1,1.1);}
.login-box {width:320px; position:absolute; left:50%; top:20%; margin-left:-160px;
padding:20px; color:#fff;}
.login-title {text-align:center; font-size:24px; margin-bottom:20px;}
.login-input {margin-bottom:20px;}
.login-input input, .login-input input:focus {display:block; width:100%; height:40px; padding:0 10px; line-height:40px;
background-color:#fff; border-radius:3px; border:1px solid transparent; box-shadow:none;}
.login-input input:focus {border:1px solid #FA3BA2;}
.login-button button {display:block; text-align:center; font-size:18px;
width:100%; height:40px; line-height:40px;}
.login-button button:hover {}
.login-checkbox {font-size:12px; margin:10px 0; color:#ccc;}
.login-checkbox input {display:none;}
.login-checkbox input + label:before {width:10px; height:10px; margin-right:5px; cursor:pointer; position:relative; top:3px;
border-radius:3px; border:3px solid #ccc; content:""; background-color:#444; display:inline-block;}
.login-checkbox input:checked + label:before { background-color:#FA3BA2;}
.login-links {text-align:center; line-height:30px;}
.login-links a {color:#ccc; float:left;}
.login-links a:last-child {float:right;}
.login-links a:hover {color:#fff;}
.login-social {text-align:center;}
.login-social a {display:inline-block; margin:0 3px 10px 3px;}
.login-social img {display:block; width:30px;}
.login-social a:hover img {transform:scale(1.1);}
.login-avatar {text-align:center;}
.avatar-box {display:inline-block; width:80px; height:80px; border-radius:50%; overflow:hidden;
box-shadow:3px 3px 10px 0 rgba(0,0,0,0.4);}
.avatar-box img {width:100%; min-height:100%;}
.avatar-box + a {color:#ccc; display:block; margin-top:5px;}
.login-menu {margin-top:20px;list-style-type: none;}
.login-menu a {display:block; height:30px; padding:0 20px; line-height:30px; background-color:#333; color:#fff;
margin-bottom:5px; border-radius:3px;}
.login-menu a:hover {background-color:#c9282c; color:#fff;}

/* VOTE
----------------------------------------------- */
.vote {
    border-bottom: 1px dashed #3f93dc;
    max-width: 70%;
    margin-bottom: 5px;
}
.vote label {
    display: inline-flex;
    margin-bottom: 5px;
    margin-left: 3px;
}

/* BLOX
----------------------------------------------- */
div#blox .bloxTop,
div#blox .bloxBottom {
    display: flex;
    justify-content: space-around;
    margin-bottom: 50px;
}
div#blox .bloxBottom{
    justify-content: center;
}
div#blox img {
    border-radius: 50%;
}
a.bloxLink {
    display: flex;
    justify-content: center;
}
div#blox p {
    max-width: 230px;
    text-align: center;
    margin: 0;
    line-height: 1.3;
}
/* ADAPTIVE
----------------------------------------------- */

.show-menu {display:none;}

@media screen and (max-width: 1500px) {
.box-wrap, .h-line-two-inner {max-width:100%;}
.main-left {width: 81%;}
.top-nav a {font-size:16px; padding:0 10px;}


.top-img {height:70px;}
}

@media screen and (max-width: 1220px) {
.main-left {padding:0 10px;}
.box-cat {padding:0 10px;}
.h-line-one {padding-right:10px;}
.h-line-one:before {padding:0 10px;}
.h-line-one span {margin:0 10px;}
.h-line-two-inner {padding:15px 20px 0 150px;}
.logotype {width:150px;}
.icons-nav span, .icons-nav a {width:40px;}
.top-title {font-size:24px; padding:10px 0;}

.alert-wrap {padding:0;}
.alert-wrap .alert-window {padding:10px;}

.item-box {width:49%; float:left; margin:0 1.2% 10px 0; height: 400px;}
.item-title {margin-left: 0;}
span.ItemViews {margin-left: 0;text-align: center;}
div#catsAlbum .item-box {max-height: 220px;}
.main-left .items-wrap #dle-content > .item-box:nth-child(3n), .main-left .items-wrap > .item-box:nth-child(3n),
.full-left .items-wrap #dle-content > .item-box:nth-child(3n), .full-left .items-wrap > .item-box:nth-child(3n) {margin:0 1.2% 10px 0;}
.main-left .items-wrap #dle-content > .item-box:nth-child(2n), .main-left .items-wrap > .item-box:nth-child(2n),
.full-left .items-wrap #dle-content > .item-box:nth-child(2n), .full-left .items-wrap > .item-box:nth-child(2n) {margin-right:0;}
.item-img {height:210px;}


.box-cat .item-box {width:24.25%; margin:0 1% 10px 0;}
.box-cat .items-wrap .item-box:nth-child(4n) {margin-right:0;}
.sluzh-wrap, .static-wrap, .form-wrap {padding:10px; margin:10px;}
.box-cat .item-box .item-img {height:150px;}

.pagi-nav {line-height:36px;}
.navigation a, .navigation span {min-width:35px;}
.site-desc {padding:10px;}
.f-line-one {padding:20px 150px 20px 10px;}
.f-line-two {padding:10px;}

.bread-crumbs {padding:0 10px;}
.bread-crumbs + .items-wrap {padding:20px 10px;}
.page-wrap {margin:-20px -10px 0 -10px;}
.pw-top-section {padding:10px;}
.pw-top-section h1 {margin-bottom:10px;}
.pw-video-info {padding:10px;}
.pw-rkl-section {padding:5px 10px 10px 10px;}
.pw-bottom-section {padding:10px 10px 0 10px;}
.info-line {margin-bottom:10px;}

.pw-player-section embed, .pw-player-section object, .pw-player-section video, .pw-player-section iframe, .pw-player-section frame {width: 100% !important; height:400px;}

.related {margin:0 -10px;}
.related-title {padding:10px 0;}
.related-items {padding:0 10px;}
.related-items .item-box {width:24.25%; margin:0 1% 10px 0;}
.related-items .item-box:nth-child(4n) {margin-right:0;}
.related-items .item-img {height:120px;}

.comments {padding:10px 0;}
.comments-title {margin-bottom:10px;}
.add-com {margin-bottom:10px;}
#addcform {margin:10px 0;}
.comm-rate, .comm-bottom-info {opacity:1;}

}

@media screen and (max-width: 950px) {
.h-line-one {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.h-line-one ul {display:none;}
.top-nav {display:none; background-color:#FFF; padding:10px 20px; float:none; box-shadow:0 0 10px 0 rgba(0,0,0,0.3);
position:absolute; top:100%; left:0; width:100%; z-index:999;}
.top-nav li {display:block; float:none;}
.top-nav a {padding:0; line-height:34px;}
display:block; float:left;}
.show-menu i {margin-right:5px;}

/*.item-img {height:160px;}*/
.top-title {font-size:18px;text-align: center;color: #218bd6;}

.box-cat .item-box {width:100%; margin:0 1% 10px 0;float: left;}
.item-box-album {
    width: 30% !important;
    height: 230px;
    text-align: center;
}
.box-cat .item-box a img {
    max-height: 173px;
    max-width: 230px;
    position: absolute;
    top: 6px;
    left: 6px;
}
.box-cat .short_story {
    height: 130px;
}
.box-cat .items-wrap .item-box:nth-child(4n) {margin:0 1% 10px 0;}
.box-cat .items-wrap .item-box:nth-child(3n) {margin-right:0;}


.f-line-one {padding:20px 10px;}
/*.counters-box, .navigation {display:none !important;}*/
.counters-box{display:none !important;}
.pnext a {border-left:1px solid #cecece;}

.pw-player-section embed, .pw-player-section object, .pw-player-section video, .pw-player-section iframe, .pw-player-section frame {width: 100% !important; height:350px;}
.full-rating {float:left;}

.related-items .item-box {width:32%; margin:0 2% 10px 0;}
.related-items .item-box:nth-child(4n) {margin:0 2% 10px 0;}
.related-items .item-box:nth-child(3n) {margin-right:0;}
.related-items .item-img {height:100px;}

.add-com-but i {margin-left:10px;}
}

@media screen and (max-width: 760px) {
.box-wrap, .h-line-two-inner {max-width:640px;}
.h-line-two-inner {padding:15px 20px 0 100px;}
.logotype {width:100px;}
.h-line-two.fixed .h-line-two-inner {padding:5px 20px 0 100px;}
.h-line-three, .alert-wrap {display:none;}
.box-main {padding-right:0;}
.box-main:before {display:none;}
.main-left {float:none;}
.main-right {float:none; width:100%; margin-right:0; padding:10px; background-color:#fff; border:1px solid #cecece;}
.full-left {float:none;}

.side-nav {margin-right:0;}
.vote-title {margin:0 -10px;}
.top-img {height:160px;}

.box-cat .item-box {width:49%; margin:0 2% 10px 0;}
.box-cat .items-wrap .item-box:nth-child(4n) {margin:0 2% 10px 0;}
.box-cat .items-wrap .item-box:nth-child(3n) {margin:0 2% 10px 0;}
.box-cat .items-wrap .item-box:nth-child(2n) {margin-right:0;}
.box-cat .item-box .item-img {height:160px;}

.login-box {top:0;}
.overlay-close {right:10px; top:10px; font-size:18px !important;}

.comments-tree-list .comments-tree-list {padding-left:0 !important;}
.comm-id, .comm-bottom-info, .mass_comments_action {display:none;}
.comm-author {margin:0; display:block;}
}

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

.item-img {height:140px;}
.box-cat .item-box .item-img {height:140px;}

.bread-crumbs {font-size:12px;}
.top-img {height:140px;}

.pw-player-section embed, .pw-player-section object, .pw-player-section video, .pw-player-section iframe, .pw-player-section frame {width: 100% !important; height:300px;}

.related-items .item-box {width:49%; margin:0 2% 10px 0;}
.related-items .item-box:nth-child(4n) {margin:0 2% 10px 0;}
.related-items .item-box:nth-child(3n) {margin:0 2% 10px 0;}
.related-items .item-box:nth-child(2n) {margin-right:0;}
.related-items .item-img {height:140px;}
}

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


.item-box {width:100%; float:none; margin:0 0 10px 0;}
.main-left .items-wrap #dle-content > .item-box:nth-child(3n), .main-left .items-wrap > .item-box:nth-child(3n),
.full-left .items-wrap #dle-content > .item-box:nth-child(3n), .full-left .items-wrap > .item-box:nth-child(3n) {margin:0 0 10px 0;}
.item-img {height:190px;}

.box-cat .item-box {width:100%; margin:0 0 10px 0;}
.box-cat .items-wrap .item-box:nth-child(4n) {margin:0 0 10px 0;}
.box-cat .items-wrap .item-box:nth-child(3n) {margin:0 0 10px 0;}
.box-cat .item-box .item-img {height:190px;}

.top-img {height:100px;}

.pw-top-section h1, .related-title, .comments-title {font-size:20px;}
.pw-player-section embed, .pw-player-section object, .pw-player-section video, .pw-player-section iframe, .pw-player-section frame {width: 100% !important; height:250px;}

.related-items .item-box {margin:0 2% 10px 0; float:left;}
.related-items .item-box:nth-child(4n) {margin:0 2% 10px 0;}
.related-items .item-box:nth-child(3n) {margin:0 2% 10px 0;}
.related-items .item-box:nth-child(2n) {margin-right:0;}
.related-items .item-img {height:100px;}
#searchtable, #searchtable td {float: left; width: 100%;}
.add-com-but i {display:none;}
}

/* Fix dle html5 player
----------------------------------------------- */
.mejs-video, .me-plugin, .mejs-shim, .mejs-layers, .mejs-overlay {width:100% !important;}
.mejs-video, .mejs-shim {height:400px !important;}
@media screen and (max-width: 470px) {
.mejs-video, .mejs-shim {height:250px !important;}
}
/*------------------------------------*\
    НАВИГАЦИЯ
\*------------------------------------*/
#nav {
    float: left;
    width: 85%;
    list-style: none;
    margin-bottom: 10px;
    margin-top: 10px;
}
#nav li{
    float:left;

    position:relative;
    display:block;
}
#nav > li{
        margin-right: 10px;
        margin-left: 10px;
}
#nav li a {
    display: block;
    padding: 10px;
    color: #1b1a1a;
    text-decoration: none;
    border-radius: 2px;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
}
#nav li a:hover{
    color: #035bbc;
    text-decoration:underline;
}

/*--- ВЫПАДАЮЩИЕ ПУНКТЫ ---*/
#nav ul{
    list-style:none;
    position:absolute;
    left:-9999px; /* Скрываем за экраном, когда не нужно (данный метод лучше, чем display:none;) */
    opacity:0; /* Устанавливаем начальное состояние прозрачности */
    -webkit-transition:0.25s linear opacity; /* В Webkit выпадающие пункты будут проявляться */
}
#nav ul li{
    padding-top:1px; /* Вводим отступ между li чтобы создать иллюзию разделенных пунктов меню */
    float:none;
    background:url(dot.gif);
}
#nav ul a{
    white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
    display:block;
}
#nav li:hover ul{ /* Выводим выпадающий пункт при наведении курсора */
    left:0; /* Приносим его обратно на экран, когда нужно */
    opacity:1; /* Делаем непрозрачным */
}
#nav li ul li ul{
    display: none;
}
#nav li ul li:hover ul {
    left: 100%;
    top: 0;
    margin-left: 1px;
    opacity: 1;
    display: block;
    position: absolute;
}
#nav li:hover a{ /* Устанавливаем стили для верхнего уровня, когда выводится выпадающий список */
    text-decoration:underline;
}
#nav li:hover ul a {
    text-decoration: none;
    -webkit-transition: -webkit-transform 0.075s linear;
    color: #060606;
}
#nav li:hover ul li a:hover{ /* Устанавливаем стили для выпадающих пунктов, когда курсор наводится на конкретный пункт */
    background:#333;
    background:rgba(51,51,51,0.75); /* Будет полупрозрачным */
    text-decoration:underline;
    -moz-transform:scale(1.05);
    -webkit-transform:scale(1.05);
    color: #FFF;
    margin-right: 5px;
    z-index: 1;
    position: relative;
    /*margin-left: 10px;*/
}
#nav li ul li a:hover div:hover{ /* Устанавливаем стили для выпадающих пунктов, когда курсор наводится на конкретный пункт */
    background:#333;
    background:rgba(51,51,51,0.75); /* Будет полупрозрачным */
    text-decoration:underline;
    -moz-transform:scale(1.05);
    -webkit-transform:scale(1.05);
    color: #FFF;
}
#nav li:hover ul li a.within:hover {
    width: 100%;
    margin-left: 6px;
}
#nav ul{
    list-style:none;
    position:absolute;
    left:-9999px; /* Скрываем за экраном, когда не нужно (данный метод, лучше чем display:none;) */
    opacity:0; /* Устанавливаем начальное состояние прозрачности */
    -webkit-transition:0.25s linear opacity; /* В Webkit выпадающие пункты будут проявляться */
}
#nav ul li{
    padding-top:1px; /* Вводим отступ между li чтобы создать иллюзию разделенных пунктов меню */
    float:none;
    background:url(dot.gif);
}
#nav ul a{
    white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
    display:block;
}
#nav li:hover ul{ /* Выводим выпадающий пункт при наведении курсора */
    left:0; /* Приносим его обратно на экран, когда нужно */
    opacity:1; /* Делаем непрозрачным */
    margin-left: 0px;
}
#nav li:hover a {
    background: #656b0c;
    background: rgba(255, 255, 255, 0.85);
    text-decoration: underline;
}
#nav li:hover ul a{ /* Изменяем некоторые стили верхнего уровня при выводе выпадающего пункта */
    text-decoration:none;
    -webkit-transition:-webkit-transform 0.075s linear;
}

/*Header City*/
.WrapperLogoTop {
    display: flex;
    justify-content: center;
    align-items: center;
}
.WrapperLogoTop .logoTopUa {    
    width: auto;
    height: 88px;
    padding: 2px 0px 0px 21px;
}
.WrapperLogoTop .logoTop {
    background: url(../images/gerb.png) no-repeat;
    width: 81px;
    height: 84px;
    background-size: contain;
    margin-top: 1px;
    margin-left: 13px;
}
.WrapperLogoTop .NameCity p{
    margin: 0;
    font-size: 29px;
    font-family: "Arial";
    line-height: 1.1;
    font-weight: 900;
    text-transform: uppercase;
}
.WrapperLogoTop .NameCity p.NameCityTop{
    color: rgb(255 255 255);
    margin-bottom: 10px;
}
.WrapperLogoTop .NameCity p.NameCityBottom {
    color: #fff;
    font-size: 9px;
}
.TopHeaderMenuRight ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px;
    line-height: normal;
    list-style: none;
}
.TopHeaderMenuRight{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
}
/*вебкамери*/
.webcam {
    display: flex;
    justify-content: center;
}
a.MapPr:hover,
a.mimail:hover,
a.facebook:hover,
a.tyrMap:hover,
a.instagram:hover,
a.cardVozn:hover,
.webcam:hover{
    color: #fff;
}
.webcam::before {
    content: "";
    background: url(../images/Webcamera.png) no-repeat;
    background-size: contain;
    position: relative;
    width: 32px;
    height: 32px;
    margin: 8px 0px 0px 10px;
}
.webcam.second:before {
    margin-left: -10px;
}
a.MapPr:hover,
a.mimail,
a.facebook,
a.tyrMap,
a.instagram,
a.cardVozn,
.webcam{
    color: #fcff5c;
}

.cardVozn {
    margin-left: 10;
}



/*карта проблем*/
a.MapPr {
    padding-right: 50px;
}
a.MapPr:before {
    content: "";
    background: url(../images/mapp.png) no-repeat;
    background-size: contain;
    position: absolute;
    width: 35px;
    height: 35px;
    margin: -2px 20px 0px -27px;
}
/*написать нам*/
a.mimail {
    padding-right: 50px;
}
a.mimail:before {
    content: "";
    background: url(../images/mail.png) no-repeat;
    background-size: contain;
    position: absolute;
    width: 35px;
    height: 35px;
    margin: -2px 20px 0px -27px;
}
/*facebook*/
a.facebook{
    padding-right: 20px;
}
a.facebook:before {
    content: "";
    background: url(../images/facebook.png) no-repeat;
    background-size: contain;
    position: absolute;
    width: 42px;
    height: 42px;
    margin: -4px 20px 0px -34px;
}
/*Туристична карта*/
a.tyrMap{
    padding-left: 20px;
}
a.tyrMap:before {
    content: "";
    background: url(../images/bike-icon.png) no-repeat;
    background-size: contain;
    position: absolute;
    width: 34px;
    height: 34px;
    margin: -2px 20px 0px -27px;
}

/*Инстаграм*/
a.instagram{
    padding-right: 35px;
}
a.instagram:before {
    content: "";
    background: url(../images/Instagram-icon.png) no-repeat;
    background-size: contain;
    position: absolute;
    width: 34px;
    height: 34px;
    margin: -2px 20px 0px -36px;
}

/*Картка вознесенця*/
a.cardVozn{
    padding-right: 35px;
}
a.cardVozn:before {
    content: "";
    background: url(../images/cardvozn.jpg) no-repeat;
    background-size: contain;
    position: absolute;
    width: 31px;
    height: 31px;
    margin: 6px 20px 0px -24px;
}
/*Лого сайта + слайдер*/
#logoSlider {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
}
.container-fluid {
    padding-right: 0px !important;
    padding-left: 0px !important;
    max-width: 1400px;
    margin: auto;
}
.carousel {
    margin-bottom: 0px !important;
}
/*footer*/
.footleft,
.footcenter,
.footright,
.fotterNoNeme{
    display: flex;
    flex-direction: column;
    max-width: 25%;
}
.footleft a,
.footcenter a,
.footright a,
.fotterNoNeme a{
    display: block;
    margin: 5px;
    font-size: 13px;
}
.footer h2 {
    margin-bottom: 10px;
    font-size: 18px;
    text-decoration: underline;
    text-transform: uppercase;
}

/*переход на главную*/
.h-line-one span a {
    font-size: 14px;
    text-decoration: underline;
}
.WrapperLogoTop .NameCity p.Kondratincov {
    font-size: 13px;
    font-weight: 600;
    color: white;
    margin-top: 7px;
}
/*Фотоальбомы*/
div#catsAlbum {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
div#catsAlbum .item-box {
    width: 30%;
}
div#catsAlbum .item-title{
    margin-left: 0;
    height:20px;
    overflow:hidden;
}
div#catsAlbum .item-box a {
    text-decoration: none;
    margin-bottom: 3px;
    text-align: center;
}
div#catsAlbum .short_story {
    padding-left: 0;
}

div#catsAlbum .short_story span {
    display:none;
}
div#catsAlbum .item-box a img {
    max-height: 173px;
    max-width: 100%;
    position: initial;
    top: 28px;
    left: 6px;
}
div#catsAlbum .ItemViews{
    width: 100%;
    margin: 0;
}
/*Карта Гугл*/
#ImgTumb {
    display: flex;
    flex-direction: row;
    /*flex-wrap: wrap;*/
    max-width: 640px;
    max-height: 200px;
}
#ImgTumb img {

    max-width: 49%;
    padding: 5px;
}
.popUp {
    display: none;
}
.vokzalLink:hover > .popUp,
.kaminLubviLink:hover > .popUp,
.mishkaYaponchikLink:hover > .popUp,
.palackLink:hover > .popUp,
.sklepLink:hover > .popUp,
.rotondaLink:hover > .popUp,
.vodograiLink:hover > .popUp,
.myzeiLink:hover > .popUp,
.parkLink:hover > .popUp,
.motobolkLink:hover > .popUp,
.motokrosLink:hover > .popUp {
    display: block;
}
.vokzal,
.kaminLubvi,
.mishkaYaponchik,
.palack,
.sklep,
.rotonda,
.vodograi,
.myzei,
.park,
.motobolk,
.motokros {
    position: absolute;
    background-color: #fff;
    border: 1px solid #000;
    padding: 5px;
    max-width: 400px;
    right: 0;
    top: 60%;
}
#bodyContent a{
    color: #ff5757;
}
/*анонсы на сайте*/
div#anonscontent .short_story {display: none;}
div#anonscontent .item-box {margin-bottom: 5px;}
div#anonscontent span.ItemViews{display: none;}
div#anonscontent .item-desc{display: inline-block;line-height: normal;}
div#anonscontent .item-title{font-size: 15px; color: #5c5c5c;display: inline;}
div#anonscontent .item-title-anonse{font-size: 15px; color: #5c5c5c;display: inline;}
div#anonscontent .item-title {display: none;}
.item-title-anonse {display: none;}
span#anonseDate {display: none;}
div#anonscontent span#anonseDate {display: inline;font-size: 15px;}
/*категории по годам*/
.item-box-year {
    display: inline-flex;
    flex-wrap: wrap;
    width: 200px;
    height: 200px;
    border: solid 1px #a0a0a0;
    margin: 25px;
    border-radius: 10px;
}
.item-box-year a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}
.item-box-wraperyear .item-title{
    font-size: 40px;
    text-overflow: ellipsis;
    color: #4e4e4e;
    font-family: sans-serif;
    font-style: oblique;
    margin-left: 0;
}
/*Фотогалерея*/
.box-cat .item-box.item-box-fotogalereya {
    width: 30%;
    height: 230px;
    margin: 20px 20px 10px 20px;
    float: left;
}
.item-title_fotogalereya {
    font-size: 20px;
    text-overflow: ellipsis;
    color: #0088cc;
    text-align: center;
}
.box-cat .item-box.item-box-fotogalereya a img {
    max-height: 173px;
    max-width: 250px;
    position: absolute;
    top: 55px;
    left: 80px;
}

/*баннеры в левом блоке*/
   .banner_link {
        width: 100%;
    }
     .left_banner {
        width: 100%;
         margin-top: 20px;
    }
/*МедиаЗапросы для адаптивности*/
@media (max-width: 1323px) {
#nav {
    width: 89%;
}
@media (max-width: 1264px) {
#nav > li {
    margin-right: 10px;
    margin-left: 10px;
}
@media (max-width: 1220px) {
.h-line-two-inner {
    padding: 0px;
}
.item-desc {
    position: absolute;
    top: 0;
}
.item-box a img {
    position: relative;
    top: 0;
    left: 0;
}
.short_story{
    padding-left: 0px;
    max-height: 325px;
    height: 100%;
}
.side-box .item-box {
    width: 100%;
}
.side-box .item-box a img{
    max-width: 100%;
}
.box-cat .short_story {
    padding-left: 240px;
}
.box-cat .item-box {
    height: 250px;
}
div#anonscontent .item-box{
    max-height: 60px;
}
}
@media (max-width: 1085px) {
.h-line-two-inner nav ul{
    margin: 0;
}
#nav > li {
    margin-right: 3px;
    margin-left: 3px;
}
}
@media screen and (max-width: 960px){
.show-menu {
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    cursor: pointer;
    width: 40px;
    text-align: center;
    display: block;
    float: left;
}

.h-line-two-inner nav {
    display: none;
}
#nav {
    width: 85%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    background: #01375a;
    position: absolute;
    left: 50px;
    right: 0px;
    top: 40px;
}
#nav li:focus a  {
    position: relative;
    z-index: 2;
}
#nav li:hover ul{
    position: relative;
    left: 20px;
}
#nav li ul li:hover ul {
    position: relative;
    left: 0;
}
}
@media screen and (max-width: 820px){
.item-box {
    width: 100%;
    float: inherit;
    margin: 0 1.2% 10px 0;
    height: 380px;
}
.box-main {
    padding-right: 0;
    flex-direction: column;
}
.WrapperLogoTop .logoTop {
    margin-left: 0px;
}
.main-left {
    width: 97%;
}
.main-right {
    float: inherit;
    width: 95%;
    margin-right: 0;
    margin-bottom: 10px;
}
#anons {
    max-width: 100%;
}
#anonscontent {
    display: flex;
    justify-content: center;
    flex-direction: column;
}
#anonscontent .item-info {
    display: none;
}
#anonscontent .item-box {
    height: 173px;
}
#catsAlbum .short_story {
    height: 140px;
    overflow: hidden;
}
#catsAlbum .item-box {
    height: 195px;
}


.footer .footleft, .footer .footcenter, .footer .footright, .footer .fotterNoNeme {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    padding-left: 10px;
    margin-bottom: 25px;
}
.footer .f-line-one {
    flex-wrap: wrap;
    justify-content: end;
}




div#blox .bloxTop, div#blox .bloxBottom {
    flex-direction: column;
}
div#blox p {
    max-width: 100%;
    padding-bottom: 15px;
}
}
@media screen and (max-width: 700px){
.TopHeaderMenu {
    height: 100%;
    flex-wrap: wrap;
    padding-right: 0;
    justify-content: center;
}
.TopHeaderMenuRight {
    justify-content: space-around;
    flex-direction: row;
    width: 100%;
    margin-bottom: 10px;
}
.box-cat .item-box {
    height: 400px;
}
.box-cat .short_story {
    padding-left: 0;
    display: flex;
    flex-direction: column;
    height: 400px;
}
.box-cat .item-box a img {
    position: relative;
    top: 0;
    left: 0;
}
}
@media screen and (max-width: 600px){
.WrapperLogoTop .NameCity p {
    font-size: 27px;
}
.WrapperLogoTop .NameCity p.NameCityBottom {
    font-size: 18px;
}
.WrapperLogoTop .logoTop {
    width: 90px;
    height: 98px;
}
#nav li a {
    display: block;
    padding: 10px;
    color: #ffffff;
    text-decoration: none;
    border-radius: 2px;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
}
}