/* LD--------Large desktop */
@media (min-width: 1200px) {
	.mobile-visible {
		display: none;
	}

	.desktop-visible {
		display: block;
	}

	.container.main {
		padding-left: 30px;
		max-width: 1200px;
		padding-right: 30px;
	}

	.page-block .page-header {
		width: 60%;
	}

	.header .container, .footer .container {
		width: 1200px;
	}
}

/* RD--------Regular Desktop */
@media (min-width: 980px) and (max-width: 1199px) {
	.mobile-visible {
		display: none;
	}

	.desktop-visible {
		display: block;
	}

	.container.main {
		padding-top: 32px;
		padding-left: 30px;
		max-width: 920px;
		width: 920px;
		padding-right: 30px;
	}

	.header {
		position: static;
	}

	.header .container, .footer .container {
		width: 980px;
	}

	.page-block .page-header {
		width: 60%;
	}
}

/* PT--------Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	.mobile-visible {
		display: none;
	}

	.desktop-visible {
		display: block;
	}

	.container.main {
		padding-top: 32px;
		padding-left: 30px;
		width: auto;
		padding-right: 30px;
	}

	.header {
		position: static;
	}

	.header .container, .footer .container {
		padding: 0;
		width: 750px;
	}

	.header h4 {
		width: 148px;
		height: 29px;
		background-position: -131px -243px;
		background-size: 281%;
	}

	.header ul {		
		margin-top: 7px;
	}
	.etprogress-bar li{
		width :23%
	}	
	.header li.secure {
		background-position: -6px -3px;
		background-size: 21%;
	}

	.header li.call {
		padding-right: 25px;
		background-position: -10px 1px;
		background-size: 26%;
	}

	.header li.question {
		padding-right: 30px;
		background-position: 5px 7px;
  		background-size: 23%;		
	}

	.progress-bar li {
		width: 24.8%;
		font-size: 10px;
	}

	.page-block .page-header {
		width: 60%;
	}
	
	.step-four-col1 {
		width: 50%;
		float: left;
	}
	
	.step-four-col2 {
		width: 50%;
		float: left;
	}
	
	.step-four-col3 {
		width: 50%;
		float: left;
	}
		
}

/* LP--------Landscape phone to portrait tablet */
@media (min-width: 600px) and (max-width: 767px) {
	.mobile-visible {
		display: none;
	}

	.desktop-visible {
		display: block;
	}

	.container.main {
		box-sizing: border-box;
		padding-top: 32px;
		padding-left: 30px;
		padding-right: 30px;
		width: auto;
	}

	.header {
		position: static;
	}

	.header .container, .footer .container {
		padding-bottom: 3px;
		width: 92%;
	}

	.header h4 {
		width: 132px;
		height: 29px;
		background-position: -113px -211px;
		background-size: 274%;
	}

	/* .header ul {
		float: none;
	} */

	.header li.secure {
		padding-right: 28px;
		background-position: -6px -3px;
		background-size: 21%;
	}

	.header li.call {
		padding-right: 21px;
		background-position: -10px 1px;
		background-size: 25%;
	}
	
	.header li.question {
		padding-right: 28px;
		background-position: 5px 7px;
  		background-size: 23%;		
	}

	.progress-bar li {
		width: 24.8%;
		font-size: 8px;
	}

	.progress-bar li span {
		margin-left: 2px;
		padding-right: 9px;
		width: 18px;
		height: 27px;
		font-size: 15px;
		line-height: 26px;
	}

	.progress {
		display: none;
	}
	.etprogress-bar li {
		width: 24.8%;
		font-size: 8px;
	}
	.etprogress-bar li:first-child.navActive span {
		float: left;	 	
	}
	.etprogress-bar li:first-child.navActive{
		line-height:16px;
	}
	#vachat, #investment_footer{
		display: none;
	}
	.step-four-col1 {
		width: 50%;
		float: left;
	}
	
	.step-four-col2 {
		width: 50%;
		float: left;
	}
	
	.step-four-col3 {
		width: 50%;
		float: left;
	}

	.page-block .page-header {
		width: 60%;
	}

}

/* ST--------Small Tablet */
@media (min-width: 481px) and (max-width: 599px) {
	.mobile-visible {
		display: block;
	}

	.desktop-visible {
		display: none;
	}

	.container.main {
		box-sizing: border-box;
		padding: 20px 15px 50px 15px;
		width: auto;
	}

	.header {
		position: static;
	}

	.header .container {
		padding-bottom: 3px;
	}

	.header h4 {
		float: none;
		margin: 0;
		width: 164px;
		height: 29px;
		background-position: -140px -262px;
		background-size: 274%;
	}

	.header ul {
		float: right;
		margin: 5px -8px 0 0;
	}

	.header li {
		margin-right: 2px;
	}

	.header li.secure {
		margin: 0 0 0 10px;
		padding-right: 28px;
		background-position: -6px -3px;
		background-size: 20%;
	}

	.header li.call {
		padding-right: 21px;
		background-position: -10px 1px;
		background-size: 27%;
	}
	
	.header li.question {
		padding-right: 25px;
		background-position: 3px 7px;
  		background-size: 23%;		
	}

	.progress-bar {
		display: none;
	}
	
	.progress {
		display: block;
	}

	.page-block .page-header {
		margin-top: 20px;
		width: 100%;
	}
	
	.footer {
		box-sizing: border-box;
		padding-left: 4%;
		padding-right: 4%;
	}

	.footer ul.footer-icons {
		margin-right: 11%;
		width: 90%;
	}

	.footer ul.footer-icons li {
		margin-left: 6%;
		margin-bottom: 3%;
		width: 40%;
		float: none;
	}

	.form-container .intro a.change-account {
		float: none;
	}

	.form-container.step-four textarea.textBox, .form-container.step-two textarea.textBox {
		width: 78%;
	}

	.header .container, .footer .container {
		width: 90%;
	}
	.etprogress-bar {
		display: none;
	}	
	#vachat, #investment_footer{
		display: none;
	}
	.step-four-col1 {
		width: 90%;
		float: left;
	}
	
	.step-four-col2 {
		width: 90%;
		float: left;
	}
	
	.step-four-col3 {
		width: 90%;
		float: left;
	}
}

/* P---------Landscape phones and down */
@media (max-width: 480px) {
	.mobile-visible {
		display: block;
	}

	.desktop-visible {
		display: none;
	}

	.container.main {
		box-sizing: border-box;
		padding: 20px 15px 50px 15px;
		width: auto;
	}

	.header {
		position: static;
	}

	.header .container {
		padding-bottom: 3px;
	}

	.header h4 {
		margin: 0;
		width: 155px;
		height: 29px;
		background-position: -137px -252px;
		background-size: 281%;
	}

	.header ul {
		float: right;
		margin: 6px -14px 0 0;
	}

	.header li {
		margin-right: 2px;
	}

	.header li.secure {
		padding-right: 28px;
		background-position: 3px 3px;
		background-size: 17%;
		font-size: 9px;
	}

	.header li.call {
		padding-right: 21px;
		background-position: -3px 5px;
		background-size: 23%;
		font-size: 9px;
	}
	
	
	.header li.question {
		background-position: 12px 11px;
		background-size: 15% auto;
		padding-right: 31px;
	}

	.progress-bar {
		display: none;
	}
	
	.etprogress-bar {
		display: none;
	}

	.progress {
		display: block;
	}

	.page-block .page-header {
		margin-top: 20px;
		width: 100%;
	}
	
	.footer {
		box-sizing: border-box;
		padding-left: 4%;
		padding-right: 4%;
	}

	.footer ul.footer-icons li {
		margin-left: 6%;
		margin-bottom: 3%;
		width: 40%;
		float: none;
	}
	.page-block .page-header h2 {
		font-size:21px;
	}
	.page-block .page-header .grey-txt {
		font-size: 18px;
	}
	.header .container, .footer .container {
		width: 90%;
	}
	.step-one .form-container, .step-one-b .form-container, .form-container {
		width:90%;
	}
	.form-container  input[type="text"], .form-container  input[type="text"]{
		width: 77%;
	}
	.form-container  textarea.textBox, .form-container  textarea.textBox {
		width: 90%;
	}
	.form-container  input[type="text"].shortInput, .form-container  input[type="text"].shortInput {
		width: 54%;
	}
	#primaryAreaCode-error,#jointAreaCode-error{
	    width:auto;
	}
	#vachat, #investment_footer{
		display: none;
	}
	.step-four-col1 {
		width: 90%;
		float: left;
	}
	
	.step-four-col2 {
		width: 90%;
		float: left;
	}
	
	.step-four-col3 {
		width: 90%;
		float: left;
	}
}