body{
            font-family: sans-serif;
            margin: 0;
            background-color: white;
            color: rgb(49, 49, 49);
        }
        header{
            background-color: rgb(65, 65, 65);
            padding: 0px 0;
        }
        div.top{
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            padding: 0px 5%;
        }
        section nav a {
            font-size: 2vh;
        }
        section.logoText{
            align-items: baseline;
        }
        .aboutUs{
            border-left: solid rgb(79, 78, 78);
        }
        div.top button.jedna{
            border-left: solid rgb(79, 78, 78);
        }
        div.top button{
            color: white;
            border: none;
        }
        nav.start{
            display: flex;
            padding: 0px;
            align-items: center;
        }
        nav.end button{
            border-right: solid  rgb(79, 78, 78);
            padding: 10px;
        }
        nav.end{
            padding: 0px; 
            align-items: center;
        }
        nav.start a {
            border-right: solid rgb(79, 78, 78);
            padding: 10px;  
        }
        div.top nav a {
            color: white;
        }
        div#name{
            display: flex;
            flex-direction: row;
            
        }
        section.bImgAll{
            padding-top: 20px;
            display: flex;
            justify-content: space-between;
            margin-bottom: 40px;
            align-items: center;
        }
        div.mid{
            
            display: flex;
            flex-direction: row;
            justify-content: space-around;
            flex: 1;
        }
        div.bImgText1{
            display: block;
            background-image: url(img/auto.jpg);
            border-radius: 2px;
            position: relative; 
            padding: 200px 100px 250px 100px;
            background-size: cover; 
            background-position: center;
            flex: 1;
            margin-right: 40px;
        
        }
        div.bImgText2{
            display: block;
            background-image: url(img/gta-v-keyart.jpg);
            border-radius: 2px;
            position: relative; 
            background-size: cover; 
            flex: 1;
            padding: 200px 100px 250px 100px;
            margin-left: 40px;
        }
        section h1{
            font-size:  5vh ;
        }
        section  h1 {
            background-image: url(img/ikona.ico);
            background-size:auto  59px;       
            background-repeat: no-repeat;   
            background-position: left top;   
            padding-left: 25%;
            text-align: left;
            margin-top: 0px;
        }
        label {
            display: flex;
            align-items: center;
            cursor: pointer;
            font-size: 1.2em;
        }
        input[type="checkbox"]:checked + label::before {
            background-color: #4CAF50;
            border-color: #4CAF50;
        }
        input[type="checkbox"]:checked + label .checkbox-label {
            color: #4CAF50;
        }
        a {
            text-decoration: none;
        }
        button{
            background-color: rgb(65, 65, 65);
        }
        section{
            display: flex;
            flex-direction: row;
            padding: 0% 5%;
        }
        div.logo{
            padding: 40px;
            padding-left: 0px;
            flex: 1;
        }
        div.searchBar{
            padding: 60px;
            flex: 2;
        }
        div.searchBar button{
            background-size: auto 20px;       
            background-repeat: no-repeat;   
            background-position:  left ;
            color: white;
            padding: 10px;
            padding-left: 25px;
            padding-right: 10px;
        }
        img{
            max-width: max-content;
            width: 100%;
        }
        input[type="text"] {
            padding: 10px;
            width: 300px;
            margin: 0px;
        }
        input[type="checkbox"]{
            color: green;
            background-color: white;
        }
        section.checkboxAll{
            display: flex;
            flex-direction: column; 
            text-align: center;
        }
        section.checkboxAll div{
            display: flex;
            flex-direction: row;
        }
        section.checkboxAll div#hnusnejBorder{
            border: solid rgb(228, 223, 223);
            border-radius: 0;
        }

        div.infAll{
            display: flex;
            gap: 20px;     
        }
        .inf{
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 12px;
            text-align: center;
            border: solid 2px rgb(212, 228, 150);
        }
        div.inf{
            padding: 20px;
            flex: 1;
            display: flex;
            flex-direction: column;
        }
        div.inf h3{
            margin-bottom: 0px;
        }
        .toggle{
            background-color: white;
            color: rgb(12, 213, 12);
        }
        section.checkboxAll form{
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 10px;
        }
        section.checkboxAll div form{
            padding: 20px;
        }
        section.checkboxAll a {
            color: black;
            font-weight: 700;
            padding: 20px;
        }   
        section.checkboxAll div.categories{
            border-radius: 0px 0px 2px 2px;
            background-color: rgb(249, 249, 228);
            padding: 20px;
            margin-bottom: 20px;
            border-top: 0px; 
        }
        .bImgText1 article{
            background-color: rgb(146, 187, 61);
            position: absolute;
            bottom: 20px; 
            left: 20px;
            color: white;
            padding: 10px 15px; 
            border-radius: 5px;
            font-size: 10px; 
            align-items: flex-start;
        }
        .bImgText2 article{
            align-items: flex-start;
            background-color: rgb(146, 187, 61);
            position: absolute;
            bottom: 20px; 
            left: 40px;
            color: white;
            padding: 10px 15px; 
            border-radius: 5px;
            font-size: 10px; 
        }
        section.bottom div{
            flex: 1;  
        }
        section.bottom div article img{
            max-width: max-content;
            width: 100%; 
        }
        div.bike{
            margin-left: 20px;
            padding: 5px;
        }
        div.controller{
            margin-right: 20px;
        }
        section.bottom div {
            padding: 20px;
            align-items: baseline;

        }
        section.bottom div img{
            padding-bottom: 20px;
            border-bottom: solid rgb(228, 223, 223)
        }
        section.bottom div article h2{
            font-size: 0,5em;
            margin-top: 20px;
        }
        section.bottom{
            padding-bottom: 80px;
        }
        div.all{
            padding: 5%;
            display: flex;
            flex-direction: row;
            padding-bottom: 20px;
        }
        div.all article{
            justify-content: space-evenly;
            padding-top: 20px;
        }
        div.all div article a {
            background-color: rgb(27, 202, 27);
            color: white;
            padding: 10px;
            border-radius: 10px;
        }
        footer{
            border-top: solid rgb(206, 204, 204);
    
        }
        footer{
            border-top: solid rgb(206, 204, 204);
        }
        div.totalCenter{
            display: flex;
            flex-direction: row;
            align-items: flex-end;
            padding: 20px 5%;
            justify-content: space-between;
        }
        div.end{
            display: flex;
            flex-direction: row;
        }
        footer h1{
            display: flex;
            flex-direction: row;    
        }
        footer nav {
            display: flex;
            flex-direction: row;
            align-items: flex-end;
        }
        footer nav a {
            padding:10px 20px;
            color: black;
        }
        div.end2{
            align-items: flex-end;
            margin-bottom: 21px;
        }
        footer h1{
            background-image: url(img/ikona.ico);
            background-size: auto 40px;       
            background-repeat: no-repeat;   
            background-position: left top;    
            padding: 10px 0px 0px 42px;     
            text-align: left;
            font-size: 4vh;
        }
    @media(max-width:1280px){
        header{
            display: none;
        }
        section.aboutUs{
            justify-content: center;
            padding: 20px;
        }
        .infAll{
            align-self: center;
        }
        section{
            display: flex;
            flex-direction: column;
            text-align: center;
        }
        section div.searchBar{
            display: flex;
            flex-direction: row;
            align-self: center;
        }
        section div.logo{
            align-self: center;
        }
        section div.categories{
            display: flex;
            flex-direction: column;
        }
        section.bImgAll {
            display: flex; 
            flex-direction: column;
            margin: 20px;
        }
        section.bottom div.all{
            display: flex; 
            flex-direction: column;
            align-items: center; 
        }
        div.mid{
            display: none;
        }
        section.bottom article {
            padding: 40px;  
        }
        div.infAll{
            align-items: center;
        }
        footer div.totalCenter{
            display: flex; 
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
        }
        div.end{
            display: flex; 
            flex-direction: column;
            align-self: center;
        }
        footer nav {
            display: flex;
            flex-direction: column;
            align-items: stretch; 
            text-align: center;
        }
    }