@import url("//hello.myfonts.net/count/3c6238");

@font-face {
  font-family: Segment;
  src:  url(/fonts/Segment-Medium.woff2) format('woff2'),
        url(/fonts/Segment-Medium.woff) format('woff');
  font-weight: 500;
} @font-face {
  font-family: Segment;
  src:  url(/fonts/Segment-Light.woff2) format('woff2'),
        url(/fonts/Segment-Light.woff) format('woff');
  font-weight: 100;
} @font-face {
  font-family: Segment;
  src:  url(/fonts/Segment-Bold.woff2) format('woff2'),
        url(/fonts/Segment-Bold.woff) format('woff');
  font-weight: 800;
} 

::selection {
  background: #D63327; /* WebKit/Blink Browsers */
  color: white;
}
::-moz-selection {
  background: #D63327; /* Gecko Browsers */
  color: white;
}

html {
    font-size: 16px;
}

body,html {
    margin:0;
    padding:0;
    font-family: 'Segment', BlinkMacSystemFont, sans-serif;     
    font-weight: 100;           
    background: #fff;
    color: #444;
}

body {
    border-top: 15px solid #ffea28;
}
#home {
    background: url('../../img/bg-ribbon1.svg') 0 1700px no-repeat;
}
#container {
    font-size:1.1em;
    line-height:2em;
    padding:40px;
    margin: 2px auto;
    width: 80%;
} #mobileburger {
    display:none;
}

*:hover {
    transition: all 0.2s ease-in-out;
} a {
    color: #555;
    font-weight: 500;
} a:hover {
    color: #000;
} .pricta {
    display:inline-block;
    padding: 5px 15px;
    background: #D63327;
    border-radius: 5px;
    text-decoration: none;
    color: white;
    font-size: .8em;
} .pricta:hover {
    color: white;
    background: #ff1100;
}

header {
    text-align: left;
    height: auto;
    display: block;
    position:relative;
    height: 20px;
    margin: 10px 0 50px;
} #logo {
    height: 40px;
    float:left;
    padding:10px 0;
    margin-top: -5px;
} nav ul {
    float:right;
    width: 80%;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right;
} nav ul li {
    display: inline-block;
    font-size: .8em;
} nav ul li a {
    color: #333 ;
    text-decoration: none;
    display: inline-block;
    padding: 5px 0 0;
    margin: 0 10px;
    font-weight: 100;
    line-height: 1.4em;
    border-bottom: 3px solid #fff;
} nav ul li a:hover {
    border-bottom: 3px solid #D63327;
} .loginbtn, .registerbtn {
    background: white;
    padding: 5px 15px 5px 12px;
    color: white;
    font-weight: 800;
    border-radius: 30px;
    margin-right: 0;
} .loginbtn {
    border: 1px solid #ccc;
    color: #999;
} .loginbtn:hover {
    color: white;
    background: #D63327;
    border: 1px solid white;
} .loginbtn:before {
    content: "🔒 ";
} .registerbtn {
    background: #D63327;
    padding: 5px 15px 5px 15px;
    border: 1px solid #D63327;
} .registerbtn:hover {
    color: white;
    background: darkred;
    border: 1px solid white;
} 

#mainmenu ul li.active a {
    border-bottom: 3px solid #D63327;
} #mainmenu ul li.active a.loginbtn {
    border-bottom: 1px solid #ccc;
    color: black;
} #mainmenu .accountmenu {
    position: relative;
    padding: 4px 20px 4px 35px;
    background: url("../../img/icon-profile.svg") 10px 11px no-repeat;
    background-size: 20px;
} #mainmenu .accountmenu ul {
    display: none;
    position: absolute;
    padding: 10px 0;
    margin: 0;
    top: 30px;
    left: 0px;
    width: auto;
    background: #efefef;
} #mainmenu .accountmenu ul li {
    display: block;
    line-height: 2em;
    text-align: left;
    border: 0;
    margin: 0;
} #mainmenu .accountmenu ul li a {
    border: 0;
    min-width: 100px;
    padding: 7px 12px 7px 8px;
    display: block;
    background: #efefef;
} #mainmenu .accountmenu:hover ul {
    display: block;
    transition: none;
    font-weight: 800;
} #mainmenu .accountmenu:hover {
    background: #efefef url("../../img/icon-profile.svg") 10px 11px no-repeat;
    background-size: 20px;
    transition: none;
} #mainmenu .accountmenu:hover li a:hover {
    font-weight: 500;
} #mainmenu .accountmenu .active a {
    font-weight: 800;
} #mainmenu ul li.active a.registerbtn {
    border: 1px solid #D63327;
} #mainmenu ul li.active a.registerbtn:hover {
    border: 1px solid darkred;
} #mainmenu ul li.active a.loginbtn:hover {
    background: white;
    border: 1px solid #ccc;
}


html body #container #main form .forgotpw {
    font-size: .7em;
    margin-left: calc(30% + 5px);
    display: inline-block;
}

#about #main, #contact #main {
    margin-bottom: 100px;
} #about #main section,
#contact #main section,
#managedetails #main section,
#order #main section {
    float: none;
    margin-left: 15%;
    width: 60%;
} #about #main h1, #contact #main h1 {
    margin-top: 20px;
} #about #main h2, #contact #main h2, #order #main h2 {
    font-size: .8em;
    text-transform: uppercase;
    letter-spacing: 5px;
    line-height: 1em;
    width: 70%;
    margin: 150px 0 20px 50px;
    font-weight: 800;
} 

html body#home #container #main {
    padding-top: 0;
}

#main {
    display:block;
    clear:both;
    margin: 20px 0;
} #main h1, #home #container #main h1 {
    font-size: 2.7em;
    line-height: 1.2em;
    width: 80%;
    margin: 120px 0 20px 40px;
    font-weight: 100;
    letter-spacing: -1px;
} 
#main p, #home #container #main p {
    font-size: 1.2em;
    line-height: 1.6em;
    font-weight: 100;
    padding: 0 80px 0 50px;
    margin: 0 0 30px;
} #main section {
    width: 50%;
    float:left;
    overflow: hidden;
} #main span {
    font-weight: 800;
    margin-left: 0;
}

.highlight {
    color: #D63327;
    font-weight: bold;
} .featured {
    background: #c3ebfa;
    padding: 0;
}

#globalfoot {
    font-size: .8em;
    line-height: 2em;
    background: #eee;
    width: 80%;
    margin: auto;
    padding: 5% 10%;
} #footerlogo {
    display: block;
    clear:both;
    height: 50px;
    margin-bottom: 40px;
    text-decoration: none;
} #footerlogo img {
    min-height: 30px;
    padding-right: 1em;
} #globalfoot ul {
    list-style: none;
    padding: 0;
} #globalfoot ul li a {
    text-decoration: none;
}
#globalfoot ul.contact {
    display:block;
    margin: 20px 0;
    clear: left;
} #globalfoot .copyright {
    width: 30%;
    float:left;
    font-size: .8em;
    margin-top: 84px;
    color: #999;
} #globalfoot section.left {
    float: left;
    width: 50%;
} #globalfoot hr {
    clear: both;
    border: 0;
} #globalfoot .primary {
    font-size: 1em;
    line-height: .8em;
    margin-bottom: 20px;
}

.editorial {
    margin: 50px auto;
    display:block;
    clear:both;
    width: 80%;
} .editorial h1 {
    font-weight: 100;
    font-size: 2em;
    line-height: 1.2em;
    letter-spacing: -1px;
} .editorial section {
    display:inline-block;
    width: calc(50% - 80px);
    float:left;
    padding: 50px 50px 50px 30px;
} .editorial .illustration {
    background: #efefef;
    padding-top: 220px;
    height: 220px;
    margin-bottom: 100px;
    vertical-align: middle;
    text-align: center;
} .editorial p {
    font-size: .9em;
    line-height: 1.6em;
    color: #555;
} .editorial.featured h2 {
    margin-top: 0;
    margin-left: 20px;
} .editorial ol {
    padding: 0 0 0 40px;
    margin: 0;
} .editorial ol li {
    font-size: 1.3em;
    line-height: 1.3em;
    font-weight: 100;
    margin-bottom: 15px;
} .editorial.grid {
    margin: 0 auto;
    width: 100%;
} .editorial.grid ul {
    list-style: none;
    padding: 0;
} .editorial.grid li {
    background: #eee ;
    margin: 0 24px 20px 0;
    width: 27%;
    height: 200px;
    display: inline-block;
    font-size: 1.4em;
    font-weight: 100;
    padding: 20px;
    overflow: hidden;
    line-height: 1.4em;
    background-repeat: no-repeat;
    background-position: bottom right;
} .editorial.grid li:hover {
    background: #333;
    background-position: bottom right;
    background-repeat: no-repeat;
    color: white;
} .editorial.grid li:hover a {
    color: white;
} .editorial.grid li:hover a:hover {
    text-decoration: none;
} #icon-nhs {
    background-image: url('../../img/icon-nhs.svg');
} #icon-isocomp {
    background-image: url('../../img/icon-isocomp.svg');
} #icon-icl {
    background-image: url('../../img/icon-icl.svg');
    margin-right: 0;
} #icon-gdpr {
    background-image: url('../../img/icon-gdpr.svg');
} #icon-nature {
    background-image: url('../../img/icon-nature.svg');
} #icon-ceivd {
    background-image: url('../../img/icon-ceivd.svg');
    margin-right: 0;
}

.editorial.testimonials {
    background: grey;
    padding: 100px;
    margin: 100px 0;
} .editorial.testimonials blockquote p {
    font-size: 3em;
    line-height: 1.3em;
    color: white;
} .editorial.testimonials blockquote footer p {
    font-size: 1.3em;
} 

#secondwave .copy h2 {
    margin: 20px 0 5px;
} #secondwave .copy h3 {
    margin: 0;
    font-size: 2em;
    font-weight: 100;
}
#secondwave .copy {
    padding-top: 20px;
    margin-bottom: 90px;
} #secondwave .image-ui {
    margin-top: -100px;
} #secondwave .pricta {
    margin: 10px 0;
}


#packages {
    clear: both;
    width: 100% !important;
    padding: 20px 10px 150px 15px;
} #packages h2 {
    text-align: center;
    margin: 30px 0 80px 0;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: 1em;
} #packages a {
    color: #D63327;
}
#packages.editorial section {
    padding: 0;
    margin: 10px 10px 20px;
    width: calc(25% - 30px);
    background: white;
    border-radius: 10px;
    box-shadow: 0px 20px 20px rgba(0,0,0,.2);
    min-height: 230px;
    background: #E6E9EA;
    font-size: .95em;
    overflow: hidden;
    line-height: 1.5em;
    font-weight: 500;
} #packages.editorial section h3 {
    margin:0;
    padding: 20px 20px 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-align: center;
    font-size: .8em;
    background: #333;
    color: white;
} #packages.editorial section ul {
    padding: 10px 40px;
    list-style-image: url('../../img/check.svg');
} #packages.editorial section ul li {
    margin-bottom: 10px;
} #packages.editorial section.stdpackage {
    width: calc(25% + 10px);
    margin: -20px 5px 20px 5px;
    z-index: 5;
    background: #fff;
    min-height: 320px;
    box-shadow: 0px 30px 40px rgba(0,0,0,.2);
} #packages.editorial section.stdpackage h3 {
    background: #3BB0C7;
} #packages.editorial section ul li.pricepoint {
    font-weight: bold;
} #packages.editorial section.stdpackage .ribbon {
    background: #D63327;
    margin: 0;
    color: white;
    text-transform: uppercase;
    letter-spacing: 4px;
    text-align: center;
    font-size: .7em;
    padding: 3px 0;
    font-weight: bold;
} #packages.editorial section.stdpackage ul {
    margin-bottom: 5px;
} #packages hr {
    clear: both;
    float: none;
    border: 0;
    margin: 40px 0;
}

.breakout {
    clear:both;
    margin: 50px auto;
}

.editorial.two-by.right {
    margin: 0;
} .editorial.two-by.right h2 {
    margin: 0;
    font-size: .8em;
    text-transform: uppercase;
    letter-spacing: 3px;
} .editorial.two-by.right h1 {
    margin: 0;
}

.editorial.two-by {
    clear: both;
    width: 100%;
} .two-by.right .copy {
    padding: 120px 50px 50px 10%;
    width: calc(40% - 50px);
    font-size: 1.1em;
} .two-by.right .image-ui {
    padding: 0;
    width: 50%;
}
.image-ui {
    text-align:center;
    position: relative;
    width: 50%;
    height: 700px;
} .image-ui img {
    height: 700px;
    position: absolute;
    z-index:2;
} .left .image-ui img {
    right: 70px;
} .right .image-ui img {
    left: 10px;
} .image-ui .backgroundpanel {
    width: 100%;
    height: 500px;
    background: #f4f5f5 url(../../img/bg-pattern.svg) no-repeat;
    background-size: cover;
    z-index: 1;
    top: 75px;
    position:absolute;
}

.legal #main {
    margin: 100px auto;
    width: 70%;
    font-size: .9em;
    line-height: 3em;
} .legal #main h1 {
    font-size: 3.5em;
    margin: 0 0 30px 0;
    padding: 50px 0;
} .legal #main h2 {
    margin: 50px 0 30px 0;
    padding: 0;
} .legal #main h3 {
    margin: 30px 0 20px 0;
    padding: 0;
} .legal #main ul, .legal #main ol {
    margin: 0 0 10px 0;
    padding: 0 0 0 25px;
} .legal #main li {
    font-size: 1em;
    margin: 0 0 10px 0;
    line-height: 1.6em;
} .legal #main p {
    font-size: 1em;
    margin: 0 0 10px 0;
    padding: 0;
} .legal #main .legaldated {
    font-size: .8em;
    text-transform: uppercase;
    letter-spacing: 5px;
} .legal #main .legaldated:before {
    content: "🗓 ";
}


html body #container #main {
    padding-top: 100px;
}
#container #main h1,
#container #main h2,
#container #main p {
    margin: 10px 0 30px;
    padding: 0;
} 

html body #container #main form label {
    display:block;
    margin: 5px 0 10px;
    font-size: .8em;
    font-weight: 500;
} html body #container #main form label span,
html body #container #main form .radioselect span {
    display:inline-block;
    line-height: 1em;
    width: 30%;
    margin-left: 0px;
    vertical-align: middle;
} html body #container #main form label input, html body #container #main form label select, html body #container #main form label textarea {
    -ms-box-sizing:content-box;
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box; 
    box-sizing:content-box;
    width: 60%;
    padding: 5px;
    font-family: BlinkMacSystemFont, sans-serif; 
    border-style: solid;
    border-radius: 3px;
    vertical-align: middle;
}
html body #container #main form label input[type='text'], 
html body #container #main form label input[type='date'], 
html body #container #main form label input[type='password'], 
html body #container #main form label input[type='email'], 
html body #container #main form label input[type='time'], 
html body #container #main form label select,
html body #container #main form label textarea {
    height: 2em;
}
html body #container #main form label select,
html body #container #main form label select option {
    background-color: white;
    border-style: solid;
}

html body #container #main form h2 {
    width: 100%;
    /* margin: 40px 0 10px;         */
    padding-top: 20px;
    /* border-top: 1px solid #ccc;  */
} .vtop * {
    vertical-align: top;
} html body #container #main form p {
    text-align: left;
    font-size: .9em;
} #submit {
    cursor: pointer;
    margin: 20px 0 20px 30%;
    padding: 10px 20px;
    border: 0;
    outline: 0;
    font-size: .9em;
    background: #D63327;
    border-radius: 5px;
    text-decoration: none;
    color: white;
    font-family: "Segment";
    font-weight: bold;
} #submit:hover {
    background: #ff1100;
} html body #container #main form select:invalid {
    color: #777;
} html body #container #main form option[value=""][disabled] {
    display:none;
} html body #container #main form option {
    color: #000;
} html body #container #main form input[type="checkbox"],
html body #container #main form input[type="radio"] {
    display: inline;
    width: auto;
} 

html body #container #main #contactform p {
    margin: 0;
} html body #container #main #contactform fieldset, html body #container #main #loginform fieldset  {
    margin: 20px 0;
    border: 0;
    padding: 0;
}

.errormsg {
    color: white !important;
    font-weight: 600 !important;
    font-size: .8em !important;
    background: #DD0101 url(../../img/test-record-pos.png) no-repeat;
    background-size: 20px;
    background-position: 7px 8px;
    padding: 6px 10px 6px 35px !important;
    width: calc( 90% - 28px ) !important;
    margin: 10px 0 20px 0 !important;
    border-radius: 5px;
}
.errorstate {
    border: 2px solid #DD0101;
    border-radius: 4px;
}

html body #container #main form .radioselect label {
    display: inline;
    width: auto;
} #existinguser {
    display:none;
}

#contact #main .contact {
    list-style: none;
    margin: 50px 0;
    padding: 0;
}

html body #container #main #formconfirmation {
    background: #f4f5f5 url(../../img/bg-pattern.svg) no-repeat;
    background-size: cover;
    margin-top: 40px;
    padding: 40px 50px 20px;
} html body #container #main #formconfirmation h2 {
    padding: 6px 10px 3px 35px !important;
    background: url(../../img/check-green.svg) no-repeat;
    background-size: 24px;
} contact #main #html body #container #main #formconfirmation h1 {
    margin: 0;
} html body #container #main #formconfirmation p {
    font-size: .9em;
} #loginform #submit {
    margin-bottom: 0;
}


/* DASHBOARD */

#dashboard #main section {
    clear: both;
    float: none;
    display: block;
    width: 80%;
    margin: 0 auto;
} #dashboard h2 {
    text-transform: uppercase;
    font-size: .8em;
    letter-spacing: 2px;
}

.resultstable .hidden {
    display: none;
    background: white;
    padding: 20px;
    width: calc(100% - 60px);
    border-radius: 10px;
    margin: 10px;
    float:none;
    overflow: auto;
} .resultstable .hidden li {
    font-size: .8em;
    line-height: 1.4em;
    font-weight: 100;
    width: 50%;
    padding: 0;
    margin: 5px 0;
    float: left;
    display: block;
} .resultstable .hidden li span {
    width: 100%;
    margin-bottom: 2px;
}

.resultstable, .resultstable ul, .resultstable li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.resultstable li .pricta {
    padding: 1px 10px;
    border-radius: 4px;
    background: #333;
} .resultstable li .pricta:hover {
    background: #D63327;
} .resultstable li .pricta.neg {
    background: #90EE90;
    color: #333;
} .resultstable li .pricta.neg:before {
    content: "✅ ";
} .resultstable li .pricta.pos:before {
    content: "⚠️ ";
}

.resultstable li {
    font-size: .95em;
    line-height: 1.6em;
    display: block;
    padding: 20px 20px 15px;
    background: #f0f0f0;
    margin-bottom: 20px;
    border-radius: 10px;
    font-weight: 500;
} .resultstable li li {
    padding: 2px 10px;
    margin: 0;
    background: none;
} .resultstable li li span {
    display: inline-flex;
    width: auto;
    min-width: 20%;
} .resultstable li li span.result-value {
    display: inline-flex !important;
    font-weight: 500 !important;
} .resultstable li .more {
    text-align: right;
} .resultstable li .more a {
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 3px;
    font-size: .5em;
    font-weight: 800;
    padding: 5px 0 0;
    margin-top: -30px;
    /*border-top: 1px solid #ddd;*/
    display: block;
    width: 150px;
    float:right;
    color: #aaa;
} .resultstable li .more a:hover {
    color: #333;
} .resultstable .hidden li span {
    display: block;
    margin-top: 5px;
} .resultstable li ul {
} .resultstable li .more a:after {
    content: " ⏬"
} .resultstable li .more a:before {
    content: "View "
} .resultstable li .more a.open:before {
    content: "Hide "
} .resultstable li .more a.open:after {
    content: " ⏫"
}

#testoverview .pricta.fullwidth {
    display: block;
    text-align: center;
    font-size: .7em;
}

#detailconfirmation {
    font-size: .9em;
}
#detailconfirmation ul {
    list-style: none;
    padding: 0;
} #detailconfirmation li {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
} #detailconfirmation ul span.details-label {
    display: inline-block;
    min-width: 7em;
    padding-right: 1em;
} #detailconfirmation ul span.details-value{
    display: inline-block;
    font-weight: 500;
}

#returncheck-checkboxes {
    display: inline-flex;
}
.input-caption {
    display: inline-block !important;
    margin-left: calc(30% + 5px) !important;
    width: 60% !important;
    font-weight: 300 !important;
    font-size: 0.7em;
    color: gray;
    line-height: 1.1em !important;
}
.small-input {
    width: 20% !important;
}

/* CLIENT PORTAL */

#recordsearch, #testrecords {
    margin: 80px 0;
}

.resultsinfo {
    background: white url(../../img/info-icon.png) no-repeat top right;
    background-position: 30% 14px;
    background-size: 10px;
    padding-right: 35px;
} .sorted {
    background: white url(../../img/sort-icon.png) no-repeat top right;
    background-position: 60% 14px;
    background-size: 10px;
    padding-right: 35px;
}
.notice-box {
    color: white;
    background-color: #3BB0C7;
    border-radius: 5px;
    padding: 2px !important;
    margin-left: 0px !important;
    margin-right: 2px;
    display: inline-block;
    vertical-align: middle;
    height: 1.1em !important;
}

#recordsearch #searchpanel {
    background: #f0f0f0;
    border-radius: 5px;
    padding: 10px 30px;
} #recordsearch #searchpanel label {
    display:inline !important;
    font-weight: bold;
    font-size: .8em;
} #recordsearch #searchpanel input {
    margin: 0 10px 0 15px;
    border:0;
    font-size: 1.2em;
    padding: 12px 15px !important;
    border-radius: 5px;
    background: #fcfcfc;
    font-family: Segment, sans-serif;
    letter-spacing: 1px;
} #recordsearch #searchpanel input#search {
    width: 60% !important;
}

#recordsearch #searchbtn, #exportbtn {
    display:inline-block;
    padding: 8px 15px;
    background: #D63327 url(../../img/search-bg.png) no-repeat top right;
    background-position: 82% 8px;
    background-size: 15px;
    padding-right: 35px;
    border-radius: 24px;
    border: 0;
    text-decoration: none;
    color: white;
    font-size: .8em;
    font-weight: bold;
} #recordsearch #searchbtn:focus, #exportbtn:focus {
    border-radius:20px;
} #recordsearch #searchbtn:hover, #exportbtn:hover {
    background-color: #ff1100;
    cursor: pointer;
}

.recordlisting {
    width: 100%;
    font-size: .78em;
    font-weight: 400;
    line-height: 1.1em;
    border-collapse: collapse;
    color: #333;
} #testrecords h3 span {
    font-size: .6em;
    color: #9D9D9D;
    letter-spacing: .1em;
    margin-left: 5px;
} #testrecords h3 strong.searchstr {
    font-weight: normal;
    color: #ff1838;
} #testrecords a.searchclear {
    color: #a9c2da;
    text-decoration: none;
    text-transform: lowercase;
}

.recordlisting a.viewdetails, .recordlisting span.viewpatient {
    text-decoration: none;
    cursor: pointer;
    vertical-align: middle;
} .recordlisting span.deregister {
    width: 15px;
    height: 1.2em;
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    margin-left: 10px;
    color: red;
    padding: 2px 3px 2px 3px;
    border-radius: 4px;
    /*
    padding-right: 10px;
    margin-left: -29px;
    */
} .recordlisting span.deregister:hover {
    background-color: red;
    color: white;
} .recordlisting span.viewpatient_icon {
    height: 1.2em;
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    margin-left: 10px;
    padding-right: 10px;
    margin-left: -29px;
} .recordlisting span.viewdetails {
    height: 1.2em;
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    padding-right: 5px;
    margin-left: 2px;
    min-width: 25px !important;
    text-align: center;
}
.modal-content {
    display: none;
}
.modal-table td:first-child {
    font-weight: 500;
    padding-right: 25px;
}
.jconfirm-title, .jconfirm-content {
    font-weight: 300;
}

.recordlisting td, .recordlisting th {
    padding: 0 20px;
    border: 0;
    height: 40px;
    vertical-align: middle;
    min-width: 15em;
}
.recordlisting td:nth-child(2),
.recordlisting td:nth-child(3),
.recordlisting th:nth-child(2),
.recordlisting th:nth-child(3) {
    min-width: 10em;
}

.recordlisting i.searchsubstr {
    color: #ff1838;
    font-style: normal;
}

.recordlisting .profilemissing {
    background: #ffcad1  !important;
} .recordlisting .profilemissing td:first-child {
    color: black;
} .recordlisting .profilemissing .registercta {
    display: inline-block;
    padding: 4px 10px;
    background: #fff url(../../img/register-cta-bg.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px;
    padding-left: 25px;
    border-radius: 5px;
    text-decoration: none;
    color: #E74823;
    font-size: .7em;
    font-weight: bold;
    margin-left:10px;
    vertical-align: .2em;
} .recordlisting .profilemissing .registercta:hover {
    background: #E74823 url(../../img/register-cta-bg-inv.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px; 
    color: white;
}
.recordlisting .pendingreview {
    background: #FFAD9A !important;
} .recordlisting .pendingreview td:first-child {
    color: #6e1919;
}
.recordlisting .infomissing {
    background: #FFD900 !important;
} .recordlisting .infomissing td:first-child {
    color: #A99313;
} .recordlisting .infomissing .registercta {
    display: inline-block;
    padding: 4px 10px;
    background: #fff url(../../img/register-cta-bg.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px;
    padding-left: 25px;
    border-radius: 5px;
    text-decoration: none;
    color: #E74823;
    font-size: .7em;
    font-weight: bold;
    margin-left:10px;
    vertical-align: .2em;
} .recordlisting .infomissing .registercta:hover {
    background: #E74823 url(../../img/register-cta-bg-inv.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px; 
    color: white;
} #backtoresults {
    display:inline-block;
    line-height: 1em;
    padding: 7px 10px;
    background: #333;
    color: white;
    border-radius: 4px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: .7em;
} #backtoresults:hover {
    background: #000;
}

.recordlisting th {
    text-align: left;
    font-size: .7em;
    letter-spacing: 2px;
    text-transform: uppercase;

} .recordlisting th span ul {
    display: none;
}

.recordlisting tr td:first-child{
    font-weight: bold;
    padding-left:40px;
} .recordlisting th:first-child{
    padding-left:30px;
} .recordlisting tr th:last-child {
    width: 175px;
} .recordlisting tr th:nth-child(2) {
    width: 150px;
} .recordlisting tr th:nth-child(3) {
    width: 150px;
} .recordlisting tr th:nth-child(4) {
    width: 220px;
}


.recordlisting tr:nth-child(even),  .recordlisting .activeresult {
    background-color: #f0f0f0;
} .recordlisting tr td:nth-child(4) {
    font-weight: 600;
} .recordlisting .activeresult {
    font-size: 1.1em;
    height: 52px;
    border-top: 5px solid #f0f0f0;
}


.recordlisting .testres {
    display: inline-block;
    padding: 4px 10px;
    background: #333;
    border-radius: 5px;
    text-decoration: none;
    color: white;
    font-size: .7em;
    background: #333;
} .recordlisting .testpos {
    background: #333  url(../../img/test-record-pos.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px;
    padding-left: 25px;
} .recordlisting .testneg {
    background: #90EE90 url(../../img/test-record-check.png) no-repeat;
    background-size: 15px;
    background-position: 5px 4px;
    padding-left: 25px;
    color: #333;
} .recordlisting .testinc, .recordlisting .testinv {
    background: #FFD900 url(../../img/test-record-alert.png) no-repeat;
    background-size: 14px;
    background-position: 6px 6px;
    padding-left: 25px;
    color: #333;
} .recordlisting .testpos:hover {
    background-color:black;
} .recordlisting .testneg:hover {
    background-color:#BEFFBE;
} .recordlisting .testinc:hover {
    background-color:#FFB800;
}


#pagination {
    float:right;
    list-style: none;
    padding: 0;
    border: 1px solid #eee;
    border-radius: 4px;
    font-size: .7em;
    line-height: 1em;
    font-weight: bold;
    color: #ccc;
} #pagination li {
    margin: 0;
    display: inline-block;
    border-right: 1px solid #eee;
    padding: 0 10px;
    line-height: 2.5em;
} #pagination .active {
    background: #D63327;
    color: white;
    padding: 0 10px;
    font-weight: bold;
} #pagination .prev {
    padding-left: 15px;
} #pagination .next {
    padding-right: 15px;
    border-right: 0;
} #pagination a {
    text-decoration: none;
    font-weight:bold;
    padding: 0;
} #pagination a:hover {
    color: #D63327;
}



/* SMALL SCREENS */

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


    #dashboard #main section {
        width: calc( 100% - 40px );
    }
    
    #container {
        padding: 0;
        width: 100%;
    } header {
        padding: 0 20px;
    }

    .editorial.grid {
        margin: 0 40px;
        width: calc(100% - 40px);
    } .editorial.grid li {
        width: 26%;
        font-size: 1.2em;
    }

    #html body #container #main #formconfirmation {
        padding: 40px 50px 20px;
    }

    #packages {
        clear: both;
        width: calc(100% - 25px) !important;
        padding: 20px 10px 50px 15px;
    }

    #globalfoot .copyright {
        width: calc(45% - 40px);
    } #globalfoot section.left {
        width: 50%;
        margin-right: 40px;
    }

    #about #main section, #contact #main section, #managedetails #main section {
        width: 70%;
        margin: 0 auto;
    }

    .resultstable li li span { 
        width: 25%;
    } 

    .recordlisting td, .recordlisting th {
        padding: 0 10px;
    }

    .recordlisting tr th:last-child {
        width: 70px;
    } .recordlisting tr th:nth-child(2) {
        width: 130px;
    } .recordlisting tr th:nth-child(3) {
        width: 130px;
    } .recordlisting tr th:nth-child(4) {
        width: 200px;
    }

}


/* MOBILE */

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

    #main p, #home #container #main p {
        padding: 0 80px 0 40px;
        margin: 0 0 30px;
    } 

    html body #container #main form label span, html body #container #main form .radioselect span {
        display: block;
        margin: 20px 0 10px;
    }
    html body #container #main form label input, html body #container #main form label select, html body #container #main form label textarea {
        width: calc( 100% - 20px );
        padding: 10px;
    }
    html body #container #main form .forgotpw {
        font-size: .8em;
        margin-left: 0;
    }

    html body #container #main form label span, html body #container #main form .radioselect span {
        width: calc( 100% - 20px );
    }

   #submit, #loginform #submit {
        margin: 0;
        width: 100%;
        font-size: 1.1em;
        font-weight: bold;
    }

    html body #container #main {
        margin-top: 0;
        padding-top: 0;
    }
    #home #container #main h1 {
        margin-top: 0;
    }

    .legal #main .legaldated {
        font-size: .5em;
        letter-spacing: 4px;
        font-weight: 500;
    }

    #home {
        background: url(../../img/bg-ribbon1.svg) 0 2500px no-repeat;
    }

    .mopen #container {
        height: 100vh;
        overflow: hidden;
    }

    header #logo {
        height: 25px;
    }

    #mainmenu {
        display:none;
    } #mobileburger {
        display:block;
        float:right;
        padding: 10px 2px;
        appearance: none;
        outline: 0;
        border: 0;
        background: 0;
    } #container {
        padding: 0px;
        width: 100%;
    } header {
        padding: 0 20px;
    }

    header.open {
        border-top: 15px solid #3BB0C7;
        margin: 0;
        padding: 10px 20px 0;
        display: block;
        position: fixed;
        background: white;
        z-index: 9;
        top: 0;
        left: 0;
        width: calc(100% - 40px);
        height: calc(100vh);
        font-size: 1.4em;
    } 

    .open #mainmenu {
        display: block;
        background: white;
        margin-top: 50px;
        padding-top: 15vh;
    } .open #mainmenu ul {
        text-align: right;
        width: 100%;
    } .open #mainmenu ul li {
        display: block;
        margin: 30px 0;
        float: none;
        padding-left: 30px;
    } .open #mainmenuul li a {

    }

    .loginbtn {
        padding: 5px 12px 5px 15px;    
    } .loginbtn:before {
        content: none;
    } .loginbtn:after {
        content: " 🔒";
    }

    .editorial.testimonials {
        padding: 20px;
        margin: 10px 0;
        width: calc(100% - 40px);
    } .editorial {
        display:block;
        width: 100%;
        clear: both;
        float: none;
    } .editorial section {
        display: block;
        width: calc(100% - 80px);
        padding: 40px;
        float: none;
        clear: both;
    } #main {
        margin-bottom: 20px;
    } #main section {
        width: 100%;
        float: none;
        overflow: hidden;
    } #main h1 {
        font-size: 2.4em;
        margin: 0 40px 20px;
    } #main p {
        width: calc(100% - 60px);
        padding: 0 40px;        
    } .editorial h1 {
        margin-top: 0;
    } .editorial {
        margin: 10px 0 20px;
    } .editorial.breakout {
        width: calc(100% - 80px);
        padding: 40px;
    } .editorial .illustration {
        margin-bottom: 20px;
    }

    .editorial.grid {
        padding: 20px;
        margin: 0;
        width: calc(100% - 40px);
    }.editorial.grid li {
        font-size: .8em;
        width: calc(50% - 50px);
        margin: 0 10px 10px 0;
        height: 140px;
    } .editorial.grid li:nth-child(even) {
        margin-right: 0;
    } .two-by.right .copy {
        padding: 50px 40px 20px 40px;
        width: calc(100% - 80px);
    } #packages {
        width: calc(100% - 40px) !important;
        padding: 20px;
    } #packages h2 {
        margin-bottom: 30px;
    } #packages.editorial section {
        display: block;
        padding: 0;
        margin: 20px auto;
        width: calc(100% - 20px);
        min-height: auto;
    } #packages.editorial section.stdpackage {
        width: calc(100% - 20px);
        margin: 10px;
        min-height: auto;
    } #packages hr {
        margin: 0;
    } #icon-icl {
        margin-right: 10px;
    }

    .image-ui {
        height: 400px;
        margin-bottom: 40px;
    }
    .editorial .image-ui {
        overflow:hidden;
        width: 100%;
    } .two-by.right .image-ui {
        width: 100%;
    } .image-ui img {
        height: 500px;
    } .image-ui .backgroundpanel {
        width: 100%;
        height: 350px;
    } #main h1 {
        width: 80%;
    }


    #about #main, #contact #main  {
        margin-bottom: 20px;
    }
    #about #main section,
    #contact #main section {
        width: calc(100% - 40px);
        padding: 0 20px;
        margin: 0 auto;
    } #about #main h2, #contact #main h2 {
        width: 100%;
        margin: 40px 0 20px 2px;
        padding: 0;
        text-transform: uppercase;
        letter-spacing: 5px;
        font-size: .8em;
    }  #contact #main h1, #about #main h1 {
        font-size: 2.2em;
        width: 100%;
        margin: 0 0 20px;
    } #about #main , #contact #main  {
        padding: 0;
        width: 100%;
    } 

    #globalfoot {
        padding: 20px;
        width: calc(100% - 40px);
    }

    #globalfoot section.left, #globalfoot .copyright {
        width: 100%;
    } #globalfoot .copyright {
        margin-top: 0;
    }

    .legal #main {
    margin: 20px auto;
    padding: 20px;
    width: calc(100% - 40px);
    } .legal #main h1 {
    padding: 20px 0;
    margin: 0;
    } .legal #main h2, .legal #main h3 {
    line-height: 1.4em;
    } .legal #main p {
    width: auto;
    } 

    #contact html body #container #main form label span {
        display: block;
        width: 100%;
        margin: 20px 0 5px;
        font-size: .8em;
    } #contact html body #container #main form label input, #contact html body #container #main form label select, #contact html body #container #main form label textarea {
        width: calc(100% - 20px);
    } #contact html body #container #main form #submit {
        margin-left: 0;
    }


    #html body #container #main #formconfirmation {
        width: 100%;
        margin-left: 0px;
        padding: 15px 40px 15px;
    } #contact #main p {
        width: 100%;
    } 

    /* dashboard styling */

    .resultstable li {
        padding: 10px;
        margin-bottom: 10px;
        clear: both;
    } .resultstable li li {
        padding: 2px;
        margin: 7px 0;
        clear: both;
    } .resultstable li li span { 
        width: 100%;
    } .resultstable li .pricta {
        width: auto;
    } .resultstable li .more {
        height: 25px;
    } .resultstable li .more a {
        position: relative;
        margin: 0 auto;
        float: none;
        width: 100%;
        text-align: center;
    } .resultstable .hidden li { 
        width: 100%;
    } #main #testoverview p {
        width: 100%;
    } .resultstable .hidden {
        margin: 0;
        width: calc(100% - 40px);
    }

    #dashboard #main section {
        width: calc( 100% - 40px );
        padding: 0 20px;
    } html body#dashboard #container #main {
        padding-top: 50px;
    }

    html body#dashboard #container #main h2 {
        margin-bottom: 10px;
    }

    /* client */

    #recordsearch #searchpanel {
        padding: 5px 15px 15px;
        text-align: left;
        position:relative;
    } #recordsearch #searchpanel label input {
        margin-left: 0;
        display:block;
        width: calc( 100% - 30px ) !important;
        z-index:0;
    } #recordsearch #searchpanel #searchbtn {
        z-index:1;
        position: absolute;
        bottom: -45px;
        right: 0px;
        width: 100%;
        border-radius: 5px;
        background-position-x: 95%;
    }

    #recordsearch, #testrecords {
        margin: 60px 0;
    }

    #pagination {
        font-size: .9em;
    } #pagination li {
        padding: 0 12px;
    }

    .recordlisting tr {
        display: block;
        padding: 12px 0 8px;
    }
    .recordlisting tr td:first-child {
        padding-left: 15px;
    } .recordlisting td, .recordlisting th {
        height: 15px;
        padding: 4px 15px;
        line-height: 1em;
    } 

    .recordlisting .testres {
        padding: 2px 8px;
        font-size: .65em;
        border-radius: 2px;
        line-height: 1.5em;
        vertical-align: 0.1em;
        text-transform: uppercase;
        letter-spacing: .1em;
    } .recordlisting .testpos {
        background-size: 10px;
        background-position: 3px 4px;
        padding-left: 16px;
    } .recordlisting .testneg {
        background-size: 9px;
        background-position: 3px 4px;
        padding-left: 16px;
    } .recordlisting .testinc, .recordlisting .testinv {
        background-size: 9px;
        background-position: 4px 5px;
        padding-left: 16px;
    } 

    .recordlisting .infomissing .registercta, .recordlisting .infomissing .registercta:hover, .recordlisting .profilemissing .registercta, .recordlisting .profilemissing .registercta:hover {
        background-size: 9px;
        background-position: 4px 4px;
        border-radius: 2px;
        line-height: 1.5em;
        vertical-align: .1em;
        text-transform: uppercase;
        letter-spacing: .1em;
        padding: 2px 8px 1px;
        padding-left: 16px;
    }

    .recordlisting span.viewpatient_icon, .recordlisting span.viewdetails {
        display: none;
    }
    .recordlisting span.notice-box {
        display: inline-block !important;
        min-width: auto !important;
        margin-left: -5px !important;
        margin-right: 5px !important;
        height: 1em !important;
    }
    .recordlisting span.viewpatient, .recordlisting a.viewdetails {
        margin-left: -3px;
    }

    #detailconfirmation ul span {
        display:block;
        width: 100%;
        line-height: 1em;
        margin-top: 10px;
    }

    .recordlisting .activeresult {
        height: auto;
        padding: 25px 0;
        border-top: 5px solid #f0f0f0;
    } .recordlisting .activeresult td:before {
        display: none;
    }

    .errormsg {
        width: calc( 100% - 41px ) !important;
    }
    
    .modal-dialog {
        top: 40px;
    }
    .modal-content {
        width: calc(100% - 20px);
    }
    .modal-header {
        padding-right: 40px;
    }

    #contact-preference {
        display: none !important;
    }
    .resultstable li li span.result-value {
        min-width: 100% !important;
    }
    .resultstable li .more a {
        float: none !important;
        margin-top: 0px !important;
        text-align: left !important;
    }
}

/* Burger Styling */


.hamburger {
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; 
}
  .hamburger:hover {
    opacity: 0.7; }
  .hamburger.is-active:hover {
    opacity: 0.7; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: #000; }

.hamburger-box {
  width: 20px;
  height: 18px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 20px;
    height: 2px;
    background-color: #000;
    border-radius: 4px;
    position: absolute;
    transition-property: transhtml body #container #main form;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -7px; }
  .hamburger-inner::after {
    bottom: -7px; }

.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin .hamburger-inner::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin .hamburger-inner::after {
    transition: bottom 0.1s 0.25s ease-in, transhtml body #container #main form 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.is-active .hamburger-inner {
  transhtml body #container #main form: rotate(225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin.is-active .hamburger-inner::after {
    bottom: 0;
    transhtml body #container #main form: rotate(-90deg);
    transition: bottom 0.1s ease-out, transhtml body #container #main form 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

.hamburger--spin-r .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin-r .hamburger-inner::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin-r .hamburger-inner::after {
    transition: bottom 0.1s 0.25s ease-in, transhtml body #container #main form 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin-r.is-active .hamburger-inner {
  transhtml body #container #main form: rotate(-225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin-r.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin-r.is-active .hamburger-inner::after {
    bottom: 0;
    transhtml body #container #main form: rotate(90deg);
    transition: bottom 0.1s ease-out, transhtml body #container #main form 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

.custom-test {
    display: inline-block !important;
}
#custom-profile-tests {
    -webkit-column-width: 15em;
       -moz-column-width: 15em;
            column-width: 15em;
}
#custom-profile-tests li {
    line-height: 1em;
}