/* !!! global html/standard styles */

html, body {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size:90%;

 margin: 0;
 padding: 0;

 height: 100%;
 border: none;

 color:#333333;
}

A {
    color:#284d5d;
}

A:hover {
    color: #346d84 !important;
}

.recaptcha_only_if_privacy A {
    color:#cccccc !important;
    font-size: 80%;
}

form {
 margin:0;
 padding:0;
}

/* !!! global additional styles */

.underline {
 text-decoration:underline;
}

.hline {
 border-top: 1px solid;
 margin:0;
 margin-top:1em;
 margin-bottom:1em;
 padding:0;
}

.lspcA {
 padding-top:1em;
}

.lspcB {
 padding-bottom:1em;
}

#toolbar {
 text-align:left;
 margin:0;
 visibility:hidden;
}

.toolbar_box {
/*
 border:solid 1px #cccccc;
*/
 margin-bottom:1.5em;
}

.toolbar_box h1 {
 color:#ffffff;
 background-color:#284d5d;
 margin:0px;
 padding:0;
 padding-top: 1px;
 padding-bottom: 1px;
 padding-left:3px;
 font-size:90%;
 background-image:url(/img/headline.gif);
 background-repeat:repeat-x;
    font-weight: normal;
}

.toolbar_box ul {
 padding-left:2px;
 padding-right:2px;
}

.toolbar_box li {
 margin-top:0.2em;
}

.lnks {
 background-color:#ffffff;
 border:solid 1px #f5f3f3;
 margin:0;
 padding:0;
 margin-bottom:10px;
 text-align:center;
}

A.txtBut {
 color:#284d5d;
 text-decoration: none;
}

A.txtBut:hover {
    color: #346d84 !important;
}

.menu_font {
 color: #284d5d;
 list-style-type:none;
 list-style-image:none;
 padding:0;
 margin:0;
}

.menu_font A {
 color:#284d5d;
 text-decoration: none;
}

.menu_font A:hover {
    color: #346d84 !important;
    text-decoration: underline;
}

.bold {
 font-weight:bold;
}

.textColor1 {
 color:#284d5d;
}

.button {
 padding-top:0.8em;
 padding-bottom:0.6em;
 font-size:110%;
 text-wrap: none;
}

.button A {
 color:#284d5d;
 font-weight:bold;
 text-decoration: none;
}

.button A:hover {
    color: #346d84 !important;
}

.message {
 margin:10px;
}

.message h1 {
 font-weight:bold;
 font-size:105%;
}

.info {
 padding-bottom:10px;
}

.info h1 {
 font-weight:bold;
 font-size:105%;
}

.smallFont {
 font-size:80%;
}

/* !!! global functionalities */

.showUponStatus{
 display:none;
}

.gadget_shareIt ul {
 list-style-image:none !important;
 list-style-type:none !important;
 list-style-position:outside !important;
 margin:0 !important;
 padding:0 !important;
}

/* !!! entity pages (i.e. front and edit) */

.linkInText {
 font-weight:bold;
}

/* !!! Search lists*/

.queryResult {
 margin:0;
 margin-top:0.5em;
 margin-bottom:0.5em;
 padding:0.5em;
 /*clear:both;*/
}

.queryResultLeft {
 float: left;
 width: 70%;
}

.queryResultRight {
    text-align: right;
/*
 float:right;
*/
 margin-bottom:0.5em;
 margin-left:0.5em;
}

.queryResultSnippet {
 font-size:90%;
}

.queryResultOdd {
 background-color:#f5f3f3;
}

.queryResult A {
 color:#284d5d;
}

.queryResult A:hover {
 color:#333333;
}

/* !!! wokoon related */

.main_content {
 padding-bottom: 2em;
}

.wokoonMenuContent h1, .wokoonWindowContent h1, .main_content h1 {
 padding:0px;
 padding-top:1em;
 padding-bottom:1em;
 margin:0;
 font-size:140%;
}

.wokoonMenuContent h2, .wokoonWindowContent h2, .main_content h2 {

 padding-top:1.5em;
 padding-bottom:0.4em;
 margin:0;
 font-size:120%;
}

.wokoonMenuContent ul, .wokoonWindowContent ul, .main_content ul {
 list-style-type: square;
 list-style-image: url(/img/bullet.gif);
 list-style-position:outside;

 padding-top:0;
 padding-bottom:0.2em;
}

.wokoonMenuContent ol, .wokoonWindowContent ol, .main_content ol {
    margin: 0;
    margin-top:0.4em;
}

.wokoonMenuContent p, .wokoonWindowContent p, .main_content p {
 padding-top:0;
    margin: 0;
    margin-top:0.4em;
}

.wokoonMenuContent td, .wokoonWindowContent td, .main_content td {
 text-align:left;
}

/* !!! content state error message/warning */
.conflictMessage {
 font-size:90%;
 border:#B22222 solid 1px;
 padding:1.5em;
 padding-top:0.5em;
 color:#B22222;
}

.conflictMessage h1 {
 font-weight:bold;
 font-size:105%;
}

.searchfield {
    width: 300px;
}

.submitBut  A {
    color:#284d5d;
    font-size:110%;
    font-weight:bold;
}

.submitBut A {
    text-decoration: none;
}

.submitBut A:hover {
    color: #346d84 !important;
}


.mobile {
 display: none;
}

.mobileNot {

}

.preventTapTouchSelectDrag {
    /* tap */
    tap-highlight-color: rgba(0, 0, 0, 0);
    \-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    \-moz-tap-highlight-color: rgba(0, 0, 0, 0);
    \-ms-tap-highlight-color: rgba(0, 0, 0, 0);
    \-o-tap-highlight-color: rgba(0, 0, 0, 0);
    \-khtml-tap-highlight-color: rgba(0, 0, 0, 0);

    /* touch */
    \-webkit-touch-callout: none;
    \-moz-user-touch-callout: none;
    \-ms-user-touch-callout: none;
    \-o-user-touch-callout: none;
    \-khtml-user-touch-callout: none;

    /* select */
    user-select: none;
    \-webkit-user-select: none;
    \-moz-user-select: none;
    \-ms-user-select: none;
    \-o-user-select: none;
    \-khtml-user-select: none;

    /* drag */
    \-webkit-user-drag: none;
    \-moz-user-drag: none;
    \-ms-user-drag: none;
    \-o-user-drag: none;
    \-khtml-user-drag: none;
}

.preventTouch {
    \-webkit-touch-callout: none;
    \-moz-user-touch-callout: none;
    \-ms-user-touch-callout: none;
    \-o-user-touch-callout: none;
    \-khtml-user-touch-callout: none;
}

.preventDrag {
    \-webkit-user-drag: none;
    \-moz-user-drag: none;
    \-ms-user-drag: none;
    \-o-user-drag: none;
    \-khtml-user-drag: none;
}

.preventSelect {
    user-select: none;
    \-webkit-user-select: none;
    \-moz-user-select: none;
    \-ms-user-select: none;
    \-o-user-select: none;
    \-khtml-user-select: none;
}

.preventTap {
    tap-highlight-color: rgba(0, 0, 0, 0);
    \-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    \-moz-tap-highlight-color: rgba(0, 0, 0, 0);
    \-ms-tap-highlight-color: rgba(0, 0, 0, 0);
    \-o-tap-highlight-color: rgba(0, 0, 0, 0);
    \-khtml-tap-highlight-color: rgba(0, 0, 0, 0);
}

input[type=text],
input[type=email],
input[type=url],
input[type=password],
textarea,
select {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.textCenter {
    text-align: center;
}

.searchFormPlaceHolder {
 padding-bottom: 2em;
}

@media screen and (max-width: 299px) {

    .searchfield {
        width: 90%;
    }
}

@media screen and (max-width: 959px) {

    body {
        font-size: 120%;
    }

    input[type=text],
    input[type=email],
    input[type=url],
    input[type=password],
    textarea,
    select {
        font-size: 120%;
    }

    .lnks {

        float: left;
        border: none;
        width: 50%;
    }

    div.mobile {
        display:inline-block;
    }
    div.mobileNot {
        display: none;
    }

    .main_content {
        margin-bottom: 0em;
    }

    .toolbar_box li {
        margin-top:0.4em;
    }

}

@media (max-width: 444px) {

    .recaptchatable tr:first-child td {
        float: left;
        width: 50%;
    }

    .recaptchatable tr:first-child td:first-child {
        width: 100%;
    }

    .recaptchatable tr:last-child td {
        float: left;
        width: 100%;
    }
}

@media screen {

    .print {
        display:none;
    }
}

@media print {


    .noprint {
        display: none;
    }
}
/* !!! system  WikiGenes */

#noscriptMsg {
 border: 1px solid #B22222;
 margin-top:4em;
 margin-bottom:4em;
 padding:1em;
}

.importantDescription {
 display:none;
}

.important {
 display:none;
}

/* !!! dragging */
.wokoonDragMode {
 cursor:move;
}

#DOM_dragScreen {
 background-color: #FFFFFF;
 -moz-opacity:0;
 opacity:0;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

/* !!! screens */

.wokoonModalBackground {
 background-color: #cccccc;
 -moz-opacity:0.3;
 opacity:0.3;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=30)";
 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
}

.wokoonChildProofScreen {
 background-color: #ffffff;
 -moz-opacity:0;
 opacity:0;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

.wokoonCriticalErrorScreen {
 background-color: #333333;
 -moz-opacity:0.3;
 opacity:0.3;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=30)";
 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
}


/* !!! menus */

wokoonMenuWintable.wokoonMenu {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 border: none;
 background-color:#FFFFFF;
}

table.wokoonMenu {
    border-spacing: 0px;
    border-collapse: collapse;
}

td.wokoonMenu {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 text-decoration:none;
 white-space:nowrap;
 padding: 2px;
}

td.wokoonMenu A:hover {
    text-decoration: underline;
    color: #346d84 !important;
}

tr.wokoonMenu.selected {
 background-color: #f0f8ff;
}

tr.wokoonMenu:hover {

 background-color: #ebebeb;
}

td.wokoonMenu A {
 text-decoration:none;
 color:#284d5d;
 font-weight:bold;
}

.wokoonMenuOffset {
}

.wokoonSubMenuOffset {
 left:-8px;
}

.wokoonMenuWin {
 border:solid 1px #284d5d;
 background-color:#FFFFFF;
}

.wokoonMenuWin A {
    color:#284d5d;
}

.wokoonMenuWin A:hover {
    color: #346d84 !important;
}

.wokoonMenuWinTitle {
 font-family: Verdana, Arial, Helvetica, sans-serif;
/*
 font-weight:bold;
*/
 color:#ffffff;
 background-color:#284d5d;
 border:none;
 padding:2px;

 background-image:url("/img/window_title.gif");
 background-repeat:repeat-x;
 background-position:0px 0px;
}

.wokoonMenuContent {
 padding:2px;
 max-height:200px;
 overflow:auto;
}

/* !!! menu bar */

#wokoonMenuBarCtrl {
 border-top:#cccccc dashed 1px;
 padding-top:4px;
 margin-top:2px;
 margin-bottom:2px;
}

/* !!! mouse over tip */

.wokoonTip {
 max-width:200px;
 background-color:#FFFFCC;
 border: solid 1px #cccccc; border-right: solid 1px #818181; border-bottom: solid 1px #818181;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 8pt;
 color:#333333;
}

/* !!! mouse over pip (during ajax connection) */

.wokoonPip {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 8pt;
 color:#666666;
}

/* !!! iframes */

.wokoonIFrameWin {
 border:solid 1px #284d5d;
 background-color:#FFFFFF;
}

.wokoonIFrameWinTitle {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 /*font-weight:bold;
 */
 color:#ffffff;
 background-color:#284d5d;
 border:none;
 padding:2px;

 background-image:url("/img/window_title.gif");
 background-repeat:repeat-x;
 background-position:0px 0px;
}

/* !!! windows */

.wokoonWindow {

}

.wokoonWindowTitle {

}

.wokoonWindowContent {
    padding:5px;
}

.wokoonWindowContent A {
    color:#284d5d;
}

.wokoonWindowContent A:hover {
    color: #346d84 !important;
}


.wokoonWindowContainer {
    overflow: auto;
    -webkit-overflow-scrolling:touch;
}

.wokoonWinButton {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 color:#ffffff;
 text-decoration:none;
 cursor:default;
}

/* wait box/animation */

#waitAnimPosId {
    position: fixed;
    left: 0;
    right: 0;
    top: 40%;
    z-index: 999;
/*
    display: none;
*/
}

.waitAnimation {
 background-repeat:no-repeat;
 border:0px;
 width:75px;
 height:75px;
 margin:0px;
 overflow:hidden;
 margin-left:auto;
 margin-right:auto;
}

.waitBox {
    width: 40em;
    margin-left:auto;
    margin-right:auto;
}

.waitMsg {
 text-align:center;
/*
 white-space:nowrap;
*/

    border:solid 1px #cccccc;
/*
    border:solid 1px #ff0000;
*/
    background-color: #FFFFFF;

    padding:2em;
 padding-top:1em;
 padding-bottom:1em;
 margin:0;
    margin-bottom: 1em;


    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    -moz-transition: all .218s;
    -webkit-transition: all .218s;
}

.waitMsg h1 {
 padding:0;
 margin:0;
 margin-bottom:0.2em;
}

/* !!! shadow */

.wokoonShadowOffset {
 left: 10px;
 top: 10px;
}

/* !!! buttons */

/* there is also the button class in global.css */
.wokoonButton {
 color:#284d5d;
 font-size:110%;
 font-weight:bold;
 text-wrap: none;
}

A.wokoonButton {
    text-decoration: none;
}

A.wokoonButton:hover {
    color: #346d84 !important;
}

/* !!! Online Help Div */
.wokoonOLH {
}

/* !!! modal dialog */
.wokoonModalDialog {
 width:400px;
}

/* !!! tabs */

.tabs {
 padding: 0px;
 margin: 0px;

 background-image: url("/img/tab/tab_bg.gif");
 background-repeat: repeat-x;
 height:1%;  /*bug fix for ie 6 (clear:both)*/
}

.tab_panel {
 clear: both;
}

.tab_spc_l {
 float: left;
 width: 10px;
}

.tab_spc_r {
 float: left;
 width: 10px;
}

.tab_l, .tab_la, .tab_lloa, .tab_lroa {
 width: 4px;
 background-image: url("/img/tab/tab_l.gif");
 background-repeat: no-repeat;
}

.tab_c, .tab_ca, .tab_cloa, .tab_croa {
 background-image: url("/img/tab/tab_c.gif");
 background-repeat: repeat-x;

 padding-top: 3px;
 padding-left: 6px;
 padding-right: 6px;
}

.tab_r, .tab_ra, .tab_rloa, .tab_rroa {
 width: 4px;
 background-image: url("/img/tab/tab_r.gif");
 background-repeat: no-repeat;
 margin-right: 2px;
}

.tab_l, .tab_c, .tab_r, .tab_la, .tab_ca, .tab_ra,.tab_lloa, .tab_cloa, .tab_rloa, .tab_lroa, .tab_croa, .tab_rroa {
 float: left;
 height: 21px;
}

.tab_l, .tab_r, .tab_la, .tab_ra, .tab_lloa, .tab_rloa, .tab_lroa, .tab_rroa  {
 font-size:1px;
}

.tab_lloa {
}

.tab_cloa {
}

.tab_rloa {
}

.tab_la {
 background-image: url("/img/tab/tab_la.gif");
}

.tab_ca {
 background-image: url("/img/tab/tab_ca.gif");
}

.tab_ra {
 background-image: url("/img/tab/tab_ra.gif");
}

.tab_lroa {
}

.tab_croa {
}

.tab_rroa {
}

.waitAnimationCss3 {
    background-image: url("/img/wait/waitCss3.png");

    /* restrict dim */
    width: 50px;
    height: 50px;

    margin-left: auto;
    margin-right: auto;
}


    .waitAnimationCss3 {

        animation-duration: 1s;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
        animation-name: progressIndicatorAnimation;
    }

.waitAnimationCss3 {

    \-webkit-animation-duration: 1s;
    \-webkit-animation-iteration-count: infinite;
    \-webkit-animation-timing-function: linear;
    \-webkit-animation-name: progressIndicatorAnimation;
}

.waitAnimationCss3 {
    \-moz-animation-duration: 1s;
    \-moz-animation-iteration-count: infinite;
    \-moz-animation-timing-function: linear;
    \-moz-animation-name: progressIndicatorAnimation;
}


@keyframes progressIndicatorAnimation {

        0% { transform: rotate(0deg); }
        8.2% { transform: rotate(0deg); }

        8.3% { transform: rotate(30deg); }
        16.5% { transform: rotate(30deg); }

        16.6% { transform: rotate(60deg); }
        24.9% { transform: rotate(60deg); }

        25% { transform: rotate(90deg); }
        33.2% { transform: rotate(90deg); }

        33.3% { transform: rotate(120deg); }
        41.5% { transform: rotate(120deg); }

        41.6% { transform: rotate(150deg); }
        49.9% { transform: rotate(150deg); }

        50% { transform: rotate(180deg); }
        58.2% { transform: rotate(180deg); }

        58.3% { transform: rotate(210deg); }
        66.5% { transform: rotate(210deg); }

        66.6% { transform: rotate(240deg); }
        74.9% { transform: rotate(240deg); }

        75% { transform: rotate(270deg); }
        83.2% { transform: rotate(270deg); }

        83.3% { transform: rotate(300deg); }
        91.5% { transform: rotate(300deg); }

        91.6% { transform: rotate(330deg); }
        99.90% { transform: rotate(330deg); }

        99.91% { transform: rotate(360deg); }
        100% { transform: rotate(360deg); }
    }

    @-webkit-keyframes progressIndicatorAnimation {

        0% { -webkit-transform: rotate(0deg); }
        8.2% { -webkit-transform: rotate(0deg); }

        8.3% { -webkit-transform: rotate(30deg); }
        16.5% { -webkit-transform: rotate(30deg); }

        16.6% { -webkit-transform: rotate(60deg); }
        24.9% { -webkit-transform: rotate(60deg); }

        25% { -webkit-transform: rotate(90deg); }
        33.2% { -webkit-transform: rotate(90deg); }

        33.3% { -webkit-transform: rotate(120deg); }
        41.5% { -webkit-transform: rotate(120deg); }

        41.6% { -webkit-transform: rotate(150deg); }
        49.9% { -webkit-transform: rotate(150deg); }

        50% { -webkit-transform: rotate(180deg); }
        58.2% { -webkit-transform: rotate(180deg); }

        58.3% { -webkit-transform: rotate(210deg); }
        66.5% { -webkit-transform: rotate(210deg); }

        66.6% { -webkit-transform: rotate(240deg); }
        74.9% { -webkit-transform: rotate(240deg); }

        75% { -webkit-transform: rotate(270deg); }
        83.2% { -webkit-transform: rotate(270deg); }

        83.3% { -webkit-transform: rotate(300deg); }
        91.5% { -webkit-transform: rotate(300deg); }

        91.6% { -webkit-transform: rotate(330deg); }
        99.90% { -webkit-transform: rotate(330deg); }

        99.91% { -webkit-transform: rotate(360deg); }
        100% { -webkit-transform: rotate(360deg); }



    }

    @-moz-keyframes progressIndicatorAnimation {

        0% { -moz-transform: rotate(0deg); }
        8.2% { -moz-transform: rotate(0deg); }

        8.3% { -moz-transform: rotate(30deg); }
        16.5% { -moz-transform: rotate(30deg); }

        16.6% { -moz-transform: rotate(60deg); }
        24.9% { -moz-transform: rotate(60deg); }

        25% { -moz-transform: rotate(90deg); }
        33.2% { -moz-transform: rotate(90deg); }

        33.3% { -moz-transform: rotate(120deg); }
        41.5% { -moz-transform: rotate(120deg); }

        41.6% { -moz-transform: rotate(150deg); }
        49.9% { -moz-transform: rotate(150deg); }

        50% { -moz-transform: rotate(180deg); }
        58.2% { -moz-transform: rotate(180deg); }

        58.3% { -moz-transform: rotate(210deg); }
        66.5% { -moz-transform: rotate(210deg); }

        66.6% { -moz-transform: rotate(240deg); }
        74.9% { -moz-transform: rotate(240deg); }

        75% { -moz-transform: rotate(270deg); }
        83.2% { -moz-transform: rotate(270deg); }

        83.3% { -moz-transform: rotate(300deg); }
        91.5% { -moz-transform: rotate(300deg); }

        91.6% { -moz-transform: rotate(330deg); }
        99.90% { -moz-transform: rotate(330deg); }

        99.91% { -moz-transform: rotate(360deg); }
        100% { -moz-transform: rotate(360deg); }
    }

@media screen and (max-width: 959px) {

  .wokoonModalDialog {
    width:auto;
    max-width: 400px;
  }

    .waitBox {
        width: 5em;
    }

    .waitMsg {
        display: none;
    }

}

