@charset 'UTF-8';
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,900&subset=latin,latin-ext);

/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/
body {background: #fff;}
body.loading {}
body.loading * {-moz-transition: none !important; -webkit-transition: none !important; -o-transition: none !important; -ms-transition: none !important; transition: none !important;}

body, input, textarea, select {font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 20pt; line-height: 1.75em; color: #39454b; letter-spacing: 0.5px;}
h1, h2, h3, h4, h5, h6 {font-weight: 900; color: inherit;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit; text-decoration: none;}
h2 {font-size: 2.25em; letter-spacing: 0; line-height: 1.25em;}
strong, b {font-weight: 900; color: inherit;}
em, i, blockquote {font-style: italic;}
a {color: #98c593; -moz-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; transition: all 0.2s ease-in-out, color 0.2s ease-in-out;}
sub, sup {position: relative; font-size: 0.8em;}
sub {top: 0.5em;}
sup {top: -0.5em;}
hr {border: 0; border-top: solid 1px #ddd;}
blockquote {border-left: solid 0.5em #ddd; padding: 1em 0 1em 2em;}
p, ul, ol, dl, table {margin-bottom: 1em;}

header {margin-bottom: 1em;}
header p {display: block; margin: 1em 0 0 0; padding: 0 0 0.5em 0;}
footer {margin-top: 2em;}
br.clear {clear: both;}

p.perex {width: 75%; margin: 0 auto;}

#vimeofilm {width: 178px; height: 100px; margin: 0 auto; padding: 0; overflow: hidden; background-image: url('../images/vimeofilm.png'); background-repeat: no-repeat;}
#vimeofilm > a {opacity: 0.3;}
#vimeofilm > a:hover {opacity: 1; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -o-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}

div.advertising {width: 300px; text-align: center; float: right; margin: -350px 0 0 0; padding: 0; overflow: hidden;}
div.advertising > img {display: block; border: 0; z-index: 99999;}

/* Flyer */
#flyer {position: fixed; z-index: 10000; top: 3em; left: 0; margin: 0; padding: 0; background: none;}
#flyer img.hider {position: absolute; top: 80px; left: 200px; visibility: hidden;}
#flyer:hover img.hider {visibility: visible;}

/* Sections/Articles */
section, article {margin-bottom: 3em;}
section > :last-child, article > :last-child, section > .content > :last-child, article > .content > :last-child, section:last-child, article:last-child, .row > section, .row > article {margin-bottom: 0;}

/* Images */
.image {position: relative; display: inline-block;}
.image:before {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.image img, .image.featured, .image.full {display: block; width: 100%;}
.image.featured, .image.centered {margin: 0 0 2em 0;}
.image.left {float: left; margin: 0 2em 2em 0;}
.image.centered {display: block;}
.image.centered img {margin: 0 auto; width: auto;}

/* Lists */
ul.default {list-style: disc; padding-left: 1em;}
ul.default li {padding-left: 0.5em;}		
ul.icons {cursor: default;}	
ul.icons li, ul.icons a, ul.menu li, ul.actions li {display: inline-block;}
ul.icons a {width: 2em; height: 2em; line-height: 2em; text-align: center; border: 0;}
ul.menu {cursor: default;}
ul.menu li {line-height: 1em; border-left: solid 1px rgba(145,146,147,0.25); padding: 0 0 0 0.5em; margin: 0 0 0 0.5em;}
ul.menu li:first-child {border-left: 0; padding-left: 0; margin-left: 0;}
ul.actions {cursor: default;}
ul.actions li {margin: 0 0 0 0.5em;}
ul.actions li:first-child {margin-left: 0;}

ol.default {list-style: decimal; padding-left: 1.25em;}
ol.default li {padding-left: 0.25em;}

/* Forms */
form {}
form label {display: block;}
form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {display: block; width: 100%; padding: 0.75em; background: none; border: solid 2px rgba(185,186,187,0.25); color: inherit; border-radius: 0.5em; outline: none; -moz-appearance: none; -webkit-appearance: none; -o-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out, color 0.2s ease-in-out; transition: all 0.2s ease-in-out, color 0.2s ease-in-out;}
form input[type="text"]:hover, form input[type="email"]:hover, form input[type="password"]:hover, form select:hover, form textarea:hover {}
form input[type="text"]:focus, form input[type="email"]:focus, form input[type="password"]:focus, form select:focus, form textarea:focus {border-color: #9ac8e9;}
form input[type="text"], form input[type="email"], form input[type="password"], form select {line-height: 1em;}
form textarea {min-height: 8em;}
form .formerize-placeholder, form ::-webkit-input-placeholder, form :-moz-placeholder, form ::-moz-placeholder, form :-ms-input-placeholder {color: rgba(145,146,147,0.85) !important;}
form ::-moz-focus-inner {border: 0;}

/* Tables */
table, table.default {width: 100%;}
table.default tbody tr:nth-child(2n+2) {background: #f4f4f4;}
table.default td {padding: 0.5em 1em 0.5em 1em;}
table.default th {text-align: left; font-weight: 900; padding: 0.5em 1em 0.5em 1em;}
table.default thead {background: #444; color: #fff;}
table.default tfoot {background: #eee;}
table.default tbody {}

/* Buttons */
.button {background-color: #98c593; border: 0; border-radius: 3.5em; color: #fff; cursor: pointer; display: inline-block; height: 3.5em; line-height: 3.5em; outline: 0; padding: 0 2em 0 2em; position: relative; text-align: center; text-decoration: none; -moz-appearance: none; -webkit-appearance: none; -o-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.button.down {width: 5em; height: 5em; line-height: 4.5em; padding: 0; background-image: url('../images/overlay/dark-arrow.svg'); background-position: center center; background-repeat: no-repeat; text-indent: -10em; overflow: hidden;}
.button.down.anchored {bottom: 0; border-bottom: 0; border-radius: 3em 3em 0 0; height: 4.5em; margin-left: -2.5em;}
.button.anchored {position: absolute; left: 50%;}
.button:hover {background-color: #a8d5a3;}
.button:active {background-color: #88b583;}
.button.style2 {background-color: transparent; border: solid 2px #e5e6e7; color: inherit;}
.button.style2:hover {background-color: rgba(145,146,147,0.035);}
.button.style2.down {background-image: url('../images/overlay/arrow.svg');}

/* Box */
.box {background: #fff; color: #39454b; padding: 2em;}
.box.style2 {padding: 3.5em 2.5em 3.5em 2.5em;}

/* Main */
.main {position: relative; margin: 0; overflow-x: hidden;}
.main.style1 {text-align: center; padding: 10em 0 10em 0;}
.main.style1 h2 {font-size: 4.25em; line-height: 1em; letter-spacing: 0;}
.main.style1 .content {opacity: 1.0; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -o-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}
.main.style1.inactive {}
.main.style1.inactive .content {opacity: 0;}

.main.style2 {padding: 10em 0 10em 0; overflow: hidden;}
.main.style2 .content {position: relative; width: 50%; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -o-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}
.main.style2.left, .main.style2.right, .main.style2.inactive, .main.style2.inactive .content {}
.main.style2.left .content {left: 0;}
.main.style2.right .content {left: 50%;}
.main.style2.inactive.left .content {left: -50%;}
.main.style2.inactive.right .content {left: 100%;}

.main.style3 {text-align: center; padding: 6em 0 6em 0;}
.main.style3 .content {}
.main.style3 .content > header {margin-bottom: 2em;}
.main.style3.primary {background: #fff;}
.main.style3.secondary {background: #f5f6f7;}

.tiny {margin-top: -2.5em !important;}

/* Dark */
.dark, .dark a {color: #fff;}
.dark .button.style2 {border-color: inherit; background-color: rgba(64,64,64,0.05);}
.dark .button.style2:hover {background-color: rgba(255,255,255,0.1);}
.dark .button.style2.down {background-image: url('../images/overlay/dark-arrow.svg');}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/
#header {position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; background: #fff; background: rgba(255,255,255,0.95); height: 3em; line-height: 3em; box-shadow: 0 0 0.15em 0 rgba(0,0,0,0.1);}
body {padding-top: 3em;}
#logo {position: absolute; left: 1em; top: 0; height: 3em; line-height: 3em; letter-spacing: -1px;}
#logo a {font-size: 1.25em;}
#nav {position: absolute; right: 0.5em; top: 0; height: 3em; line-height: 3em;}
#nav ul {margin: 0;}
#nav ul li {display: inline-block; margin-left: 0.5em; font-size: 0.9em;}
#nav ul li a {display: block; color: inherit; text-decoration: none; height: 3em; line-height: 3em; padding: 0 0.5em 0 0.5em; outline: 0;}
.external {color: #88b583 !important;}
.current {font-weight: 900 !important;}
#mobil {display: none;}

/* Intro */
#intro {background: url('images/intro.jpg'), url('../images/intro.jpg'); background-size: 256px 256px, cover; background-attachment: fixed, fixed; background-position: top left, bottom center;}

/* One */
#one {background: url('images/one.jpg'), url('../images/one.jpg'); background-size: 256px 256px, cover; background-attachment: fixed, fixed; background-position: top left, center center;}

/* Two */
#two {background: url('images/two.jpg'), url('../images/two.jpg'); background-size: 256px 256px, cover; background-attachment: fixed, fixed; background-position: top left, center center;}

/* Work */
#work, #work .row.images, #work .row.images.inactive {}
#work .row.images .image {position: relative; top: 0; left: 0; opacity: 1.0; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -o-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}
#work .row.images.inactive .image {opacity: 0;}
#work .row.images.inactive .image.l {left: -14em;}
#work .row.images.inactive .image.r {left: 14em;}
			
/* Contact */
#contact {padding-bottom: 0; overflow: hidden;}
#contact .box {position: relative; bottom: 0; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); -o-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);}
#contact.inactive {}
#contact.inactive .box {bottom: -30em;}

/* Nabídka */
#nabidka {text-align: left;}
img.space {margin: 1em 0 0 0;}

/* Kalendar */
#kalendar {text-align: left;}
#kalendar h2 {font-size: 2em; line-height: 1em; font-weight: 300;}
#kalendar h3 {font-size: 1.2em; line-height: 1em; margin: 0.3em 0 0 0;}
#kalendar h5 {font-size: 0.8em; margin: -0.3em 0 0 0;}
#kalendar h6 {font-size: 1.4em; color: #bbb; line-height: 2.4em; font-weight: 300;}
#kalendar .row {border-bottom: 2px dashed #9ac8e9;}

/* Blog */
#blog {text-align:  left;}
#blog h2 {font-size: 2em; line-height: 1em; font-weight: 300;}
#blog h5 {font-size: 0.8em; margin: -0.3em 0 0 0;}

/********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/
#footer {position: relative; height: 5em; line-height: 5em; margin: 0; background: #39454b; color: #999; color: rgba(185,186,187,0.5); overflow: hidden;}
#footer a {color: #999; color: rgba(185,186,187,0.5);}
#footer a:hover {color: #bbb; color: rgba(185,186,187,1.0);}
#footer .fa {opacity: 0.3;}
#footer .fa:hover {opacity: 1.0;}
#footer a > img {vertical-align: text-bottom;}
#footer .actions {position: absolute; left: 1em; top: 0.25em; height: 5em; line-height: 5em; margin: 0;}
#footer .actions li {font-size: 1.25em; margin: 0;}
#footer .actions li a {padding: 0.5em;}
#footer .menu {position: absolute; right: 2em; top: 0; height: 5em; line-height: 5em; margin: 0;}
#footer .menu li {font-size: 0.9em;}

/*********************************************************************************/
/* Poptrox                                                                       */
/*********************************************************************************/
.poptrox-popup {background: #fff; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; -o-box-sizing: content-box; -ms-box-sizing: content-box; box-sizing: content-box; padding-bottom: 3em; box-shadow: 0 0.1em 0.15em 0 rgba(0,0,0,0.15);}
.poptrox-popup .loader {width: 48px; height: 48px; background: url('../images/overlay/loader.gif'); position: absolute; top: 50%; left: 50%; margin: -24px 0 0 -24px;}
.poptrox-popup .caption {position: absolute; bottom: 0; left: 0; background: #fff; width: 100%; height: 3em; line-height: 2.8em; text-align: center; cursor: default; z-index: 1; font-size: 0.9em;}
.poptrox-popup .nav-next, .poptrox-popup .nav-previous {position: absolute; top: 0; width: 50%; height: 100%; opacity: 0; cursor: pointer; background: rgba(0,0,0,0.01); -moz-transition: opacity 0.2s ease-in-out; -webkit-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; -webkit-tap-highlight-color: rgba(255,255,255,0);}
.poptrox-popup .nav-next:before, .poptrox-popup .nav-previous:before {content: ''; position: absolute; width: 96px; height: 64px; background: url('../images/overlay/poptrox-nav.svg'); top: -moz-calc(50% - 1.5em); top: -webkit-calc(50% - 1.5em); top: -o-calc(50% - 1.5em); top: -ms-calc(50% - 1.5em); top: calc(50% - 1.5em); margin: -32px 0 0 0;}
.poptrox-popup:hover .nav-next, .poptrox-popup:hover .nav-previous {opacity: 0.5;}
.poptrox-popup:hover .nav-next:hover, .poptrox-popup:hover .nav-previous:hover {opacity: 1.0;}
.poptrox-popup .nav-previous:before {-moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -o-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); -ms-filter: "FlipH"; filter: FlipH;}
.poptrox-popup .nav-next, .poptrox-popup .nav-next:before {right: 0;}
.poptrox-popup .nav-previous, .poptrox-popup .nav-previous:before {left: 0;}
.poptrox-popup .closer {position: absolute; top: 0; right: 0; width: 64px; height: 64px; text-indent: -9999px; z-index: 2; opacity: 0; -moz-transition: opacity 0.2s ease-in-out; -webkit-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; -webkit-tap-highlight-color: rgba(255,255,255,0);}
.poptrox-popup .closer:before {content: ''; display: block; position: absolute; right: 16px; top: 16px; width: 40px; height: 40px; border-radius: 100%; box-shadow: inset 0 0 0 2px #fff; background: url('../images/overlay/poptrox-closer.svg') center center; color: #fff !important;}
.poptrox-popup:hover .closer {opacity: 0.5;}
.poptrox-popup:hover .closer:hover {opacity: 1.0;}
			
/*********************************************************************************/
/* Touch Mode                                                                    */
/*********************************************************************************/
body.touch, body.touch .poptrox-popup {}
body.touch .main {background-attachment: scroll !important;}
body.touch .poptrox-popup .nav-next, body.touch .poptrox-popup .nav-previous, body.touch .poptrox-popup .closer {opacity: 1.0 !important;}
