body{overflow:hidden; background: #F3F5F8; padding:0px; margin:0px; color:#000; font-family: -apple-system, system-ui, BlinkMacSystemFont, Helvetica, Arial, "Segoe UI", Roboto, sans-serif; font-weight: 400;font-size: 16px;line-height: 24px;}
ul{padding-left: 16px;margin-top: 10px;}
.boxcontainer, #panel_over{transform:translate(0px); z-index:21;}
.container{z-index: 21; background:#fff; width:400px; padding:0px; padding-bottom:1px; box-shadow: 0px 20px 20px -20px #D8DFE9;}
.container{top:20px; left:20px; border-radius: 30px;z-index: 21;}
.container{margin-left: calc(50vw - 200px); margin-top:20px; }
.background{display:none;}
input{-webkit-appearance: none; font-family: 'Montserrat', sans-serif; font-weight: 400;font-size: 16px;line-height: 24px;}
input[type="radio"], input[type="checkbox"]{display:none; -webkit-appearance: none;}
input[type="checkbox"] + label{padding:0 0 10px 0; margin-left: 26px;}
input[type="checkbox"] + label::before {top:4px; margin-left:-25px; width: 16px;height: 16px;background-color: #fff;display: block;content: "";float: left;margin-right: 11px;position: relative; border-radius: 0px; border: solid 1px #000; box-sizing: border-box;}
input[type="checkbox"]:checked + label::before {background-image: url('/img/checkbox_black.svg');background-color: transparent; border:none;}
.form_checkbox{padding:0px 30px 10px 30px;}
ol{padding-left: 20px; margin: 0px 0px 20px 0px;}
#box_permission_error{margin-top:20px;}
#mobile_confirm_checkbox{display:inline-block;}
#mobile_confirm_checkbox_label{display:inline-block;}
.copyContainer{display:grid; grid-template-columns: auto min-content; padding:0px 30px;}
.copyContainer input{font-size:10px; border:solid 1px #000; outline: none; padding:0px 0px 0px 10px; margin:0px;}
.copyContainer button{margin:0px; border-radius: 0px 2px 2px 0px;}
.twoButtons{position:relative;}
.twoButtons button{width:calc(100% - 60px); text-align: center;}
#box_safari_cta{margin-bottom:0px;}
#box_safari_cta_secondary{background:#F3F5F8; color:#000;}
#box_safari_cta_back{color:#848C97; background:transparent; position: relative; padding-left:30px;}
#box_safari_cta_back:before{background-image: url('/img/sprite.svg'); background-position: -2000px -310px; width:20px; height:20px; content:''; position: absolute; left:0px; top:10px; }
#box_safari_cta_back:hover{color:#000;}
#box_safari_cta_back:hover:before{background-position-y: -210px;}
.textlink{text-decoration:underline; color:#000;}
#box_mobilestart_help{font-size: 12px;}
.brand{display: none; position:fixed; right: calc(50vw - 170px); bottom:50px; width: 61px; height: 22px; background-image:url('https://solidusertests.com/img/logo.svg');}
.title{font-weight: 600; font-size: 20px; line-height: 30px; margin:10px 0px; padding:0 30px;}
#box_welcome_title{margin-top:30px;}
.copy, .copy_below{margin:30px 0px 20px 0px; padding:0 30px;}
.copy a{color:#000;}
#box_permission_copy{margin-bottom:10px;}
.hint{color:#226CFF;opacity: 1; font-size: 16px; line-height: 24px; margin-bottom: 10px; padding:10px 30px 20px 30px;}
#box_openlink_hint{padding-bottom:0px;}
#box_onpagelink_hint{padding-top:0px;}
.duration, .headphones{margin-bottom: 10px; font-size: 12px; font-weight: medium; text-transform: uppercase; line-height: 20px; padding: 0px 30px 10px 60px; background: #fff url('/img/icon-time.svg') no-repeat; background-position: 30px 0px;}
.headphones{background: #fff url('/img/icon-headphones.svg') no-repeat; background-size: 20px 20px; background-position: 30px 0px; margin-top:-10px;}
button, .button{color:#fff; background: #000; line-height:20px; letter-spacing:.1em;
  border-radius: 2px; font-size:12px; font-weight:500; text-transform: uppercase; padding:10px 20px; width:fit-content; cursor: pointer; margin: 10px 10px 30px 30px;}
button:hover{transition: 0s; background: #333;}
.link{background:#46BA43;}
.link:hover{background:#35A633;}
.button_danger{background-color: #EC002A;}
button:disabled, button:disabled:hover, .button:disabled, .button:disabled:hover, .button[disabled], .button[disabled]:hover{background:#D8DFE9; cursor:default; color:#fff;}
#box_openlink_done_helpbutton{color:#000; margin-left:0px; margin-right:0px;}
#box_openlink_done_helpbutton:disabled{color:#fff;}
#box_openlink_done_helpbutton:hover{color:#fff;}
#box_openlink_done_donebutton{margin-right:10px; margin-left:0px; margin-bottom:0px;}
#box_openlink_done{padding-top:30px; padding-left:30px; background: rgba(243, 245, 248, 0.5); border-radius: 0px 0px 30px 30px}
.undone{color:#ccc;}
#box_openlink_done_question, #box_mobilestart_copy{margin-bottom:10px;}
#box_unfit{margin-top: calc(33vh - 100px);}
#box_unfit_copy{padding-top:20px; padding-bottom:9px; text-align:center;}
#box_unfit_img{margin: 40px 0 -10px 50%;}
#box_unfit_img svg{margin-left: -20px;}
#box_unfit_img .mobile_only, #box_unfit_img .desktop_only{display: none;}

#box_finish_copy, #box_upload_copy{margin-bottom:30px;}
button, input[type="submit"], input[type="reset"] {border: none;cursor: pointer;outline: inherit;}
.button_secondary{color:#fff; background: #F3F5F8;}
.button_secondary:hover{color:#fff; background: #000;}
.button_request{letter-spacing: normal;cursor:default;background:transparent; width:100%; text-align: left; color:#000; padding: 0px 0px 0px 26px; margin-bottom:6px; margin-top:0px; position:relative; text-transform: none; font-weight: 400; font-size: 16px; line-height: 24px;}
.button_request:hover{background:transparent; color:#226CFF;}
.button_request:disabled, .button_request:disabled:hover{color:#000; background:transparent; opacity:.5;}
.button_request:disabled::before{border-radius: 14px; border: 1px dashed; animation: spin 2s linear infinite;}
.button_request_check, .button_request_check:disabled, .button_request_check:disabled:hover, .button_request_check:hover{color:#000; opacity:1;}
.button_request::before{content:''; position:absolute; width:14px; height:14px; border:1px solid #000; left:1px; top:4px; }
.button_request_check::before, .button_request_check:disabled::before{border-radius: 0px; background-image: url('/img/checkbox_black.svg'); border:none; width:16px; height:16px; animation:none;}
@keyframes spin {100% {transform: rotateZ(360deg);}}
.topbar_done, .topbar_help{height:32px;}
#topbar_more{color:#226CFF; cursor: pointer;}
#container_task{transition: all 300ms ease-out;}
#closehelpbutton{margin-right:10px;}
#form_requests{margin-bottom:10px; padding-right:60px;}
#player{position: relative; cursor: pointer;}
.play{position: absolute; left:170px; top:85px; pointer-events: none; width:60px; height:60px;}
.pause{display:none; opacity:0.5;position: absolute; left:30px; bottom:30px; pointer-events: none; width:20px; height:20px;}
#box_welcome_player:hover .play{width:50px; height:50px; left:175px; top:90px;}
#box_welcome_player:hover .pause{opacity:1;}
#box_welcome_player{position:relative;}
#video_boxcontainer_sec{position: absolute; right:15px; bottom:15px; pointer-events: none; font-size:13px; color:#fff;}
.video_container{background: #333333; margin-bottom:20px; width:100%; position: relative; padding-top:56.3%;}
@media screen and (min-width: 421px) {
  .video_container{border-radius: 30px 30px 0px 0px;}
  #box_context .videoonly .video_container, #box_context .videoonly .video_container video, #box_onpagelink.videoonly .video_container, #box_onpagelink.videoonly  .video_container video, #box_openlink.videoonly  .video_container, #box_openlink.videoonly .video_container video{border-radius: 30px; margin-bottom:0px;}
}
#box_context .progress_container, #box_onpagelink .progress_container, #box_openlink .progress_container{margin-top:30px;}
.video_container video{width:100%; border-radius: 30px 30px 0px 0px; position: absolute; top:0px; right:0px; bottom:0px; left:0px;}
.v_replay, .v_pause{position:relative;}
video{cursor:pointer;}
.v_replay::after{pointer-events: none; position:absolute; content:''; height:24px; width:24px; bottom:30px; left:30px; background-image:url('/img/replay.svg');}
.v_pause::after{pointer-events: none; position:absolute; content:''; height:24px; width:24px; bottom:30px; left:30px; background-image:url('/img/pause.svg');}
#form_contact_video_container{margin-bottom:20px;}
#form_contact_video_1{border-radius:0;}
#form_contact{padding:0 30px;}
#form_contact_video_label{margin-bottom: 10px; font-weight:600;}
#form_contact_video_1{max-width: 200px; height:auto;}
.error{color:#EC002A; padding:0 30px; margin:-10px 0px 10px 0px;}
#form_contact_error, #form_contact_file_error{padding:0px;}
#form_contact_file_error{margin: -20px 0px 20px 0px;}

#topbar_continue{background: #226CFF;}
#topbar .topbar_done.lock_button, #topbar .topbar_done.lock_button:hover{background:#D8DFE9;cursor:default;}

.offpage #topbar{display:none;}
#box_unfit_images{padding:0px 0px 25px 30px;}
#box_unfit_images a{margin-right:5px;}
#box_unfit_images a:hover{opacity:0.8;}
#box_help_buttons{margin-left:30px;}
#closehelpbutton{background:#226CFF; color:#fff; margin-left:0px; margin-bottom:30px;}
#box_openlink_cta{display:block; text-decoration:none;}
#box_openlink_cta.grey_button{color:#000; background:#F3F5F8;}
.link_button{background:#46BA43;}
.link_button:hover{background:#30A92D;}
@media screen and (max-width: 420px) {
  .container{margin-left:20px; margin-top:20px; width:calc(100vw - 40px);}
  .play{position: absolute; left:calc(50vw - 40px); top:95px; pointer-events: none; width:40px; height:40px;}
  #box_welcome_player:hover .play{width:50px; height:50px; left:calc(50vw - 45px); top:90px;}
}
#form_contact_video_2{display:none;}
#form_contact_video_delete{margin:0;text-decoration: none; color:#666; background:#fff; width:100%; display: block;  text-align: center;    padding: 5px 0;border-radius: 2px;}
#form_contact_video_delete:hover{color:#000;}
.background{background:rgba(243,245,248,.9);}
p{margin:0px;}
.iframe{height:calc(100vh - 50px); width:100%; transition: 0.6s ease transform; z-index: -100; box-shadow: 0px 0px 10px #d8dfe9; margin-top:50px;}
.iframe_off{
  margin-top:0;
  border: solid 5px #000;
  border-top: solid 35px #000;
  transform:scale(.7);
  border-radius: 10px;
  filter: blur(0px);
}
.iframe_on{
  border:0px;
}
/* TOP */
#topbar, #topbar_stopped {z-index: 22; top:0; left:0; right:0; height: 50px; background:#fff; font-size:12px; line-height: 20px; font-weight: bold; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);}
#topbar_stopped svg{margin-left: calc(50vw - 25px);}
.offpage #topbar .inner{margin-left: calc(50vw - 60px);}
.onpage #topbar{box-shadow: none; background: transparent;}
#topbar .rec{position:relative; grid-column: 1 ; grid-row: 1; width:16px; height:16px; border-radius: 8px; margin:17px 5px 17px 17px; }
#topbar #recordingdot{background-color: #fff; border: 4px solid #EC002A; position:absolute; width:4px; height:4px; top:2px; left:3px;border-radius: 12px;}
#topbar #recordingdot .recordingdot_trigger{animation-name: speak; animation-duration: .2s;}
@keyframes speak { from {transform: scale(1.2);} to {transform: scale(1);}}
#topbar .task{color:#000; grid-column: 2 ; grid-row: 1; padding:15px 0px 13px 14px; font-weight: normal;}
#topbar #topbar_countL{width:40px; padding:15px 0px;}
#topbar #topbar_countS{width:40px; padding:15px 0px;}
#topbar #topbar_link{grid-column: 3; grid-row: 1; padding:15px 0px; opacity:.3; text-transform: uppercase; cursor:pointer;}
#topbar #topbar_link:hover{opacity: 1;}
#topbar.topbar_link_continue #topbar_link{color:#46BA43; opacity: 1;}
#topbar.topbar_link_continue #recordingdot{border-radius: 0px; border:2px solid #000; border-top:0px; border-bottom:0px; width:3px; height:10px; left:8px;}
#topbar #topbar_task{grid-column: 4; grid-row: 1; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}

#topbar button{padding: 5px 20px; margin:10px 10px 10px 0px;}
#topbar .help{padding: 5px 10px; grid-column: 6 ; grid-row: 1; font-size: 12px; line-height: 20px;color: #848C97; background: #fff;}
#topbar .help:hover{color:#000;}
#topbar #topbar_more{white-space: nowrap; grid-column: 5; grid-row: 1; font-weight: normal; padding:15px 20px 13px 5px;}
#topbar #topbar_more:hover{text-decoration: underline;}
#topbar .done{white-space: nowrap; grid-column: 7; grid-row: 1; font-weight: 400; font-size: 12px; line-height: 20px; background:#226CFF; }
#topbar .done:hover{background:#000; color:#fff;}
#topbarS{position:relative;}

#topbarS #topbar_show, #topbarS #topbar_hide{grid-column: 4; grid-row:1;}
#topbar_below_buttons{display: grid; grid-template-columns: min-content min-content;}
#topbar #topbar_below_buttons .done{grid-column:1;}
#topbar #topbar_below_buttons .help{grid-column:2; background:#F3F5F8;}
#topbarS .below{position: fixed; top: 50px; bottom: 0px; left: 0px; right: 0px; overflow: auto;}
#pause_blocker{background:#000; opacity: .8; position: fixed; left:0px; right:0px; top:50px; bottom:0px; z-index: 1000; }
@media screen and (max-width: 420px) {
  #topbar #topbarL{ grid-template-columns: min-content auto; grid-template-rows: auto auto;}
  #topbar .done{grid-column: 2; grid-row: 2; margin-left:0px; margin-bottom:15px;}
  #topbar .help{grid-column: 2; grid-row: 2; display:none !important;}
  #topbar #topbar_task{padding-bottom:0px; padding-right:10px;}
}
#topbarS, #topbar_hide, #topbarS .below{display:none;}
.topbar_open_sview #topbarS .below{display:block; background: rgba(243,245,248,.9);}
.topbar_open_sview #topbarS {background:#fff;}
#topbarS .below{display:none;}
#topbarS .content_below{padding:0px 20px 10px 20px; background:#fff; box-shadow: 0px 20px 20px -20px rgba(0, 0, 0, 0.1);}
.topbar_open_sview #topbar_hide{display:block;grid-column: 1/5; grid-row: 1; background:transparent; color:#226CFF; font-weight: 400; padding:15px 40px 15px 30px; margin:0px;}
.topbar_open_sview #topbar_hide:after{background-image: url('/img/sprite.svg'); background-position: -4300px -410px; width:20px; height:20px; content:''; position: absolute; right:15px; top:15px; }
.topbar_open_sview #topbar_show{display:none !important;}
#topbar_task_all{font-weight: 400;}
#topbarL{display:grid; grid-template-columns: min-content min-content min-content auto max-content min-content min-content;}
#topbarS{grid-template-columns: min-content min-content auto min-content;}
@media screen and (max-width: 600px) {
  #topbarS{display:grid;}
  #topbarL{display:none;}
}
@media screen and (min-width: 601px) {
  #topbar_task_all{display:none;}
  #topbar #topbar_show, #topbar #topbar_hide{display: none;}
  #topbar_more_all{display:none;}
  .iframe{border-radius: 5px; margin:50px 10px 10px 10px; width:calc(100vw - 20px); height:calc(100vh - 60px); }
}

/*PROGRESS*/
.progress_container{display: grid; grid-template-columns: auto auto; font-style: normal; font-weight: 500; font-size: 12px; line-height: 20px; letter-spacing: 0.02em; text-transform: uppercase; color: #848C97; margin:10px 30px 0px 30px;}
.progress_container .progress{text-align: right;}
.progress_container .back{cursor: pointer;}
.progress_container .back:hover{color: #226CFF;}

/*GENERAL BACK BUTTON*/
#general_back{cursor: pointer; text-align: left; font-weight: 500; font-size: 12px; line-height: 20px; letter-spacing: 0.02em; text-transform: uppercase; color: #848C97; margin:0px 30px 10px 30px; padding-top:10px; border-top: solid 1px #F3F5F8;}
#general_back:hover{color: #226CFF;}
@media screen and (min-width: 420px){#general_back{margin-left:calc(50% - 170px); padding-top:20px; border-top:none;}}
.hideBackOnHelp #general_back{display:none !important;}

/*QUESTIONS*/
#box_openlink_progress, #box_onpagelink_progress, #box_questions_progress{font-style: normal; font-weight: 500; font-size: 12px; line-height: 20px; letter-spacing: 0.02em; text-transform: uppercase; color: #848C97; margin:0px 0 -10px 30px;}
#box_onpagelink_progress{margin-top:0px;}
#box_questions_progress{margin-top:30px;}
#box_questions_text{padding:5px 7px; font-family: Courier, monospace; font-size: 16px; border: solid 1px #848C97; margin: 0px 30px 20px 30px; outline: none; width: -webkit-fill-available;}
#box_questions_text:focus{border-color:#D8DFE9; border-bottom:solid 1px #000;}
#box_questions_hint{margin:10px 30px 20px 30px; color:#848C97; font-size: 12px; line-height: 20px; letter-spacing: 0.02em; font-weight:500;}
#box_questions_error{margin:10px 30px 20px 30px; color:#EC002A;}
#box_questions_copy{margin: 30px 0px 10px 0px; font-size:20px; line-height: 32px;}
#box_questions_options label{font-size:20px; line-height: 32px;}
#box_questions_options div{color: #848C97;}
#box_questions_options div:hover{color: #226CFF;}
#box_questions_options input[type="checkbox"] + label::before{top:8px;}
#box_questions_options input[type="checkbox"]:checked + label, #box_questions_options input[type="radio"]:checked + label{color:#000;}
#box_questions_cta, #box_context_cta{background:#F3F5F8; color:#000; cursor: pointer;}
#box_questions_cta:hover, #box_context_cta:hover{background:#000; color:#fff; }
#box_questions_cta_container{border-top:solid 1px #F3F5F8; width:100%; padding-top:20px;}
#box_questions_cta.active{background:#000; color:#fff;}
#box_questions_cta:disabled{color:#fff;}
#box_questions_options{border-top:solid 1px #F3F5F8; padding:20px 10px 20px 30px; margin-top:20px;}

/*FEEDBACK*/
input[type="radio"]{display:none;}
#box_questions_options input[type="radio"]+label{font-weight: 400; padding-left:26px; margin-right:10px;display: block; position:relative;}
#box_questions_options input[type="radio"]+label::before{content:''; position: absolute; left:0px; top:8px; width:14px; height:14px; border:1px solid #000; border-radius: 16px;}
#box_questions_options input[type="radio"]:checked+label::before{border: 3px solid #fff; background: #000;width: 6px;height: 6px;box-shadow: 0 0 0 2px #000; left: 2px;top: 10px;}
#box_questions_options input[type="checkbox"] + label {margin-left:16px; padding-left:10px;}
#box_questions_options input[type="checkbox"]+label::before{left:26px;}
.feedbackoption, .task_option{margin-bottom:10px;}

/*CONTACT*/
#form_contact label{display:block;margin-bottom:10px;}
#form_contact input{font-family: 'Montserrat', sans-serif; display:block;margin-bottom:20px; width:100%; border: 1px solid #D8DFE9;box-sizing: border-box;border-radius: 2px; font-style: normal;font-weight: normal;font-size: 16px;line-height: 24px; padding:5px 10px;}
#video, #video2{position:fixed; bottom:10px; left:10px; z-index:2; broder-radius:100px;}
#video2 {bottom:100px;}
#testcenter{padding:15px; background:#c2c2c2; height:20px;}
#stop{position:fixed; right:20px; top:20px;}
#overlay{position:fixed; z-index:1; right:0px; left:0px; top:0px; bottom:0px; background: rgba(0,0,0,.5);}
#content, #content2{background:#fff; width:240px; padding:20px; position:fixed; top: calc(50% - 200px); left:calc(50% - 120px); }
#form_contact #form_contact_file_cta_label{background:#46BA43; margin:10px 0px 30px 0px;}
#form_contact #form_contact_file_cta_label.file_selected{background:transparent; color:#000; letter-spacing: 0px; font-weight: 400; font-size: 16px; padding:0px 0px;text-transform: none;text-decoration: underline;display: inline-block;margin-top: 0px;}
#box_welcome_video{cursor:pointer;}
#box_openlink_hint{margin-bottom: 30px; padding-top:0px; margin-top:-10px;}
#form_contact_adminInfo{margin:0px 30px;}

/* ONPAGE */
.onpage .background, .onpage .boxcontainer{display:block; position:fixed; top:50px; left:0px; bottom:0px; right:0px;}
.onpage .boxcontainer{display:none;}
.container{max-height: calc(100vh - 60px); overflow:auto;}
.onpage .background{z-index:10;}
.onpage #topbar{position:fixed;}
.container{display:none;}
#iframe{border:none;}

/* ONPAGE */
.copy, button{transition: .3s;}
.lock_copy{filter:blur(3px); color:#848C97;}
.lock_button{filter:blur(3px); background:#D8DFE9;}
.lock_button:hover{background:#D8DFE9;}
#topbar .lock_button{color:#fff;}
.iframe_off{position: absolute; top: 0px; filter: blur(10px);}

/* QUESTIONS */
#box_questions_cta{display:block;}

/*Lock Admin*/
#adminLock, #adminSkip, #adminPrevious{-webkit-transition: transform .5 ease-in-out; transform: scale(0); cursor:pointer; position:fixed; z-index: 99999; bottom:80px; right:20px; width:50px; height:50px; background: #226CFF url('/img/sprite.svg'); background-position: -4685px 3px; border-radius: 40px; box-shadow: 0px 3px 10px -5px rgba(0, 0, 0, .3);}
#adminLock.unlockAvailable, #adminSkip, #adminPrevious{transform: scale(1);}
#adminLock.unlockAvailable:hover, #adminSkip:hover{transform: scale(1.04);}
#adminSkip{bottom:20px; background-color:#fff; background-position: -5085px -295px;}
#adminPrevious{bottom:20px; right:80px; background-color:#fff; background-position: -1985px -295px;}
.editorinfo{font-size:12px; margin-top:20px; color:#848C97;}
#form_contact_adminInfo{margin-bottom:20px;}


/* Mobile Full Screen */
@media screen and (max-width: 421px) {
  .boxcontainer .container{margin-left: 0px; margin-top:0px; width:inherit; border-radius: 0px; box-shadow: none;}
  .boxcontainer .container .video_container, .boxcontainer .container .video_container video{border-radius:0px;}
  .video_container .play{left:calc(50vw - 20px);}
  #box_unfit{margin-top:0px;}
  body{background:#fff;}
  #box_openlink_done{background:none; border-top: solid 1px #F3F5F8;}
  .background{background:#fff;}
  .offpage #topbar .inner{margin-left:0px;}
}

#recorderPreviews .vidContainer{border-radius: 10px; position: fixed; left:10px; bottom:10px; overflow:hidden; width:100px; height:100px; }
#recorderPreviews .vidContainer video{min-height:100px; min-width: 100px;}
#videorecorder_2{transform:scaleX(-1);}