/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

a, a:active, a:hover, a:link, a:visited{
  transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  text-decoration: none;
}

a,
a label {
    cursor: pointer;
}

h1, h2, h3, h4, h5, h6{
  font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
  letter-spacing: -1px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6{
  margin-top:0;
}

h5{
  font-size: 14px;
  color: #1e2229;
  letter-spacing: .5px;
  margin-bottom: 10px;
}

h6{
  text-transform: uppercase;
  color: #1e2229;
  font-size: 14px;
  letter-spacing: .5px;
}

.insulation h4{
  font-size: 14px;
  letter-spacing: 1px;
  color: #037ab7;
  text-transform: uppercase;
  margin-bottom: 30px;
}

  .insulation .current h4{
    margin-bottom: 15px;
  }

.insulation .current{
  margin-bottom: 70px;
}

.comfort h3{
  color: #5a5f67;
  display: inline-block;
  max-width: 220px; /* aligns check/tick on the same line */
}

.comfort div.check-float{
  display: inline-block;
  float: right;
}

@media screen and (max-width: 767px){
  .insulation .comfort{
    margin-bottom: 30px;
  }
}

label, strong{
  font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
  letter-spacing: 0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

p{
  font-family: 'Roboto-Light', Helvetica, Arial, sans-serif;
  color: #5a5f67; /*global*/
}

.h1, .h2, .h3, .h4, .h5, .h6{
    font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
    letter-spacing: 0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 11pt;
    text-transform: uppercase;
}

small{
  font-family: 'Roboto-Light', Helvetica, Arial, sans-serif;
}

.insulation h3{
  margin-bottom: 10px;
  font-size: 24px;
  text-transform: none;
}

.gray{
  background-color: #ccc;
}
.silver{
  background-color:#eee;
}
.light-purple-bg{
  background-color: #edeff3;
}

.mb-75{
  margin-bottom: 75px;
}
.mb-100{
  margin-bottom: 100px;
}

.mb-35{
  margin-bottom: 35px;
}

.mt-65{
  margin-top: 60px;
}

hr.style1{
	border-top: 5px solid #d4e0e3;
  width: 100px;
  margin-top: 40px;
  margin-bottom: 50px;
}

hr.style2{
	border-top: 2px solid #fff;
  width: 60px;
  margin-top: 15px;
  margin-bottom: 20px;
}

hr.style3{
	border-top: 3px solid #fff;
  width: 40px;
  margin-top: 15px;
  margin-bottom: 12px;
}

hr.style4{
	border-top: 4px solid #d4e0e3;
  width: 60px;
  margin-bottom: 20px;
  margin-left: 0;
}

hr.style5{
  border-top: 2px solid #eae9e8;
  width: 290px;
  margin-top: 30px;
  margin-bottom: 20px;
}

hr.style6{
  border-top: 4px solid #bbc3c5;
  width: 100px;
  margin-top: 40px;
  margin-bottom: 40px;
}

.has-error .form-control {
    border-color: #a94442;
    background-color: rgba(169, 68, 68, .2);
}

.form-control {
    border-radius:0px;
}

.form-control>strong{
  font-size: 15px;
  text-align: left;
}

/* GLOBAL BUTTONS
-------------------------------------------------- */

.btn-blue{
    color: #FFF!important;
    background-color: #037ab7;
    border: 0px;
    font-size: 16px;
    text-transform: uppercase;
    border-radius: 0;
    padding: 16px 40px 13px 40px;
    letter-spacing: 1px;
    font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    white-space: normal;
}

  a.btn-blue:hover{
    color: #fff!important;
    background-color: #19a3cb!important;
  }

.btn-red{
    color: #FFF!important;
    background-color: #7e2236;
    border: 0px;
    font-size: 16px;
    text-transform: uppercase;
    border-radius: 0;
    padding: 15px 40px 14px 40px;
    letter-spacing: 1px;
    font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    white-space: normal;
}

  a.btn-red:hover{
      color: #FFF!important;
      background-color: #d90b26!important;
  }


  .btn-black{
      color: #1e2229!important;
      background-color: #ffffff;
      border-color: none;
      font-size: 16px;
      text-transform: uppercase;
      font-weight: bold;
      border-radius: 0;
      margin-top: 15px;
      padding: 16px 40px 12px 40px;
      letter-spacing: 1px;
      font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      white-space: normal;
  }

    a.btn-black:hover{
      color: #FFF!important;
      background-color:#1e2229!important;
    }

    .btn-white{
        color: #FFF!important;
        background-color: #000 !important;
        border-color: none;
        font-size: 13px;
        text-transform: uppercase;
        font-weight: bold;
        border-radius: 0;
        padding: 13px 45px 12px 45px;
    }

    a.btn-white:hover{
      color: #000!important;
      background-color: #FFF!important;
    }

    .btn-ghost{
        color: #5a5f67!important;
        background-color: #fff;
        border: solid 2px #5a5f67;
        font-size: 16px;
        text-transform: uppercase;
        border-radius: 0;
        padding: 16px 40px 13px 40px;
        letter-spacing: 1px;
        font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
        white-space: normal;
    }
    .btn-ghost:hover{
        color: #fff!important;
        border: solid 2px #037ab7!important;
        background-color: #037ab7!important;
    }

    .btn-default.focus, .btn-default:focus {
      border-radius: 0;
  }


/* Global Form Elements
-------------------------------------------------- */

.input-group-addon {
  border: 1px solid #b5b5b5;
  color: #555;
  text-align: center;
  background-color: #fff;
  border-radius: 0;
}


















/*MODAL*/
.modal-dialog {
    width: 100vw;
    height: 100vh;
    margin: 0px;
}

.modal-content {
    border-radius: 0px 0px 0px 0px;
    min-height: 100%;
}

.modal-header {
    border: none;
}

    .modal-content .close {
        opacity: 1;
        font-size: 108px;
        font-weight: 100;
        margin-top: -31px;
        font-family: san;
    }


.modal-title {
    display:inline;
}


.fixed{
	position:fixed;
	width:100%;
	padding:0px;
	z-index:55;
	background-color:white;
}

.fixed-top{
	top:0px;
	left:0px;
    text-align: center;
}
  .fixed-top h2{
    margin-bottom: 0;
  }

.fixed-bottom{
	bottom:0px;
	left:0px;
}

.col-sm-2-5 {
    width:20.833333333333333333%;
    float:left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

@media only screen and (max-width: 767px) {
    .fixed-top {
		top:0px;
		left:0px;
	}

    .col-sm-2-5 {
        width:100%;
        float:none;
    }
}

@media only screen and (min-width: 767px) {
    #bottom-menu{
		max-height:auto;
		height:auto;
		max-width:auto;
		display:block;
	}
}







.btn {
    border-radius:0px 0px 0px 0px;
}

.vertical_center{
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}


<<<<<<< HEAD
=======
@media only screen and (min-width: 767px) {
    .height-sm-areapan {
        height:615px;
    }

    .height-sm-inspan {
        height:200px;
    }

}

>>>>>>> 2ea8883e178f2721168b3a3ffd5f5446cd7078c5
.pad-half {
    padding:7px;
}


.padded{
	padding:0.95cm;
}

.padded-12{
	padding:12px;
}

.padded-8{
	padding:8px;
}

.padded-30{
  padding: 30px;
}

.padded-33{
	padding:33px;
}



.height-80 {
    height: 80px;
}

.height-60{
  height: 60px;
}


.height-75 {
    height: 80px;
}


.vert-pad{
	padding-bottom:3%;
	padding-top:3%;
}


.vert-margin{
	margin-bottom:7px;
	margin-top:7px;
}






.body-content{
	top:80px;
	position:relative;
    min-height: calc(100vh - 100px);
}






.center-content{
	padding-left:50%;
	padding-right:50%;
	width:100%;
}


.center-div{
	margin: 0 auto;
	display:table;
}


.lr-pad-33{
	padding-left:33px;
	padding-right:33px;
}

.center-pad{
	padding-left:calc(50% - 300px);
    padding-right:calc(50% - 300px);
    width:100%;
}



.line-height {
    line-height: 55px;
}


#bottom-menu.in,
#bottom-menu.collapsing {
    display: block!important;
}

.bg-black{
	background-color:#1F1F1F;
	color:#E0E0E0;
	font-style:bold;
}


.white-text:hover{
	font-style:none;
}

hr{
	border-color:black;
}



.neutral_link{
	color:black;
}

.neutral_link:hover{
	text-decoration:none;
	color:black;
}

.neutral_link:focus{
	text-decoration:none;
	color:black;
}

.neutral_link_{
	color:white;
}

.neutral_link_:hover{
	text-decoration:none;
	color:white;
}

.neutral_link_:focus{
	text-decoration:none;
	color:white;
}



.plain_button {
    border:none;
    background:none;
    background-color:none;

}

.plain_button:hover {
    border:none;
    background:none;
    background-color:none;

}
.plain_button:focus {
    border:none;
    background:none;
    background-color:none;

}

/*** THE CHECK ON THE AREA **/
button {
    padding: 10px;
    border: 1px solid #b5b5b5;
}


.btn-check-label {
    width:58.33333333%;
    float:left;
}


.btn-check-image {
    width:calc(41.66666667% - 21px);
    float:left;
    padding-left:3px;
}

.custom_check>a:hover{
	text-decoration:none;
}


* {
    transition:all linear 0.25s;
}


.check-pan{
    border:3px solid #a0a0a0 ;
}

.checked .check-pan {
    background-color:#313234;
    border:3px solid #313234 ;
    color:#edeff3;
    min-height: 192px; /*to keep the box from re-sising*/
}

.check-pan:hover{
    border:3px solid #0379b7 ;
    color:#0379b7 ;
}


.checked .check-pan:hover{
    border:3px solid #313234 ;
    margin:0px;
    color:#edeff3;
}


.custom_check>a:focus{
	text-decoration:none;
}

.custom_check{
	border-radius:512px;
	text-align:center;
	background-size:100% 100%;
	width:105px;
	height:105px;
    font-size:1cm;
    margin:auto;
    margin-top: 23px;
    margin-bottom: 23px;
}

.check-quat{
	width:53px;
	height:53px;
    font-size:33px;
    margin-top:0px;
    margin-bottom:0px;
}






.hr {
    margin-top: 17px;
    margin-bottom: 33px;
    height: 4px;
    width: 120px;
    background-color: #bbc3c5;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
}






/** THE CHECK BOX **/
.custom_checkbox>a:hover{
	text-decoration:none;
}

.checkbox-pan{
	/*padding-top:12px;
	padding-bottom:12px;*/
    transition:none;
    border:2px solid #ffffff ;
}

.checked .checkbox-pan {
    border:2px solid #037ab7 ;
}


.checked>.checkbox-pan .lab {
    color:#037ab7;
}



.checkbox-pan:hover {
    border:2px solid #037ab7 ;
}


.checkbox-pan:hover .lab {
    color:#037ab7;
}


.custom_checkbox>a:focus{
	text-decoration:none;

}

.checked .custom_checkbox {
    background-color:#219c1b;
    border: 1px solid black;
}

.custom_checkbox{
	text-align:center;
	background-size:100% 100%;
  background-color:white;
  color:white;
	width:20px;
	height:20px;
	padding:0px;
  border: 1px solid #ccc;
}

.image-coll>img{
	width:16.6666%;
	display:block;
	float:left;
}


.image-coll{
	overflow:hidden;
}



.fixed-top.nav-calc{
	border-bottom: 3px outset rgba(3,3,3,0.3);
}

.fixed-bottom.nav-calc{
	border-top: 3px outset rgba(3,3,3,0.2);
}





.section-selection{
	font-size:13px;
  margin-top:3px;
}

.section-selection>a,
.section-selection span.process-bg{
	color:#1F1F1F;
}

.section-selection.active span.process-bg{
	  background: url("/media/1018/process-bg-rev.png") no-repeat center center;
    color: #1F1F1F;
}

.section-selection.active{
	border-top: 3px solid #1e2229;
  margin-top: 0px;
  background-color: #7d2437;
}

.section-selection>a:hover{
    text-decoration: none;
}


.section-selection.active a{
	color:#fff;
}

.section-selection.active>a:hover, .section-selection.active>a:focus{
	text-decoration:none;
}

.section-selection a.bold{
  color: #000;
}

.section-selection.active a.bold{
  color: #fff;
}


/*.cont-button > button {
    width:95%;
}*/



/*@media only screen and (min-width: 767px) {
    .cont-button {
        width:100%;
    }
}*/



.btn-rhombus{
	background-image: url(/Content/ees_calculator/hexagone-ees.svg);
	background-size: 100% 100%;
	width:128px;
	height:128px;
	border:none;
	position:relative;
	left:-64px;
	padding:10px;
	background-color:rgba(255,255,255,0);
}

.btn-rhombus:hover{
    filter: hue-rotate(167deg) contrast(156%) brightness(95%);
}

.labels {
    font-size:16px;
}

.fill-height {
   min-height:calc(100vh - 125px);
}


.fill-up {
   min-height:calc(100vh - 100px);
}


.your-home {
    min-height:649px;
}


@media only screen and (max-width: 767px) {
    .your-home {
        min-height:844px;
    }
}



/* COLOR PALLET */

.bg-white{
	background-color:white;
}

.bg-CP01{
    background-color: #d90b26;
}
.bg-CP02{
    background-color: #bae1f6;
}
.bg-CP03{
    background-color: #7ac5ef;
}
.bg-CP04{
    background-color: #19a3cb;
}
.bg-CP05{
    background-color: #7e2236;
}
.bg-CP06{
    background-color: #037ab7;
}
.bg-CP07{
    background-color: #000000;
}
.bg-CP08{
    background-color: #219c1b;
}
.bg-CP09{
    background-color: #1e2229;
}
.bg-CP10{
    background-color: #313234;
}
.bg-CP11{
    background-color: #5a5f67;
}
.bg-CP12{
    background-color: #d4e0e3;
}
.bg-CP13{
    background-color: #a0a0a0;
}
.bg-CP14{
    background-color: #edeff3;
}


.red-head {
    color:#5c2632;
}


.red-head-2 {
    color:#7D2236;
}


.text-CP01{
    color: #d90b26;
}
.text-CP02{
    color: #bae1f6;
}
.text-CP03{
    color: #7ac5ef;
}
.text-CP04{
    color: #19a3cb;
}
.text-CP05{
    color: #7e2236;
}
.text-CP06{
    color: #037ab7;
}
.text-CP07{
    color: #000000;
}
.text-CP08{
    color: #219c1b;
}
.text-CP09{
    color: #1e2229;
}
.text-CP10{
    color: #313234;
}
.text-CP11{
    color: #5a5f67;
}
.text-CP12{
    color: #d4e0e3;
}
.text-CP13{
    color: #a0a0a0;
}

.text-CP13:focus{
    color: #a0a0a0;
}
.text-CP14{
    color: #edeff3;
}

.text-white{
	color:#FFFFFF;
}

/* Find a Heat Pump Landing Page
-------------------------------------------------- */

.spacing{
	margin-top: 45px;
	margin-bottom: 45px;
}

.intro-para p{
  margin-bottom: 25px;
  color: #5a5f67;
  font-size: 16px;
  line-height: 26px;
}

.btn-rhombus a,
.btn-rhombus a:active,
.btn-rhombus a:link,
.btn-rhombus a:visited{
  color: #037ab7;
  text-decoration: underline;
}

.btn-rhombus h4{
  margin-top: 12px;
}

@media screen and (max-width: 767px){
  .nav-calc ul {
    text-align: center;
  }
}

.nav-calc span.process-bg{
  color: #fff;
  font-family: 'Roboto-Bold', Helvetica, Arial, sans-serif;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  margin-right: 5px;
  display: inline-block;
  vertical-align: middle;
  padding: 5px 12px;
  background: url(../imgs/process-bg.png) no-repeat center center;
}

  .nav-calc span.process-bg.muted{
    background: url(/media/1019/process-bg-gray.png) no-repeat center center;
  }

.cont-button .btn-white {
    padding: 10px 40px 8px 40px;
    margin-top: 10px;
    font-size: 12px;
    letter-spacing: 1px;
    font-family: 'Klavika-Bold', Helvetica, Arial, sans-serif;
    text-transform: uppercase;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
}

/*.nav-calc .process-bg::before{
  content: "";
  display: block;
  width: 30px;
  height: 25px;
  background: url("../imgs/process-bg.png") no-repeat center center;
}*/

/* Area to Heat/Cool
-------------------------------------------------- */

.nav-calc .btn-blue{
  /*padding: 13px 65px 10px 65px;
  margin-top: 1.8%;*/
  padding: 13px 45px 10px 45px;
  margin-top: 6px;
}

.nav-calc .section-selection a,
.nav-calc .section-selection span{
  font-family: 'Roboto-Bold', Helvetica, Arial, sans-serif;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.nav-calc .nav-square h5{
  margin-top: 11px;
  padding: 5px;
}

.nav-calc ul{
  margin-bottom: 0;
}

.nav-calc .list-inline>li{
  /*padding: 18px 5px 20px 5px;*/
  padding: 15px 20px;
  /*margin-right: 30px*/
}

.nav-calc .list-inline>li:last-child{
  margin-right: 0px
}

.white-column{
  padding: 25px;
  background-color: #fff;
  min-height: 484px;
  margin-bottom: 60px;
}

  .white-column h4{
    margin-top: 0;
  }

  .skel-pan {
      margin-bottom:24px;
  }

    .skel-pan:last-of-type {
        margin-bottom:0px;
    }

  .skel-pan .form-control{
    padding: 0;
  }


    @media screen and (max-width: 1200px) {
      .nav-calc .list-inline>li{
        margin-right: 0px;
        padding: 10px !important;
      }
      .nav-calc .btn-blue {
        padding: 10px 40px 8px 40px;
        font-size: 12px;
        margin-top: 6px;
      }
      .cont-button .btn-white {
          margin-top: 6px;
      }
    }

    @media screen and (max-width: 991px){
      .white-column{
        min-height: auto;
        margin-bottom: 25px;
      }
    }

    @media screen and (max-width: 767px){
      .nav-calc .nav-square{
        padding-top: 0px;
        padding-bottom: 10px;
      }
      .nav-calc .nav-square h5{
        margin-top: 10px;
        padding: 12px;
      }
      .nav-calc .btn-blue,
      .nav-calc .btn-white {
        margin-top: 8px;
        margin-bottom: 8px;
      }
      .nav-calc .list-inline>li {
        padding: 10px;
      }
      .nav-calc .mobile-menu{
        margin-top: 9px;
      }
    }

    @media screen and (max-width: 500px){
      .nav-calc .btn-white,
      .nav-calc .btn-blue {
        padding: 8px 25px 7px 25px;
        font-size: 10px;
      }
      .nav-calc .mobile-menu{
        margin-top: 9px;
      }
    }


/* Your Home
-------------------------------------------------- */

.home-specifics small{
  font-size: 12px;
  color: #5a5f67;
  line-height: 16px;
  margin-top: 5px;
}

.home-specifics .form-control input[type="text"]{
  padding: 10px 13px;
  height: auto;
}


/* Preferences
-------------------------------------------------- */

  .preferences h5{
    font-size: 15px;
    letter-spacing: 1px;
    color: #037ab7;
    margin-bottom: 20px;
  }

    .preferences.spacing{
      padding-bottom: 45px;
    }

    .preferences .style .row{
      margin: 0px;
    }

.preferences .style button{
  margin-bottom: 15px;
}
  .preferences .style button:last-of-type{
    margin-bottom: 0px;
  }

.preferences .features button{
  margin-bottom: 30px
}
  .preferences .features button:last-child{
    margin-bottom: 0px
  }

.preferences p{
  color: #5a5f67;
  font-size: 14px;
  font-family: 'Roboto-Regular', Helvetica, Arial, sans-serif;
}

  .preferences .custom_checkbox{
  	width: 30px;
  	height: 30px;
  }

  .preferences .labels {
    font-size: 18px;
    letter-spacing: -.5px;
}

  .preferences .btn-check-label {
    width: 56.3%;
  }


    /* Results / Recommendations
    -------------------------------------------------- */

    .rec-system{
      margin-bottom: 30px;
    }

    .rec-system{
      margin-bottom: 30px;
    }

    .rec-system img{
      margin-bottom: 15px;
    }

    .rec-system h3{
      margin-bottom: 0;
    }

    .rec-system h3:first-of-type {
      margin-bottom: 15px;
    }

    .rec-system h6{
      text-transform: uppercase;
      margin-bottom: 5px;
    }

    .rec-system p.gst{
      margin-bottom: 30px;
      font-size: 14px;
      color: #1e2229;
    }

    .summary a{
      font-size: 14px;
      color: #a0a0a0;
      text-transform: uppercase;
    }

    .next-step p{
      /*color: #1e2229;*/
      font-size: 14px;
      line-height: 21px;
    }

    .next-step input[type="text"],
    .next-step input[type="email"]{
      margin-bottom: 5px;
    }
      .next-step input[type="tel"]{
        margin-bottom: 0;
      }

  .next-step .updates{
    margin-top: 8px;
    margin-bottom: 10px;
  }

.next-step strong.labels{
  padding-top: 2px;
  padding-left: 10px;
}

.next-step{
  margin-bottom: 30px;
}

.next-step p.labels{
  margin-bottom: 0;
  font-family: 'Roboto-Bold', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  padding: 2px 0 0 6px;
}

      h5.red-head{
        text-transform: uppercase;
      }

    .major-brands{
      padding-top: 45px;
      padding-bottom: 45px;
    }

      .major-brands.spacing,
      .spacing.terms{
        margin-top: 0;
      }

  .major-brands hr.style1 {
    margin-top: 30px;
    margin-bottom: 30px;
}

.your-home .style1{
    margin-top: 30px;
    margin-bottom: 30px;
}

.form-control.check-pan {
    height:auto;
}

.has-error .form-shell {
    border-color: #a94442;
    background-color: rgba(169, 68, 68, .2);
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.why-choose p{
  color: #5a5f67;
  font-size: 14px;
  line-height: 21px;
  margin-bottom: 0;
}

.why-choose p strong{
  font-family: 'Roboto-Bold', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.next-step .form-control{
  height: auto;
  padding: 10px 13px;
}

.terms p:last-child{
  margin-bottom: 0;
}

@media and screen (max-width: 991px){
  .rec-system{
    margin-bottom: 30px;
  }
}

@media (max-width: 767px){
  .rec-system .option-1{
    margin-bottom: 30px;
  }
  .height-sm-inspan {
      min-height:184px;
  }
  .header-copy>div>p,
  .header-copy>div>h2{
    text-align: center !important;
  }
  .preferences .features{
    margin-bottom: 30px;
  }
  .header-copy img{
    width: 60px;
  }
  .spacing{
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
  .fixed-top.height-80{
    height: 60px;
  }
  .clickdform #clickdimensionsForm{
    width: 100% !important;
    overflow-x: hidden !important;
  }
  .clickdform .mainDiv{
    width: 100% !important;
    overflow-x: hidden !important;
  }
}

.clickdform #clickdimensionsForm{
  width: 100% !important;
  overflow-x: hidden !important;
}

.header-copy h2{
  padding-top: 20px;
}

li {
    font-family: 'Roboto-Light', Helvetica, Arial, sans-serif;
    color: #5a5f67;
}