/*
	Theme Name: Nouhub Theme
	Theme URI: http://www.nouhub.ee/
	Description: Nouhub WordPress Theme
	Version: 1.4.3
	Author: Roosfeld Digital
	Author URI: https://roosfeld.com
	Tags: Blank, HTML5, CSS3

	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {  }
body { font-size: 18px; line-height: auto; font-family: "proxima-nova", sans-serif; font-weight: 400; color:#fff; background-color: #000;   }
/* clear */
.clear:before,
.clear:after { content:' '; display:table;}
.clear:after { clear:both;}
.clear {*zoom:1;}
img {max-width:100%;vertical-align:bottom;}
a {color:#ffc926;text-decoration:none;}
a:hover {color:#444;}
a:focus {outline:0;}
a:hover,
a:active {outline:0;}
input:focus {outline:0;border:1px solid #04A4CC;}
p { line-height: 24px; margin: 0px; padding: 18px 0px }
.center { text-align: center }
h1, h2, h3 { font-family: "zuume", sans-serif;font-weight: 700;font-style: normal; text-transform: uppercase; margin: 0px; padding-top: 60px; padding-bottom: 60px }
h1 { font-size: 50px; }
h2 { font-size: 140px;  }
h3 { font-size: 70px;  }
ul li { line-height: 21px }
button.btn { color: #fff; border: none; background: #005CFF; font-weight: 700;  text-transform: uppercase; padding: 10px 44px; border-radius: 62px; font-size: 34px; maring-top: 10px; margin-bottom: 10px; font-family: "zuume", sans-serif; }
.btn_holder { display: flex; flex-direction: column; }
button.btn:hover {   }
.button_holder { padding-top: 40px;  }

.wrapper .col { position: relative; }

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {max-width:1280px;width:95%;margin:0 auto;position:relative; padding-left: 5%;padding-right: 5%;}
/* header */
.header { position: relative; clear: both; width: 100%; padding-bottom: 30px; background: #005CFF; color: white; text-align: center; border-bottom: 1px solid white}
.header:after {  }
/* logo */
.logo { }
.logo-img { float: left; width: 200px; margin-top: 80px }
/* nav */
.nav {  padding-top: 50px; font-family: "zuume", sans-serif;font-weight: 700;font-style: normal; text-transform: uppercase; font-size: 24px }
.nav ul, .nav ul li { margin: 0px; padding: 0px; display: inline-block; list-style: none;   }
.nav ul li {  }
.nav a { color: #fff; padding: 10px 10px 10px 10px; margin: 0px 40px 0px 40px; }
.nav li.current_page_item a, .nav li a:hover { font-weight: bold; color: #000 }
.lang_nav { float: right; padding-top: 73px; color: #828C8C; padding-left: 20px; text-align: center }
.lang_nav a { color: #828C8C }
.lang_nav a.sel { color: #303333;font-weight: bold; }

.hero { background: #005CFF; padding-top: 80px; position: relative;  }
.hero_img_holder { margin-top: 0px; position: relative; background: #005CFF;}
.hero img { margin-bottom: -80px; position: relative; z-index: 4;  }
.hero img.pos { position: absolute; top: 0; left: 0; width: 100%; z-index: 2 }
.hero img.smail1 { max-width: 55%; left: 22%; z-index: 3 }
.hero img.smail2 { max-width: 55%; left: 22%; z-index: 3 }

/* parallax-pildid: GPU jaoks ja puute seadmetel parem scroll */
.hero img.smail1,
.hero img.smail2 {
	will-change: transform;
	pointer-events: none;
}

/* kui kasutaja eelistab vähendatud animatsioone, siis ära liiguta */
@media (prefers-reduced-motion: reduce) {
	.hero img.smail1,
	.hero img.smail2 {
		transform: none !important;
	}
}



/* sidebar */
.sidebar { }

/* content */
section.content { }

/* footer */
.footer {position: relative;font-size: 18px;line-height: 24px;text-align: center;padding-top: 60px;padding-bottom: 40px;color: #fff;}
.footer_logo { clear: both; width: 145px; display: block; margin: 0 auto; text-align: center; position: absolute;bottom: -35px;left: 0;right: 0;}



/*------------------------------------*\
    AVALEHT
\*------------------------------------*/

.video_box { background: url('img/video.png') no-repeat; background-size: cover; position: relative; }
.video_box .wrapper { border-left: 1px solid #005CFF; padding-top: 100px; padding-bottom: 120px }
.video_box h4 { color: #015CFF; font-size: 41px; font-family: "zuume", sans-serif;font-weight: 700;font-style: normal; text-transform: uppercase; text-align: center}
.video_box .btn_holder { max-width: 400px }
.video_box .btn_holder .btn { width: 100% }

.blue_box .wrapper { display: flow-root; padding-bottom: 60px }

.black_box { background: #000; color: #fff; position: relative; }
.black_box h2 { padding: 0px; color: #015CFF }
.black_box h3 { padding: 0px }
.black_box .wrapper { border-left: 1px solid #005CFF; padding-top: 80px; padding-bottom: 80px }
.blue_box { background: #005CFF; color: #fff;  }
.blue_box .wrapper { border-left: 1px solid black }
.blue_box h2 { color: #000000 }
.blue_box h3 { padding: 0px }

#kliendid { margin-top: 60px }
.mark { max-width: 414px }
.logos_holder { display: flex; margin-top: 90px; padding-bottom: 200px; align-items: center }
.logos_holder_i { width: 70% }
.logos_holder:before { content:''; display: block; width: 141px; height: 258px; background: url('img/nurkv@2x.png') no-repeat; background-size: 100% }
.logos_holder:after { content:''; display: block; width: 111px; height: 267px; background: url('img/nurkp@2x.png') no-repeat; background-size: 100% }

/* ujuv marker */
.floating-mark{
	position: fixed;
	left: clamp(12px, calc((100vw - 1100px)/2 - 64px), 64px); /* jääb .wrapper’i vasakust servast “ääre-sisse” */
	top: 25vh;              /* ankurjoon – siia “peatume” */
	width: 42px;            /* kohanda vastavalt here.png suurusele */
	height: auto;
	z-index: 1000;
	pointer-events: none;   /* ei sega klikke */
	opacity: 0;             /* ilmub, kui esimene pealkiri kohale jõuab */
	transform: translateY(0);
	transition: filter .2s ease;
}
.floating-mark img{ display:block; width:100%; height:auto; }

/* valikulised toonivariandid, kui taust on tume/hele */
.is-on-dark .floating-mark { filter: brightness(1.2) contrast(1.1); }
.is-on-light .floating-mark { filter: none; }

.pos.nool { position: absolute; top: 0px }





.email { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 20px; padding-left: 20%;}
.email img { width: 32px;  }
.email a { color: white; text-decoration: none; }
.email a:hover { color: white; text-decoration: underline; }



/* ===== Ninja Forms – “pill” stiil (sarnane pildile) ===== */
#nf-form-1-cont {
	--bg: #000;                /* lehe taust */
	--field-bg: #fff;          /* välja taust */
	--text: #000;              /* sisestatud teksti värv */
	--placeholder: #1766ff;    /* sinine placeholder */
	--accent: #1766ff;         /* sinine nupp ja fookus */
	--error: #ff3b30;          /* veateade ja veapiire */
	--radius-pill: 999px;      /* hästi ümarad servad */
	--radius-card: 28px;       /* textarea suurem nurga-kaar */
	--field-h: 52px;           /* väljade kõrgus */
	--field-fw: 800;           /* font-weight väljade sees */
	--gap: 22px;               /* vahed väljade vahel */
	background: var(--bg);
	padding: 10px 0 30px;
	color: #fff;
	max-width: 520px;
}

/* peida vaikimisi infotekst “Fields marked…” jne */
#nf-form-1-cont .nf-form-fields-required { display: none; }

/* üldine grid/vahe */
#nf-form-1-cont .nf-form-content .nf-fields-wrap,
#nf-form-1-cont .nf-form-content nf-fields-wrap {
	display: grid;
	gap: var(--gap);
}

/* eemaldame Ninja Forms'i labelid (sul on juba label-hidden klass) */
#nf-form-1-cont .nf-field-label {
	position: absolute !important;
	clip: rect(0,0,0,0) !important;
	width: 1px; height: 1px; overflow: hidden;
}

/* Ühtne väli-stiil (input, email, tel, textarea) */
#nf-form-1-cont .nf-field-element input.ninja-forms-field,
#nf-form-1-cont .nf-field-element textarea.ninja-forms-field {
	width: 100%;
	background: var(--field-bg);
	color: var(--text);
	border: 0;
	outline: none;
	height: var(--field-h);
	padding: 0 28px;
	border-radius: var(--radius-pill);
	box-shadow: 0 0 0 0 transparent;
	font-weight: var(--field-fw);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	text-align: center;             /* tekst/placeholder keskel */
}

/* Textarea suurem “kaardina” */
#nf-form-1-cont .textarea-wrap .ninja-forms-field {
	height: 230px;
	padding: 24px 28px;
	text-align: center;             /* hoiab placeholderi keskel */
	border-radius: var(--radius-card);
	resize: vertical;
}

/* Placeholderi sinine toon */
#nf-form-1-cont ::placeholder {
	color: var(--placeholder);
	opacity: 1;
}

/* Fookus – sinine hõng ja kerge vari */
#nf-form-1-cont .ninja-forms-field:focus {
	box-shadow: 0 0 0 3px rgba(23,102,255,.35);
}

/* Veastatus – punane piir + teade */
#nf-form-1-cont .nf-error .ninja-forms-field,
#nf-form-1-cont .nf-fail .ninja-forms-field {
	box-shadow: 0 0 0 3px rgba(255,59,48,.35);
}
#nf-form-1-cont .nf-error-wrap .nf-error-msg {
	margin-top: 10px;
	background: transparent;
	color: var(--error);
	font-weight: 700;
	text-align: center;
}

/* Submit nupp – sinine pill */
#nf-form-1-cont .submit-wrap input[type="submit"] {
	background: var(--accent);
	color: #fff;
	border: 0;
	height: 68px;
	padding: 0 36px;
	border-radius: var(--radius-pill);
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: .5px;
	cursor: pointer;
	transition: transform .06s ease, filter .15s ease;
	display: inline-block;
	min-width: 280px;
}
#nf-form-1-cont .submit-wrap input[type="submit"]:hover {
	filter: brightness(1.05);
}
#nf-form-1-cont .submit-wrap input[type="submit"]:active {
	transform: translateY(1px);
}
/* disabled olek – hall ja mitteklikitav (Ninja Forms lisab disabled) */
#nf-form-1-cont .submit-wrap input[type="submit"][disabled],
#nf-form-1-cont .submit-wrap input[type="submit"][aria-disabled="true"] {
	opacity: .55;
	cursor: not-allowed;
	filter: grayscale(0.2);
}

/* “Eduteade tuleb siia!”/response text stilistika */
#nf-form-1-cont .nf-response-msg,
#nf-form-1-cont .nf-form-errors {
	text-align: center;
	color: #fff;
	font-weight: 600;
	margin-top: 18px;
}

/* Honipot peidus */
#nf-form-1-cont .nf-form-hp { display: none !important; }

/* Vahed vormi sees nagu pildil */
#nf-form-1-cont .nf-field-container { margin: 0; }

/* Kitsamad ekraanid – vähenda väljade kõrgust pisut */
@media (max-width: 480px) {
	#nf-form-1-cont { --field-h: 64px; }
	#nf-form-1-cont .submit-wrap input[type="submit"] { min-width: 220px; height: 52px; }
}

/* Valikuliselt: tee kogu plokk maks-laiusega ja tsentreeri */
#nf-form-1-cont .nf-form-layout > form > div {
	max-width: 720px;
	margin: 0 auto;
}


#nf-form-1-cont .nf-field-element textarea.ninja-forms-field { height: 185px; border-radius: 30px }


.logos_holder {  }

















	/*------------------------------------*\
        GRID SYSTEM
    \*------------------------------------*/



/*  SECTIONS  */
.section { clear: both; padding: 0px; margin: 0px; }

/*  COLUMN SETUP  */
.col { display: block; float:left; margin: 1% 0 1% 2%; }
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF TWO  */
.span_2_of_2 { width: 100%; }
.span_1_of_2 { width: 49%; }

/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66%; }
.span_1_of_3 { width: 32%; }

/*  GRID OF FOUR  */
.span_4_of_4 { width: 100%; }
.span_3_of_4 { width: 74.5%; }
.span_2_of_4 { width: 49%; }
.span_1_of_4 { width: 23.5%; }










/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

.burger { float: right; margin-right: 20px;margin-bottom: -100px; position: relative; z-index: 9; margin-top: -40px; }
.burger img { width: 37px;  }
.mob_menu { display:none; }


@media only screen and (max-width: 1200px) {
	.burger { display: block; float: right; padding-top: 25px; cursor: pointer}
	.burger img { width: 50px;}
	.logo-img { margin-top: 20px; }
	.lang_nav, .nav.nav { display: none }
	.mob_menu { display: block; position: fixed;top: 0px; left: 0px; width: 100%; height: 100vh; background: #ffc926; z-index: 99; text-align: center }
	.mob_menu .logo { padding-left: 5% }
	.mob_menu .close { width: 100px; float: right }
	.mob_menu .close img { width: 50px; padding-top: 25px }
	.mob_menu_content { position: absolute;top: 50%;transform: translateY(-50%); width: 100%;  }
	.mob_menu ul li, .mob_menu ul { list-style-type: none; margin: 0px; padding: 0px }
	.mob_menu ul li.current_page_item a { color: #303333 }
	.mob_menu a { color: white; font-size: 25px; line-height: 45px; text-transform: uppercase }
	.mob_menu .lang_nav { display: block; text-align: center; width: 100%; padding-bottom: 40px; padding-top: 30px; }
	.mob_menu .lang_nav a { display: inline-block; margin-left: 10px; margin-right: 10px  }
	.mob_menu .lang_nav br { display: none;   }
	.mob_menu .menu-item-29 {  margin-top: 30px   }
	.mob_menu .menu-item-29 a { color: #ffc926; background: #303333;  padding: 10px 20px; margin-top: 20px   }



/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 980px) {
	.col { margin: 1% 0 1% 0%; }
	.span_2_of_2, .span_1_of_2 { width: 100%; }
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
	h2 { font-size: 80px }
	.header { border-bottom: 0px }
	.floating-mark, .mark { display: none }
	.blue_box .wrapper { border-left: 0px }
	.blue_box .wrapper, .video_box .wrapper, .black_box .wrapper { border-left: 0px }
	.video_box h4 { font-size: 35px }
	button.btn { font-size: 27px }
}

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



}

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

}

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

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



/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}