@charset "UTF-8";

@font-face {
    font-family: 'sc_prosper_sansbold';
    src: url('../../assets/fonts/sc-prosper-sans-web/scprospersans-bold.woff2') format('woff2'),
         url('../../assets/fonts/sc-prosper-sans-web/scprospersans-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sc_prosper_sanslight';
    src: url('../../assets/fonts/sc-prosper-sans-web/scprospersans-light.woff2') format('woff2'),
         url('../../assets/fonts/sc-prosper-sans-web/scprospersans-light.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sc_prosper_sansmedium';
    src: url('../../assets/fonts/sc-prosper-sans-web/scprospersans-medium.woff2') format('woff2'),
         url('../../assets/fonts/sc-prosper-sans-web/scprospersans-medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sc_prosper_sansregular';
    src: url('../../assets/fonts/sc-prosper-sans-web/scprospersans-regular.woff2') format('woff2'),
         url('../../assets/fonts/sc-prosper-sans-web/scprospersans-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
/* CSS Document */
:root {
  --primary-text-color: #0473ea;
  --secondary-text-color: #38d200;
  --font: 'sc_prosper_sansregular', 'Helvetica Neue', 'Helvetica', 'Arial', 'Open Sans', 'Segoe UI', sans-serif;
}

*, *:before, *:after {
  margin:0;
  padding: 0;
  box-sizing: border-box;
}

body{ margin:0 ; padding: 0; font-family: var(--font);}
#main-page{ width: 100%; height: auto; overflow: hidden;}
.top{ width: 100%; height: auto; display: none;}
.top img{ width: 100%; height: auto; display: block;} 
header{ width: 80%; max-width: 1400px; height: auto; margin: 0 auto; padding: 10px; display: flex; justify-content:space-between}
header div:last-child { font-size: 16px; color: #525355; width: 40%; text-align: right;}
header div span { font-weight: 700; display: block; font-size: 22px; color: #0473ea;}
header div img{ width: 140px; height: auto}

.banner-holder{ background: url("../images/banner.jpg") no-repeat left #e5dbd9; background-size: auto 100%; padding:70px 10%; display: flex; justify-content: flex-end;}

.heading {width: 33%; height: auto;    top: 40%;   -webkit-transform: translate(0, 35%);
    transform: translate(0, 35%); margin-right: 25px;}
.heading h1{ font-size:42px; }
.heading h1:before {content: url('../../assets/images/trustpoint-blue.svg');
	display: inline-block;
	width: 25px;
	margin-right: 10px;
}
.heading h1:after {
    content: url('../../assets/images/trustpoint-green.svg');
	display: inline-block;
	width: 25px;
	margin-left: 10px;
}
.heading h2{ font-size:25px;}
.form-holder{width: 530px;background: #EFEFEF;border-radius: 20px;padding: 0 10px;height: 390px;flex-wrap: wrap;}
.form-holder .f-heading{ background: url("../images/form-header-bg.png") no-repeat top; background-size: auto 100%; height: 60px;}
.form-holder .f-heading span{ display: block; width: 70%; color: #0473ea; font-family: 'sc_prosper_sansregular', 'Helvetica', 'Arial', 'Open Sans', 'Segoe UI', sans-serif; font-size: 23px; margin: 0 auto; text-align: center; padding: 15px 0; text-transform: unset }

.form-holder .form-inner{width: 100%;top: 0;margin-top: 0;position: relative;height: 290px;}

/*.body-holder{ width: 100%; height: auto; margin: 0; max-width: 1200px; margin: 0 auto}*/
.body-holder{ width: 80%; height: auto; margin: 0; margin: 0 auto}
.body-holder-large{padding-top:40px;}
.tab_content h1 { color: #1879b7; border-bottom: 1px solid #1879b7; padding: 10px 0; font-size: 22px;}
.tab_content h2 { padding: 20px 0; font-size: 1.25em;}
.tab_content p { padding: 10px 0; font-size: 18px;}

.tab_content ul {margin: 0 0 10px -5px;padding: 0;list-style-type: none; font-size: 18px;}
.tab_content li { margin: 0; padding: 10px 0 0 20px; position: relative; }
.tab_content li:before { content: "▸"; margin: 0; padding: 0; position: absolute; left: 0; color: #0473ea; }


.terms{ width: 100%; height: auto;  padding: 0; max-width: 1200px; margin: 10px auto; text-align: center;}
.terms .tc{ font-size: 22px; margin-bottom: 20px }

.terms ul {margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: center;}
.terms li { width:20%; height: auto; padding: 20px; border: 1px solid #C7C7C7; margin: 10px; font-size: 14px; border-radius: 10px; }
.terms li p{ height: 50px; }
.terms li a{ margin-top:10px; border-bottom: 1px solid #00a546; color: #00a546; font-size: 14px; margin-top: 20px; display:inline-block}

footer{ background: #3d3d3d; padding: 20px 10px;margin-top: 40px; height: auto; font-size: 11px; color: #fff; text-align: center;}

.thankyou-msg {font-size: 20px;}
.thankyou-big {font-weight: 700; font-size: 25px}

/* The Modal (background) */
.modal_ty {
  display: none; /* Hidden by default */
 	position: fixed;
    width: 100%;
    /* max-width: 600px !important; */
    padding: 0 0 40px 0;
    text-align: justify;
    border-radius: 3px;
    background: #0202026b;
    padding: 10px !important;
    height: 100%;
    z-index: 999;
    top: 0;
}

/* Modal Content */
.modal-content_ty {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 32%;
  margin-top: 10%;
}

/* The Close Button */
.close_ty {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  bottom: 18px;
  position: relative;
}

.close_ty:hover,
.close_ty:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.thankyou-box {background: #00a640 !important; color: #FFF !important; box-shadow: 0 5px 14px 8px rgba(0,0,0,0.2) !important;}
.thankyou-box h4 {color: #fff;}

.tooltip{
  display: none;
  position: absolute;
  background: rgba(0,0,0,0.65);
  border-radius: 3px;
  box-sizing: border-box;
  color: #FFF;
  font-size: 12px;
  line-height: 1.35;
  max-width: 250px;
  padding: 4px 8px;
  z-index: 1030;
}


@media screen and (max-width: 768px) {
	header{ width: 100%; }
	header div img {width: 90px;}
	header div:last-child {
    font-size: 12px;
		width: 70%;}
	
	.banner-holder { display: block; background: url("../images/mobile-banner.png") no-repeat; background-size: 100% auto; padding: 20px 2px;}
	.heading { width: 60%; top:50%; webkit-transform: translate(0, 50%);
    transform: translate(0, 50%); display: block; float: right}
	

	
	.form-holder{  width: 550px; border: 1px solid #afafaf; margin: 280px auto 0 auto} 
	
	.form-holder .f-heading {background-size: 100% auto;}
	.form-holder .f-heading span {font-size: 15px;}
	
	.terms ul{ display: inline-block; text-align: center}
	.terms li{ width: 45%; display: inline-block}
	
}


@media screen and (max-width: 480px) {
  header{ width: 100%; }
	header div img {width: 90px;}
	header div:last-child {
    font-size: 12px;
		width: 70%;}
	
	.banner-holder { display: block; background: url("../images/mobile-banner.png") no-repeat; background-size: 100% auto; padding: 20px 2px;}
	.heading { width: 60%; top:0; webkit-transform: translate(0, 0);
    transform: translate(0, 0); display: block; float: right}
	
	.heading h1 {font-size: 22px;}
	.heading h2 {font-size: 18px;}
	
	
	.heading h1:before {width: 18px; margin-right: 10px;}
	.heading h1:after {width: 18px; margin-left: 10px;}
	
	.form-holder{ margin-top: 160px; width: 100%; border: 1px solid #afafaf;} 
	
	.form-holder .f-heading {background-size: 100% auto;}
	.form-holder .f-heading span {font-size: 15px;}
	
	.terms ul{ display: inline-block;}
	.terms li{ width: 95%;}
	#msform fieldset .vef input:nth-child(1) {width: 30%;border: 1px solid #00a546 !important;float: left;border-radius: 10px;}
    .form-holder{margin-top: 160px;width: 100%;border: 1px solid #afafaf;height: 450px;overflow: hidden;}
    #msform fieldset{height: 250px !important}
    #msform fieldset .vef{width: 88% !important}
}

.rad_ques{margin-bottom: 30px!important;}


