/*
Theme Name: Polaris Wealthfront Press Theme
Theme URI: http: //press.wealthfront.com
Description: This is a custom child theme of Wealthfront
Author: Sari Karplus DiLoreto
Author URI: http: //doublesecretagency.com
Template: polarispages
Version: 0.1
*/
.page-content a { color: #3D6DDF; }
.page-content a:hover { color: #1b44a5; }
.header-title { 
	text-align: center; 
	color: #161338;
	padding-bottom: 40px;
}
.header-title a { color: #161338; }
.header-title a:hover { color: #3D6DDF; }
.header-title h1 { font: 900 45px/55px "Glosa Display", serif; margin-bottom: 0; }
.header-title p { font: 20px/26px "Calibre Regular", Helvetica, Arial, Sans-serif; margin-bottom: 40px; margin-top: 34px;}
.header-title p a { text-decoration: underline; }
.header-title .button { 
	font: 18px/22px "Calibre Medium", sans-serif;
}
.button { 
	font-size: 16px; 
	border: 1px solid #161338; 
	color: #161338; 
	background-color: transparent; 
	margin: 30px auto 10px; 
	text-transform: uppercase; 
	border-radius: 0px; 
	padding: 11px 36px 10px 17px; 
	background: url(images/arrow-right.png) 93% center / 14px no-repeat; 
	-webkit-transition:background-position .1s ease-in;  
    -moz-transition:background-position .1s ease-in;  
    -o-transition:background-position .1s ease-in;  
    transition:background-position .1s ease-in; 
}
.button:hover{background-position: 95% center; }

.page-content {
    max-width: 1128px;
    width: 90%;
}
.page-content hr { border:0; border-top: 1px solid #E1E2E6; }

.main-content { padding: 0 20px 40px; }
.hide-items { 
	max-height: 0; 	
	overflow-y: hidden;
	transition: 1s cubic-bezier(0, 1, 0.5, 1);
	transform: translateY(0);
}
.hide-items.open { height: auto; max-height: 1000px; transform: translateY(0%); }
.view-all { font: 18px/23px "Calibre Regular", Helvetica, Arial, Sans-serif; display: block;}
.view-all.open { display: none; }
.page-content .columns h2 {
	font: 600 24px/28px "Calibre Regular", Helvetica, Arial, Sans-serif;
	color: #161338;
}
.main-content .columns h2 { border-top: 3px solid #4840BB; padding: 15px 0px; }
.main-content .columns img { margin: 12px 0px 5px; max-height: 24px; width: auto;}
.main-content .item a { font: 18px/22px "Calibre Medium", sans-serif; }
.columns { margin-top: 50px; }
.page-content .columns p {font: 18px/23px "Calibre Regular", Helvetica, Arial, Sans-serif; margin: 10px 0px 30px; }
.page-content .main-content .columns p { color: #888796;}
.sub-footer h1 { font: 900 40px/46px "Glosa Display", serif; }


@media screen and (min-width: 768px) {
	body { background: #F2F2F3; height: auto; }
	header.header { background: none;}
	header.header .header-inner .logo a {
		display: block;
		width: 42px;
		height: 42px;
		background: url(images/wealthfront-logo-purple.svg) 0 0 / 100% auto no-repeat;
	}
	header.header .header-inner .logo img { display: none; }
	header.header .header-inner .header-menu > ul > li a, header.header .header-inner .header-menu > ul > li button {
		font-family: "Calibre Regular", Helvetica, Arial, Sans-serif !important;
		color: #161338 !important;
	}
	header.header .header-inner .header-menu > ul > li a:hover { color: #161338 !important; border-color: #4840bb !important; }
	header.header .user-nav a.login { 
		border-color: #4840bb; 
		background: transparent; 
		color: #4840bb; 
	}
	header.header .user-nav a.invest-now-btn,header.header .user-nav a.login:hover,header.header .user-nav a.invest-now-btn:hover {
	   background-color: #4840bb;
	   border-color: #4840bb;
	   color: #fff !important;
    }
	.header-title {
		padding: 0;
	}
	.page-content {
		padding: 50px 90px;
		background: #FFFFFF;
		border: 1px solid #E1E2E6;
		box-shadow: 0 2px 10px 0 rgba(0,0,0,0.12);
		margin-bottom: 50px;
	}
	.columns {
		margin-top: 75px;
		max-width: 413px;
		display: block;
		float: left;
		width: 45%;
	}
	.col2 {
		float: right;
	}
	.clearfix{ clear: both; }
	.sub-footer .columns {
		width: 22%;
		float: left;
		margin-top: 65px;
	}
	.sub-footer .col1 {
		width: 34%;
	}
	.sub-footer h1 { max-width: 250px;}
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
	.page-content { padding: 80px 35px 35px !important; }
	.sub-footer h1 { max-width: 100%;}
	.sub-footer .columns {
		width: 33%;	
	}	
	.sub-footer .col1 {
		width: 100%;
		float: none;
		max-width: 100%;
	}
	.sub-footer .col2 {
		width: 35%;
	}
	.sub-footer .col3{
		width: 	32%;
	}
	
}

@media screen and (min-width: 1200px) {
	#page-wrapper { padding-top: 60px !important; }
	.page-content { padding-top: 100px !important; padding-bottom: 70px !important; }
}