/*
--------------------
WARNING!
Copyright Progress Systems Limited.
Explicit permission is required to copy or use any documents from this website
--------------------
*/

/*LOANS PAGE ---------------------------------------------------------------------------------------------- */


#contentareaWrapperOuter {
	max-width:100%;
}

.pagetitle {
	max-width:1200px;
	margin:auto;
	float:none;
}

#submenu, 
#sidebar {
	display:none;
}

#contentarea {
	width:100%;
	float:none;
}

h1 {
	font-family: 'Oswald',sans-serif;
    font-size: 2.1em;
    font-weight: normal;
    margin: auto auto 25px;
    max-width: 1200px;
    text-transform: uppercase;
    width: 100%;
	color: #758690;
	line-height:1.3em;
}


/* OPENING DIV /INTRODUCTORY PARAGRAPH OR A QUOTE + IMAGE ------------------------------------------------------- */

#introDiv {
	background: #f7fbfc none repeat scroll 0 0;
    border-left: 30px solid #e6eef1;
    float: none;
    margin: 50px auto;
    max-width: 1200px;
    position: relative;
    width: 100%;
}

#intro {
	padding:20px 70px 20px 40px;
	width:73%;
	display:inline-block;
	vertical-align:top;
}

#introText {
	position:relative;
	font-size:15px;
}

#intro h2 {
	border-bottom: medium none;
    font-family: 'Oswald',sans-serif;
    font-size: 1.9em;
    font-weight: normal;
    margin-bottom: 5px;
    margin-top: 0;
    padding-bottom: 30px;
    position: relative;
    text-transform: uppercase;
}

#intro h2::after {
		background: #4e5156;
    	bottom: 0;
    	content: "";
    	height: 1px;
    	left: 0;
    	margin: auto auto auto 0;
    	position: absolute;
    	right: 0;
    	top: 45px;
    	width: 125px;
}

#intro p {
	font-size: 1.1em;
    line-height: 1.5em;
    margin-bottom: 30px;
}
#intro.insuranceDivIntro p {
	line-height: 1.4;
	margin-bottom: 10px;
}

ul#insuranceList {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

ul#insuranceList> li {
	padding: 0;
}

#intro a, 
#action_call a {
	background-color: #4c5ac0;
    font-size: 1em;
    padding: 10px 20px;
	color:white;
	font-weight: 600;
    text-align: center;
    text-transform: uppercase;
	border-radius: 2px; -webkit-border-radius:2px; -khtml-border-radius: 2px; -moz-border-radius: 2px;
	
	/*EASING EFFECT*/
	-webkit-transition: all .3s ease-out 0s;
	-moz-transition: all .3s ease-out 0s;
	-o-transition: all .3s ease-out 0s;
	transition: all .3s ease-out 0s;
}

#intro a:hover, 
#action_call a:hover {
	background-color: #5766d9;
}

#intro.insuranceDivIntro a {
	background-color: none;
	background: url(../../templates/current/images/insurance_link_chevron.svg) no-repeat left center/auto 10px;
	padding: 0;
	padding-left:14px;
	color: #4c5ac0;
	font-size: 1.06em;
	line-height: 1.4;
	text-align: left;
	text-transform: none;
}
#intro.insuranceDivIntro a:hover {
	background-color: none;
	background: url(../../templates/current/images/insurance_link_chevronB.svg) no-repeat left center/auto 10px;
	color: #ff8e01;
}

#introImg {
	width:27%;
	background:#e6eef1;
	height:100%;
	display:inline-block;
	vertical-align: top;
}

#introImg img {
	border-bottom: 20px solid #f7fbfc;
    border-right: 20px solid white;
    position: relative;
    top: -30px;
	left:-30px;
	width:100%;
}

#loansWrapperOuter {
	width:100%;
	clear:both;
}

.insuranceh1 {
	font-size: 1.9em;
}

#loansWrapper {
	background:#e6eef1;
	padding: 30px 0;
}

#loans {
	max-width:1200px;
	width:100%;
	margin:auto;
}
#loans.insurance ul{
    margin-top: 0;
    margin-left: 20px;
}

/* BOX TEXT STYLES -------------------------------------------------------------------------------------- */

#loans .boxText {
	padding-left:125px;
}

#loans.insurance .boxText {
	padding-left: 0;
	padding-bottom: 20px;
}

#loans h2 {
	border-bottom: medium none;
    font-family: 'Oswald',sans-serif;
    font-size: 1.9em;
    font-weight: normal;
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 0;
    position: relative;
    text-transform: uppercase;
}
#loans.insurance h2 {
    font-size: 1.7em;
}

#loans h3 {
	font-size:1.2em;
	font-weight:normal;
}

#loans.insurance h4 {
	border-bottom: medium none;
    font-family: 'Oswald',sans-serif;
    font-size: 1.3em;
    font-weight: normal;
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 0;
    position: relative;
    text-transform: uppercase;
}

#loans ul  {
	margin-top: 20px;
    margin-left: 190px;
}


/* LOAN BOXES ------------------------------------------------------------------------------------------- */

#box1, 
#box2, 
#box3 {
	width:100%;
	margin-bottom:30px;
	padding:20px;	
}

#loans #box1 {
	background: white url(../../templates/current/images/loans_box1.svg) no-repeat scroll left top;
	border-bottom:18px solid #abd157;
}


#loans #box2 {
	background: white url(../../templates/current/images/loans_box2.svg) no-repeat scroll left top;	
	border-bottom:18px solid #01BFF3;
}

#loans #box3 {
	background: white url(../../templates/current/images/loans_box3.svg) no-repeat scroll left top;
	border-bottom:18px solid #F16E52;	
	margin-bottom:0; /*This neeeds to be added to the last loan box in the stack*/
}

#loans.insurance #box1,
#loans.insurance #box2,
#loans.insurance #box3 {
	background: #ffffff;
}
#loans.insurance #box1 {
	border-top:18px solid #7E8EFF;
	border-bottom:18px solid #7E8EFF;
}
#loans.insurance #box2 {
	border-top:18px solid #abd157;	
	border-bottom:18px solid #abd157;
}

/* BOTTOM BANNER ---------------------------------------------------------------------------------- */

#bottom_banner {
	background:#fcdc72 url(../../templates/current/images/bottom_banner_icon.svg) no-repeat scroll 50px center;
	width:100%;
	padding:20px 0 20px 20px;
	max-width:1200px;
	margin:auto;
	margin-top:30px;
}

.bottom_bannerText {
	display: inline-block;
    padding: 5px 20px 0 170px;
    vertical-align: top;
    width: 80%;
}

.bottom_bannerText h2 {
	border-bottom: medium none;
    margin-top: 10px;
    text-transform: uppercase;
	font-size:1.4em;
}

.bottom_bannerText p {
	font-size:1.1em;
	line-height:1.4em;
}

.bottom_bannerText .amount {
    font-size: 1.3em;
    font-weight: 700;
}


/* BOTTOM BANNER ACTION BUTTON*/

#action_call {
    display: inline-block;
    vertical-align: top;
    width: 20%;
	padding-bottom:10px;
	border-left: 1px dashed rgba(78, 81, 86, .5);
	text-align:center;
}

#action_call img {
	display: block;
    margin: auto auto 20px;
}










/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/


/* -------------------------------------------------- MEDIA QUERIES ------------------------------------------*/










@media only screen and ( max-width: 64em ) /* 1024 */ {

#introImg {background:none;}

#introImg img {border: medium none; left: 0; top: 0;}

#introDiv {padding: 15px 15px 15px 0;}

}


@media only screen and ( max-width: 61.25em ) /* 980 */ {
	
#loansWrapper {background:none; padding:0;}

#box1, #box2, #box3 {background-color:#EFF1F6;}

}


@media only screen and ( max-width: 50em ) /* 800 */ {
	
#bottom_banner {background-image:none; padding:20px;}

.bottom_bannerText {padding:0;}

#action_call {border-left: none;}	
	
}


@media only screen and ( max-width: 48em ) /* 768 */ {
	
#introImg {display:none;}

#intro {padding: 0px 20px 20px 40px; width: 100%;}

.bottom_bannerText {width:100%; text-align:center;}

#action_call { width:100% ;margin-top:10px;}

#action_call img {margin-bottom:30px;}

}


@media only screen and ( max-width: 45em ) /* 720 */ {
	
#action_call {width:100%;}	

}


@media only screen and ( max-width: 40em ) /* 640 */ {	
		
}


@media only screen and ( max-width: 37.5em ) /* 600 */ {
	
}


@media only screen and ( max-width: 35.5em ) /* 568 */ {
	
}


@media only screen and ( max-width: 32.5em ) /* 520 */ {

}


@media only screen and ( max-width: 30em ) /* 480 */ {
	
}

@media only screen and ( max-width: 26.6875em ) /* 427 */ {

#loans ul {margin-left:10px; margin-top:90px;}

#loans .boxText {font-size: 15px;}

}

@media only screen and ( max-width: 25em ) /* 400 */ {
	
#introDiv {padding:20px 20px 30px; text-align:center; border-top:30px solid #fed36a; border-left:0;}

#intro {padding:0px;}

#intro h2::after {margin:auto;}

#contentPage.services_loans h1 {text-align:center;}

#box1, #box2, #box3 {background-size:100px auto;}

#loans .boxText {padding-left: 105px;}

#loans ul {margin-top: 20px;}
	
}


@media only screen and ( max-width: 22.5em ) /* 360 */ {
	
#contentPage.services_loans h1 {font-size:1.8em;}

}


@media only screen and ( max-width: 20em ) /* 320 */ {

}