/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126 License:none (public domain)*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	font:inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display:block;
}
body {
	line-height:1;
	margin:0;
	padding:0;
}
ol,ul {
	list-style:none;
}
blockquote,q {
	quotes:none;
}
blockquote:before,blockquote:after,q:before,q:after {
	content:'';
	content:none;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
@font-face {
	font-family:'SansumiRegular';
	src:url('Sansumi-Bold-webfont.eot');
	src:url('Sansumi-Bold-webfont.eot?#iefix') format('embedded-opentype'),url('Sansumi-Bold-webfont.woff') format('woff'),url('Sansumi-Bold-webfont.ttf') format('truetype'),url('Sansumi-Bold-webfont.svg#SansumiRegular') format('svg');
	font-weight:normal;
	font-style:normal;
}
@font-face {
	font-family:'SansumiExtraBoldRegular';
	src:url('Sansumi-ExtraBold-webfont.eot');
	src:url('Sansumi-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),url('Sansumi-ExtraBold-webfont.woff') format('woff'),url('Sansumi-ExtraBold-webfont.ttf') format('truetype'),url('Sansumi-ExtraBold-webfont.svg#SansumiExtraBoldRegular') format('svg');
	font-weight:normal;
	font-style: normal;
}
@blue:#00aeef;
@contentBackgroundColor:#1a1a1a;

html {
	height: 100%;
	width: 100%;
}

body {
	height: 100%;
	width: 100%;

	background: rgb(0,80,111); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMSUiIHN0b3AtY29sb3I9IiMwMDUwNmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIzMCUiIHN0b3AtY29sb3I9IiMwMDQxNTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMWEyZTMxIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-radial-gradient(center, ellipse cover,  rgba(0,80,111,1) 1%, rgba(0,65,88,1) 30%, rgba(26,46,49,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(1%,rgba(0,80,111,1)), color-stop(30%,rgba(0,65,88,1)), color-stop(100%,rgba(26,46,49,1))); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,80,111,1) 1%,rgba(0,65,88,1) 30%,rgba(26,46,49,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  rgba(0,80,111,1) 1%,rgba(0,65,88,1) 30%,rgba(26,46,49,1) 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  rgba(0,80,111,1) 1%,rgba(0,65,88,1) 30%,rgba(26,46,49,1) 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  rgba(0,80,111,1) 1%,rgba(0,65,88,1) 30%,rgba(26,46,49,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00506f', endColorstr='#1a2e31',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

	overflow: hidden;

}

.fadeIn {
	animation: bokehIn ease-in-out 1.5s;
	animation-iteration-count: 1;
	transform-origin: 50% 50%;
	-webkit-animation: bokehIn ease-in-out 1.5s;
	-webkit-animation-iteration-count: 1;
	-webkit-transform-origin: 50% 50%;
	-moz-animation: bokehIn ease-in-out 1.5s;
	-moz-animation-iteration-count: 1;
	-moz-transform-origin: 50% 50%;
	-o-animation: bokehIn ease-in-out 1.5s;
	-o-animation-iteration-count: 1;
	-o-transform-origin: 50% 50%;
	-ms-animation: bokehIn ease-in-out 1.5s;
	-ms-animation-iteration-count: 1;
	-ms-transform-origin: 50% 50%;
}



.wrapper {
	width: 100%;
	height: 100%;

	.overlay-gradient {
		width: 100%;
		height: 100%;

		position: absolute;

		.bokeh { 
			position:absolute; 
			z-index:-1; 

			animation: bokehAmbient ease-in-out 3s;
			animation-iteration-count: infinite;
			transform-origin: 50% 50%;
			-webkit-animation: bokehAmbient ease-in-out 3s;
			-webkit-animation-iteration-count: infinite;
			-webkit-transform-origin: 50% 50%;
			-moz-animation: bokehAmbient ease-in-out 3s;
			-moz-animation-iteration-count: infinite;
			-moz-transform-origin: 50% 50%;
			-ms-animation: bokehAmbient ease-in-out 3s;
			-ms-animation-iteration-count: infinite;
			-ms-transform-origin: 50% 50%;
		}

		opacity: .1;
	}

	.social-wrapper {
		position: absolute;
		right: 20px;
		top: 50%;
		margin-top: -91px;
		width: 85px;

		animation: slideInSocial ease-in-out 1.5s;
		animation-iteration-count: 1;
		transform-origin: 50% 50%;
		-webkit-animation: slideInSocial ease-in-out 1.5s;
		-webkit-animation-iteration-count: 1;
		-webkit-transform-origin: 50% 50%;
		-moz-animation-iteration-count: 1;
		-moz-transform-origin: 50% 50%;
		-o-animation: slideInSocial ease-in-out 1.5s;
		-o-animation-iteration-count: 1;
		-o-transform-origin: 50% 50%;
		-ms-animation: slideInSocial ease-in-out 1.5s;
		-ms-animation-iteration-count: 1;
		-ms-transform-origin: 50% 50%;

		a {
			display: block;
			float: right;	
			margin-bottom: 20px;

			&:last-child {
				margin-bottom: 0;
			}
		}
	}

	.content-wrapper {

		.logo-section-inactive {
			top: 37% !important;
		}

		.logo-section-wrapper {
			transition: top .5s;
			-webkit-transition: top .5s; /* Safari */
			width: 100%;
			height: 254px;

			border-top: 3px solid #193b46;

			background-color: #0b2835;

		    /* Fallback for web browsers that don't support RGBa */
		    background-color: rgb(11, 40, 53);
		    /* RGBa with 0.6 opacity */
		    background-color: rgba(11, 40, 53, 0.3);
		    /* For IE 8*/
		    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99114053, endColorstr=#99114053)";


			position: absolute;

			top: 50%;
			margin-top: -124px;

			.logo-section-text {
				width: 548px;
				margin: 0 auto;
				padding: 18px 22px;

				display: none;

				position: relative;
				top: 15px;

				border-top: 3px solid #193b46;

				background-color: #0b2835;

			    /* Fallback for web browsers that don't support RGBa */
			    background-color: rgb(11, 40, 53);
			    /* RGBa with 0.6 opacity */
			    background-color: rgba(11, 40, 53, 0.3);
			    /* For IE 8*/
			    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99114053, endColorstr=#99114053)";

				p {
					color: #d0d2d2;
					font-size: 16px;
					text-align: justify;

					font-family: "Verdana", sans-serif;
					line-height: 1.5em;

					a {
						color: #00aced;
						text-decoration: none;
					}
				}
			}

			.logo-section {
				width: 592px;
				margin: 0 auto;
				padding-top: 24px;
				position: relative;

				animation: slideIn ease-in-out 1s;
				animation-iteration-count: 1;
				transform-origin: 50% 50%;
				-webkit-animation: slideIn ease-in-out 1s;
				-webkit-animation-iteration-count: 1;
				-webkit-transform-origin: 50% 50%;
				-moz-animation: slideIn ease-in-out 1s;
				-moz-animation-iteration-count: 1;
				-moz-transform-origin: 50% 50%;
				-o-animation: slideIn ease-in-out 1s;
				-o-animation-iteration-count: 1;
				-o-transform-origin: 50% 50%;
				-ms-animation: slideIn ease-in-out 1s;
				-ms-animation-iteration-count: 1;
				-ms-transform-origin: 50% 50%;

				.logo-content {
					width: 434px;

					position: relative;
					left: 104px;
					top: -9px;

					#more-control {
						float: right;
						position: relative;
						right: 42px;
					}

					hr {
						margin-bottom: 9px;
						border-top: 2px solid #383738; 
						border-bottom: 1px solid #6d6c6d;
						border-left: none;
						border-right: none;
					}

					p {
						color: #d0d2d2;
						font-size: 22px;

						font-family: "Verdana", sans-serif;
						line-height: 33px;

						a {
							color: #00aced;
							text-decoration: none;
						}
					}
				}
			}
		}

	}

	.box-bottom {
		position: absolute;
		bottom: -3px;
		left: 50%;
		margin-left: -210px;

		animation: animationFrames ease 1s;
		animation-iteration-count: 1;
		transform-origin: 50% 50%;
		-webkit-animation: animationFrames ease 1s;
		-webkit-animation-iteration-count: 1;
		-webkit-transform-origin: 50% 50%;
		-moz-animation: animationFrames ease 1s;
		-moz-animation-iteration-count: 1;
		-moz-transform-origin: 50% 50%;
		-o-animation: animationFrames ease 1s;
		-o-animation-iteration-count: 1;
		-o-transform-origin: 50% 50%;
		-ms-animation: animationFrames ease 1s;
		-ms-animation-iteration-count: 1;
		-ms-transform-origin: 50% 50%;
	}
}

@media screen and (max-width: 810px) {
	.social-wrapper {
		display: none;
	}
}