/* Licence : AGPL Created on : 26.03.2024 Author : Matthias Ebers */ /* body { background: url(scheme/joinfriendica_dark.jpeg); background-repeat: no-repeat; background-size: cover; background-attachment: fixed; height: auto; } */ #topbar-first { background-color: $background_color; } #topbar-first .dropdown.account > a, #topbar-first .dropdown.account.open > a, #topbar-first .dropdown.account > button, #topbar-first .dropdown.account.open > button { background: none; } #topbar-first #nav-notifications-menu li.notif-entry:hover { background-color: $nav_bg; } #topbar-first #nav-notifications-menu li.notification-unseen { background-color: $nav_icon_hover_color; } #topbar-second { background-color: $nav_bg; border-color: #3e3a35; } #topbar-second ul.tabs li { border_color: #3e3a35; } .dropdown-menu, .account .dropdown-menu { background-color: $background_color; } .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { color: $link_color; } .account .dropdown-menu li { border-color: $background_color; } .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover { background-image: none; background-color: rgba(232, 232, 232, $contentbg_transp); } .breadcrumb, .panel-footer, .list-group-item { background-color: rgba(245, 245, 245, $contentbg_transp); } .panel-group .panel-footer { border-top: 1px solid $nav_bg; } .well { background-image: none; background-color: $nav_bg; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; border-color: #a0a0a0; } input[type="text"], input[type="submit"], button[type="submit"]:not(.btn), select, textarea, .form-control { border: 2px solid transparent; background-color: $nav_bg; color: $font_color; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; } input[type="range"] { box-shadow: none; } .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: $background_color; color: $font_color_darker; } .radio label::before, .checkbox label::before { background-color: $background_color; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover, main .nav-tabs > li.active > a, main .nav-tabs > li.active > a:focus, main .nav-tabs > li.active > a:hover { background-color: $nav_bg; color: $font_color_darker; } .nav > li > a:focus, .nav > li > a:hover { background-color: rgba(238, 238, 238, $contentbg_transp); } .modal-content { background-color: $background_color; } .pager li > a, .pager li > span { border-color: #a0a0a0; } .pager li > a:focus, .pager li > a:hover { background-color: #303030; } .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover { border-color: $link_color; background-color: $nav_bg; color: $font_color; } .pagination > li > a:hover, .pagination > li > span:hover { background-color: $nav_bg; } #jotOpen { border: none; background-color: $background_color; } .close { color: $font_color; text-shadow: 0 1px 0 $nav_bg; } .close:focus, .close:hover { color: $link_color; } .input-group-addon { color: $font_color; background-color: $nav_bg; box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #dadada; border: none; } #topbar-first #nav-notifications-menu li.notif-entry, .panel-footer, .panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body, .wall-item-container, .comment-fake-form { border-color: $nav_bg; } .wall-item-comment-wrapper { border: 0; } .badge { background-color: $nav_bg; } .btn { box-shadow: 0 0 2px #dadada; -webkit-box-shadow: 0 0 2px #dadada; background: none; color: $font_color_darker; } .btn.focus, .btn:focus, .btn:hover { color: $font_color; } .btn-default:focus, .btn-default:hover { background: $nav_bg; } .btn-default.active, .btn-default:active { background-color: $nav_bg; color: $font_color; } button[type="submit"]:not(.btn), input[type="submit"], .btn.btn-primary { border: 1px solid $link_color; } .label-primary { background-color: $background_color; color: $link_color; } .panel-default > .panel-heading { background: none; background-color: $nav_bg; color: $font_color; } .btn-success, .label-success, .alert-success, .panel-success > .panel-heading { background: rgba(60, 118, 61, 0.4); color: #dff0d8; } .fc .fc-event, .btn-info, .label-info, .alert-info, .panel-info > .panel-heading, .table > tbody > tr.info > td, .table > tbody > tr.info > th, .table > tbody > tr > td.info, .table > tbody > tr > th.info, .table > tfoot > tr.info > td, .table > tfoot > tr.info > th, .table > tfoot > tr > td.info, .table > tfoot > tr > th.info, .table > thead > tr.info > td, .table > thead > tr.info > th, .table > thead > tr > td.info, .table > thead > tr > th.info { background: rgba(49, 112, 143, 0.4); color: #d9edf7; } .btn-warning, .label-warning, .alert-warning, .panel-warning > .panel-heading { background: rgba(139, 109, 59, 0.4); color: #fcf8e3; } .btn-danger, .label-danger, .alert-danger, .panel-danger > .panel-heading { background: rgba(169, 68, 66, 0.4); color: #f2dede; } @media (min-width: 768px) { .wall-item-container .wall-item-links, .wall-item-container .wall-item-actions button > a { opacity: 0.5; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .wall-item-container:hover .wall-item-links, .wall-item-container:hover .wall-item-actions button > a { opacity: 1; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } .wall-item-container .wall-item-body .body-attach > a:hover { opacity: 1; } } .fc-unthemed td.fc-today { background-color: $nav_bg; } .nav .open > .btn-link { background-color: $nav_bg; } .hovercard { box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.5); } .hovercard, .hover-card-footer { background-color: $nav_bg; } .hovercard.top > .arrow:after { border-top-color: $nav_bg; } .hovercard.right > .arrow:after { border-right-color: $nav_bg; } .hovercard.bottom > .arrow:after { border-bottom-color: $nav_bg; } .hovercard.left > .arrow:after { border-left-color: $nav_bg; } .friendica-tagsinput .tag { color: inherit; } code { color: $font_color; background-color: rgba(255, 255, 255, 0.2); } pre { color: $font_color_darker; background-color: rgba(255, 255, 255, 0.05); } legend { color: $font_color; } .table-striped > tbody > tr:nth-of-type(odd), .table-hover > tbody > tr:hover, .adminpage .table-hover > tbody > tr:hover + tr.details { background-color: $nav_bg; } section > .generic-page-wrapper, .videos-content-wrapper, .suggest-content-wrapper, .help-content-wrapper, .match-content-wrapper, .dirfind-content-wrapper, .delegation-content-wrapper, .notes-content-wrapper, .message-content-wrapper, .apps-content-wrapper, #adminpage, .delegate-content-wrapper, .uexport-content-wrapper, .dfrn_request-content-wrapper, .friendica-content-wrapper, .credits-content-wrapper, .nocircle-content-wrapper, .profperm-content-wrapper, .invite-content-wrapper, .tos-content-wrapper, .fsuggest-content-wrapper, .panel, aside .widget, .nav-container .widget, #back-to-top { box-shadow: 0 0 3px $link_color; -webkit-box-shadow: 0 0 3px $link_color; } input[type="text"].tt-input { box-shadow: none; } #back-to-top { color: $link_color; } .acpopup { background-color: $nav_bg; box-shadow: 0px 6px 12px rgba(218, 218, 218, .18); -webkit-box-shadow: 0px 6px 12px rgba(218, 218, 218, .18); } .textcomplete-item > a { color: $nav_icon_color !important; } .textcomplete-item.active > a { background-color: $nav_icon_hover_color !important; } #preview_profile-jot-text, .comment-edit-form .preview { background-color: $nav_bg; border-width: 1px; } textarea#profile-jot-text:focus + #preview_profile-jot-text, textarea.comment-edit-text:focus + .comment-edit-form .preview { border-color: $link_color; } figure.img-allocated-height { background-color: rgba(255, 255, 255, 0.15); } /* Mobile Button vergrößern & weißen Hintergrund /* Button groß mit runden Ecken */ .btn-sm { padding: 5px 23px; font-size: 12px; color: #969696; background-color: $background_color; border-color: $border_color; } #jotOpen { margin-top: 1px; float: right; } .btn { border-radius: 5px; } /* Tabwechsel zu den Inhalten */ ul.tabs li { font-size: 1.3rem;; font-style: normal; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important; } /* Hauptbeitrag */ body { font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important; color: #f5f0eb; font-size: 1.47rem; line-height: 22px; font-weight: 400; font-style: normal; text-rendering: optimizelegibility; font-feature-settings: "kern"; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; } /* Kommentierungen auf Beiträge */ .media .media-body { font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important; font-size: 1.4rem; line-height: 1.5; font-weight: 400; font-style: normal; text-rendering: optimizelegibility; font-feature-settings: "kern"; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; } /* Rahmen Twitter Nachrichten */ .well { background-image: -webkit-linear-gradient(top,#232526 0,#232526 100%); background-image: -o-linear-gradient(top,#232526 0,#232526 100%); background-image: -webkit-gradient(linear,left top,left bottom,from(#232526),to(#232526)); background-image: linear-gradient(to bottom,#232526 0,#232526 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0); background-repeat: repeat-x; border-color: #3d4244; -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1); box-shadow: inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1); } /* Seitennavigation */ aside .widget, .nav-container .widget { font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important; color: #000; font-size: 1.4rem; line-height: 1.5; font-weight: 400; font-style: normal; text-rendering: optimizelegibility; font-feature-settings: "kern"; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; } /* Seitennavigation hover Farbe */ aside .widget li:hover, aside .widget li.selected, .nav-container .widget li:hover { z-index: 2; color: #fff; background-color: rgba(36, 39, 40, 0.98); border-left: 3px solid #515151 !important; padding-left: 17px; /* Rahmen eingegegraut */ box-shadow: 0 0.5em 1em -0.125em rgba(10,10,10,0.1),0 0px 0 1px rgba(10,10,10,0.02); } aside .widget li a, aside .widget li a:hover { color: #fff; } /* Seitennavigation Abstand der Infoblöcke */ aside .widget, .nav-container .widget { border: none; color: #dddedf; background-color: rgba(35, 37, 38, 0.98); box-shadow: 0 0 3px #272a2d; -webkit-box-shadow: 0 0 3px #1c1e1f; -moz-box-shadow: 0 0 3px #1c1e1f; border-radius: 2px; position: relative; margin-bottom: 5px; padding: 10px; overflow: auto; } /* Fügt ein eigene Logo in die Seite ein */ #logo-img {display:none;} header #banner { position: fixed; left: 43%; right: 0; z-index: 1040; margin-top: 1.5px; padding-left: 55px; background-image: url('/.statisch/logo_dis-le.png'); background-size: 180px 50px; height: 50px; width: 180px; } /* Bilder hinzufügen Buttonfarbe */ button, input, optgroup, select, textarea { color: #4f4f4f; } /* Modal verbreitern und Form anpassen */ #jot-modal .modal-header a, #jot-modal .modal-header .btn-link, #profile-jot-submit-wrapper a, #profile-jot-submit-wrapper .btn-link { color: #999; } main .nav-tabs > li.active > a, main .nav-tabs > li.active > a:focus, main .nav-tabs > li.active > a:hover { background-color: rgba(255, 255, 255, 0); } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {border-top: 0px; border-left: 0px; background-color: #3d4244; border-right: 0px; border-bottom: 0px solid #577384;} .modal-content { box-shadow: 0 5px 100px rgba(0, 0, 0, 0.73); } .modal-content {background-color: #1f2629; border: 2px solid rgba(31, 38, 41, 0.79); border-radius: 7px;} .pager li > a:focus, .pager li > a:hover { background-color: #3c4a5300; } .pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {background-color: #2b2b2b;} .pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {border-top-right-radius: 0px; border-bottom-right-radius: 0px;} .pager .next > a, .pager .previous > a {border-radius: 0px; font-weight: 800; font-size: 20px;} .pagination li > a, .pager li > a {background-color: #dfdfdf00; color: #000; border: 0px; padding: 10px;} .pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .pager li > a, .pager li > span { background-color: #dfdfdf00; border: 1px solid #cecdcd00; border-radius: 0px; } /* Farbe der Srollbar anpassen */ html { scrollbar-color: #6c7784 rgba(0,0,0,.1); } /* Linie zwischen Beiträgen hervorheben */ .wall-item-container { border-top: 1px solid rgba(28, 30, 31, 0.8); margin-left: 2px !important; } .type-link, .type-video { border-top: 1px solid #1C1E1F; border-bottom: 1px solid #1C1E1F; display: block; padding-top: 5px; padding-bottom: 5px; margin-top: 10px; } aside hr, section hr { border-color: rgba(60, 59, 59, 0.98); } /* Kommentag anpassen */ Element { overflow: scroll; } .dropzone.dz-clickable { cursor: pointer; border-radius: 4px; background-color: #232526; } .dropzone, .dropzone * { box-sizing: border-box; } .dropzone:not(textarea) { border: 1px solid rgb(35, 37, 38); padding: 0px 0px 5px 0px; } .dropzone, .dropzone * { box-sizing: border-box; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Suchefenster optimieren */ Element { padding-right: 49px; } #topbar-first #search-box .form-search { height: 25px; font-size: 13px; background-position: 8px 4px; } .form-control.form-search { border-radius: 4px; background-image: url(img/icon_search16x16.png); background-repeat: no-repeat; background-position: 10px 8px; padding-left: 34px; outline: 0; box-sizing: border-box; width: 100%; box-shadow: none; font-family: inherit; } .form-control { display: block; width: 100%; height: 34px; padding: 6px 12px; padding-left: 12px; font-size: 14px; line-height: 1.42857143; color: #d2d2d2; background-color: #1f2123; background-image: none; border: 1px solid #474e51; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; } /* Radius der Beiträge & Abstand zwischen Beiträgen */ .panel { border: none; background-color: rgba(31, 33, 35, 0.98); box-shadow: 0 0 2px #1f2123; -webkit-box-shadow: 0 0 2px #1f2123; -moz-box-shadow: 0 0 2px #1f2123; border-radius: 4px; position: relative; } .panel { -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05); box-shadow: 0 1px 2px rgba(0,0,0,.05); } .panel-default { border-color: #ddd; } .panel { margin-bottom: 8px; background-color: #1f2123; /*border: 1px solid transparent;*/ border-radius: 1px; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05); box-shadow: 0 1px 1px rgba(0,0,0,.05); } /* Position Suche */ .form-group-search .form-button-search { position: absolute; top: 2px; right: 4px; border-radius: 30px; } /* Anzahl Kommentare heller machen */ .hide-comments-outer { display: block; background-color: rgba(31, 33, 35, 0.03); padding: 0.3em 10px; width: 100%; border: none; text-align: left; } /* Kommentarfeld unter Beiträge einhellen */ .comment-fake-form, .wall-item-comment-wrapper { padding: 10px; border-top: 1px solid rgb(28, 30, 31); border-top-color: rgb(28, 30, 31); border-top-color: rgb(28, 30, 31); background-color: rgb(31, 33, 35); border-radius: 0 0 4px 4px; margin-bottom: 0; } /* Kommentar Icons hell einfärben */ .wall-item-actions .btn, .wall-item-actions a, .wall-item-actions button { color: #fff; } /* Zeitangabe neben Profilbild heller machen */ p.wall-item-announce, .media .time, .media .shared-time, .media .delivery, .media .location, .media .location a { font-size: 11px; color: #fff; } /* Button Vorschau in die richtige Farbe bringen */ .btn-default { background: #31363c; background-color: rgb(49, 54, 60); background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-attachment: scroll; background-image: none; background-size: auto; background-origin: padding-box; background-clip: border-box; background-image: none; color: #e9e4e0; } /* Admin Bereich */ section > .generic-page-wrapper, .videos-content-wrapper, .suggest-content-wrapper, .help-content-wrapper, .match-content-wrapper, .dirfind-content-wrapper, .delegation-content-wrapper, .notes-content-wrapper, .message-content-wrapper, .apps-content-wrapper, #adminpage, .delegate-content-wrapper, .uexport-content-wrapper, .dfrn_request-content-wrapper, .friendica-content-wrapper, .credits-content-wrapper, .nocircle-content-wrapper, .profperm-content-wrapper, .invite-content-wrapper, .tos-content-wrapper, .fsuggest-content-wrapper { min-height: calc(100vh - 150px); padding: 15px; padding-bottom: 15px; padding-bottom: 20px; margin-bottom: 20px; border: none; background-color: rgb(28, 30, 31); border-radius: 4px; position: relative; color: #fff; box-shadow: 0 0 3px #1c1e1f; -webkit-box-shadow: 0 0 3px #1c1e1f; -moz-box-shadow: 0 0 3px #1c1e1f; } /* Konto Bereich */ .help-block { color: #6a6257; } .panel-footer { padding: 10px 15px; background-color: #1f2123; border-top: 1px solid #ddd; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .faded-icon { color: #fff; } /* Dropdownmenue am Profil anpassen */ .dropdown-menu li a, .dropdown-menu li .btn-link { color: #acaaaa; } /* Benachrichtigung anpassen */ .dropdown-menu { background-color: #2f3335; border: 1px solid #ccc; border: 1px solid rgb(80, 86, 89); border-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); box-shadow: 0 6px 12px rgb(47, 51, 53); } #topbar-first #nav-notifications-menu li.notif-entry { color: #fff; padding: 10px; border-bottom: 1px solid #2f3335; position: relative; border-left: 3px solid #626161; font-size: 12px; } /* via Textkörper bei Weiterleitung */ .media .media-body h4.media-heading { font-size: 14px; font-weight: 500; color: #fff; } /* Kontaktvorschläge optimieren */ .contact-entry-desc { color: #fff; } /* Blauer Hintergrund Profilstatus */ #contact-edit-status-wrapper { border: none; background-color: rgba(14, 151, 213, 0.98); margin: 15px -15px; } .contact-wrapper .contact-action-link, .contact-wrapper .contact-action-link:hover, .textcomplete-item .contact-wrapper .contact-action-link { color: #fff; } /* Timeline Tabelle */ .table-striped > tbody > tr:nth-of-type(2n+1) { background-color: #242728; } /* Social Media Anzeigefelder */ .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: #1f2123; opacity: 1; } /* Addon Erweiterter Inhaltsfilter Farbgebung */ .settings-block { margin: 0 0 5px; background-color: rgb(31, 33, 35); border-radius: 4px; padding: 10px 15px; box-shadow: 0 0 3px #1f2123; -webkit-box-shadow: 0 0 3px #1f2123; -moz-box-shadow: 0 0 3px #1f2123; } /* Buttonfarbe Verbundene Programme */ .btn { background-color: #242728; } /* Hoverfarbe Konto löschen */ .hover-card-footer { background-color: #242728; } /* Kalender Erinnerung */ #birthday-notice, #birthday-wrapper, #rfic-desc, #remote-friends-in-common, #event-notice, #event-wrapper { margin-bottom: 5px; padding: 10px; border: none; background-color: rgb(30, 32, 34); box-shadow: 0 0 3px #dadada; -webkit-box-shadow: 0 0 3px #232526; -moz-box-shadow: 0 0 3px #dadada; border-radius: 4px; cursor: pointer; } /* Addon Inhaltsfilter */ .list-group-item { position: relative; display: block; padding: 10px 15px; margin-bottom: -1px; background-color: #1f2123; border: 1px solid #1c1e1f; } /* Addon Uploadbox */ .qq-upload-drop-area { background: #2f3335 !important; float: none; border: none; -webkit-box-shadow: none; box-shadow: none; -moz-box-shadow: none; background-image: none; text-shadow: none; border-radius: 3px; margin-bottom: 0; font-size: 14px; font-weight: 600; padding: 8px 16px; color: inherit; width: 100% !important; display: block !important; position: relative !important; border: black 1px dashed !important; margin-bottom: 5px !important; margin-top: 15px !important; } /* Bildebearbeitung Berechtigung */ #cboxContent { background: #1f2123; overflow: visible; } /* Seitenpaginierung */ .pagination li > a, .pager li > a { background-color: #aaa0; color: #c2b39e; border: 0px; padding: 10px; } /* Moderationsbereich Reports */ .table .table { background-color: #242728; } /* fügt eine farbige Linie für Kommentare ein*/ .thread_level_1 { position: relative !important; margin-top: 0; border-left: 3px solid #5151511a; } .thread_level_2 { position: relative !important; margin-top: 0; border-left: 3px solid #d2af7f6b; } .thread_level_3 { position: relative !important; margin-top: 0; border-left: 3px solid #ddd; } .thread_level_4 { position: relative !important; margin-top: 0; border-left: 3px solid #b8a17e; } .thread_level_5 { position: relative !important; margin-top: 0; border-left: 3px solid #8fafb8; } .thread_level_6 { position: relative !important; margin-top: 0; border-left: 3px solid #647C64; } .thread_level_7 { position: relative !important; margin-top: 0; border-left: 3px solid #7F8C8D; } .thread_level_8 { position: relative !important; margin-top: 0; border-left: 3px solid #95A5A6; } .thread_level_9 { position: relative !important; margin-top: 0; border-left: 3px solid #BDC3C7; } .thread_level_10 { position: relative !important; margin-top: 0; border-left: 3px solid #CFD8DC; }