/*
Theme Name: Talmer.cz
Theme URI: https://zajimava.cz
Author: Talmer.cz
Author URI: https://talmer.cz
Description: 
Version: 1.0
*/

::selection {background:#f00;}
::placeholder {color: #aaa;}
body, html {margin: 0px; padding: 0px; font-family: "Open Sans", sans-serif; color: #222;}
img {max-width: 100%; height: auto; border: none;}
figure {padding: 0; margin: 0;}
figcaption {padding: 5px 0; text-align: center; background-color: rgba(255,255,255,0.5); font-size: 75%; color: #666; margin: 15px 0;}
fieldset {border: 0;}
input, textarea, select, button {outline: none; box-sizing: border-box; font-family: inherit; font-size: 100%; max-width: 100%;}

ul {line-height: 140%;}
h1 {font-size: 200%; font-weight: 800; text-align: center; text-transform: uppercase; clear: both;}
h2 {font-size: 160%; font-weight: 700; text-align: center; color: #ed1c24; margin: 1.4em 0 0.7em 0; clear: both;}
h3 {font-size: 120%; font-weight: 700; clear: both;}
h4 {font-size: 110%; font-weight: 700;}
h1 a,h2 a, h3 a {text-decoration: none;}

table {border-collapse: collapse; margin: 10px auto; border-radius: 10px; text-align: left; background-color: #fff;}
th {padding: 15px; background-color: #ed1c24; border: 1px solid #d51920; color: #fff;}
td {padding: 10px; border: 1px solid #d51920;}
tr:nth-of-type(odd) {background-color: #fde8e9;}

.subtitle, .wp-block-subheading-block {font-weight: 300; font-size: 130%; text-align: center; margin: 20px 0 30px 0; line-height: 150%;}
.subtitle strong, .wp-block-subheading-block strong {font-weight: 400;}

header {background-color: #e5f7ff; background-image: url('img/header.jpg'); background-size: cover; background-repeat: no-repeat; background-position: top left; padding: 0 10px;}
header .topline {color: #fff; text-align: right; padding: 10px 0 20px 0; line-height: 20px;}
header .topline img {vertical-align: bottom; padding-right: 6px;}
header .head, header .head div {display: flex; justify-content: space-between;}
header .head a {display: inline-block; text-decoration: none;}
header #eshop {background-color: #ed1c24; font-size: 80%; text-transform: uppercase; border-radius: 45px; width: 90px; height: 90px; text-align: center; color: #fff; display: inline-block; line-height: normal;}
header #eshop img {padding-top: 15px;}
header .searchform {position: relative; margin: 29px;}
header .searchform input[type="search"] {height: 32px; border-radius: 3px; border: 1px solid #60baff; padding-left: 8px;}
header .searchform input[type="image"] {position: absolute; top: 4px; right:4px; height: 24px;}

.wp-block-columns {display: flex; width: 100%; justify-content: center;}
.wp-block-separator {width: 75%; height: 1px; background-color: #ed1c24; border: none; margin: 30px auto;}
.wp-block-columns ul {text-align: left;}
.wp-block-embed {text-align: center;}
.wp-block-media-text {display: grid; grid-template-columns: 25% 75%; align-items: center; justify-items: center;}
.gallery {text-align: center;}
.gallery figure {width: 280px; height: 280px; display: inline-block;}

.wp-block-cover {position: relative; z-index: 0;}
.wp-block-cover img {width: 100%;}
.wp-block-cover__inner-container {display: flex; flex-direction: column; align-items: flex-end; justify-content: center;}
.wp-block-cover h2 {font-size: 200%; background-color: #ed1c24; line-height: 120%; padding: 30px; color: #fff;}
.wp-block-cover ul {font-size: 150%; background-color: rgba(255,255,255,0.5); display: inline-block; padding: 20px 40px;} 
.wp-block-cover .wp-block-columns {justify-content: space-evenly; align-items: center;}

.home {display: flex; width: 100%; justify-content: center; margin: 30px 0;}
.home a {text-decoration: none;}
.home a:hover {}
.home p {background-repeat: no-repeat; background-position: center 60%; background-size: 50% 50%; height: 160px; color: #fff; box-shadow: 0 8px 6px -6px black; border-radius: 10px; margin: 10px; text-align: center; padding-top: 20px; text-transform: uppercase; font-weight: 700; position: relative;}
.home p::before {display: block; width: 100%; height: 100%; content: ''; position: absolute; top: 0; border-radius: 10px; background: repeating-linear-gradient(135deg, transparent, rgba(255,255,255,0.2) 4px, rgba(0,0,0,0.2) 4px); transition: all 1s;}
.home p:hover::before {background: none;}
.home p:hover {box-shadow: none;}

.klimatizace {background: #005da5 url('img/icons/klimatizace.svg');}
.tepelna-cerpadla {background: #e06800 url('img/icons/tepelna-cerpadla.svg');}
.rekuperace {background: #595959 url('img/icons/rekuperace.svg');}
.ventilatory {background: #ed1c24 url('img/icons/ventilatory.svg');}
.cisticky-vzduchu {background: #01961c url('img/icons/cisticky-vzduchu.svg');}
.odvlhcovace-vzduchu {background: #6c1faf url('img/icons/odvlhcovace-vzduchu.svg');}

article ul {list-style: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAPUlEQVQoU2NkQAJvZZT/w7jCT+4yIsuhcEASuBRjKMSlGKtCbIoZka1CdhM6m3iFuExB9xT5niEqePAFOADC2iRhHa9dOQAAAABJRU5ErkJggg=='); line-height: 170%;}
article ul ul {list-style: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAK0lEQVQoU2NkIBIwEqmOgTyFb2VU/iPbIPzkDtwgFBMHUCG+ECDP1/hMBADGHRALQPK0mgAAAABJRU5ErkJggg==');}
article a {color: #ed1c24;}
article .content > p, article .content > p, article .content > ul, article .content ol, article .content form, article .content h3, article .content h4, .wp-block-media-text {max-width: 800px; margin-left: auto; margin-right: auto;}
article .content form {max-width: 600px;}
article .wp-block-columns {text-align: center;}
article p {line-height: 150%;}

article .content > ul.news {display: flex; justify-content: center; padding: 0; /*flex-wrap: wrap;*/} 
.news li {display: flex; flex-direction: row; list-style: none; padding: 10px; width: 50%; box-sizing: border-box;} 
.news a {order: 2;}
.news time {order: 1; padding: 1px 6px; background-color: #f5f5f5; min-width: 70px; margin-right: 10px; font-size: 80%; display: flex; justify-content: center; align-items: center;}
                       
aside p {font-size: 80%;}
aside ul {list-style: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAT0lEQVQoU2NkIBIwgtS9lVH+D6KFn9wF87EBFIXoipENgJsAE0RWjFUhshNginEqRFcMcyvI7Vgdj+wMmOlY3YjuaxQT0U1BVozTamzhCACNdCwLSuzpzwAAAABJRU5ErkJggg==');}
aside a {color: #aaa;}

.cta {text-align: center; padding: 15px 0; position: relative; clear: both;}
.cta.big {padding: 95px 0 15px 0;}
.cta.big:after {content: ''; background: url('img/arrow.png'); background-repeat: no-repeat; background-position: center; opacity: 0.1; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; transition: 1s all;}
.cta.big:hover:after {opacity: 0.5;}
.cta a {background-color: #ed1c24; background: linear-gradient(to bottom, rgba(237,28,36,1) 0%, rgba(213,25,31,1) 100%); color: #fff; padding: 16px 30px 13px 30px; text-decoration: none; text-align: center; border-radius: 5px; display: inline-block; font-weight: 700; border-bottom: 5px solid #bd161c; letter-spacing: 0.02em; text-shadow: 0px 0px 2px rgba(0,0,0,0.5); transition: 0.5s all;}
.cta a:after {content: '►'; padding-left: 10px;}
.cta a:hover, .cta.big a:hover {box-shadow: inset 0 -200px 0 25px rgba(0,0,0,0.12);}
.aftercta {text-align: center; font-size: 75%; text-transform: uppercase; margin: 0 10px 40px 10px; font-weight: 300;}

.submit {background-color: #ed1c24; background: linear-gradient(to bottom, rgba(237,28,36,1) 0%, rgba(213,25,31,1) 100%); color: #fff; padding: 16px 30px 13px 30px; text-decoration: none; text-align: center; border-radius: 5px; display: inline-block; font-weight: 700; cursor: pointer; border: none; border-bottom: 5px solid #bd161c; letter-spacing: 0.02em; text-shadow: 0px 0px 2px rgba(0,0,0,0.5); transition: 0.5s all; font-family: inherit; font-size: 100%;}
.submit:hover {box-shadow: inset 0 -200px 0 25px rgba(0,0,0,0.12);}

.center, .has-text-align-center, .aligncenter {text-align: center;}
.wp-block-image.right {float: right; padding: 10px;}
p.left {text-align: left;}
.margins {margin: 25px 0;}
.padding {padding: 0 15px;}
.is-vertically-aligned-center {display: flex; align-items: center;}
.zprava {display: none;}

#wpcf7-f337-p7-o1 form {padding: 0;}
#wpcf7-f337-p7-o1 form .onlyemail {display: flex; flex-direction: column; padding-top: 10px;}
#wpcf7-f337-p7-o1 form .onlyemail span:first-of-type {padding-bottom: 5px;}
#wpcf7-f337-p7-o1 form .wpcf7-email {width: auto;}

.advantages {text-align: center;}
.advantages p {margin: 0 15px;}

.process {background-color: #ed1c24; color: #fff; margin-top: 25px; border-bottom: 3px solid #d51920;}
.process .wp-block-column {padding: 10px; box-sizing: border-box;}
.process h3 {font-size: 90%;}
.process .wp-block-column span {display: inline-block; width: 38px; height: 38px; text-align: center; font-size: 180%; font-weight: 900; border-radius: 50%; border: 2px dotted white; transition: all 1s; margin-right: 12px;}
.process .wp-block-column:hover span {border: 2px solid white;}

.about {background-color: #222; color: #ddd; padding: 15px 0;}
.about ul {padding-left: 20px; line-height: 180%;}
.about blockquote {margin: 0;}
.about blockquote p {font-style: italic; margin-top: 0;}
.about blockquote small {display: block; text-align: right;}
.about .reviews {display: flex;}
.about .reviews img {width: 68px; height: 68px; margin-right: 10px;}
.about #slideshow {position: relative; min-height: 120px;}
.about #slideshow > blockquote {position: absolute;}

article form {margin: 30px 0; background-color: #eee; padding: 75px 100px;}
article form div {margin: 10px 0;}
article form input, article form textarea, article form select {width: 100%; padding: 5px; border-radius: 3px; border: 1px solid #ddd; box-sizing: border-box;}
article form textarea {resize: none;}
article input[type="checkbox"] {width: auto;}
article .onlyemail input {padding: 10px; font-size: 130%;}

footer {background-color: #444; color: #ccc; padding: 15px 0;}
footer .copyright {font-size: 70%;}
footer a {color: #aaa; float: right; padding-left: 10px;}

#cookie-consent {background-color: #222; color: #ccc; padding: 2em; position: fixed; max-width: 600px; left: 0; bottom: 0; z-index: 9999; display: none; box-shadow: 10px 10px 5px rgba(0,0,0,0.25); }
#cookie-consent h2, #cookies-consent h3 {color: #ed1c24; margin-top: 0.7em;}
#cookie-consent p {font-size: 80%; text-align: left;}
#cookie-consent #cookie-choices {display: none; padding: 15px 0;}
#cookie-consent #cookie-choices > div {display: inline-block; text-align: left;}
#cookie-consent #cookie-choices label {margin-right: 5px;}
#cookie-consent span, #cookie-consent a {cursor: pointer; color: #fff;}
#cookie-consent label {cursor: pointer;}
#cookie-consent button, #show-cookie-consent {background-color: #ed1c24; background: linear-gradient(to bottom, rgba(237,28,36,1) 0%, rgba(213,25,31,1) 100%); color: #fff; padding: 16px 30px 13px 30px; text-decoration: none; text-align: center; border-radius: 5px; display: inline-block; font-weight: 700; cursor: pointer; border: none; border-bottom: 5px solid #bd161c; letter-spacing: 0.02em; text-shadow: 0px 0px 2px rgba(0,0,0,0.5); transition: 0.5s all; font-family: inherit; font-size: 100%; margin: 10px;}
#cookie-consent button:hover, #show-cookie-consent:hover {box-shadow: inset 0 -200px 0 25px rgba(0,0,0,0.12);}
#cookie-consent #save-cookie-choices {background: none; border: 1px solid #ed1c24; border-bottom: 5px solid #bd161c; color: #ed1c24;}

@media (max-width: 767px) {
    body {font-size: 14px;}
    .content {width: 100%; box-sizing: border-box;}
    
    .has-2-columns .wp-block-column, .has-3-columns .wp-block-column, .has-4-columns .wp-block-column, .has-5-columns .wp-block-column, .has-6-columns .wp-block-column {width: 100%}
    .wp-block-columns {flex-direction: column;}
    .wp-block-columns.reverse {flex-direction: column-reverse;}
    header {background-position: top right; position: relative;}
    header .content {flex-direction: column;}
    header .topline {display: flex; justify-content: space-between; align-items: center;}
    header .head {flex-direction: column; text-align: center;}
    header .head div {flex-wrap: wrap;}
    header .head div form {flex-basis: 100%;}
    header .searchform {margin: 20px;}
    header .searchform input[type="search"] {width: 100%;}
    header #logo {margin: 0 auto;}

    .home p {height: 120px;}
    .process .wp-block-column span {width: 32px; height: 32px;}
    article form {padding: 40px 20px; margin-bottom: 175px;}
    #wpcf7-f337-p7-o1 form {margin-bottom: 20px;}
	
    .wp-block-media-text {grid-template-columns: 100% !important;}
    .wp-block-media-text .wp-block-media-text__media {grid-column: 1; grid-row: 1;}
    .wp-block-media-text .wp-block-media-text__content {grid-column: 1; grid-row: 2;}
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {grid-column: 1; grid-row: 2;}
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {grid-column: 1; grid-row: 1;}
	
}
@media (min-width: 768px) {
    .has-2-columns .wp-block-column {width: 50%;}
    .has-3-columns .wp-block-column {width: 33.333333%;}
    .has-4-columns .wp-block-column {width: 25%}
    .has-5-columns .wp-block-column {width: 20%}
    .has-6-columns .wp-block-column {width: 16.666666%}
	
	.wp-block-media-text .wp-block-media-text__media {padding-left: 0px; padding-right: 20px;}
	.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {grid-column: 2; grid-row: 1; padding-left: 20px; padding-right: 0px;}
}

@media (max-width: 1249px) {
    h1 {font-size: 170%;}
    #menu {box-sizing: border-box; cursor: pointer; border-radius: 5px; background: rgba(255,255,255,0.5); border: none; padding: 10px; margin-left: 2px;}
    #lines {border-bottom: 7px double #ed1c24; border-top: 2px solid #ed1c24; height: 3px; width: 15px; display: inline-block;}
    
    nav {display: none; position: absolute; z-index: 2002; top: 50px; right: 10px;}
    nav .menu {display: block; background-color: rgba(255,255,255,0.95); padding: 10px;}
    nav li {display: block;}
    nav li ul {display: block;}
    nav a {display: block; text-decoration: none; color: #222; font-size: 80%; text-transform: uppercase; padding: 3px 0;}
    nav .menu > li > a {background-color: #ed1c24; color: #fff; padding: 4px 5px;}
    
    article .content {padding: 0 1%;}
    .about, footer {padding-left: 15px; padding-right: 15px;}
}

@media (min-width: 768px) and (max-width: 1249px) {
    header {min-height: 280px; background-position: top right; position: relative;}
    header .topline {display: flex; justify-content: flex-end; align-items: center;}
    #menu {margin-left: 20px;}
    header .head > a {width: 40%; text-align: center;}
    header .head > div {width: 60%; display: flex; justify-content: flex-end;}
    .has-4-columns, .has-6-columns {flex-wrap: wrap;}
    .has-4-columns .wp-block-column {width: 50%}
    .has-6-columns .wp-block-column {width: 33.333333%;}
}


@media (min-width: 1250px) {
    .content {width: 1200px; margin: 0 auto;}
    header {min-height: 400px;}
    #menu {display: none;}
    nav {display: block; background-color: rgba(255,255,255,0.5); margin: 5px 0;}
    nav ul {margin: 0; padding: 0;}
    nav .menu {display: flex; justify-content: space-between;}
    nav li {list-style: none; display: inline-block; padding: 0;}
    nav a {padding: 15px 25px; display: block; text-decoration: none; color: #222; font-size: 90%; text-transform: uppercase;}
    nav li:hover > ul {display: block;}
    nav .sub-menu {display: none; position: absolute; z-index: 2001; list-style: square; background-color: rgba(255,255,255,0.95);}
    nav .sub-menu li {transition: all 0.5s; display: block; background-color: transparent;}
    nav a:hover {background-color: rgba(237,28,36,1); color: #fff;}
    nav .current-menu-item > a {border-bottom: 1px solid #ed1c24;}
    .wp-block-cover__inner-container {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
    #wpcf7-f337-p7-o1 form {display: flex; max-width: 1200px; justify-content: space-evenly; align-items: center;}
    #wpcf7-f337-p7-o1 form > .oneline {display: flex; align-content: center;}
}