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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
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;
}


/* inter-Variable - latin */
@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: oblique 0deg 10deg;
    font-weight: 1 1000;
    src: url('font/inter/Inter-VariableFont_slnt\,wght.ttf') format('truetype');
}
  
.body{
    max-width: 100%;
    font-family:"Inter", sans-serif;
    color: #0F172A;
    background-color:whitesmoke
}  

article h1, .nabidka h1, .kontakt h1{
    text-align: left;
    padding-bottom: 1em;
    padding-top: 1em;   
}

.logo {
    background-image: url('img/logo_small.svg');
    background-repeat: no-repeat;
    text-decoration: none;
    padding: 1em ;
    outline: none;
    position: absolute;
} 

.napln {
    position: absolute;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
}
    
.motto {
    display: flex;
    text-decoration: none;
    outline: none;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
    text-align: center;
    justify-self: center;
}

.email{
    display: block;
    text-decoration: none;
    outline: none;
    transition: 0.2s;
}

.header-wrapper{
    display: flex;
    background-repeat: no-repeat;
    background-attachment: local;
}
 
.kontakt {
    font-family:"Inter", sans-serif;
    position: relative;
    padding-left: .6em;
    left:50%;
    transform: translate(-50%);
}

.kontakt p {
    font-size: smaller;
}

.kontakty {
    display: grid;
    grid-template-columns: repeat(2, 1fr, minmax(40%, 1fr)); /* Automatické rozdělení na sloupce */
    gap: 2em;
    justify-items: center;
     max-width: 100%; 
    position: relative;
    left: 50%;
    transform: translate(-50%);
    padding: 1em;
}

.telefon-button, .email-button {
    background: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    max-width: 30em;
    max-width: 100%;
    border: none;       
}
      
.circle-icon {
    width: 3em;
    height: 3em;
    min-height: 3em;
    min-width: 3em;
    border-radius: 50%;
    border: 2px solid darkgoldenrod;
    background-color: none; /* Barva pozadí kruhu */
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
      
.circle-icon img {
    max-width: 80%;
    max-height: 80%;  
}
      
.text-container {
    display: flex;
    flex-direction: column;
    height: 3em;
    color: #0F172A;
}  
    
.prvni-text {
    line-height: 1;
    text-align: left; 
    font-size:larger;
    font-weight: bolder;
    margin-bottom: 0em;
    align-self: flex-start
}

.druhy-text {
    line-height: 2;
    text-align: left;
    font-size: larger;
    font-weight:normal;
    margin-bottom: 0em;
}

.citat {
    background-color: #f5f5f5;
    flex-direction: column;
    display: block;
    text-align: center;
    height: 9.5em;
    width: 103vw; 
    position: absolute;
    margin: -9.5em auto auto auto;
    font-size: 1em;
    font-family:"Inter", sans-serif;
    color: #0f172a71;
    font-weight:normal;
    font-style: italic;
    left: 0em;
}
    
h4 {
    font-weight: normal;
    font-size: 1em;
    top: 2em;
    width: 90vw;
}

.logo1 {
    display: block;
    background-image: url('img/logo_large.svg');
    background-repeat: no-repeat;
    text-decoration: none;
    background-size: contain;
    padding: 0.7em;
    transition: 0.2s;
    height: 20px;
    width: 200px;
    justify-content: center;
    align-items: center;
}


.logo1:hover{
    background-color: rgba(245, 245, 245, 0.112);
}        

footer{
    background-color:#333333;
    display:block;
    flex-direction: column;
    align-items:center;
    width: 103vw;
    position: absolute; 
}
        
.modul {
    height: 11.5em;
    display: block;
    position: absolute;
    width: 103vw;
    left: 50%; 
    transform: translateX(-50%);
}
 
.stred-d {
    font-family:"Inter", sans-serif;
    font-size:xx-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin: 6em auto 2em auto;          
}


.modul > * {
    margin-bottom: .5em;
    padding: .5em;
}

.modul > :last-child {
    margin: 0;
}



@media only screen and (max-width:324px) { /*šířka obrazovky max 324px */
 
.body {
    font-family:"Inter", sans-serif;
}
    
.logo {
    position: absolute;
    height: 1em;
    width: 7em;
    top: 1em;
    left: 1em;
}

.header-wrapper header hr, .navigace {
    display: none
}

.napln {
    top: 5em;
    left: 2em;
    font-size:smaller ;
    font-weight:400;
}
    
.menu-button {
    display:inline-block;
    flex-direction: column;
    cursor: pointer;
    background: none;
    border: none;
    position:absolute; 
    top: 1.0em; 
    right: 1em; 
    z-index: 999;
     
}
  
.bar {
    width: 2em;
    height: 0.2em;
    background-color:whitesmoke;
    margin: 5px 0;
} 

.motto {
    font-size:medium ;
    font-weight:800;
    margin-top: 3.5em;
}

.email {
    height: 2.5em;
    width: 80vw;
    background-image: url('img/tlacitko1.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    display:flex;
    position: absolute;
    bottom: 2em;
    left:50%;
    transform: translate(-50%, -50%);
    max-width: 100%; 
    max-height: 100%;
    transition: 1.5s;
}

.email:hover {
    filter: brightness(70%);
}

.header-wrapper{
    background-image:url('img/cover_2100x3100.jpeg');
    height:100vh;
    max-height: 1932px;
    max-width:100vw;
    width: 100vw;
    display: flex;
    align-items:center;
    justify-content: center;
    -webkit-box-align: center;
    background-size:cover;
    margin:-8px 0 0 0;
    background-position: center bottom;
    background-repeat:no-repeat;
    position: relative;
    z-index: 1;
}

.nabidka {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    font-family: Inter;
    padding-left: 0.6em;
    padding-bottom: 1em;
    
}

.nab_1 {
    display: flex;
    width: 95%;
    height: 20em;
    background-image: url('img/nabidka\ 707x770.jpg');
    background-size: cover;
    background-position:center;
    margin: 0.3em 0.5em 0.5em 0em;
    background-repeat: no-repeat;
    transition: 1.5s;
}   
       
.nab_2 {
    display: flex;
    width: 95%;
    height: 20em;
    background-image: url('img/nabidka2\ 742x812.jpg');
    background-size:cover;
    background-position:center;
    margin: 1em 0.5em 0.5em 0em;
    background-repeat: no-repeat;
    transition: 1.5s;
}  

.nab_1:hover, .nab_2:hover{
    filter:grayscale(70%);
}

.container-main-content {
    display: flex;
    font-family:"Inter", sans-serif;
    font-weight:400;
    line-height: 1.6em;
    width: 95%;
    padding-left: 0.8em;
    padding-bottom: 2em;
}

article h1, .nabidka h1, .kontakt h1{
    font-size:medium;
    font-weight: 600;
}

.citat, h4, p {
    font-size: x-small;
    line-height: 1.9em;
}

h4 {
    text-align: left;
    padding-left: .6em;
    padding-top: 2em;
}
    

footer{
    background-color:#333333;
    display:block;
    flex-direction: column;
    align-items:center;
    height: 21.5em;
    width: 100vw;
}
    
    
.logo1 {
    height: 2em;
    width: 10em;
    background-image: url('img/logo_large.svg');
    background-repeat: no-repeat;
    background-size: contain;
    text-decoration: none;
    padding: 0em;
    outline: none;
    transition: 0.5s;
    margin: 1.5em auto .5em auto; 
}

.logo1:hover{
    background-color: rgba(245, 245, 245, 0.112);
}

.stred-d {
    font-family:"Inter", sans-serif;
    font-size:xx-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin-bottom: -10em;   
}
                
hr{
    border: solid darkgoldenrod 0.5px;
    width: 100vw;
    margin-top:0;
} 

.kontakty {
    justify-items: start;
    margin-bottom: 9em;

}

.kontakt p {
    font-size: 0.8em;
}
    
.circle-icon {
    width: 2.4em;
    height: 2.4em;
    min-height: 2.4em;
    min-width: 2.4em;
}

.circle-icon img {
    max-width: 60%;
    max-height: 60%;  
}
.text-container {
    height: 2.4em;
    display: flex;
}
.prvni-text {
    font-size: 1em;
    align-self: flex-start;
    color: #0F172A;
}

.druhy-text {
    font-size: 1em;
    line-height: 2em;
    color: #0F172A;
}

.modul {
    width:100vw ;
    display: grid;
    gap: .5px;
}

.leva-str {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
    text-align: center;
    font-size: smaller;
    margin: .5em auto 2em auto;
}

.stred-h {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}

.stred-d {
    grid-column: 1 / 2;
    grid-row: 4 / 5;
    font-family:"Inter", sans-serif;
    font-size:xx-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin: 2.5em auto .5em auto;
}

.prava-str {
    grid-column: 1 / 2;
    grid-row: 3 / 4;
    font-family: "Inter", sans-serif;
    color: whitesmoke;
    text-align: center;
    font-size: smaller;
    padding-top: 2em;
}

.fcb {
    background-image: url('img/fcb.svg');
    background-repeat: no-repeat;
    top: 50%;
    padding: .3em 5em;
    transition: 1.0s;
      } 

.fcb:hover {
    background-color: rgba(245, 245, 245, 0.112);
}
  
.modul > * {
    margin-bottom: 0;
}
}




@media only screen and (min-width: 325px) and (max-width:640px) { /*šířka obrazovky max 640px */
    
.body {
    font-family: "Inter", sans-serif;
}

.logo {
    position: absolute;
    height: 0.9em;
    width: 6.5em;
    top: 1em;
    left: 1em;
}

.navigace, .header-wrapper header hr {
    display: none
}

.menu-button {
    display:inline-block;
    flex-direction: column;
    cursor: pointer;
    background: none;
    border: none;
    position:absolute; 
    top: 1em; 
    right: 1em; 
    z-index: 999; 
}
  
.bar {
    width: 2em;
    height: 0.2em;
    background-color:whitesmoke;
    margin: 5px 0;
}

.napln {
    top: 5em;
    left: 2em;
    font-size:smaller ;
    font-weight:300;
}

.header-wrapper header hr {
    position: absolute;
    top: 4em;
    left:0%;
    width: 100vw;
    border: solid whitesmoke 0.5px;
}

.motto {
    font-size:large ;
    font-weight:800;
    margin-top: 0em;
}

.email {
    height: 2.7em;
    width: 60%;
    background-image: url('img/tlacitko1.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    display:flex;
    position: absolute;
    bottom: 2em;
    left:50%;
    transform: translate(-50%, -50%);
    max-width: 100%; 
    max-height: 100%;
    z-index: 9;
    transition: 1.5s;
}

.email:hover {
    filter: brightness(70%);
}

.header-wrapper{
    background-image:url('img/cover_2100x3100.jpeg');
    height:100vh;
    max-height: 1932px;
    max-width:100vw;
    width: 100vw;
    display: flex;
    align-items:center;
    justify-content: center;
    -webkit-box-align: center;
    background-size:cover;
    margin:0 0 0 0;
    background-position: center bottom;
    background-repeat:no-repeat;
    position: relative;
    z-index: 1;
}

article h1, .nabidka h1, .kontakt h1 {
    font-size:large;
    text-align: left;
    font-weight: 600;
    padding-bottom: 1em;
    padding-top: 1em;
}

.nabidka {
    width: 95%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    font-family:"Inter", sans-serif;
    padding-left: 0;
    padding-bottom: 1em;
    
}

.nab_1 {
    display: flex;
    width: 100%;
    height: 35em;
    background-image: url('img/nabidka\ 707x770.jpg');
    background-size: cover;
    background-position:center;
    margin: 0.3em 0.5em 1em 0em;
    background-repeat: no-repeat;
}   
      
.nab_1:hover, .nab_2:hover{
    filter: grayscale(70%);
}

.nab_2 {
    display: flex;
    width: 100%;
    height: 35em;
    background-image: url('img/nabidka2\ 742x812.jpg');
    background-size:cover;
    background-position:center;
    margin: 1em 0.5em .5em 0em;
    background-repeat: no-repeat;
}  

.container-main-content {
    font-size: 0.9em;
    font-weight: 400;
    font-family:"Inter", sans-serif;
    padding-left: 0.8em;
    line-height: 1.6em;
    width: 95%;
}

.kontakty {
    justify-items: start;
    margin-bottom: 10em;
}
.kontakt {
    font-size: .9em;
    width: 95%;
}

.prvni-text {
    font-size: 15px;
}
    
.druhy-text {
    font-size: 14px;
}

.citat, h4, p {
    font-size: 0.9em;
    line-height: 1.9em;
    font-weight: 400;
}

h4 {
    text-align: left;
    padding-left: .6em;
    padding-top: 2em;
}

hr{
    border: solid darkgoldenrod 0.5px;
    width: 100vw;
    margin-top:0;
}  

footer{
    background-color:#333333;
    display:block;
    flex-direction: column;
    align-items:center;
    height: 16.5em;
    width: 103vw;
    position: absolute;
}
    
.logo1 {
    height: 1.8em;
    width: 9.5em;
    background-image: url('img/logo_large.svg');
    background-repeat: no-repeat;
    background-size: contain;
    text-decoration: none;
    padding: 0em;
    outline: none;
    transition: 0.6s;
    margin: 1em auto 1em auto;
}

.logo1:hover{
    background-color: rgba(245, 245, 245, 0.112);
}
        
.modul {
    width:100vw ;
    display: grid;
    gap: .1px;
}

.leva-str {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
    text-align: left;
    font-size: smaller;
    font-weight: 400;
    margin: .0em auto 2em 0em;
}

.stred-h {
    grid-column: 1 / 3;
    grid-row: 1 / 2;  
}

.stred-d {
    grid-column: 1 / 3;
    grid-row: 4 / 5;
    font-family:"Inter", sans-serif;
    font-size:x-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin: 2.5em auto .8em auto;
}

.prava-str {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
    text-align: right;
    margin-bottom: 2em;
    font-size: smaller;
    padding-right: 2em;
}

.fcb {
    background-image: url('img/fcb.svg');
    background-repeat: no-repeat;
    top: 50%;
    padding: .3em 3.7em;
}

.fcb:hover {
    background-color: rgba(245, 245, 245, 0.112);
}
  
.modul > * {
    margin-bottom: 0;
}
}


@media only screen and (min-width:641px) and (max-width: 1024px) {  /* šířka obrazovky max 601 až 1024px */
   
.menu-button, .header-wrapper header hr {
    display: none;
} 

.body {
    font-family: 'Inter', sans-serif;
    max-width: 900px;
}

   
.logo {
    position: absolute;
    width: 7em;
    top: 1em;
    left: 3em ;
}
   
.napln {
    top: 5em;
    left: 3.7em;
    font-size:small ;
    font-weight:300;
}

.navigace {
    justify-content: space-around; 
    width: 40%;
    padding: 1em;
    position:absolute;
    top: 0em; 
    right: 0em;
    z-index: 999; 
}

.navigace ul {
    list-style-type: none;
    max-width: 90vw;
    padding: 0 0.5em 0 0;
    display: flex;
    justify-content: center
}


.navigace ul li a {  
    text-decoration: none;
    font-family:"Inter", sans-serif;
    font-size: small;
    font-weight: 400;
    color:whitesmoke;
    padding: 0em 1em 0.7em 1em;
    border-radius: 0;    
}

.navigace ul li a:hover {
    border-bottom: 2px solid darkgoldenrod;
}


.container .motto {
    font-size:xx-large;
    font-weight:700;
    left: 25%;
    transform: translateX(-50%);
    top: 50%;
    transform: translateY(-50%);
    
}

.email {
    height: 2.7em;
    width: 12em;
    background-image: url(img/tlacitko.png);
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    right: 2em;
    margin-top: 13em;
    max-width: 100%; 
    max-height: 100%;
    z-index: 9;
    transition: 1s;
}  

.email:hover {
    filter: brightness(70%);
}  

.header-wrapper {
    max-width: 100%;
    height: 38em;
    background-image: url('img/cover_2045x1275.jpeg');
    display: flex;
    background-size:cover;
    background-repeat: no-repeat;
    margin-top: 0%;
    align-items:center;
    justify-content: center;
    -webkit-box-align: center;
} 

.container-main-content {
    font-size: 0.95em;
    font-weight: 500;
    display: flex;
    font-family:"Inter", sans-serif;
    padding-left: 3em;
    line-height: 1.6em;
    width: 90%;
    padding-bottom: 2em;
} 

article h3 {
    font-size: small;
    font-weight:normal;
    color: darkgrey;
    margin-top: 3em;
    font-style: italic;
    text-align:justify;
}

.nabidka {
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    font-family: "Inter", sans-serif;
    padding-left: 0.6em;
    padding-bottom: 1.5em;
}

article h1, .nabidka h1, .kontakt h1{
    font-size:x-large;
    text-align: left;
    font-weight: 700;
    padding-bottom: 1em;
    padding-top: 1em;
}
        
.nab_1 {
    display: flex;
    width: 100%;
    height: 25em;
    background-image: url('img/nabidka\ 1\ 1400x696.png');
    background-size: cover;
    background-position:bottom;
    margin: 0.3em 0.5em 1em 0em;
    background-repeat: no-repeat;
    transition: 1.5s;
}   
              
.nab_1:hover, .nab_2:hover{
    filter: grayscale(70%);
}
        
.nab_2 {
    display: flex;
    width: 100%;
    height: 25em;
    background-image: url('img/nabidka\ 2\ 1400x725.png');
    background-size:cover;
    background-position:bottom;
    margin: 1em 0.5em 0.5em 0em;
    background-repeat: no-repeat;
    transition: 1.5s;
}  



hr{
    border: 0.5px solid darkgoldenrod;
    width: 100%;
    margin-top:0;
}    

.kontakt {
    max-width: 90%;
    font-size: 1em;
}

.kontakty {
    grid-template-columns: repeat(2, 1fr);
    padding-bottom: 12em;
}   

.citat, h4, p {
    font-size: 1em;
    line-height: 1.9em;
    font-weight: 400;
}

h4 {
    text-align: center ;
    padding-left: .6em;
    padding-top: 2em;
}

footer{
    background-color:#333333;
    display:block;
    flex-direction: column;
    align-items:center;
    height: 11.5em;
    width: 103vw;
    position: absolute;
}

.modul {
    width: 90vw;
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 2px;
}

.leva-str {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    font-family: "Inter", sans-serif;
    color: whitesmoke;
    text-align: left;
    padding-left: 0em;
    font-weight: 400;
    font-size:small;
    padding-top: 2em;
}

.stred-h {
    grid-column: 2 / 4;
    grid-row: 1 / 2; 
}

.stred-d {
    grid-column: 2 / 4;
    grid-row: 2 / 3;
    font-family:"Inter", sans-serif;
    font-size:x-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin: 3em auto auto auto;
}
.prava-str {
    grid-column: 4 / 5;
    grid-row: 1 / 3;
    font-family:"Inter", sans-serif;
    color: whitesmoke;
    text-align: right;
    padding-right: 2em;
    margin-bottom: 2em;
    padding-top: 2em;
    font-size: small;
}

.fcb {
    background-image: url('img/fcb.svg');
    background-repeat: no-repeat;
    padding: 0.5em 4em;
    transition: 0.6s;
}  

.fcb:hover {
    background-color: rgba(245, 245, 245, 0.112);
}
  
.modul > * {
    margin-bottom: 0;
}

.logo1 {
    height: 1.9em;
    width: 9.8em;
    background-image: url('img/logo_large.svg');
    background-repeat: no-repeat;
    background-size: contain;
    text-decoration: none;
    padding: 0em;
    outline: none;
    transition: 0.6s;
    margin: 2em auto 1em auto;
}

.logo1:hover{
    background-color: rgba(245, 245, 245, 0.112);
}

}
        
@media only screen and (min-width:1025px) {  /* šířka obrazovky větší jak 1024px */
    
.menu-button {
    display: none;
}

body{
    max-width: 64em;
    margin: auto;
    font-family: "Inter", sans-serif;
    height: 100vh;
} 

.logo {
    display: flex;
    width: 7em;
    margin: 0.75em auto auto 3em;
}

.napln {
    margin: .3em auto auto 3.7em;
    font-size:small ;
    font-weight:300;
}

.navigace{
    display:flex;
    justify-content: space-around; 
    width: 100%;
    padding: 1em;
    position:relative;
    top: 0em; 
    left: 21em;
    z-index: 999;
} 

.navigace ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

li a:hover {
    border-bottom: 2px solid darkgoldenrod;
}

li{  
    display: inline; 

}

li a{
    text-decoration: none;
    color:whitesmoke;
    font-size:small;
    font-weight:400;
    padding:1em;
    border-radius: 0;
}
 
.motto {
    font-size:xx-large;
    font-weight:700;
    margin: 8em auto auto 10em;
    
}
        
.email {
    background-image: url('img/tlacitko.png');
    background-repeat: no-repeat;
    margin: 12em 2em 0.5em 50em;
    padding: 1.5em 6em;
    transition: 1s;
}  
          
.email:hover {
    filter: brightness(70%);
}  

hr{
    border: solid darkgoldenrod 0.5px;
    width: 100%;
    margin-top:0;
}    

.header-wrapper {
    width: 64em;
    height: 38em;
    display: flex;
    background-image: url('img/cover_5924x3353.jpeg'); 
    background-position:bottom;
    background-size:cover;
    margin-top: 0%;
    background-repeat: no-repeat;
}

.header-wrapper header hr {
    width: 95%;
    margin-top: em;
    border: solid whitesmoke 0.5px;
}   

.container-main-content {
    width:90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    font-weight:300;
    line-height: 1.5em;
    font-size: smaller;
}

article h1, .nabidka h1, .kontakt h1{
    font-size:x-large;
    text-align: left;
    font-weight: 700;
    padding-bottom: 1em;
    padding-top: 1em;
}

.nabidka {
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

.nab_1 {
    display: flex;
    width: 100%;
    height: 400px;
    background-image: url('img/nabidka\ 1440x1024.jpeg');
    background-size: cover;
    background-position:center;
    margin: 1em auto 1em auto;
    transition: 1s;
    } 
        
.nab_2 {
    display: flex;
    width: 100%;
    height: 400px;
    background-image: url('img/nabidka\ 1440x1024_2.jpg');
    background-size:contain;
    background-position:center;
    margin: 1.5em auto 1em auto;
    transition: 1s;
}  

.nab_1:hover, .nab_2:hover{
    filter: grayscale(70%);
}

.kontakt {
    max-width: 90%;
    font-family: "Inter", sans-serif;
}

.kontakty {
    grid-template-columns: repeat(2, 1fr);
    max-width: 90%;
    padding-bottom: 13em;
} 

.citat, h4, p {
    font-size: 1em;
    line-height: 1.9em;
    font-weight: 400;
}

h4 {
    text-align: center ;
    padding-top: 2em;
}           
    
footer{
    background-color:#333333;
    display:flex;
    height: 11.5em;
    width: 103vw;
    position: absolute;
    left: 0%;
}

.modul {
    width:1024px ;
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    grid-template-columns: clamp(100px, 50%, 300px);
    gap: 2px;
}

.leva-str {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    color: whitesmoke;
    text-align: left;
    padding-left: 3em;
    font-weight: 300;
    padding-top: 2em;
    font-size: small;
}

.stred-h {
    grid-column: 2 / 4;
    grid-row: 1 / 2; 
}

.stred-d {
    grid-column: 2 / 4;
    grid-row: 2 / 3;
    font-size:xx-small;
    font-weight:200;
    text-align: center;
    color: darkgray;
    margin: 3em auto auto auto;
}

.prava-str {
    grid-column: 4 / 5;
    grid-row: 1 / 3;
    color: whitesmoke;
    text-align: right;
    padding-right: 5em;
    margin-bottom: 2em;
    padding-top: 2em;
    font-size: smaller;
    font-weight: 300;
}

.fcb {
    background-image: url('img/fcb.svg');
    background-repeat: no-repeat;
    top: 50%;
    padding: .5em 3.8em;
    transition: 1s;
}  

.fcb:hover {
    background-color: rgba(245, 245, 245, 0.112) ;
}
      
.modul > * {
    margin-bottom: 0;
}

.logo1 {
    height: 2em;
    width: 9.8em;
    background-image: url('img/logo_large.svg');
    background-repeat: no-repeat;
    background-size: contain;
    text-decoration: none;
    padding: 0em;
    outline: none;
    transition: 1s;
    margin: 1em auto 1em auto;
}

.logo1:hover{
    background-color: rgba(245, 245, 245, 0.112);
}
}