html, body, ul, li { margin: 0; padding: 0;list-style: none;}
html, body { height: 100%; min-width: 320px;}
body {font-size: 1em;background-color: #000;}

/* line and font height reset */
h1, h2, h3, ul, li, p, div { margin: 0; padding: 0; font-size: 1em; line-height: 24px; color: #c0c0c0; font-family: 'Poppins', 'Lato', Verdana, Geneva, sans-serif; font-weight: normal;}
a { outline-style: none;text-decoration: none;color: #5b5b5b;}
h1.title {text-align: center;font-size: 1.8em;font-weight: 600;text-transform: uppercase;color: #c0c0c0;margin-bottom: 60px;}

/* icon */
.menu.icon {color: #fff;position: absolute;margin-left: 2px;margin-top: 10px;width: 22px;height: 3px;background-color: currentColor;}
.menu.icon:before {content: '';position: absolute;top: -7px;left: 0;width: 22px;height: 3px;background-color: currentColor;}
.menu.icon:after {content: '';position: absolute;top: 7px;left: 0;width: 22px;height: 3px;background-color: currentColor;}
.close {width: 22px;height: 22px;padding: 15.5px 13px 11px;position: absolute;top: 0;right: 0;cursor: pointer;color: #fff;text-decoration: none;text-indent: -9999em;line-height: 22px;display: block;font-family: Arial,Helvetica,sans-serif;font-weight: 700;right: 0px;left: auto;text-align: center;text-indent: 0px;font-size: 18px;}
.mail.icon {color: #fff;position: relative;margin-left: 2px;margin-top: 4px;width: 15px;height: 10px;border-radius: 1px;border: solid 1px currentColor;}
.mail.icon:before {content: '';position: absolute;left: 7px;top: -4px;width: 1px;height: 10px;background-color: currentColor;-webkit-transform-origin: bottom;        transform-origin: bottom;-webkit-transform: rotate(-54deg);        transform: rotate(-54deg);}
.mail.icon:after {content: '';position: absolute;left: 7px;top: -4px;width: 1px;height: 10px;background-color: currentColor;-webkit-transform-origin: bottom;        transform-origin: bottom;-webkit-transform: rotate(54deg);        transform: rotate(54deg);}
.mobile.icon {color: #fff;position: relative;margin-left: 4px;margin-top: 0px;width: 12px;height: 19px;border-radius: 2px;border: solid 1px currentColor;}
.mobile.icon:before {content: '';position: absolute;left: 5px;top: 1px;width: 2px;height: 1px;background-color: currentColor;}
.mobile.icon:after {content: '';position: absolute;bottom: 1px;left: 5px;height: 2px;width: 2px;border-radius: 50%;background-color: currentColor;}
.navigate-solid.icon {color: #fff;position: relative;margin-left: 6px;margin-top: -1px;width: 14px;height: 18px;-webkit-transform: rotate(45deg);        transform: rotate(45deg);}
.navigate-solid.icon:before {content: '';position: absolute;left: 0;top: -17px;width: 0;height: 0;border-top: solid 18px transparent;border-bottom: solid 18px currentColor;border-left: solid 7px transparent;border-right: solid 7px transparent;}
.navigate-solid.icon:after {content: '';position: absolute;left: 0;top: 9px;width: 0;height: 0;color: white;border-top: solid 5px transparent;border-bottom: solid 5px currentColor;border-left: solid 7px transparent;border-right: solid 7px transparent;}
.pin.icon {color: #fff;position: relative;margin-left: 4px;margin-top: 2px;width: 12px;height: 12px;border: solid 1px currentColor;border-radius: 7px 7px 7px 0;-webkit-transform: rotate(-45deg);        transform: rotate(-45deg);}
.pin.icon:before {content: '';position: absolute;left: 3px;top: 3px;width: 4px;height: 4px;border: solid 1px currentColor;border-radius: 3px;}

/* all */
.visibility-hidden{display: none;}
.visibility-initial{display: block;}
.d-inlineblock{display: inline-block;}
.d-block{display: block;}
.t-center{text-align: center;}
.w-20{width: 20%;}
.pb-20{padding-bottom: 40px !important;}
.m-auto{margin: 0 auto;}
.t-left{text-align: left !important;}
.f-none{float: initial !important;}
.d-flex{display: flex !important;}
.flex-row{flex-direction: row !important;}
.justify-around{justify-content: space-around;}
.w-50{width: 50%;}

/* header */
#header{height: 75px;border-bottom: solid #f32310 5px;}
.container{max-width: 1150px;padding: 0 25px;margin: 0 auto;display: flex;}
.container img{width: auto;height: 50px;margin-top: 12.5px;margin-left: 10px;}
.container .logo{height: 53px;}
.container a{display: flex;}
.container .nav{width: calc(100% - 130px);text-align: center;padding-top: 21px;display: flex;justify-content: center;}
.container .nav .nav-item{display: inline-block;padding: 0 15px 10px 15px;}
.container span{width: 125px;padding-top: 21px;}
.container span, .container ul li > a{color: #fff;font-size: 1.1em;font-weight: 500;}
.container .nav-menu{ position: absolute;top: 3em;margin-left: -3em;z-index: 3;}
.container .nav-menu li{width: 120px;clear: both;background: #000;padding-top: 10px;border-bottom: solid 1px #f32310;padding: 10px 15px;}
.container .nav-menu li>a{font-weight: 400;font-size: 1em;padding: 0.3em 5px;display: block;}
.mean-expand{display: none;}
.sm-nav {display: none;}

/* main */
#main-wrapper {background-color: #000;background-image: url(../img/bg.jpg);background-repeat: no-repeat;background-position: top center;background-size: cover;min-height: calc(100vh - 180px);}
.main-wrapper2 {background-position: bottom center !important;background-image: url(../img/bg2.jpg) !important;}
.border{position: relative;}
#content{width: 343px;margin: 0 auto;height: calc(100vh - 80px);min-height: 495px;}
#content .logo-gif{padding-top: calc(50vh - 257px);width: 100%;}
#content .gif-border{position: absolute;bottom: 0;left: 0;width: 100%;}
#about{border-top: 15px solid #000;border-bottom: 15px solid #000;padding-bottom: 70px;}
.about-container{max-width: 900px;padding: 0 25px;margin: 0 auto;}

/* .about-us{padding-top: calc(50vh - 257px);} */
.about-us .title{font-size: 1.8em;font-weight: 600;text-align: center;padding-bottom: 40px;padding-top: 70px;}
.rtecenter{text-align: center;}
.contact-container{max-width: 1150px;padding-bottom: 40px;}
.contact{text-align: center;width: calc(50% - 20px);}
.contact h2{font-weight: 600;font-size: 1.2em;}
.form-item, .form-actions{margin-top: 1em;margin-bottom: 1em;}
.contact-form label{font-size: 0.85em;font-weight: 400;display: block;}
.contact-form label font{margin-left: 10px;}
.contact-form input{width: calc(100% - 22px);}
.contact-form textarea, .contact-form input{background: none;border: solid 1px #716b6a;color: #fff;padding: 5px 10px;text-align: left;}
.form-text{display: block;}
.contact-form textarea{width:100%;display: block;margin: 0;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
#edit-submit{border: none;background: #f32310;height: 33px;padding: 5px 25px;border-radius: 15px;cursor: pointer;color: #fff;display: block;width: 200px;text-align: center;margin: 0 auto;outline: none;}
.marker{color: #f32310;}
.grippie{background: #eee;border: 1px solid #ddd;border-top-width: 0;cursor: s-resize;height: 9px;overflow: hidden;}

/* footer */
#footer{height: auto;padding: 20px 0;}
#footer a {color: #fff;}

#border-none{border-top: none;border-bottom: none;}

/* product */
.product{max-width: 1150px;padding: 0 25px 50px 25px;text-align: center;}
.product-item{width: 310px;display: inline-block;margin: 15px 10px;vertical-align: top;text-align: center;}
.product-item .img-container{display: block;vertical-align: middle;max-height: 413px;width: 239px;margin: 0 auto;}
.product-border{position: relative;}
.product-border .img-container::before{position: absolute;top: 0;left: 0;z-index: 1;content: " ";display: block;height: 277px;width: 100%;background: url(../img/product.png) no-repeat center center;}
.product-border img{text-align: center;width: 228px;height: 201px;overflow: hidden;-webkit-clip-path: polygon(50% 1%, 100% 26%, 100% 75%, 50% 99%, 1% 75%, 1% 26%);clip-path: polygon(50% 1%, 100% 26%, 100% 75%, 50% 99%, 1% 75%, 1% 26%);background-color: #fff;display: block;vertical-align: middle;padding: 38px 5px;border-width: 1.3rem;}
.product-title{font-size: 1.2em;font-weight: 600;text-transform: uppercase;color: #f32310;}
/* .product-title-container{width: 239px;margin:0 auto;text-align: left;} */

.product-wrap {width:228px;height:132px;position:relative;margin:80px auto;}
.product-common {position:absolute;height:100%;width:100%;overflow:hidden;left:0;}
.product-left,.product-left2 {transform:rotate(60deg);}
.product-left:before {transform:rotate(-60deg) translate(0,-131px);}
.product-left2:before {transform:rotate(-60deg) translate(57px,-33px);}
.product-right,.product-right2 {transform:rotate(-60deg);}
.product-right:before {transform:rotate(60deg) translate(0,132px);bottom:0;}
.product-right2:before {transform:rotate(60deg) translate(57px,33px);bottom:0;}
.product .product-border .img-container::before {top:-67px;}

/* product show */
.product-show{max-width: 1150px;padding: 50px 25px 50px 25px;height: auto;}
.group-zdjecia{width: 355px;display: inline-block;float: left;}
.group-zdjecia img{width: 344px;height: 317px;padding: 48px 5px;}
.group-zdjecia .img-container::before{height: 415px;background: url(../img/productshow2.png) no-repeat center center;}
.group-opis {width: calc(100% - 440px);display: inline-block;margin-left: 40px;}
.group-opis .opis-title{font-size: 1.6em;font-weight: 700;color: #f32310;text-transform: uppercase;line-height: 40px;}
.group-opis .opis-title2{color: #fff;}
.group-opis .descr{padding: 45px 0;}
.product-show .about-us .title {padding-left: 395px;text-align: left;}

.wrap {width:344px;height:199px;position:relative;margin:99.5px auto;}
.common {position:absolute;height:100%;width:100%;overflow:hidden;left:0;}
.left {transform:rotate(60deg);}
.left:before {transform:rotate(-60deg) translate(85px,-50px);}
.right {transform:rotate(-60deg);}
.right:before {transform:rotate(60deg) translate(85px,50px);bottom:0;}
.product-show .product-border .img-container::before {top:-104px;}

/*video*/
.video-firma{width: 250px;display: inline-block;vertical-align: top;padding: 0 10px;}
.video-firma img {cursor: pointer;}
.video-container{text-align: center;}
.video-popup{width: 100%;height: auto;padding: 15px;background: #fff;text-align: center;vertical-align: middle;}
.video-close{top: -17px !important;right: -50px !important;}
.video-popup-container{position: relative;margin: 10vh auto;max-width: 800px;}
.showvideo iframe{width: 100% !important;border-color: transparent;}

/* popup */
.popup{position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: #00000099;z-index: 2;}
.popup img{position: absolute;width: 100%;height: auto;border-radius: 5%;background-color: #fff;}
.popup .popup-close{position: absolute;top: -10px;right: -10px;width: 36px;height: 36px;cursor: pointer;z-index: 999;background-image: url(../img//close.png);background-size: 44px 152px;}
.popup-container{position: relative;margin: 10vh auto;max-width: 400px;}

@media (max-width: 890px) {

  /* all */
  .sm-flex-column{flex-direction: column !important;}
  .w-50{width: 100%;}

  /* header */
  #header{height: auto;padding-bottom: 25px;padding-top: 25px;}
  .container{flex-direction: row;}
  .container a, .container span{margin: 0 auto;width: auto;}
  .container img{width: auto;height: 40px;margin-top: 0;margin-left: 5px;}
  .container .logo{height: 43px;}
  .container span{display: none;}
  .container .nav {display: none;width: 88%;position: absolute;top: 80px;background: #000;z-index: 3;}
  .sm-nav {display: block;width: 100%;text-align: end;min-height: 42px;}
  .meanmenu-reveal{width: 22px;height: 22px;padding: 15.5px 13px 11px;position: absolute;right: 24px;cursor: pointer;color: #fff;text-decoration: none;font-size: 16px;text-indent: -9999em;line-height: 22px;font-size: 1px;display: block;font-family: Arial,Helvetica,sans-serif;font-weight: 700;}
  .container .nav .nav-item{display: block;width: 100%;}
  .nav-item a, .nav-item span,.container .nav-menu li{display: block;float: left;width: 90%;padding: 1em 5%;margin: 0;text-align: left;color: #fff;border-top: 1px solid #fff;text-decoration: none;text-transform: uppercase;}
  .nav-item span, .container ul li > a{width: 90%;margin-left: -15px;}
  .slogan{text-align: center;}

  /* main */
  .contact{width: 100%;}
  #header .mean-expand{margin-top: 1px;width: 26px;height: 32px;padding: 12px!important;text-align: center;position: absolute;right: 0;top: 143px;z-index: 2;font-weight: 700;background: rgba(255,255,255,.1);border: 0!important;border-left: 1px solid rgba(255,255,255,.4)!important;border-bottom: 1px solid rgba(255,255,255,.2)!important;}
  .container .nav-menu{ position: relative;top: 0;margin-left: 0;}
  .container .nav-menu li{width: 91%;clear: both;background: #000;padding-top: 0;border-top: 1px solid #ffffff40;border-bottom: transparent;padding: 10px 15px;margin-left: -15px;}
  .container .nav-menu li>a{font-weight: 400;font-size: 1em;padding: 0.3em 10px;display: block;border-top: transparent;color: #ccc;margin-left: 35px;}
  .border{width: 90%;margin: 0 auto;}
  /* #content .gif-border{bottom: 37px;left: 15px;} */

  /* product */
  .product{padding: 0;}

  /*product show */
  .group-opis{width:100%;margin-left: 0;margin-top: 20px;}
  .group-zdjecia{width: 100%;}
  .group-zdjecia img{width: 228px;height: 180px;margin: 0 auto;}
  .group-zdjecia .img-container::before{height: 277px;background: url(../img/product.png) no-repeat center center;}
  .w-20{width: 30%;}
  .popup{position: fixed;top: 0;bottom: 0;left: 0;right: 0;background-color: #00000099;z-index: 2;}
  .popup img{position: absolute;width: 80%;height: auto;border-radius: 5%;background-color: #fff;margin: 10%;}
  .popup .popup-close{position: absolute;top: 20px;right: 20px;width: 36px;height: 36px;cursor: pointer;z-index: 8040;background-image: url(../img//close.png);background-size: 44px 152px;}
  .product-show .about-us .title {padding-left: 0;text-align: center;}

  .wrap {width:228px;height:132px;margin:66px auto;background-size:auto 201px;background-size:auto 201px !important;}
  .left:before {transform:rotate(-60deg) translate(57px,-33px);}
  .right:before {transform:rotate(60deg) translate(57px,33px);bottom:0;}
  .product-show .product-border .img-container::before {top:-67px;}

  /* video */
  .video-popup-container{margin: 20vh auto;}
  .video-popup{width: 100%;height: auto;margin: 0;padding: 20px 0;}
  .video-popup video{width: 90%;margin: 20px 0;}
  .video-close {top: -14px !important;right: 0 !important;}

  /* footer */
  #footer{height: auto;padding: 10px 0;}
  #footer a{font-size: small;}
}

@media (max-width: 320px) {
  #content{width:100%;height: calc(90vh - 80px);}
}