/* XS < 768 */
@media (max-width: 767px){
	.mg_navbar{
		height:inherit;
		border:0;
	}
	.mg_menuGroup{
		width: 100%;
		margin-top:0;
		margin-bottom:0;
		margin-left: auto;
		margin-right: auto;
		padding-left:15px;
		padding-right:15px;
	}
	.mg_menuLeft{
		margin-top:30px;
	}

	.mg_menuSpace{
		margin:0;
		padding:0;
		height:0;
	}

	.mg_menuBtn{
		width:100%;
		border-width: 0 0 0 3px;
	}

	.mg_menuBtnLink{
		text-align:left;
		padding:0 0 0 15px !important;
	}
	
	/*
	.mg_zoomImageBoxTextWrap{
		opacity: 1;
		height: 30%;
		bottom: 0px;
		top:initial;
	}
	*/

	.mg_zoomImageBoxText{
		font-size: 15px;
	}

	.mg_homeTitle{
		font-size: 30px;
	}

	.mg_fullLogoReplacement{
		display:block;
	}

	.mg_fullLogo{
		display:none;		
	}

	.mg_animSsf2LogoWrap{
		width: 340px;
		height: 187px;
	}

	.mg_animSsf2LogoBottom,.mg_animSsf2LogoTop{
		width: 340px;
	}

	.mg_animSsf2LogoFlames{
		top: 2px;
		left: 170px;
		width: 164px;
	}

	.mg_imageGrid{
		-webkit-column-count: 1;
		-webkit-column-gap: 5px;
		-moz-column-count: 1;
		-moz-column-gap: 5px;
		column-count: 1;
		column-gap: 5px;
	}
}

/* 768 <= SM < 992   */
@media (min-width: 768px) and (max-width: 991px) {
	.mg_logo{
		width: 80px;
		margin-top: 40px;
	}
	.mg_menuBtnLink{
		font-size: 15px;
	}

	.mg_homeTitle{
		font-size: 30px;
	}

	.mg_animSsf2LogoWrap{
		width: 340px;
		height: 187px;
	}

	.mg_animSsf2LogoBottom,.mg_animSsf2LogoTop{
		width: 340px;
	}

	.mg_animSsf2LogoFlames{
		top: 2px;
		left: 170px;
		width: 164px;
	}

	.mg_fullLogo{
		width:500px;		
	}
}

/* 992 <= MD < 1200*/
@media (min-width: 992px) and (max-width: 1199px) {
	.mg_logo{
		width: 100px;
		margin-top: 20px;
	}
	.mg_menuBtnLink{
		font-size: 20px;
	}
}

/* 1200 <= LG, basically default style