@charset 'utf-8' ;

@font-face { font-family: 'Catamaran'; src: url('../font/Catamaran-Regular.woff2') format('woff2'), url('../font/Catamaran-Regular.woff') format('woff'), url('../font/Catamaran-Regular.ttf') format('truetype'); }
@font-face { font-family: 'Catamaran'; src: url('../font/Catamaran-Bold.woff2') format('woff2'), url('../font/Catamaran-Bold.woff') format('woff'), url('../font/Catamaran-Bold.ttf') format('truetype'); font-weight: 700; }
@font-face { font-family: 'Catamaran'; src: url('../font/Catamaran-Light.woff2') format('woff2'), url('../font/Catamaran-Light.woff') format('woff'), url('../font/Catamaran-Light.ttf') format('truetype'); font-weight: 300; }

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; outline: none; padding: 0; }

:root { font-size: 15px; }
::selection { background: #af1e2c; color: #fff; }

article, aside, figure, footer, header, main, nav, section { display: block; }

img, video { height: auto; max-width: 100%; }
img[src=""], img:not([src]) { background: #efefef; height: 7.5rem; padding: 1rem; width: 100%; }

@media only screen and (min-width: 30rem) {
	:root { font-size: 16px; }
}

/* [ TYPOGRAHPY ] */
html { font-family: sans-serif; overflow-y: scroll; }

body, button, input, select, textarea { font-family: 'Catamaran', Verdana, Arial; font-kerning: normal; text-rendering: optimizeLegibility; }

a, button, .button, input[type="submit"], select { cursor: pointer; }

body { background: #fff; color: #414141; font-size: 1rem; line-height: 1.68em; text-align: center; }

a { color: #34b151; text-decoration: underline; -moz-transition: all .15s ease-out; -o-transition: all .15s ease-out; -webkit-transition: all .15s ease-out; transition: all .15s ease-out; }    
a:active, a:focus, a:hover { text-decoration: none; }
a img { border: none; }

b, strong { font-weight: 700; }

h1, h2, .h2, h3, .h3, h4, .h4 { color: #2c2b2a; }
h1 { font-size: 2.75rem; font-weight: 400; line-height: 1.25em; margin: 0 0 .5em; }
h2, .h2 { font-size: 1.5625rem; font-weight: 700; line-height: 1.15em; margin: 1em auto .5em; }
h3, .h3 { font-size: 1.25rem; font-weight: 700; line-height: 1.2em; margin: 1.15em auto .4em; }
h4, .h4 { font-size: 1.125rem; font-weight: 700; line-height: 1.125em; margin: .5em auto .33em; }

p { margin: .125rem auto 1rem 0; }

p + ol, p + ul { margin-top: -.5rem; }

ol, ul { margin: .25rem auto .75rem 1.5rem; }
ul { list-style: none; }

sub, sup { font-size: .75rem; }
sub { bottom: -.2em; position: relative; vertical-align: bottom; }
sup { position: relative; top: -.4em; vertical-align: top; }

/* [ LAYOUT ] */
.center { margin: 0 auto; max-width: 1366px; position: relative; text-align: left; width: 96%; }

.row { margin: 0 auto; }
.clear { zoom: 1; }
.clear:after, .clear:before { content: ''; display: table; }
.clear:after { clear: both; }

@media only screen and (min-width: 600px) and (max-width: 899px) {
	.row.small { display: flex; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; }
	.row.small > [class^="col-"] { width: 48.5%; }
}

@media only screen and (min-width: 900px) {
	.row { display: flex; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; }

	.col-2, .col-4 { width: 48.5%; }
	.col-3, .col-5, .col-6 { width: 30%; }

	.col-33 { width: 33%; }
	.col-66 { width: 64%; }

	.col-25 { width: 25%; }
	.col-75 { width: 73%; }
}
@media only screen and (min-width: 900px) and (max-width: 1139px) {
	.col-2:nth-child(2n+1), .col-4:nth-child(2n+1) { margin-right: 1.5%; }
	.col-2:nth-child(2n+2), .col-4:nth-child(2n+2) { margin-left: 1.5%; }
}
@media only screen and (min-width: 1140px) {
	.col-4 { width: 22%; }
	.col-5 { width: 17.5%; }
	.col-6 { width: 14%; }
}

/* [ OBECNÉ ANIMACE ] */
html.js [data-atype="fade-down"] { opacity: 0; -moz-transform: translateY(-6rem); -ms-transform: translateY(-6rem); -o-transform: translateY(-6rem); -webkit-transform: translateY(-6rem); transform: translateY(-6rem); -moz-transition: opacity .4s ease-in, transform .33s linear; -o-transition: opacity .4s ease-in, transform .33s linear; -webkit-transition: opacity .4s ease-in, transform .33s linear; transition: opacity .4s ease-in, transform .33s linear; }
html.js .init[data-atype="fade-down"] { opacity: 1; -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); }

html.js [data-atype="fade-in"] { opacity: 0; -moz-transition: opacity .5s ease-in; -o-transition: opacity .5s ease-in; -webkit-transition: opacity .5s ease-in; transition: opacity .5s ease-in; }
html.js .init[data-atype="fade-in"] { opacity: 1; }

html.js [data-atype="fade-up"] { opacity: 0; -moz-transform: translateY(6rem); -ms-transform: translateY(6rem); -o-transform: translateY(6rem); -webkit-transform: translateY(6rem); transform: translateY(6rem); -moz-transition: opacity .5s ease-in, transform .4s linear; -o-transition: opacity .5s ease-in, transform .4s linear; -webkit-transition: opacity .5s ease-in, transform .4s linear; transition: opacity .5s ease-in, transform .4s linear; }
html.js .init[data-atype="fade-up"] { opacity: 1; -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); }

html.js [data-atype="scale"] { -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); -moz-transition: transform .5s ease-in-out; -o-transition: transform .5s ease-in-out; -webkit-transition: transform .5s ease-in-out; transition: transform .5s ease-in-out; }
html.js .init[data-atype="scale"] { -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }

/* [ HEADER ] */
.color-stripe { background: url(../img/color-stripe.png) repeat-x center top; height: 7px; }

/* [ MAIN ] */
#main { padding-bottom: 2rem; }

/* BANNER */
.banner { background: url(../img/banner-mob.jpg) no-repeat center top #3d2c27; background-size: cover; color: #fff; font-size: 1.375rem; font-weight: 200; line-height: 1.68em; overflow: hidden; }
.banner > .center { padding: 5vh 0 5vh; text-align: center; }
.banner h1 { color: #fff; font-size: 2.5rem; font-weight: 700; margin: 4rem 0 0; }
.banner h2 { color: #c8b4b0; font-size: 1.5rem; font-weight: 300; margin: .5rem 0 4rem; }
.banner .button { background: #22ae39; color: #fff; display: inline-block; font-size: 1.25rem; font-weight: 700; padding: 1.2rem 3.33rem 1rem; position: relative; text-decoration: none; }
.banner .button:active, .banner .button:focus, .banner .button:hover { background: #fff; color: #22ae39; }
.banner .button::before { -moz-animation-duration: .75s; -o-animation-duration: .75s; -webkit-animation-duration: .75s; animation-duration: .75s; border: 6px solid #22ae39; bottom: 0; content: ''; left: 0; position: absolute; right: 0; top: 0; -moz-transition: border .15s ease-out; -o-transition: border .15s ease-out; -webkit-transition: border .15s ease-out; transition: border .15s ease-out; }
.banner .button:active::before, .banner .button:focus::before, .banner .button:hover::before { -moz-animation-name: services-out; -o-animation-name: services-out; -webkit-animation-name: services-out; animation-name: services-out; border-color: #fff; }

@media only screen and (min-width: 40rem) {
	.banner { background-image: url(../img/banner.jpg); }
	.banner > .center { height: 100vh; max-height: 44rem; max-width: 52rem; padding: 7.5vh 0 10vh; }
}

@media only screen and (min-width: 48rem) {
	.banner h1 { font-size: 3.375rem; }
	.banner h2 { font-size: 1.875rem; }
}

@-moz-keyframes services-out {
	100% { bottom: -.75rem; left: -.75rem; opacity: 0; right: -.75rem; top: -.75rem; }
}
@-ms-keyframes services-out {
	100% { bottom: -.75rem; left: -.75rem; opacity: 0; right: -.75rem; top: -.75rem; }
}
@-o-keyframes services-out {
	100% { bottom: -.75rem; left: -.75rem; opacity: 0; right: -.75rem; top: -.75rem; }
}
@-webkit-keyframes services-out {
	100% { bottom: -.75rem; left: -.75rem; opacity: 0; right: -.75rem; top: -.75rem; }
}
@keyframes services-out {
	100% { bottom: -.75rem; left: -.75rem; opacity: 0; right: -.75rem; top: -.75rem; }
}

/* KONTAKTY */
.contacts { padding: 7.5rem 0 3rem; }
.contacts [class^="col-"] { color: #93acb3; font-size: 1.07rem; font-weight: 400; margin-bottom: 3rem; padding-top: 3rem; position: relative; text-align: center; }
.contacts [class^="col-"]::before { background: url(../img/sprite.png) no-repeat; content: ''; height: 40px; left: calc(50% - 20px); position: absolute; top: 0; width: 40px; }
.contacts [class^="col-"].call::before { background-position: 0 0; }
.contacts [class^="col-"].mail::before { background-position: -40px 0; }
.contacts [class^="col-"].adress::before { background-position: -80px 0; }

.contacts [class^="col-"] h3 { font-size: 1.5625rem; font-weight: 400; margin-top: 0; }
.contacts [class^="col-"].call h3 { color: #34b151; }
.contacts [class^="col-"].mail h3 { color: #0096b9; }
.contacts [class^="col-"].adress h3 { color: #ec9c2b; }

.contacts [class^="col-"] p a { color: #93acb3; }
.contacts [class^="col-"] p strong a { color: #2c2b2a; text-decoration: none; }
.contacts [class^="col-"] p strong { color: #2c2b2a; font-size: 1.5625rem; }

@media only screen and (min-width: 900px) {
	.contacts [class^="col-"]:not(:first-child) { border-left: 1px solid #ecf0f1; }
}

/* [ HELPER ] */
.hidden { display: none !important; }
.nowrap { white-space: nowrap; }

.text-big { font-size: 1.125em; }
.text-bigger { font-size: 1.5em; }
.text-bold { font-weight: 700; }
.text-center { text-align: center; }
.text-italic { font-style: italic; }
.text-light { font-weight: 300; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-small { font-size: .9em; }
.text-smaller { font-size: .8em; }
.text-white { color: #fff; }

.b0 { margin-bottom: 0 !important; }
.b1 { margin-bottom: 1em; }
.b2 { margin-bottom: 2em; }
.b3 { margin-bottom: 3em; }
.b4 { margin-bottom: 4em; }
.b5 { margin-bottom: 5em; }
.t0 { margin-top: 0 !important; }
.t1 { margin-top: 1em; }
.t2 { margin-top: 2em; }
.t3 { margin-top: 3em; }
.t6 { margin-top: 6em; }

/* [ TISK ] */
@media print {
	a[href]:after { content: " (" attr(href) ") "; }
}