*, *:before, *:after {
	box-sizing:border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing:border-box;
}
a { outline:none;cursor:pointer; }
html {background-color: #B9026A;}  

.bgWrap {padding-top:40px;padding-bottom:40px;height: 100%}
.bgWrap, .bgWrapOuter { position:relative;float:left;width:100%; }
.bgWrap > div, .bgWrap > div > div { position:relative;width:100%;max-width:996px; }
.bgWrap > div { margin:0 auto; width:96%; }
.bgWrap > div > div { float:left; }

body {
	color:#316b89;
	font:14px/25px 'Roboto';
}

.light {
	margin-top: 16px;
}

.light > a {
	color: rgba(255,255,255,0.4);
}

.light > a:hover {
	color: rgba(255,255,255,0.6);
}

.bgWrap > div > div > .main { float:left;width:100%; padding-left: 24px; padding-right: 24px; padding-bottom: 24px;margin-bottom: 36px; background: rgba(255,255,255,0.8); margin-top: calc(50% - 430px); }
.bgWrap > div > div > .main > .left { float:left;width:70% }/*632px;*/
.bgWrap > div > div > .main > .left h1 { margin-top:36px;width:595px;font:800 34px/38px 'Roboto';color:#B9026A;border-left:8px solid #B9026A;padding-left:24px; text-transform: uppercase;}
.bgWrap > div > div > .main > .left h1 + p { display:block;padding-left:32px;font:16px/25px 'Roboto';color:#316b89;margin-top:25px; }
.bgWrap > div > div > .main > .left h2 { margin-top:25px;font:22px/25px 'Roboto';color:#B9026A;border-left:4px solid #B9026A;padding-left:28px; }
.bgWrap > div > div > .main > .left p { display:block;padding-left:32px;font:16px/25px 'Roboto';color:#316b89;margin-top:25px; }



.bgWrap > div > div > .main > .right { width:30%;float:right; }/*295px;*/
.bgWrap > div > div > .main .logo { margin-top: 36px; margin-left:40px; float:right;}
.bgWrap > div > div > .main .logo > img { float: right; max-width:100%;max-height:100%; }
.bgWrap > div > div > .main > .right span {display: block;}
.bgWrap > div > div > .main > .right a {display: block;}

.bgWrap > div > div > .main .logo + div {  }
.bgWrap > div > div > .main .logo + div + div { margin-top:32px;font-weight:800;font-size:16px;color:#B9026A; }
.bgWrap > div > div > .main .left div.small-screen {display:none;}
.bgWrap > div > div > .main .logo + div + div a, .bgWrap > div > div > .main .left div.small-screen a { font-size: 16px; color:#2db7b0;text-decoration:none; }
.bgWrap > div > div > .main .logo + div + div a:hover, .bgWrap > div > div > .main .left div.small-screen a:hover { color: #00888b; }
.bgWrap > div > div > .main .logo ~ div { text-align:right;font:300 15px/26px 'Roboto';color:#353535;float:right;clear:both; margin-top: 44px;}

a { color: #2db7b0; text-decoration: none; font-weight: 700; cursor:pointer;}
a:hover { color: #00888b;}


@media screen and (max-width:1024px){
	.bgWrap > div > div > .main { float:left;width:100%; padding-left: 24px; padding-right: 24px; padding-bottom: 24px; background: rgba(255,255,255,0.8); margin-top: calc(50% - 300px); }
	.bgWrap > div > div > .main > .left {width:100%;}
	.bgWrap > div > div > .main > .right {width:100%;}
	.bgWrap > div > div > .main > .right > div {
		float:left;
		clear:none;
		margin-top:30px;
	}

	.bgWrap > div > div > .main > .right > .logo {
		width: 70%;
		margin-top: 32px;
		margin-left: 0;
	}

	.bgWrap > div > div > .main > .right > .info {width: 30%;}
}


@media screen and (max-width:720px){
	.bgWrap > div > div > .main > .left h1 { margin-top:36px;width:100%;font:800 34px/38px 'Roboto';color:#B9026A;border-left:8px solid #B9026A;padding-left:24px; }

}

@media screen and (max-width:670px){
	.bgWrap > div > div > .main .logo + div + div a {
		font-size:14px;
	}

	.bgWrap > div > div > .main > .right > .logo {width: 100%;}

	.bgWrap > div > div > .main > .right > .info {
		width: 100%;
		text-align: left;
		margin-top: 0;
		padding-left: 32px;
	}

	.bgWrap > div > div > .main > .right > .info .light {
		text-align: right;
		width: 50%;
		display: inline-block;
		float: right;
		margin: 0;
	}

	.bgWrap > div > div > .main > .right > .info .reg {
		width: 50%;
		display: inline-block;
		float: left;
	}
}

@media screen and (max-width:560px){
	.bgWrap > div > div > .main { margin-top:0;}
	.bgWrap > div > div > .main > .right > div + div + div {
		display:none;
	}
	.bgWrap > div > div > .main .left div.small-screen {
		display:block;
		float:left;
		margin:9px 0 0 32px;
	}

	.bgWrap > div > div > .main .left div.small-screen a{
		float:left;
		display: block;
		width: 100%;
	}

	.bgWrap > div > div > .main .left div.small-screen a.light{
		color: rgba(255,255,255,0.4);
	}
}

img{
	max-width:100%;
}