/* imports */
/* SWIPEJS */
.swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative; }

.swipe-wrap {
  overflow: hidden;
  position: relative; }

.swipe-wrap > div {
  float: left;
  width: 100%;
  position: relative; }

/* SWIPEJS */
.rando {
  max-width: 61em;
  margin: 0 auto; }

.top-banner {
  background: #fff;
  min-height: 80px;
  width: 100%; }
  
.header-logo {
  border-right: 1px solid #5aa6d0;
}
  
.agent-button {
  
  background: url('../images/btn_quote.png') 0 0 no-repeat;
  display: inline-block;
  width: 210px;
  height: 42px;
  overflow: hidden;
  text-indent: -1000em;
  margin-left: 20px;
  margin-bottom: 10px
}

.agent-button:hover {
  background-position: 0 -42px;
}

@media screen and (max-width: 340px) {
  .top-banner {
    text-align: center;
  }
  .header-logo {
    border-right: none;
  }
}


.wysw-container, p, ul, li, h3 {
  color: #4d4d4d;
  position: relative;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; }
  
  .fancy {
    display: none;
  } 
.img-responsive {
  width: 100%;
  height: auto;
}

.header-logo {
  max-width: 200px;
}

p {
  font-size: .8em; }

h3 {
  display: inline-block; }

h3.slide_text {
  text-align: center;
}

.some-icons {
  list-style-type: none; }
  .some-icons li {
    display: inline-block;
    margin-left: .4em;
    float: right;
    overflow: hidden; }
    .some-icons li.fb {
      background: url("../images/icon_fb.png") center center no-repeat; }
    .some-icons li.tw {
      background: url("../images/icon_twitter.png") center center no-repeat; }
    .some-icons li.gp {
      background: url("../images/icon_email.png") center center no-repeat; }
    .some-icons li a {
      display: block;
      text-indent: -9999pt;
      width: 2em;
      height: 2em; }

.wysw-container,
.wysw-container * {
  box-sizing: border-box; }

.wysw-header {
  color: #01366e;
  display: block; }

.wysw-rooms_total__label {
  color: #4d4d4d;
  font-size: 1em; }

.wysw-container > img {
  max-width: 100%;
  height: auto; }

label[for*="wysw-room-options-"] {
  display: block;
  font-size: 1.4em;
  font-weight: 700;
  margin: 0 auto;
  text-align: center;
  position: relative; }

label[for*="wysw-room__figure--"] {
  display: block;
  font-size: 1.4em;
  font-weight: 700;
  margin: 0 auto;
  text-align: center;
  position: relative; }


label[for*="income_slider"] {
  display: block;
  font-size: 1.4em;
  font-weight: 700;
  margin: 0 auto;
  text-align: center;
  position: relative; }


label.room-label {
  top: 2.4em; }

.wysw-room-options, .wysw-disposable_income__options {
  background-color: #f8f8f8;
  font-size: 1em;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 100%;

  padding: 0;
  margin: 1em auto; }

.wysw-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-align: center;
      align-items: center; }

.wysw-title {
  display: inline-block;
  width: auto;
  font-size: 1.75em;
  -ms-flex-positive: 1;
      flex-grow: 1;
  margin: 0 1em 0 0;
  vertical-align: middle;
  padding: .75em 0; }

.wysw-rooms_total {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  padding: .5em 0; }

.wysw-rooms_total__total {
  margin: 0;
  padding: 0;
  font-size: 1.75em;
  font-weight: 600; }

.wysw-room__controls,
.wysw-disposable_income {
  background-color: #f8f8f8;
  border-bottom: 2px solid #ddd;
  padding: 1em;
  text-align: center;
   }

.wysw-disposable_income {
  padding: 1em; }

.wysw-room__controls {
  overflow: hidden;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
  .wysw-primary-svg  {
    width: 976px;
    height: 528px;
  }
}

/* styling the range input */
input[type=range]::-webkit-slider-thumb, span.ui-slider-handle.ui-state-default.ui-corner-all, .ui-slider-horizontal>.ui-slider-handle {
  -webkit-appearance: none;
  border: 0.175em solid #80320a;
  height: 1.8em;
  width: 1.8em;
  border-radius: 50%;
  background: #c74e10;
  cursor: pointer;
  top: -16px;
  position: absolute;
  z-index: 2;
  touch-action: none;
  margin-left: -.6em
   }
   
input[type=range]::-webkit-slider-thumb:hover {
  background: #d0670c; }

/* moz and webkit in the same declaration wasn't working for the range input button. These two are the moz versions of the above two. */
input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  border: 0.175em solid #80320a;
  height: 1.4em;
  width: 1.4em;
  border-radius: 50%;
  background: #c74e10;
  cursor: pointer; }
  input[type=range]::-moz-range-thumb:hover {
    background: #d0670c; }

input[type=range]::-webkit-slider-thumb {
  margin-top: -14px;
  /*chrome only*/ }
  
  
@media screen and (max-width: 766px) {
  
    input[type=range]::-webkit-slider-thumb, span.ui-slider-handle.ui-state-default.ui-corner-all, .ui-slider-horizontal>.ui-slider-handle {
      height: 2.4em;
      width: 2.4em;
      top: -20px;
    }   
    /* moz and webkit in the same declaration wasn't working for the range input button. These two are the moz versions of the above two. */
    input[type=range]::-moz-range-thumb {
      height: 2.4em;
      width: 2.4em;
    }
}

input[type=range]::-webkit-slider-runnable-track, .ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content.ui-corner-all {
  border-radius: 1em;
  width: 96%;
  height: .175em;
  padding: 0;
  cursor: pointer;
  background: #7a7a7a;
  margin: 16px auto;
  border: 1px solid #aaaaaa;
  position: relative;
  text-align: left;
  color: #222222;
  
  z-index: 1002;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border: .15em solid #80320a !important;
    background: #c74e10 !important; 
    font-weight: normal;
    color: #555555;
    width: 2.4em !important;
    height: 2.4em !important;
    border-radius: 2.4em !important;
    top: -1.2em !important;
}


.ui-widget-content {
    border: 1px solid #444 !important;
    background: #444 !important;
    color: #222222;
}

.ui-slider-horizontal {
  height: .15em !important;
}

.wysw-range-options {
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  margin: 0 auto;

}

.wysw-range-options li {
  display: inline-block;
  padding: 0;
  margin: 0;
  text-align: center;
  -ms-flex-positive: 1;
      flex-grow: 1;
  padding: .5em;
  margin: 1em 0 0; }

.wysw-range-options li:first-child {
  text-align: left;
  float: left;
  }

.wysw-range-options li:last-child {
  text-align: right; 
  float: right;
  }

a[class*='wysw-swipe-'] {
  cursor: pointer; }

[class*="wysw-swipe--"] {
  background: rgba(0, 117, 201, 0.8);
  fill: #fff;
  display: inline-block;
  float: left;
  top: 21em;
  padding: 1.25%;
  position: absolute;
  z-index: 10;
  width: 5%;

}

[class*="wysw-swipe--"]:hover {
  background: #2c9cce; }

[class*="wysw-swipe--"] svg {
  padding: 20%;
  width: 100%;
}

.wysw-swipe--prev {
  border-top-right-radius: .35em;
  border-bottom-right-radius: .35em;
  left: 0; }

.wysw-swipe--next {
  border-top-left-radius: .35em;
  border-bottom-left-radius: .35em;
  right: 0px; }

.wysyw__results_teaser-container {
  background: #d1eaf5; }

.wysw__results_teaser {
  margin: 25% 0;
  padding: 0 10%;
  text-align: center; }

.wysw__results {
  background: #d1eaf5;
  display: none; }

.wysw__income,
.wysw__time {
  display: inline-block;
  padding: 2em;
  text-align: center;
  vertical-align: top;
  width: 48%; }

.wysw__income span,
.wysw__time span {
  color: #0075c9;
  font-size: 2.2em;
  font-weight: 700; }

.wysw__insure {
  padding: 2em;
  text-align: center; }

.wysw__coffeecup {
  display: inline-block;
  width: 100%; }

.wysw__coffeecup img.resultsCups {
  max-width: 3em;
  display: inline-block; }

.wysw__coffeecup svg {
  fill: #0075c9; }

.wysw__insure p {
  font-size: 1.25em;
  font-weight: 700; }

.wysw__insure-cta {
  margin: 2em auto; }

.wysw__insure-cta a {
  margin: .5em; }

.indicators {
  margin: .4em auto;
  text-align: center; }
  .indicators .slide-marker {
    width: 16px;
    height: 6px;
    display: inline-block;
    border: solid 1px #aaa;
    text-align: center; }
    .indicators .slide-marker.on {
      background-color: #01366e; }

.btn {
  background: #c74e10;
  border-radius: .35em;
  color: #fff;
  display: inline-block;
  font-weight: 700;
  padding: 12px 16px;
  text-decoration: none; }

.btn:hover {
  background: #d0670c; }

.morph {
  -webkit-transition: opacity 500ms linear; }

.hide {
  opacity: 0; }

.kill {
  display: none; }

@media (min-width: 26em) and (max-width: 50em) {
  [class*="wysw-swipe--"] {
    top: 18em;
  }
  label.room-label {
    top: 0; 
  } 
  .wysw__income span,
  .wysw__time span {
    font-size: 1.6em; 
  }
}

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
  .wysw-swipe--next {
    right: 1px;
  }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
  .wysw-swipe--next {
    right: 1px;
  }
}


@media only screen and (device-width: 768px) and (device-height: 1024px) and (orientation : portrait) {
  .wysw-room__svg > svg {
    width: 752px !important;
  }
}

@media (max-width: 26em) {
  [class*="wysw-swipe--"] {
    top: 18em; }
  [class*="wysw-swipe--"] {
    width: 8%;
  }
  .wysw__income span {
    font-size: 3em;
  }
  .wysw__time span {
    font-size: 1.6em; 
  }
  .wysw__income, .wysw__time {
    display: block;
    padding: 1em;
    width: 100%;
  }  
  input[type=range]::-moz-range-thumb {
    height: 2.4em;
    width: 2.4em; }
  input[type=range]::-webkit-slider-thumb {
    height: 2.4em;
    width: 2.4em; }
  input[type=range]::-webkit-slider-thumb {
    margin-top: -18px;
    /*chrome only*/ }
  label.room-label {
    top: 0; }
  .wysw-room__svg svg {
    width: 100% ;
  }

}