* {
   margin: 0;
   padding: 0
}

body {
   font-family: "Arial", sans-serif;
   font-size: 17px;
   background: url(../img/background.jpg) #111;
   background-size: 100%;
   background-repeat: no-repeat
}

h1 {
   margin: 10px 0;
   font-size: 35px;
   line-height: 35px;
   font-weight: 400;
   color: #000
}

p {
   text-align: justify;
   margin: 0 0 7px;
   width: 100%;
   line-height: 20px
}

img {
   max-width: 100%
}

main {
   margin: 0 0 0 20px;
   width: 65%;
   float: left;
   padding: 10px 10px 0
}
main ul li {
   padding: 0 0px 0 0
}
.container {
   max-width: 1050px;
   margin: 0 auto;
   background-color: #fff
}

.sidebar {
   float: right;
   width: 28%;
   padding-top: 20px
}

footer {
   position: relative;
   background: #34373c;
   bottom: -1px;
   clear: both
}

footer center {
   color: #fff;
   padding: 10px 0
}

nav {
   background-color: #34373c;
   text-align: center;
}
nav .wrap {
   max-width:1050px;
   width: 100%;
   margin: 0 auto;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: justify;
       -ms-flex-pack: justify;
           justify-content: space-between;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
}
nav ul li a {
   color: #fff;
   text-decoration: none
}

ul li {
   padding: 15px
}

nav ul li:hover {
   background-color: #222
}

nav ul li:nth-child(4) {
   background-color: #222
}

header {
   background: inherit
}

.header_img {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   position: relative
}

.header_title {
   color: #fff;
   font-family: Times New Roman, Arial;
   font-size: 40px;
   text-shadow: 5px 1px 2px #000;
   max-width: 300px;
   padding: 0 15px;
   position: absolute;
   top: 50%;
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%)
}

.header_img1 {
   padding-left: 350px
}

.favicons {
   display: inline-block;
   float: right;
   color: #3b5997;
   z-index: 1;
   padding-top: 5px
}

.favicons:hover {
   cursor: pointer
}

.line {
   border-top: 3px double #8b9cb7;
   border-bottom: 3px double #8b9cb7;
   padding: 10px 0;
   margin: 10px 0;
   text-align: center;
   font-style: italic
}

.border_post {
   border: 3px double #8b9cb7;
   padding: 7px;
   margin-bottom: 10px;
   font-style: italic;
   font-weight: 700
}

.line_2 {
   border-bottom: 3px double #8b9cb7
}

.img_post {
   background-color: #34373c;
   height: 45px
}

.img_post img {
   float: right;
   width: 30px;
   padding: 8px
}

.img_post img:hover {
   cursor: pointer
}

.comments-container .btn {
   color: #fff;
   display: inline-block
}

.sidebar_img {
   max-width: 70%;
   padding-bottom: 20px;
   padding-top: 20px
}

.btn {
   text-align: center;
   padding: 14px 20px;
   -webkit-box-shadow: #8c8c8c 0 0 18px;
           box-shadow: #8c8c8c 0 0 18px;
   color: #fff;
   text-transform: uppercase;
   text-decoration: none;
   font-weight: 700;
   font-size: 18px;
   background: #3c4e6d
}

.header_img {
   max-width: 1050px;
   margin: 0 auto
}

.header_img img:hover {
   cursor: pointer
}

.btn:hover {
   background-color: #12326b
}

.btn:active {
   background-color: #12326b
}

.img_post1 {
   float: left;
   margin-right: 10px;
   max-width: 42%;
   -webkit-box-sizing: border-box;
           box-sizing: border-box
}

li {
   color: #6b0a23;
   font-size: 14px;
   display: inline-block;
   padding-right: 10px
}

li a {
   color: #6b0a23
}

li:hover {
   cursor: pointer
}

.totko {
   background-color: #fff;
   padding: 2px;
   margin: 0 0 7px;
   -webkit-box-sizing: border-box;
           box-sizing: border-box
}

a {
   text-decoration: underline
}

.comments-container {
   margin: 60px auto 15px;
   width: 100%
}

.comments-container h1 {
   font-size: 36px;
   color: #283035;
   font-weight: 400
}

.comments-container h1 a {
   font-size: 18px;
   font-weight: 700;
   color: inherit;
   text-decoration: none;
}

.comments-container a {
   color: #03658c
}

.comments-list {
   margin-top: 30px;
   position: relative;
   margin-right: 15px
}

.comments-list:before {
   content: '';
   width: 2px;
   height: 99%;
   background: #c7cacb;
   position: absolute;
   left: 45px;
   top: 16px
}

.comments-list:after {
   content: '';
   position: absolute;
   background: #c7cacb;
   bottom: 0;
   left: 40px;
   width: 7px;
   height: 7px;
   border: 3px solid #dee1e3;
   border-radius: 50%
}

.reply-list:before,
.reply-list:after {
   display: none
}

.reply-list li:before {
   content: '';
   width: 60px;
   height: 2px;
   background: #c7cacb;
   position: absolute;
   top: 25px;
   left: -55px
}

.comments-list li {
   margin-bottom: 15px;
   display: block;
   position: relative
}

.comments-list li:after {
   content: '';
   display: block;
   clear: both;
   height: 0;
   width: 0
}

.reply-list {
   padding-left: 88px;
   clear: both;
   margin-top: 15px
}

.comments-list .comment-avatar {
   width: 65px;
   height: 65px;
   position: relative;
   z-index: 99;
   float: left;
   border: 3px solid #FFF;
   border-radius: 4px;
   -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
   box-shadow: 0 0 4px rgba(0, 0, 0, 0.59);
   overflow: hidden
}

.comments-list .comment-avatar img {
   width: 100%;
   height: 100%
}

.reply-list .comment-avatar {
   width: 50px;
   height: 50px
}

.comment-main-level:after {
   content: '';
   width: 0;
   height: 0;
   display: block;
   clear: both
}

.comments-list .comment-box {
   width: 80%;
   float: right;
   position: relative;
   -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.45)
}

.comments-list .comment-box:before,
.comments-list .comment-box:after {
   content: '';
   height: 0;
   width: 0;
   position: absolute;
   display: block;
   border-width: 10px 12px 10px 0;
   border-style: solid;
   border-color: transparent #f3f3f3;
   top: 8px;
   left: -11px
}

.comments-list .comment-box:before {
   border-width: 11px 13px 11px 0;
   border-color: transparent rgba(0, 0, 0, 0.05);
   left: -12px
}

.reply-list .comment-box {
   width: 80%
}

.comment-box .comment-head {
   background: #f3f3f3;
   padding: 10px 12px;
   border-bottom: 1px solid #E5E5E5;
   overflow: hidden;
   border-radius: 4px 4px 0 0
}

.comment-box .comment-head i {
   float: right;
   margin-left: 14px;
   position: relative;
   top: 2px;
   color: #A6A6A6;
   cursor: pointer;
   -webkit-transition: color .3s ease;
   transition: color .3s ease
}

.comment-box .comment-head i:hover {
   color: #03658c
}

.comment-box .comment-head i:active {
   color: #03658c
}

.comment-box .comment-head i:focus {
   color: #03658c
}

.comment-box .comment-name {
   color: #03658c;
   font-size: 14px;
   font-weight: 700;
   float: left;
   margin-right: 10px
}

.comment-box .comment-name a {
   color: #03658c;
   text-decoration: none;
}

.comment-box .comment-head span {
   float: left;
   color: #999;
   font-size: 13px;
   position: relative;
   top: 1px
}

.comment-box .comment-content {
   background: #FFF;
   padding: 12px;
   font-size: 15px;
   color: #595959;
   border-radius: 0 0 4px 4px
}

.comment-box .comment-name.by-author,
.comment-box .comment-name.by-author a {
   color: #03658c
}

.comment-box .comment-name.by-author:after {
   content: 'autorul';
   background: #03658c;
   color: #FFF;
   font-size: 12px;
   padding: 3px 5px;
   font-weight: 700;
   margin-left: 10px;
   border-radius: 3px
}

.comment-add {
   margin: 30px 0
}

.comment-add img {
   display: inline-block;
   vertical-align: top;
   float: left;
   margin-bottom: 10px;
   margin-right: 10px
}

.comment-add input {
   float: left;
   margin: 10px 10px 5px;
   outline: none;
   background: #efefef;
   border: 0;
   padding: 10px
}

.comment-add textarea {
   float: left;
   font-family: Arial;
   width: 90%;
   margin: 5px 10px;
   outline: none;
   background: #efefef;
   border: 0;
   padding: 10px
}

.comment-add a {
   background: 0 0 !important;
   color: #7f929c !important;
   color: #000 !important;
   font-weight: 700;
   margin: 0;
   display: inline-block;
   font-size: 16px
}

.comment-add a span {
   margin-left: 10px !important
}

.comment-add button {
   color: #fff !important;
   margin-left: 10px !important;
   background: #D3775D;
   border: 0;
   width: 100px;
   margin-top: 10px;
   cursor: pointer;
   font-size: 14px;
   margin-bottom: 10px;
   text-align: center
}

.comment-add button:hover {
   background: #C15322
}

.comment-add button a {
   font-weight: 100;
   display: inline-block;
   color: #fff !important;
   vertical-align: top;
   line-height: 8px;
   padding: 13px 0
}

.clearfix:after {
   content: '';
   display: table;
   clear: both
}

.post {
   padding: 15px 40px 15px 0;
   border-bottom: 2px solid #ECF3F7
}

.post h4 {
   color: #0075A6
}

.post a {
   text-decoration: none
}

.post a:hover {
   text-decoration: underline
}

.post p {
   font-size: 12px;
   padding-top: 30px;
   line-height: 1
}

.post__button {
   color: #fff;
   display: inline-block;
   background: #E30715;
   border-radius: 5px;
   padding: 5px 10px;
   text-decoration: none;
   font-size: 12px;
   -webkit-box-shadow: 1px 1px 2px #ccc;
           box-shadow: 1px 1px 2px #ccc;
   font-weight: 700;
   padding-top: 5px
}

.post__button:hover {
   text-decoration: underline
}

#aside1 {
   height: 200px;
   padding: 6px;
   margin: 0 5px
}

.sticky {
   position: fixed;
   top: 10px;
   z-index: 101
}

@media all and (min-width: 710px) {
   .img_post {
      display: none
   }
}

@media all and (max-width: 960px) {
   ul li {
      padding: 10px 7px
   }

   .favicons {
      padding-top: 0
   }

   main {
      margin-left: 0;
      width: 67%
   }
}

@media all and (max-width: 710px) {
   .favicons {
      float: left;
      padding-top: 5px
   }

   .header_img,
   .sidebar,
   nav {
      display: none
   }

   main {
      width: 100%;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      margin: 0;
      padding: 5px 10px
   }

   .header-mini {
      display: block
   }

   .header_img {
      display: none
   }
}

@media all and (max-width: 460px) {
   .comments-list .comment-box {
      width: 70%
   }

   .reply-list .comment-box {
      width: 70%
   }

   .reply-list {
      padding-left: 40px
   }

   .reply-list li:before {
      left: -8px
   }
}

@media all and (max-width: 520px) {
   .img_post1 {
      max-width: 100%;
      float: none
   }
}

.comment__img {
   margin-top: 15px;
}