/* Phones */
@media only screen
/* and (max-width: 500px) */
  and (max-device-width: 1024px) 
  and (min-device-width: 320px) 
  and (-webkit-min-device-pixel-ratio: 1)  {

  #wrapper { width: auto; /*background: #f4f4f4;*/ }

  .sideLeft { display: none; }
  .content-wrapper { /*float: none;*/ /*width: auto;*/ width: 100%; }
  .content { margin: 10px 0 0px 0px; }


  #header { height: 48px; float: right; }
  #footer { }

  #header > ul { margin: 72px 0px 0 0; width: 100%; background: #fff; /*transition: margin 800ms;*/ }
/*  #header > ul.animate { margin-top: 52px; } */


  #header { width: 100%; height: 71px; background: url(../pic/news-kroleg-logo.png) 0px 0px no-repeat, linear-gradient(to right, #70aadc 30%, #5895d1 100%); background-size: contain; position: relative; }
  #news-kroleg-sprite { display: none; }

  #header > ul li,
  #header > div { display: none; }

  #header > ul li { margin: 0; }
 
  #header > ul ul.show li { display: block; font-size: 1.3rem; color: #000; box-shadow: rgb(222 78 78) 0px 2px 0px -1px; padding: 7px 10px; margin: 0 19px; }
  #header > ul ul.show li:last-child { box-shadow: none; }

  #header > ul ul.show { width: 100%; }
  #header > ul li.label-search { display: inline-block; font: normal 0.7rem 'PT Sans Narrow'; width: 84px; margin: 0 0px 0 90px; position: absolute; right: 39px; bottom: 24px; }
  #header > ul li.options { display: inline-block; position: absolute; right: 6px; top: 4px; }
  #header > ul > li:first-child.show { display: inline-block; width: 100%; cursor: default; }

  #header > ul li ul li:before { display: none; }
  
  #header a,
  #header a:visited  { color: #000; }
  
  #header ul.show.auth { display: none; }

  .fa-times { margin: 0 0 0 2px; }

 .top_menu { margin: 0px 0 0 0; height: 35px; }
 .top_menu li:first-child { margin-left: 0px; }
 .top_menu li { font: normal .85rem/1.5rem 'PT Sans Narrow'; color: #000; padding: 10px 2px; }
 #posts-wrapper ul:first-child li:after { bottom: 9px; right: -1px; font-size: .65rem; }
 .top_menu { font: normal 0.6rem/2.5rem 'PT Sans Narrow'; color: #000; }
 .frameborder { border: none; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #d8d8d8; }

/* .content { font-size: 1.25rem; line-height: 1.4rem; width: 100%; } */

/* ------------ fonts ----------------- */

/* .content { font: normal 300 17px/19px 'Roboto Condensed', sans-serif; width: 100%; } */
 .content { font: 16px/25px 'Roboto', sans-serif; width: 100%; }
/* #comment-wrapper .comment { font: normal 300 16px/17px 'Roboto Condensed', sans-serif; } */

 #comment-wrapper .comment.child_0 i.idate,
 #comment-wrapper i.idate { font: normal 12px 'Roboto' !important; margin-top: 2px; margin-bottom: 3px; }


 .content > div { margin: 15px 15px 2px 15px; } 

 .content .video-wrapper.max-width,
 .content a.url-photo { width: calc(100% + 30px) !important; margin-left: -15px !important; border-radius: 0; display: inline-block; }

 .content h2 { margin: 20px 0 8px 0; }
 .content h2 a { font-weight: 500; font-size: 18px; line-height: 18px; letter-spacing: 0px; }

 .post-stats { height: 21px; margin: 0 0 8px 0; }
 .post-stats.mobile { display: inline-flex !important; }

 .post-stats.mobile .post-stats-author span ,
 .post-stats.mobile .post-stats-author a:first-child { display: inline-block; margin-right: 5px; font: normal 500 15px 'Roboto', sans-serif; }

 .post-stats.mobile .post-stats-author { text-align: left; margin-top: 0;  /*width: 71%; */}
/* .post-stats.mobile .post-stats-author .post-author { margin: 0 10px 0 0; } */
 .post-stats.mobile .post-stats-author i { font-size: 0.85rem; line-height: 1.6rem; margin: 0 5px 0 1px; }
 .post-stats.mobile .post-stats-author i:nth-child(2) { line-height: 1.3rem; font-size: 0.5rem; color: #444 !important; }
 .post-stats.mobile .post-stats-author .post-time { margin: 3px 0px 0 0; font: normal 500 12px 'Roboto'; }
 .post-stats.mobile .post-stats-views { width: 20%; height: 8px; margin: -6px 0 0px 6px; }
 .post-stats.mobile .post-stats-views .fa-eye { padding: 0px 6px 0 0px; font-size: 0.6em; /*line-height: 1.5rem;*/ }

 .post-stats.mobile .post-stats-author i:first-child { display: inline-block; }

 .post-stats.mobile li { float: left; width: auto; }

 .post-stats-views.mobile {  }

 .bottom-line-red { box-shadow: none; }
 .post-category.bottom-line-red span:first-child { display: none; }

 .desktop { display: none; }

 .post-stats-views.mobile { display: inline-block !important; float: right; padding: 4px 0 9px 0; }
 .post-stats-views.mobile .fa-comments { padding: 0px 0 0 0; color: #858585; }
 .post-stats-views.mobile .post-stats-comments-count { padding: 0; margin: 1px 0 0 9px; }
 .post-stats-view-count { display: inline-block; margin: -3px 0 0px 0; font: normal 600 12px 'Roboto';  }

 .sideLeft.show { display: block;  position: relative;  margin: 161px 0 0 0; width: 100%; }
 .sideLeft.show.auth { margin-top: 0; }

/* .sideLeft.show > div:first-child > div:first-child, */
 .sideLeft.show > div:nth-child(3),
 .sideLeft.show > div:nth-child(4),
 .sideLeft.show > div:nth-child(5) { display: none; } 

 .sideLeft.show > div:first-child { display: block;}
 .social-ck > li {  margin: 0 10px !important; }

/* .sideLeft > .bar:first-child { min-height: 303px; } */

 #rules { text-align: center; background: #f8fdff; padding: 1px 0 7px 0; }
 #rules a { display: block; font: normal 1.65rem 'Source Sans Pro'; color: #000; font-weight: 300; margin: 16px 0; }
 .flat-button { font-size: 1.4rem; }

 #add-post .flat-button,
 #add-comment .flat-button { font-size: 0.8rem; }

 .comments .button-dot { padding: 7px 14px 8px 14px; }

 .reset-draft i { font-size: 1.0rem; }

 #content-footer { background-position: 45% 0px; }
 .ajax-loader { left: 45%; }

 .post-category { margin: 0px 0 0 0;}
 .post-category .tags a { margin: 0 6px 0 6px; }
 .post-category .tags a:nth-child(1) { margin-left: 1px; }
 .post-category span:nth-child(2) { margin: 0 }

 .sideLeft input[type="text"],
 .sideLeft input[type="password"] { font: normal 1.2rem 'Source Sans Pro'; /*width: 94%; */}

 .inline { margin: 6px 8px 6px 0; }
 ul.add button { padding: 8px 12px; }

 .post-stats-views a, .post-stats-comments a {  float: right; color: #858585; }
 .post-category span { margin: 0; }

 ul.agallery img { margin: -25px 0 0px 0px !important; }

 .related-posts:before {  margin: 45px 67% -12px 4px; }
 .related-posts:after { margin: -10px 1px 26px 67%; }

 :root { --social-ck-width: 18px; }

 #add-post li button,
 #add-post li label { font-size: 12px !important; text-transform: lowercase; }

 #add-post ul.add button,
 #add-post .button-group button
 #add-post .flat-button.inline { padding: 8px 5px; }
 #add-post button.inline { margin: 6px 2px 6px 0; }

 #header #input-search,
 #header #input-search:focus { width: 100px; }

 .comment a.avatar,
 .comment i.avatar { margin: -3px 10px 0 0; }

 #comment-wrapper > div div.text { margin: -8px 0 4px 46px; font: 15px/20px 'Roboto', sans-serif; }


 #comment-wrapper .comment.child_0 .text { margin-top: -14px; }

 #comment-wrapper .comment.child_1 .text,
 #comment-wrapper .comment.child_2 .text,
 #comment-wrapper .comment.child_3 .text,
 #comment-wrapper .comment.child_4 .text,
 #comment-wrapper .comment.child_5 .text,
 #comment-wrapper .comment.child_6 .text,
 #comment-wrapper .comment.child_7 .text,
 #comment-wrapper .comment.child_8 .text,
 #comment-wrapper .comment.child_9 .text,
 #comment-wrapper .comment.child_10 .text { margin-top: -7px; }

 #comment-wrapper .comment.child_0 .author { margin-top: -2px; }

 #comment-wrapper .comment.child_1 .author,
 #comment-wrapper .comment.child_2 .author,
 #comment-wrapper .comment.child_3 .author,
 #comment-wrapper .comment.child_4 .author,
 #comment-wrapper .comment.child_5 .author,
 #comment-wrapper .comment.child_6 .author,
 #comment-wrapper .comment.child_7 .author,
 #comment-wrapper .comment.child_8 .author,
 #comment-wrapper .comment.child_9 .author,
 #comment-wrapper .comment.child_10 .author { margin-top: -1px; }


 .content.frameborder br { content: ''; }

 #comment-wrapper a { font: normal 500 15px 'Roboto', sans-serif; }

 .comment blockquote:after,
 .answer blockquote:after { top: 8px; right: 4px; font-weight: normal; }

 #comment-edit.answer,
 .comment .answer { font: normal 14px 'Roboto', sans-serif; }

 ul.agallery { margin: 14px 5px 0 0; }


 #comment-wrapper .comment.child_0 #comment-edit { margin-left: 45px !important;  }
 #comment-edit { margin-top: 8px; margin-left: 38px !important; }
 .button-group { margin-left: 43px; }

 .comment button.quote,
 .comment button.replay,
 .comment button.edit,
 .comment button.delete,
 .comment button.expander { margin-left: -3px; margin-top: -2px; }


 .comment button.quote[data-type="quote"],
 .comment button.delete[data-type="delete"],
 .comment button.edit[data-type="edit"],
 .comment button.expander[data-type="expander"] { margin-left: -3px; margin-top: -2px; }

 .comment button.replay { margin-left: 2px; }

 label.for-post-anon { display: none !important; }
/* #posts-wrapper ul:first-child li:after { right: -1px; } */


/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

  .top_menu li { padding: 10px 1px; }
  .post-stats.mobile .post-stats-author { /*width: 75%;*/ }
  .post-stats.mobile .post-stats-author span.post-author { font-size: 0.9rem;  }
  .post-stats.mobile .post-stats-author span.post-time { line-height: 1.3rem; font-size: 0.7rem; }

  .post-category.bottom-line-red span { font-size: 0.7rem; line-height: 1.7rem; }
 
 .post-stats-views,
 .post-stats-comments { width: 17%; }

/*  .fas, .far { font-size: 1.0rem; } */

  .post-stats.mobile .post-stats-views .fa-eye { padding: 0px 7px 0 1px; font-size: 0.5em; /*line-height: 1.3rem;*/ }

  .post-stats-view-count { font-size: 0.7rem; line-height: 1.3rem; }

  .post-stats-views.mobile .post-stats-comments-count { font-size: 0.8rem; color: #858585; }

  .inline { margin: 6px 4px 6px 0; }
   ul.add button { padding: 8px 10px; }

}


/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

  .top_menu li { padding: 10px 2px; }
  .post-category.bottom-line-red span { font-size: 0.7rem; line-height: 1.7rem; }
  .inline { margin: 6px 8px 6px 0; }
  .post-stats.mobile .post-stats-views { margin: 0px 0 -1px 0; }
}


/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

  .top_menu li { padding: 12px 4px; }
  .post-category.bottom-line-red span { font-size: 0.7rem; line-height: 1.7rem; }
/*  .post-stats.mobile .post-stats-author i { line-height: 1.6rem;} */
  .post-stats.mobile .post-stats-author span.post-time,
  .post-stats.mobile .post-stats-author span.post-author   { /*line-height: 1.4rem;*/ font-size: .7rem; }
  .post-stats.mobile .post-stats-views .fa-eye { padding: 1px 7px 0 1px;  font-size: 0.5em; /*line-height: 1.4rem;*/ }
  .post-stats.mobile .post-stats-views { margin: 0px 0 2px 0; }

}



/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

 #header { height: 105px; }
 #header > ul { margin-top: 112px;  }
 #header > ul li.options {  margin: 28px 10px 0 7px; }
 #header > ul li.label-search { font: normal 1.0rem 'PT Sans Narrow'; width: 80px; margin: 0 0px 0 90px; right: 56px; bottom: 38px; }

 .top_menu { font: normal 0.9rem/2.8rem 'PT Sans Narrow'; color: #000; margin: 7px 0 0 0; }
 .top_menu li { font: normal 1.4rem/1.4rem 'PT Sans Narrow'; padding: 10px 9px; color: #777; }

 .content { font-size: 1.8rem; line-height: 2.4rem; }
 .content > div { margin: 35px 15px 6px 15px; }
 .content h2 a {  font-size: 2.2rem; }

 .post-stats.mobile .post-stats-author span.post-author,
 .post-stats.mobile .post-stats-author span.post-time { font-size: 1.5rem; }

 .post-stats.mobile .post-stats-author span.post-time { line-height: 2.3rem; }

 .post-stats.mobile .post-stats-author i { font-size: 1rem; line-height: 2.2rem; margin: 0 11px; }

 .post-stats.mobile .post-stats-author {  margin-top: 0; }
 .post-stats.mobile .post-stats-author a { line-height: inherit; }

 .post-stats.mobile .post-stats-views { margin: 0px 0px -6px 0px; }
 .post-stats.mobile .post-stats-views .fa-eye { padding: 2px 7px 0 1px; font-size: 0.85em; line-height: 1.7rem; }
 .post-stats-view-count { font-size: 1.3rem; line-height: 2.2rem; }

 .post-category { margin: 10px 0; font: normal 0.8rem/2.3rem 'PT Sans Narrow'; }
 .post-category span { font: normal 1.5rem 'PT Sans Narrow';  padding: 5px 0; }
 .bottom-line-red { box-shadow: rgb(222 78 78) 0px 3px 0px -1px; }
 .post-category {  margin: 10px 0;  font: normal 1rem/2.8rem 'PT Sans Narrow'; }

 #options .fas.fa-bars { font-size: 1.8rem; }
 #options .fa-times { margin: 3px 0 0 2px; }
 
 #header > ul ul.show li { font-size: 1.8rem; box-shadow: rgb(166 104 104) 0px 2px 0px -1px; padding: 6px 10px; }
 .bottom-line-red { box-shadow: none; }
 .post-category .tags a { font: normal 1.4rem/1.7rem 'PT Sans Narrow'; }
 .sideLeft.show {  margin-top: 345px; }

.post-stats-views.mobile { margin: 0 20px 0 0px; }

.post-stats-author a:first-child { font-size: 1.5rem; }

}