/*
	Theme Name: Prazno
	Theme URI: 
	Author: Prazno
	Author URI: 
	Description: Prazno
	Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
	--txt: #16161d;
	--wo: #d4d4d4;
	--w: #fad9ea;
	--dva: #d11811;
	font-size: 150%;
	line-height: 1.25em;
	--pro: 1.25rem;
	--pro-po: .625rem;
}

html{margin:0;padding:0;}

body{
	margin: 0;
	padding: 0;
	color: var(--txt);
	background-color: var(--w);
	text-rendering: optimizeLegibility !important;
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	font-size: 1rem;
	line-height: var(--pro);
	letter-spacing: -.01em;
	/*background-image: url('img/prostor.svg');
	background-repeat: no-repeat;
	background-position: center -35rem;
	background-size: 90rem 90rem;*/
	/*background: linear-gradient(rgba(212,212,212,.666), rgba(212,212,212,.666)), url('img/bckgrnd.svg');*/
}
*, *:before, *:after {box-sizing:  border-box !important;}

*, *:before, *:after, div, h1, h2, h3, h4, h5, h6, p, a, ol, dl, ul, span, input {box-sizing:  border-box !important;}

strong, b, i, em{font-weight:800;}

/* ----------- SOOOOON -------------- */

.soon{
	width: 100vw;
	height: 100vh;
	position: fixed;
	top:0;
	left:0;
	background-color: #fefefe;
	background-image: url('prostor.svg');
	background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
	background-size: 30%;
}
a.ss, a.ss:link, a.ss:visited, a.ss:hover, a.ss:active{
	width: 100vw;
	height: 100vh;
	position: fixed;
	display: block;
	top:0;
	left:0;
}

/* IDEEEEEEEEEEEEEEEEEEEEEEEEEEEE */

h1, h2, h3, h4, h5, h6{
	font-weight: 900;
	letter-spacing: -.01em;
}
h1{
	width: 100%;
	float: left; position: relative;
	font-size: 2rem;
	line-height: calc(var(--pro) * 2);
	margin: 0;
	padding: calc(6 * var(--pro)) 0 calc(4 * var(--pro));
}
h2{
	width: 100%;
	float: left; position: relative;
	line-height: var(--pro);
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: .04em;
	margin: 0;
	padding: var(--pro) 0;
}
p{
	width: 100%;
	float: left; position: relative;
	margin: 0;
	padding: 0;
}
p+p{
	padding-top: var(--pro);
}

.smcps{
	font-size: .8em !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .06em;
}

a, a:link, a:visited{
	color: var(--dva);
	transition: color .25s ease-in-out;
	text-decoration: none;
}
a:hover, a:active{
	color: var(--txt);
	transition: color .25s ease-in-out;
}

header{
	width: 100%;
	float: left; position: fixed;
	mix-blend-mode: multiply;
}
header h1, p.logo{
	width: calc((100% - (13 * var(--pro))) / 12 * 3 + (4 * var(--pro)));
	height: 5rem;
	float: left; position: relative;
	overflow: hidden;
	text-indent: 1000rem;
	white-space: nowrap;
	background-image: url('img/prostor_.svg');
	background-repeat: no-repeat;
	background-size: 5rem 5rem;
	background-position: center center;
	margin: calc(2 * var(--pro)) 0 0 0;
}

main{
	width: calc((100% - (13 * var(--pro))) / 12 * 6 + (5 * var(--pro)));
	float: left; position: relative;
	margin: calc(1.5 * var(--pro)) calc((100% - (13 * var(--pro))) / 12 * 3 + (4 * var(--pro)));
	mix-blend-mode: multiply;
}

.excerpt{
	width: 100%;
	float: left; position: relative;
	font-weight: 900;
	text-align: justify;
	text-align-last: justify;
	padding-bottom: var(--pro);
	text-transform: uppercase;
}

img{
	width: 100%;
	height: auto;
	float: left; position: relative;
	padding: var(--pro) 0;
}

.sep{
	width: 100%;
	height: calc(4 * var(--pro));
	float: left; position: relative;
	text-align: center;
	margin: 0;
	padding: calc(1.5 * var(--pro)) 0;
}
.sep + h2, .sep + h1, .sep + dl, h2 + dl{
	padding-top: 0;
}
dl + .sep{
	padding-top: var(--pro);
	height: calc(4 * var(--pro));
}

dl{
	width: 100%;
	float: left; position: relative;
	margin: 0;
	padding: var(--pro) 0;
}
dt{
	width: calc((100% - (5 * var(--pro))) / 3 + (1.5 * var(--pro)));
	float: left; position: relative;
	margin: 0;
	padding: 0 var(--pro-po) 0 0;
	clear: left;
	border-top: .084rem solid var(--txt);
}
dd{
	width: calc((100% - (5 * var(--pro))) / 3 * 2 + (3.5 * var(--pro)));
	float: left; position: relative;
	margin: 0;
	padding: 0 0 0 var(--pro-po);
	border-top: .084rem solid var(--txt);
}

footer{
	width: 100%;
	float: left; position: relative;
	padding: calc(15 * var(--pro)) 0 var(--pro);
	mix-blend-mode: multiply;
}

footer ul{
	width: 100%;
	float: left; position: relative;
	margin: 0;
	padding: 0 var(--pro-po);
	list-style: none;
}
footer li{
	width: calc(100% / 12 * 3);
	float: left; position: relative;
	margin: 0;
	padding: 0 var(--pro-po);
}
footer ul a{
	padding: 0 var(--pro-po) 0 0;
}
footer ul a, footer ul a:link, footer ul a:visited{
	text-decoration: none;
}

a.fb, a.ig, a.yt{
	display: inline-block;
}

a.fb:before, a.ig:before, a.yt:before{
	content: ' ';
	/*float: left;*/ display:inline-block; position: relative;
	height: .725em;
	width: .725em;
	margin-right: .275em;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center bottom;
	vertical-align: baseline;
}
a.fb:before{
	background-image: url('img/fb-.svg');
	transition: background-image .25s ease-in-out;
}
a.ig:before{
	background-image: url('img/ig-.svg');
	transition: background-image .25s ease-in-out;
}
a.yt:before{
	background-image: url('img/yt-.svg');
	transition: background-image .25s ease-in-out;
}
a:hover.fb:before, a:active.fb:before{
	background-image: url('img/fb-_.svg');
	transition: background-image .25s ease-in-out;
}
a:hover.ig:before, a:active.ig:before{
	background-image: url('img/ig-_.svg');
	transition: background-image .25s ease-in-out;
}
a:hover.yt:before, a:active.yt:before{
	background-image: url('img/yt-_.svg');
	transition: background-image .25s ease-in-out;
}

ul, ol{
	width: 100%;
	float: left; position: relative;
}

footer p{display:none;}

.red{
	color: var(--dva);
}

/* TABLICE --------------- */

table{
	width: 100%;
	float: left; position: relative;
	text-align: left;
	border-collapse: collapse;
	table-layout: auto;
	width: 100%;
}
td{
	border-bottom: .1rem solid var(--txt);
}
.red td{
	border-bottom: .1rem solid var(--dva);
}
td:last-child, th:last-child{
	text-align: right;
}

/* FORMS ----------------- */

.nf-form-cont{
	width: 100%;
	float: left; position: relative;
	border-top: .1rem solid var(--txt) !important;
}

.field-wrap{
	display: block !important;
}

.nf-form-content {
	margin-top: var(--pro);
}

.nf-field-container{
	margin-bottom: 0 !important;
}

.label-above .nf-field-label{
	margin: 0 !important;
}

.nf-field-label .nf-label-span, .nf-field-label label, .list-checkbox-wrap .nf-field-element li label, .list-image-wrap .nf-field-element li label, .list-radio-wrap .nf-field-element li label, .nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit]{
	font-weight: 600 !important;
	font-size: 1rem !important;
	line-height: var(--pro) !important;
	border-top: .1em solid var(--txt) !important;
	width: 50%;
	float: left; position: relative;
	cursor: cell;
	padding: calc(var(--pro-po) / 4) 0 0 !important;
}

.listcheckbox-container .nf-field-element label{
	margin: 0 !important;
}

.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea{
	background: none !important;
	border: 0 !important;
	border-top: .1em solid var(--txt) !important;
	font-weight: 600 !important;
	font-size: 1rem !important;
	line-height: var(--pro) !important;
	color: var(--txt) !important;
	width: 50%;
	float: left; position: relative;
	padding: calc(var(--pro-po) / 4) 0 0 var(--pro-po) !important;
	padding-block: 0;
	padding-inline: 0;
	font-family: 'Inter', sans-serif;
    font-weight: 600 !important;
    font-size: 1rem !important;
    line-height: var(--pro) !important;
    letter-spacing: -.01em;
}

.nf-form-content input:not([type=button]):focus-visible, .nf-form-content textarea:focus-visible{
	border: none;
	outline: none;
	background: var(--w) !important;
}

.nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content input.ninja-forms-field, .nf-form-content select.ninja-forms-field:not([multiple]){
	height: auto !important;
}

.field-wrap .nf-label-span, .listcheckbox-wrap .nf-label-span, .list-wrap .nf-label-span, .list-checkbox-wrap .nf-label-span{
	width: 100% !important;
	border-top: .1rem solid var(--txt) !important;
	margin: var(--pro-po) 0;
	display: block;
}

.list-checkbox-wrap .nf-field-label{
	width: 100%;
	float: left; position: relative;
	margin: var(--pro) 0 !important;
	cursor: auto;
}
.list-checkbox-wrap .nf-field-label .nf-label-span{
	cursor: auto;
}

.list-checkbox-wrap .nf-field-label .nf-label-span{
	font-size: .8em !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .06em;
}
.label-above .list-checkbox-wrap .nf-field-element, .label-below .list-checkbox-wrap .nf-field-element{
	width: 100% !important;
	float: left; position: relative;
}
/*.list-checkbox-wrap ul{
	border-bottom: .1rem solid var(--txt) !important;
}*/

.nf-error-msg, .ninja-forms-req-symbol{
	color: var(--dva) !important;
	display: inline !important;
}

.label-above .nf-field-element, .label-below .nf-field-element{
	width: auto !important;
}

.nf-form-content input[type=checkbox].ninja-forms-field, .nf-form-content input[type=radio].ninja-forms-field{
	background: none !important;
	outline: none;
	width: 1em !important;
	height: 1em !important;
	overflow: hidden;
	opacity: 0;
}

/*.list-checkbox-wrap .nf-field-element li label, .list-image-wrap .nf-field-element li label, .list-radio-wrap .nf-field-element li label{
	cursor: pointer;
}*/
.list-checkbox-wrap .nf-field-element li label, .list-image-wrap .nf-field-element li label, .list-radio-wrap .nf-field-element li label{
	padding-left: var(--pro) !important;
}
.list-checkbox-wrap .nf-field-element li label::before, .list-image-wrap .nf-field-element li label::before, .list-radio-wrap .nf-field-element li label::before{
	content: ' ';
	display: block;
	position: absolute;
	top: .375em;
	left: 0;
	border: .1em solid var(--txt);
	width: .75em;
	height: .75em;
	border-radius: .375em;
}
.list-checkbox-wrap .nf-field-element li label.nf-checked-label::after, .list-image-wrap .nf-field-element li label.nf-checked-label::after, .list-radio-wrap .nf-field-element li label.nf-checked-label::after{
	content: ' ';
	width: .25em;
	height: .25em;
	background: var(--txt);
	border-radius: .125em;
	position: absolute;
	top: .5em;
	left: .25em;
}
.nf-field-element li{
	width: 100%;
	float: left;
	position: relative;
}

.nf-form-fields-required{
	font-size: .75em;
	line-height: calc(var(--pro-po) * 1.5);
	padding-bottom: calc(var(--pro-po) * .5);
}

.nf-after-field .nf-error-msg, .nf-after-form-content .nf-error-msg{
	width: 100%;
	float: left; position: relative;
	font-size: .75em;
	line-height: calc(var(--pro-po) * 1.5);
	padding-bottom: calc(var(--pro-po) * .5);
}

.field-wrap input[type=submit]{
	width: 100% !important;
	text-align: left;
	cursor: pointer;
	margin-top: var(--pro-po);
	text-align: right;
	color: var(--dva) !important;
	transition: color .25s ease-in-out;
}
.field-wrap input[type=submit]:hover{
	color: var(--txt) !important;
	transition: color .25s ease-in-out;
}

.nf-response-msg{
	float: left;
	width: 100%;
	background: var(--txt);
	color: white;
	padding: calc(var(--pro) / 4);
	margin-bottom: var(--pro-po);
}

.datum{
	float: right;
}

/* GRID ------------------ */
.grid{
	width: 100%;
	height: 100vh;
	padding: 0 var(--pro-po);
	position: fixed;
	user-select: none;
	pointer-events: none;
	opacity: .25;
	top: 0;
	left: 0;
	display: none;
}
.col {
	width: calc(100% / 12 - var(--pro));
	height: 100vh;
	margin: 0 var(--pro-po);
	float: left;
	position: relative;
	background: var(--txt);
}

@media only screen and (max-width: 1390px) {
	footer li {
		width: calc(100% / 12 * 6);
		margin-top: var(--pro);
	}
	footer{
		padding-top: calc(14 * var(--pro));
	}
}


@media only screen and (max-width: 1280px) {
	main{
		width: calc((100% - (13 * var(--pro))) / 12 * 8 + (7 * var(--pro)));
		margin: calc(1.5 * var(--pro)) calc((100% - (13 * var(--pro))) / 12 * 2 + (3 * var(--pro)));
	}
	header h1, p.logo{
		width: calc((100% - (13 * var(--pro))) / 12 * 2 + (3 * var(--pro)));
	}
	dt{
		width: calc((100% - (5 * var(--pro))) / 4 + (1 * var(--pro)));
		border-top: .084rem solid var(--txt);
	}
	dd{
		width: calc((100% - (5 * var(--pro))) / 4 * 3 + (4 * var(--pro)));
		border-top: .084rem solid var(--txt);
	}
	footer {
		padding: calc(9 * var(--pro)) var(--pro-po) var(--pro);
	}
}

@media only screen and (max-width: 860px) {
	main{
		width: 100%;
		margin: 0 0 calc(1.5 * var(--pro)) 0;
		padding: 0 var(--pro);
	}
	header{
		/*position: relative;*/
		top: 0;
	}
	header h1, p.logo{
		width: 5rem;
		margin-left: var(--pro);
	}
	dt{
		width: calc((100% - (5 * var(--pro))) / 3 + (1.5 * var(--pro)));
		border-top: .084rem solid var(--txt);
	}
	dd{
		width: calc((100% - (5 * var(--pro))) / 3 * 2 + (3.5 * var(--pro)));
		border-top: .084rem solid var(--txt);
	}
	footer {
		padding: calc(9 * var(--pro)) var(--pro-po) var(--pro);
	}
}

@media only screen and (max-width: 750px) {
	
	footer li {
		width: 100%;
		margin-top: 0;
	}
	footer li+li{
		margin-top: var(--pro);
	}
}

@media only screen and (max-width: 580px) {
	tr{
		width: 100%;
		float: left; position: relative;
		display: block;
	}
	td{
		width: 100%;
		float: left; position: relative;
		display: block;
		border-bottom: none !important;
	}
	td+td{text-align: right;}
	td:last-child{
		border-bottom: .1rem solid var(--text) !important;
	}
	.red td:last-child{
		border-bottom: .1rem solid var(--dva) !important;
	}
	
	.nf-field-label .nf-label-span, .nf-field-label label, .list-checkbox-wrap .nf-field-element li label, .list-image-wrap .nf-field-element li label, .list-radio-wrap .nf-field-element li label, .nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
		border-top: 0.1em solid var(--txt) !important;
		width: 100%;
		float: left;
		padding: calc(var(--pro-po) / 4) 0 0 !important;
	}
	.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
		border: 0 !important;
		border-top: 0 !important;
		width: 100%;
		float: left;
		padding: 0 !important;
	}
	
}

::selection{color:white;background:var(--txt);}::-moz-selection{color:white;background:var(--txt);}