@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

body  {  margin: 0; padding: 0; background-color:#ffffff; }
*  { box-sizing: border-box; }

#cnt  { position: relative ; font-family: "open-sans", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;  font-weight: 400; font-size: 14px;  padding:1rem; }
#cnt #inner  { max-width:800px; margin:auto; margin-bottom:100px;  }

.head  { padding: 0 ; margin: 0 0 1rem; }
.main  { display: block ;  padding: 1rem ; }

.head h1 { padding: 0 1rem ; margin: 0 ; }
.head h1 span.img { display: inline-block ; max-width: 400px; max-height: 100px ;  }
.head h1 span.img img { width: 100% ; }
.head ul.navbar-right { display:inline-block; margin-right:2rem; font-size:14px; }
.head ul.navbar-right > li { list-style: none; padding: 0.25rem; text-align:right; }
.head ul.navbar-right > li > a { }

.main > header  {  color: #444444 ; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif ; }
.main > header:first-child {   }
.main > header h2 { font-size: 36px ; font-weight: 700 ;   }
.main > header h3 { font-size: 20px ; font-weight: 400 ;  }


.main .row { margin:0px; }
.main .form-group {  margin:0px; margin-bottom:10px;}
.main .form-group a { color:#2e2d2c; }
.main .form-group label { text-align:left; font-size: 14px ; font-weight: 400; color: #025baa; }
.main .form-group input[type="checkbox"] { margin-left:0px; }
.main .linkbutton,
.main .form-group input[type="submit"] { border-radius:4px; padding: 10px 40px 10px 20px; color: #f0f0f0; font-weight: bold; background: #709640 url(images/grey-form-icon-arrow-right.png) right 50% no-repeat; background-size: 40px; border-width: 0; }
.main .linkbutton:hover,
.main .form-group input[type="submit"]:hover { background-color: #05763d; text-decoration: none; }
.main a.cancellinkbutton { border-radius:4px; padding: 10px 20px 10px 40px; color: #f0f0f0; font-weight: bold; background: #8e8e8e url(images/grey-form-icon-arrow-left.png) left 50% no-repeat; background-size: 40px; border-width: 0; }
.main a.cancellinkbutton:hover { background-color: #2e2d2c; text-decoration: none; }

.main select[name="EmployerId"] { margin:10px; }
.main select[name="UserId"] { margin:10px; }
.main span.no-data-reason { margin:10px; }

.field-validation-error { background-color: rgba(202,30,23,0.8); color: #f0f0f0; padding: 5px 5px 5px 10px; line-height:28px; }
.field-validation-error::before { content: ""; display: inline-block; width: 20px; height: 20px; margin-right: 3px; vertical-align: -30%; background: url(images/myqa.icons.f0f0f0.svg) no-repeat; background-size: 100px 100px; background-position: -67px -17px; }
.text-success { background-color: rgba(5,118,61,0.8); color: #f0f0f0; padding: 5px 5px 5px 10px; line-height:28px; }
.text-success::before { content: ""; display: inline-block; width: 20px; height: 20px; margin-right: 3px; vertical-align: -30%; background: url(images/myqa.icons.f0f0f0.svg) no-repeat; background-size: 100px 100px; background-position: -17px -17px; }

/* for use with jquery-generated info and wait overlays */
#info  { background: rgba(0,0,0,0.9) ; color: #fff ; position: fixed; top: 0 ; left: 0; right: 0; bottom: 0 ; z-index: 100; }
#info .cls  { color: white ; position: absolute; top: -10px ; right: 20px; padding: 20px ; z-index: 110; cursor: pointer; }
#info .cnt  { margin: 120px auto 20px ; max-width: 540px ; }
#wait  { background: rgba(0,0,0,0.9) ; color: #fff ; position: fixed; top: 0 ; left: 0; right: 0; bottom: 0 ; z-index: 100; }
#wait .cnt  { display: flex ; flex-flow: row wrap ; justify-content: center; align-items: space-around ; text-align: center ; align-items: center ; height: 100% ; width: 100% ; }
#wait .cnt i { display: block ; }


@media print {
body , #cnt  { background-color: transparent ; color: #cccccc ;}
.head  { color: #333333 ; background-color: transparent;  }
.main  { padding: 0 ; color: #333333 ; background-color: transparent; }
.main > header {  color: #333333 ; background-color: transparent; }
hr.pagebreak  { page-break-before: always; }
}