2018-05-27 09:36:35 +00:00
: root {
--darkest-background : # 222222 ;
2018-06-17 07:28:18 +00:00
--second-dark-background : # 292929 ;
--third-dark-background : # 333333 ;
}
2018-05-27 09:36:35 +00:00
* {
box-sizing : border-box ;
}
body {
margin : 0px ;
padding : 0px ;
color : # AAAAAA ;
2018-06-06 00:21:22 +00:00
background-color : var ( --darkest-background ) ;
2018-05-27 09:36:35 +00:00
font-family : "Segoe UI" ;
}
a {
2018-07-13 11:27:58 +00:00
color : # eeeeee ;
2018-05-27 09:36:35 +00:00
text-decoration : none ;
}
nav . nav {
background : var ( --darkest-background ) ;
width : calc ( 100 % - 200px ) ;
float : left ;
}
ul {
list-style-type : none ;
margin-top : 0px ;
margin-bottom : 0px ;
clear : both ;
}
li {
float : left ;
margin-right : 12px ;
}
li a {
padding-top : 35px ;
padding-bottom : 22px ;
font-size : 18px ;
display : inline-block ;
color : # aaaaaa ;
}
# menu_overview {
margin-right : 24px ;
}
# menu_overview a {
font-size : 22px ;
padding-bottom : 21px ;
color : rgb ( 221 , 221 , 221 ) ;
padding-top : 31px ;
}
. menu_topics a {
border-bottom : 2px solid # 777777 ;
padding-bottom : 21px ;
color : # dddddd ;
}
. menu_alerts {
display : none ;
}
. right_of_nav {
float : left ;
width : 200px ;
background-color : var ( --darkest-background ) ;
padding-top : 12px ;
padding-bottom : 12px ;
padding-right : 12px ;
}
. user_box {
display : flex ;
flex-direction : row ;
2018-06-17 07:28:18 +00:00
border-radius : 3px ;
background-color : var ( --third-dark-background ) ;
2018-06-06 00:21:22 +00:00
padding-top : 11px ;
padding-bottom : 11px ;
padding-left : 12px ;
2018-05-27 09:36:35 +00:00
}
. user_box img {
display : block ;
width : 36px ;
height : 36px ;
border-radius : 32px ;
margin-right : 8px ;
}
. user_box . username {
display : block ;
font-size : 16px ;
padding-top : 4px ;
line-height : 10px ;
}
. user_box . alerts {
font-size : 12px ;
line-height : 12px ;
}
. container {
clear : both ;
}
# back {
2018-06-17 07:28:18 +00:00
background : var ( --third-dark-background ) ;
2018-05-27 09:36:35 +00:00
padding : 24px ;
padding-top : 12px ;
clear : both ;
display : flex ;
}
# main , # main . rowblock {
width : 100 % ;
}
. sidebar {
width : 320px ;
}
2018-07-05 09:54:01 +00:00
. the_form {
border-radius : 3px ;
background-color : # 444444 ;
padding : 16px ;
}
. rowblock : not ( . topic_list ) : not ( . rowhead ) : not ( . opthead ) . rowitem : not ( . post_item ) {
2018-06-17 07:28:18 +00:00
border-radius : 3px ;
2018-05-27 09:36:35 +00:00
background-color : # 444444 ;
display : flex ;
padding : 12px ;
2018-07-03 10:01:49 +00:00
}
. sidebar . rowblock : not ( . topic_list ) : not ( . rowhead ) : not ( . opthead ) . rowitem {
2018-05-27 09:36:35 +00:00
margin-left : 12px ;
}
2018-06-17 07:28:18 +00:00
. colstack_right . colstack_item : not ( . colstack_head ) : not ( . rowhead ) . rowitem {
border-radius : 3px ;
background-color : # 444444 ;
padding : 16px ;
}
. colstack_right . colstack_item : not ( . colstack_head ) : not ( . rowhead ) . rowitem : not ( : last-child ) {
margin-bottom : 8px ;
}
. colstack_right . colstack_head : not ( : first-child ) {
margin-top : 16px ;
}
. rowmsg {
margin-bottom : 8px ;
}
2018-05-27 09:36:35 +00:00
2018-07-03 10:01:49 +00:00
h1 , h2 , h3 , h4 , h5 {
2018-05-27 09:36:35 +00:00
-webkit-margin-before : 0 ;
-webkit-margin-after : 0 ;
margin-block-start : 0 ;
margin-block-end : 0 ;
margin-top : 0px ;
margin-bottom : 0px ;
font-weight : normal ;
2018-07-24 05:40:26 +00:00
white-space : nowrap ;
2018-05-27 09:36:35 +00:00
}
2018-07-24 05:40:26 +00:00
@ keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
. modal_pane {
position : fixed ;
left : 50 % ;
top : 50 % ;
transform : translate ( -50 % , -50 % ) ;
background : # 444444 ;
border : 2px solid # 333333 ;
border-radius : 5px ;
padding : 12px ;
padding-top : 8px ;
z-index : 9999 ;
animation : fadein 0 . 8s ;
}
. pane_header {
margin-bottom : 2px ;
}
. pane_row {
margin-top : 2px ;
}
. pane_buttons {
margin-top : 8px ;
}
. mod_floater {
position : absolute ;
right : 10px ;
bottom : 10px ;
background : # 444444 ;
border-radius : 5px ;
padding : 12px ;
padding-top : 8px ;
width : 200px ;
}
. mod_floater_head span {
margin-bottom : 6px ;
display : block ;
}
. mod_floater_body {
display : flex ;
}
. mod_floater_options {
width : 100 % ;
margin-right : 10px ;
2018-08-11 12:09:26 +00:00
padding : 4px ;
margin-bottom : 0px ;
2018-05-27 09:36:35 +00:00
}
2018-07-03 10:01:49 +00:00
. rowhead , . opthead , . colstack_head {
margin-left : 8px ;
2018-05-27 09:36:35 +00:00
margin-bottom : 8px ;
}
2018-07-03 10:01:49 +00:00
. rowhead h1 , . opthead h1 , . colstack_head h1 {
2018-07-13 11:27:58 +00:00
font-size : 22px ;
2018-05-27 09:36:35 +00:00
}
. sidebar . rowhead {
2018-07-03 10:01:49 +00:00
margin-left : 18px ;
2018-05-27 09:36:35 +00:00
margin-top : 4px ;
margin-bottom : 8px ;
}
. sidebar . rowhead h1 {
font-size : 20px ;
}
2018-07-03 10:01:49 +00:00
h2 {
font-size : 18px ;
margin-top : 12px ;
margin-bottom : 8px ;
margin-left : 8px ;
}
2018-07-05 09:54:01 +00:00
. topic_create_form {
2018-07-13 11:27:58 +00:00
display : flex ;
2018-07-05 09:54:01 +00:00
}
. quick_reply_form , . topic_reply_form , . topic_create_form {
background-color : # 444444 ;
border-radius : 3px ;
}
. quick_create_form {
margin-bottom : 8px ;
padding : 16px ;
}
. quick_create_form . little_row_avatar {
border-radius : 36px ;
margin-left : 4px ;
margin-right : 20px ;
height : 48px ;
width : 48px ;
}
. quick_create_form . main_form {
width : 80 % ;
}
. quick_create_form . topic_meta {
display : flex ;
}
. quick_create_form . topic_meta . topic_name_row {
margin-left : 8px ;
margin-bottom : 8px ;
width : 100 % ;
}
. quick_create_form . topic_meta . topic_name_row input {
width : 100 % ;
}
. quick_create_form . topic_content_row textarea {
width : 100 % ;
height : 60px ;
}
. quick_create_form . quick_button_row . formitem {
display : flex ;
margin-top : 6px ;
}
. quick_create_form . quick_button_row button , . quick_create_form . quick_button_row label {
margin-right : 8px ;
}
2018-08-19 06:25:59 +00:00
. quick_create_form # input_content {
width : 100 % ;
height : 100px ;
}
2018-07-05 09:54:01 +00:00
2018-07-03 10:01:49 +00:00
. more_topic_block_initial {
display : none ;
}
. more_topic_block_active {
display : block ;
}
. hide_ajax_topic {
display : none ! important ;
}
2018-07-05 09:54:01 +00:00
. auto_hide , . show_on_edit {
display : none ;
}
2018-07-03 10:01:49 +00:00
2018-07-13 11:27:58 +00:00
. topic_list_title_block {
display : flex ;
margin-left : 8px ;
}
. topic_list_title {
margin-left : 2px ;
}
. topic_list_title_block . optbox {
display : flex ;
margin-left : auto ;
font-size : 17px ;
margin-top : 3 . 5px ;
margin-right : 16px ;
margin-right : 18px ;
}
2018-07-15 05:00:48 +00:00
. topic_list_title_block . pre_opt : before {
content : "{{index .Phrases " topics_click_topics_to_select "}}" ;
2018-07-24 05:40:26 +00:00
font-size : 17px ;
margin-right : 20px ;
2018-07-15 05:00:48 +00:00
}
2018-07-13 11:27:58 +00:00
. topic_list_title_block . opt a {
color : # afafaf ;
margin-left : 8px ;
2018-07-24 05:40:26 +00:00
white-space : nowrap ;
2018-07-13 11:27:58 +00:00
}
. topic_list_title_block . create_topic_opt a : before {
content : "Create Topic" ;
}
. topic_list_title_block . mod_opt a : before {
content : "Moderate" ;
}
2018-05-27 09:36:35 +00:00
. topic_row : not ( : last-child ) {
margin-bottom : 8px ;
}
. topic_row {
2018-06-17 07:28:18 +00:00
border-radius : 3px ;
2018-05-27 09:36:35 +00:00
background-color : # 444444 ;
display : flex ;
}
. topic_left , . topic_right , . topic_middle {
padding : 16px ;
2018-07-13 11:27:58 +00:00
padding-bottom : 10px ;
padding-top : 16px ;
2018-05-27 09:36:35 +00:00
display : flex ;
width : 33 % ;
}
. topic_middle {
2018-07-03 10:01:49 +00:00
line-height : 20px ;
2018-05-27 09:36:35 +00:00
}
. topic_left {
margin-right : auto ;
}
2018-07-15 05:00:48 +00:00
. topic_sticky . topic_left {
2018-07-13 11:27:58 +00:00
border-left : 3px solid rgb ( 215 , 155 , 0 ) ;
border-radius : 3px ;
}
2018-07-15 05:00:48 +00:00
. topic_closed . topic_left {
2018-07-13 11:27:58 +00:00
border-left : 3px solid grey ;
2018-07-03 10:01:49 +00:00
border-radius : 3px ;
}
2018-07-15 05:00:48 +00:00
. topic_closed {
background-color : # 4b4b4b ;
}
2018-07-24 05:40:26 +00:00
. topic_selected {
background-color : rgb ( 68 , 68 , 88 ) ;
}
2018-07-03 10:01:49 +00:00
. new_item . topic_left {
border-left : 3px solid rgb ( 215 , 215 , 215 ) ;
border-radius : 3px ;
}
2018-05-27 09:36:35 +00:00
. topic_left img , . topic_right img {
border-radius : 24px ;
height : 38px ;
width : 38px ;
2018-07-13 11:27:58 +00:00
margin-right : 10px ;
2018-05-27 09:36:35 +00:00
}
. topic_inner_left {
display : flex ;
flex-direction : column ;
2018-07-03 10:01:49 +00:00
width : 92 % ;
}
. topic_inner_left . rowtopic {
white-space : nowrap ;
text-overflow : ellipsis ;
overflow : hidden ;
2018-05-27 09:36:35 +00:00
}
. topic_inner_left . parent_forum {
display : none ; /* Comment this until we figure out how to make it work */
}
. topic_right_inside {
display : flex ;
margin-left : auto ;
width : 180px ;
}
. topic_right_inside . lastName , . topic_left . rowtopic {
font-size : 15px ! important ;
line-height : 22px ;
2018-07-13 11:27:58 +00:00
margin-top : -2px ;
2018-05-27 09:36:35 +00:00
}
. topic_right_inside . lastReplyAt , . topic_left . starter {
font-size : 14px ;
line-height : 14px ;
}
. topic_right_inside span {
display : flex ;
flex-direction : column ;
}
. topic_inner_left br , . topic_right_inside br , . topic_inner_right {
display : none ;
}
. topic_middle . replyCount : after {
content : "replies" ;
margin-left : 3px ;
}
. topic_middle . likeCount : after {
content : "likes" ;
margin-left : 3px ;
}
. topic_middle_inside {
margin-left : auto ;
margin-right : auto ;
2018-07-13 11:27:58 +00:00
margin-top : -3px ;
2018-05-27 09:36:35 +00:00
width : 80px ;
}
. topic_status_e {
display : none ;
}
2018-06-30 03:40:50 +00:00
/* TODO: Make a generic version of this so that we can have more blocks which are initially hidden but flip over to visible under certain conditions */
. more_topic_block_initial {
display : none ;
}
. more_topic_block_active {
display : block ;
}
2018-08-04 11:46:36 +00:00
input , select , button , . formbutton , . panel_right_button , textarea {
2018-06-17 07:28:18 +00:00
border-radius : 3px ;
background : rgb ( 90 , 90 , 90 ) ;
color : rgb ( 200 , 200 , 200 ) ;
border : none ;
padding : 4px ;
}
input : focus , select : focus , textarea : focus {
outline : 1px solid rgb ( 120 , 120 , 120 ) ;
}
input {
background-image : url ( . / fa-svg / pencil-alt . svg ) ;
background-size : 12px ;
background-repeat : no-repeat ;
background-position : right 10px bottom 9px ;
background-position-x : right 10px ;
padding : 5px ;
padding-bottom : 3px ;
font-size : 16px ;
}
2018-08-11 12:09:26 +00:00
input , select {
/*margin-left: 4px;*/
margin-left : 3px ;
margin-bottom : 4px ;
}
2018-08-04 11:46:36 +00:00
button , . formbutton , . panel_right_button {
2018-06-17 07:28:18 +00:00
background : rgb ( 110 , 110 , 210 ) ;
color : rgb ( 250 , 250 , 250 ) ;
font-family : "Segoe UI" ;
font-size : 15px ;
text-align : center ;
padding : 6px ;
}
2018-07-13 11:27:58 +00:00
. formlabel {
margin-bottom : 4px ;
}
/ * . formlabel + . formitem {
margin-left : 4px ;
} * /
. formrow {
margin-bottom : 6px ;
}
. form_button_row {
margin-top : 10px ;
}
2018-06-17 07:28:18 +00:00
2018-07-24 05:40:26 +00:00
. login_mfa_token_row . formlabel {
display : none ;
}
2018-05-27 09:36:35 +00:00
. pageset {
display : flex ;
margin-top : 8px ;
}
. pageitem {
2018-06-01 05:02:29 +00:00
font-size : 17px ;
2018-06-17 07:28:18 +00:00
border-radius : 3px ;
2018-06-01 05:02:29 +00:00
background-color : # 444444 ;
2018-06-17 07:28:18 +00:00
padding : 7px ;
margin-right : 6px ;
2018-05-27 09:36:35 +00:00
}
# prevFloat , # nextFloat {
display : none ;
}
. forum_list . rowitem {
margin-bottom : 8px ;
display : flex ;
}
. forum_list . forum_left {
margin-left : 8px ;
}
. forum_list . forum_nodesc {
font-style : italic ;
}
. forum_list . forum_right {
display : flex ;
margin-left : auto ;
margin-right : 8px ;
padding-top : 2px ;
width : 140px ;
}
. forum_list . forum_right img {
margin-right : 10px ;
margin-top : 2px ;
}
. forum_list . forum_right span {
line-height : 19px ;
}
. extra_little_row_avatar {
border-radius : 24px ;
height : 36px ;
width : 36px ;
}
2018-08-30 10:31:21 +00:00
. colstack , . topic_item {
2018-06-06 00:21:22 +00:00
display : flex ;
}
2018-08-30 10:31:21 +00:00
. topic_item . topic_name_forum_sep {
font-size : 20px ;
line-height : 30px ;
margin-left : 7px ;
margin-right : 7px ;
}
. topic_item . topic_forum {
font-size : 19px ;
line-height : 31px ;
color : # dddddd ;
}
. topic_view_count {
font-size : 17px ;
margin-left : auto ;
margin-right : 20px ;
margin-top : 6px ;
}
. topic_view_count : after {
content : " views" ;
}
. topic_name_input {
width : 100 % ;
margin-right : 12px ;
}
. topic_item . submit_edit {
margin-right : 16px ;
}
2018-07-13 11:27:58 +00:00
. postImage {
width : 100 % ;
max-width : 320px ;
}
2018-07-05 09:54:01 +00:00
. post_item {
display : flex ;
margin-bottom : 12px ;
}
. userinfo {
margin-right : 12px ;
2018-07-13 11:27:58 +00:00
padding : 24px ;
padding-bottom : 16px ;
2018-07-05 09:54:01 +00:00
background-color : # 444444 ;
border-radius : 3px ;
2018-07-13 11:27:58 +00:00
width : 150px ;
2018-07-05 09:54:01 +00:00
display : flex ;
flex-direction : column ;
}
2018-08-19 06:25:59 +00:00
. user_meta {
display : flex ;
flex-direction : column ;
}
2018-07-05 09:54:01 +00:00
. avatar_item {
2018-07-13 11:27:58 +00:00
border-radius : 36px ;
height : 58px ;
width : 58px ;
background-size : 78px ;
2018-07-05 09:54:01 +00:00
margin-left : auto ;
margin-right : auto ;
}
. the_name {
margin-left : auto ;
margin-right : auto ;
white-space : nowrap ;
display : block ;
2018-07-13 11:27:58 +00:00
font-size : 18px ;
2018-07-05 09:54:01 +00:00
margin-top : 8px ;
line-height : 16px ;
}
. tag_block {
display : flex ;
}
. post_tag {
white-space : nowrap ;
margin-left : auto ;
margin-right : auto ;
display : block ;
}
. post_item . content_container {
padding : 16px ;
background-color : # 444444 ;
border-radius : 3px ;
width : 100 % ;
2018-07-13 11:27:58 +00:00
display : flex ;
flex-direction : column ;
color : # bbbbbb ;
}
. post_item . button_container {
display : flex ;
margin-top : auto ;
}
. post_item . action_button {
margin-right : 5px ;
font-size : 15px ;
color : # dddddd ;
2018-08-30 05:53:21 +00:00
white-space : nowrap ;
2018-07-13 11:27:58 +00:00
}
2018-08-21 08:00:35 +00:00
. post_item . action_button_left {
display : flex ;
}
2018-07-13 11:27:58 +00:00
. post_item . action_button_right {
margin-left : auto ;
display : flex ;
}
2018-08-25 09:32:00 +00:00
. post_item . controls : not ( . has_likes ) . like_count {
display : none ;
}
2018-07-13 11:27:58 +00:00
2018-07-24 05:40:26 +00:00
. action_item . userinfo , . action_item . action_icon {
display : none ;
}
. action_item . content_container {
padding-top : 12px ;
padding-bottom : 12px ;
}
. action_item . content_container span {
margin-left : auto ;
margin-right : auto ;
}
2018-08-30 10:31:21 +00:00
input [ type = checkbox ] {
display : none ;
}
input [ type = checkbox ] + label {
display : inline-flex ;
width : 18px ;
height : 18px ;
margin-bottom : -2px ;
margin-right : 8px ;
border : 1px solid rgb ( 120 , 120 , 120 ) ;
background-color : rgb ( 90 , 90 , 90 ) ;
padding-top : 1px ;
border-radius : 2px ;
}
input [ type = checkbox ] : checked + label . sel {
width : 8px ;
height : 8px ;
background : rgb ( 160 , 160 , 160 ) ;
margin-left : auto ;
margin-right : auto ;
margin-top : auto ;
margin-bottom : auto ;
border-radius : 2px ;
}
. poll_option {
display : flex ;
margin-bottom : 10px ;
}
. poll_option_text {
line-height : 14px ;
}
. poll_buttons {
padding-top : 4px ;
}
. poll_buttons button {
margin-right : 8px ;
}
2018-07-13 11:27:58 +00:00
. add_like : before , . remove_like : before {
content : "{{index .Phrases " topic . plus_one "}}" ;
}
2018-08-19 06:25:59 +00:00
. button_container . open_edit : after , . edit_item : after {
2018-07-13 11:27:58 +00:00
content : "{{index .Phrases " topic . edit_button_text "}}" ;
}
. delete_item : after {
content : "{{index .Phrases " topic . delete_button_text "}}" ;
}
. ip_item_button : after {
content : "{{index .Phrases " topic . ip_button_text "}}" ;
}
. lock_item : after {
content : "{{index .Phrases " topic . lock_button_text "}}" ;
}
. unlock_item : after {
content : "{{index .Phrases " topic . unlock_button_text "}}" ;
}
. pin_item : after {
content : "{{index .Phrases " topic . pin_button_text "}}" ;
}
. unpin_item : after {
content : "{{index .Phrases " topic . unpin_button_text "}}" ;
}
. report_item : after {
content : "{{index .Phrases " topic . report_button_text "}}" ;
2018-07-05 09:54:01 +00:00
}
2018-08-25 09:32:00 +00:00
. like_count : after {
content : " likes" ;
}
2018-07-05 09:54:01 +00:00
. topic_reply_container {
display : flex ;
}
2018-05-27 09:36:35 +00:00
. footer . widget {
padding : 12px ;
2018-06-06 00:21:22 +00:00
border-bottom : 1px solid # 555555 ;
2018-05-27 09:36:35 +00:00
}
# poweredByHolder {
display : flex ;
padding : 12px ;
padding-left : 16px ;
padding-right : 16px ;
}
# poweredBy {
margin-right : auto ;
}
. footer . widget , # poweredByHolder {
background-color : # 444444 ;
}
2018-08-31 06:25:13 +00:00
@ media ( max-width : 600px ) {
. rowhead h1 , . opthead h1 , . colstack_head h1 {
font-size : 19px ;
}
. topic_list_title_block . opt {
margin-top : -1px ;
}
. topic_list_title_block . opt a {
font-size : 16px ;
}
. topic_list . topic_middle {
display : none ;
}
. topic_left , . topic_right , . topic_middle {
width : 50 % ;
}
. topic_right_inside . lastName , . topic_left . rowtopic {
margin-top : -4px ;
}
. topic_left img , . topic_right img {
height : 32px ;
width : 32px ;
}
. topic_list . topic_right_inside . lastReplyAt , . topic_list . topic_left . starter {
white-space : nowrap ;
}
. topic_item . topic_name_forum_sep , . topic_item . topic_forum , . topic_view_count {
display : none ;
}
. userinfo {
padding : 18px ;
width : 140px ;
}
. avatar_item {
height : 48px ;
width : 48px ;
background-size : 68px ;
}
. the_name {
font-size : 17px ;
}
. ip_item . hide_on_mobile {
display : none ;
}
}
2018-08-19 06:25:59 +00:00
@ media ( max-width : 500px ) {
. sidebar {
display : none ;
}
2018-08-21 08:00:35 +00:00
. post_item . content_container {
background-color : transparent ;
padding : 0px ;
}
. post_item . user_content {
background-color : # 444444 ;
padding : 16px ;
}
. post_item . button_container {
display : block ;
margin-top : 8px ;
}
. post_item . action_button_left {
display : block ;
background-color : # 444444 ;
padding : 10px ;
}
2018-08-25 09:32:00 +00:00
. post_item . action_button_right {
background-color : # 444444 ;
padding : 10px ;
padding-left : 14px ;
/*padding-right: 12px;*/
margin-top : 8px ;
}
. post_item . controls : not ( . has_likes ) . like_count {
display : inline ;
}
. post_item . created_at {
margin-left : auto ;
}
2018-08-19 06:25:59 +00:00
. post_item , . topic_reply_container {
flex-direction : column ;
}
. userinfo {
margin-right : 0px ;
width : auto ;
flex-direction : row ;
margin-bottom : 12px ;
padding : 18px ;
padding-bottom : 14px ;
}
. avatar_item {
height : 46px ;
width : 46px ;
margin-left : 0px ;
margin-right : 0px ;
}
. user_meta {
margin-left : 10px ;
margin-top : -4px ;
}
}
2018-08-30 05:53:21 +00:00
@ media ( max-width : 601px ) {
2018-07-24 05:40:26 +00:00
ul {
padding-left : 14px ;
}
li a {
padding-bottom : 6px ;
font-size : 15px ;
color : # bfbfbf ;
}
2018-08-30 05:53:21 +00:00
2018-07-24 05:40:26 +00:00
# menu_overview {
margin-right : 10px ;
}
# menu_overview a {
font-size : 17px ;
padding-bottom : 7px ;
color : rgb ( 226 , 226 , 226 ) ;
padding-top : 12px ;
}
2018-08-30 05:53:21 +00:00
. menu_topics a {
color : # cfcfcf ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
}
2018-07-24 05:40:26 +00:00
2018-08-30 05:53:21 +00:00
@ media ( max-width : 750px ) and ( min-width : 600px ) {
ul {
padding-left : 16px ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
# menu_overview {
margin-right : 12px ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
# menu_overview a {
font-size : 19px ;
padding-bottom : 5px ;
color : rgb ( 231 , 231 , 231 ) ;
padding-top : 11px ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
li a {
padding-bottom : 13px ;
2018-07-24 05:40:26 +00:00
font-size : 16px ;
2018-08-30 05:53:21 +00:00
color : # cfcfcf ;
}
. menu_topics a {
color : # dddddd ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
}
2018-07-24 05:40:26 +00:00
2018-08-30 05:53:21 +00:00
@ media ( max-width : 750px ) {
nav . nav {
background : # 2a2a2a ;
width : 100 % ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
ul {
display : flex ;
padding-right : 0px ;
2018-07-28 12:52:23 +00:00
}
2018-08-30 05:53:21 +00:00
li {
float : left ;
margin-right : 6px ;
2018-07-28 12:52:23 +00:00
}
2018-08-30 05:53:21 +00:00
li a {
padding-top : 14px ;
display : inline-block ;
2018-07-24 05:40:26 +00:00
}
2018-08-30 05:53:21 +00:00
. menu_topics a {
padding-bottom : 15px ;
border : none ;
}
. right_of_nav {
width : auto ;
padding : 0px ;
}
. user_box {
display : none ;
}
# back {
flex-direction : column ;
2018-07-24 05:40:26 +00:00
}
}
@ media ( max-width : 850px ) {
/**/
}
2018-05-27 09:36:35 +00:00
@ media ( min-width : 1010px ) {
. container {
2018-06-17 07:28:18 +00:00
background-color : var ( --second-dark-background ) ;
2018-05-27 09:36:35 +00:00
}
2018-08-30 05:53:21 +00:00
# back , . footer {
2018-05-27 09:36:35 +00:00
width : 1000px ;
margin-left : auto ;
margin-right : auto ;
}
. footBlock {
display : flex ;
}
. footer {
display : flex ;
flex-direction : column ;
}
2018-08-30 05:53:21 +00:00
. userinfo {
width : 180px ;
padding-bottom : 18px ;
}
. userinfo . avatar_item {
height : 64px ;
width : 64px ;
background-size : 88px ;
}
. userinfo . the_name {
font-size : 19px ;
}
. userinfo . post_tag {
font-size : 17px ;
}
2018-05-27 09:36:35 +00:00
}
@ media ( min-width : 1330px ) {
nav . nav {
width : calc ( 85 % - 200px )
}
ul {
margin-left : 205px ;
}
. right_of_nav {
width : calc ( 15 % + 200px ) ;
}
. user_box {
width : 200px ;
}
}