/*
 * ------------------------------------------------------------------
 *  Responsive
 * ------------------------------------------------------------------
 * lg: 1200 -
 * md: - 1200
 * sm: - 992
 * xs: - 768
 * xxs: - 480
 */

/* response_status */
.response_status, .response_status:after { 
	position: fixed; display: none; z-index: 10000; 
}
.response_status:after { 
	top: 60px; 
	left: 0px; 
	padding: 15px; 
	font-size: 24px; 
	color: #FFF; 
	background-color: orange;
}

/*
 * ------------------------------------------------------------------
 *  LG
 * ------------------------------------------------------------------
 */
@media screen and (min-width: 1400px) {
    
	/* response_status */
	.response_status:after { content: "LG"; }

	body { background: #FFF url(../img/bg-lg.png) 0 40px repeat; }

}

/*
 * ------------------------------------------------------------------
 *  MD
 * ------------------------------------------------------------------
 */
@media screen and (max-width: 1400px) {

	/* response_status */
	.response_status:after { content: "MD"; }

	body { background: #FFF url(../img/bg-md.png) 0 40px repeat; }
	.vertical-center > .row { padding: 45px 30px; }
	.main-container h1 { font-size: 21px; line-height: 21px; }
	.main-container h2 { 
		margin-bottom: 20px; font-size: 15px; line-height: 21px; 
	}
	.address-wrapper { padding-top: 15px; }
}

/*
 * ------------------------------------------------------------------
 *  SM
 * ------------------------------------------------------------------
 */
@media screen and (max-width: 992px) {
    
	/* response_status */
	.response_status:after { content: "SM"; }

	.vertical-center > .row {
		margin-top: 100px; margin-bottom: 100px;
	}
	.address-wrapper { padding-top: 30px; }
	.main-container .panel { margin-top: 30px; }
	
}

/*
 * ------------------------------------------------------------------
 *  XS
 * ------------------------------------------------------------------
 */
@media screen and (max-width: 768px) {
    
	/* response_status */
	.response_status:after { content: "XS"; }

}

/*
 * ------------------------------------------------------------------
 *  XXS
 * ------------------------------------------------------------------
 */
@media only screen and (max-width : 480px) {
    
	/* response_status */
	.response_status:after { content: "XXS"; }
	
	.vertical-center > .row {
		margin-top: 100px; margin-bottom: 100px;
	}
	
}