@import url("reset.css");

html, body{height:100%; width:100%; }
img{vertical-align: top;   }
strong{font-weight:900;}
em{font-style:italic;}	
td{vertical-align:top;}
.clear{float:none; clear:both;}
p{margin-top:15px;}
p:first-child{margin-top:0px;}

.table{display:table}
.tr{display:table-row}
.td{display:table-cell}

input, textarea{
	color: #000;
	font-family: 'Brandon Grotesque', sans-serif;
	}
	
body{
	color: #000;
	font-family: 'Brandon Grotesque', sans-serif;
	background-color: #fff;
	}

a{
	color: #000;
	}

.noscroll{
	overflow:hidden;
	}

.header_bg{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&1+54,0+100 */
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(0,0,0,1) 54%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 54%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,1) 54%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
	position:fixed;
	width:50%;
	height:100px;
	left:0px;
	top:0px;
	z-index: 9;
	opacity:0.5;
}
.loading{
	position:fixed;
	width:100%;
	height:100%;
	left:0px;
	top:0px;
	background-color:#FFF;
	z-index:1001;
	opacity: 1;
	}	
	
.loading img{
	width:20px;
	height:20px;
	position:absolute;
	top:0px;
	right:0px;
	bottom:0px;
	left:0px;
	margin:auto;}	

	
	
.scrollin{
	
	-webkit-transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s,  opacity 0.9s ease 0s; 
    transition: transform 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s,  opacity 0.9s ease 0s; 
	}
	
.scrollin1{
	-ms-transform: translateY(20px) translateX(0px) translateZ(0px) scale(1); /* IE 9 */
    -webkit-transform: translateY(20px) translateX(0px) translateZ(0px) scale(1); /* Safari */
    transform: translateY(20px) translateX(0px) translateZ(0px) scale(1);
	opacity:0;
	}	
	
.scrollin1.startani{
	-ms-transform: translateY(0px) translateX(0px) translateZ(0px) scale(1); /* IE 9 */
    -webkit-transform: translateY(0px) translateX(0px) translateZ(0px) scale(1); /* Safari */
    transform: translateY(0px) translateX(0px) translateZ(0px) scale(1);
	opacity:1;
	}
	
.scrollin2{
	-ms-transform: translateY(50px) translateX(0px) translateZ(0px) scale(1); /* IE 9 */
    -webkit-transform: translateY(50px) translateX(0px) translateZ(0px) scale(1); /* Safari */
    transform: translateY(50px) translateX(0px) translateZ(0px) scale(1);
	opacity:0;
	}	
	
.scrollin2.startani{
	-ms-transform: translateY(0px) translateX(0px) translateZ(0px) scale(1); /* IE 9 */
    -webkit-transform: translateY(0px) translateX(0px) translateZ(0px) scale(1); /* Safari */
    transform: translateY(0px) translateX(0px) translateZ(0px) scale(1);
	opacity:1;
	}	
	

.scrollin3{
	opacity:0;
	}	
	
.scrollin3.onscreen{
	opacity:1;
	}	
	

/* content */


.bg{
	position: fixed;
    top: 0px;
    right: 50%;
    bottom: 0px;
    left: 0px;
	margin: auto;
	opacity:1;
	background-image: url(images/bg.jpg);
	background-size: cover;
	background-position: center center;
}

.content_wrapper{
	position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 50%;
	margin: auto;
	z-index: 1;
}



.content_wrapper table{
	width:100%;
	height:100%;
}



.content_wrapper table td{
	text-align: center;
	vertical-align: middle;
}


.content_wrapper table tr+tr td{
	vertical-align: bottom;
	padding-bottom: 45px;
}

.content_wrapper table tr+tr td+td{
	vertical-align: top;
}
.content_wrapper table td{
	
	padding-top: 90px;
	padding-bottom: 90px;
}

.left_top_logo{
	width:85%;
	z-index: 20;
	border-bottom: none !important;
	display: block;
	margin: auto;
}

.left_top_logo img{
	width:100%;
}

.share_btn_wrapper{
	position: fixed;
	top:30px;
	right:30px;
	z-index: 10;
}

.share_btn{
	display: inline-block;
	margin-left: 10px;
}

.share_btn img{
	width:20px;
}


.top_logo{
	width:60%;
	display: block;
	margin: auto;
	max-width: 900px;
}
	
.top_logo img{
	width:100%;
}


.text_wrapper{
	position: relative;
	margin: auto;
	margin-top: 30px;
	width:80%;
}

.center_text{
	text-align:center;
	}	
	
.float_right{
	float:right;
	}	

.title1{
	font-size: 16px;
	line-height: 1.4em;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 0.3em;
}


.title2{
	width:90%;
	font-size: 16px;
	line-height: 1.4em;
	color: #000;
	margin-left: auto;
	margin-right: auto;
	letter-spacing: 0.02em;
	font-style: italic;
}

hr{
	background: none;
	border:none;
	border-top:1px solid #000;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
}

.text1{
	font-size: 16px;
	line-height: 1.4em;
	color: #000;
}


.text2{
	margin-top: 20px;
	font-size: 16px;
	line-height: 1.4em;
	color: #000;
}

.text2 em{
	font-size: 16px;
}

.text2 td{
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 90px;
	padding-right: 90px;
	border-left:1px solid #000;
}

.text2 td+td{
	border-right:1px solid #000;
}

.text3{
	font-size: 16px;
	line-height: 1.4em;
	position: relative;
	margin-top: 60px;
	font-style: italic;
}

.text_wrapper a{
	color: #000;
	border-bottom:1px solid #000;
	display: inline-block;
}

.thumb{
	width:100%;
}

/* mobile */
.mobile_show{
	display:none;
	}
	

@media screen and (max-width: 1599px) { 
	
	
.share_btn img {
    width: 20px;
}
	
}


@media screen and (max-width: 1439px) { 
	
.share_btn img {
    width: 20px;
}	
	

}


@media screen and (max-width: 1279px) { 

.text_wrapper{
	width:80%;
}
}

@media screen and (max-width: 1023px) { 
	.header_bg{
		opacity:0;
		width:100%;
	}
.left_top_logo{
}	
	
.share_btn_wrapper{
	position: absolute;
	top:20px;
	right:15px;
	z-index: 10;
}	

.share_btn {
    margin-left: 6px;
}
	
.share_btn img {
    width: 16px;
}
	
.top_logo{
	width:70%;
}

.bg{
	right:0px
}
	

.content_wrapper{
	left:0px
}	
	
.content_wrapper table td {
	padding-top: 20px;
	padding-bottom: 40px;
}	
	
.bg{
	position: fixed;
	opacity:0.3
}
	
.text_wrapper{
	width:90%;
}
	

.text2 td{
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	border-left:none;
	display: block;
	border-top:1px solid #fff;
}
	
	.text2 td +td{
	border-right:none;
	border-bottom:1px solid #fff;
	}	
	
.title1{
	font-size: 14px;
	line-height: 1.4em;
}


.title2{
	font-size: 14px;
	line-height: 1.4em;
	width:auto;
}	
	
.text1{
	font-size: 14px;
	line-height: 1.4em;
}
	
.text2{
	font-size: 14px;
	line-height: 1.4em;
}
.text3{
	font-size: 14px;
	line-height: 1.4em;
	margin-top: 40px;
}
	
/* mobile */
.mobile_hide{
	display:none;
	}
	
.mobile_show{
	display:block;
	}	
	
}

@media screen and (max-width: 640px) { 

.top_logo{
	width:100%;
}
}


@media screen and (max-width: 480px) { 


/* mobile */

.mobile_hide2{
	display:none;
	}
	
.mobile_show2{
	display:block;
	}	

}