@media only screen and (min-width: 1366px) and (max-width: 1768px) {
  .user-controls span {
    display: none;
  }
  
  header .links {
    font-size: 0.8rem;
  }
}

@media only screen and (min-width: 1366px) and (max-width: 1700px) {
  #container > .inner {
    width: 98%;
    margin: 0 auto;
  }
  
  #container .inner > .row .left {
  width: 70%;
}
  
  #container .inner > .row .right {
  width: 30%;
}
}

/* Tablety (poniżej 992px) */
@media only screen and (max-width: 1366px) {
  body, html {
    font-size: 14px;
  }
  
  .forumbit_1 .subforums .row .posts {
    display: none;
  }
  
  .thread-tools {
    flex-direction: column;
    gap: 24px !important;
  }
  
  header .logo {
        margin: 24px 0;
  }
  
    .legend .field {
    width: 30%;
      margin: 16px 1%;
  }
  
  .boardstats_stats {
    flex-wrap:wrap;
          justify-content: space-evenly;
  }
  
  div.inner div.row div.left div.forumbit_1 div.subforums div.row div.lastpost {
    margin: 1rem auto;
  }
  
  div.inner div.row div.left div.forumbit_1 div.subforums div.row div.lastpost div.postbit_content {
    flex-direction: column;
    text-align: center;
    margin-top: 8px;
  }
  
  div.inner div.row div.left div.forumbit_1 div.subforums div.row div.lastpost div.postbit_content .avatar {
    margin-bottom: 8px;
  }
  
  .boardstats_stats .field {
    width: 30%;
    margin: 16px 1.5%;
  }
  
  #container .inner > .row {
    flex-direction: column;
    gap: 2em;
  }
  
  #container .inner > .row .left,
  #container .inner > .row .right {
    width: 100%;
  }
  
  header .row {
    padding: 1.5em 1em;
    flex-wrap: wrap;
  }
  
  header .links {
    gap: 1.5em !important;
  }
  
  header .row:nth-child(1) {
    flex-direction: column;
  }
  
  .serverboard {
    overflow-x: auto;
    width: 100%;
  }
  
  .serverboard table {
    min-width: 600px;
  }
  
  footer .row:nth-child(1) > div {
    width: 100%;
    margin-bottom: 2em;
  }
  
  footer .row:nth-child(1) {
    flex-direction: column;
  }
  
  /* Profile styles */
  .profile li {
    width: 33.33%;
  }
  
  #profile .header {
    height: 180px;
  }
  
  #profile .header .upper {
    left: 140px;
    bottom: 90px;
  }
  
  #profile .main {
    flex-direction: column;
  }
  
  #profile .main .row.left,
  #profile .main .row.right {
    width: 100%;
    margin-bottom: 1em;
  }
  
  .buddy-item {
    width: 33%;
  }
}

/* Smartfony (poniżej 768px) */
@media only screen and (max-width: 936px) {
  body, html {
    font-size: 16px;
  }
  
  .thread-tools {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  
  .serverboard {
    display: none;
  }
  
  #container > .inner {
    width: 95%;
  }
  
  header {
    overflow-x: hidden;
  }
  
  header .row {
    padding: 1em;
    flex-direction: column;
    gap: 1em;
  }
  
  header .row > div {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
  }
  
  header .links {
    flex-wrap: wrap;
    justify-content: center;
    gap: 1em !important;
  }
  
  header .search {
    width: 100%;
    justify-content: center;
  }
  
  header .search form {
    width: 100%;
  }
  
  header .search .textbox {
    width: 100%;
  }
  
  .forumbit_1 .header .row {
    display: none;
  }
  
  .forumbit_1 .subforums .row {
    flex-wrap: wrap;
  }
  
  .forumbit_1 .subforums .row .icon,
  .forumbit_1 .subforums .row .about,
  .forumbit_1 .subforums .row .threads,
  .forumbit_1 .subforums .row .posts,
  .forumbit_1 .subforums .row .lastpost {
    width: 100%;
    text-align: center;
    margin: 0 auto 0.5rem auto;
  }
  
  .forumbit_1 .subforums .row .threads, 
  .forumbit_1 .subforums .row .posts {
    display: none;	
  }
  
  .postbit_content {
    flex-direction: column;
  }
  
  .postbit_content > .user,
  #posts .postbit_content .content {
    width: 100%;
  }
  
  #posts .postbit_content .content {
    border-left: none;
  }
  
  .boardstats_stats {
    flex-wrap: wrap;
  }
  
  .boardstats_stats .field {
    width: 48%;
    margin-bottom: 1em;
    padding: 32px
  }
  
  footer .row {
    padding: 1.5em 1em;
  }
  
  #shoutbox .entry {
    font-size: 12px;
  }
  
  #shoutbox .entry .mod {
    display: none;
  }
  
  #shoutbox .entry .avatar {
    margin-right: 8px;
    width: auto;
  }
  
  #shoutbox .entry .avatar img {
    width: 24px;
    height: 24px;
  }
  
  #shoutbox .entry .user {
    margin-right: 4px;
    width: 70px;
  }
  
  /* Profile styles */
  .profile li {
    width: 50%;
  }
  
  #profile .header {
    height: 350px;
  }
  
  #profile .header .upper {
    position: relative;
    left: 0;
    bottom: 0;
    padding: 10px;
    background: rgba(0, 0, 0, 0.7);
  }
  
  #profile .header .lower {
    height: auto;
    padding-bottom: 10px;
  }
  
  #profile .header .lower .avatar {
    margin: -50px 0 0 10px;
    width: 100px;
    height: 100px;
  }
  
  #profile .header .lower .info {
    width: calc(100% - 120px);
    display: flex;
    flex-wrap: wrap;
  }
  
  #profile .header .lower .info .row {
    padding: 10px;
    width: 50%;
    box-sizing: border-box;
    border-right: none;
    border-bottom: 1px solid var(--separator-color);
  }
  
  #profile .header .lower .posts {
    position: absolute;
    top: 90px;
    right: 10px;
  }
  
  #profile .header .edtButton {
    margin-top: 5px;
  }
  
  .buddy-item {
    width: 49%;
  }
  
  .about-user .about-user-items .about-user-item {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 0;
  }
  
  .about-user .about-user-items .about-user-item .item,
  .about-user .about-user-items .about-user-item .value {
    width: 100%;
    text-align: left;
  }
  
  .about-user .about-user-items .about-user-item .value {
    margin-top: 5px;
    white-space: normal;
  }
  
  .warnlvl {
    padding: 10px !important;
    margin-left: 0;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  
  .prof_findposts {
    float: none;
    display: block;
    margin: 10px auto;
    width: 80%;
    text-align: center;
  }
}

/* Małe smartfony (poniżej 576px) */
@media only screen and (max-width: 576px) {
  body, html {
    font-size: 16px;
  }
  
    .forumbit_1 .subforums .row .subforums a {
    width: 90%;
    margin: 0 auto;
  }
  
  header .row {
    padding: 1em 0.5em;
  }
  
  header .user-info {
    flex-direction: column;
    gap: 1em;	
  }
  
  header .search form {
    flex-direction: column;
    gap: 0.5em;
  }
  
  header .social {
    justify-content: center;
    width: 100%;
  }
  
  .user-welcome {
    flex-direction: column;
  }
  
  header .row .username, .user-controls {
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
    margin: 0 auto;
    justify-content: center;
  }
  
  .inner > .navigation {
    justify-content: center;
  } 
  
  .user-controls > a.logout-link {

  }
  
  header .row .username:after {
    display: none;
  }
  
  .ranking-tabs > ul > li,
  .ranking-period > ul > li {
    width: 50%;
  }
  
   .boardstats .boardstats_online .header {
    flex-direction: column;
    text-align: center;
    gap: 1em;
  }
 
  
  .boardstats_stats .field {
    width: 100%;
  }
  
  .thread-tools {
    flex-direction: column;
    width: 100%;
  }
  
  .thread-tools a {
    width: 100%;
    text-align: center;
    margin-bottom: 0.5em;
  }
  
  .administration .admins .row {
    flex-direction: column;
    text-align: center;
    padding: 16px 16px;
  }
  
  .administration .admins .row .about,
  .administration .admins .row .contact {
    margin-top: 1em;
  }
  
  .administration .admins .row .contact {
    justify-content: center;
  }
  
  .flex-container.space-between {
    flex-direction: column;
    gap: 1em;
  }
  
  .flex-container.space-between .float_left, 
  .flex-container.space-between .float_right {
    display: flex;
    flex-wrap: wrap;
  }
  
  .donations-tabs .tab-buttons {
    padding: 1em;
  }
  
  .donations-tabs .tab-buttons button {
    margin-bottom: 0.5em;
  }
  
  /* Profile styles */
  .profile li {
    width: 100%;
    float: none;
  }
  
  #profile .header {
    height: auto;
    padding-bottom: 10px;
  }
  
  #profile .header .upper .row {
    float: none;
    margin-bottom: 0;
  }
  
  #profile .header .lower {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  
  #profile .header .lower .avatar {
    float: none;
    margin: -50px auto 10px auto;
  }
  
  #profile .header .lower .info {
    width: 100%;
    float: none;
  }
  
  #profile .header .lower .info .row {
    float: none;
    width: 100%;
    text-align: center;
    padding: 8px;
  }
  
  #profile .header .lower .posts {
    position: static;
    margin: 10px auto;
    float: none;
    display: block;
    width: 80%;
    text-align: center;
  }
  
  #profile .header .edtButton {
    float: none;
    display: block;
    margin: 10px auto;
    width: 80%;
  }
  
  .buddy-item {
    width: 100%;
  }
  
  #profile .main .row.right .post-author {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  
  #profile .main .row.right .post-author img {
    margin-right: 0;
    margin-bottom: 10px;
  }
  
  #profile .main .row.right .post-author .author-info .post-location {
    justify-content: center;
  }
  
  #profile .main .row.right .posts .text {
    margin-left: 0;
    text-align: center;
  }
  
  #profile .main .row.right h3 {
    margin-left: 0;
    text-align: center;
  }
  
  #quick_login form {
    width: 90%;
  }
  
  .skroc_tekst {
    width: 100%;
  }
  
  .visitorslist .buddy-item {
    flex-direction: column;
    text-align: center;
    padding: 10px 0;
  }
  
  .visitorslist .buddy-twoline {
    align-items: center;
  }
}