@import url('https://fonts.googleapis.com/css?family=Muli:400,400i,700,700i&display=swap');
@import url('https://srwd.sesamehub.com/assets/fonts/fontawesome-pro-5.10.1-web/css/all.min.css');
/* ===============================================
	
	vConsult Form
	
	Sesame Communications - (c) 2019
	Written by: James Stillion
	All rights reserved.
	Any reproduction or intentional misuse is strictly prohibited
	
=============================================== */

/* ===============================================
Basic Stylings
These will affect every size of the site.
=============================================== */
/*resets*/
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
img {
  height: auto;
}
/*GLOBAL OVERRIDES*/
.fa,
.fas,
.fab,
.fal,
.far,
.fad {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  vertical-align: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}
sup {
  font-size: inherit;
  top: 0;
}
li {
  line-height: inherit;
}
body,
input,
select,
textarea,
form button {
  font-family: 'Muli', sans-serif;
}
/*hfam*/
h1 {
  line-height: 1.8;
  font-size: 1.8em;
  text-transform: uppercase;
  color: #fff;
}
h2 {
  line-height: 1.05;
  font-size: 1.422em;
  text-transform: uppercase;
  margin: 0 0 0.879em;
  position: relative;
  z-index: 420;
}
/* ==================================================================
	body
=================================================================== */
body {
  line-height: 1;
  font-size: 10px;
  font-family: 'Muli', sans-serif;
  color: #fff;
  margin: 0;
/*   overflow-x: hidden; */
  overflow:hidden;
}
.lity-content:after {
  box-shadow: 0;
}
/*MOD*/
.mod {
  width: 100%;
  height: 36em;
  position: relative;
}
/* .info */
.info {
  /* min-height:29.6em; */
  width: 96%;
  //max-width: 20.5em;
  position: relative;
  z-index: 420;
}
/* screen */
[id^="screen"] {
  width: 100%;
  border-radius: 0.5em;
  padding:2em 1em 7.25em;
  position: absolute;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.35s ease;
  -moz-transition: all 0.35s ease;
  -o-transition: all 0.35s ease;
  -ms-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
[id^="screen"]:before {
  content: '';
  width: auto;
  height: auto;
  background: rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: -6em;
  z-index: 400;
  -webkit-transform: translate(-110%, 0);
  -moz-transform: translate(-110%, 0);
  -ms-transform: translate(-110%, 0);
  -o-transform: translate(-110%, 0);
  transform: translate(-110%, 0);
  -webkit-transition: all 0.35s ease 0.2s;
  -moz-transition: all 0.35s ease 0.2s;
  -o-transition: all 0.35s ease 0.2s;
  -ms-transition: all 0.35s ease 0.2s;
  transition: all 0.35s ease 0.2s;
}
[id^="screen"].show:before {
  -webkit-transform: translate(0, 0) skewX(26deg);
  -moz-transform: translate(0, 0) skewX(26deg);
  -ms-transform: translate(0, 0) skewX(26deg);
  -o-transform: translate(0, 0) skewX(26deg);
  transform: translate(0, 0) skewX(26deg);
}
[id^="screen"]#screen1 {
  background-color: #b1d9d5;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  left: 100%;
  top: 100%;
  -webkit-transform: rotate(20deg);
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -o-transform: rotate(20deg);
  transform: rotate(20deg);
}
[id^="screen"]#screen1.show {
  opacity: 1;
  visibility: visible;
  left: 0;
  top: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
/*
[id^="screen"]#screen2,
[id^="screen"]#screen3,
[id^="screen"]#screen4,
[id^="screen"]#screen5,
[id^="screen"]#screen6 {
  left: -100%;
  top: -100%;
  -webkit-transform: rotate(-20deg);
  -moz-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -o-transform: rotate(-20deg);
  transform: rotate(-20deg);
}
*/
[id^="screen"]#screen2,
[id^="screen"]#screen5,
[id^="screen"]#screen8{
  left: -100%;
  top: -100%;
  -webkit-transform: rotate(-20deg);
  -moz-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -o-transform: rotate(-20deg);
  transform: rotate(-20deg);
}
[id^="screen"]#screen4,
[id^="screen"]#screen7,
[id^="screen"]#screen10{
  left: 100%;
  top: 100%;
  -webkit-transform: rotate(20deg);
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -o-transform: rotate(20deg);
  transform: rotate(20deg);
}
[id^="screen"]#screen3, 
[id^="screen"]#screen6,
[id^="screen"]#screen9{
  left: 100%;
  top: -100%;
  -webkit-transform: rotate(20deg);
  -moz-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  -o-transform: rotate(20deg);
  transform: rotate(20deg);
}


[id^="screen"]#screen2.show,
[id^="screen"]#screen3.show,
[id^="screen"]#screen4.show,
[id^="screen"]#screen5.show,
[id^="screen"]#screen6.show,
[id^="screen"]#screen7.show,
[id^="screen"]#screen8.show,
[id^="screen"]#screen9.show,
[id^="screen"]#screen10.show {
  opacity: 1;
  visibility: visible;
  left: 0;
  top: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
[id^="screen"]#screen2,
[id^="screen"]#screen3,
[id^="screen"]#screen4,
[id^="screen"]#screen5,
[id^="screen"]#screen6,
[id^="screen"]#screen7,
[id^="screen"]#screen8,
[id^="screen"]#screen9,
[id^="screen"]#screen10
 {
  background-image: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
  background-image: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
  background-image: radial-gradient(ellipse at center, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
  background-position: 0 100%;
  background-size: 250% 250%;
}
[id^="screen"]#screen2,
[id^="screen"]#screen3,
[id^="screen"]#screen4,
[id^="screen"]#screen5,
[id^="screen"]#screen6,
[id^="screen"]#screen7,
[id^="screen"]#screen8,
[id^="screen"]#screen9,
[id^="screen"]#screen10 {
  background-color: #93bdb9;
}
.valProp {
  list-style: none;
  margin: 0 0 2.65em;
  padding: 0 0 0 1.75em;
}
.valProp li {
  line-height: 1.66;
  font-size: 1.2em;
  margin: 0 0 0.46em;
  position: relative;
}
.valProp li .icon {
  line-height: inherit;
  margin-right: 0.542em;
  position: absolute;
  top: 0;
  right: 100%;
}
.instructions {
  line-height: 1.24;
  font-size: 1.2em;
}
.instructions p {
  margin: 0 0 1.25em;
}
.example {
  /*font-size: 3vw;*/
  font-size: 1.15em;
  width: 206px;
  /*max-width: 15.68em;*/
  max-width: 50%;
  /* height:13.4em; */
  border-radius: 6px;
  margin-bottom: 1em;
  border: 2px solid #fff;
}
/* form */
.form {
  position: relative;
}
.form.start {
  width: 100%;
  max-width: 20.5em;
  margin: 0;
  padding: 0;
}
.form input[type="text"],
.form input[type="date"],
.form textarea,
.form select {
  /*F21.33*/
  font-size: 1.0665em;
  color: #fff;
  caret-color: #ff6600;
  /* cursor color */
  width: 100%;
  border-radius: 6px;
  margin: 0 0 0.75em;
  background: transparent;
  border: 2px solid #fff;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  transition-duration: 0.3s;
  box-shadow: none;
  display: block;
}
.form input[type="text"].requiredField {
  border: 2px solid #d66262;
}
.form input[type="text"]::-webkit-input-placeholder,
.form textarea::-webkit-input-placeholder {
  color: #fff;
}
.form input[type="text"]:-moz-placeholder,
.form textarea:-moz-placeholder {
  color: #fff;
}
.form input[type="text"]::-moz-placeholder,
.form textarea::-moz-placeholder {
  color: #fff;
}
.form input[type="text"]:-ms-input-placeholder,
.form textarea:-ms-input-placeholder {
  color: #fff;
}
.form input[type="text"]:focus,
.form textarea:focus {
  color: #96b8b4;
  box-shadow: none;
  background: #fff;
}
.form input[type="text"]:focus::-webkit-input-placeholder,
.form textarea:focus::-webkit-input-placeholder {
  color: #96b8b4;
}
.form input[type="text"]:focus:-moz-placeholder,
.form textarea:focus:-moz-placeholder {
  color: #96b8b4;
}
.form input[type="text"]:focus::-moz-placeholder,
.form textarea:focus::-moz-placeholder {
  color: #96b8b4;
}
.form input[type="text"]:focus:-ms-input-placeholder,
.form textarea:focus:-ms-input-placeholder {
  color: #96b8b4;
}
.form input[type="text"],
.form input[type="date"],
.form select {
  height: 2.53em;
}
.form select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 0 0 16px;
  background: #fff;
  color: #333;
}
.nextBtn,
.prevBtn,
input[type="submit"] {
  /*F21.33*/
  line-height: 2.34;
  font-size: 1em;
  text-align: left;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  width: 6.2em;
  height: 2.58em;
  border-radius: 6px;
  margin: 0 auto 0 0;
  padding: 0 0 0 0.75em;
  background: transparent;
  border: 2px solid #fff;
  display: block;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  transition-duration: 0.3s;
  position: relative;
  z-index: 420;
}
.nextBtn:hover,
.prevBtn:hover,
input[type="submit"]:hover {
  color: #95b8b3;
  background: #fff;
}
.nextBtn .cta,
.prevBtn .cta,
input[type="submit"] .cta {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.nextBtn .icon,
.prevBtn .icon,
input[type="submit"] .icon {
  margin-left: 0.328em;
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.prevBtn .icon {
  margin-right: 0.328em;
}
input[type="submit"] {
  width: 12em;
}
.nextBtn,
#screen1 .nextBtn,
.prevBtn,
input[type="submit"]{
  margin: 0 0 3.4em 1em;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 420;
  overflow: hidden;
}
.nextBtn, input[type="submit"] {
  margin: 0 2.8em 3.4em 0;
  left: auto;
  right: 0;
}
.nextBtn:hover .cta,
.prevBtn:hover .cta {
  -webkit-transform: translate(-20em, 0);
  -moz-transform: translate(-20em, 0);
  -ms-transform: translate(-20em, 0);
  -o-transform: translate(-20em, 0);
  transform: translate(-20em, 0);
}
.nextBtn:hover .icon {
  -webkit-transform: translate(-150%, 0) scale(2);
  -moz-transform: translate(-150%, 0) scale(2);
  -ms-transform: translate(-150%, 0) scale(2);
  -o-transform: translate(-150%, 0) scale(2);
  transform: translate(-150%, 0) scale(2);
}
.prevBtn:hover .icon {
  -webkit-transform: translate(150%, 0) scale(2);
  -moz-transform: translate(150%, 0) scale(2);
  -ms-transform: translate(150%, 0) scale(2);
  -o-transform: translate(150%, 0) scale(2);
  transform: translate(150%, 0) scale(2);
}
/* global override */
/* padding for inputs and textareas */
.full textarea {
  padding: 9px 0 0 16px!important;
  min-height: 0;
}
input[type="text"],
input[type="date"],
input[type="email"],
input[type="search"],
input[type="tel"] {
  padding: 0 0 0 16px!important;
}
input[type="date"] {
  margin-bottom: .55em;
}
.sub-label {
    margin-left: 16px;
    margin-bottom: 1em;
    display: block;
}
input[type="file"],
.simplebox-input + label {
  line-height: 8.14;
  font-size: 1.15em;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  width: 206px;
  /*max-width: 15.68em;*/
  max-width: 50%;
  border-radius: 6px;
  padding: 0;
  margin: 0;
  background: rgba(0, 0, 0, 0.21);
  border: 2px solid #fff;
  display: inline-block;
  z-index: 9999;
}
input[type="file"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.inputfile:focus + label,
.inputfile + label:hover {
  cursor: pointer;
}
#disclaimer {
    position: relative;
    z-index: 420;
}
.hidden {
  display: none!important;
}

/* ===============================================
Small Tablet/Large Phone Stylings (Optional)
Supports 30em (480px) to 47.9375em (767px)
------
Useful for making minor adjustments between
awkward sizes.
=============================================== */
@media only screen and (min-width: 30em) and (max-width: 47.9375em) {
	
/*END*/
}
/* ===============================================
Tablet / Desktop Stylings
Supports 48em (768px) and up
=============================================== */
@media only screen and (min-width: 48em) {
	
	body { font-size:12px;overflow:hidden; }
		
  /*MOD*/
  .mod:before {
    display: block;
  }
  /* screen */
  [id^="screen"] {
  	padding: 2.6em 2.75em 7.25em;
  }
  .info{
  	max-width: 20.5em;
  }
  .nextBtn {
    margin: 0 0 3.4em 12em;
    left: 0;
    right: auto;
  }
  input[type="submit"] {
    position: relative;
    margin: .5em 0 0 0;
  }
	.prevBtn,
	#screen1 .nextBtn{
		margin: 0 0 3.4em 2.8em;
	}
  [id^="screen"] {
    height: 38em;
  }
  [id^="screen"]:before {
    right: 50%;
  }
  [id^="screen"].show:before {
    -webkit-transform: translate(0, 0) skewX(10deg);
    -moz-transform: translate(0, 0) skewX(10deg);
    -ms-transform: translate(0, 0) skewX(10deg);
    -o-transform: translate(0, 0) skewX(10deg);
    transform: translate(0, 0) skewX(10deg);
  }
  [id^="screen"]#screen1 {
    background-image: url(https://srwd.sesamehub.com/assets/vConsult/images/bg1.jpg);
  }
  /*  padding:2.6em 2.75em 3.25em; */
  .example {
    font-size: inherit;
    width: 22.3em;
    position: absolute;
    top: 2.6em;
    right: 2.75em;
  }
  #cke_ele_2_wrap,
  #cke_ele_3_wrap,
  #cke_ele_4_wrap,
  #cke_ele_5_wrap,
  #cke_ele_6_wrap {
    width: 22.3em;
    position: absolute;
    right: 2.75em;
    bottom: 3.25em;
  }
  input[type="file"],
  .simplebox-input + label {
    /*F28.44*/
    line-height: 9.14;
    font-size: 1.42em;
    width: 15.68em;
    max-width:none;
  }
  /*END*/

  #disclaimer {
    position: absolute;
    bottom: 10px;
    right: 10px;
    max-width: 320px;
    box-sizing: border-box;
    padding: 15px;
    background: rgba(0,0,0,.5);
    border-radius: 8px;
  }
  #disclaimer p {
    margin-top: 0;
  }
  #disclaimer p:last-child {
    margin-bottom: 0;
  }


}
/* ===============================================
Desktop Only Stylings
Supports 64em (1024px) and up
=============================================== */
@media only screen and (min-width: 64em) {
  
  [id^="screen"] {
    height: 36em;
    padding: 2.6em 2.75em 3.25em;
  }
  
/*END*/
}
/* ===============================================
Desktop Only Excluding large tablets
Supports 81.25em (1300px) and up
=============================================== */
@media only screen and (min-width: 81.25em) {
  /*END*/
}
/* ===============================================
Desktop Only Large Screen Only
Supports 125em (2000px) and up
=============================================== */
@media only screen and (min-width: 125em) {
  /*END*/
}
/* ie nonsense */
/***********************************************
target ie11: html[data-useragent*='Trident/7.0']
***********************************************/
html[data-useragent*='Trident/7.0'] {
	
/* END */
}
