@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Old+Standard+TT:ital,wght@0,400;0,700;1,400&family=Oswald:wght@200;300;400;500;600;700&family=Smooch&display=swap');
html,body {margin:0;padding:0}
/*#stajnia .event-img{width:100%} */ 
.owl-item {filter:blur(2px)}
.owl-item.center{filter: none;}
#stajnia {max-width:100%;font-family: 'Oswald';margin:auto;width: 100%;overflow-x: hidden;}
#stajnia a,#stajnia a:hover{text-decoration: none;}
#stajnia textarea{resize: vertical;max-height: 200px;}
#stajnia #header{background-image: url('./img/bg.png');width: 100%;height: 100vh;background-repeat: no-repeat;background-size: cover;background-position: center;}
#stajnia #about #header{background-image: url('./img/ostajnibg2.png');width: 100%;height: 100vh;background-repeat: no-repeat;background-size: cover;background-position: center;}
#stajnia #header .menu-container{display: flex;justify-content: space-between;margin:auto;width:90%;max-width: 1200px;}
#stajnia #header .menu-container .menu{display: flex;}
#stajnia #header .menu-container .menu-item{color:#fff;font-size: 21px;margin:50px 0px 10px 50px}
#stajnia #header .menu-container .logo-menu{margin:30px 0}
#stajnia #header .menu-container .logo-small{width:100%}
#stajnia #header .logo{width:100%;text-align: center;margin:120px auto 0px}
#stajnia #about #header .logo{width:100%;text-align: center;margin:250px auto 350px}
#stajnia #header .head-copy{font-size: 22px;color:#fff; text-align: center;width: 100%;max-width: 800px;margin:auto}
#stajnia #header .icon{margin:20px auto;text-align: center;}
#stajnia #header .icon-img{width:auto}

#stajnia .mobilogo{max-width: 300px;}

#stajnia .border-menu {width:90%;border-bottom: 1px solid #6E7883;padding:0 5%}
#stajnia #contactpage .menu-container{max-width:1200px;display: flex;justify-content: space-between;margin:auto;}
#stajnia #contactpage .menu-container .menu{display: flex;}
#stajnia #contactpage .menu-container .menu-item{color:#000;font-size: 21px;margin:50px 0px 10px 50px}
#stajnia #contactpage .menu-container .logo-menu{margin:30px 0}
#stajnia #contactpage .menu-container .logo-small{width:100%}

#stajnia #prods .menu-container{max-width:1200px;display: flex;justify-content: space-between;margin:auto;}
#stajnia #prods .menu-container .menu{display: flex;}
#stajnia #prods .menu-container .menu-item{color:#000;font-size: 21px;margin:50px 0px 10px 50px}
#stajnia #prods .menu-container .logo-menu{margin:30px 0}
#stajnia #prods .menu-container .logo-small{width:100%}

#stajnia #content {max-width: 1920px;margin:auto}
#stajnia #content .zapbox{width: 100%;margin:50px auto}
#stajnia #content .cont-img{width:30%;height: 700px;object-fit: cover;}
#stajnia #content .grey-box{background-color:#F0F0F1;display:flex;padding: 0 5%;
position: absolute;height: 1000px;width: 30%;left: 30%;right: 30%;margin-top:-250px;}
#stajnia #contactpage #content .grey-box{height: 850px;margin-top: -50px;}
#stajnia #content .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;}
#stajnia #content .copy{font-size: 22px;line-height: 44px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;}
#stajnia #contactpage .border-img{height:100px;width:2px}
#stajnia #content2 {margin:200px auto; text-align: center; max-height: 1900px;}
#stajnia #content2 .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:150px auto 150px}
#stajnia #content2 .copy{font-size: 22px;line-height: 44px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;max-width: 90%;padding:5%}
#stajnia #content2 .smooch{font-family: 'Smooch', cursive;font-size: 55px;line-height: 70px; color:#282E36; padding:5%}
#stajnia #content2 .event-container{width: 460px;}
#stajnia #content2 .arrow{position: relative; top:-1650px;left:5px;height: 1700px;}
#stajnia #content2 .arrow.ardown{top:-1600px}
#stajnia #content .btn{width:300px;padding:20px 50px;text-align:center;background-color: #282E36;color: #fff;font-family: 'Barlow Condensed'; font-size: 26px;margin: auto}
#stajnia #content .btn-container{width:100%;text-align: center;margin-bottom: 100px;}



#stajnia #content3 .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:150px auto 50px;text-align: center;}
#stajnia #content3 .star{width:100%;margin:auto;max-width:1100px}
#stajnia #content3 .star img{width:100%;margin:auto}
#stajnia #content3 .copy{font-size: 22px;line-height: 44px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;max-width: 800px;width:100%;margin:auto;margin-bottom:60px}
#stajnia #content3 .btn{width:300px;padding:20px 50px;text-align:center;background-color: #282E36;color: #fff;font-family: 'Barlow Condensed'; font-size: 26px;margin: auto}
#stajnia #content3 .btn-container{width:100%;text-align: center;}



#stajnia #content4 .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:150px auto 50px;text-align: center;}
#stajnia #tvn-box{background-image: url('./img/tvn_bg.png');width: 100%;height: 700px;background-repeat: no-repeat;background-size: cover;background-position: center;display: flex;}

#stajnia #content4 .copy{font-size: 22px;line-height: 33px; color:#fff;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;max-width: 400px;width:100%;text-align: center;}

#stajnia #content4 .btn-container{width:100%;text-align: center;}
#stajnia #content4 .btn{width:300px;padding:10px 25px;text-align:center;background-color: transparent;color: #fff;font-family: 'Barlow Condensed'; font-size: 26px;margin: auto;border: 1px solid #fff;}


#stajnia #content4 #tvn-box .btn-container{width:100%;text-align: center;}
#stajnia #content4 #tvn-box .btn{width:300px;padding:10px 25px;text-align:center;background-color: transparent;color: #fff;font-family: 'Barlow Condensed'; font-size: 26px;margin: auto;border: 1px solid #fff;}

#stajnia #content5 img{width:100%}

#stajnia #contact .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:150px auto 50px;text-align: center;}
#stajnia #contact .copy{font-size: 22px;line-height: 44px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;max-width: 800px;width:100%;width:300px;margin-bottom:60px}

#stajnia #contact .contact-icons {display: flex;height: 300px;width:50%}
#stajnia #idx #contact .contact-icons {display: flex;height: 300px;width:48%;padding-left: 2%;}
#stajnia #contactpage #contact .contact-icons {display: flex;height: 300px;width:49%;padding-right:1%}
#stajnia #contactpage #contact .contact-icon{font-family: 'Barlow Condensed';font-style: normal;font-weight: 300;font-size: 22px;line-height: 150%;text-align: right;letter-spacing: 0.05em;
color: #000000;}
#stajnia #contactpage #contact .title{font-family: 'Barlow Condensed';font-style: normal;font-weight: 600;font-size: 30px;line-height: 36px;text-align: right;color: #000000;}
#stajnia #contact .contact-icon a{font-family: Barlow Condensed;font-style: normal;font-weight: normal;font-size: 28px;line-height: 30px;color: #6E7883;margin-left: 20px;}
#stajnia #contact .event-container{width: 50%;}
#stajnia #contact .arrow-container{width:10px}


#stajnia #prods .tit{font-size: 30px;line-height: 36px; color:#282E36;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:150px auto 50px;text-align: center;}
#stajnia #prods #contact .contact-icons {display: flex;height: 300px;width:49%;padding-right:1%}
#stajnia #prods #contact .contact-icon{font-family: 'Barlow Condensed';font-style: normal;font-weight: 300;font-size: 22px;line-height: 150%;text-align: right;letter-spacing: 0.05em;
color: #000000;}
#stajnia #prods #contact .title{font-family: 'Barlow Condensed';font-style: normal;font-weight: 600;font-size: 30px;line-height: 36px;text-align: right;color: #000000;}
#stajnia #prods #cars .tit{font-size: 30px;line-height: 36px; color:#fff;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;margin:100 auto 50px;text-align: center;}
#stajnia #prods #cars .copy{font-size: 22px;line-height: 33px; color:#fff;font-family: 'Barlow Condensed', sans-serif;font-weight: 300;max-width: 800px;width:100%;text-align: center;margin:auto}
#stajnia #prods .car-name{width:100%;max-width: 700px;margin: auto;text-align: center;background: none;}
#stajnia #prods .car-name .car-name-img{width:100%;}
#stajnia #prods .car-type{width:100%;max-width: 700px;margin: auto;text-align: center;position:relative; z-index:10;}
#stajnia #prods .car-type .car-type-img{width:750px;height:350px}
#stajnia #prods .car-bg{padding:200px 0 100px;position: relative;top:-170px;}

#stajnia #prods .btn-container{width:100%;text-align: center;}
#stajnia #prods .btn{width:99%;padding: 30px 0;text-align:center;background-color: transparent;color: #fff;font-family: 'Barlow Condensed'; font-size: 30px;margin:0 auto;border: 1px solid #fff;}
#stajnia #prods .gal{width: 30%;min-width: 370px;display: flex;flex-direction: column; justify-content: space-between;max-height: 600px;overflow: hidden;}
#stajnia #prods .galbig{width: 100%;max-height: 600px;margin:50px auto}
#stajnia #prods .gal .gal-img{width:724px;height: 600px;object-fit: cover;}
#stajnia #prods .gal .gal-img:hover{width: 724px;height: 600px;opacity: 0.8;cursor:pointer;object-fit: cover;}
#stajnia #prods .warszawa .gal .gal-img{width:100%;height: 600px;object-fit: cover;}
#stajnia #prods .warszawa .gal .gal-img:hover{width: 100%;height: 600px;opacity: 0.8;cursor:pointer;object-fit: cover;}
#stajnia #prods .galbig .gal-img{width:100%;height: 600px;object-fit: cover;}
#stajnia #prods .galbig .gal-img:hover{opacity:0.8;width:100%;height: 600px;cursor:pointer;object-fit: cover;}
#stajnia #prods .btn-container .btn{width:240px;padding:10px 0px;text-align:center;background-color: transparent;color: #fff;font-family: 'Barlow Condensed'; font-size: 26px;margin: auto;border: 1px solid #fff;cursor: pointer;}
#stajnia #prods #cars .square .copy{width:30%;min-width:350px;}
#stajnia #prods .square {width:50%;min-width: 600px;display: flex;justify-content: center;}
#stajnia #prods .square .square-box{width:30%;padding:50px 10%;height: 140px;}
#stajnia #prods #cars .square .tit{font-size:70px;color: #fff;font-weight: 200;margin:auto;text-align: left;}
#stajnia #prods #cars .square .copy{font-size: 22px; color: #fff;font-weight: 500;margin:auto}
#stajnia .tit .smaller{font-size:30px}
#stajnia #prods #cars .square .copy.nomw{font-size: 22px; color: #fff;font-weight: 500;margin:auto;min-width: 0;width: 100%;text-align: left;margin-bottom:30px}
#stajnia #prods #cars .square-box::before {
        position: relative;
        content: url(./img/vec.png);
        top: 20px;
        left: -33%;
    }


#stajnia #footer {width: 100%;background-color: #282E36;height: 250px;display: flex;text-align: center;margin-top:150px}
#stajnia #about #footer {margin-top:0}
#stajnia #contactpage #footer{margin-top:250px}
#stajnia #prods #footer{margin-top:0}


#stajnia #footer .part{width:30%}
#stajnia .titfoot{color:#827A6D;font-family: 'Barlow Condensed';font-weight: 600;font-size: 30px;line-height: 36px;margin-bottom:30px}
#stajnia .copyfoot{color:#fff;font-family: 'Barlow Condensed';font-weight: 300;font-size:22px;line-height: 33px;}

/* -------- flex ------------- */
#stajnia .flex-container {display: flex;}
#stajnia .wrap{flex-wrap: wrap;}
#stajnia .nowrap{flex-wrap: nowrap;}
#stajnia .row{flex-direction: row;}
#stajnia .column{flex-direction: column;}
#stajnia .aic{align-items: center;}
#stajnia .ais{align-items: flex-start;}
#stajnia .aie{align-items: flex-end;}
#stajnia .jcsb{justify-content: space-between;}
#stajnia .jcc{justify-content: center;}
#stajnia .jce{justify-content: flex-end;}
#stajnia .jcsa{justify-content: space-around;}
#stajnia .jcse{justify-content: space-evenly;}
#stajnia .h100{height:100%}

/* ------------ Form --------- */
#stajnia .form-control{font-family: Barlow Condensed;
        font-style: normal;
        font-weight: 300;
        font-size: 22px;
        line-height: 33px;
        display: flex;
        align-items: center;
        text-align: center;
        letter-spacing: 0.05em;
        color: #6E7883;
        background: transparent;
        border:none;
        outline: none;
        border-bottom:1px solid #6E7883;
        margin:auto;
        text-align: center;
        width: 100%;
}
#stajnia .btn-sub{
        width: 300px;
        padding: 10px 25px;
        text-align: center;
        background: #282E36;
        color: #fff;
        font-family: 'Barlow Condensed';
        font-size: 26px;
        margin: auto;
        border: none;
        border-radius: 0px;
    }
    #stajnia #contactpage .btn-sub{margin:50px auto 100px}
/* ---------- Margin -------- */
#stajnia .mb20p{margin-bottom: 20%;}
#stajnia .mt50{margin-top:50px}
#stajnia .mt80{margin-top:80px}
#stajnia .mt40{margin-top:40px}
#stajnia .mr50{margin-right:50px}
#stajnia .mar50{margin:50px}
#stajnia .mr100{margin-right:100px}
#stajnia .mr130{margin-right:130px}
#stajnia .mar100{margin: 100px!important;}
#stajnia .mt100{margin-top:100px}
#stajnia .mt150{margin-top:150px}
#stajnia .mt200{margin-top:200px}
#stajnia .mt400{margin-top:400px}
#stajnia .mlm1{margin-left:-1px}
#stajnia .ml8{margin-left:-8px}
#stajnia .w50{width:50%}
#stajnia .w460{width:460px}
#stajnia .w700{width: 700px;}
#stajnia .w100{width: 100%;}
#stajnia .mw1200{max-width: 1200px;margin:auto}
#stajnia .mh600{max-height: 600px;}
#stajnia .pos130{position: relative;top:130px}
#stajnia .pos70{position: relative;top:40px}
#stajnia .pos30{position: relative;top:30px}
#stajnia .pos110{position: relative;top:120px}
#stajnia .pos100{position: relative;top:100px}
#stajnia .posr100{position: relative;right:100px}
#stajnia .posr170{position: relative;right:170px}
#stajnia .posr180{position: relative;right:180px}
#stajnia .posr50{position: relative;right:50px}
#stajnia .posr250{position: relative;right:250px}
#stajnia .posr150{position: relative;right:150px}
#stajnia .posr200{position: relative;right:200px}
#stajnia .pos100{position: relative;top:100px}
#stajnia .pos100{position: relative;top:100px}
#stajnia .pos100{position: relative;top:100px}
#stajnia .pos100{position: relative;top:100px}
#stajnia .pb20{padding-bottom: 19px;}
#stajnia .top170{top: -170px!important;}
#stajnia .top154{top:-154px!important}
#stajnia .top162{top: -162px !important;}
#stajnia .top165{top: -165px !important;}
#stajnia .wid150{width:150%}

/* -------- Colors ---------- */
#stajnia .warszawa{background-color:#6E7883;}
#stajnia .fiats{background-color:#827A6D}
#stajnia .fiatp{background-color:#282E36}
#stajnia .audi{background-color:#6E7883}
#stajnia .darkgrey{background-color: #59626C}
#stajnia .darkbrown{background-color: #67635D}
#stajnia .lightgrey{background-color: #99A1A8;}
#stajnia .lightbrown{background-color: #9B958A;}


/* --------- Font & allign ----- */
#stajnia .tl{text-align: left;}
#stajnia .tr{text-align: right;}
#stajnia .tc{text-align: center;}
#stajnia .legal{font-family: Barlow Condensed;
        font-style: normal;
        font-weight: 300;
        font-size: 22px;
        line-height: 150%;
        text-align: center;
        letter-spacing: 0.05em;
        color: #282E36;
        padding:20px}


/*--------- for JS -------- */
#stajnia .hide{display: none!important;}
#stajnia .tohide{cursor: pointer;}
#stajnia .showmobi{display: none;}

.custombtn{
        display: flex;
        margin: 30px auto;
        justify-content: space-around;
        position: relative;
        top: 300px;
        z-index: 999;
      }
.customNextBtn, .customPreviousBtn{
     
          padding: 10px;
          margin-left: 5px;
          cursor: pointer;
      }


/*---- Animation ----*/
#stajnia #header .icon-img:hover{
        -webkit-animation-name: slideOutDown;
        animation-name: slideOutDown;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        }
        @-webkit-keyframes slideOutDown {
        0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        }
        100% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        }
        }
        @keyframes slideOutDown {
        0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        }
        100% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        }
        } 

        
        @media screen and (max-width:1450px) {
                #stajnia #prods .car-type .car-type-img{height:320px}
        }
        /* --------- Media ----------- */
 

        @media screen and (max-width:1000px) {
              #stajnia .hidemobi{display: none!important;} 
              #stajnia .showmobi{display: block;}
              #stajnia .row{flex-direction: column;}
              #stajnia .tl,#stajnia .tr{text-align: center;}
              #stajnia .order2{order:2}
              #stajnia #prods #cars .tit.mobitop{margin-top:50px}
             


              #stajnia .mr130{margin:0 auto}
              
              #stajnia .copy{font-size: 18px;line-height: 33px;}
                
              #stajnia #header {background-position: 65%;}
              #stajnia #header .logo-img{width:100%;max-width: 400px;}
              #stajnia #header .head-copy{font-size: 18px;width:90%;line-height: 33px;}

              #stajnia #content .grey-box{width:80%;left:5%;right: 5%;height: 700;}
              #stajnia #content .grey-box .tit{font-size: 25px;line-height: 30px;}
              #stajnia #content .grey-box .copy{font-size: 16px;line-height: 28px;}
              #stajnia #content .img-mobi{width:100%}

              #stajnia #content2{max-height: none;margin: auto;}
              #stajnia #content2 .copy{font-size: 18px;line-height: 36px;width: 80%;margin: auto;}
              #stajnia #content2 .event-img{max-width: 100%;}
              #stajnia #content2 .event-container {max-width: 100%;}

              #stajnia #content3 .copy{font-size: 18px;line-height: 36px;width: 80%;margin: auto;}
              #stajnia #content3 .btn-container{margin:50px auto}
              #stajnia #content3 .tit{font-size: 25px;line-height: 30px;}

              #stajnia #content4 .tit{font-size: 25px;line-height: 30px;margin:100px auto 50px}
              #stajnia #content4 #tvn-box{background-image: url('./img/mobitvn.png');}
              #stajnia #content4 #tvn-box.aie{align-items: center;}


              #stajnia #contact .tit{font-size: 25px;line-height: 30px;}
              #stajnia #contact .contact-icon{display: flex;flex-direction: column;align-items: center;text-align: center;}
              #stajnia #contact .contact-icon img{width: min-content;margin:20px auto}
              #stajnia #contact .event-container{margin-bottom: 50px;width: 100%;}

              #stajnia #footer {height: auto; padding:20px 0}
              #stajnia #footer .part{width: 100%;margin:30px auto}
              #stajnia #footer .part .jcsa{justify-content: space-evenly;}
              #stajnia #contactpage #contact{margin-bottom:150px}
      


              /* --------- Media O stajni ---------*/
              #stajnia #about #header {background-position: 30%;}
              #stajnia #about #header .logo{margin:150px auto}

              /*--------- Media kontakt ------ */
              #stajnia #contactpage #contact .contact-icon{text-align: center;}
              #stajnia #contactpage #contact .tit{margin-top:20px}
              #stajnia #contactpage .img-mobi{width:100%}
              #stajnia #contactpage #footer{margin-top:0}

              /* ---- Media w stajni ---*/
                #stajnia #gallery .jcsb {justify-content: space-around;}
                #stajnia #gallery .gal{width:45%;min-width: 0;}
                #stajnia #gallery .gal .gal-img{height:auto;width:100%}
                #stajnia #gallery .gal .gal-img:hover{height:auto;width:100%}
                #stajnia #gallery .gal .gal-img{height:auto;width:100%;right:0}
                #stajnia #prods .warszawa .gal .gal-img{height:auto;width:100%;margin: auto;right:0}
                #stajnia #prods .warszawa .gal .gal-img:hover{height:auto;width:100%}
                #stajnia #prods .galbig .gal-img:hover{height: auto;width:95%}
                #stajnia #prods .galbig .gal-img{height: auto;width:95%;right:0;}
                #stajnia #prods .btn-container.noassa{margin-top:50px}
                #stajnia #prods .galbig{text-align: center;margin:25px auto}
                #stajnia #prods #cars .tit{margin-top:0}
                #stajnia #prods #contact .contact-icons.aie{align-items:center}
                #stajnia #prods #contact .contact-icons{width:100%}
                #stajnia #content4 .tit.marg{margin:150px auto 50px}
                #stajnia #prods #cars .copy{width:90%}
        }

        @media screen and (max-width:700px) {
                #stajnia .w700{width: 100%;}
                #stajnia #prods .car-type .car-type-img{width:400px;margin-left:100px;height:auto}
                .custombtn{top:150px;justify-content: space-between;}
                #stajnia .mobcol{flex-direction: column;}
                #stajnia #prods .square{min-width: 0;width: 95%;margin: auto;}
                #stajnia #prods .square .square-box{width: auto;}
                #stajnia #prods .square.m50{margin: 50px auto -250px;}
                #stajnia #prods .car-name .car-name-img{width:100%;max-width: 300px;}
                #stajnia #prods .car-bg{top: -100px !important;padding-top:100px}
                #stajnia #prods .tit.mobo{margin:50px auto -120px}
                #stajnia .top20mobo{position: relative;top: 20px;}
                #stajnia .mob100{width:100%}
        }


        @media screen and (max-width:450px) {
                #stajnia #header .logo-img{max-width: 300px;}
                #stajnia #prods .car-type .car-type-img{width:350px;margin-left:33px;height:auto}
                #stajnia #content .grey-box{margin-top:-450px}
                #stajnia #contactpage #content .grey-box {height: 700px;}
        }
        @media screen and (min-width:1500px) {#stajnia #prods #cars .square .copy.mright25{margin-right:25%}}