/*
 *
 * Project:  EkoKomplex.cz
 * Created:  16/4/2016
 *
*/


/* ----------> reset CSS */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; /*font: inherit;*/ vertical-align: baseline; background: transparent
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } /* HTML5 display-role reset for older browsers */
body { line-height: 1 }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none }
table { border-collapse: collapse; border-spacing: 0 }
:focus { outline: none }

.clearfix:before, .clearfix:after { content: ""; display: table; line-height: 0 }
.clearfix:after { clear:both }



/* ----------> base CSS */

html, body { height: 100% }
body { font: 100%/1.4 "Dosis", "Arial CE", arial, "Helvetica CE", helvetica, sans-serif; font-weight: 400; letter-spacing: 1px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale }
body { color: #000; text-align: center; background: #e6e7e6 url(../img/bg_body.jpg) no-repeat 50% -300px }
h1, h2, h3, h4, h5, h6 { color: #000; font-weight: 400; line-height: normal; letter-spacing: -1px; text-align: center }
h1 { font-size: 440%; font-weight: 200; clear: both; margin: 0 0 1em; letter-spacing: -1px; line-height: 1.1 }
h2 { font-size: 240%; margin: 1.2em 0 .5em; line-height: 1.1 }
h3 { font-size: 200%; margin: 1.8em 0 .5em; line-height: 1.1 }
h4 { font-size: 150%; color: #2ea16d; margin: 2.2em 0 .5em; line-height: 1.2; letter-spacing: -0.5px; padding: 0 }
input, select, textarea { font: 100% "Dosis", "Arial CE", arial, "Helvetica CE", helvetica, sans-serif }
a { color: #2ea16d; outline: none; -o-transition: .4s; -webkit-transition: .4s; transition: .4s }
a:link { color: #2ea16d }
a:hover { color: #39dc92; text-decoration: none }
p { margin: 1em 0 2em 0; line-height: 1.4; text-align: justify }
ul, ol { margin: 1em auto 3.5em auto }
small { font-size: 90% }
/* Google webfont */
em, i { font-style: italic }
strong, b { font-weight: bold; font-weight: 700 }
sup { vertical-align: super }
sub { vertical-align: sub }



/* ----------> default CLASS */

.tal { text-align: left !important }
.tac { text-align: center !important }
.tar { text-align: right !important }
.vat { vertical-align: top }
.vam { vertical-align: middle }
.fl { float: left }
.fr { float: right }
.fli { float: left; margin: 0 1.3em 1em 0 }
.fri { float: right; margin: 0 0 1em 1.3em }
.hidden { display: none }
.small { font-size: 90% }



/* ----------> project LAYOUT */

#main { width: 100%; min-height: 100%; text-align: left; position: relative }
#content { width: 820px; margin: 0 auto; padding: 90px 0 180px; position: relative }
#header { width: 100%; height: 70px; background-color: #fff; -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.2); box-shadow: 0 2px 4px rgba(0,0,0,.2) }
#footer { width: 100%; height: 60px; position: absolute; left: 0; bottom: 0; background-color: #d9d9d9 }

.home { background-position: 50% 0 }
.home #content { width: 1100px }
#header .in, #footer .in { width: 1100px; margin: 0 auto; position: relative }



/* ----------> project CSS */

/* header */

#logo, #logo span { display: block; margin: 0; position: relative; left: 20px; top: 10px; width: 289px; height: 50px; text-indent: -999em; z-index: 10; -o-transition: none; -webkit-transition: none; transition: none }
#logo span { position: absolute; left: 0; top: 0; margin: 0; background: transparent url(../img/logo.png) no-repeat 0 0 }

#header nav { position: absolute; right: 0; top: 0 }
#menu { margin: 0 }
#menu li { float: left; position: relative }
#menu a { color: #000; font-size: 100%; font-weight: 500; display: block; height: 70px; line-height: 70px; margin: 0; padding: 0 22px; text-decoration: none; text-transform: uppercase; -webkit-transition: .2s; transition: .2s }
#menu a:hover, #menu .hover a { color: #fff !important; background-color: #2ea16d !important }
#menu > .current-menu-item a, #menu .current-menu-parent > a { color: #2ea16d; background-color: #fff }



#menu ul { display: none }
#menu ul { position: absolute; left: 0; top: 70px; margin: 0; padding: 10px 0; width: 320px; z-index: 99; background-color: #2ea16d }
#menu ul li { float: none }
#menu ul a:hover, #menu ul li:hover { background-color: transparent !important }
#menu ul a { color: #fff; text-transform: none; font-size: 95%; height: auto; line-height: normal; letter-spacing: normal; padding: 5px 22px; background-color: transparent !important }
#menu ul a:hover { color: #47f1a4 !important; position: relative; left: .1em }



/* footer */

#footer, #footer a { color: #7c7b7b; text-decoration: none }
#footer a:hover { color: #000 }

#footer nav { float: left; margin: 20px 0 0 }
#footer nav ul { margin: 0 }
#footer nav li { float: left; padding: 0 .8em; border-right: 1px solid #dadada }
#footer nav li:first-child { padding-left: 0 }
#footer nav li:last-child { border: 0 }
#footer .copyright { margin: 20px 0 0 }



/* sidebar */

/* homepage */

.welcome h1 { color: #fff; margin-bottom: .5em; padding-bottom: 1.2em; background: transparent url(../img/arr.png) no-repeat 50% bottom }
.welcome p { text-align: center }

.services {}
.services ul { margin: 3em 16px 5em }
.services h3 { color: #fff }
#content .services li { float: left; width: 235px; margin: 0 16px; padding: 167px 0 0; position: relative; text-align: center; position: relative; -webkit-border-radius: 5px; border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box }
.services li:after { content: ""; display: block; width: 100%; height: 10px; position: absolute; left: 0; bottom: -10px; background: transparent url(../img/shadow.png) no-repeat 50% bottom }
.services li:hover { cursor: pointer }
.services li:hover a { color: #39dc92 }
.services li h2 { font-size: 120%; font-weight: 700; text-transform: uppercase; letter-spacing: normal; padding: 1.2em 0; margin: 0; position: relative }
.services li h2 a { text-decoration: none }
.services li h2:before { content: ""; display: block; width: 30px; height: 30px; position: absolute; left: 50%; top: -17px; margin-left: -15px; background: transparent url(../img/bullet2.png) no-repeat 0 0; -webkit-transition: .4s; transition: .4s }
.services li:hover h2:before { top: -14px }

#content .services li:nth-child(1) { background: #fff url(../img/s1.jpg) no-repeat 50% 0 }
#content .services li:nth-child(2) { background: #fff url(../img/s2.jpg) no-repeat 50% 0 }
#content .services li:nth-child(3) { background: #fff url(../img/s3.jpg) no-repeat 50% 0 }
#content .services li:nth-child(4) { background: #fff url(../img/s4.jpg) no-repeat 50% 0 }



/* category/single/archive/CPT */

/* nativni WP galerie */

#content .gallery { width: 100%; margin: 1em auto 0; padding: 0; overflow: hidden; -o-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box }
#content .gallery img { -o-transition: .4s; -webkit-transition: .4s; transition: .4s }
#content .gallery-item { float: left; width: auto !important; margin: 0 !important; line-height: normal; font-size: 0 }
#content .gallery a { display: block; background-color: #fff; -o-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50% }
#content .gallery a:hover img { opacity: 0.7 }
#content .gallery-caption { display: none; font-size: 90%; color: #000; line-height: normal }
#content .gallery br { display: none }



/* wp_pagenavi */

/* breadcrumb_navxt */

/* fulltext */

/* other */

.h1 { color: #fff; padding-bottom: .3em; background: transparent url(../img/divider.png) no-repeat 50% bottom }

img.alignright, img.fri, img[align="right"] { float: right; margin: .2em 0 3em 3em; border-radius: 5px }
img.alignleft, img.fli, img[align="left"] { float: left; margin: .2em 3em 3em 0; border-radius: 5px }
img.aligncenter { display: block; margin: 3em auto 2em }

.btn { border: 0; font-weight: 700; font-size: 120%; letter-spacing: 2px; cursor: pointer; display: inline-block; text-align: center; text-decoration: none; text-transform: uppercase; -webkit-transition: .4s; transition: .4s; -webkit-border-radius: 5px; border-radius: 5px }
.btn.b1 { color: #fff; padding: 1em 2em; border: 1px solid #c93f11; text-shadow: 1px 1px rgba(0,0,0,.2);
	background: rgba(244,113,48,1);
	background: -moz-linear-gradient(top, rgba(244,113,48,1) 0%, rgba(201,62,16,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(244,113,48,1)), color-stop(100%, rgba(201,62,16,1)));
	background: -webkit-linear-gradient(top, rgba(244,113,48,1) 0%, rgba(201,62,16,1) 100%);
	background: -o-linear-gradient(top, rgba(244,113,48,1) 0%, rgba(201,62,16,1) 100%);
	background: -ms-linear-gradient(top, rgba(244,113,48,1) 0%, rgba(201,62,16,1) 100%);
	background: linear-gradient(to bottom, rgba(244,113,48,1) 0%, rgba(201,62,16,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f47130', endColorstr='#c93e10', GradientType=0 ); }
.btn.b1:hover { border: 1px solid #f78750; box-shadow: 0 0 20px rgba(0,0,0,.3) }

button { line-height: 1.1; font-size: 110%; font-weight: 500; width: 310px; height: 72px; margin: .5em; vertical-align: middle; position: relative; border: 1px solid #2ea16d; text-align: left; -webkit-border-radius: 15px; border-radius: 15px; background: transparent; -webkit-transition: .2s; transition: .2s }
button:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 55px; height: 70px; background: #2ea16d url(../img/arr2.png) no-repeat 50% 50%; border-radius: 15px 40px 40px 15px }
button a { text-decoration: none; display: block; padding: 0 10px 0 70px; display: inline-block }
button:hover a { color: #fff !important }
button:hover { cursor: pointer; background-color: #2ea16d }

#content ul li { margin: 0 0 .7em; padding: 0.35em 0 0.4em 33px; line-height: 1.3; background: transparent url(../img/bullet.png) no-repeat 0 50% }
#content ol { list-style: decimal; margin-left: 1.1em }
#content ol li { margin: 0.3em 0 0; line-height: 1 }

#content table { margin: 0 0 2.5em; min-width: 50% }
#content th { color: #fff; padding: 0.6em 25px; vertical-align: middle; border: 0; background-color: #2b9967; text-align: left }
#content td { font-size: 100%; line-height: normal; padding: 10px 25px; border: 1px solid #b0cf88; border-width: 0 1px; vertical-align: top; background-color: #f2fee2 }
#content td p { margin: 0 }

.page-id-6 #content td { width: 33.333%; text-align: center; vertical-align: middle }

.form { margin: 0; padding: 0 2em 1em; background-color: #d9d9d9; border-bottom: 8px solid #d1d1d1; -webkit-border-radius: 5px; border-radius: 5px }
.form form { text-align: left }
.form form p { float: left; width: 29.333%; margin: 0 2% 10px 2% }
.form .w100, #antispam { width: 96%; margin: 1em 2%; float: none; clear: both }
.form p.w100 { padding: 1em 0 }
.form .select { width: 60%; margin: 4.4em 20% 1em }
.form .w100 p { float: none; width: 100%; margin: 0 0 3px }
.check input { position: relative; top: 0 }
.radio input { position: relative; top: 1px }
#antispam input { width: 20% }
input[type="text"], input[type="email"], textarea, .customSelect { color: #000; background-color: #fff; font-size: 100%; width: 100%; border: 1px solid #fff; margin: 4px 0 0 0; padding: 14px 9px; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: .4s; transition: .4s; -webkit-border-radius: 5px; border-radius: 5px }
.form textarea { height: 120px }
input[type="text"]:focus, input[type="email"]:focus, .form textarea:focus { border: 1px solid #d1d1d1; background-color: #eee }
input[type="submit"] {  }
.form .customSelect { -webkit-transition: none;; transition: none; background: #fff url(../img/customselect.png) no-repeat right 50% }
.form .customSelectInner {  }

.ok { margin: 0; padding: 1em; color: #fff; font-size: 120%; font-weight: 600; background-color: #79bd82 }
.error { margin: 0; padding: 1em; color: #fff; font-size: 120%; font-weight: 600; background-color: #d23139 }



/* RESPONSIVE */