.collapsible-accordion {
    padding-top:0;
}



/* Class for new screen link in viewjobImpl.jsp and viewjobImpl_new.jsp */
.changeScreenLink {
    position: fixed;
    top: 5px;
    left: 510px;
    z-index: 1000;
}

@media only screen and (min-width: 993px) and (max-width: 1200px){
    .changeScreenLink{
        display: none;
    }
}

@media only screen and (max-width: 992px){
    .changeScreenLink{
        left: 100px;
    }
}

/* 

Old legacy CSS - probably should be removed 
Scroll down to the 'New css over-rides' section at the bottom


*/ 

.side-nav .collapsible-body, .side-nav.fixed .collapsible-body {
    padding: 0;
}

label {
  font-weight:bold;
}

.row {
    margin-bottom:1px;
}

.bannerdetails {
    font-size:14px;
}
.bannerdetails-icon {
    color:black;
}

.environmentHeading {
    padding-left:10px;
    font-size: 36px;
    color: red;
}

.warning {
    font-size: 12px;
    color: #FFA500;
    font-weight: bold;
}

.approved {
    font-size: 12px;
    color: #008B8B;
    font-weight: bold ;
}

.error {
    font-size: 12px;
    color: #FF0000;
    font-weight: bold ;
}

.errorleft {
    font-size: 12px;
    color: #FF0000;
    font-weight: bold ;
    text-align: left;
}

.success {
    font-size: 12px;
    color: #00CC00;
    font-weight: bold ;
}

.mandatory {
    font-size: 10px;
    color: red;
}

.raaimandatory {
    font-size: 10px;
    color: red;
}

.generic {
    color: #000000;
}

.genericRight {
    color: #000000;
    text-align: right ;
}

.greentextbold {
    font-size: 12px;
    color: #009999;
    font-weight: bold;
}

.bodytextbold {
    color: #000000;
    font-weight: bold;
}

.terms {
    color: #000000;
    font-weight: bold;
    border: 1px solid #CCCCCC;
}
.termshead {
    color: #000000;
    font-weight: bold;
}
.termsbody {
    font-size: 9px;
    color: #000000;
    font-weight: bold;
}
/*a:link, a:visited, a:active { color:#333333; text-decoration: none }
a:hover {color: #666666}*/

.userName {
    color: #333333;
    text-align:left;
    font-weight: normal;
    display: block;

}

/* -------------------------- HEADING and SUBHEAD --------------------------------- */

.header1 {
    color: #FFFFFF;
    background-color: #000000;
    text-align: left;
    font-weight: bold;
    text-indent: 7px;
}
.header1print, .header1print:link, .header1print:visited, .header1print:active {
    color: #FFFFFF;
    text-align: center;
    font-weight: normal;
    padding-left: 7px;
    padding-right: 7px;
}
.header1print:hover {
    text-decoration: underline
}

.header2 {
    color: #FFFFFF;
    background-color: #666666;
    text-align:left;
    font-weight: bold;
    padding: 10px 1px;
    margin-right: 5px;
    margin-bottom: 5px;
}

.header3 {
    color: #000000;
    background-color: #ffdd00;
    text-align:left;
    font-weight: bold;
    padding: 10px 1px;
    margin-right: 5px;
    margin-bottom: 5px;
}

/* -------------------------- PAGINATION --------------------------------- */

.waves-effect.waves-blue .waves-ripple {
  background-color: rgba(52, 122, 182, 0.7);
}

ul.pagination {
  font-size: 0;
}

ul.pagination li {
  font-size: 14px; font-size:1.4rem;
  display: inline;
}

.pagination li.active {
    background-color: #317BBA;
    color: #fff;
}
.pagination li {
    border-left: 1px solid #317BBA;
    border-top: 1px solid #317BBA;
    border-bottom: 1px solid #317BBA;
}
.pagination li a {
    color: #317BBA;
    padding: 0px 5px 0px 5px;
}

/* -------------------------- NAVBAR --------------------------------- */

.side-nav.fixed .collapsible li {
    line-height: 30px;
}

    .navbar {
        background-color: #ffdd00;
    }

    .normalbutton{
        color: #000000;
        text-align:left ;
        font-weight: bold ;
        text-decoration: none ;
        padding-bottom: 3px;
        cursor:hand;
        padding:1px 0;
    }

    .overbutton{
        color: #000000;
        text-align:left ;
        font-weight: bold ;
        background-color: #FFFF99;
        text-decoration: none ;
        padding-bottom: 3px;
        cursor:hand;
    }

    .downbutton{
        color: #000000;
        text-align:left ;
        font-weight: bold ;
        background-color: #CCCC66;
        text-decoration: none ;
        padding-bottom: 3px;
        cursor:hand;
    }

td.primarylink  {
    background-color: #CACACA;
    text-decoration: none ;
    padding-bottom: 2px;

}
td.primarylink:hover {
    background-color: #FFFF99;
 }

a.primarylink  {
    color: #000000;
    text-align:left ;
    font-weight: bold ;

}


/*  -------------------------- BANNER --------------------------------- */

.banner {
    background-color: white;
    color: #FFFFFF;
}

.bannerRight {
    background-color: #FFFFFF;
    color: #FFFFFF;
    text-align: right;
}

.yellowline {
   background-color: #000000;
   color: #CACACA ;
   font-size: 1px;
}


/* -------------------------- LISTS --------------------------------- */

.listTableWrap {
    padding: 0;
}

.listTableHead {
    color: #000000;
    font-weight: bold;
    white-space: nowrap;
}




.listTableHead {
    background-color: #ffdd00;
}

.paddingRight {
    padding-right: 10px;
}

a.listTableHead{
    color: #000000;
    font-weight: bold;
    text-decoration:none
}

a.listTableHead:hover {
    color: #000000;
    font-weight: bold;
    text-decoration: none;
}


a.listTableRowHead:link     {text-decoration:underline}
a.listTableRowHead:visited  {text-decoration:underline}
a.listTableRowHead:active   {text-decoration:underline}

.listTableRowBody {
    font-weight: normal ;
}

.listTableRowBodyCentre {
    font-weight: normal;
    text-align: center;
}

th.listTableHeadAligned {
    color: #000000;
    font-weight: bold;
    text-decoration:underline;

}

/* -------------------------- FORMS --------------------------------- */

span.formLabel, td.formLabel {
    text-align: right;
    padding-right: 5px;
    font-weight: bold;
    color: #000000;
}
td.formLabelLeft {
    text-align: left;
    vertical-align:middle;
    padding-right: 5px;
    font-weight: bold;
    color: #000000;
}

td.formLabelTop {
    text-align: right;
    padding-right: 5px;
    font-weight: bold ;
    color: #333333;
    vertical-align:top;
}

td.formItem {
    text-align: left ;
    padding-right: 5px;
    font-weight: normal ;
    color: #000000;
}

/* -------------------------- ITEM DISPLAY --------------------------------- */
tr.italicN/C {
    font-size: 10px;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    background-color: #FFFFFF;
}

tr.italicADDED {
    font-style: italic;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    background-color: #DDFF88;
}

tr.italicRMV {
    font-style: italic;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    background-color: #FFCCCC;
}

tr.italicADJ {
    font-style: italic;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    background-color: #E6CCFF;
}

tr.italicREF {
    font-style: italic;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    background-color: #CCFFCC;
}

.displayTableWithBorders {
    border: 1px solid #CCCCCC;
    padding: 4px;
    width: 100%;
}

.displayTable {
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding: 4px;
    width: 100%;
}

.displayItemsTable {
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding: 4px;
    width: 100%;
}

td.displayTableLabel {
    color: #000000;
    background-color: #ffdd00;
    text-align: left;
    font-weight: bold;
    margin-left: 7px;
    padding-left: 3px;
    border-left: 1px solid #CCCCCC;
}

td.displayTableLabelRACT {
    color: #ffffff;
    background-color: #195fa4;
    text-align: left;
    font-weight: bold;
    margin-left: 7px;
    padding-left: 3px;
    border-left: 1px solid #CCCCCC;
}

td.displayTableLabelNoBorder {
    color: #000000;
    background-color: #ffdd00;
    text-align: left;
    font-weight: bold ;
    padding: 2px;
}

.displayTableHead {
    font-weight: bold ;
    color: #000000;
}

td.displayTableHead {
    font-weight: bold ;
   color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    padding:3px;
}

.responsive-table td.displayTableHead {
    border-left: none;
    border-top: none;
}

.displayTableBody {
    font-weight: normal ;
    color: #000000;
}

td.displayTableBody {
    padding:3px;
    font-weight: normal ;
    color: #000000;
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
}

td.reportOnlyItem {
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    font-weight: normal ;
    font-style: italic ;
    color: #666666;

}

td.displayTableBodyNoBorder {
    font-weight: normal ;
    color: #000000;
}
td.wovrImage {
    background-position:center;
    background-repeat:no-repeat;
    position:relative;
    vertical-align:middle;
}

td.wovrSelect {
    font-weight: bold ;
    color: #000000;
    position:relative;
}

.whitebackground{
 background:#ffffff;
}
/* -------------------------- THUMBNAILS --------------------------------- */

a.linkWithPopup {
    color: #990000;
    font-weight: bold ;
    text-decoration: underline;
}
a.linkWithPopup:hover {
    position: relative;
    background-color: #FFFFFF;
    color: #FFCC33;
    text-decoration: none
}
a.linkWithPopup span {
    display: none;
    font-weight: normal;
    border:1px solid #D2D1EB;
    background:#FFFFFF;
    padding: 2px;
}
a.linkWithPopup:hover span.thumbnailLink {
    top:0;
    left:0;
    display: block;
    position: absolute;
    margin-top:72px;
    margin-left:-45px;
}
a.linkWithPopup:hover span{
    top:0;
    left:0;
    display: block;
    position: absolute;
    margin-top:30px;
    margin-left:-60px;
}

/* -------------------------- BUTTONS --------------------------------- */

.greenLink {
    color: #660000;
    font-weight: bold ;
    text-decoration: underline
}
a.greenLink {
    min-height: 35px;
    color: #660000;
    font-weight: bold;
    text-decoration: underline
}

a.greenLink:link, a.greenLink:visited, a.greenLink:active { 
    color:#660000; 
    text-decoration: underline; 
}
a.greenLink:hover { 
    color: #660000; 
    text-decoration: none 
}

.greyLink {
    color: #555555;
    font-weight: bold ;
    text-decoration: underline
}
a.greyLink {
    min-height: 35px;
    display:block;
    color: #555555;
    font-weight: bold ;
    text-decoration: underline
}
.greyImage {
    color: #555555;
    font-weight: bold ;
    filter: Gray
}
a.greyLink:link { color:#555555; text-decoration: underline }
a.greyLink:hover {  color: #555555; text-decoration: none }


a.redLink:visited, a.redLink:active { color:#555555; text-decoration: underline }
.redLink {
    color: #990000;
    font-weight: bold ;
    text-decoration: underline
}
a.redLink {
    min-height: 35px;
    color: #dd0000;
    font-weight: bold ;
    text-decoration: underline
}
a.redLink:link, a.redLink:visited, a.redLink:active { color:#990000; text-decoration: underline }
a.redLink:hover { text-decoration: none }

a.greenLinkWithImage {
    min-height: 35px;
    color: #660000;
    font-weight: bold ;
    text-decoration: underline;
    background:url(../../../../images/tick.gif) center right no-repeat;
    padding:0 20px 0 0;
    white-space:nowrap;
}

a.greenLinkWithImage:link { color:#660000;; text-decoration: underline }
a.greenLinkWithImage:visited { color:#660000;; text-decoration: underline }
a.greenLinkWithImage:active { color:#660000;; text-decoration: underline }
a.greenLinkWithImage:hover {    color: #FFCC33; text-decoration: none }

a.greyLinkWithImage {
    min-height: 35px;
    color: #555555;
    font-weight: bold ;
    text-decoration: underline;
    background:url(../../../../images/tick_grey.gif) center right no-repeat;
    padding:0 20px 0 0;
    white-space:nowrap;
}

a.redLinkWithImage {
    min-height: 35px;
    color: #990000;
    font-weight: bold ;
    text-decoration: underline;
    background:url(../../../../images/cross.gif) center right no-repeat;
    padding:0 20px 0 0;
    white-space:nowrap;
}
a.redLinkWithImage:link { color:#990000; text-decoration: underline }
a.redLinkWithImage:visited { color:#990000; text-decoration: underline }
a.redLinkWithImage:active { color:#990000; text-decoration: underline }
a.redLinkWithImage:hover {  color: #FFCC33; text-decoration: none }

a.greyLinkWithCrossImage {
    color: #555555;
    font-weight: bold ;
    text-decoration: underline;
    background:url(../../../../images/cross_grey.gif) center right no-repeat;
    padding:0 20px 0 0;
    white-space:nowrap;
}
/* -------------------------- PAGER LINKS --------------------------------- */

.pagerLink {
    color: #666699;
    font-weight: normal ;
    text-decoration: none;
}

.pagerNoLink {
    color: #000000;
    font-weight: bold ;
    text-decoration: none;
}
a.pagerNoLink:hover {   color: #ffdd00; text-decoration: none }
a.pagerLink {
    color: #666699;
    font-weight: bold ;
    text-decoration: none;
}
a.pagerLink:link, a.pagerLink:visited, a.pagerLink:active {
    color: #990000;
    font-weight: bold ;
    text-decoration: underline;
}
a.pagerLink:hover { color: #CACACA; text-decoration: none }
/* -------------------------- Damage Claasification --------------------------------- */


img.ui-combobox-arrow {
    position: relative;
    vertical-align: text-bottom;
}

.inputField {
    width: 50px;
    background-color: yellow;
}

.inputFieldWide {
    width: 160px;
}

.inputFieldWideParts {
    width: 120px;
}

* html img.ui-combobox-arrow {
    top: -3px;
}

.ui-combobox-list {
    border: 1px solid black;
    z-index: 25555;
}

.ui-combobox-list, .ui-combobox-item {
    display: block;
    font-size: 10px;
    background-color: white;
}

.ui-combobox-list .selected {
    background-color: #eeeeff;
    border-top: 1px solid blue;
    border-bottom: 1px solid blue;
    font-weight: bold;
}

 .widget {
 width: 820px;
 }

#easyTooltip{
    padding:5px 10px;
    border:1px solid #195fa4;
    background:#000000;
    color:#fff;
}

.formError {
            position:absolute;
            top:300px; left:300px;
            width:150px;
            padding-bottom:15px;
            display:block;
            z-index:5000;
        }
.formError .formErrorContent {
    width: 100%;
    background: #3c3b3b;
    color: #fff;
    font-size: 10px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    padding: 10px 10px 10px 10px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.formError .formErrorArrow{
    position:absolute;
    bottom:0;left:20px;
    width:15px; height:15px;

}
.formError .formErrorArrow div{
    box-shadow: 1px 4px 5px #000;
    -moz-box-shadow: 1px 4px 5px #000;
    -webkit-box-shadow: 1px 1px 5px #000;
    font-size:0px;
}
.formError .formErrorArrow .line10{width:8px;height:1px; background:#3c3b3b;margin:0 auto; font-size:0px; display:block;}
.formError .formErrorArrow .line9{width:7px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line8{width:6px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line7{width:5px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line6{width:4px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line5{width:3px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line4{width:2px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}
.formError .formErrorArrow .line3{width:1px;height:1px; background:#3c3b3b;margin:0 auto;display:block;}

#jquery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100%;
    height: 500px;
}
#jquery-lightbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    text-align: center;
    line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
    position: relative;
    background-color: #fff;
    width: 250px;
    height: 250px;
    margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
}
#lightbox-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
    width: 49%;
    height: 100%;
    zoom: 1;
    display: block;
}
#lightbox-nav-btnPrev {
    left: 0;
    float: left;
}
#lightbox-nav-btnNext {
    right: 0;
    float: right;
}
#lightbox-container-image-data-box {
    font: 10px Verdana, Helvetica, sans-serif;
    background-color: #fff;
    margin: 0 auto;
    line-height: 1.4em;
    overflow: auto;
    width: 100%;
    padding: 0 10px 0;
}
#lightbox-container-image-data {
    padding: 0 10px;
    color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
    width: 70%;
    float: left;
    text-align: left;
}
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
    display: block;
    clear: left;
    padding-bottom: 1.0em;
}
#lightbox-secNav-btnClose {
    width: 66px;
    float: right;
    padding-bottom: 0.7em;
}

/* -------------------------- wysiwyg Editor ---------------------------------*/

div.wysiwyg { border: 1px solid #cccccc; padding: 5px; background-color: #ffffff; }
div.wysiwyg * { margin: 0; padding: 0; }

div.wysiwyg ul.panel { border-bottom: 1px solid #cccccc; float: left; width: 100%; padding: 0 0 4px 0; }
div.wysiwyg ul.panel li { list-style-type: none; float: left; margin: 0 2px;  background: #ffffff;}
div.wysiwyg ul.panel li.separator { height: 16px; margin: 0 4px; border-left: 1px solid #cccccc; }
div.wysiwyg ul.panel li a { opacity: 0.6; display: block; width: 16px; height: 16px; background: url('../../../../images/jquery.wysiwyg.gif') no-repeat -64px -80px; border: 0; cursor: pointer; padding: 1px; }
div.wysiwyg ul.panel li a:hover, div.wysiwyg ul.panel li a.active { opacity: 0.99; }
div.wysiwyg ul.panel li a.active { background-color: #f9f9f9; border: 1px solid #cccccc; border-left-color: #aaaaaa; border-top-color: #aaaaaa; padding: 0; }

div.wysiwyg ul.panel li a.bold { background-position: 0 -16px; }
div.wysiwyg ul.panel li a.italic { background-position: -16px -16px; }
div.wysiwyg ul.panel li a.strikeThrough { background-position: -32px -16px; }
div.wysiwyg ul.panel li a.underline { background-position: -48px -16px; }

div.wysiwyg ul.panel li a.justifyLeft { background-position: 0 0; }
div.wysiwyg ul.panel li a.justifyCenter { background-position: -16px 0; }
div.wysiwyg ul.panel li a.justifyRight { background-position: -32px 0; }
div.wysiwyg ul.panel li a.justifyFull { background-position: -48px 0; }

div.wysiwyg ul.panel li a.indent { background-position: -64px 0; }
div.wysiwyg ul.panel li a.outdent { background-position: -80px 0; }

div.wysiwyg ul.panel li a.subscript { background-position: -64px -16px; }
div.wysiwyg ul.panel li a.superscript { background-position: -80px -16px; }

div.wysiwyg ul.panel li a.undo { background-position: 0 -64px; }
div.wysiwyg ul.panel li a.redo { background-position: -16px -64px; }

div.wysiwyg ul.panel li a.insertOrderedList { background-position: -32px -48px; }
div.wysiwyg ul.panel li a.insertUnorderedList { background-position: -16px -48px; }
div.wysiwyg ul.panel li a.insertHorizontalRule { background-position: 0 -48px; }

div.wysiwyg ul.panel li a.h1 { background-position: 0 -32px; }
div.wysiwyg ul.panel li a.h2 { background-position: -16px -32px; }
div.wysiwyg ul.panel li a.h3 { background-position: -32px -32px; }
div.wysiwyg ul.panel li a.h4 { background-position: -48px -32px; }
div.wysiwyg ul.panel li a.h5 { background-position: -64px -32px; }
div.wysiwyg ul.panel li a.h6 { background-position: -80px -32px; }

div.wysiwyg ul.panel li a.cut { background-position: -32px -64px; }
div.wysiwyg ul.panel li a.copy { background-position: -48px -64px; }
div.wysiwyg ul.panel li a.paste { background-position: -64px -64px; }

div.wysiwyg ul.panel li a.increaseFontSize { background-position: -16px -80px; }
div.wysiwyg ul.panel li a.decreaseFontSize { background-position: -32px -80px; }

div.wysiwyg ul.panel li a.createLink { background-position: -80px -48px; }
div.wysiwyg ul.panel li a.insertImage { background-position: -80px -80px; }

div.wysiwyg ul.panel li a.html { background-position: -48px -48px; }
div.wysiwyg ul.panel li a.removeFormat { background-position: -80px -64px; }

div.wysiwyg ul.panel li a.empty { background-position: -64px -80px; }

div.wysiwyg iframe { border: 0; margin: 5px 0 0 0; clear: left; }

.accordian {
    width: 90%;
    margin: 10px auto;
}

.accordian li {
    list-style-type: none;
    padding: 3 20px;
}

.accordian-even, .accordian-odd {
    font-weight: bold;
    height: 15px;
    padding-top: 10px;
    padding-left: 20px;
    border: 1px solid grey;
    background:url(../../../../images/arrow.gif) 1% 50% no-repeat;
}

.accordian-even {
    background-color: #FD0;
}

.accordian-odd {
    background-color: #666;
    color: #FFF;
}

.attachTable{
    padding: 3px 20px;
    text-align: left;
    border-collapse:collapse;
}

.attachTable th{
    background-color: #FD0;
    font-weight: bold;
    border: 1px solid grey;
}

.attachTable td{
    border: 1px solid grey;
}


/*
  full screen notice popup
*/
/* Overlay */
#simplemodal-overlay {background-color:#555;}

/* Container */
#simplemodal-container {width:*; height:80px; }
#simplemodal-container {background-color:#fff; border:2px solid #FFDD00; padding:12px;line-height:20px;}

/**
 * Styles for DatePicker
 */

.datepickerControl {
    border:             1px solid #7f9db9;
    background-color:   #ffe682;
    padding:            5px;
}

.datepickerControl td {
    text-align:         center;
    font-size:          11px;
    padding:            1px;
}

.datepickerControl tr.monthLabel td {
    background-color:   #FFFFFF;
    border:             1px solid #999999;
    font-weight:        bold;
}

.datepickerControl tr.navigation td {
    cursor:             pointer;
}

.datepickerControl tr.navigation td:hover {
    text-decoration:    underline;
}

.datepickerControl tr.dayLabel td {
    border:             1px solid #888888;
    background-color:   #888888;
    color:              white;
    font-weight:        bold;
}

.datepickerControl td.day, .datepickerControl td.dayothermonth {
    cursor:             pointer;
    background-color:   #FFFFFF;
    border:             1px solid #EEEEEE;
    width:              2em;
}

.datepickerControl td.dayothermonth {
    color:              #999999;
    font-style:         italic;
}

.datepickerControl td.day:hover {
    background-color:   #fff6c8;
}

.datepickerControl td.weekend {
    background-color:   #DDDDDD;
    font-style:         italic;
}

.datepickerControl td.today {
    font-weight:        bold;
    background-color:   #ffe682;
}

.datepickerControl td.hour {
    cursor:             pointer;
    background-color:   #FFFFFF;
    border:             1px solid #EEEEEE;
    width:              2em;
}

.datepickerControl td.minute {
    cursor:             pointer;
    background-color:   #FFFFFF;
    border:             1px solid #EEEEEE;
    width:              2em;
}

.datepickerControl td input,
.datepickerControl td button {
    font-size:          11px;
    padding:            0;
    border:             1px solid #999999;
    text-align:         center;
}

.datepickerControl td.ampm {
    cursor:             pointer;
    background-color:   #CCCCCC;
    border:             1px solid #EEEEEE;
    width:              2em;
}

.datepickerControl td.current {
    font-weight:        bold;
    background-color:   #215077;
    color:              #ffffff;
}

.datepickerControl input.current {
    background-color:   #215077;
    color:              #ffffff;
}

.datepickerControl td.current:hover {
    background-color:   #215077;
    color:              #ffffff;
}

.tabcontent {
    display:none;
}

fieldset {
    border: 1px solid #CCCCCC;
}

#tablist li img.tabTickedPNG {
    vertical-align: middle;
    bottom: 2px;
    position: relative;
}

/**
 * style for displaying progress-icon.gif
 */
.progressIcon {
  border: 0px;
  width: 25px;
  height: 25px;
}



#embeddedViewRepairerDiv {
    background:#f0f0f0;
}

#embeddedViewRepairerDiv .displayTableHead, #embeddedViewRepairerDiv .displayTableBody {
    font-size: 12px;
}

.subtotal{
    background-color: #E5E5E5;
}

.please-note{
    background: #E6CCFF;
    padding:10px;
    display: table;
    vertical-align: middle;
}

.please-note span{
    display: table-cell;
    vertical-align: middle;
    padding-right: 10px;
}


.tabs .tab a{
    cursor:pointer;
}
















/* --------------------------------------------------------------------------


------ New css over-rides  ------


-----------------------------------------------------------------------------*/

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/material-design-icons/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
        local('MaterialIcons-Regular'),
       url(../fonts/material-design-icons/MaterialIcons-Regular.woff2) format('woff2'),
       url(../fonts/material-design-icons/MaterialIcons-Regular.woff) format('woff'),
       url(../fonts/material-design-icons/MaterialIcons-Regular.ttf) format('truetype');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}


html, body{
    font-size:13px;
}

h2 {
    font-size: 15px;
    font-weight: bold;
    margin-bottom:0;
}

h3 {
    font-size: 13px;
    color: #000000;
    font-weight: bold;
}

* {
    font-family:  Roboto, Sans-serif;
    font-size: 13px;
}

a{
    color: #125AA7;
}

.text-main-color{
    color: #0397D7;
}

.default-background{
    background: #F5F5F5;
    padding-bottom: 10px;
    padding-top:10px;
}

.icon-block {
  padding: 0 15px;
}
.icon-block .material-icons {
	font-size: inherit;
}


.section {
  padding-left: 1rem;
}

ul .logo {
  height: 64px;
}


.tabs .tab a.active {
    font-weight: bold;
}
.tabs .indicator{
    height: 3px;
    background-color: #0397D7;
}

.navbarshow {
    padding-left: 210px;
}
.navbarhide {
    padding-left: 0px;
}
.hidemenuclass {
    display: none;
}

@media only screen and (max-width: 992px){
    header, main, footer {
        padding-left: 0 !important;
    }
}
@media only screen and (max-width: 992px){
    .nav-container {
        margin-right: 0px !important;
    }
}

.content{
    padding-top:64px;
    padding-bottom: 50px;
}


/* 
Input fields
*/

input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], 
input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea,
.select-wrapper input.select-dropdown{
    height: 2.3rem;
    margin: 0px 0 5px 0;
    color: #125AA7;
}

.input-field{
    margin-bottom: 0.5rem;
}

.navbar-fixed{
    position:fixed;
    z-index: 1000;
}

nav a {
    color: #000;
}

.header-fixed{
    position:fixed;
    top:0;
    width:100%;
}

input:focus{
    border-bottom: 1px solid #1998d4 !important;
    box-shadow: 0 1px 0 0 #1998d4 !important;
}

.responsive-table .input-field{
    margin-top: 0;
}
@media only screen and (max-width: 992px){
    .responsive-table .input-field{
        height: 20px;
        margin:0;
    }
}

.select-wrapper span.caret{
    top:10px;
}

/* 
Side menu 
*/

.side-nav .collapsible-body, .side-nav.fixed .collapsible-body{
    background-color: #f5f5f5;
}

.side-nav.fixed{
    width:210px;
    background: #f5f5f5
}

.side-nav.fixed li {
    padding: 0 0px; 
}

.side-nav.fixed a {
    height: 35px;
    font-size:13.5px;
    line-height: 16px;
    padding-left: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    outline: 0;
}  

.side-nav li:hover, .side-nav li.active {
    background-color: transparent;
} 


.side-nav.fixed .collapsible li{
   line-height: 30px;
}

.side-nav.fixed .collapse-trigger{
    display: inline;
    height: 10px;
    font-size:13.5px;
    line-height: 2.5rem;
    padding-left: 15px;
    padding-right: 5px;
    margin: 0;
    width: 30px;
    font-weight: bold;
}
.side-nav.fixed .collapse-trigger ~ a{
    display:inline-block;
    padding-left: 0;
    padding-top: 8px;
}


.side-nav .collapsible-body li.active, .side-nav.fixed .collapsible-body li.active {
    background-color: transparent;
}

.side-nav.fixed .collapsible-body li.active a{
    cursor: default;
}

.side-nav .collapsible-body li.active a, .side-nav.fixed .collapsible-body li.active a, 
.side-nav .collapsible-body li a, .side-nav.fixed .collapsible-body li a {
    color: #000;
    margin:0;
    padding-left: 0;
    outline: 0;
}

.side-nav.fixed .sub-nav{
    font-weight: normal; 
    font-size: 13px;
    padding-left: 30px;
    line-height: 35px;
}

.side-nav a{
    font-size:0.9rem;
    color: rgba(0, 0, 0, 0.87) !important;
    font-weight: normal;
}

.side-nav.fixed .bottom-padding{
    height:100px;
}


/*
Navigation
*/
nav .logo-li {
    height:64px;
}
nav .side-nav a.logo {
    width:190px;
    height:64px;
    background:url("/img/arnie_white_logo.png")no-repeat;
    background-size:160px 54px;
    margin: 5px 15px 5px 15px;
    padding: 0px 0px 0px 0px;
}
nav, nav .nav-wrapper i, nav a.button-collapse, nav a.button-collapse i{
    height: 40px;
    line-height: 40px;
}

nav .nav-container{
    margin-right: 210px;
}


nav .dropdown-button{
    font-size:0.8rem;
}

nav .dropdown-button i.right{
    margin-left: 5px;

}

@media only screen and (max-width: 992px){
    nav .nav-container{
        margin-right: 0;
    }
    nav, nav .nav-wrapper i, nav a.button-collapse, nav a.button-collapse i{
        height: 50px;
        line-height: 40px;
    }
}


nav .org-logo{
    display: block;
    background:url("/img/arnielogo.png")no-repeat;
}

nav ul a{
    color:#000;
}


/*
Footer
*/

footer.page-footer .arnie-blue{
    background-color:#183A76;
}
footer.page-footer{
    width:100%;
    padding-top: 0;
    background-color: transparent;
    bottom: 0px;
    height: 25px;
    margin-left:0px;
    z-index: 0;
}
@media only screen and (max-width: 992px){
    footer.page-footer{
        margin-left:0;
    }
}

footer.page-footer .footer-copyright{
    height: 25px;
    line-height: 25px;
    min-height: 25px;
    font-size:12px;
    padding: 0px 0px 0px 30px;
}


.padding-left-bannerheading {
    padding-left:50px;
}
.no-pad-right{
    padding-right: 0 !important;
}

.no-margin{
    margin:0;
}


.breadcrumb:last-child{
    color:black;
}


td, th {
    padding: 10px 5px;
}

td[align="center"]{
    text-align:center;
}

td .select-wrapper input.select-dropdown{
    line-height: 1rem;
    font-size: 0.8rem;
}
td .select-wrapper span.caret{
    top: 6px;
}
td.displayTableLabel{   
    padding: 10px 3px 10px 3px !important;
}
td.displayTableHead{
   padding: 5px 3px 5px 3px !important;
}
td.displayTableHead br{
    display:none;
}

td input[type=text], td input[type=password], td input[type=email], td input[type=url], td input[type=time], 
td input[type=date], td input[type=datetime-local], td input[type=tel], td input[type=number], td input[type=search], 
td textarea.materialize-textarea, td .select-wrapper input.select-dropdown {
    height: 1.5rem;
    font-size: 1.0rem;
    width: 90%
}

.dropdown-content li > a, .dropdown-content li > span {
    font-size: 14px;
    color: #125AA7;
    display: block;
    line-height: 30px;
    padding: 5px 16px;
}

.dropdown-button-text {
    position: relative;
    top:-8px;
    color:black
}

.dropdown-button-new {
    border-radius: 10px !important;
    width:70px !important;
    height:20px !important;
    text-transform:none;
}
.dropdown-content-new {
    min-width:70px;
}
.dropdown-content-new li {
  min-height: 20px !important;
  min-width: 70px !important;
  height: 20px;
  text-align: center;
}
.dropdown-content-new li > a, .dropdown-content-new li > span {
  font-size: 12px;
  color: #26a69a;
  display: block;
  align: middle;
  line-height: 12px;
  padding: 1px 1px;
}

.dropdown-button-wovr {
    border-radius: 10px !important;
    width:80px !important;
    height:20px !important;
    text-transform:none;
}
.dropdown-content-wovr {
    min-width:80px;
}
.dropdown-content-wovr li {
  min-height: 20px !important;
  min-width: 80px !important;
  height: 20px;
  text-align: center;
}
.dropdown-content-wovr li > a, .dropdown-content-wovr li > span {
  font-size: 12px;
  color: #26a69a;
  display: block;
  align: middle;
  line-height: 12px;
  padding: 1px 1px;
}

.dropdown-content li {
    min-height: 40px;
    line-height: 0.1rem;
}

.dropdown-button.btn {
    background-color: #0397D7;
}
.dropdown-button.btn:hover {
    background-color: #0aa8ec;
}

.dropdown-content .img-green-link, .dropdown-content .img-red-link{
    display:none !important;
}

[type="checkbox"]:checked + label:before{
    top: -1px;
    left: -3px;
    width: 9px;
    height: 18px;
    border-right: 2px solid #125AA7;
    border-bottom: 2px solid #125AA7;
}




::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
      background-color: #ffffff;
      border-radius: 10px;
}
::-webkit-scrollbar-thumb {
      background-color: rgba(00, 00, 00, 0.2);
      border-radius: 10px;
}
::-webkit-scrollbar-button {
      background-color: #ffffff;
}
::-webkit-scrollbar-corner {
      background-color: white;
}

 
.padding-left-right{
    padding-left:5px;
    padding-right:30px;
}

.margin-bottom-10{
    margin-bottom:10px;
}

.margin-bottom-20{
    margin-bottom:20px;
}

.margin-top-40{
    margin-top:40px;
}

.clear-both{
    clear:both;
}

.input-field label, label {
    color: #5d5b5b;
}

.readonly-label{
    position: relative;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    font-size: 1rem;
}


.img-green-link, .img-red-link{
    margin-right:30px;
}

.display-none{
    display:none;
}


.damage-widget table{
   width: inherit;
}

.damage-widget .force-top{
    vertical-align: top;
}

.damage-widget td, .damage-widget th{
    padding: 0px 10px;
    text-align: none;
    vertical-align: middle;
}

.damage-widget select.browser-default{
    width: inherit;
    height: 25px;
    -webkit-appearance: menulist;
    align-items: center;
    background-color: rgb(248, 248, 248);
    border-color: rgb(166, 166, 166);
    display:inline;
    padding:0;
}

td.cellTd{
    padding-left: 5px;
    padding-right: 5px;
}


.nowrap{
    white-space: nowrap;
}
.br-off br{
    display:none;
}



.wovr-details-codes{
    width: 200px !important;
}

.listTableHead .material-icons {
    font-weight: bold;
    font-size: 12px;
}

table.striped > tbody > tr > td {
    vertical-align: top;
}

@media only screen and (max-width: 992px){
    .small-ident{
        display:none;
    }
}

@media only screen and (min-width: 993px){
    .small-ident{
        position:fixed;
        height:20px;
        width: 210px;
        left:0;right:0;
        background: #F5F5F5;
        z-index: 9 !important;
        padding: 4px 13px 4px 13px !important;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.10), 0 2px 10px 0 rgba(0, 0, 0, 0.01);
    }

    .small-ident .small-ident-logo{
        height:100%;
        display:block;
    }

    .show-me{
        display:block !important;
    }
}

.hide-me{
    display:none;
}


@media only screen and (max-width: 992px){
    table.responsive-table td {
        min-height: 3em;
    }
}

@media only screen and (max-width: 992px){
    .hide-hamburger {
        display:none !important;
    }
}
.buttonSearchComp-icon {
    color:white;
}
.commonSearchParam {
    color:white;
}
.commonSearchParam-icon {
    color:white;
}
#commonSearchParam:focus{
    border-bottom: 1px solid #FFFFFF !important;
    box-shadow: 0 1px 0 0 #FFFFFF !important;
}

.radio-label-group{
    float:left;
    padding: 0 0.75rem;
}

.radio-label-group > label{
    display: block;
}

.radio-label-group > p{
    margin-top: 0;
}

textarea.materialize-textarea{
    padding-bottom: 5px;
    padding-top: 20px;
    min-height: 0;
}

textarea.materialize-textarea ~ label{
    top: 1.5rem
}

.input-text-field{
    margin-top:0;
}


@media only screen and (min-width: 601px){
    .side-border{
        border-left: 3px solid rgb(234, 234, 234);
    }
}


.select-combo{
    z-index:100;
    position:absolute;
    background:#fff;
}
.select-combo {
    margin-top: 0;
    border-radius: 2px;
    box-shadow: 0px 1px 11px 3px rgba(0,0,0,0.4);
}
.select-combo li{
    padding: 10px 15px 0 15px;
    cursor:pointer;
}
.select-combo li:last-child{
    padding: 10px 15px 10px 15px;
}
.select-combo li:hover{
    background:#F5F5F5;
}

.input-small{
    color: #000 !important;
    width: 50px !important;
    padding: 0 3px 0 4px !important;
    font-size: 1rem !important;
    height: 20px !important;
}


.damageClassification {
    background: url("/images/repair_classification.png") no-repeat scroll 28% 0 transparent;
    height: 400px;
    width: 700px !important;
    margin-left: auto;
    margin-right: auto;
}

.damageClassificationCaravan {
    background: url("/images/wovr_caravan_s.png") no-repeat scroll 28% 0 transparent;
    height: 400px;
    width: 700px !important;
    margin-left: auto;
    margin-right: auto;
}

.damageClassificationMotorcycle {
    background: url("/images/wovr_motorcycle.png") no-repeat scroll 28% 0 transparent;
    height: 400px;
    width: 700px !important;
    margin-left: auto;
    margin-right: auto;
}

.damageClassificationTrailer {
    background: url("/images/wovr_trailer.png") no-repeat scroll 28% 0 transparent;
    height: 400px;
    width: 700px !important;
    margin-left: auto;
    margin-right: auto;
}

.damage-table {
    width: 1000px !important;
    margin-left: auto;
    margin-right: auto;
}

.damage-top{
    padding-top: 85px;
    padding-left: 65px;
}
.damage-top>div{
    padding-right: 30px !important;
}
.damage-top>div:first-child{
    padding-left: 90px;
}

.damage-middle{
    padding-top: 50px;
    padding-left: 100px;
}
.damage-middle>div{
    padding-right: 40px !important;
}

.damage-middle>div:last-child {
    padding-right: 0 !important;
}

.damage-bottom{
    padding-top: 40px;
    padding-left: 65px;
}
.damage-bottom>div{
    padding-right: 30px !important;
}
.damage-bottom>div:first-child{
    padding-left: 90px;
}

.text-num{
    text-align: center;
}

.damage-container{
    background:#F4F4EA;
    padding-top:20px;
 }

.damage-codes{
    white-space: nowrap;
}

.damage-codes>div, .damage-codes>table{
    min-width: 1000px;
}

.bolder{
    font-weight: bold;
}

#compQuoteDamage .select-wrapper{
    width: 120px;
    background: #fff;
    padding-right: 15px;
}

#compQuoteDamage .input-field .browser-default~label{
    padding-left: 55%;
    font-size: 15px;
    top: -20px;
    color: #0397D7;
}

.damage-widget #compQuoteDamage select.browser-default{
    height: 50px;
    -webkit-appearance: inherit;
}
.quote-damage-top{
    padding-top: 15px;
}
.quote-damage-top>div, .quote-damage-bottom>div{
    padding-right: 80px !important;
}
.quote-damage-top>div:first-child, .quote-damage-bottom>div:first-child{
    padding-left: 100px;
}
.quote-damage-middle, .quote-damage-bottom{
    padding-top: 50px;
}
.quote-damage-middle>div{
    padding-right: 60px !important;
}
.quote-damage-top>div:last-child, .quote-damage-middle>div:last-child, .quote-damage-bottom>div:last-child{
    padding-right: 0 !important;
}
.quote-damage-middle>div:last-child{
    padding-left: 130px;
}

#sidenav-overlay{
    z-index: 996; 
}

.listTableHead {
    padding: 10px 5px;
}

.list-stiped{
    padding: 10px 5px;
}

.list-stiped:nth-child(even) {
  background-color: #FFFFFF;
}


.list-stiped:nth-child(odd) {
  background-color: #F2F2F2;
}


.dropdown-content a.greenLink:link, .dropdown-content a.greenLink:visited, .dropdown-content a.greenLink:active, .dropdown-content a.greenLink:hover{
    color: green !important;
    text-decoration: none;
    font-weight: normal;
}

.dropdown-content a.redLink:link, .dropdown-content a.redLink:visited, .dropdown-content a.redLink:active, .dropdown-content a.redLink:hover{
    background:red;
    color: #fff !important;
    text-decoration: none;
    font-weight: normal;
}

input:disabled:not([type]), input[readonly="readonly"]:not([type]), input[type="text"]:disabled, input[type="text"][readonly="readonly"], input[type="password"]:disabled, input[type="password"][readonly="readonly"], input[type="email"]:disabled, input[type="email"][readonly="readonly"], input[type="url"]:disabled, input[type="url"][readonly="readonly"], input[type="time"]:disabled, input[type="time"][readonly="readonly"], input[type="date"]:disabled, input[type="date"][readonly="readonly"], input[type="datetime"]:disabled, input[type="datetime"][readonly="readonly"], input[type="datetime-local"]:disabled, input[type="datetime-local"][readonly="readonly"], input[type="tel"]:disabled, input[type="tel"][readonly="readonly"], input[type="number"]:disabled, input[type="number"][readonly="readonly"], input[type="search"]:disabled, input[type="search"][readonly="readonly"], textarea.materialize-textarea:disabled, textarea.materialize-textarea[readonly="readonly"] {
    border-bottom: 1px dotted rgba(0, 0, 0, 1.0);
    color: rgba(0, 0, 0, 1.0);
    background: #EEEEEE
}

input:disabled:not([type]) + label, input[readonly="readonly"]:not([type]) + label, input[type="text"]:disabled + label, input[type="text"][readonly="readonly"] + label, input[type="password"]:disabled + label, input[type="password"][readonly="readonly"] + label, input[type="email"]:disabled + label, input[type="email"][readonly="readonly"] + label, input[type="url"]:disabled + label, input[type="url"][readonly="readonly"] + label, input[type="time"]:disabled + label, input[type="time"][readonly="readonly"] + label, input[type="date"]:disabled + label, input[type="date"][readonly="readonly"] + label, input[type="datetime"]:disabled + label, input[type="datetime"][readonly="readonly"] + label, input[type="datetime-local"]:disabled + label, input[type="datetime-local"][readonly="readonly"] + label, input[type="tel"]:disabled + label, input[type="tel"][readonly="readonly"] + label, input[type="number"]:disabled + label, input[type="number"][readonly="readonly"] + label, input[type="search"]:disabled + label, input[type="search"][readonly="readonly"] + label, textarea.materialize-textarea:disabled + label, textarea.materialize-textarea[readonly="readonly"] + label {
    color: rgba(0, 0, 0, 1.0);
}

.arnie-search.transparent-banner{
  background:none;
  width:100%;
  position:relative;
}

.search-box{
  position:relative;
}

.arnie-search .input-field{
  position:relative;
  margin-top: 23px;
  color: #fff;
}

.arnie-search .input-field input{
  float: right;
  margin-right: 0px;
  width:100%;
  transition: all 0.5s ease-in-out;
}

.input-start{
  width: 20px !important;
  background-color: #fff !important;
}

.arnie-search .input-field i{
  position:absolute;
  top: -20px;
  right: 5px;
  z-index: 9;
  cursor:pointer;
}

.arnie-search .btn-search{
    margin-top: 12px;
    right: -10px;
    position: absolute;
    padding-left: 10px;
    padding-right: 10px;
    height: 35px;
    width: 40px;
    font-size: 1.3rem;
}
.arnie-search .btn-search i {
  line-height: 3rem;
}

/* label color */
.arnie-search .input-field label {
  color: #000;
}
/* label focus color */
.arnie-search .input-field input[type=text]:focus + label {
  color: #000;
}
/* label underline focus color */
.arnie-search .input-field input[type=text]:focus {
color:#000;
}
/* valid color */
.arnie-search .input-field input[type=text].valid {
  color:#000;
}
/* invalid color */
.arnie-search .input-field input[type=text].invalid {
color:#000;
}
/* icon prefix focus color */
.arnie-search .input-field .prefix.active {
  color: #000;
}

.hide-search-box{
  opacity: 0;
}

input[type=text]::-ms-clear { display: none; }

.ractph input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #fff;
}
.ractph:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #fff;
   opacity:  1;
}
.ractph::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #fff;
   opacity:  1;
}
.ractph:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #fff;
}
.ractph::-ms-input-placeholder { /* Microsoft Edge */
   color:    #fff;
}

.othersph::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #000;
}
.othersph:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #000;
   opacity:  1;
}
.othersph::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #000;
   opacity:  1;
}
.othersph:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #000;
}
.othersph::-ms-input-placeholder { /* Microsoft Edge */
   color:    #000;
}


#cover-spin {
    position:fixed;
    width:100%;
    left:0;right:0;top:0;bottom:0;
    background-color: rgba(255,255,255,0.7);
    z-index:9999;
    display:none;
}

@-webkit-keyframes spin {
    from {-webkit-transform:rotate(0deg);}
    to {-webkit-transform:rotate(360deg);}
}

@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

#cover-spin::after {
    content:'';
    display:block;
    position:absolute;
    left:48%;top:40%;
    width:40px;height:40px;
    border-style:solid;
    border-color:black;
    border-top-color:transparent;
    border-width: 4px;
    border-radius:50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}