:before,:after {

	-moz-box-sizing: border-box;

	-webkit-box-sizing: border-box;

	box-sizing: border-box

}



* {

	margin: 0;

	padding: 0;

	border: 0;

	outline: none

}



[class*="fi-"] {

	display: inline;

	width: auto;

	height: auto;

	line-height: inherit;

	vertical-align: baseline;

	background-image: none;

	background-position: 0 0;

	background-repeat: repeat

}



[class*="fi-"]:before {

	font-weight: 400;

	font-style: normal;

	text-decoration: inherit

}



html {

	height: 100%;

	left: 0;

}



body {

	height: 100%;

	box-sizing: border-box;

	min-height: 100%;

	min-width: 100%;

	position: relative;

	z-index: 1;

	margin: 0;

	padding: 0;

	overflow: hidden;

}

body, .preloader {

	background-color: #111111;

}

input:-webkit-autofill {

	-webkit-box-shadow: 0 0 0 50px #292b2c inset;

	-webkit-text-fill-color: #fff

}



input:-webkit-autofill:focus {

	-webkit-box-shadow: 0 0 0 50px #48494a inset;

	-webkit-text-fill-color: #fff

}



body > #wrapper {

	height: 100%;

	min-height: 100%;

	width: 100%;

	display: inline-block

}



body > .main-container {

	height: 100%;

	min-height: 100%;

	min-width: 100%;

	transition: all .6s ease-in-out;

	-webkit-transition: all .6s ease-in-out;

	-moz-transition: all .6s ease-in-out;

	-o-transition: all .6s ease-in-out;

	z-index: 0;

	overflow: hidden;

	position: initial!important;

	overflow-y: auto;



}

body > .main-container:after{

	content: "";

	display: block;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	background-color: #fff;

	opacity: 0.4;

	z-index: -1;

	position: absolute;

}



body > .login-form-container {

	background: none repeat scroll 0 0 rgba(0,0,0,0.8);

	display: none;

	height: 100%;

	min-height: 100%;

	min-width: 308px;

	max-width: 308px;

	width: 100%;

	position: fixed;

	right: -308px;

	top: 0;

	z-index: 0;

	transition: all .6s ease-in-out;

	-webkit-transition: all .6s ease-in-out;

	-moz-transition: all .6s ease-in-out;

	-o-transition: all .6s ease-in-out;

	z-index: 999;

	outline: 1px solid transparent

}



body.open-login-form > .login-form-container {

	right: 0

}



body.open-login-form > .main-container {

	-webkit-perspective: 1000px;

	perspective: 1000px;

	-ms-transform-origin: 0 50%;

	-o-transform-origin: 0 50%;

	-moz-transform-origin: 0 50%;

	-webkit-transform-origin: 0 50%;

	transform-origin: 0 50%;

	-ms-transform: perspective(1920px) rotate3d(0,1,0,9deg);

	-webkit-transform: perspective(1920px) rotate3d(0,1,0,9deg);

	transform: perspective(1920px) rotate3d(0,1,0,9deg);

	-webkit-backface-visibility: hidden;

	-moz-backface-visibility: hidden;

	-ms-backface-visibility: hidden;

	backface-visibility: hidden;

	overflow: hidden;

}



.btn-open-login-form {

	background: none repeat scroll 0 0 rgba(0,0,0,0.8);

	font-size: 36px;

	left: -54px;

	width:54px;

	padding-top: 6px;

	padding-bottom: 6px;

	position: absolute;

	display: inline-block;

	top: 23%;

	-webkit-border-top-left-radius: 4px;

	-webkit-border-bottom-left-radius: 4px;

	-moz-border-radius-topleft: 4px;

	-moz-border-radius-bottomleft: 4px;

	border-top-left-radius: 4px;

	border-bottom-left-radius: 4px;

	cursor: pointer;

	text-align: center;

}

#btn-sound {

	margin-top: 60px;

	display: none;

}





body.error .btn-open-login-form {

	color: red

}

.btn-open-login-form i:before,

.btn-open-login-form.sound i {

	transition: all 0.3s linear;

}

.btn-open-login-form:hover i:before,

.btn-open-login-form.sound:hover i {

	-webkit-transform: scale(1.05);

	-moz-transform: scale(1.05);

	-ms-transform: scale(1.05);

	-o-transform: scale(1.05);

	transform: scale(1.05);

	opacity: 0.8;

}

.center {

	clear: both;

	content: "";

	display: block;

	margin: 0 auto;

	max-width: 1020px;

	width: 100%;

	padding: 0 10px;

	box-sizing: border-box;

	text-align: center

}



.logotype {

	max-width: 100%

}



#wrapper {

	width: 100%;

	height: calc(100% - 90px);

	position: relative;

	display: inline-block

}



header {

	position: relative;

	display: inline-block;

	width: 100%

}



.site-content {

	position: relative;

	display: inline-block;

	width: 100%;

	left: 0;

	top: 0;

	color: #fff

}



.site-content .font-center {

	text-align: center

}



.site-content h2,.site-content h3 {

	width: 100%;

	display: block

}



.site-content h2.heading {

	font-size: 45px;

	font-weight: lighter

}



.site-content .description h3 {

	font-size: 28px;

	font-weight: lighter;

	text-align: center

}



.site-content .description p {

	font-size: 14px;

	margin: 0;

	line-height: normal

}



.site-content .description ul,.site-content .description ol {

	margin: 5px 0

}



.site-content .description p {

	margin-bottom: 10px

}



.site-content .description blockquote {

	font-size: 18px;

	font-style: italic;

	margin: .25em 0;

	padding: 1.5em 40px 0;

	line-height: 1.45;

	position: relative;

	text-align: left;

	display: block

}



.site-content .description blockquote:before {

	display: block;

	font-family: Georgia,serif;

	content: "\201C";

	font-size: 80px;

	position: absolute;

	left: -5px;

	top: -5px;

	opacity: .85

}



.site-content .description blockquote cite {

	font-size: 14px;

	display: block;

	margin-top: 5px;

	opacity: .85

}



.site-content .description blockquote cite:before {

	content: "\2014 \2009"

}



.site-content p {

	font-size: 16px;

	margin: 0 0 15px;

	line-height: 24px

}



footer {

	position: relative;

	top: 0;

	display: inline-block;

	width: 100%;

	color: #fff;

	margin: 25px 0 20px;

}



footer .center {

	padding: 0

}



.company-name {

	width: 100%;

	display: block;

	text-decoration: none;

	font-family: inherit;

	font-weight: 700;

	color: inherit;

	font-size: 16px;

	text-align: center;

	margin: 20px 0

}



.logo,.logo-retina {

	font-family: inherit;

	font-weight: 400;

	text-decoration: none;

	margin-left: auto;

	margin-right: auto;

	display: block

}



.logo-box {

	padding: 50px 0 30px

}

.logo-box img {

	max-width: 100%;

}



@media only screen and (min-width: 200px) and (max-width: 670px) {

  div.logo-box > img {

    display: block;

    width: 100%;

    height: auto;

  }

}



.logo.istext {

	max-width: 100%;

	padding: 30px 60px

}



.site-title {

	font-family: inherit;

	font-weight: lighter;

	text-align: center;

	padding: 0 0 20px;

	vertical-align: middle

}



.login-form {

	display: inline-block;

	margin: 25px 0 0;

	padding: 20px;

	filter: alpha(opacity=50);

	-moz-opacity: .5;

	-khtml-opacity: .5;

	opacity: .5;

	-webkit-transition: opacity .3s ease-in-out;

	-moz-transition: opacity .3s ease-in-out;

	-ms-transition: opacity .3s ease-in-out;

	-o-transition: opacity .3s ease-in-out;

	transition: opacity .3s ease-in-out

}



.login-form input[type="text"],.login-form input[type="password"] {

	color: inherit;

	background-color: rgba(113,113,113,0.6);

	background-position: 14px center;

	background-repeat: no-repeat;

	float: left;

	font-family: inherit;

	font-size: 20px;

	font-weight: 400;

	margin: 0 0 10px;

	padding: 5px 16px 5px 40px;

	width: 100%;

	display: block;

	line-height: 28px;

	outline: none;

	max-width: 210px

}



.ie8 .login-form input[type="text"],.ie8 .login-form input[type="password"],.ie7 .login-form input[type="text"],.ie7 .login-form input[type="password"] {

	background-color: #717171

}



.login-form .licon,.login-form .picon {

	position: relative;

	display: inline-block

}



.ie7 .login-form .licon,.ie7 .login-form .picon {

	margin: 8px 0 0

}



.login-form .licon:before,.login-form .picon:before {

	position: absolute;

	font-weight: 400;

	font-style: normal;

	font-size: 24px;

	color: inherit;

	display: inline-block;

	top: 7px;

	left: 12px

}



.login-form .licon:before {

	content: "\f1fe";

	font-family: "foundation-icons"

}



.login-form .picon:before {

	content: "\f16a";

	font-family: "foundation-icons"

}



.login-form .licon.error:before,.login-form .picon.error:before {

	content: "\f217";

	font-family: "foundation-icons";

	color: red

}



.login-form a.lost-pass {

	float: left;

	display: inline-block;

	text-decoration: none

}



.login-form a.lost-pass:hover {

	text-decoration: underline

}



.login-form label {

	color: inherit;

	float: left;

	font-family: inherit;

	font-size: 25px;

	padding: 0 0 10px;

	width: 100%

}



.login-form input[type="submit"] {

	color: inherit;

	font-size: 20px;

	font-family: inherit;

	background: none;

	cursor: pointer;

	border: 2px solid #fff;

	font-weight: bold;

	margin: 10px 0 0;

	padding: 5px 10px;

	text-align: center;

	float: right;

	display: inline-block

}



input[type="submit"] {

	border: 2px solid #fff;

	padding: 5px 10px;

	font-weight: 700;

	margin: 10px 0 0;

	color: inherit;

	font-size: 20px;

	font-family: inherit;

	background: none;

	cursor: pointer;

	transition: all 0.3s linear;

}

input[type="submit"]:hover{

	background-color: rgba(255, 255, 255, .7);

	color: #222;

}



.login-form:hover {

	filter: alpha(opacity=100);

	-moz-opacity: 1;

	-khtml-opacity: 1;

	opacity: 1

}



.preloader {

	display: block;

	height: 100%;

	position: absolute;

	width: 100%;

	z-index: 99999991

}



.preloader i, .preloader img {

	font-size: 56px;

	background: none repeat scroll 0 0 rgba(0,0,0,0);

	display: inline-block;

	left: 50%;

	top: 50%;

	-ms-transform: translate(-50%, -50%);

	-o-transform: translate(-50%, -50%);

	-webkit-transform: translate(-50%, -50%);

	-moz-transform: translate(-50%, -50%);

	transform: translate(-50%, -50%);

	/*margin: -25px 0 0 -25px;*/

	position: absolute;

	color: inherit;

	-webkit-animation-name: spin;

	-webkit-animation-duration: 2200ms;

	-webkit-animation-iteration-count: infinite;

	-webkit-animation-timing-function: linear;

	-moz-animation-name: spin;

	-moz-animation-duration: 2200ms;

	-moz-animation-iteration-count: infinite;

	-moz-animation-timing-function: linear;

	-ms-animation-name: spin;

	-ms-animation-duration: 2200ms;

	-ms-animation-iteration-count: infinite;

	-ms-animation-timing-function: linear;

	animation-name: spin;

	animation-duration: 2200ms;

	animation-iteration-count: infinite;

	animation-timing-function: linear

}



.site-title, .preloader i, .login-form, .login-form a.lost-pass, .btn-open-login-form, .site-content, .user-content-wrapper, .user-content, footer, .maintenance a{

	color: #ffffff;

}

@-ms-keyframes spin {

	from {

		-ms-transform: translate(-50%, -50%) rotate(0deg)

	}



	to {

		-ms-transform: translate(-50%, -50%) rotate(360deg)

	}

}



@-moz-keyframes spin {

	from {

		-moz-transform: translate(-50%, -50%) rotate(0deg)

	}



	to {

		-moz-transform: translate(-50%, -50%) rotate(360deg)

	}

}



@-webkit-keyframes spin {

	from {

		-webkit-transform: translate(-50%, -50%) rotate(0deg)

	}



	to {

		-webkit-transform: translate(-50%, -50%) rotate(360deg)

	}

}



@keyframes spin {

	from {

		transform: translate(-50%, -50%) rotate(0deg)

	}



	to {

		transform: translate(-50%, -50%) rotate(360deg)

	}

}



::-webkit-input-placeholder {

	font-size: 20px;

	color: inherit;

	font-family: inherit;

	opacity: 1

}



:-moz-placeholder {

	font-size: 20px;

	color: inherit;

	font-family: inherit;

	opacity: 1

}



::-moz-placeholder {

	font-size: 20px;

	color: inherit;

	font-family: inherit;

	opacity: 1

}



:-ms-input-placeholder {

	font-size: 20px;

	color: inherit;

	font-family: inherit;

	opacity: 1

}



#vague-svg-blur {

	width: 0;

	height: 0;

	display: inline

}



@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

	body.open-login-form > .main-container {

		-ms-transform-origin:0 50%;

		-o-transform-origin: 0 50%;

		-moz-transform-origin: 0 50%;

		-webkit-transform-origin: 0 50%;

		transform-origin: 0 50%;

		-ms-transform: rotateY(0deg);

		-webkit-transform: rotateY(0deg);

		transform: rotateY(0deg)

	}



	/*body > .main-container{overflow-y:scroll!important}*/

	.center {

		max-width: 1004px

	}

}



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

	body.open-login-form > .main-container {

		-ms-transform-origin:0 50%;

		-o-transform-origin: 0 50%;

		-moz-transform-origin: 0 50%;

		-webkit-transform-origin: 0 50%;

		transform-origin: 0 50%;

		-ms-transform: rotateY(0deg);

		-webkit-transform: rotateY(0deg);

		transform: rotateY(0deg)

	}

}



@media screen and (min-width: 320px) and (max-width: 640px) and (orientation: landscape) {

	#countdown .box-digits {

		padding:30px 16px

	}



	#countdown .digits {

		height: 120px;

		min-width: 80px

	}



	#mailchimp-box {

		margin: 40px 0 0

	}



	footer .social {

		text-align: center

	}

}



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

	/*body > .main-container{overflow-y:scroll!important}*/body > .login-form-container {

	background:none repeat scroll 0 0 rgba(0,0,0,1)

}



	.center {

		max-width: 460px

	}



	.site-content h2.heading {

		font-size: 24px

	}



	.site-content .description h3 {

		font-size: 18px

	}



	.btn-open-login-form {

		top: 10%;

		font-size: 21px;

		left: -44px;

		width: 44px;

	}

	#btn-sound {

		margin-top:40px;

	}



	body > .login-form-container {

		min-width: 266px;

		max-width: 266px;

		right: -266px

	}



	.login-form input[type="text"],.login-form input[type="password"] {

		max-width: 170px

	}



	footer .social {

		text-align: center

	}



	footer {

		/*padding: 0 0 20px*/

	}

}



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

	.center {

		max-width:340px

	}

}



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

	.center {

		max-width:300px

	}



	.site-content h2.heading {

		font-size: 24px

	}



	.site-content .description h3 {

		font-size: 18px

	}



	.btn-open-login-form {

		top: 10%;

		font-size: 21px;

		left: -44px;

		width: 44px;

	}

	#btn-sound {

		margin-top:40px;

	}



	body > .login-form-container {

		min-width: 266px;

		max-width: 266px;

		right: -266px

	}



	.login-form input[type="text"],.login-form input[type="password"] {

		max-width: 170px

	}

}



.bg-img{

	width: 100%;

	height: 100%;

	overflow: hidden;

	position: absolute;

	top: 0;

	left: 0;

	z-index: -1;

}

.bg-img img, .bg-img source{

	position: absolute;

	visibility: visible;

	z-index: -1;

	top: 50%;

	left: 50%;

	-ms-transform: translate(-50%, -50%);

	-o-transform: translate(-50%, -50%);

	-webkit-transform: translate(-50%, -50%);

	-moz-transform: translate(-50%, -50%);

	transform: translate(-50%, -50%);

	width: auto;

	height: auto;

	min-width: 100%;

	min-height: 100%;

}



@supports (object-fit: cover){

	.bg-img img, .bg-img source{

		min-height: 100%;

		min-width: 100%;

		object-fit: cover;

		max-width: 100%;

		max-height: 100%;

	}



}

.login-error{

	margin-bottom: 10px;

	color: red;

	display: inline-block;

}

/*!--------------------------------------------------------------------

STYLES "Outdated Browser"

Version:    1.1.2 - 2015

author:     Burocratik

website:    http://www.burocratik.com

* @preserve

-----------------------------------------------------------------------*/

#outdated{

	position: fixed; top: 0; left: 0; width: 100%; padding: 10px 0;

	opacity: 0.7;

	text-align: center; text-transform: uppercase; z-index:1500;

	background-color: #f25648; color: #ffffff;

}

* html #outdated{position: absolute;}

#outdated h6{font-size: 25px; line-height: 25px; margin: 30px 0 10px;}

#outdated p{font-size: 12px; line-height: 12px; margin: 0;}

#outdated #btnUpdateBrowser{

	display: block; position: relative; padding: 10px 20px; margin: 30px auto 0; width: 230px; /*need for IE*/

	color: #ffffff; text-decoration: none; border: 2px solid #ffffff; cursor: pointer;

}

#outdated #btnUpdateBrowser:hover{color: #f25648; background-color:#ffffff;}

#outdated .last{position: absolute; top: 10px; right: 25px; width: 20px; height: 20px;}

#outdated .last[dir='rtl']{right: auto !important; left: 25px !important;}

#outdated #btnCloseUpdateBrowser{

	display: block; position: relative; width: 100%; height: 100%;

	text-decoration: none; color: #ffffff; font-size: 36px; line-height: 36px;

}



@supports (transform: translate(0, 0)) {

	#outdated {

		display: none;

	}

}

@supports (-webkit-transform: translate(0, 0)) {

	#outdated {

		display: none;

	}

}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

	#outdated {

		display: none;

	}

}