Files
databap/style/screen.css

2580 lines
42 KiB
CSS

/* Colors */
/*
SAP blue : #04357B
SAP New blue : #0C8BCE
SAP orange : #EFAB00
SAP bright blue : #D9E5F2
*/
/* General */
/* General - Standard Tags */
body, html {
background:white;
font-family:Verdana, Arial;
color:#04357B;
background:#04357B;
padding:0;
margin:0;
min-width:1024px;
}
table {
border:none;
background:none;
text-align:center;
margin:0;
padding:0;
border-spacing:0;
}
table td {
padding:0;
}
input, textarea, select {
font-family:Verdana, Arial;
font-size:12px;
background:none;
border:none;
}
input[type=text], input[type=password] {
border:2px solid #04357B;
padding:5px;
width:200px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=password]:hover, input[type=text]:hover, input[type=text]:focus {
background-color:#EFAB00;
}
input[disabled="disabled"], textarea[disabled="disabled"], input:disabled, textarea:disabled {
background-color:#D9E5F2;
border-color:#D9E5F2;
border:2px solid #04357B;
}
input[disabled="disabled"]:hover, textarea[disabled="disabled"]:hover, input:disabled:hover, textarea:disabled:hover {
background-color:#D9E5F2;
}
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {
border: none;
}
input[type=button], .clickable {
cursor:pointer;
}
select {
background:white;
border:2px solid #04357B;
padding:5px;
color:#04357B;
margin:0;
}
textarea {
min-height:30px;
}
input, select, textarea, h1, h2, h3, h4, p, a {
color:#04357B;
}
p {
margin:0;
padding:0;
}
a, a:visited {
text-decoration:none;
}
a:active, a:focus, input:active, input:focus {
outline: none;
}
img {
border:none;
}
/* General - Classes */
.round_top {
-moz-border-radius:10px 10px 0 0;
-webkit-border-radius:10px 10px 0 0;
-khtml-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
.round_bottom {
-moz-border-radius:0 0 10px 10px;
-webkit-border-radius:0 0 10px 10px;
-khtml-border-radius:0 0 10px 10px;
border-radius:0 0 10px 10px;
}
.round_right {
-moz-border-radius:0 10px 10px 0;
-webkit-border-radius:0 10px 10px 0;
-khtml-border-radius:0 10px 10px 0;
border-radius:0 10px 10px 0;
}
.round_left {
-moz-border-radius:10px 0 0 10px;
-webkit-border-radius:10px 0 0 10px;
-khtml-border-radius:10px 0 0 10px;
border-radius:10px 0 0 10px;
}
.round_bottom_left {
-moz-border-radius:0 0 0 10px;
-webkit-border-radius:0 0 0 10px;
-khtml-border-radius:0 0 0 10px;
border-radius:0 0 0 10px;
}
.round {
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
border-radius:10px;
}
.tiny_round {
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
border-radius:5px;
}
.tiny_top_right {
-moz-border-radius:5px 0 5px 5px;
-webkit-border-radius:5px 0 5px 5px;
-khtml-border-radius:5px 0 5px 5px;
border-radius:5px 0 5px 5px;
}
.inc_border {
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
.loading {
font-size:20px;
margin:5px;
text-align:center;
}
.error, .warning, .success {
margin:10px 0;
border-width:1px;
border-style:solid;
padding:3px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
border-radius:5px;
clear:both;
}
.error a, .warning a, .success a {
text-decoration: underline;
}
.error, .error a {
color:red;
border-color:red;
font-size:14px;
font-weight:bold;
}
.warning, .warning a {
color:orange;
border-color:orange;
font-size:13px;
font-style:italic;
}
.success, .success a {
color:green;
border-color:green;
font-size:13px;
}
.title {
font-weight:bold;
font-size:30px;
text-transform:uppercase;
letter-spacing:-4px;
}
.default_text {
color:#D9E5F2 !important;
}
a.button {
padding:7px;
margin-right:5px;
background:#D9E5F2;
font-size:12px;
cursor:pointer;
border:1px solid #04357B;
/*position:relative;*/
display:inline-block;
}
a.button:hover {
background-color:#EFAB00;
}
a.button:active {
background-color:#04357B;
color:white;
}
a.button .fa {
margin-right:5px;
/* .fa-60 */
font-size: 1.6666666666666666em;
line-height: 0.50em;
vertical-align: -30%;
}
a.button.strong .value {
font-weight:bold;
}
a.button.inverse {
background-color:#04357B;
color:#D9E5F2;
}
a.button.inverse:hover {
background-color:#EFAB00;
color:#04357B;
}
a.button.heavy {
border-width:2px;
font-weight:bold;
}
.addr {
cursor:text;
}
.addr:hover {
background-color:white;
}
.maximized {
width:100%;
}
.righty {
text-align:right;
}
.glue-right {
float: right;
}
.lefty {
text-align:left;
}
.side_margins {
margin:0 12px 10px;
}
a.internal_link {
text-decoration:underline;
font-style:normal;
background:#D9E5F2;
padding:1px 8px 1px 5px;
margin:0;
}
a.internal_link:visited, a.external_link:visited {
color:grey;
}
.h1_wrap h1 {
margin:0 -12px 12px;
padding:12px 10px;
width:100%;
border:2px solid #04357B;
background-color:#D9E5F2;
font-family:Arial;
font-size:32px;
line-height:32px;
font-style:italic;
font-weight:600;
}
.author_box {
padding:5px 10px;
border:1px solid #04357B;
color:#04357B;
font-style:italic;
font-size:12px;
}
.author_box:nth-child(odd) {
background:#DCF2FB;
}
.author_box:nth-child(even) {
background:#D9E5F2;
}
.author_box:hover {
border-color:#EFAB00;
}
.author_box a {
background:none;
padding:0;
display:block;
width: 100%;
}
.author_box i.fa-30 {
vertical-align: -5%;
}
.author_box span.description {
font-weight:bold;
font-style:normal;
font-size:13px;
}
.standalone .author_box {
margin-top:10px;
}
.standalone .author_box:hover {
color:#EFAB00;
}
.hide, .mobile {
display:none;
}
/* Step Box */
.step_box {
margin-top:5px;
margin-bottom:5px;
padding:10px;
background:#D9E5F2;
color:#04357B;
border: 2px solid #04357B;
}
.step_box input, .step_box textarea, .step_box select {
margin-top:10px;
background:white;
font-size:14px;
border-width:1px;
}
.step_box input:disabled, .step_box textarea:disabled, .step_box select:disabled, .step_box input:hover:disabled, .step_box textarea:hover:disabled, .step_box select:hover:disabled {
background-color:white;
}
.step_box input[type=text], .step_box textarea {
width:100%;
}
.step_box textarea {
height:200px;
padding:5px;
background:white;
border:1px solid #04357B;
}
.step_box .step_nb_box, .step_box .step_box_title {
border-bottom:1px solid #04357B;
padding:0;
}
/* Scrollbar */
.scrollbar_box {
position:relative;
height:0px;
overflow:hidden;
}
.scrollbar_box .scrollbar_subbox {
position:absolute;
left:0;
top:0;
width:100%;
}
.scrollbar {
position:relative;
float:right;
width:15px;
margin-left:5px;
}
.scrollbar .thumb, .scrollbar .thumb .end {
background-color:#04357B;
width:13px;
}
.scrollbar .track {
background-color:#D9E5F2;
height:100%;
width:13px;
position:relative;
padding:0;
}
.scrollbar .thumb {
position:absolute;
top:0;
overflow:hidden;
}
.scrollbar .thumb .end {
overflow:hidden;
height:20px;
}
.disable {
display:none;
}
/* Uploader */
.uploader_box {
position:relative;
width:100%;
}
.uploader_droparea {
position:absolute;
top:-10px;
left:0;
width:100%;
height:100%;
height:210px;
z-index:2;
border:1px solid #04357B;
background:white;
text-align:center;
}
.uploader_droparea-active {
background:#EFAB00;
}
.uploader_droparea span {
display:block;
position:absolute;
top:50%;
width:100%;
margin-top:-8px;
font-size:16px;
}
.uploader_buffer {
width:100%;
height:8px;
}
.uploader_list {
/*margin:0;*/margin-top:0;
padding:0;
list-style:none;
}
.uploader_list li {
margin:0 0 10px 10px;
}
.uploader_item_file, .uploader_item_loading, .uploader_item_size, .uploader_item_cancel, .uploader_item_failed {
margin-right:5px;
}
.uploader_item_size, .uploader_item_cancel {
font-size:12px;
font-weight: normal;
}
a.uploader_item_cancel {
text-decoration:underline;
color:#04357B;
}
.uploader_box .image_description {
border-width:1px;
padding:3px 5px;
background:white;
}
.uploader_box .image_action {
font-size:12px;
}
.uploader_box .image_action input {
width:200px;
margin:0;
}
.uploader_item_failed_notice {
display:none;
}
.uploader_item_failed .uploader_item_failed_notice {
display:inline;
}
.uploader_item_failed {
color:red;
}
.uploader_item_success .fa-c-delete:hover, .uploader_item_cancel .fa-c-delete:hover {
color:#EFAB00;
}
/* Font Awesome */
.fa-inline {
margin-right:5px;
}
/*
size +0% +10% +20% +30% +40% +50% +60%
font-size 1em 1.111em 1.222em 1.333em 1.444em 1.555em 1.666em
line-height 1em 0.917em 0.833em 0.750em 0.666em 0.583em 0.500em
vertical-align 0% -5% -10% -15% -20% -25% -30%
*/
.fa-10 {
font-size: 1.1111111111111111em;
line-height: 0.9166666666666666em;
vertical-align: -5%;
}
.fa-20 {
font-size: 1.2222222222222222em;
line-height: 0.8333333333333333em;
vertical-align: -10%;
}
.fa-30 {
font-size: 1.3333333333333333em;
line-height: 0.75em;
vertical-align: -15%;
}
.fa-40 {
font-size: 1.4444444444444444em;
line-height: 0.6666666666666666em;
vertical-align: -20%;
}
.fa-60 {
font-size: 1.6666666666666666em;
line-height: 0.5em;
vertical-align: -30%;
}
.fa-c-c:before, .fa-c-code:before {
content: "\f121";
}
.fa-c-procedure:before, .fa-c-proc:before, .fa-c-p:before {
content: "\f0cb";
}
.fa-c-table:before, .fa-c-t:before {
content: "\f0ce";
}
.fa-c-documentation:before, .fa-c-doc:before, .fa-c-d:before {
content: "\f15b";
}
.fa-c-article:before, .fa-c-art:before, .fa-c-a:before {
content: "\f14c";
}
.fa-c-list {
color:#04357B;
}
.fa-c-list:before {
content: "\f02d";
}
.fa-c-profile {
color:#04357B;
}
.fa-c-profile:before {
content: "\f007";
}
.fa-c-chat {
color:#04357B;
}
.fa-c-chat:before {
content: "\f086";
}
.fa-c-news:before {
content: "\f0e7";
}
.fa-c-afk:before {
content: "\f017";
}
.fa-c-comment {
color:#04357B;
}
.fa-c-comment:before {
content: "\f075";
}
.fa-c-options {
color:#04357B;
}
.fa-c-options:before {
content: "\f085";
}
.fa-c-param:before {
content: "\f1de";
}
.fa-c-wip:before {
content: "\f013";
}
.fa-c-rss {
color:#04357B;
}
.fa-c-rss:before {
content: "\f09e";
}
.fa-c-logmeout {
color:#04357B;
}
.fa-c-logmeout:before, .fa-c-logout:before {
content: "\f08b";
}
.fa-c-fold {
color:#04357B;
}
.fa-c-fold:before {
content: "\f191";
}
.fa-c-warning {
color:#EFAB00;
}
.fa-c-warning:before, .warning .fa:before {
content: "\f071";
}
.fa-c-error {
color:red;
}
.fa-c-error:before, .error .fa:before {
content: "\f071";
}
.fa-c-search:before {
content: "\f002";
}
.fa-c-welcome:before {
content: /*"\f087"*/"\f015";
}
.fa-c-ok:before, .available .fa:before, .success .fa:before {
content: "\f00c";
}
.fa-c-ko {
color:red;
}
.fa-c-ko:before, .unavailable .fa:before {
content: "\f00d";
}
.fa-c-loading:before {
content: "\f110";
}
.fa-c-edit:before {
content: "\f040";
}
.fa-c-save:before {
content: "\f0c7";
}
.fa-c-raw:before {
content: "\f15c";
}
.fa-c-print:before {
content: "\f02f";
}
.fa-c-share:before {
content: "\f0ac";
}
.fa-c-refresh:before, .fa-c-switch:before {
content: "\f021";
}
.fa-c-plus:before, .fa-c-add:before {
content: "\f055";
}
.fa-c-minus:before, .fa-c-delete:before {
content: "\f056";
}
.fa-c-up:before {
content: "\f01b";
}
.fa-c-down:before {
content: "\f01a";
}
.fa-c-next:before {
content: "\f054";
}
.fa-c-prev:before {
content: "\f053";
}
.fa-c-close:before {
content: "\f05c";
}
.fa-c-desc:before {
content: "\f05a";
}
.fa-c-company:before {
content: "\f0f7";
}
.fa-c-name:before {
content: "\f02b";
}
.fa-c-assignment:before {
content: "\f0b1";
}
.fa-c-lock:before {
content: "\f023"/*"\f084"*/;
}
.fa-c-search:before {
content: "\f002";
}
.fa-c-mail:before {
content: "\f0e0";
}
.fa-c-upcoming:before {
content:"\f135";
}
.fa-c-changelog:before {
content:"\f0d0";
}
.fa-c-checked:before {
content:"\f046";
}
.fa-c-unchecked:before {
content:"\f096";
}
.fa-c-kpi:before {
content:"\f0e4";
}
.fa-c-file-xls, .fa-c-file-xlsx {
color:#247648;
}
.fa-c-file-xls:before, .fa-c-file-xlsx:before {
content: "\f1c3";
}
.fa-c-file-doc, .fa-c-file-docx {
color:#2B5796;
}
.fa-c-file-doc:before, .fa-c-file-docx:before {
content: "\f1c2";
}
.fa-c-file-ppt, .fa-c-file-pptx {
color:#D04423;
}
.fa-c-file-ppt:before, .fa-c-file-pptx:before {
content: "\f1c4";
}
.fa-c-file-pdf {
color:#D20F0B;
}
.fa-c-file-pdf:before {
content: "\f1c1";
}
.fa-c-file-zip:before {
content: "\f1c6";
}
.fa-c-file-png:before, .fa-c-file-gif:before, .fa-c-file-jpg:before, .fa-c-file-jpeg:before {
content: "\f1c5";
}
/* Lightbox */
.lightboxOverlay {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
background-color:white;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
opacity: 0.8;
display: none;
}
.lightbox {
position: absolute;
left: 0;
width: 100%;
z-index: 10000;
text-align: center;
line-height: 0;
font-weight: normal;
}
.lightbox .lb-image {
display: block;
height: auto;
max-width: inherit;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
}
.lightbox a img {
border: none;
}
.lb-outerContainer {
position: relative;
background-color: #04357B;
*zoom: 1;
width: 250px;
height: 250px;
margin: 0 auto;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
}
.lb-outerContainer:after {
content: "";
display: table;
clear: both;
}
.lb-container {
padding: 4px;
}
.lb-loader {
position: absolute;
top: 43%;
left: 0;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
.lb-cancel {
display: block;
width: 32px;
height: 32px;
margin: 0 auto;
font-size:32px;
color:#D9E5F2;
}
.lb-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
.lb-container > .nav {
left: 0;
}
.lb-nav a {
outline: none;
background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}
.lb-prev, .lb-next {
height: 100%;
cursor: pointer;
display: block;
}
.lb-nav a.lb-prev {
width: 34%;
left: 0;
float: left;
text-align:left;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: opacity 0.6s;
-moz-transition: opacity 0.6s;
-o-transition: opacity 0.6s;
transition: opacity 0.6s;
}
.lb-nav a.lb-prev:hover {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
.lb-nav a.lb-next {
width: 64%;
right: 0;
float: right;
text-align:right;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: opacity 0.6s;
-moz-transition: opacity 0.6s;
-o-transition: opacity 0.6s;
transition: opacity 0.6s;
}
.lb-nav a.lb-next:hover {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
.lb-prev .fa, .lb-next .fa {
position:relative;
top:50%;
font-size: 45px;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
color:#04357B;
padding: 0 20px;
}
.lb-prev .fa {
text-shadow: -1px 2px 1px #D9E5F2;
}
.lb-next .fa {
text-shadow: 1px 1px 1px #D9E5F2;
}
.lb-dataContainer {
margin: 0 auto;
padding-top: 5px;
*zoom: 1;
width: 100%;
-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
border-bottom-left-radius: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.lb-dataContainer:after {
content: "";
display: table;
clear: both;
}
.lb-data {
padding: 0 4px;
color:#04357B;
}
.lb-data .lb-details {
width: 85%;
float: left;
text-align: left;
line-height: 1.1em;
}
.lb-data .lb-caption {
font-size: 13px;
font-weight: bold;
line-height: 1em;
}
.lb-data .lb-number {
display: block;
clear: left;
padding-bottom: 1em;
font-size: 12px;
color:#04357B;
}
.lb-data .lb-close {
display: block;
float: right;
width: 30px;
height: 30px;
font-size:30px;
color:#04357B;
text-align: right;
outline: none;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
opacity: 0.7;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
-o-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.lb-data .lb-close:hover {
cursor: pointer;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
/* Container */
#container {
background:#04357B;
padding:10px 10px 1px;
}
/* Logon */
#logon .logo {
width:auto;
height:auto;
text-transform:uppercase;
position:absolute;
top:0;
left:0;
padding:10px 10px 10px 35px;
margin:0;
border-bottom:3px solid white;
font-weight:bold;
color:white;
font-size:35px;
line-height:35px;
text-decoration: none;
background:url(../images/logo_25.png) 10px 50% no-repeat;
}
#logon .container {
position:fixed;
top:50%;
left:50%;
margin-left:-230px; /* -(68+10*2+160+200+5*2+1*2)/2 */
margin-top:-65px; /* -(10*2+20*4+20*2+20+2*2+1*2)/2 */
}
#logon .box {
background:white;
overflow:hidden;
position:relative;
/*width:464px;
height:140px;*/
}
#logon .box .key {
position:absolute;
height:100%;
width:68px;
background:#D9E5F2;
}
#logon .box .fa {
position:absolute;
top:50%;
left:50%;
text-align:center;
color:#04357B;
line-height:50px;
font-size:50px;
width:50px;
margin-left:-25px;
margin-top:-25px;
}
#logon .box table {
margin-left:68px;
padding:10px;
}
#logon .box table td {
padding:0;
text-align:left;
font-size:18px;
color:#04357B;
}
#logon .box table td.desc {
width:160px;
line-height:20px;
padding:10px 0;
}
#logon .box table td.validate {
text-align:right;
}
#logon .box .feedback {
float:left;
font-size:14px;
margin-top:5px;
font-style:italic;
color:red;
}
#logon .box input {
border:1px solid #04357B;
color:#04357B;
font-size:18px;
line-height:20px;
padding:2px 5px;
width:200px;
}
#logon .box input[type=button] {
width:auto;
}
#logon #footer {
position:fixed;
bottom:0;
width:100%;
}
#logon .logon_msg {
margin-top:10px;
padding:5px;
color:white;
text-align:center;
font-size: 0.75em;
border:1px solid white;
}
#logon .logon_msg span {
display:block;
margin-top:5px;
}
#logon .logon_msg span.msg_title {
margin-top:0;
text-decoration:underline;
}
/* Header */
#header {
padding:0 0 10px 0;
margin:0;
}
#header table td.cell {
width:50%;
height:35px;
margin:0;
}
.logo {
position:absolute;
top:9px;
width:200px;
height:35px;
margin-left:36px;
}
#query, #search_btn_submit {
height:25px;
color:#04357B;
border:none;
float:right;
padding:0 10px;
font-size:15px;
}
#query {
background:white;
width:250px;
}
#search_btn_submit {
background:#D9E5F2;
border-left:2px solid #04357B;
height:20px;
padding-top:5px;
}
#search_btn_submit:hover {
background-color:#EFAB00;
}
/* Main */
#main_container {
background:white;
/*padding:10px;*/
margin-left:30px;
position:relative;
overflow:hidden;
border:10px solid white;
}
#page_title {
margin-bottom:10px;
}
#main {
margin:0;
padding:0;
overflow:hidden;
}
/* Menu */
#menu {
position:absolute;
background:white;
width:20px;
padding:10px 0;
z-index:10;
border-right:0 solid #04357B;
}
#menu #menu_title {
position:relative;
text-align:center;
margin:0;
margin-top:-4px;
padding:0;
cursor:pointer;
}
#menu #menu_title:hover p {
color:#EFAB00;
}
#menu #menu_title p {
margin:0;
padding:0;
font-size:20px;
line-height:20px;
font-weight:bold;
text-transform:uppercase;
color:#04357B;
}
#menu #menu_box {
display:none;
color:#04357B;
text-align:center;
}
#menu #menu_box a {
color:#04357B;
display:block;
width:100%;
}
#menu #menu_box h1 {
margin:-10px 0 0 -3px;
padding:0;
border-bottom:2px solid #04357B;
}
#menu #menu_box ul {
margin:0;
padding:0;
text-align:left;
font-size: 20px;
list-style:none;
}
#menu #menu_box ul li {
margin:0;
padding:5px 3px 5px 5px;
list-style:none;
cursor:pointer;
line-height:20px;
height:20px;
font-size:20px;
border-bottom:2px solid white;
}
#menu #menu_box ul li:hover {
border-bottom-color:#04357B;
background-color:#EFAB00;
}
#menu #menu_box ul li#rss_ln a {
color:#04357B;
}
#menu #menu_box ul li#quick_code_access_ln input {
border:2px solid #04357B;
width:60px;
padding:0 5px;
font-size:16px;
color:#04357B;
}
#menu #menu_box ul li .fa {
margin-right:5px;
}
#menu .useless_button {
width:0;
height:0;
position:absolute;
bottom:5px;
left:5px;
border:5px solid #04357B;
}
/* Welcome */
#welcome #welcome_container {
border:2px solid #04357B;
background:#D9E5F2;
padding:10px;
}
#welcome p.welcome_text {
font-weight:bold;
padding-top:0;
padding-bottom:5px;
border-bottom:1px solid #000000;
margin-bottom:20px;
}
#welcome #welcome_container ul {
margin-top:0px;
}
#welcome #welcome_container ul li {
font-size:13px;
margin-top:10px;
font-weight: bold;
}
#welcome #welcome_container ul li ul {
font-size:12px;
margin-top:2px;
}
#welcome #welcome_container ul li ul li {
font-weight:normal;
}
#welcome #welcome_container ul li:FIRST-CHILD, #welcome #welcome_container ul li ul li {
margin-top:0px;
}
#welcome a {
text-decoration:underline;
}
/* Add Code */
#add_code_container, #add_code_container input {
font-size:14px;
}
#add_code_container table {
text-align:left;
}
#add_code_container table tr td {
padding:5px 5px 5px 0;
}
#add_code_container table tr td:first-child {
font-weight: bold;
}
#add_code_container table tr td.last {
padding-bottom:0px;
}
#add_code_container textarea, #edit_container textarea {
margin:0 -10px;
padding:10px 6px 10px 10px;
width:100%;
border:2px solid #04357B;
min-height:100px;
height:300px;
font-family:courier;
color:black;
font-size:14px;
}
#add_code_container .loggued {
margin:0 12px;
}
#add_code_container input[type=text] {
border:2px solid #04357B;
width:400px;
padding:5px;
color:#04357B;
}
#auth_company_container {
display:none;
}
#add_code_container #add_code_btn {
margin-top:10px;
float:left;
}
#add_code_container input:hover, #add_code_container input[type=text]:focus {
background-color:#EFAB00;
}
#link_result, #available_phrase {
display:none;
border:2px solid;
margin-left:15px;
padding:5px;
font-size:14px;
}
#link_result {
color:#04357B;
border-color:#04357B;
}
#available_phrase {
display:none;
}
#available_phrase.available {
color:green;
border-color:green;
}
#available_phrase.unavailable {
color:red;
border-color:red;
}
/* read code */
#reader {
margin:0;
padding:0;
}
#reader #code_menu {
padding:0;
margin:0;
}
#code_container .code_reader {
margin:10px 0 0 0;
border:2px solid #04357B;
padding:0;
background:#b5b5c6;
background:#04357B;
}
#reader #code_container .code_reader {
margin:0;
}
#code_container .code_reader ol li ::selection {
background:#306897;
color:#FFFFFF;
}
#code_container .code_reader ol li ::-moz-selection {
background:#306897;
color:#FFFFFF;
}
#code_container .code_reader .author_box {
background:#04357B;
border:none;
color:white;
}
#code_container .code_reader .author_box * {
color:white;
}
#code_container .code_reader .tab_left {
/* margin: -13px 0; */
margin:0;
padding: 0 0 0 19px;
background:#f7efde;
border:none;
}
#code_container .code_reader ol {
border-left: 1px solid #848484;
background:white;
margin:0;
/*list-style-type:decimal-leading-zero;*/
}
#code_container .code_reader ol li {
/*margin:-1px 0 0 0;*/
margin:0;
padding:0;
border-left:1px dotted #398c8c;
background:white;
font-family:Courier New, Courier;
font-size:12px;
line-height:12px;
text-indent:20px;
color:#398c8c;
}
#code_container .code_reader ol li:first-child, #code_container .code_reader ol li:first-child span.expand_line {
padding-top:5px;
}
#code_container .code_reader ol li.bigline, #code_container .code_reader ol li.bigline span.expand_line {
padding-top:5px;
padding-bottom:5px;
}
#code_container .code_reader ol li:hover, #code_container .code_reader ol li.code_hover {
background-color:#D9E5F2;
}
#code_container .code_reader .core {color:#0000ff; text-transform:uppercase;}
#code_container .code_reader .comment {color:#848484;}
#code_container .code_reader .number {color:#319cff;}
#code_container .code_reader .operator {color:#840084;}
#code_container .code_reader .string {color:#4aa518;text-transform:uppercase;}
#code_container .code_reader .string span {color:#4aa518;} /* override syntax coloring in strings */
#code_container .code_reader .field-symbol {color:#848484;}
#code_container .code_reader .line {color:#848484;}
#code_container .code_reader .line-number, #code_container .code_reader .line-post-number {color:#398c8c;}
#code_container .code_reader .global {color:#000000;}
#code_container .code_reader .expand {font-weight:bold;}
#code_container .code_reader .comment span.code_part {
color:#04357B;
font-weight:bold;
text-transform:capitalize;
}
#code_container .code_reader pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
margin:0;
padding:0;
border:none;
}
/* Default code line */
#code_container .code_reader ol li span {
color:#000000;
}
#code_container .code_reader ol li span.code, ol li span.comment {
font-size:14px;
margin-left:15px;
}
#code_container .code_reader ol li span.comment span, #code_container .code_reader ol li span.code span.comment {
color:#848484;
text-transform:none;
font-weight:normal;
}
#code_container .code_reader ol li a.internal_link, #code_container .code_reader ol li a.external_link {
color:#04357B;
border:none;
font-weight:normal;
text-indent:0;
text-decoration:underline;
}
#code_container .code_reader ol li a.internal_link span {
color:#04357B;
font-weight:normal;
}
#code_container .code_reader a.internal_link:hover, #code_container .code_reader a.internal_link:hover span {
color:#EFAB00;
}
#code_container .code_reader ol li span.hide span {
color:#848484;
}
/* Expanding */
#code_container .code_reader ol li span.expand_line {
border-left:1px solid #424242;
color:#424242;
text-align:center;
width:5px;
position:relative;
}
#reader #code_container .code_reader ol li span.expand_line span:before {
content: '';
position:absolute;
margin-left:-21px;
}
#reader #code_container .code_reader ol li span.expand_line input {
position:absolute;
margin:3px 0 0 -4px;
cursor:pointer;
padding:0;
z-index:1000;
background: white 0 0 no-repeat;
width:9px;
height:9px;
}
#reader #code_container .code_reader ol li span.expand_line input.minus {
background-image:url('images/expand_minus.png');
}
#reader #code_container .code_reader ol li span.expand_line input.plus {
background-image:url('images/expand_plus.png');
}
#reader #code_container .code_reader ol li span.expand_line input:hover {
background-position: 0 -9px;
}
#edit_container {
display:none;
margin-bottom:10px;
}
#edit_container textarea {
margin-top:10px;
margin-bottom:20px;
height:200px;
}
#edit_container #edit_btn {
margin-left:-10px;
}
/* Search */
#search .summary {
margin: 10px 0 0px 5px;
font-size:14px;
font-style: italic;
}
#search .code_reader:hover .tab_left,
#search .code_reader:hover ol,
#search .code_reader:hover li {
background-color:#D9E5F2;
cursor:pointer;
}
#search .step_box {
margin-bottom:10px;
}
#search #repeat_query {
padding-bottom: 6px;
}
#search #sub_button_box {
display:inline;
}
/* Profile */
#profile #avatar {
width:96px;
height:96px;
background:url("images/avatar_96.png") 0 0 no-repeat;
border:2px solid #04357B;
float:left;
}
#profile #profile_company_logo {
width:24px;
height:24px;
vertical-align:middle;
margin-right:5px;
}
#profile .user {
margin-left:110px; /* 96 (picture) + 10 (margin) + 4 (borders) */
padding:10px 16px;
height:76px; /* 96 (picture height) - 20 (padding) */
border:2px solid #04357B;
background:#D9E5F2;
}
#profile .user .fa {
margin-right:2px;
}
#profile .user p {
font-size:16px;
line-height:25px;
}
#profile .user p span {
font-weight:bold;
}
#profile .user_history_title {
margin:30px 0 0 0 ;
padding:0 10px 0 25px;;
font-size:25px;
color:#04357B;
border-bottom:2px solid #04357B;
background:url(images/logo_25.png) 0 1px no-repeat;
}
#profile #history_subbox {
margin-top:10px;
border:2px solid #04357B;
}
#profile #user_history p.history_line {
padding:5px 10px;
font-size:14px;
}
#profile #user_history p.history_line:nth-child(odd) {
background:#D9E5F2;
}
#profile #user_history p.history_line:nth-child(even) {
background:#FFFFFF;
}
#profile #user_history p.history_line:FIRST-CHILD {
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-khtml-border-top-left-radius: 10px;
-khtml-border-top-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
#profile #user_history p.history_line:LAST-CHILD {
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
-khtml-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
#profile #user_history p.history_line .fa {
margin-left:5px;
margin-right:5px;
}
#profile #user_history a {
text-decoration:underline;
}
/* Article */
#article .loading_box {
font-size:16px;
}
/* Chat */
#chat #chat_room {
margin-right:175px; /* 165px + 10px (margin-left) */
border:2px solid #04357B;
background:white;
height:100%;
}
.g_white_transparent {
background: #000000 url("images/grad_white_transparent_50.png") repeat-x top;
/*-o-background-size: 100% 100%;
-moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
background-size: 100% 100%;
background: -moz-linear-gradient(
top,
rgba(255,255,255,1),
rgba(255,255,255,0)
);
background: -webkit-gradient(
linear,
left top, left bottom,
from(rgba(255,255,255,1)),
to(rgba(255,255,255,0))
);*/
}
#chat #chat_room #chat_shades {
position:absolute;
width:0;
left:18px;
margin-top:5px;
height:50px;
background: url("images/grad_white_transparent_50.png") repeat-x top;
}
#chat #chat_room #chat_container {
clear:both;
margin:5px 5px 0;
}
#chat #chat_room #chat_container #chat_messages_box {
position:relative;
height:20px;
overflow:hidden;
background:white url("images/sap_gold_332.jpg") 50% 50% no-repeat;
}
#chat #chat_room #chat_container #chat_messages {
position:absolute;
left:0;
top:0;
list-style:none;
background:rgba(255,255,255,0.7);
width:100%;
}
.noSelect {
user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none;
}
#chat_messages p {
color:#04357B;
}
#chat_messages p img.proxy {
vertical-align:middle;
border:1px solid #04357B;
padding:5px;
background:#FFFFFF;
}
#chat_messages p.U {
/*background-color:white;*/
}
#chat_messages p.A, #chat_messages p.PA, #chat_messages p.E, #chat_messages p.PE, #chat_messages p.N {
background-color:#D9E5F2;
font-style:italic;
}
#chat_messages p.C {
color:#CCC;
text-decoration:none;
font-style:normal;
}
#chat_messages p span.time {
color:#EFAB00;
font-size:10px;
font-style:normal;
}
#chat_messages p a.user, #chat_messages p span.console {
font-size:12px;
font-weight:bold;
color:#04357B;
}
#chat_messages p a.user {
margin-left:5px;
}
#chat_messages p a.user:hover {
text-decoration:underline;
}
#chat_messages p span.text {
margin-left:5px;
font-size:13px;
}
#chat_messages p span.action {
font-style:italic;
}
#chat_messages p span.text a {
text-decoration:underline;
font-style:normal;
}
#chat_messages p span.text a:visited {
color:grey;
}
#chat_messages p span.highlight {
color:red;
}
#chat_messages p span.chan_link {
font-weight:bold;
}
#chat_messages p span.news {
font-weight:bold;
}
#chat_messages .help {
border:1px dashed #666666;
padding:0 0 5px 0;
margin:5px 0;
background:white;
}
#chat_messages .help p {
padding:0 5px;
color:#666666;
font-size:10px;
}
#chat_messages .help p.title {
font-size:14px;
padding:3px 5px;
border-bottom:1px dashed #666666;
letter-spacing:0;
display: inline-block;
width:calc(50% - 10px);
float:left;
}
#chat_messages .help p.subtitle {
margin-top:5px;
font-size:12px;
}
#chat_messages .help p.item {
margin-top:1px;
}
#chat_messages .help p.subtitle span {
font-style:italic;
border-bottom:1px dashed #666666;
}
#chat_messages .help p span.key {
font-weight:bold;
margin-right:5px;
}
#chat #chat_input {
margin:5px;
padding:0 5px;
background:#04357B;
}
#chat #chat_input .fa {
color:#D9E5F2;
margin-right:2px;
}
#chat #chat_input input#message {
color:white;
margin:0;
padding:7px 0;
border:none;
min-width:200px;
font-size:13px;
line-height:13px;
}
#chat #chat_input input#message:hover, #chat #chat_input input#message:focus {
background-color:transparent;
}
#chat #sidebar {
position:absolute;
right:0;
width:165px;
}
#chat #sidebar div {
padding:5px;
}
#chat #sidebar .sidebar_box {
position:relative;
border:2px solid #04357B;
font-weight:bold;
padding:0;
margin-bottom:10px;
}
#chat #sidebar .sidebar_box_title {
background-color:#D9E5F2;
text-align:center;
}
#chat #sidebar .sidebar_box_content {
border-top:2px solid #04357B;
font-size:12px;
font-weight:normal;
}
#chat #sidebar .help_paperclip {
background: transparent url('images/ms_paperclip_112.jpg') 50% 50% no-repeat;
height:109px;
}
#chat #sidebar .sidebar_box_content p {
padding:3px 0;
overflow: hidden;
}
#chat #sidebar .sidebar_box_content p span.key {
font-weight:bold;
padding-right: 5px;
}
#chat #sidebar p.connected_user {
font-size:16px;
}
#chat #sidebar a.connected_user_logo img {
vertical-align:middle;
}
#chat #sidebar a.connected_user_name {
display:inline-block;
width:calc(100% - 24px - 5px); /* logo + right margin */
font-style:italic;
font-weight:normal;
color:#04357B;
text-decoration:underline;
margin-left:5px;
}
#chat #sidebar a.connected_user:hover {
color:#EFAB00;
}
#chat .afk {
position:absolute;
font-size:20px;
line-height:20px;
text-shadow: 1px 1px 1px #D9E5F2;
margin-left:-20px;
margin-top:2px; /* (24 - 20)/2 */
}
#chat #chat_chan {
margin-bottom: -2px;
}
#chat #chat_chan .tab_bar {
font-weight:bold;
text-align:right;
margin:0 184px 0 0; /* 165px + the round corner */
}
#chat #chat_chan .tab_bar span.chan {
display: inline-block;
background-color:#D9E5F2;
padding:2px 8px;
border:2px solid #04357B;
margin-left:5px;
color:#04357B;
}
#chat #chat_chan .tab_bar span#join_chan {
padding:2px;
border-bottom:#04357B;
}
#chat #chat_chan .tab_bar span#join_chan:hover #join_chan_button {
color:#EFAB00;
}
#chat #chat_chan .tab_bar span.chan:hover, #chat #chat_chan .tab_bar span#join_chan.active {
background-color:#04357B;
color:#FFFFFF;
}
#chat #chat_chan .tab_bar span.chan span.chan_title {
text-transform:capitalize;
}
#chat #chat_chan .tab_bar span.chan span.chan_unread {
font-weight:normal;
font-style:italic;
}
#chat #chat_chan .tab_bar a.quit_chan {
margin-left:5px;
color:#04357B;
}
#chat #chat_chan .tab_bar span.chan.active:hover a.quit_chan {
color:#04357B;
}
#chat #chat_chan .tab_bar span.chan:hover a.quit_chan {
color:#D9E5F2;
}
#chat #chat_chan .tab_bar span.chan a.quit_chan:hover,
#chat #chat_chan .tab_bar .fa:hover {
color:#EFAB00;
}
#chat #chat_chan .tab_bar span#join_chan input, #chat #chat_chan .tab_bar span#join_chan input:hover {
border:none;
font-size:14px;
padding:0;
margin:0;
width:70px;
background-color:#04357B;
color:white;
font-weight:bold;
}
#chat #chat_chan .tab_bar span.active, #chat #chat_chan .tab_bar span.active:hover {
border-bottom-color: #FFFFFF;
background-color: #FFFFFF;
color:#000000;
}
#chat #chat_chan .tab_bar span.light_up {
background-color:#EFAB00;
}
#chat #sidebar #news, #chat #sidebar #news p {
padding:0;
}
#chat #sidebar #news .new {
padding:6px 5px;
}
#chat #news .new:nth-child(even) {
background:#DCF2FB;
}
#chat #news .new:nth-child(odd) {
background:#D9E5F2;
}
#chat #news .new:last-child {
-moz-border-radius:0 0 10px 10px;
-webkit-border-radius:0 0 10px 10px;
-khtml-border-radius:0 0 10px 10px;
border-radius:0 0 10px 10px;
}
#chat #news .new .signature {
font-size: 0.75em;
text-align: right;
}
#chat #news .new .signature .news_time {
font-style:italic;
}
/* Options */
#options .options_box {
background:#D9E5F2;
border:2px solid #04357B;
width:490px;
float:left;
margin:0 10px 10px 0;
padding:10px;
}
#options .options_box .loading {
padding:10px;
}
#options .options_box h2 {
color:#04357B;
font-size:20px;
margin:0 0 10px 0;
border-bottom:2px solid #04357B;
}
#options .options_box .option_line {
margin:10px 0;
}
#options .options_box input[type=text], #options .options_box input[type=password], #options .options_box select {
font-size:14px;
background:white;
border-width:1px;
font-size:14px;
padding:5px;
float:right;
}
#options .options_box .button {
float:left;
clear:both;
}
#options .options_box select {
border:1px solid #04357B;
color:#04357B;
}
#options .options_box .option_line p {
float:left;
width:250px;
padding:5px 0;
margin:5px 0;
}
/* Procedure */
#procedure #procedure_steps .button {
background-color:white;
}
#procedure #procedure_steps .button:hover {
background-color:#EFAB00
}
#titles_read p.read_title {
border-bottom:1px solid #04357B;
font-weight:bold;
}
#titles_read p.read_details {
font-size:12px;
font-style:italic;
margin:3px 0 15px 0;
}
#titles_read p.read_description {
font-size:14px;
}
#titles_read p.read_description .fa {
margin-right:5px;
}
#procedure table.step_box {
width:100%;
}
#procedure table.step_box:nth-child(even) {
background:#DCF2FB;
}
#procedure table.step_box td {
text-align:left;
margin:0;
}
#procedure table.step_box td.step_margin {
width:50%;
}
#procedure table.step_box td.step_buttons {
padding-top:10px;
}
#procedure table.step_box td.image_box_container {
vertical-align:top;
padding-top:18px;
padding-left:22px; /* 5*2 (padding) + 1*2 (border) + 10 (own padding) */
min-width:350px;
}
#procedure table.step_box .image_box {
margin:10px 0 15px;
padding:0;
}
#procedure table.step_box input[type=file] {
margin:0 10px;
max-width:250px;
border:1px solid #04357B;
background:white;
}
#procedure #bottom_menu {
margin:10px 0 0 0;
}
#procedure #top_menu {
margin:0 0 10px 0;
}
#procedure #validation_button .button {
margin-right:10px;
}
/* Procedure - Read */
#procedure input:disabled, #procedure textarea:disabled {
border-color:#D9E5F2;
font-weight:bold;
}
#procedure textarea:disabled {
background-color:#DCF2FB;
}
#procedure table.step_box:nth-child(even) textarea:disabled {
background-color:#D9E5F2;
}
#procedure input:disabled {
background-color:#D9E5F2;
padding-left:0;
}
#procedure .thumbnail_box {
margin:10px 0;
height: 100px;
}
#procedure .thumbnail_image {
background:white;
border:1px solid #04357B;
width:100px;
height:100px;
vertical-align:middle;
}
#procedure .thumbnail_image:hover {
border-color:#EFAB00;
}
#procedure .thumbnail_desc {
font-size:12px;
}
/* Procedure - Uploader */
#procedure .error {
margin:0 0 15px 0;
}
#procedure .uploader_box .error {
font-size:12px;
margin:10px 0;
}
/* Doc */
#doc_container, #doc {
margin:0;
padding:0;
}
#doc .step_box {
margin-bottom:10px;
}
#doc #attach_file {
margin-top:10px;
}
#doc .uploader_droparea {
height:150px;
}
#doc #doc_links {
padding:20px 10px 10px 0px;
}
/* Table */
#table #system {
width:80px;
}
#table input#title {
width:20%;
}
#table input#description {
width:calc(80% - 92px);
}
#table .step_box_title a {
color:#04357B;
}
#table #validation {
margin-top:15px;
}
#table .table_info {
margin-top:20px;
font-size:0.8em;
}
#table #read_title {
font-weight: bold;
}
#table #read_description {
font-style: italic;
}
#table #read_keywords {
margin:10px 0 0 0;
font-size: 0.9em;
}
#table input:disabled {
color:#D9E5F2;
background-color:#04357B;
}
#table .form_success {
display: none;
}
/* List */
#list_container div:FIRST-CHILD {
margin-top:0;
}
/* 404 */
#err_404 p {
margin-top:20px;
color:#04357B;
}
/* Footer */
#footer {
padding-right:10px;
text-align:right;
}
#footer p, #footer a {
color:white;
margin:0;
font-size:9px;
}
#footer a {
font-weight:bold;
}
/* Log Out */
#logout p {
font-size:18px;
color:#04357B;
margin-top:25px;
}
/* Debug*/
.line_h {
position:fixed;
top:0;
height:1px;
width:100%;
border-bottom:1px solid red;
z-index: 1000;
}
.line_v {
position:fixed;
left:0;
height:100%;
width:1px;
border-left:1px solid red;
z-index: 1000;
}
/* Mobile */
@media only screen and (max-device-width: 480px) {
/* General - Standard Tags - index */
body, html {
min-width:300px;
}
.mobile {
display:inherit;
}
#container {
padding:0;
}
#header table .cell.righty, #footer {
display: none;
}
#header table .cell.lefty {
width:100%;
}
.logo {
top:5px;
left:50%;
margin-left:-110px;
}
#menu {
-moz-border-radius:0 10px 10px 0;
-webkit-border-radius:0 10px 10px 0;
-khtml-border-radius:0 10px 10px 0;
border-radius:0 10px 10px 0;
}
#main_container {
-moz-border-radius:10px 0 0 10px;
-webkit-border-radius:10px 0 0 10px;
-khtml-border-radius:10px 0 0 10px;
border-radius:10px 0 0 10px;
}
/* Logon */
#logon .logo {
position:static;
}
#logon .container {
position:static;
top:0;
left:0;
margin:0;
width:100%;
}
#logon .container #logon_box {
background:white;
margin:10px;
overflow:auto;
}
#logon .box .key {
display:none;
}
#logon .box table {
margin:0;
display:block;
}
#logon .box table td {
padding:0;
margin:0;
text-align:left;
font-size:18px;
color:#04357B;
height:50px;
}
#logon .box .validate {
text-align:right;
}
#logon .box .feedback {
float:left;
}
#logon .box input {
border:1px solid #04357B;
color:#04357B;
font-size:28px;
padding:1px 5px;
float:right;
width:90%;
}
#logon .box input[type=button] {
padding:1px 10px;
width:auto;
}
#logon #footer {
position:fixed;
bottom:0;
}
/* Menu */
#menu #menu_box ul li#close_menu_ln {
border-top:2px solid #04357B;
}
/* Chat */
#chat #chat_chan, #chat #sidebar {
display:none;
}
#chat #chat_room {
margin-right:0;
}
#chat #chat_room #chat_container #chat_messages_box {
background-image: url('images/sap_gold_200.jpg');
}
}