This repository has been archived on 2021-09-01. You can view files and clone it, but cannot push or open issues or pull requests.
theme-geeklab/static/_css/style.css

684 lines
12 KiB
CSS

@font-face {
font-family: 'OpenSans';
src: url('/_font/OpenSans/OpenSans-Regular.eot');
src: url('/_font/OpenSans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
url('/_font/OpenSans/OpenSans-Regular.ttf') format('truetype');
}
@font-face {
font-family: 'OpenSansLight';
src: url('/_font/OpenSans/OpenSans-Light.eot');
src: url('/_font/OpenSans/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
url('/_font/OpenSans/OpenSans-Light.ttf') format('truetype');
}
@font-face {
font-family: 'CreteRound';
src: url('/_font/CreteRound/CreteRound-Regular.otf') format('truetype');
}
html,body {
margin:0;
padding:0;
height: 100%;
}
html{
box-sizing: border-box;
font-family:OpenSans;
}
*, *:before, *:after {
box-sizing: inherit;
}
/*
Global Helper Classes
*/
.serendipity_edit_nugget{
display:none;
}
.container-centered{
margin:0 auto;
width:80%;
max-width:980px;
}
.table{
display:table;
}
.table-cell{
display:table-cell;
}
.floated{
float:left;
}
.clear{
clear:both;
}
span#mailinvite::before,
span#mailinvite:before{
content: "mail\40";
}
span#mailinvite::after,
span#mailinvite:after{
content: ".de";
}
#badmail,
.serendipity_comment_s9ymarkup,
.serendipity_comment_emoticate,
.serendipity_comment_spamblock,
.serendipity_comment_gravatar,
.serendipity_comment_markdown,
.comment_phone_input
{
display:none;
}
.comment_avatar{
border-radius: 50%;
width: 64px;
height: 64px;
}
#trackbacks a {
white-space: nowrap;
margin: 0.5em 0 0;
display: inline-block;
}
/*
Global Blog Header
*/
header.main .banner {
background: #4186C9;
padding: 2em 0;
text-align: center;
color: #FFF;
}
header.main .icon {
font-size: 2.5em;
background: #FFF;
padding: 0 0.25em;
border-radius: 50%;
color: #4186C9;
}
header.main .title {
font-size: 2.5em;
font-family:CreteRound;
font-weight: normal;
padding-left: 0.3em;
}
header.main .underline {
display: block;
margin: 0.8em 0 0.5em;
}
header.main nav,
header.main div.mobile {
background: #2F333E;
text-align: center;
color: #D9D9D9;
}
header.main nav.default,
header.main nav.default.visible {
display: block;
}
header.main div.mobile {
display: none;
}
header.main a,
div.mobile span{
color: #D9D9D9;
text-decoration: none;
padding: 0.2em 0.5em;
border: 1px solid;
border-radius: 6px;
display: inline-block;
}
header.main a:hover,
header.main a.active,
div.mobile span:hover {
background: #3D4352;
cursor: pointer;
}
header.main nav ul{
margin:0;
padding: 0.8em 0;
}
header.main nav ul li {
display:inline-block;
margin: 0 0.3em;
}
div.mobile span {
margin: 0.8em 0;
}
#mobile-menu{
display:none;
}
/*
Content Section
*/
#wrapper {
position: relative;
min-height: 100%;
height: auto !important;
height: 100%;
}
#content{
padding-bottom:110px;
}
#content .blog-entry:first-child{
border:0;
}
h2 {
font-weight: normal;
}
.blog-entry,
#entry-comment{
word-wrap: break-word;
border-top:1px dashed #959595;
padding:1.5em 0;
}
.serendipity_staticpage {
border: none;
}
.blog-entry,
#entry-comment,
#pagenav{
margin-left: 2em;
margin-right: 2em;
}
.blog-entry img{
max-width: 100%;
height: auto;
}
.blog-entry header a{
color:#000000;
text-decoration: none;
}
.blog-entry header a:hover{
text-decoration: underline;
}
.blog-entry .entry-body a,
.blog-entry .entry-body-extended a,
.blog-entry .entry-extended a,
.blog-entry footer a,
.serendipity_staticpage a,
#entry-comment a{
color:#0A539A;
text-decoration: underline;
}
.blog-entry footer a,
#comments a.viewmode,
#comments .viewmode-active{
border:1px solid #BFBFBF;
padding:1px 3px;
border-radius: 4px;
text-decoration: none;
color:#505050;
text-transform: uppercase;
}
#trackback_url{
padding-bottom: 1.5em;
}
.blog-entry footer .fa{
font-size:22px;
padding:0 5px 0 0;
}
#comments{
padding-bottom:1em;
}
.blog-entry .entry-body a:hover,
.blog-entry .entry-body-extended a:hover,
.blog-entry .entry-extended a:hover,
.blog-entry footer a:hover,
.serendipity_staticpage a:hover,
#entry-comment a:hover{
background:#0A539A;
color:#FFFFFF;
text-decoration:none;
}
.blog-entry footer a:hover,
#pagenav a:hover,
#serendipity_comment input[type="submit"]:hover,
#comments a.viewmode:hover{
background:#4CA0F4;
border-color: #3E82C7;
color:#FFFFFF;
text-decoration:none;
cursor:pointer;
}
#comments .viewmode-active{
background:#EAEAEA;
}
a.read_more:after{
content:' \f178';
font-family:'FontAwesome';
}
a.read_more{
margin-bottom: 1.5em;
display: inline-block;
}
#trackbacks{
padding:3em 0 1.5em 0;
}
#trackbacks article footer a{
margin:0.5em 0 1em 0;
}
.blog-entry footer span.outline{
margin-right:10px;
}
.blog-entry footer span a{
position:relative;
margin:2px 0;
display:inline-block;
}
.blog-entry footer span.break-wordwrap{
position:relative;
display:inline-block;
white-space:nowrap;
}
.blog-entry footer span{
color:#4A4A4A;
}
.blog-entry .update{
font-style: italic;
}
.blog-entry .update span:first-child{
text-decoration: underline;
}
.notice,
.geshi{
word-wrap: break-word;
padding:1% 0;
border-radius:3px;
}
.notice div{
vertical-align:middle;
padding-left:7px;
padding-right:7px;
}
.notice div:first-child{
text-align:center;
font-size:20px;
width:60px;
padding-right:0;
}
.notice-noarticle{
margin:40px 1.5em;
}
.notice-info,
.notice-important,
.notice-success,
.notice-warning{
margin:5px 0;
width:80%;
}
.notice-noarticle,
.notice-info{
border:1px solid #A3C0DC;
background:#E1EAF4;
color:#2D547E;
}
.notice-important{
border:1px solid #FF9595;
background:#FFD3D3;
color:#D30000;
}
.notice-success{
border:1px solid #95FF9C;
background:#CFFFD1;
color:#00A809;
}
.notice-warning{
border:1px solid #FFFF7E;
background:#FFFFBE;
color:#EE6905;
}
.sticky{
font-weight:bold;
padding-right:10px;
}
.serendipity_image_left{
display:block;
float: left;
margin: 0 2em 1em 0
}
.serendipity_image_center {
display: block;
margin: 0 auto 1em auto;
}
.geshi{
font-size:13px!important;
font-family: monospace;
border:1px solid #BFBFBF;
background:#F6F6F6;
overflow: auto;
white-space:nowrap;
padding: 0 1em 0 0;
}
/*
Global Blog Footer
*/
#footer {
position: absolute;
bottom: 0px;
width: 100%;
background:#2F333E;
color:#FFFFFF;
padding:10px 0;
}
#footer div{
line-height:30px;
}
#footer a{
color:#FFA31E;
text-decoration:underline;
}
#footer a:hover{
background:#FFA31E;
color:#000000;
text-decoration:none;
}
#footer .quickmenu-icon{
margin:0 10px 0 0;
}
/* page navigation */
#pagenav{
margin-top:1em;
margin-bottom:1em;
}
#pagenav .left{
position:relative;
float:left;
}
#pagenav .right{
position:relative;
float:right;
}
#pagenav a,
#serendipity_comment input[type="submit"]{
position:relative;
display:inline-block;
text-align:center;
border:1px solid #BFBFBF;
text-decoration: none;
color:#505050;
padding:10px 15px;
font-size:15px;
text-transform: uppercase;
font-weight:bold;
background:#FFF;
}
#pagenav .fa-arrow-left{
padding-right:5px;
}
#pagenav .fa-arrow-right{
padding-left:5px;
}
/*
search field
*/
#serendipityQuickSearchTermField{
height: 2em;
width: 15em;
border: 1px solid #595959;
border-radius: 6px;
font-size: 1.2em;
font-family:OpenSansLight, Arial;
padding:0 2em 0 2em;
margin: 1.5em 0 0 0;
}
.serendipity_searchQuery{
background:#FAFF86;
}
i.fa-search {
position: absolute;
color: #A6A6A6;
font-size: 1.2em;
top: 2em;
padding: 0 0.5em;
}
header.main .wrapper {
position: relative;
}
/*
contact form
*/
.input-group {
position: relative;
display: table;
border-collapse: separate;
width:55%;
}
.input-group-addon:first-child {
border-right: 0px none;
}
.input-group .form-control:first-child, .input-group-addon:first-child{
border-bottom-right-radius: 0px;
border-top-right-radius: 0px;
}
.input-group-addon {
padding: 6px 12px;
font-size: 14px;
font-weight: normal;
line-height: 1;
color: #555;
text-align: center;
background: #EEE;
border: 1px solid #CCC;
width: 1%;
white-space: nowrap;
vertical-align: middle;
}
.margin-bottom-sm {
margin-bottom: 5px !important;
display:table;
}
.input-group .form-control:last-child,
.input-group-addon:last-child {
border-bottom-left-radius: 0px;
border-top-left-radius: 0px;
}
.input-group .form-control {
position: relative;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0px;
}
.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857;
color: #555;
background-color: #FFF;
border: 1px solid #CCC;
}
#serendipity_comment textarea{
position:relative;
font-family:OpenSans;
border: 1px solid #CCC;
padding:5px;
width:80%;
max-width: 100%;
min-height:180px;
margin:2% 0;
}
form#serendipity_comment{
margin:25px 0 0 0;
}
.serendipity_comment{
position:relative;
margin:0 0 10px 0;
}
.serendipity_comment.commentlevel-0 { margin-top:35px; }
.commentlevel-1 { padding-left: 1em; }
.commentlevel-2 { padding-left: 2em; }
.commentlevel-3 { padding-left: 3em; }
.commentlevel-4 { padding-left: 4em; }
.commentlevel-5 { padding-left: 5em; }
.commentlevel-6 { padding-left: 6em; }
.commentlevel-7 { padding-left: 7em; }
.commentlevel-8 { padding-left: 8em; }
.commentlevel-9 { padding-left: 9em; }
.serendipity_comment h4{
padding:0;
margin:0;
}
.serendipity_comment .table-cell{
vertical-align:top;
}
.serendipity_comment div.avatar{
position:absolute;
}
#entry-comment .serendipity_comment div.content{
margin-left:75px;
}
.manage_comments{
margin-bottom:25px;
}
#serendipity_comment .form_button{
margin:20px 0 0 0;
}
#serendipity_comment .form_button input{
margin:0 10px 0 0;
}
#contacts{
padding:20px 0 0 0;
}
#contacts div{
padding:2px 0;
}
#serendipity_replyTo{
width: 39%;
height: 30px;
font-size: 14px;
}
.content_msg {
display: none;
}
@media all and (max-device-width: 900px),
all and (max-width: 900px){
.container-centered{
margin:0;
width:100%;
}
#banner-first-line,
#banner-last-line,
#footer{
padding-left: 1em;
padding-right: 1em;
}
.blog-entry,
#entry-comment,
#pagenav{
margin-left: 1em;
margin-right: 1em;
}
.notice-info,
.notice-important,
.notice-success,
.notice-warning,
.input-group,
#serendipity_comment textarea{
width:100%;
}
.notice-noarticle{
margin:40px 1em;
}
}
@media all and (max-device-width: 710px), all and (max-width: 710px){
header.main nav.default {
display: none;
}
header.main div.mobile {
display: block;
}
header.main .banner {
padding-left: 1em;
padding-right: 1em;
}
#banner .quickmenu-icon.non-mobile{
display:none;
}
#footer .quickmenu-icon{
display:block;
}
#banner-last-line .table-cell{
display:inline-block;
width:100%;
}
#banner .right{
text-align: right;
margin-bottom:20px;
}
#serendipityQuickSearchTermField{
width:100%;
}
#banner-last-line nav ul{
text-align: center;
}
#banner nav{
width:100%;
}
#footer div{
height:auto;
min-height:30px;
}
#serendipity_comment input[type="submit"] {
padding:10px 10px;
}
#content{
padding-bottom:230px;
}
.serendipity_image_left{
float: none;
margin: 0 auto 1em auto;
}
header.main nav {
background: #3E4352;
}
header.main nav ul {
padding: 0;
}
header.main nav ul li {
display: block;
margin: 0;
}
header.main a {
color: #D9D9D9;
text-decoration: none;
padding: 0.6em 0;
width: 100%;
border: 0;
border-radius: 0;
display: inline-block;
}
header.main a:hover {
background: #383C4A;
}
}