html {
	background-color: #FFFFFF;
	color: #263238;
	font-size: 100%;
	font-family: 'Roboto Condensed', sans-serif;
	margin: 0;
	min-height: 100%;
	position: relative;
}
body {
	margin: 0 0 2.75rem 0;
	overflow-x: hidden;
    padding: 0px
}

a {
	color: #0D47A1;
	text-decoration: none;
	outline: 0;
}

a:hover {
	color: #1565C0;
	text-decoration: underline;
}

a.deactivated {
    color: #C62828;
}

::selection {
    background-color: #df7e08; color: #000000
}

.strong {
    font-weight: bold;
}

input[type="submit"], button, .btn, .button, select {
	background-color: #FFFFFF;
	border: 0.0625rem solid #CFD8DC;
	border-radius: 0.25rem;
	color: #263238;
	cursor: pointer;
	display: inline-block;
	line-height: 1rem;
	outline: 0;
	padding: .5rem .75rem;
	text-decoration: none;
    font-size: 14px;
}

input {
    font-family: 'Roboto Condensed', sans-serif
}

pre, code {
    font-family: monospace
}

button::-moz-focus-inner, .btn-cancel {
	border: 0;
}

button:hover, .btn:hover, .btn-cancel {
	background-color: #ECEFF1;
	border-color: #B0BEC5;
	text-decoration: none;
}

button .fa, .btn .fa, .btn-cancel {
	margin-right: .25rem;
}

button.btn-primary,
.btn.btn-primary {
    background: #7ec781;
    color: black;
    border-color: #619247;
}

button.btn-primary:hover,
.btn.btn-primary:hover {
    background: #a5dd87;
    border-color: #619247;
    color: black;
}

button.btn-danger, .btn.btn-danger {
	background-color: #D32F2F;
	border-color: #C62828;
	color: #FFEBEE;
}

button.btn-danger:hover, .btn.btn-danger:hover  {
	background-color: #C62828;
	border-color: #B71C1C;
}

button.toggle-button {
    float: right;
    display: block;
}

button.toggle-button.toggled {
    background: #121c2b;
}

button.toggle-button::before {
  display: inline-block;
  font: normal normal normal .875rem/1 fontello;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: 5px;
  width: 14px;
  content: '\f096';
}

button.toggle-button.toggled::before {
  content: '\e819';
}

h3 {
	margin-bottom: .5rem;
}

input[type="text"], input[type="password"], input[type="number"], textarea {
	background-color: #FFFFFF;
	border: 0.0625rem solid #CFD8DC;
	box-sizing: border-box;
	display: block;
	color: #263238;
	font-size: 1rem;
	padding: .375rem .5rem;
	width: 100%;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, textarea:focus {
	border-color: #90A4AE;
	outline: 0;
}

input[type="text"]:disabled, input[type="password"]:disabled, input[type="number"]:disabled, textarea:disabled {
	background-color: #ECEFF1;
}

input[type="checkbox"] {
	outline: 0;
}

textarea {
	resize: vertical;
}

::placeholder {
	color: #90A4AE;
}

.modal {
    background: rgba(0,0,0,.35);
    display: none;
    visibility: hidden;
    position: fixed;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
}

.modal_visible {
    display: block!important;
    visibility: visible!important;
}

.modal_window {
    background: white;
    width: 500px;
    border-radius:5px;
    padding: 5px 15px 15px 15px;
    margin: 0 auto;
}

.modal_x {
    display: block;
    float: right;
    font-size: 22px;
    font-weight: bold;
    cursor: pointer;
}

pre {
	background-color: #ECEFF1;
	border: 0.0625rem solid #CFD8DC;
	margin: .5rem 0;
	overflow: hidden;
	padding: .75rem;
	white-space: pre-wrap;
	word-wrap: break-word;
}

.form-field {
	margin: 0 0 .5rem 0;
}

dl, .infobox {
	color: #455A64;
	font-size: .875rem;
}

dl {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}

dl dt {
    flex: 0 0 150px;
	font-weight: bold;
	width: 5rem;
    height: 19px;
}

dl.attr_larger dt {
    width: 8rem;
}

dl dt::after {
	content: ':';
}
dl dd {
  flex:500 500 80%;
  margin-left: auto;
  text-align: left;
	margin: 0;
    height: 19px;
}

.commit-message {
    overflow: hidden
}

nav, .container {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
header nav .brand {
    display: inline-block;
    float: left;
}

header nav ul {
    display: inline-block;
    float: right;
    margin-right: -.5rem;
    margin: 0;
    padding: 0;
}

header nav ul li {
    display: inline-block;
}

header nav ul li a {
    font-size: 1rem;
    line-height: 1rem;
    padding: 1.1875rem .5rem;
}

header nav .collapse-button {
    display: none;
}

main {
    padding: 0 1.5rem 1.5rem 1.5rem;
}

#confirm-dialog, #input-dialog {
    left: calc(50% - 12.5rem);
    width: 25rem;
}

.block::after {
    content: '';
    display: block;
    clear: both;
}

.block .left-side  {
    display: table;
    float: left;
}

.block .right-side {
    display: table;
    float: right;
}

.block .block-item {
    display: table-cell;
    vertical-align: middle;
}

.block .left-side .block-top-item {
    max-width: 21.875rem;
}

.block-icon {
    width: 2rem;
    font-size: 2rem;
    padding-right: .5rem;
}

.login-form {
    border: 0.0625rem solid #CFD8DC;
    margin: 0 auto;
    padding: .5rem;
    width: 20rem;
}

.login-form form {
    margin-bottom: 0px;
}

/* header */
header {
	background-color: #263238;
	color: #ECEFF1;
	z-index: 1000;
}

header nav::after {
	content: '';
	display: block;
	clear: both;
}

header nav .brand a {
	color: #ECEFF1;
	display: inline-block;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.5rem;
	padding: 0.9375rem 0;
	text-decoration: none;
}

header nav .brand img {
	height: 2.25rem;
	width: auto;
	margin-bottom: -.5625rem;
	margin-right: .125rem;
	margin-top: -.375rem;
}

header nav ul li, {
	list-style: none;
}

header nav ul li.active a, header nav ul li.active a:hover {
	color: #FF9800;
}

header nav ul li a {
	color: #ECEFF1;
	display: block;
	text-decoration: none;
}

header nav ul li a:hover {
	background-color: #37474F;
	color: #B0BEC5;
	text-decoration: none;
}

header nav .collapse-button {
	color: #ECEFF1;
	font-size: 1.5rem;
	line-height: 1.5rem;
	outline: 0;
	padding: 0.9375rem 0 0.9375rem 0;
}

header nav ul li .fa {
	margin-right: .25rem;
}

/* main */
.blur {
	filter: blur(2px);
}

main {
	margin-bottom: 3.75rem;
}

#confirm-dialog, #input-dialog {
	background-color: #FFFFFF;
	border: 0.0625rem solid #CFD8DC;
	box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	display: none;
	padding: .5rem;
	position: fixed;
	top: 4rem;
	z-index: 9999;
}

#confirm-dialog .confirm-icon, #input-dialog .input-icon {
	color: #FF9800;
	float: left;
	font-size: 2rem;
	margin-right: .3125rem;
}

#input-dialog .input-icon {
	color: #33AAFF;
}

#confirm-dialog .confirm-message, #input-dialog .input-message {
	font-weight: 700;
	padding: .5rem 0 1rem 0;
}

#confirm-dialog .confirm-buttons, #input-dialog .input-buttons {
	border-top: 0.0625rem solid #CFD8DC;
	padding-top: .5rem;
	text-align: right;
}

#input-dialog .input-text {
	margin: 1rem 0;
}

#confirm-overlay, #input-overlay {
	background-color: rgba(38, 50, 56, 0.3);
	bottom: 0;
	display: none;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 9000;
}

.toolbar {
	margin: 0;
	padding: 0;
	float: right;
}

.toolbar li {
	display: inline-block;
	list-style: none;
	margin: 0;
	position: relative;
}

.toolbar li a {
	display: block;
	padding: .25rem .5rem;
}

.toolbar li a:hover {
	background-color: #ECEFF1;
	display: block;
	text-decoration: none;
}

.toolbar li:last-child {
	margin-right: 0;
}

.toolbar li .fa {
	color: #455A64;
	margin-right: .25rem;
	min-width: 0.6875rem;
}

.toolbar li .fa.fa-clone {
	font-size: .8125rem;
}

.toolbar li .dropdown-menu {
	background: #FFFFFF;
	border: 0.0625rem solid #CFD8DC;
	box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	display: none;
	margin-top: .5rem;
	min-width: 12rem;
	padding: .25rem 0;
	position: absolute;
	right: 0;
	z-index: 10;
}

.toolbar li .dropdown-menu a {
	display: block;
	font-size: .9375rem;
	padding: .25rem .5rem;
}

.toolbar li .dropdown-menu a:hover {
	background-color: #ECEFF1;
	display: block;
	text-decoration: none;
}

.toolbar li .dropdown-menu::before, .toolbar li .dropdown-menu::after  {
	border: .5rem solid transparent;
	bottom: 100%;
	content: "";
	display: block;
	height: 0;
	position: absolute;
	right: .5rem;
	width: 0;
}

.toolbar li .dropdown-menu::before {
	border-bottom-color: #CFD8DC;
}

.toolbar li .dropdown-menu::after {
	border-bottom-color: #FFFFFF;
	margin-bottom: -1px;
}

.toolbar li.install_next > a {
    color: #c0c0c0;
}

.toolbar li.install_current > a {
    color: #df7e08 
}


.block-link, .block-link:hover, .block a, .block a:hover {
	color: #263238;
	text-decoration: none;
}

.block {
	border: 0.0625rem solid #CFD8DC;
	display: block;
	margin-bottom: .5rem;
	padding: .5rem;
	font-size: 1rem;
	line-height: 1rem;
}

a .block:hover, .block-link .block:hover {
	background-color: #ECEFF1;
}

.block-icon .fa.fa-check-circle {
	color: #4CAF50;
}

.block-icon .fa.fa-times-circle {
	color: #F44336;
}

.block-icon .fa.fa-stop-circle {
	color: #FF9800;
}

.block-icon .fa.fa-wait-spin, .block-icon .fa.fa-cog {
	color: #2196F3;
}

.block-icon .fa.fa-spin {
	-webkit-animation: spin 4s linear infinite;
	-moz-animation: spin 4s linear infinite;
	animation: spin 4s linear infinite;
}

.block-icon .fa.fa-clock-o {
	color: #263238;
}

.block-icon .fa.fa-share-alt, .block-icon .fa.fa-user, .block-icon .fa.fa-file-o, .block-icon .fa.fa-folder-o {
	color: #B0BEC5;
}
.fa.fa-superuser {
    color: #272828;
}
.block .block-build-number {
	width: 4rem;
}

.block .left-side .block-top-item, .block .block-single-line .block-top-item {
	display: block;
	font-weight: 700;
	margin-bottom: .5rem;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.block .left-side .block-bottom-item.additional {
	padding-left: 1rem;
}

.dl_float > dd, .dl_float > dt {
    height: initial;
}

.block .right-side .block-top-item {
	display: block;
	font-size: 0.875rem;
	margin-bottom: .5rem;
}

.block-bottom-item {
	display: block;
	font-size: 0.875rem;
}

.block .right-side .block-item:first-child {
	width: 12rem;
}

.block .block-fa .fa {
	margin-right: .25rem;
}

.btn-newer {
	float: left;
}

.btn-newer .fa {
	margin: 0 .25rem 0 0;
}

.btn-older {
	float: right;
}

.btn-older .fa {
	margin: 0 0 0 .25rem;
}

.block-buttons {
	text-align: right;
	font-size: 0;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

.block-buttons .btn:first-child {
	margin-left: 0;
}

.block-buttons .btn {
	margin-left: 0.25rem;
}

.block-buttons .btn .fa {
	margin-right: 0;
}

.paging {
    text-align: center
}

.page-btn {
	background-color: #FFFFFF;
	border: 0.0625rem solid #CFD8DC;
	border-radius: 0.25rem;
	color: #263238;
	cursor: pointer;
	display: inline-block;
	line-height: 1rem;
	outline: 0;
	padding: .5rem .75rem;
	text-decoration: none;
    font-size: 14px;
}

.page-this {
	background-color: #ECEFF1;
	border-color: #B0BEC5;
	text-decoration: none;
}

.messages {
	background-color: #ECEFF1;
	border: 0.0625rem solid #B0BEC5;
	clear: both;
	display: block;
	margin-bottom: 1rem;
	padding: .5rem;
}

.messages::after {
	content: '';
	display: block;
	clear: both;
}

.messages .icon {
	float: left;
}

.messages .close {
	float: right;
	font-size: .8725rem;
	opacity: 0.3;
}

.messages .close:hover {
	opacity: 0.6;
}

.messages div {
	display: block;
	margin: 0 1.5rem;
}

.messages.error {
	background-color: #FFEBEE;
	border-color: #EF9A9A;
	color: #C62828;
}

.messages.error a {
	color: #C62828;
}

.messages.info {
	background-color: #E3F2FD;
	border-color: #90CAF9;
	color: #1565C0;
}

.messages.info a {
	color: #1565C0;
}

.messages.success {
	background-color: #E8F5E9;
	border-color: #A5D6A7;
	color: #2E7D32;
}

.messages.success a {
	color: #2E7D32;
}

.login-form .login-header {
	border-bottom: 0.0625rem solid #CFD8DC;
	display: block;
	font-weight: 700;
	margin-bottom: .75rem;
	padding-bottom: .75rem;
}

.login-session {
	padding: 0.5em;
	border: 1px solid grey;
	border-bottom: none;
	background-color: #e4f4ff;
}
.login-session:last-child {
	border-bottom: 1px solid grey;
}
.login-session.expired {
	background-color: #ddd;
	color: gray;
}
.login-session-ip {
	font-weight: bold;
}
.login-session-date {
	font-size: 80%;
}

.field {
	margin: .5rem 0;
}

.api_detail {
    display: none;
    visibility: hidden;
}

.api_detail_shown {
    display: block!important;
    visibility: visible!important;
}

.hidden {
    display: none!important;
    visibility: none!important;
}

.oneline > input[type="text"] {
    width: 75%;
    display: inline-block;
}

.oneline > input[type="submit"] {
    display: inline-block;
    float: right;
}

.field.required label::after {
	color: #C62828;
	content: '*';
	display: inline-block;
	font-size: .875rem;
	margin-left: .25rem;
}

.field label {
	display: block;
	font-weight: 700;
	margin-bottom: .25rem;
}

.field label.checkbox {
	font-weight: normal;
}

.field .infobox {
	margin-bottom: .5rem;
}

.fa .fa-wait-spin {
	-webkit-animation: spin 1s linear infinite;
	-moz-animation: spin 1s linear infinite;
	animation: spin 1s linear infinite;
}

.auth_header > h3 {
    display: inline-block;
}

.auth_attribute {
    margin: 0px 3px;
	font-size: .875rem;
	color: #455A64;
}

.oauth {
    width: 48px; height: 38px;
    background-repeat: no-repeat!important;
    background-position-y: -5px!important;
}

.oauth-gitea {
    background: url('/static/img/gitea.png');
}

.oauth-gitlab {
    background: url('/static/img/gitlab.png');
}

.oauth-gogs {
    background: url('/static/img/gogs.png');
}

.oauth-github {
    background: url('/static/img/github.png');
}

.oauth-gitbucket {
    background: url('/static/img/gitbucket.png');
}

.oauth-bitbucket {
    background: url('/static/img/bitbucket.png');
}

.dashboard-icons {
    width: 110px;
    text-align: right
}
.dashboard-icons a {
    margin: 0px 5px;
    font-size: 26px;
}

.service-icon {
    height: 16px;
}

.integration-list {
    list-style: none;
    padding-left: 0px;
}

.integration-list pre {
    padding-left: 15px;
}

#repo_check_result {
	display: block;
	margin-left: .25rem;
}

#repo_check_result .fa {
	margin-right: .25rem;
}

#repo_check_result .fa.fa-check {
	color: #4CAF50;
}

#repo_check_result .fa.fa-times {
	color: #F44336;
}

#repo_check_result .fa.fa-wait-spin {
	color: #2196F3;
}

#repo_build_script {
	min-height: 10rem;
}

.repo_code {
    font-size: 12px
}

.repo-state-finished, .copybtn-success {
    color: #4CAF50;
}

.repo-state-failed, .copybtn-failed {
    color: #F44336
}

.repo-state-building, .repo-state-enqueued, .repo-state-started {
    color: #2196F3
}

#override_content {
	min-height: 20rem;
}

/* footer */
footer {
	background-color: #ECEFF1;
	bottom: 0;
	color: #455A64;
	font-size: 0.75rem;
	left: 0;
	line-height: 0.75rem;
	overflow: hidden;
	position: absolute;
	width: 100%;
	z-index: 1000;
}

footer ul {
    padding: 0px
}

footer li {
	display: inline-block;
	list-style: none;
	margin: 0 20px 0 0;
	position: relative;
}

@-moz-keyframes spin {
	100% {
		-moz-transform: rotate(360deg);
	}
}

@-webkit-keyframes spin {
	100% {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes spin {
	100% {
		-webkit-transform: rotate(360deg);
		transform:rotate(360deg);
	}
}

.copybtn {
    padding: 3px;
    font-size: 12px;
    margin-left: 10px;
    width: 22px;
}

@media (prefers-color-scheme: dark) {
    html {
        background: #162228;
    }
    h1,h2,h3,h4,p,strong,em,b,i,font,a,small,dt,ul,li,div,span {
        color: white;
    }
    .messages.info {
        background-color: #173F5C;
        border-color: #3D607E;
    }
    .messages.error {
        background: #501618;
        border-color: #601a1f;
    }
    .toolbar li .fa {
        color: #c0c0c0;
    }
    .toolbar li a:hover {
        background: #1c2a33
    }
    pre {
        background: black;
        border-color: #869298;
    }
    .login-form, .login-form .login-header {
        border-color: #869298;
    }
    .block a {
        color: white;
    }
    a:hover {
        color: #8EBCF0;
    }
    .button a:hover {
        color: white
    }
    input[type="submit"], button, .btn, .button {
        background: #424c5b;
        border: 1px solid #303c42;
        color: white
    }
    input[type="submit"]:hover, button:hover, .btn:hover, .button:hover {
        color: white;
        text-decoration: underline;
        background: #525c6b;
    }
    .block-item .fa,
    .block-icon .fa.fa-clock-o {
        color: #B0BEC5;
    }
    .block {
        background: 465;
        border: 1px solid #869298;
    }
    .block-link .block:hover {
        background: #263238;
    }
    .block-link:hover, .block a:hover {
        color: white;
    }
    input[type="text"]:disabled,
    input[type="password"]:disabled,
    input[type="number"]:disabled,
    textarea:disabled {
        background: #162328;
        color: 768288;
    }
    input[type="text"],
    input[type="password"],
    input[type="number"],
    textarea{
        background: #263238;
        color: white;
        border: 1px solid #869298;
    }
    dl, dd,dt, .infobox, .auth_attribute {
        color: #E1E0E0;
    }
    .modal_window {
        background: black;
    }
    footer {
        background: #263238;
    }
}