From 89d3443ebbf77e976a77587ea22a7c91e3606788 Mon Sep 17 00:00:00 2001 From: franzz Date: Sun, 7 Sep 2014 21:08:09 +0200 Subject: [PATCH] internal links in procedure --- inc/databap.php | 4 +- inc/procedure.php | 27 +- inc/toolbox.php | 5 + masks/procedure.html | 58 +- masks/table.html | 2 +- style/screen.css | 5209 +++++++++++++++++++++--------------------- 6 files changed, 2649 insertions(+), 2656 deletions(-) diff --git a/inc/databap.php b/inc/databap.php index 1f09a12..72bef41 100644 --- a/inc/databap.php +++ b/inc/databap.php @@ -1159,7 +1159,7 @@ class Databap extends PhpObject $asTable['title'] = self::getTableFormat($asTable['title']); $asTable['description'] = self::getDescriptionFormat($asTable['description']); $asTable['led'] = self::getDateFormat($asTable['led']); - $asTable['formatted_keywords'] = str_replace("\n", '
', ToolBox::findReplaceLinks($asTable['keywords'])); + $asTable['formated_keywords'] = ToolBox::formatText($asTable['keywords']); } } return $asTable; @@ -2621,7 +2621,7 @@ class Databap extends PhpObject public static function getDescriptionFormat($sDescription) { - return ToolBox::mb_ucfirst($sDescription); + return ToolBox::mb_ucfirst(ToolBox::findReplaceLinks($sDescription)); } public static function getTableFormat($sTable) diff --git a/inc/procedure.php b/inc/procedure.php index 9558d6f..f2a574f 100644 --- a/inc/procedure.php +++ b/inc/procedure.php @@ -229,27 +229,18 @@ class Procedure extends PhpObject public function getProcedure() { - // [id_step]=>text - // [id_step][id_image]=>array('name'=>file name, 'desc'=> description) - /* - $asSteps = $asImages = array(); - $iLocalStepId = 1; - foreach($this->asSteps as $iStepId=>$sStepDesc) + foreach($this->asSteps as $iStepId=>$asStep) { - $asSteps[$iLocalStepId] = $sStepDesc; - if(array_key_exists($iStepId, $this->asImages)) - { - $asImages[] = + $this->asSteps[$iStepId]['formated_description'] = ToolBox::formatText($asStep['description']); } - $iLocalStepId++; - }*/ + return array( 'proc_id'=>$this->iProcId, - 'id_user'=>$this->iUserId, - 'title'=>Databap::getDescriptionFormat($this->sTitle), - 'description'=>Databap::getDescriptionFormat($this->sDescription), - 'led'=>Databap::getDateFormat($this->dLed), - 'steps'=>$this->asSteps, - 'images'=>$this->asImages); + 'id_user'=>$this->iUserId, + 'title'=>Databap::getDescriptionFormat($this->sTitle), + 'description'=>Databap::getDescriptionFormat($this->sDescription), + 'led'=>Databap::getDateFormat($this->dLed), + 'steps'=>$this->asSteps, + 'images'=>$this->asImages); } private function refreshProcId() diff --git a/inc/toolbox.php b/inc/toolbox.php index 50c1968..70f45e9 100644 --- a/inc/toolbox.php +++ b/inc/toolbox.php @@ -265,6 +265,11 @@ class ToolBox setcookie($sCookieName, $sCookieValue, $iTimeLimit); } + public static function formatText($sText) + { + return str_replace("\n", '
', self::findReplaceLinks($sText)); + } + //TODO implement link pattern public static function findReplaceLinks($sText, $sLinkPattern='') { diff --git a/masks/procedure.html b/masks/procedure.html index 14945fe..1bf7b48 100755 --- a/masks/procedure.html +++ b/masks/procedure.html @@ -21,9 +21,9 @@
-

+

Créé par () le

-

+

@@ -45,7 +45,10 @@ Étape - + + +
+
@@ -148,18 +151,14 @@ function resizeDescription() function setDisplay(sNewMode) { - //On page first load var sOldMode = databap.vars.mode; - if(!sOldMode || sOldMode=='') - { - sOldMode = (sNewMode=='read')?'edit':'read'; - } + sNewMode = sNewMode || ''; + + //On page first load + if(sOldMode=='') sOldMode = (sNewMode=='read')?'edit':'read'; //default behaviour : switch to alternative display - if(!sNewMode) - { - sNewMode = (sOldMode=='read')?'edit':'read'; - } + if(!sNewMode) sNewMode = (sOldMode=='read')?'edit':'read'; //Set new Display if(sNewMode!=sOldMode) @@ -167,14 +166,11 @@ function setDisplay(sNewMode) var sDisabled; //Set read mode data - if(sNewMode=='read') - { - syncReadModeData(); - } + if(sNewMode=='read' && databap.vars.mode!='') syncReadModeData(); //Hide / show boxes - var $EditBoxes = databap.getMainElem('.uploader_box, .step_buttons, #add_step, #submit_procedure, #titles_edit'); - var $ReadBoxes = databap.getMainElem('#share, #titles_read'); + var $EditBoxes = databap.getMainElem('.uploader_box, .step_buttons, #add_step, #submit_procedure, #titles_edit, textarea[id$="step_text"]'); + var $ReadBoxes = databap.getMainElem('#share, #titles_read, div[id$="step_text_read"]'); switch(sNewMode) { @@ -210,13 +206,14 @@ function setDisplay(sNewMode) function syncReadModeData() { - //Title & description - var $EditBox = databap.getMainElem('#titles_edit'); - var $ReadBox = databap.getMainElem('#titles_read'); - $ReadBox.find('#titles_read_title').text($EditBox.find('#title').val()); - $ReadBox.find('#titles_read_description').text($EditBox.find('#description').val()); - - //Steps + $('.read').each(function() + { + $This = $(this); + var sEditValue = $('#'+$This.attr('id').substr(0, $This.attr('id').length - '_read'.length)).val(); + var sReadValue = sEditValue.replace(/(?:\r\n|\r|\n)/g, '
'); + $This.html(sReadValue); + }); + databap.feedback('warning', 'Le formattage du texte reviendra lors de la validation'); } function setThumbnails(bShow) @@ -288,7 +285,7 @@ function getImageUrl(sImageName, bThumbnail) return sImageUrl; } -function addStep(stepId, sPosition, sDesc) +function addStep(stepId, sPosition, sDesc, sFormatedDesc) { //Set Step Count iCurrentStep = '0'; @@ -298,6 +295,7 @@ function addStep(stepId, sPosition, sDesc) //Add Step text if(sDesc) $step.find('#step_text').val(sDesc); + if(sFormatedDesc) $step.find('#step_text_read').html(sFormatedDesc); //Insert new step before this step $step.find('#insert_step_before').click @@ -449,7 +447,6 @@ function saveProcedure() databap.addSuccessBefore('La procédure est enregistrée', '#bottom_menu'); databap.addSuccessIcon(); - //setDisplay('read'); //Unblock exit & go databap.tmp('started', false); @@ -507,7 +504,7 @@ function loadProcedure(iProcId, fOnSuccess) proc_info.steps, function(iStepId, sStepDesc) { - iDisplayedStepId = addStep(false, false, sStepDesc.description); + iDisplayedStepId = addStep(false, false, sStepDesc.description, sStepDesc.formated_description); //Image if(iStepId in proc_info.images) @@ -544,10 +541,15 @@ function loadProcedure(iProcId, fOnSuccess) ); } +//TODO delete this silly function and rethink the whole thing function addExtraReadElements(data) { + debug(data); + //Add extra read-mode data $ReadTitles = databap.getMainElem('#titles_read'); + $ReadTitles.find('#title_read').text(data.title); + $ReadTitles.find('#description_read').text(data.description); $ReadTitles.find('#titles_read_user').text(data.name); $ReadTitles.find('#titles_read_company').text(data.company); $ReadTitles.find('#titles_read_led').text(data.led); diff --git a/masks/table.html b/masks/table.html index dacf5fa..977a00a 100644 --- a/masks/table.html +++ b/masks/table.html @@ -18,7 +18,7 @@

"J'ai explication !"

-

+

diff --git a/style/screen.css b/style/screen.css index f05f89a..d8b1348 100644 --- a/style/screen.css +++ b/style/screen.css @@ -1,2608 +1,2603 @@ -/* 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; -} -a.internal_link span.type { - text-transform:capitalize; -} -a[href^="table"].internal_link span.item { - text-transform:uppercase; -} - -.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-success:before, .fa-c-ok:before, .available .fa:before { - content: "\f00c"; -} - -.fa-c-warning { - color:#EFAB00; -} -.fa-c-warning:before { - content: "\f071"; -} - -.fa-c-error { - color:red; -} -.fa-c-error:before { - content: "\f071"; -} - -.fa-c-ko { - color:red; -} -.fa-c-ko:before, .unavailable .fa:before { - content: "\f00d"; -} - -.fa-c-search:before { - content: "\f002"; -} - -.fa-c-welcome:before { - content: /*"\f087"*/"\f015"; -} - -.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:-64px; /* -(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 .key .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 a.button { - margin-right:0; -} -#logon .box a.button .fa { - margin:1px; -} -#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; -} - -#page_title h1 { - margin:0 -12px 12px; - padding:12px 10px; - width:100%; - border:2px solid #04357B; - font-family:Arial; - font-size:32px; - line-height:32px; - font-style:italic; - font-weight:600; - - background: #D9E5F2; - background: -moz-linear-gradient(45deg, #D9E5F2 25%, #ffffff 75%); - background: -webkit-gradient(linear, left bottom, right top, color-stop(25%,#D9E5F2), color-stop(75%,#ffffff)); - background: -webkit-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); - background: -o-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); - background: -ms-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); - background: linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D9E5F2', endColorstr='#ffffff',GradientType=1 ); -} - -#page_title h1 #title_feedback { - text-align: right; -} - -#title_feedback .feedback { - margin:0; - padding: 0 5px; - border:none; - position:absolute; - right:10px; - top:14px; -} - -#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_formatted_keywords { - margin:10px 0 0 0; - font-size: 0.9em; -} - -#table #read_formatted_keywords a.internal_link { - padding:0 0 0 2px; -} - -#table input:disabled { - color:#D9E5F2; - background-color:#04357B; -} - -#table .form_success { - display: none; -} - -/* List */ - -#filters_container { - margin-bottom:10px; -} - -#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 { - left:0; - margin-left:0; - width:100%; - } - - #logon .logon_msg, #logon .box { - margin:10px; - } - #logon .box { - background:white; - overflow:auto; - } - #logon .box .key { - display:none; - } - #logon .box table { - margin:0; - display:block; - } - #logon .box table td { - padding:0; - margin:0; - } - #logon .box .validate { - text-align:right; - } - #logon .box .feedback { - float:left; - } - #logon .box input { - float:right; - width:90%; - } - #logon .box input[type=button] { - padding:1px 10px; - width:auto; - } - - /* 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'); - } +/* 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; +} +a.internal_link span.type { + text-transform:capitalize; +} +a[href^="table"].internal_link span.item { + text-transform:uppercase; +} + +.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:nth-child(even) { + background:#DCF2FB; +} + +.step_box input, .step_box textarea, .step_box select, .step_box .read.textarea, .step_box .read.input { + 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, .step_box .read.textarea, .step_box .read.input { + width:100%; +} +.step_box textarea, .step_box .read.textarea { + height:200px; + padding:5px; + background:white; + border:1px solid #04357B; +} +.step_box .read.textarea, .step_box .read.input { + border-color:#D9E5F2; + font-weight:bold; +} +.step_box .read.textarea { + background-color:#DCF2FB; +} +.step_box:nth-child(even) .read.textarea { + background-color:#D9E5F2; +} +.step_box .read.input { + background-color:#D9E5F2; + padding-left:0; +} + +.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-success:before, .fa-c-ok:before, .available .fa:before { + content: "\f00c"; +} + +.fa-c-warning { + color:#EFAB00; +} +.fa-c-warning:before { + content: "\f071"; +} + +.fa-c-error { + color:red; +} +.fa-c-error:before { + content: "\f071"; +} + +.fa-c-ko { + color:red; +} +.fa-c-ko:before, .unavailable .fa:before { + content: "\f00d"; +} + +.fa-c-search:before { + content: "\f002"; +} + +.fa-c-welcome:before { + content: /*"\f087"*/"\f015"; +} + +.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:-64px; /* -(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 .key .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 a.button { + margin-right:0; +} +#logon .box a.button .fa { + margin:1px; +} +#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; +} + +#page_title h1 { + margin:0 -12px 12px; + padding:12px 10px; + width:100%; + border:2px solid #04357B; + font-family:Arial; + font-size:32px; + line-height:32px; + font-style:italic; + font-weight:600; + + background: #D9E5F2; + background: -moz-linear-gradient(45deg, #D9E5F2 25%, #ffffff 75%); + background: -webkit-gradient(linear, left bottom, right top, color-stop(25%,#D9E5F2), color-stop(75%,#ffffff)); + background: -webkit-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); + background: -o-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); + background: -ms-linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); + background: linear-gradient(45deg, #D9E5F2 25%,#ffffff 75%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D9E5F2', endColorstr='#ffffff',GradientType=1 ); +} + +#page_title h1 #title_feedback { + text-align: right; +} + +#title_feedback .feedback { + margin:0; + padding: 0 5px; + border:none; + position:absolute; + right:10px; + top:14px; +} + +#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 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 .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_formated_keywords { + margin:10px 0 0 0; + font-size: 0.9em; +} + +#table #read_formatted_keywords a.internal_link { + padding:0 0 0 2px; +} + +#table input:disabled { + color:#D9E5F2; + background-color:#04357B; +} + +#table .form_success { + display: none; +} + +/* List */ + +#filters_container { + margin-bottom:10px; +} + +#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 { + left:0; + margin-left:0; + width:100%; + } + + #logon .logon_msg, #logon .box { + margin:10px; + } + #logon .box { + background:white; + overflow:auto; + } + #logon .box .key { + display:none; + } + #logon .box table { + margin:0; + display:block; + } + #logon .box table td { + padding:0; + margin:0; + } + #logon .box .validate { + text-align:right; + } + #logon .box .feedback { + float:left; + } + #logon .box input { + float:right; + width:90%; + } + #logon .box input[type=button] { + padding:1px 10px; + width:auto; + } + + /* 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'); + } } \ No newline at end of file