@font-face { font-family: 'HelveticaNeue'; src: url('../resources/fonts/HelveticaNeue.woff') format('woff'),url('../resources/fonts/HelveticaNeue.ttf') format('truetype'),url('../resources/fonts/HelveticaNeue.svg#HelveticaNeue') format('svg');font-weight: normal;font-style: normal;}
@font-face {
	font-family: 'Conv_Helvetica_Roman';
	src: url('../resources/fonts/Helvetica_Roman.eot');
	src: local('☺'), url('../resources/fonts/Helvetica_Roman.woff') format('woff'), url('../resources/fonts/Helvetica_Roman.ttf') format('truetype'), url('../resources/fonts/Helvetica_Roman.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_HelveticaCE';
	src: url('../resources/fonts/HelveticaCE.eot');
	src: local('☺'), url('../resources/fonts/HelveticaCE.woff') format('woff'), url('../resources/fonts/HelveticaCE.ttf') format('truetype'), url('../resources/fonts/HelveticaCE.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_HelveticaCE-Bold';
	src: url('../resources/fonts/HelveticaCE-Bold.eot');
	src: local('☺'), url('../resources/fonts/HelveticaCE-Bold.woff') format('woff'), url('../resources/fonts/HelveticaCE-Bold.ttf') format('truetype'), url('../resources/fonts/HelveticaCE-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_HELVETICA-MED';
	src: url('../resources/fonts/HELVETICA-MED.eot');
	src: local('☺'), url('../resources/fonts/HELVETICA-MED.woff') format('woff'), url('../resources/fonts/HELVETICA-MED.ttf') format('truetype'), url('../resources/fonts/HELVETICA-MED.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
html{ font-size:13px}
body{font-family: 'HelveticaNeue'; color:#444444}
.container{ width:1000px}
header {  padding: 154px 0 100px}
#mainNav{ padding: .2rem .5rem; background-color:#004a8f; border-bottom:1px solid #004a8f}
.banner{padding-top:2rem;padding-bottom:calc(5rem - 65px);-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover; display:block;background-position:center center;margin-top: 45px;}
.banner-home{padding-top: 0;}
.banner-home img{width: 100%}
.bannercontent h1{ color:#ffffff; font-size:2.5rem; margin-bottom:10px; position:relative; font-family: 'Conv_HelveticaCE';}
.bannercontent p.lead{ color:#ffffff; font-size:1.5rem}
.bannercontent .tablecont{ border:2px solid #fff; border-radius: 5px; color: #fff; width: 300px; padding: 5px 0px}
.bannercontent table td{ color: #fff; padding: 0px 10px}
.bannercontent table td.borderrr{ border-right: 2px solid #fff;}
.bannercontent table td big{ color: #fff; font-size: 1.3rem}

a.buthdfc{display:inline-block; text-align:center; border-radius:4px; color:#ffffff; background-color:#1e86ff; font-size:0.9rem;  box-shadow:0px 0px 5px rgba(0,0,0,0.15); text-transform:uppercase;font-family: 'Conv_HelveticaCE-Bold'; padding:.8rem 4rem; position: relative;overflow: hidden; border:none}
a.buthdfc::after {content: '';position: absolute;top: 50%;left: 50%;width: 5px;height: 5px;background: rgba(255, 255, 255, .5);opacity: 0;border-radius: 100%;transform: scale(1, 1) translate(-50%);transform-origin: 50% 50%;}
@keyframes ripple {
  0% {  transform: scale(0, 0);  opacity: 1;}
  20% {  transform: scale(25, 25);  opacity: 1;}
  100% {  opacity: 0;  transform: scale(40, 40);}
}

a.buthdfc:focus:not(:active)::after {animation: ripple 1s ease-out;}
.bg-footer{ background-color:#004a8f}
.bg-footer div p{ text-align:center; color:#d9dcdd; font-size:1rem}
section{ padding:1.5rem 0}
#benefit .item{ padding:5px}
.redbbx{ border-bottom:5px solid #ed1c24; border-radius:5px; box-shadow:0px 0px 5px rgba(0,0,0,0.2); padding:40px 20px 20px 20px;}
#benefits .redbbx{min-height: 285px;}
.redbbx:hover{box-shadow:0px 0px 5px rgba(0,0,0,0.5);}
.redbbx p{ font-size:1.25rem; line-height:1.5rem; padding-top:10px}
.redbbx img{ width:auto !important; display:inline-block !important}
.redbbx h4{font-family: 'Conv_HelveticaCE-Bold';}
.redbbx h3{ color:#004a8f; font-size:2.8rem}
#myth p{ line-height:1.4rem}
#myth p.fwmm{ line-height:1.4rem; font-family: 'Conv_HELVETICA-MED'; font-style:italic; color:#004a8f}
#myth p.redc{ line-height:1.4rem; color:#ed1c24; font-family: 'Conv_Helvetica_Roman';}
#myths{ margin:0px 2% 0px 2%; width:94%}
#howit .redbbx p { min-height:145px; margin-bottom:0; padding-left:15px; line-height:1.5rem}
#howit .redbbx h4{padding-left:15px}
#howit .item{ padding:5px}
.offerbx{ background:url(../resources/images/offerbg.png) no-repeat left top ; border-radius:10px; position:relative; padding:20px 20px 10px; z-index:0;background-size: cover;}
.offertxt{ color:#004a8f; opacity:0.1;font-family: 'Conv_HelveticaCE-Bold'; font-size:3.5rem; position:absolute; top:30%; left:0; z-index:1; display:none}
.offerbx p{ color:#555555; font-size:1.5rem;}
.toptxt{ display:flex; position:relative; z-index:2; margin-bottom:15px;min-height: 75px;}
.toptxt span{ margin-right:10px}
.toptxt .firsttxt{ color:#004a8f; font-size:3.5rem; text-shadow:0px 0px 5px rgba(0,0,0,0.2); font-family: 'Conv_HelveticaCE-Bold'; line-height:4.5rem;}
.toptxt .secondtext{ color:#004a8f; font-size:16px;  font-family: 'Conv_HELVETICA-MED'; line-height:1.5rem}
.borderbb span{ display:inline-block; height:5px; width:48px; background-color:#fff; margin-right:10px}
.txt-blue{ color:#004a8f}
#accordion{ padding-left:10px; padding-right:10px; border: 1px solid rgba(0,0,0,.125);border-radius: .25rem;}
#accordion .card { border:none; border-bottom: 1px solid #e4e6e4;}
#accordion .card-header{ background-color:#fff; border-bottom:none;}
#accordion .card-header .btn-link{ color:#333333; font-size:1.3rem;  display:block; width:100%; text-align:left; white-space: normal;}
#accordion .card-header .btn-link:hover, #accordion .card-header .btn-link:focus{ color:#333333; text-decoration:none}
#accordion .card-body{color:#666666; font-size:1.2rem; padding-left:2rem; padding-top:0;}
#accordion .card-header  button::before {float: right !important;font-family: 'Conv_HELVETICA-MED'; content:"-";font-size:1.4rem; color:#666666; width:20px; height:20px; border:2px solid #666666; border-radius:100%; text-align:center; line-height:13px}
#accordion .card-header  button.collapsed::before {float: right !important; content:"+"}
#accordion .card-header  button:hover, #accordion .card-header  button:active, #accordion .card-header  button:focus  {text-decoration:none}
.owl-theme .owl-nav{ position:absolute; width:100%; top:calc(50% - 12px); left:0;}
.owl-theme .owl-nav button{ position:absolute; width:14px; height:25px}
.owl-theme .owl-nav button:hover{ }
.owl-theme .owl-nav button:focus{ outline:none}
.owl-theme .owl-nav button span{ display:none}
.owl-theme .owl-nav button.owl-prev{ left:-20px; background:url(../resources/images/prev.png) no-repeat left center;}
.owl-theme .owl-nav button.owl-next{ right:-20px; background:url(../resources/images/next.png) no-repeat left center;}
#mainNav .navbar-nav .nav-item { padding-left:0.75rem; padding-right:0.75rem}
#mainNav .navbar-nav .nav-item .nav-link{font-family: 'HelveticaNeue'; color:#fff; font-size:1.1rem; padding-left:0; padding-right:0;}
#mainNav .navbar-nav .nav-item .nav-link.active{ border-bottom:1px solid #004a8f}
#mainNav button{color: #fff;}
.show-sm{ display:none}
.hide-sm{ display:block}
.mobnav{ background-color:#1e86ff; padding:0px 1.5rem}
.mobnav .navbar-nav .nav-item {padding-left:0.5rem; padding-right:0.5rem; border-bottom:1px solid #4fa0ff; position:relative}
.mobnav .navbar-nav .nav-item .nav-link{font-family: 'HelveticaNeue'; color:#ffffff; font-size:1.8rem; padding-left:0; padding-right:30px; font-weight:normal}
.mobnav .navbar-nav .nav-item .nav-link::after{ content:''; position:absolute; right:10px; top:calc(50% - 15px); background:url(../resources/images/downicon.png) no-repeat top left; width:25px; height:30px; }
.backbtn{ position:fixed; right:15px; bottom: 15px; margin-bottom:0; text-align:center; z-index:100; display:none}
.backbtn a{ margin-right:0;  background-color:#fff; width:35px; height:35px; border-radius:100%; border:1px solid #004a8f}
.backbtn a img{ -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg);  transform: rotate(90deg);}
.cardFlip .back{ display:none}

/*  */
#merchants .merchant_logo{border:1px solid #e1e1e1; border-radius: 5px; text-align: center; margin: 10px 0; padding: 17px 15px; box-shadow: 0 0 10px #e1e1e1;}
#merchants .merchant_logo.andMore{ display: table; width: 100%;}
#merchants .merchant_logo p{ font-size: 20px; height: 60px;display: table-cell; vertical-align: middle;}
.navbar-light .navbar-brand span{margin: 0 10px 0 12px; height: 33px; display: inline-block; vertical-align: middle; border-right: 1px solid #e1e1e1;}
.Cardtnc{float: right;padding-right: 10px;font-weight: bold;}
.Cardtnc a{color: #004a8f}
#cctncpop .modal-dialog .modal-header, #dctncpop .modal-dialog .modal-header{border-bottom: none;}
#cctncpop .modal-header, #dctncpop .modal-header{padding: 20px 30px 5px 30px;}
#cctncpop .modal-body, #dctncpop .modal-body{padding: 0 30px 20px 10px;}
#cctncpop ul.tncLi li, #tncpop ul.tncLi li ul li , #dctncpop ul.tncLi li, #dctncpop ul.tncLi li ol li{padding-bottom: 5px}
#cctncpop ul.tncLi li ul, #dctncpop ul.tncLi li ul, #dctncpop ul.tncLi li ol{padding-top: 5px;padding-left: 20px}
.offerbx .validDate{font-size: 12px;margin-top: -4px;}
.applycta{text-align: center;}
.applycta a{background: #1e86ff;color: #fff;padding: 10px 50px;font-size: 14px;border-radius: 5px;text-decoration: none;text-transform: uppercase;}
.mainbnr{position: relative;}
.applycta{position: absolute;left: 50%;bottom: 30px;right: auto;transform: translate(-50%, -50%)}
.videosect{padding-top: 20px;}
.videosect h2{margin-bottom: 20px;}
#video_carousel .play-video .play-icon {position: absolute;left: 50%;top: 40%;transform: translate(-50%,-50%);}
#video_carousel .item p.ctitl{margin: 5px 0 10px;font-size: 14px;}
#video_carousel .play-video{cursor: pointer;}
.looktap{font-size: 1.5rem;}
.hdfclogo{width: 180px}


@media only screen and (min-width: 1400px) {

}
@media only screen and (min-width: 1600px) {

}
/*ipad - both*/
@media (min-width: 768px) and (max-width: 1023px){
	.container{ width:100%}
} 
/*ipad - landscape*/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){

}
/*ipad - portrait*/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait), only screen and (min-width: 768px) and (max-width: 900px){

}
@media (min-width: 768px){
	.mobbbanner{display: none;}
	#cctncpop .modal-dialog, #dctncpop .modal-dialog{max-width: 700px;}
}
/*all mobiles & small tabs*/
@media (max-width: 767px){
	.cardFlip .back{ display:block}
	.cardFlip {position: relative;}
	.cardFlip .front,
	.cardFlip .back {position: absolute;left: 0;top: 0;}
	.cardFlip .mdl-card {width: 100%;height: 320px;}
	.cardFlip .avatar {position: absolute;right: 30px;top: 30px;border-radius: 50%;}
	.cardFlip .front .mdl-card__title,.cardFlip .back .mdl-card__title {color: #fff;}
	.cardFlip .front .mdl-card__title {background-color: rgb(244,67,54);}
	.cardFlip .back .mdl-card__title {background-color: rgb(63, 81, 181);}
	.cardFlip .mdl-button {transition: none !important;}	
	.container{ width:100%}
	.deskbanner{display: none;}
	#accordion .card-header{padding: .5rem 0rem .5rem .5rem;}
	#accordion .card-header .btn-link{    padding: .375rem 1.75rem .375rem 0rem;}
	#accordion .card-body{padding:0rem 3rem 1rem .5rem ;}
	#accordion .card-header button{ position:relative}
	#accordion .card-header button::before{ position:absolute; right:0; top:calc(50% - 10px)}
	.show-sm{ display:block}
	.hide-sm{ display:none}
	.bannercontent h1{ font-size:2rem}
	.navbar-toggler{padding: .25rem .5rem;}
	.navbar-toggler-icon{ width:2.2rem}
	.navbar-light .navbar-toggler{ font-size:0.9rem; color:#004f9f; cursor:pointer; border:none; text-align:center}
	.navbar-light .navbar-toggler-icon{ background:url(../resources/images/menu.png) no-repeat center center; margin-bottom:3px;display: block;}
	a.buthdfc{padding: .9rem 4rem .8rem 4rem ;}
	#benefit .owl-stage, #howit .owl-stage {right: 40px}
	#benefit .redbbx h4{ min-height:55px}
	a.btn-readmore{ display:block; margin:10px 0 0px 0px; font-size:1.1rem; color:#1e86ff !important; font-family: 'Conv_HelveticaCE-Bold';} 
	p.btn-readmore{ display:block; margin:10px 0 0px 0px; font-size:1.1rem; color:#1e86ff !important; font-family: 'Conv_HelveticaCE-Bold';} 
	p.btn-readmore i{ padding-left:15px}
	#howit .redbbx p{ min-height:95px}
	.redbbx{ padding:20px}
	#howit .redbbx p, #howit .redbbx h4{ padding-left:0}
	.offerbx p{ font-size:1.3rem}
	.offerbx{ margin-bottom:20px;width: 345px}
	.backbtn{display:none}
	#benefits .redbbx{ min-height:250px}
	#benefits .redbbx .back h4{ min-height:45px} 
	#how .redbbx{ min-height:275px}
	.applycta{top: 90%;}
}
@media (max-width: 580px){
	.banner-home>.container{width: 100%;padding: 0}
	.applycta a{padding: 10px 30px;}
	.offerbx{width: 100%;}
}


@media (max-width: 360px){
	.navbar-light .navbar-brand span{ margin: 0 2px;}
	.navbar-brand{margin-right: 0;}
}