body,textarea,td,th,.ui-widget {
    font-family:  'Trebuchet MS', sans-serif;
    font-size:10pt;
}

.peptable th {
    text-align:left;
    font-weight:normal;
}

#app { width:1030px; margin: 0px auto;
        position:relative;
}
#app.small { width:600px; font-size:8pt; }
.small #intro { width:600px; }
.small .ui-widget {
font-size:8pt; }
#frame-div {
    width:100%; height:400px;
    border-top:solid black 1px; margin-top:10px; clear:both;
   -webkit-transition: all 600ms ease-in;
   -moz-transition: all 600ms ease-in;
   -o-transition: all 600ms ease-in;
   -ms-transition: all 600ms ease-in;
   transition: all 600ms ease-in;
}
#frame-div.hiding { height:650px; }
#results { width:100%; height:100%; }
#left { float:left;
    margin-bottom:10px;
}

#left {
    width:500px;
    height:160px;
}
.tab-frame { height:100px; overflow:auto; }
#protein {
    width:100%;
    height:90%;
    background-color:transparent;
    display:block;
}
.small #left {
    width:240px;
    height:140px;
}
#protein.error {
    color:red;
}
.initial-text {
    color:#aaaaaa;
    /* font-size:15pt; */
    /*
    background-image:url(../images/ce4csblogo2.png);background-repeat: no-repeat;
    */
    background-position:50px 50px;
}
.right {
    float:right;
    width:450px;
    height:160px;
    /* border-radius:6px; */
    /* box-shadow:8px 8px 8px #888; margin-left:5px; padding:10px;   */
    margin-bottom:10px;
    margin-right:15px;
}
.small .right {
    width:300px;
    height:140px;
}
#results { clear:both; }

#header {
    font-size:36pt;
    text-shadow:#888 -8px 8px 8px;
    color:#fff;
    font-family: 'Gruppo', 'Trebuchet MS', sans-serif;
    margin-left:10px; margin-right:10px;
    /* border:solid gray 1px;  */
    /* border-radius:6px;  box-shadow:8px 8px 8px; */
    padding-left:50px;
    padding-right:10px;
    padding-top:20px;
    padding-bottom:20px;
    height:70px;
    /*
    border-radius:15px 15px 0px 0px;
    border-bottom: solid gray 1px;
    */

}
#top {
   overflow:hidden; /* clearfix to ensure container encompasess floats https://pageaffairs.com/notebook/containing-floats */
   width:100%;
   -webkit-transition: all 600ms ease-in;
   -moz-transition: all 600ms ease-in;
   -o-transition: all 600ms ease-in;
   -ms-transition: all 600ms ease-in;
   transition: all 600ms ease-in;
   height:250px;
   border-top: solid gray 1px;
}
#app.small #top {
    height:170px;
}
#app #top.hiding {
    height:0px !important;
}
#hidetoolbar { width:20px; height:18px; }

#intro {
   -webkit-transition: all 600ms ease-in;
   -moz-transition: all 600ms ease-in;
   -o-transition: all 600ms ease-in;
   -ms-transition: all 600ms ease-in;
   transition: all 600ms ease-in;
   height:100px;
   border-top:solid gray 1px;

   /*
   border-bottom:solid gray 1px;
   */
}
#intro {
    text-align:justify;
    padding-left:100px;
    padding-right:100px;
    padding-bottom:0px;
}
#intro button { font-size:smaller !important; }
#intro.hiding { height:0px; opacity:0; overflow:hidden; }
#hideintro { width:20px; height:18px; float:left; }
.small #header {
    height:25px;
    font-size:15pt;
    padding-left:50px;
}
.small .tab-frame { overflow: auto; height:100px; }

#loader { display:none; }
#logo {
    background:url(../images/APPx200s.png) no-repeat top right;
    position:absolute;
    top:0px;
    right:20px;
    width:200px;
    height:150px;
    z-index:1;
/*
    background-image:url(../images/cherries.png);background-repeat: no-repeat;
*/
}
.small #logo  {
    top:-0px; right:0px; width:200px; height:100px;
    background:url(../images/APPx200s.png) no-repeat top right;
}
/*
html.svg #logo {
    background-image:url(../images/cherries.svg);background-repeat: no-repeat;
}
*/
.peptable { border-collapse:collapse; margin: 0px auto; }
.peptable td { color:#444; padding:0px 5px; }
.peptable .match { color:red; }
.peptable tr td .con { display:none; }

.peptable tr.o td { background-color:#deedf7; }
.peptable tr:nth-child(odd) { background-color:#deedf7; }
.peptable tr td:nth-child(1) { cursor:pointer; }
.peptable tr td:nth-child(1):hover { text-decoration:underline; } /* AGI */
.peptable tr td:nth-child(2) { font-family:Menlo, Courier New; text-align:left; }
.peptable tr td:nth-child(3) { text-align:right; } /* Mr */
.peptable tr td:nth-child(4) { text-align:center; } /* Miss Cleavages */
.peptable tr td:nth-child(6) { text-align:center; } /* Uniqueness in proteome */
.peptable tr td:nth-child(7) { text-align:center; } /* Uniqueness in DB */
.peptable tr td:nth-child(8) { text-align:center; } /* consensus */
/*
.peptable tr td:nth-child(8):hover { background-color:rgba(200,200,200,.4); }
*/

.peptable ul.agi {
     padding:0px; margin:0px; margin-left:1.2em; margin-bottom:.3em;
     list-style-position:inside;
     /* max-height:10em; overflow:auto; */
 }
.peptable ul.agi li { cursor:pointer; font-size:8pt; }
.peptable ul.agi li:hover { text-decoration:underline; } /* AGI */

.peptable thead tr th {
    border-bottom:solid black 4px;
    background-color:white; text-align:center;
    font-weight:bold; padding:0px 5px;
    vertical-align:bottom;
    cursor:s-resize;
}
.ascending.peptable thead tr th { cursor:n-resize; }
.peptable thead tr.fixed { position:fixed; top:0px; }
/* try and minimize second header */
.peptable thead tr.header2 { visibility:hidden; height:0px; border:none; }
.peptable thead tr.header2 th { visibility:hidden; height:0px;  border:none;  }

.result-container.small { font-size:7pt; }
.result-container.small td { font-size:7pt; }
.result-container.small th { font-size:7pt; }


#buttonset { display:none; }
#acknowledgements { font-size:larger;
/* box-shadow: 3px 3px 3px 3px #CCC; */
border:solid #888 1px;
padding:5px; border-radius:3px; width:500px;
margin: 0px auto; margin-top:100px; }
#no-app { display:none; }


#logos { width: 100%; margin-top:10px; height:60px; border-top:solid gray 1px; /*border-radius: 0px 0px 15px 15px; */
    padding-top:5px; }
#logos a { text-decoration:none; cursor:pointer; }
#logos-cont { width: 770px; margin: 0px auto; overflow:hidden; padding-left:30px; }
#logos  img {
    float:left;
    border:none;
    margin-left:12px;
    margin-right:12px;
    display:inline-block;
}

#logos  #logo-peb   img { width:240px; margin-left: 102px; padding-top:5px;  }
#logos  #logo-cabin img { width:200px; margin-left: 12px; padding-top:5px;  }


#found { font-weight:bold; }
#tabs-search { padding-top: 4px; }
#tabs-search ul { margin-top:0px; margin-bottom:4px; }
#tabs-help h3 { margin-top:0px; }
#copyright { margin: 0px auto; width:60em; text-align:center; margin-top:20px; }

#asside { position:absolute; top:470px; right:-80px; width:80px; text-align:center; }
.tparent { width:44px; padding:0px; margin:0px auto;}
.temp { width: 22px; height: 14px; font-size:12px; padding:0px; margin:0px; border:none; vertical-align:middle; color:white; text-align:center;
float:left; margin-right:3px; }
.temp.bg { width:10px; }