.LandingPageTemplate{
	text-align: center;
	font-family: "museo-sans",Arial,Helvetica,sans-serif !important;

}

#blueSection {
	background-color: #2C78B3 !important;
	padding-bottom: 40px;
}

#blueSection .header{
	font-size: 40px;
	color: white;
	font-weight: 100 !important;
	background-color: #2C78B3 !important;

}

#blueSection img{
	padding-top: 40px;
	padding-bottom: 20px;
}

#blueSection .subTitle{
	font-size: 18px !important;
	color: #E3E3E3 !important;
	font-weight: 300 !important;

	max-width: 940px;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-bottom: 40px;

}

#blueSection .firstButton{
	background-color: #E6EAEA;
	color: #2C78B3;
	margin-right: 35px;	
}

.LandingPageTemplate button{
	font-weight: 700;
	font-size: 14px !important;
	cursor: pointer;
	width: 221px;
	height: 54px;
	border: none;
}



#blueSection .secondButton{
	color:white;
	border: 1px solid white;
	background-color: #2C78B3;
}

#whiteSection{
	background-color: white !important;
}

#whiteSection .header, #graySection .header, #subFooter .header{
	font-size: 23px; 
	color: #2C78B3;
	font-weight: 700 !important;
	margin: 40px 0px;

}

#whiteSection .header{ font-size: 20px;}

#whiteSection .subtitle{
	font-size: 18px; 
	color: #909090;
	font-weight: 300 !important;
	display: none;
	max-width: 940px;
	height:140px;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-bottom: 40px;
	
}

#whiteSubHeader{
	padding-bottom: 40px;
}



#whiteSection .active{
	display: block !important
}


#appExchangeBar{
	font-size: 18px; 
	color: white;
	background-color: #444444;
	font-weight: 100 !important;
	padding: 10px 0px;	
}

#appExchangeBar a{ 
	color: #EC3E3D;
	text-decoration: none;
	font-size: 18px;
}

#graySection{
	background-color: #333333 !important;
}

#graySection .header{
	background-color: #333333 !important;
	margin:0px 0px;
	padding-top: 40px;
	margin-bottom: 40px;
	font-size: 20px:;
	line-height:20px;
}

#graySection .headerUnder{
	font-size: 18px !important; 
	color: #CECCCC !important;
	font-weight: 700;
	padding-bottom: 20px;
	padding-top: 40px;
	line-height: 18px;
}

#graySection .subtitle{
	font-size: 18px !important; 
	color: #909090 !important;
	font-weight: 300;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 940px;
}

#graySection .buttonArea{
	margin-top: 35px;
	padding-bottom: 40px;
	width: 221px;
}

#graySection .firstButton{
	color: white;
	border: 1px solid white;
	background-color: #333333;
}

#subFooter{
	background-color: #D8D8D8 !important;
	text-align: center !important;
}

#subFooter .header{
	background-color: #D8D8D8 !important;
	padding-top: 40px;
	margin-top: 0px !important;
	font-size: 20px !important;
	line-height: 20px;
}

#subFooter .subtitle{
	color: white;
	font-size: 33px;
	line-height: 33px;
	font-weight: 100;

}

#subFooter .buttonArea{
	margin-top: 40px;
	padding-bottom: 40px; 
}

#subFooter a{
	color: white;
	border: 1px solid white;
	background-color: #D8D8D8;
}

#subFooter .firstButton{
	margin-right: 35px !important;
}

#subFooter .middleButton{
	margin: 0px 10%;
}

.circle{
	width:35px;
	height:35px;
	border-radius:50px;
	font-size:20px;
	color:#fff;
	line-height:100px;
	text-align:center;
	background:#ACC9E0;
	cursor: pointer;
	float: left;
	border: 2px solid #979797;
}

#scroll .active{
	background:#333333;
}



#scroll hr{
 	width: 177px;
	float: left;
	clear:none;
	margin-top: 20px;
	border: 1px solid #979797;

}

#circleSubtitles div{
	float: left;
	width: 184px;
	margin-bottom: 40px;
	margin-right: 25px;
	color: #9C9C9C;
	font-size: 18px;
}

#circleSubtitles .active{
	color: #666565;
	font-weight: 700 !important;
}

#circleScrollLeft, #circleScrollRight{
	display: none;
	cursor: pointer;
}

#circleSubtitles{
	margin-left: auto !important;
    margin-right: auto !important;
    width: 812px;
  	display: block;
}

#scroll{
	margin-left: auto !important;
    margin-right: auto !important;
    width: 697px;
  	display: block;
}

#scroll.scroll3{
    width: 488px;
}

.noPic{
	margin-bottom: 0px !important;
}


#circleSubtitles.scroll3 div{
	margin-right: 25px;
}

.lastTitle{
	margin-right: 0px !important;
}

.noButton{
	padding-bottom: 40px;
}


#circleSubtitles.scroll3{
	  width: 602px !important;
}

.buttonArea a{
	font-weight: 700;
	font-size: 14px !important;
	cursor: pointer;
	width: 221px;
	height: 54px;
	border: none;
	display: block;
	line-height: 54px;
	float: left;
}

.buttonArea{
	margin-left:auto;
	margin-right: auto;
	width: 480px;
}

#subFooter .buttonArea{
	width:740px;
}

#blueSection .oneButton{
	width: 221px !important;
}


textarea:focus, button:focus{
    outline: 0;
}

@media all and (max-width:1300px) {

	#blueSection{
		padding-bottom: 40px;
	}

	#blueSection .firstButton{
		/*margin-right: 0px;
		margin-bottom: 25px;
		margin-top: 15px;*/
	}

	#subFooter .firstButton{
		margin-right: 0px;
		margin-bottom: 31px;
	}

	#scroll{
		display:none;
	}

	#circleScrollLeft, #circleScrollRight{
		display: block;

	}

	#circleScrollLeft{
		margin-left: 10px;
		float: left;
	
	}

	#circleScrollRight{
		margin-right: 10px;
		float: right;
	}

	#circleSubtitles div{
		display:none;
		width: 100%;	
		margin-right: auto;	
	}

	#circleSubtitles div.active{
		display:block;
	}

	#whiteSection .subtitle{
		margin-top: 25px !important;
		height: auto !important;
	}

	#blueSection .subTitle{
		margin-right: 20px !important;
		margin-left: 20px !important;
		width: auto !important;
		max-width: 940px !important;
	}
/*
	#whiteSection .subtitle, #graySection .subtitle{
		margin-right: 20px !important;
		margin-left: 20px !important;
	}*/

	#circleSubtitles{
		margin-left: auto !important;
	    margin-right: auto !important;
	    width: 70% !important;
	}



}


@media all and (max-width:600px) {
	#subFooter .buttonArea{
		width:221px !important;
	}

	#blueSection .buttonArea a{
		margin-bottom: 35px;
	}

	.buttonArea{width:221px !important;}
}

@media all and (max-width:400px) {


	body.page-template-page-landing-php #header #top-bar ul#top-nav li a img{
		display:none;

	}

	html{
		margin-top: 0px !important;
	}

	#blueSection{
		padding-bottom: 40px;
	}

	#blueSection .firstButton{
		margin-right: 0px;
		margin-bottom: 25px;
		margin-top: 15px;
	}

	#subFooter .firstButton{
		margin-right: 0px;
		margin-bottom: 31px;
	}

	#scroll{
		display:none;
	}

	#circleScrollLeft, #circleScrollRight{
		display: block;

	}

	#circleScrollLeft{
		margin-left: 10px;
		float: left;
	
	}

	#circleScrollRight{
		margin-right: 10px;
		float: right;
	}

	#circleSubtitles div{
		display:none;
		width: auto;	
		margin-right: 0px;	
	}

	#circleSubtitles div.active{
		display:block;
	}

	#whiteSection .subtitle{
		margin-top: 25px !important;
		height: auto !important;
	}

	#blueSection .subTitle{
		margin-right: 20px !important;
		margin-left: 20px !important;
		width: auto !important;
		max-width: 940px !important;
	}

	#whiteSection .subtitle, #graySection .subtitle{
		margin-right: 20px !important;
		margin-left: 20px !important;
	}

	#circleSubtitles{
		margin-left: auto !important;
	    margin-right: auto !important;
	    width: 70% !important;
	}


	.buttonArea{width:400px !important;}

	#subFooter .buttonArea{
		width:400px !important;
	}

}