/*
Theme Name: Deadline24
Theme URI:
Author: Future Processing / Bartosz Perończyk
Author URI: http://peronczyk.com/
Description: Deadline24 2015 theme
Version: 1
Tags:
Text Domain: dpto

	================================================================================
	TABLE OF CONTENTS:

	01. Document
	02. Headers
	03. Typography
	04. Links
	05. Common elements
	06. Layout
	07. Forms
	08. Font definitions
	================================================================================
*/


/*	================================================================================
 *	01.  DOCUMENT
 *	================================================================================ */


@-ms-viewport { width: device-width }
@viewport { width: device-width }

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

	@-ms-viewport { width: 470px; }
	@viewport { width: 470px; }

}


*, html, body, h1, h2, h3, h4, h5, h6, ul, li, p, a, img, iframe, form, fieldset, input, :before, :after {
	margin: 0;
	padding: 0;
	font-weight: normal;
	border: none;
	text-decoration: none;
	outline: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ul { list-style-type: none; }

html, body {
	font-family: 'Lato', helvetica, arial, sans-serif;
}

body {
	overflow-x: hidden;
	background: url(../images/bg.jpg) repeat-y #1b1b1b;
	color: #cfcfcf;
	font-size: 14px;
}

::selection {
	background: #f26722;
	color: #fff;
}


/*	================================================================================
 *	02.  HEADERS
 *	================================================================================ */

header, h1, h2, h3, h4, h5, h6 {
	color: #fff;
	clear: both;
}

header {
}

h1 {
	font-family: 'bariol', sans-serif;
	font-weight: 200;
	font-size: 90px;
	line-height: 80px;
}

#subpage-banner h1 { font-size: 74px; line-height: 64px; }

h2 {
	margin-top: 20px;
	font-family: 'bariol', sans-serif;
	font-weight: 200;
	font-size: 44px;
	line-height: 44px;
}

h3 {
	margin-bottom: 20px;
	font-family: 'bariol', sans-serif;
	font-weight: 200;
	font-size: 36px;
	line-height: 36px;
}

h4 {
	margin-bottom: 10px;
	font-weight: 900;
	font-size: 20px;
}

h5 {
	margin-bottom: 10px;
	font-weight: 900;
	font-size: 16px;
	letter-spacing: 1px;
}

h6 {
	font-weight: 900;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .5px;
}

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

	h1 { font-size: 70px; line-height: 60px; }
	#subpage-banner h1 { font-size: 64px; line-height: 60px; }

}

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

	h1 { font-size: 60px; line-height: 54px; }
	#subpage-banner h1 { font-size: 56px; line-height: 50px; }
	h2 { font-size: 38px; }

}

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

	h1 { font-size: 45px; line-height: 47px; }
	#subpage-banner h1 { font-size: 40px; line-height: 35px; }
	h2 { font-size: 38px; }

}



/*	================================================================================
 *	03.  TYPOGRAPHY
 *	================================================================================ */


p {
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 22px;
}

p.intro {
	font-size: 16px;
	line-height: 26px;
	color: #fff;
}

p.info, .requiredTxt {
	font-style: italic;
	font-size: 18px;
	color: #f7f5c2;
	text-align: center;
}

p.desc {
	text-transform: uppercase;
	font-size: 11px;
	color: #afafaf;
	letter-spacing: 1px;
}

p.error {
	color: #ff861b;
	font-style: italic;
	letter-spacing: 1px;
	font-size: 13px;
}

.regular { font-weight: 400; opacity: .8; }

#teams-list li { margin: 0; padding: 0; }

	.teamitem {
		margin-left: -50px;
		padding: 6px 20px 6px 60px;
		word-wrap: break-word;
		border-bottom: 1px solid rgba(255,255,255,.1);
	}

		.teamline {
			font-size: 15px;
		}

			.teamline .teamleft,
			.teamline .myteam {
				color: #fff;
				transition: all .1s;
			}

			.teamline .teamleft:hover {
				color: #f26722;
			}

			.teamline .teamright  {
				font-size: 11px !important;
				text-transform: uppercase;
				letter-spacing: 1px;
				display: inline-block;
			}

		.teammembers {
			margin: 6px 0;
			font-size: 13px;
			color: #bdbdbd;
		}



	.myteam {
		background-color: #f26722;
	}

		.myteam .teamline a {
			font-size: 16px;
			color: #000;
		}

		.myteam .teamline a:hover { color: #000; letter-spacing: 1px; }

		.myteam .teammembers {
			color: #000;
		}



ul {
}

	ul li {
	}


ol { list-style-type: decimal; }
ol.abc, ol ol { list-style-type: lower-alpha; }

	ol li {
		margin: 0 0 10px 40px;
		padding-left: 10px;
		line-height: 22px;
	}


cite {
	font-style: italic;
}

blockquote {
	margin-bottom: 20px;
	padding-left: 20px;
	border-left: 1px solid rgba(255,255,255,.2);
	font-style: italic;
	font-size: 20px;
	line-height: 24px;
	color: #fff;
	letter-spacing: 1px;

}

.white	{ color: #fff; }
.orange	{ color: #e56120; }

.username {
	font-size: 14px;
	font-weight: 900;
	letter-spacing: 1px;
}

p strong,  ul strong,  ol strong {
	font-weight: 900;
	letter-spacing: .5px;
}

pre {
	font-family: "Courier New", Courier;
	font-size: 18px;
	color: #555;
	display: block;
	margin: 2em 5em;
	padding: 0.5em;
	border: 1px #ccc solid;
	background: #eee;
}

.add-date {
	margin-bottom: 10px;
	letter-spacing: 2px;
	font-size: 12px;
	text-transform: uppercase;
}



/*	================================================================================
 *	04.  LINKS
 *	================================================================================ */


a {
	color: #f26722;
	font-weight: inherit;
}

	a:hover { color: #e04a00; }

	a:active { color: #cb4300; }


a.biglink {
	display: inline-block;
	font-weight: 900;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

a.circle {
	margin-right: 16px;
	text-indent: -900px;
	transition: all .3s;
	font-size: 0px;
}

	a.circle:hover:after {
		border-color: #fff;
		border-width: 2px;
		top: -4px;
		left: -4px;
		width: 64px;
		height: 64px;
	}

	a.circle:before {
		position: absolute;
		top: 17px;
		left: 15px;
	}

a.circle-small {
	display: inline-block;
	margin-right: 8px;
	width: 38px;
	height: 38px;
	border: 1px solid rgba(255,255,255,.3);
	border-radius: 100%;
	transition: all .2s;
}

a.circle-small:hover {
	border-color: #fff;
}

	a.circle-small:before {
		margin-top: 9px;
		margin-left: 10px;
	}



/*	================================================================================
 *	05.  TABLES
 *	================================================================================ */


#text table {
}

	#text table td {
		padding-left: 30px;
		padding-right: 30px;
		vertical-align: top;
	}
	#text table tr td:first-child { padding-left: 0; }
	#text table tr td:last-child { padding-right: 0; }

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

	#text table { display: block; }
	#text table td { display: block; }
}


/*	================================================================================
 *	06.  COMMON ELEMENTS
 *	================================================================================ */


.centered	{ margin-left: auto; margin-right: auto; }

.toleft		{ text-align: left; }
.toright	{ text-align: right; }
.tocenter	{ text-align: center; }
.justify	{ text-align: justify; }

.tobottom	{ vertical-align: bottom; }
.totop		{ vertical-align: top; }
.tomid		{ vertical-align: middle; }

.fl			{ float: left; }
.fr 		{ float: right; }

.clear		{ clear: both; }

.h100		{ height: 100%; }
.w100		{ width: 100%; }
.w50		{ width: 50%; }

.relative	{ position: relative; }
.absolute	{ position: absolute; }

.notransition {
	-webkit-transition: none !important;
	   -moz-transition: none !important;
		-ms-transition: none !important;
		 -o-transition: none !important;
			transition: none !important;
}

hr {
	margin: 20px 0 30px 0;
	clear: both;
	border: none;
	border-top: 1px solid rgba(255,255,255,.2);
}

section {
	position: relative;
	width: 100%;
}

.circle {
	display: inline-block;
	padding-top: 17px;
	vertical-align: middle;
	position: relative;
	width: 56px;
	height: 56px;
	text-align: center;
}

	.circle:after {
		content: '';
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		border: 1px solid rgba(255,255,255,.4);
		border-radius: 100%;
		transition: all .2s;
	}


/*	--------------------------------------------------------------------------------
 *	GRIDS
 */

[class*='grid-'] {
	position: relative;
}

	[class*='grid-']:after {
		content: '';
		display: block;
		height: 0;
		clear: both;
	}

	[class*='col-'] {
		float: left;
		min-height: 1px;
	}

	[class*='grid-'] .col-half { width: 50%; }
	[class*='grid-'] .col-1-3 { width: calc(100% / 3); }

	/* GRID 2 COLUMNS */

	.grid-2 .col-1 { width: 50%; }

	/* GRID 4 COLUMNS */

	.grid-4 .col-1 { width: 25%; }
	.grid-4 .col-2 { width: 50%; }
	.grid-4 .col-3 { width: 75%; }
	.grid-4 .col-4 { width: 100%; }

	/* GRID 8 COLUMNS */

	.grid-8 .col-1 { width: calc(100% / 8) }
	.grid-8 .col-2 { width: calc(25%) }
	.grid-8 .col-3 { width: calc(100% / 8 * 3) }
	.grid-8 .col-4 { width: 50% }
	.grid-8 .col-5 { width: calc(100% / 8 * 5) }
	.grid-8 .col-6 { width: 75% }
	.grid-8 .col-8 { width: 100% }

	/* GRID 12 COLUMNS */

	.grid-12 .col-1 { width: calc(100% / 12); }
	.grid-12 .col-2 { width: calc(100% / 6); }
	.grid-12 .col-3 { width: 25%; }
	.grid-12 .col-4 { width: calc(100% / 3); }
	.grid-12 .col-5 { width: calc(100% / 12 * 5); }
	.grid-12 .col-6 { width: 50%; }
	.grid-12 .col-7 { width: calc(100% / 12 * 7); }
	.grid-12 .col-8 { width: calc(100% / 12 * 8); }
	.grid-12 .col-9 { width: calc(100% / 12 * 9); }


	.pad-left { padding-left: 50px; }
	.pad-right { padding-right: 50px; }

	.marg-bottom { margin-bottom: 50px; }


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

	[class*='col-'] {
		float: none !important;
		width: 100% !important;
	}

	.pad-left { padding-left: 0; }
	.pad-right { padding-right: 0; }

}


/*	--------------------------------------------------------------------------------
 *	ICONS
 */

[class*='ico-b-'], [class*='ico-a-'] {
	position: relative;
}

	[class*='ico-b-']:before,
	[class*='ico-a-']:after {
		content: '';
		display: inline-block;
		background: url(../images/sprite.png);
		vertical-align: middle;
	}

/*   ICON: SIZES   */

[class*='ico-b-s']:before, [class*='ico-a-s']:after { width: 18px; height: 18px; margin-top: -2px; }
[class*='ico-b-l']:before, [class*='ico-a-l']:after { width: 24px; height: 24px; }

/*   ICON: MARGINS   */

[class*='ico-b-l']:before	{ margin-right: 10px; }
[class*='ico-a-l']:after 	{ margin-left: 10px; }

[class*='ico-b-s']:before 	{ margin-right: 10px; }
[class*='ico-a-s']:after 	{ margin-left: 10px; }


/*   CIRCLES   */

[class*='ico-b-l'].ico-circle { display: inline-block; }

	[class*='ico-b-l'].ico-circle:before { margin-left: 20px; margin-right: 30px; }

	[class*='ico-b-l'].ico-circle:after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 64px;
		height: 64px;
		background: #f26722;
		border-radius: 100%;
		z-index: -2;
	}

/*	ICON: TYPES
 *	1 - white
 *	2 - dark
 *	3 - gray
 */

.ico-b-l-place:before,		.ico-a-l-place:after		{ background-position: -102px -108px; }
.ico-b-l-when:before,		.ico-a-l-when:after			{ background-position: -132px -108px; }
.ico-b-l-how:before,		.ico-a-l-how:after			{ background-position: -162px -108px; }
.ico-b-l-fb:before,			.ico-a-l-fb:after			{ background-position: -192px -78px; }
.ico-b-l-rss:before,		.ico-a-l-rss:after			{ background-position: -222px -78px; }
.ico-b-l-1-info:before,		.ico-a-l-1-info:after		{ background-position: -372px -78px; }

.ico-b-s-home:before,		.ico-a-s-home:after			{ background-position: -12px -6px; }
.ico-b-s-register:before,	.ico-a-s-register:after		{ background-position: -37px -6px; }
.ico-b-s-login:before,		.ico-a-s-login:after		{ background-position: -60px -6px; }
.ico-b-s-fb:before,			.ico-a-s-fb:after			{ background-position: -156px -6px; }
.ico-b-s-rss:before,		.ico-a-s-rss:after			{ background-position: -180px -6px; }
.ico-b-s-arrup:before,		.ico-a-s-arrup:after		{ background-position: -252px -30px; }
.ico-b-s-1-arrdown:before,	.ico-a-s-1-arrdown:after	{ background-position: -276px -4px; }
.ico-b-s-3-arrdown:before,	.ico-a-s-3-arrdown:after	{ background-position: -276px -54px; }





/*	================================================================================
 *	06.  LAYOUT
 *	================================================================================ */


.inner {
	margin: 0 auto;
	width: 1200px;
}

@media screen and (max-width: 1260px) {
	.inner {
		width: 100%;
		padding-left: 60px;
		padding-right: 60px;
	}
}

@media screen and (max-width: 1100px) {
	.inner {
		padding-left: 40px;
		padding-right: 40px;
	}
}

@media screen and (max-width: 650px) {
	.inner {
		padding-left: 25px;
		padding-right: 25px;
	}
}

@media screen and (max-width: 400px) {
	.inner {
		padding-left: 15px;
		padding-right: 15px;
	}
}




/*	--------------------------------------------------------------------------------
 *	NAVIGATION (TOP)
 */


nav {
	z-index: 100;
	position: fixed;
	top: 0;
	left: 0;
	padding: 0 50px;
	width: 100%;
	height: 140px;
	border-bottom: 1px solid rgba(255,255,255,.1);
	transition: all .4s ease-in-out;
}

	#logo {
		display: block;
		position: relative;
		overflow: hidden;
		margin-top: 32px;
		width: 180px;
		height: 60px;
		transition: all .5s;
		text-indent: -900px;
	}

		#logo:after,
		#logo:before {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			transition: all .4s;
		}

		#logo.logo_pl:before, #logo.logo_pl:after,
		#logo.logo_en:before, #logo.logo_en:after {
			background-size: 100% auto;
			background-position: 50% 50%;
			background-repeat: no-repeat;
		}

		#logo.logo_pl:before	{ background-image: url(../images/logo_dl24_pl_white-medium.png); }
		#logo.logo_pl:after		{ background-image: url(../images/logo_dl24_pl_black-medium.png); opacity: 0; }

		#logo.logo_en:before	{ background-image: url(../images/logo_dl24_en_white-medium.png); }
		#logo.logo_en:after		{ background-image: url(../images/logo_dl24_en_black-medium.png); opacity: 0; }


	#toolbar {
		padding-top: 20px;
		float: right;
		height: 80px;
		transition: all .4s ease-in-out;
	}

		#toolbar > * { float: left; }

		#lang-switch { margin-right: 20px; }

			#lang-switch li { display: inline-block; }

				#lang-switch a {
					display: block;
					padding-top: 14px;
					width: 34px;
					height: 40px;
					font-weight: 900;
					font-size: 11px;
					color: #c4c3c3;
					text-align: center;
					text-transform: uppercase;
				}

				#lang-switch a.active {
					color: #f26722;
				}

				#lang-switch a:hover {
					color: #fff;
				}

		#loggedin-user {
			padding: 14px 26px 0 26px;
			height: 40px;
			font-size: 11px;
			letter-spacing: 1px;
			text-transform: uppercase;
			border-left: 1px solid rgba(255,255,255,.1);
		}

			#loggedin-user strong { font-weight: 900; color: #fff; }

		#user-buttons {
			position: relative;
		}

			#login-form {
				position: absolute;
				top: 44px;
				right: 0;
				width: 240px;
				height: 0px;
				z-index: 110;
				-webkit-perspective: 1000;
				   -moz-perspective: 1000;
					 -o-perspective: 1000;
					 -m-perspective: 1000;
			}

				#login-form form {
					padding: 10px 20px;
					background: #fff;
					transition: all .5s;
					-webkit-transform: rotateX(-96deg);
						-ms-transform: rotateX(-96deg);
							transform: rotateX(-96deg);
					-webkit-transform-origin: center top;
						-ms-transform-origin: center top;
							transform-origin: center top;
					opacity: 0;
					visibility: hidden;
				}

				#login-form.open form {
					-webkit-transform: rotateX(0);
						-ms-transform: rotateX(0);
							transform: rotateX(0);
					opacity: 1;
					visibility: visible;
				}

				#login-form button {
					margin: 10px 0 5px;
					width: 100%;
				}

				#login-form label { color: #686868; }

				#login-form input[type=text],
				#login-form input[type=password] {
					color: #686868;
					background: #fff;
					border: 1px solid #d5d5d5;
				}

				#login-form input[type=text]:focus,
				#login-form input[type=password]:focus {
					border: 1px solid #d5d5d5;
				}

				#login-form a { font-size: 12px; }

				#login-form p { margin: 0; }


	#main-menu {
		float: right;
		clear: both;
		margin-right: -40px;
		height: 60px;
	}

		#main-menu li {
			position: relative;
			float: left;
			height: 100%;
		}

		#main-menu li > a {
			display: block;
			position: relative;
			padding: 16px 40px 0 40px;
			height: 100%;
			color: #fff;
			font-size: 15px;
			transition: padding .2s, color .2s, background-color .2s;
		}


@media screen and (min-width: 960px) {

	nav.scrolled {
		height: 50px;
		border-width: 0;
		background-color: #fff;
		box-shadow: 0 0 100px rgba(0,0,0,.1);
	}

	.scrolled #logo				{ margin-top: -6px; width: 110px; }
		.scrolled #logo:before	{ opacity: 0; }
		.scrolled #logo:after	{ opacity: 1; }

	.scrolled #toolbar			{ height: 0; padding-top: 0; opacity: 0; }
	.scrolled #main-menu 		{ height: 50px; }
	.scrolled #main-menu li > a	{ color: #3a3737; }
	.scrolled #my-menu { top: 50px;	}

}

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

	#main-menu { margin-right: -30px; }
		#main-menu li > a { padding-left: 30px;	padding-right: 30px; }
			#main-menu li > a:hover:after { width: calc(100% - 60px) !important; }
			#my-menu { right: 30px; }
}


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

	#main-menu { margin-right: -20px; }
		#main-menu li > a { padding-left: 20px; padding-right: 20px; font-size: 14px; }
			#main-menu li > a:hover:after { width: calc(100% - 40px) !important; }
			#my-menu { right: 20px; }
}


@media screen and (min-width: 961px) {

	#main-menu li > a:after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 50%;
		width: 0;
		height: 3px;
		background: #f26722;
		-webkit-transform: translateX(-50%);
			-ms-transform: translateX(-50%);
				transform: translateX(-50%);
		transition: all .4s cubic-bezier(0.215,.61,.355,1);
	}

	#main-menu li > a:hover:after { width: calc(100% - 80px); }

	#main-menu li > a:hover { padding-top: 22px; }

	#main-menu-toggle { display: none; }
	#toolbar-toggle { display: none; }


	#my-menu {
		position: absolute;
		top: 60px;
		right: 40px;
		width: 200px;
		height: 0;
		color: #686868;
		-webkit-perspective: 1000;
			-ms-perspective: 1000;
				perspective: 1000;
		-webkit-perspective: 1000;
		   -moz-perspective: 1000;
			 -o-perspective: 1000;
			 -m-perspective: 1000;
	}

		#my-menu > div {
			padding: 15px 20px 10px 20px;
			opacity: 0;
			visibility: hidden;
			transition: all .5s cubic-bezier(0.215,.61,.355,1);
			-webkit-transform: rotateX(-96deg);
				-ms-transform: rotateX(-96deg);
					transform: rotateX(-96deg);
			-webkit-transform-origin: center top;
				-ms-transform-origin: center top;
					transform-origin: center top;
			background: #fff;
		}

		li:hover #my-menu > div {
			-webkit-transform: rotateX(0);
				-ms-transform: rotateX(0);
					transform: rotateX(0);
			opacity: 1;
			visibility: visible;
		}

		#my-menu .menu-positions {
			margin: 10px 0;
		}

		#my-menu a {
			display: block;
			position: relative;
			padding: 12px 0;
			font-size: 13px;
			line-height: 14px;
			border-bottom: 1px solid #e5e5e5;
			transition: all .4s;
		}

		#my-menu a:first-child { border-top: 1px solid #e5e5e5; }

			#my-menu a:after {
				content: '';
				position: absolute;
				top: -1px;
				bottom: -1px;
				left: 50%;
				width: 0;
				background: #f5f5f5;
				-webkit-transform: translatex(-50%);
					-ms-transform: translatex(-50%);
						transform: translatex(-50%);
				opacity: 0;
				transition: all .4s cubic-bezier(0.215,.61,.355,1);
				z-index: -1;
			}

			#my-menu a:hover:after {
				width: calc(100% + 40px);
				opacity: 1;
			}

		#my-menu h6 { color: #000; margin-top: 20px; }
		#my-menu small {
			display: inline-block;
			line-height: 12px;
			margin-top: 10px;
		}

}


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

	nav {
		padding: 0 20px;
		height: 50px;
		background-color: #fff;
		box-shadow: 0 0 100px rgba(0,0,0,.1);
	}

	#logo {
		margin-top: -6px;
		margin-left: -34px;
		-webkit-transform: scale(.6);
			-ms-transform: scale(.6);
				transform: scale(.6);
	}
		#logo:before	{ opacity: 0 !important; }
		#logo:after		{ opacity: 1 !important; }

	#toolbar,
	#main-menu {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		padding: 0px;
		height: 0px;
		background-color: #f26722;
		transition: all .5s cubic-bezier(0.215,.61,.355,1);
		overflow: hidden;
		text-align: center;
	}

	#toolbar { background-color: #212121; }

		#toolbar > *:first-child { margin-top: 80px; }

		#lang-switch {
			margin: 0;
			float: none;
			clear: both;
			overflow: hidden;
		}

			#lang-switch a { font-size: 15px; }
			#lang-switch a.active { color: #fff; }

		#user-buttons {
			margin-top: 20px;
			float: none;
			clear: both;
		}

			#user-buttons a.btn {
				display: block;
				margin: 20px 20px 0 20px;
			}

	#main-menu { right: 20px; }

	#toolbar.open,
	#main-menu.open {
		height: 100vh;
		z-index: 95;
	}

		#main-menu li {
			float: none;
			height: auto;
		}

		#main-menu li:first-child { margin-top: 60px; }

			#main-menu li > a {
				padding-top: 20px;
				padding-bottom: 20px;
				font-size: 20px;
				font-weight: 900;
				color: #fff;
				text-transform: uppercase;
				letter-spacing: 3px;
			}

			#main-menu li > a:active,
			#main-menu li > a:hover {
				background-color: #1a1a1a;
			}

	#main-menu-toggle,
	#toolbar-toggle {
		display: block;
		position: relative;
		float: left;
		margin: 0 0 0 auto;
		width: 50px;
		height: 50px;
		background-color: #fff;
	}

	#toolbar-toggle { border-right: 1px solid #e4e4e4; }
	#toolbar-toggle.active { z-index: 100; border-right: 1px solid #e4e4e4; }
	#main-menu-toggle.active { z-index: 100; }


	#my-menu {
		overflow: hidden;
		max-height: 0;
		opacity: 0;
	}

	li:hover #my-menu {
		max-height: 1000px;
		opacity: 1;
	}
}



/*	--------------------------------------------------------------------------------
 *	HOME
 */


#banner {
	height: 100vh;
	width: 100%;
	z-index: 40;
	position: relative;
	overflow: hidden;
}

	#banner > div {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		text-align: center;
		vertical-align: middle;
	}

	#banner .slogan { top: calc(50% - 145px); }

		#banner h2 { font-size: 30px; font-weight: 500; }
		#banner h1 { margin-top: -20px; text-transform: lowercase; }
		#banner .biglink { margin-top: 28px; }

	#banner .animation {
		display: none;
		height: 460px;
	}

	#banner video {
		min-width: 100%;
		min-height: 100%;
	}


	#banner .pattern {
		height: 100%;
		background: url(../images/movie-pattern.png);
		opacity: .3;
	}


#about {
	z-index: 50;
	margin-top: -130px;
}

	#about .upper {
		display: table;
		width: 100%;
		height: 130px;
		background: #f26722;
	}

		#about .upper > div {
			display: table-cell;
			vertical-align: middle;
			float: none;
		}
		#about .upper h5 { margin: 0; }

		#countdown > div {
			position: relative;
			float: left;
			width: 25%;
			text-align: center;
		}

			#countdown h2 {
				margin: 0;
				color: #fff;
			}

			#countdown h6 {
				margin-top: 10px;
				color: #2b2b2b;
			}


	#about .lower {
		position: relative;
		padding: 40px 0 30px 0;
		min-height: 240px;
		background: #fff;
		overflow: hidden;
	}

		#about .intro { color: #535353; }
		#about p { color: #686868; }

		.edition-mark {
			position: absolute;
			left: 50%;
			top: 0;
			width: 1px;
			height: 100%;
			z-index: 100;
		}

			.edition-mark .number {
				position: absolute;
				top: -40px;
				left: -55px;
				font-family: 'Bariol', sans-serif;
				font-weight: 200;
				font-size: 360px;
				color: #f26722;
				text-shadow: 20px 20px 0 rgba(0,0,0,.05);
				line-height: 300px;
			}

			.edition-mark .name {
				position: absolute;
				top: 30px;
				right: 0;
				padding-top: 56px;
				width: 136px;
				font-weight: 900;
				text-transform: uppercase;
				color: #000;
				text-align: center;
			}

				.edition-mark .name:after,
				.edition-mark .name:before {
					content: '';
					position: absolute;
					top: 0;
					left: 0;
					z-index: -1;
				}

				.edition-mark .name:before {
					background-color: #f26722;
					border-radius: 100%;
					width: 136px;
					height: 136px;
				}

				.edition-mark .name:after {
					top: -14px;
					width: 100%;
					height: 186px;
					background:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMzYgMTg2Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIGQ9Ik02OC41LDE4NUwxMC4yLDY3LjVMNjguNSwxIGw1OC4zLDY1LjVMNjguNSwxODV6Ii8+PC9zdmc+');
					opacity: .1;
				}



#details {
	padding-top: 90px;
	padding-bottom: 90px;
}

	#details .fl { padding-right: 20px; }

	#details h2 { color: #fff; text-transform: lowercase; }
		#details h2 span { color: #f26722; font-weight: inherit; }

	#details p {
		margin: 34px 0 34px 0;
		font-size: 15px;
		color: #b5b5b5;
		letter-spacing: .3px;
	}

		#details p strong { color: #fff; }


#newses {
	overflow: hidden;
	padding-bottom: 40px;
	min-height: 300px;
	background: #fff;
}

	#newses header {
		margin-top: 40px;
		text-align: center;
	}

		#newses header h2 {
			margin-bottom: 10px;
			color: #000;
			text-transform: lowercase;
		}

		#newses .news-list {
			margin-top: 40px;
		}

			#newses .entry {
				padding: 30px;
				border: 1px solid #e5e5e5;
			}

			#newses .col-4:nth-child(1) .entry { margin-right: 30px; }
			#newses .col-4:nth-child(2) .entry { margin-right: 20px; margin-left: 20px; }
			#newses .col-4:nth-child(3) .entry { margin-left: 30px; }

				#newses .entry .add-date {
					color: #afafaf;
				}

				#newses .entry h4 {
					color: #000;
					font-weight: 400;
				}

				#newses .entry .content {
					color: #686868;
				}

				#newses .entry img,
				#newses #front_gallery,
				#newses iframe,
				#newses .YouTube {
					display: none;
				}



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

	#banner h1 { margin-top: 0; }
	#banner .biglink { margin-top: 48px; }

}

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

	#banner h1 { margin-top: 12px; }
	#details p { font-size: 14px; }

}

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

	#banner {
		padding: 100px 0 80px 0;
		height: auto;
	}

		#banner > * { position: static !important; }

		#banner video,
		#banner .pattern,
		#banner .animation {
			display: none !important;
		}

	#about { margin: 0 !important; }

		#about .upper {
			display: block;
			height: auto !important;
		}

			#countdown { overflow: hidden; }

				#countdown > div:first-child:before,
				#countdown > div:last-child:after {
					display: none !important;
				}

			#about .upper > div {
				display: block;
				padding: 10px;
				text-align: center;
			}

		#about .lower {
			padding-left: 20px;
			padding-right: 20px;
			min-height: 0;
		}
		#about .edition-mark { display: none; }

	#details {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	#newses .col-4 { margin-bottom: 20px; }
		#newses .entry { margin: 0 !important; }

}

@media screen and (min-height: 768px) {

	#countdown > div:before,
	#countdown > div:last-child:after {
		content: '';
		display: block;
		position: absolute;
		top: -6px;
		left: 0;
		width: 1px;
		height: 80px;
		background: #fff;
		-webkit-transform: rotate(12deg) translate3d(0,0,0);
			-ms-transform: rotate(12deg) translate3d(0,0,0);
				transform: rotate(12deg) translate3d(0,0,0);
		opacity: .3;
	}

	#countdown > div:last-child:after { left: 100%; opacity: 1; }
	#countdown > div:first-child:before { opacity: 1; }

}

@media screen and (max-height: 767px) {

	#countdown h2 { font-size: 30px; }
	#about { margin-top: -80px; }
		#about .upper { height: 80px; }
			#about .upper h6 { margin: 0; }
			#about .upper h5 { margin: 0; }

}


@media screen and (min-height: 680px) {

	#banner .animation {
		display: block;
		top: calc(50% - 240px);
		background: url(https://www.deadline24.pl/themes/deadline24/images/circles.png) no-repeat 50% 50%;
	}

}

@media screen and (max-height: 767px) {

	#banner .animation { top: calc(50% - 200px); }
	#banner .slogan { top: calc(50% - 105px); }

}


/*	--------------------------------------------------------------------------------
 *	PAGES
 */

#subpage-banner {
	background: url(../images/banner-subpage.jpg) no-repeat;
	background-size: cover;
}

	#subpage-banner header {
		padding-top: 190px;
		padding-bottom: 50px;
		text-align: center;
	}

	#breadcrumbs {
		margin-top: 26px;
		font-size: 11px;
		letter-spacing: 1px;
		text-transform: uppercase;
		color: #bcbcbc;
	}

		#breadcrumbs a {
			color: #fff;
		}

		#breadcrumbs a:hover {
			border-bottom: 1px solid rgba(255,255,255,.4);
		}

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

		#subpage-banner header { padding-top: 76px; padding-bottom: 40px; }

}


#content {
	margin-top: -7px;
	padding-bottom: 60px;
	border-bottom: 1px solid rgba(255,255,255,.08);
}

	#sub-menu { border-color: #f26722; }

		#sub-menu li { border-bottom: 1px solid rgba(255,255,255,.2); }
		#sub-menu li:last-child { border: none; }

			#sub-menu li a {
				position: relative;
				display: block;
				padding: 15px 0 15px 30px;
				font-size: 12px;
				line-height: 14px;
				text-transform: uppercase;
				letter-spacing: 1px;
				color: #e3e3e3;
				transition: all .2s;
			}

			#sub-menu li a.current {
				font-weight: 900;
				color: #fff;
			}

			#sub-menu li a:hover {
				padding-left: 40px;
				color: #fff;
			}

				#sub-menu li a:before {
					content: '';
					position: absolute;
					top: 50%;
					left: 10px;
					width: 10px;
					height: 1px;
					background: #fff;
					opacity: .08;
					transition: all .2s;
				}

				#sub-menu li a:hover:before {
					left: 5px;
					opacity: .3;
					width: 20px;
				}

	#text { border-color: #fff; }

	#sub-menu,
	#text {
		padding-top: 60px;
		border-width: 0;
		border-top-width: 14px;
		border-style: solid;
	}


#news-list { }

	#news-list .entry {
		margin-bottom: 30px;
		padding: 30px;
		border: 1px solid rgba(255,255,255,.1);
		transition: all .3s;
		position: relative;
	}

	#news-list .entry:hover {
		border: 1px solid rgba(255,255,255,.2);
	}

		#news-list .entry:before {
			content: counter(newses);
			counter-increment: newses -1;
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			padding-top: 13px;
			width: 80px;
			border-top: 3px solid #fff;
			font-family: 'Bariol', sans-serif;
			font-weight: 100;
			font-size: 60px;
			text-align: center;
		}

		#news-list .entry .col-3 {
			padding-left: 50px;
		}

			#news-list .delete {
				position: absolute;
				left: -12px;
				bottom: -18px;
				font-size: 12px;
				text-transform: uppercase;
				letter-spacing: 1px;
			}

		#news-list .entry h4 {
			line-height: 30px;
			letter-spacing: 1px;
		}

		#news-list .entry iframe { width: 100%; }
		#news-list .entry p > img {
			width: auto;
			max-width: 100%;
			height: auto;
		}

		#front_gallery li {
			float: left;
			width: 25%;
			min-width: 80px;
			max-width: 300px;
		}

			#front_gallery a {
				display: block;
				min-height: 8px;
				background: #f26722;
			}

				#front_gallery a img {
					min-width: 10px;
					width: 100%;
					height: auto;
					display: block;
					transition: all .2s;
				}

				#front_gallery a:hover img {
					opacity: .6;
				}


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

	#text {
		padding-top: 30px;
		padding-left: 0 !important;
	}

	#sub-menu { padding-top: 10px; }

	/* Reorder sub menu and content */

	#content > .inner > .grid-12 { display: table; width: 100%; }

		#content > .inner > .grid-12 > .col-3 { display: table-footer-group; }


	#news-list .entry p > img { width: 100% !important; }

	#news-list .entry:before {
		font-size: 50px;
		padding-top: 0;
	}

	a[rel='lightbox'] img { width: 100%; }


}



/*	--------------------------------------------------------------------------------
 *	FOOTER
 */

footer {
	min-height: 400px;
	overflow: hidden;
}

	footer .logos {
		padding-top: 20px;
		margin-left: -20px;
		margin-right: -20px;
	}

		footer .logos h5 { margin-top: 40px; }

			footer .logos dl { margin: 0 20px; }

				footer .logos dt { margin-bottom: 20px; }


	footer .divider {
		margin-top: 50px;
		position: relative;
		height: 70px;
		margin-right: -1px;
	}

		footer .divider:after {
			content: '';
			display: block;
			position: absolute;
			z-index: -1;
			top: 22px;
			left: -100%;
			right: -100%;
			height: 3px;
			background: url(../images/dot-orange.png) repeat-x 50% 50%;
		}

		footer .divider a {
			display: block;
			position: relative;
			margin: 0 auto;
			border-radius: 100%;
			background: #e56120;
			width: 44px;
			height: 44px;
			text-align: center;
		}

			footer .divider a:before {
				margin: 0;
				margin-top: 12px;
			}

			footer .divider a:after {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				border-radius: 100%;
				z-index: -1;
				border: 1px solid #fff;
				transition: all .2s;
				opacity: 0;
			}

			footer .divider a:hover:after {
				top: -8px;
				left: -8px;
				width: 60px;
				height: 60px;
				opacity: .3;
			}

	footer .bottom {
		margin-top: 20px;
		min-height: 100px;
	}

		footer .logo_pl,
		footer .logo_en {
			display: block;
			margin-right: 20px;
			float: left;
			width: 130px;
			height: 40px;
			overflow: hidden;
			text-indent: -900px;
		}

		footer .logo_pl { background: url(../images/logo_dl24_pl_white-small.png) no-repeat; }
		footer .logo_en { background: url(../images/logo_dl24_en_white-small.png) no-repeat; }

		footer .bottom ul {
			float: right;
			margin-top: 10px;
		}

			footer .bottom ul li {
				float: left;
			}

				footer .bottom ul a {
					display: inline-block;
					padding: 10px 15px;
					font-size: 10px;
					text-transform: uppercase;
					color: #fff;
					opacity: .5;
					letter-spacing: 1px;
					transition: all .1s;
				}

				footer .bottom ul a:hover {
					opacity: 1;
				}


@media screen and (min-width: 901px) {


	footer .logos dd { display: flex; }

		footer .logos dd a {
			flex-grow: 1;
			display: block;
			position: relative;
			height: 100px;
			text-align: center;
		}

			footer .logos dd a:before {
				content: '';
				display: inline-block;
				height: 100%;
				width: 0;
				vertical-align: middle;
			}

			footer .logos dd a:after {
				content: '';
				display: block;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				right: -1px;
				border-width: 1px 0 1px 1px;
				border-color: rgba(255,255,255,.3) rgba(255,255,255,.3) rgba(255,255,255,.3) rgba(255,255,255,.1);
				border-style: solid;
				transition: all .2s;
			}

			footer .logos dd a:first-child:after { border-left-color: rgba(255,255,255,.3); }
			footer .logos dd a:last-child:after { border-right-width: 1px; }

			footer .logos dd a:hover:after {
				border-width: 1px;
				border-color: #fff;
			}

			footer .logos dd a img {
				display: inline-block;
				vertical-align: middle;
				width: 100%;
				max-width: 260px;
				max-height: 100%;
			}

}

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

	footer .logos { text-align: center; }
		footer .logos h5 { border-top: 1px solid rgba(255,255,255,.2); padding-top: 15px; }
		footer .logos dd {
			display: block;
			font-size: 0;
		}
			footer .logos dd a {
				display: inline-block;
				width: 50%;
			}
				footer .logos dd a img {
					width: 100%;
					max-width: 260px;
				}
}


/*	----------------------------------------------------------------------------
 *	MODAL POPUP WINDOW
 */


/*	----------------------------------------------------------------------------
 *	PAGE GRID
 */

#page-grid {
	position: fixed;
	z-index: 800;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: .3;
}

	#page-grid * { height: 100%; }

	#page-grid .col-1:nth-child(1n) { background: yellow; }
	#page-grid .col-1:nth-child(2n) { background: red; }


#cookies {
	position: fixed;
	bottom: 0;
	left: 0;
	overflow: hidden;
	width: 100%;
	max-height: 0;
	background: #fff;
	z-index: 300;
	box-shadow: 0 0 100px rgba(0,0,0,.1);
	transition: all .5s ease-in;
}

#cookies.active {
	max-height: 200px;
}

	#cookies .inner { padding: 20px 0; }

	#cookies .col-9:before {
		content: '';
		display: inline-block;
		width: 0;
		height: 100%;
		vertical-align: middle;
	}

		#cookies p {
			padding-top: 10px;
			margin: 0;
			display: inline-block;
			vertical-align: middle;
			color: #686868;
		}

		#cookies button {
			display: block;
			float: right;
		}


/*	================================================================================
 *	07.  FORMS
 *	================================================================================ */

form {
}

label {
	display: block;
	margin-top: 10px;
	font-size: 14px;
	line-height: 18px;
	color: #cfcfcf;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
		 -o-user-select: none;
			user-select: none;
}

label.error,
span.required,
span.validation,
.message.bad {
	position: relative;
	display: block;
	margin-top: 4px;
	width: 100% !important;
	text-align: left !important;
	background: #e56120;
	color: #000;
	padding: 4px 8px;
	font-size: 13px;
	white-space: pre;
}

	label.error:before,
	span.required:before,
	span.validation:before,
	span.message.bad:before {
		content: '';
		position: absolute;
		top: -4px;
		left: 20px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 0 7px 6px 7px;
		border-color: transparent transparent #e56220 transparent;
	}

	span.validation:before { left: auto; right: 20px; }

fieldset {
}


/*	----------------------------------------------------------------------------
 *	INPUTS
 */

input[type=text],  input[type=email],  input[type=password],  select,  textarea {
	margin: 10px 0 0 0;
	padding: 0 10px;
	border: 1px solid rgba(255,255,255,.3);
	width: 100%;
	background: none;
	transition: all .1s;
	color: #cfcfcf;
	font-family: 'Lato', sans-serif;
	font-size: 14px;
	background: rgba(0,0,0,.1);
}

input[type=text],  input[type=email],  input[type=password],  select {
	height: 36px;
}

input[type=text]:focus,  input[type=email]:focus,  input[type=password]:focus,  textarea:focus {
	box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
	border-color: rgba(255,255,255,.5);
	background: rgba(0,0,0,.2);
}

textarea {
	padding-top: 5px;
	padding-bottom: 5px;
}

select option { color: #686868; }

input[type=text].error,  input[type=email].error,  input[type=password].error,  select.error,  textarea.error {
	border-color: #e56120;
}

input[type=checkbox],  input[type=radio] {
	float: left;
	margin-right: 6px;
	margin-top: 3px;
}


/*	----------------------------------------------------------------------------
 *	BUTTONS
 */

/*   State: NORMAL   */

button,  input[type=submit],  a.btn {
	display: inline-block;
	position: relative;
	padding: 0 20px;
	height: 40px;
	border: 1px solid rgba(255,255,255,.3);
	color: #fff;
	background: none;
	font-family: 'Lato', Arial, sans-serif;
	font-size: 13px;
	font-weight: 900;
	line-height: 38px;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 0.7px;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

button.solid,  input[type=submit].solid,  a.btn.solid {
	background: #f26722;
	border-color: transparent;
}

button.dark,  input[type=submit].dark,  a.btn.dark {
	border-color: #e5e5e5;
	color: #000;
}

button.lines:before,  input[type=submit].lines:before,  a.btn.lines:before,
button.lines:after,   input[type=submit].lines:after,   a.btn.lines:after {
	content: '';
	position: absolute;
	top: 50%;
	display: block;
	width: 0px;
	height: 1px;
	background-color: #fff;
	opacity: .3;
	transition: all .3s ease-in-out;
}

button.lines:before,  input[type=submit].lines:before,  a.btn.lines:before { left: -15px; }
button.lines:after,   input[type=submit].lines:after,   a.btn.lines:after  { right: -15px; }

button.lines.dark:before,  input[type=submit].lines.dark:before,  a.btn.lines.dark:before,
button.lines.dark:after,   input[type=submit].lines.dark:after,   a.btn.lines.dark:after {
	background-color: #000;
}


/*   State: HOVER   */

button:hover,  input[type=submit]:hover,  a.btn:hover {
	background: #f26722;
	border-color: #f26722;
	z-index: 200;
}

button.solid:hover,  input[type=submit].solid:hover,  a.btn.solid:hover {
	background-color: #cd4e0e;
	border-color: #cd4e0e;
}

button.expand:hover,  input[type=submit].expand:hover,  a.btn.expand:hover {
	margin-left: -15px;
	margin-right: -15px;
	padding-left: 30px;
	padding-right: 30px;
}

button.lines:hover:before,  input[type=submit].lines:hover:before,  a.btn.lines:hover:before,
button.lines:hover:after,   input[type=submit].lines:hover:after,   a.btn.lines:hover:after {
	width: 30px;
}


/*   State: ACTIVE   */

button:active,  input[type=submit]:active,  input[type=reset]:active,  a.btn:active {
}





/*	================================================================================
 *	08.  FONT DEFINITIONS
 *	================================================================================ */


@font-face {
	font-family: 'bariol';
	src: url('../fonts/bariol_light.eot');
	src: url('../fonts/bariol_light.eot#iefix') format('embedded-opentype'),
		 url('../fonts/bariol_light.woff') format('woff'),
		 url('../fonts/bariol_light.ttf') format('truetype');
	font-weight: 200;
}



/*	================================================================================
 *	09.  SILVERSTRIPE DEFINITIONS
 *	================================================================================ */


#text #MemberLoginForm_LoginForm {
	margin: auto;
	width: 330px;
}

.Actions {
	margin-top: 20px;
}

#Captcha > div {
	float: right;
	width: 50%;
}

#Captcha > label { float: left; margin-top: 17px; margin-right: 20px; }
#Captcha img { margin-top: 15px; }

#collapse-teams { margin-bottom: 40px; }

#Form_RegistrationForm,
#Form_EditProfileForm {
	margin-top: 40px;
	margin-left: auto;
	margin-right: auto;
	max-width: 1000px;
}

	#Form_RegistrationForm label,
	#Form_EditProfileForm label {
		display: inline-block;
		margin-right: 20px;
		vertical-align: middle;
		width: 200px;
		text-align: right;
	}

	#Form_RegistrationForm .middleColumn,
	#Form_EditProfileForm .middleColumn {
		display: inline-block;
		vertical-align: middle;
		width: 360px;
	}

	#Form_RegistrationForm #Password > .middleColumn {
		width: 100%;
	}

	#Prefix { height: 0; padding-left: 220px; }

		#Prefix .middleColumn {
			width: 65px;
			position: relative;
			z-index: 10;
		}

	#Prefix.readonly {
		margin: 0;
		padding: 0px;
		position: relative;
		height: 1px;
		width: 100%;
	}

		#Prefix.readonly .middleColumn {
			position: absolute;
			top: 3px;
			left: 218px;
		}

	#ContactTelephone .middleColumn {
		width: 290px;
		margin-left: 70px;
	}

	#ContactTelephone.readonly .middleColumn {
		margin-left: 30px;
	}

		.CompositeField:nth-child(2) label:not(.error) { display: inline !important; }

		.CompositeField li { padding: 3px 0; }

	#Form_RegistrationForm .checkbox,
	#Form_EditProfileForm .checkbox,
	#Zgoda {
		margin-top: 20px;
	}

	#Form_RegistrationForm .Actions,
	#Form_EditProfileForm .Actions {
		padding-left: 220px;
	}

	#Form_RegistrationForm input[type=radio],
	#Form_RegistrationForm input[type=checkbox],
	#Form_EditProfileForm input[type=radio],
	#Form_EditProfileForm input[type=checkbox] {
		margin-top: 5px;
	}

	span.readonly {
		display: inline-block;
		margin-top: 8px;
	}

	#Form_EditProfileForm .CompositeField:nth-child(2) div.readonly,
	#Form_EditProfileForm .CompositeField:nth-child(2) div.checkboxfield_readonly {
		border-bottom: 1px solid rgba(255,255,255,.1);
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	#Form_RegistrationForm #Captcha .challengeResponse {
		width: 120px;
		position: relative;
	}
	#Form_RegistrationForm #Captcha .message {
		margin-top: 10px;
	}
	#Form_RegistrationForm #Captcha .left {
		text-align: left;
		width: 150px;
	}


#ChangePasswordForm_ChangePasswordForm {
	max-width: 400px;
	margin: auto;
}


@media screen and (min-width: 1081px) {

	.CompositeField { float: left; }
	.CompositeField:nth-child(1) { width: 60%; }
	.CompositeField:nth-child(2) { width: 40%; padding-left: 20px; }

}


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

	.CompositeField { margin-top: 40px; }

	#Form_RegistrationForm .Actions,
	#Form_EditProfileForm .Actions {
		padding: 0;
		text-align: center;
	}

}

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

	#Form_RegistrationForm label,
	#Form_EditProfileForm label {
		width: 40%;
	}

	#Form_RegistrationForm .middleColumn,
	#Form_EditProfileForm .middleColumn {
		width: 50%;
	}

	#Prefix { padding-left: 44%; }
		#Prefix .middleColumn { width: 55px; }

	#ContactTelephone .middleColumn {
		margin-left: 60px;
		width: calc(50% - 60px);
	}

}


/*	================================================================================
 *	10.  AJAX CHAT
 *	================================================================================ */


#ajaxChatChatList {
	padding: 8px;
	border: 1px solid rgba(255,255,255,.3);
	background-color: rgba(0,0,0,.3);
	height: 300px;
	overflow: scroll;
	overflow-x: hidden;
	overflow-y: scroll;
}

	#ajaxChatChatList > div {
		padding: 8px 30px 8px 10px;
		position: relative;
		line-height: 22px;
	}

	#ajaxChatChatList > div.rowEven { background-color: rgba(255,255,255,.05); }

		#ajaxChatChatList .delete {
			position: absolute;
			top: 3px;
			right: 5px;
			display: inline-block;
			padding: 0 4px;
		}

			#ajaxChatChatList .delete:before {
				content: 'x';
				font-size: 11px;
				font-weight: 900;
			}

		#ajaxChatChatList .dateTime {
			font-size: 12px;
			letter-spacing: 1px;
			color: #a8a8a8;
		}

		#ajaxChatChatList .moderator { color: #f7f5c2; }
		#ajaxChatChatList .chatBot { color: #fff; font-style: italic; }
		#ajaxChatChatList .user { color: #fff; }

		#ajaxChatChatList img {
			vertical-align: middle;
			margin: 0 3px;
		}

#ajaxChatCopyright {
	margin-top: 10px;
	color: #fff;
	opacity: .2;
	font-size: 12px;
	letter-spacing: 1px;
}

	#ajaxChatCopyright a { color: inherit !important; }
	#ajaxChatCopyright a:hover { text-decoration: underline; }