@charset "utf-8";
/* CSS Document */

body { background-color:#fff; background-image:url(../images/top-grad.png); background-repeat:repeat-x; background-position:top left; font-family: 'Poppins', sans-serif; color:#9698a0; font-size:16px;
	-webkit-transition: background-color 1000ms linear;
	-moz-transition: background-color 1000ms linear;
	-o-transition: background-color 1000ms linear;
	-ms-transition: background-color 1000ms linear;
	transition: background-color 1000ms linear;
}
body.night { background-color: #111;}
body.night .uvjeti_wrap .posao { visibility: hidden;}

a { color:#1aa08c; -moz-transition: all .20s ease-in; -webkit-transition: all .20s ease-in; -o-transition: all .20s ease-in; transition: all .20s ease-in; }
a:hover, a:focus {text-decoration:none;outline:none; color:#141a26}

h1,h2,h3,h4,h5,h6 { font-family: 'Poppins', sans-serif; color:#35363b; font-weight: 700; }
h1.title { font-size:36px; margin:5px 0px 10px 0px; text-align:center; margin-top:25px; }
h2.subtitle { font-size:24px; margin:5px 0px 10px 0px; text-align:center}

h1.title_green {margin-top:0px}

h1 { font-size:30px }
h2 { font-size:24px; }
h3 { font-size:22px }
h4,h5,h6 { font-size:20px; }

a.logo { width:300px; height:73px; display:block; background-image:url(../images/elatus-logo.svg); background-repeat:no-repeat; background-position:left; margin:15px 0px; }
a.logo_mobile { margin:auto; margin-top:25px;margin-bottom:25px;  width:150px; height:37px; display:block; background-image:url(../images/elatus-logo.svg); background-position:left; background-repeat:no-repeat;}
.posao a.logo_mobile {margin:15px 0px; float:left; margin-top:25px}

a.button { display:inline-block; color:#fff; text-transform:uppercase; padding:10px 25px; background-color:#35363b; font-size:18px; margin:10px 0px }
a.button:hover { background-color:#19a48f }

.container { position:relative }
section { display:block; padding:120px 0px; position:relative}
section.hero { padding-top:20px }

.align { text-align:center }
.rounded {-moz-border-radius: 50%; -webkit-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%;}
.textHome { text-align:center; margin-bottom:35px }

.bg_grad { color:#fff;  background: #20635d; background: -moz-linear-gradient(45deg,  #20635d 0%, #1b9282 47%, #19aa94 100%); background: -webkit-linear-gradient(45deg,  #20635d 0%,#1b9282 47%,#19aa94 100%); background: linear-gradient(45deg,  #20635d 0%,#1b9282 47%,#19aa94 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#20635d', endColorstr='#19aa94',GradientType=1 ); } /* Using Colorzilla -> http://colorzilla.com/gradient-editor/#20635d+0,1b9282+47,19aa94+100 */
.bg_gray { background-color:#f3f4f8 }
.bg_dark { background-color:#1c1c1c; color:#fff }

.logo_fade {filter: alpha(opacity=40);opacity: 0.4; -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out;  transition: opacity 0.3s ease-in-out;}
.logo_fade:hover { filter: alpha(opacity=100);opacity: 1;}

.panel_green { padding:140px 0px }
.panel_green h1 { font-size:50px }
.panel_green h2 { font-size:28px }
.panel_green h1, .panel_green h2 { color:#fff }

.skew { position:absolute; display:block; left:0; right:0px; height:100px; background-repeat:no-repeat; }
.skew.top { top:0px; background-image:url(../images/bg-top.png); background-position:top center }
.skew.bottom { bottom:0px; background-image:url(../images/bg-bottom.png); background-position:top center }

.panel_green .image_wrap {top:-160px;}
section.sKlijenti { padding-top:120px; padding-bottom:30px }
section.sKontakt { padding-top:0px; padding-bottom:35px }
section.posao { padding-top:30px; }

/* Footer */
footer { padding:100px 0px; position:relative; font-size:13px; color:#6b6c6a !important }
.credits { margin-bottom:10px; }

/* Images */
.img_apple { text-align:center; margin-top:-170px; }
.img_apple img {width:100%;}

.image_wrap {display:block; text-align:center; position:relative;  z-index:5000; margin-bottom:-200px;}
.image_wrap img { width:240px; }

.image_tablet {  margin-bottom:-420px; margin-top:180px}

/* Klijenti */
ul.klijenti { list-style:none; display:block; padding:0px; margin:30px 0px; margin-bottom:0px; text-align:center; min-height:170px; }
ul.klijenti li { width:100px; display:inline-block; margin-bottom:15px}
ul.klijenti li a { display:block; padding:0px 5px;}
ul.klijenti li a img { max-width:100%; }

.logotipi { margin-bottom:28px }

/* Posao */
.posao header { border-bottom:5px solid #1b9483; padding-bottom:10px }
.btn_home {display:none}
.posao .btn_home { display:inline-block; width:60px; height:60px; background-color:#35363b; margin-top:15px; background-image:url(../images/icon-home.png); background-repeat:no-repeat; background-position:center}
.btn_home:hover, .btn_posao:hover { background-color:#1a9b88; }
.btn_posao {display:block; margin:auto; width:60px; height:60px; background-color:#35363b; margin-top:15px; background-image:url(../images/icon-posao.png); background-repeat:no-repeat; background-position:center}
.posao .btn_posao { display:none }


.uvjeti_wrap { display:block; padding:15px 0px 35px 0px; border-bottom:1px solid #cccccc; margin:0px 0px 35px 0px; }
.uvjeti_wrap.wrapFix { background-image: url(../images/form-bg.svg); background-repeat: no-repeat; background-position: top center; }
ul.posao { margin:0px; padding:0px; list-style:none; }
ul.posao li { display:inline-block; position:relative; font-size:13px;text-align:left; margin-bottom:5px; border-left:8px solid #1b9483; padding:5px 15px; margin-left:-15px; }
ul.posao li:last-child { margin-bottom:0px }
ul.posao li span { display:block; font-size:18px; color:#35363b }

div.icon { margin:auto; display:none; width:80px; height:80px;background-color:#1b9483; background-position:center; background-repeat:no-repeat; margin-bottom:15px }
.icon.rMjesto { background-image:url(../images/icon-rMjesto.png); }
.icon.rVrijeme { background-image:url(../images/icon-rVrijeme.png); }
.icon.rIskustvo { background-image:url(../images/icon-rIskustvo.png); }

/* Newsletter */
.newsletter { margin:20px 0px; margin-top:-25px }
.newsletter .form-control { height:40px; }
.newsletter .btn { height:40px; }

/* Form */
form.obrazac label {font-weight:normal; font-size:14px}
form.obrazac { margin:35px px; }
form.obrazac .form-control { border-left:0px; border-right:0px; border-top:0px; margin:35px 0px 50px 0px; padding-bottom:20px; }

/* Article */
article { font-size:16px}
article h1 {}
article h2 {}
article h3 {}

/* Kontakt */
span.contactB { display:block; text-transform:uppercase; color:#35363b }
.infoContact { text-align:center; font-size:16px }

form.kontakt { margin-top:50px; text-align:center }
form.kontakt .form-control { background-color:#f3f4f8; border-color:#f3f4f8; font-weight:normal !important; margin-bottom:35px; }

form.kontakt .btn, form.obrazac .btn { -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    -khtml-border-radius: 0px;
    border-radius: 0px;}


.label-floatlabel { color:#9698a0 !important; font-weight:normal !important; font-size:13px !important }
.label-floatlabel:focus {color:#1aa08c !important;font-weight:normal; font-size:13px !important}
.polje { height:45px; }
.area {}

.btn { background-color:#35363b; border-color:#35363b; color:#fff; text-transform:uppercase;font-size:14px; -moz-transition: all .20s ease-in; -webkit-transition: all .20s ease-in; -o-transition: all .20s ease-in; transition: all .20s ease-in; }
.btn:hover { background-color:#19a48f; color:#fff; border-color:#19a48f}
form.kontakt .btn { padding:8px 25px;}

/* Dorade 18.11.2015 */

section.proizvodi { padding:0px; position:relative }
.titlePanel {  width:100px; height:100px; background-color:#fff; }

ul.proizvodList { list-style:none; padding:0px; margin:0px; }
ul.proizvodList li { float:left; width:50%; }

.pMegamail, .pCrm { padding:25px; text-align:center; }
h1.pTitle { color:#fff; }

/* Usluge */
ul.usluge { list-style:none; margin:0px; padding:0px; text-align:center; margin:35px 0px; }
ul.usluge li { margin-bottom:40px }

h3.uTitle { background-image:url(../images/stripe-hover.png); background-repeat:no-repeat; background-position:bottom center; padding-bottom:30px; margin-bottom:15px; -moz-transition: all .20s ease-in; -webkit-transition: all .20s ease-in; -o-transition: all .20s ease-in; transition: all .20s ease-in; }
/* ul.usluge li:hover h3.uTitle { background-image:url(../images/stripe-hover.png); } */


/* Reference */
.cbp-l-caption-title { border-bottom:1px solid #fff; padding-bottom:15px; }
.cbp-l-caption-desc ul { margin:15px 0px; padding-left:20px}
.cbp-l-caption-desc ul li { padding:2px 0px }

.cbp-l-loadMore-link, .cbp-l-loadMore-link span { color:#FFF !important;}

/* Tooltip */
.tooltip-inner { background-color:#1aa08c; color:#fff;}
.tooltip.top .tooltip-arrow { border-top-color:#1aa08c }

.owl-theme .owl-controls .owl-page.active span { background-color:#1ca792 }
.owl-theme .owl-controls .owl-page span { -moz-transition: all .20s ease-in; -webkit-transition: all .20s ease-in; -o-transition: all .20s ease-in; transition: all .20s ease-in;}

/* Dorade 09.12.2015 */
ul.benefits { list-style:none; padding-left:15px; margin:0px; }
ul.benefits li { background-image:url(../images/bullet.png); background-repeat:no-repeat; background-position:top 12px left; padding:5px 0px 5px 15px }
.requirements h2 { margin-top:30px; }
.wrapFix { margin-bottom:20px; }

@media (min-width:321px){
	
}

@media (min-width: 479px){
	
	h1.title { font-size:40px }
	h1 { font-size:40px }
	h2 { font-size:28px; }
	h3 { font-size:24px }
	h4,h5,h6 { font-size:22px; }
	/* Images */
	.img_apple { margin-top:-210px; }
	
	.image_wrap img { width:350px; }
	
	/* Newsletter */
	.newsletter { padding:0px 60px }
	
	/* Klijenti */
	ul.klijenti li { width:100px; }
	
}

@media (min-width: 768px) {
	
	a.logo { margin-left:-5px; margin-top:30px }
	.align { text-align:left }
	.textHome { padding:0px 100px }
	
	h1.title { font-size:52px; text-align:left; margin-top:10px}
	h2.subtitle { font-size:30px; text-align:left}
	
	h1 { font-size:60px }
	h2 { font-size:32px; }
	h3 { font-size:28px }
	h4,h5,h6 { font-size:24px; }
	
	/* Article */
	article h1 {font-size:36px}
	article h2 {font-size:28px;}
	article h3 {font-size:24px;}
	
	
	section.sKlijenti { padding-top:0px; padding-bottom:120px }
	section.hero { padding-bottom:30px }
	
	/* Posao */
	.posao .btn_home { margin-top:35px; }
	ul.posao { margin-top:35px }
	ul.posao li { display:inline-block; text-align:left; position:relative; padding-left:95px; font-size:13px; min-height:90px; border-left:0px; margin-left:0px }
	div.icon {display:block; position:absolute; left:0px; top:0px;}
	
	/* Images */
	.img_apple { text-align:center;margin-top:-280px; }
	.img_apple img {width:720px; }
	
	.image_wrap { position:absolute;  z-index:5000}
	.image_wrap img { width:100%; }
	.panel_green .image_wrap { top:0px;}
	
	.image_tablet {  margin-bottom:-420px;top:0px; margin-top:0px }
	
	/* Newsletter */
	.newsletter { padding:0px 150px; margin-top:-90px }
	
	/* Kontakt */
	form.kontakt { padding:0px 100px; }
	
	/* Klijenti */
	ul.klijenti li { width:120px; }
	
	/* Dorade 21.11.2015 */
	.btn_posao { float:right; margin-top:35px; margin-right:50px }
	
}

@media (min-width: 992px) {
	
	section.sKlijenti { padding-top:50px; }
	section.hero { padding-bottom:50px }
	.textHome { padding:0px 130px }
	
	/* Images */
	.image_wrap img { width:470px; }
	.image_tablet {  margin-bottom:0px; top:-100px !important; }
	
	/* Posao */
	ul.posao li { padding-top:18px; margin-bottom:0px}
	
	/* Newsletter */
	.newsletter { padding:0px 250px }
	
	/* Kontakt */
	form.kontakt { padding:0px 150px; }
	
	/* Klijenti */
	ul.klijenti { margin-top:0px }
	ul.klijenti li { width:120px; }
	ul.klijenti li a { padding:0px 10px }
	
	ul.usluge li:nth-child(3n+1) { clear:both;}
	
}


@media (min-width: 1200px) {
	
	section.sKlijenti { padding-top:50px; }
	section.hero { padding-bottom:120px }
	
	/* Images */
	.image_wrap { margin-bottom:0px;top:0px}
	.image_tablet {  margin-bottom:0px; top:-150px !important; }
	
	/* Newsletter */
	.newsletter { padding:0px 350px }
	
	
	
}


@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max--moz-device-pixel-ratio: 2) {
	a.logo { background-image:url(../images/elatus-logo.svg); background-size:300px 73px; }
	a.logo_mobile { background-image:url(../images/elatus-logo.svg); background-size:150px 37px}
	
	.skew.top { background-image:url(../images/bg-top-retina.png); background-size:2000px 100px}
	.skew.bottom { background-image:url(../images/bg-bottom-retina.png); background-size:2000px 100px }
	.btn_home { background-image:url(../images/icon-home-retina.png); background-size:50px 50px}
	.icon.rMjesto { background-image:url(../images/icon-rMjesto-retina.png); background-size:80px 80px}
	.icon.rVrijeme { background-image:url(../images/icon-rVrijeme-retina.png); background-size:80px 80px}
	.icon.rIskustvo { background-image:url(../images/icon-rIskustvo-retina.png); background-size:80px 80px}
	
	h3.uTitle { background-image:url(../images/stripe-retina.png); background-size:120px 18px;}
	h3.uTitle { background-image:url(../images/stripe-hover-retina.png); background-size:120px 18px;}
	
	/* Dorade 21.11 */
	.btn_posao {background-image:url(../images/icon-posao-retina.png); background-size:50px 50px }
	
	/* Dorade 09.12.2015 */
	ul.benefits li { background-image:url(../images/bullet-retina.png); background-size:5px 5px}
	
}

form * { -webkit-border-radius:10px; -moz-border-radius: 10px ; border-radius:10px ; box-shadow:none;}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus, .poruka_input:focus, .form-control:focus, input[select], .area:focus {   
border-color: rgba(53, 54, 59, 0.3); /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);*/ outline: 0 none;}
input[type="text"], input[type="email"], textarea {	resize:none; outline: none; box-shadow:none !important;}


label.error { display:none !important;}
input.error, textarea.error { border-color:#f2b2b2 !important;}