/*
Theme Name: Kordit theme NEW
*/

*{
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
}

html, body{
  margin: 0;
  padding: 0;
}

body{
  font-weight: 300;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  background: #ffffff;
}

h1, h2, a{
  color: #1A237E;
}

p, h3, h4{
  font-family: 'Playfair Display', sans-serif;
}

header h3, h4{
  text-shadow: 1px 1px 6px #000000;
}

p{
  font-family: 'Roboto', sans-serif;
  font-size: 1em;
  color: #777777;
  line-height: 1.5em;
}

h1{
  font-size: 2.25em;
  font-weight: 100;
}

h2{
  font-size: 1.5em;
  font-weight: 300;
}

header h3{
  margin-bottom: 0;
  font-size: 14vw;
}

h4{
  margin-top: 0;
  font-size: 6vw;
  font-weight: normal;
}

.center{
  text-align: center;
}

strong{
  font-weight: 500;
}

p strong{
  color: #000000;
}

header{
  height: 100vh;
  background: url(https://qtagrupa.pl/wp-content/themes/kordit/img/header-bg.jpg) center center no-repeat fixed;
  background-size: cover;
}

.button a{
  margin: 2em auto;
}

.button a, button{
  background: #1A237E;
  padding: 1em;
  font-family: 'Roboto', sans-serif;
  font-style: normal;
}

button{
  border: none;
  font-size: 1.25em;
}

section .button a{
  font-size: 1.5em;
}

header div{
  padding: 6em 10%;
}

section, aside{
  font-size: 1.125em;
}

section > div, article, aside, footer div{
  max-width: 51em;
  margin: auto;
}

section{
  padding: 2em;
}

aside{
  max-width: 62em;
  margin: 3em auto 0 auto;
  padding: 9em 0 8em 0;
}

.bg{
  background: url(bg.png) top center no-repeat;
  background-size: cover;
}

footer{
  font-size: .875em;
  background: #191919;
}

footer > div{
  max-width: 90em;
  padding: 1em;
}

footer .center{
  margin-bottom: -2em;
  padding: 3em;
  background: #000000;
}

.addr, footer ul{
  display: inline-block;
  vertical-align: top;
}

.heading{
  font-size: 2em;
  color: #FFF176;
}

footer, footer *, .button a, button, .background p, .button strong, header h3, h4, aside h2{
  color: #ffffff;
}

a{
  text-decoration: none;
}

nav{
  position: fixed;
  top: 0;
  width: 100%;
  text-align: right;
  z-index: 9000;
  transition-duration: .5s;
}

nav ul{
  margin: 0;
  padding: 2em 2em 0 0;
}

nav li{
  display: inline-block;
  margin-bottom: 2.5em;
  list-style: none;
}

span{
  display:block;
  width: 12em;
  margin: 0 auto 2em auto;
  border-bottom: 2px solid #FFF176;
}

.background{
  font-size: 1.5em;
  font-style: italic;
  background: url(https://qtagrupa.pl/wp-content/uploads/2019/04/353-1.jpg) center center no-repeat fixed;
  background-size: cover;
}

.background div{
  max-width: 35em;
}

.background p{
  font-family: 'Playfair Display', sans-serif;
  text-shadow: 1px 1px 4px #000000;
}

aside div{
  width: 99%;
  height: 15em;
  position: relative;
  margin: .25em .5%;
  background: rgb(96, 125, 206);
}

.contain{
  display: table;
  width: 200%;
  height: 100%;
  margin: 0;
  transition: transform .35s ease-in-out;
}

.front, .back{
  display: table-cell;
  width: 50%;
  border-radius: 10px;
}

.back{
  position: relative;
  vertical-align: middle;
  background: #FFF9C4dd;
}

.front{
  vertical-align: top;
}

aside div:first-child{
  height: auto;
  background: none;
}

aside h2{
  width: 100%;
  position: absolute;
  margin: 0;
  padding: 3em 1.5em 1.5em 1.5em;
}

.front > h2{
  background-image: linear-gradient(to top, rgba(96, 125, 206,0), rgba(96, 125, 206,.5), rgba(5,20,106,1)) !important;
}

.back > h2{
  width: 100%;
  vertical-align: middle;
  text-align: center;
}

.link{
  text-align: right;
  font-size: 1.125em;
}

.boxheading{

  width: 100%;
  font-size: 1.75em;
  vertical-align: middle;
  text-align: center;
}

.front > h2, .back > h2{
  padding: 1em 1.5em 3em 1.5em !important;
}

.front > p, .back > p{
  margin: 0;
  padding: 1.5em !important;
}

.front > h2, .front > h2 > a{
  color: #ffffff !important;
  text-shadow: 0 0 7px #000000;
}

aside div:first-child h2{
  position: relative;
  margin-left: 0;
  margin-right: 0;
  padding: 0 1em;
  color: #1A237E;
  background: none;
}

aside div:first-child p{
  padding: 0 1em;
}

.ctx1{
  background: url(scott-graham-5fNmWej4tAA-unsplash.jpg) center center no-repeat;
  background-size: cover;
}

.ctx2{
  background: url(business-ge15fbe60c_1280.jpg) center center no-repeat;
  background-size: cover;
}

.ctx5{
  background: url(calculator-g69ea3f1ec_1280.jpg) center center no-repeat;
  background-size: cover;
}

.ctx1, .ctx2, .ctx3, .ctx4, .ctx5{
  overflow: hidden;
  border-radius: 10px;
}




.art, .blogart{
  max-width: 70em;
}

.art span{
  margin-left: 0;
}

img{
  width: 100%;
}

.header{
  height: 15em;
}




.blog{
  padding: 0;
}

.date{
  font-family: 'Playfair Display', sans-serif;
  font-size: .925em;
  color: #aaaaaa;
}

.card{
  margin-bottom: 2em;
}

.cardcontent{
  padding: 1em;
}

.cardbg{
  background: #eeeeff;
}

.cardcontent p{
  margin: 0;
}

.blogart ul{
  padding: 0;
}

.blogart li{
  padding: 1em;
  list-style: none;
  border-top: 1px solid #cccccc;
}





.contacts, .offer, .offergroup, .offergroup > div, .tilemenu{
  display: flex;
  flex-wrap: wrap;
}

.contacts div{
  width: 33.3333%;
}

.contacts p{
  margin: 0;
}

.contacts img{
  width: 6em;
  max-width: 80%;
  padding: 1em;
  border: 3px solid #1A237E;
  border-radius: 50%;
}

.map{
  background: #eeeeff;
}

.address div{
  padding: 2em 1em;
}

iframe, form p, textarea{
  width: 100% !important;
}

iframe{
  height: 100%;
}

form{
  text-align: left;
}

input, textarea, label{
  display: inline-block;
  width: 100%;
  padding: .5em;
}

textarea{
  height: 12em;
}

.border img{
  width: 3.065em;
  padding: .75em;
  border: 1px solid #ffffff;
}

footer img{
  width: auto;
  margin-right: 1em;
  vertical-align: middle;
}

footer ul{
  list-style: none;
}

footer li{
  margin: 1.5em auto;
}

footer li a{
  display: block;
}

footer li a::before{
  content: "";
  background: url('money.png') no-repeat;
  width: 24px;
  height: 24px;
  float: left;
  margin: 0 2px 0 0;
  display: block;
  -webkit-filter: invert(100%) sepia(33%) saturate(4702%) hue-rotate(313deg) brightness(120%) contrast(100%);
      filter: invert(100%) sepia(33%) saturate(4702%) hue-rotate(313deg) brightness(120%) contrast(100%);
}



.blogmenu ul{
  margin-bottom: 3em;
}

.blogmenu li{
  list-style: none;
  margin: 0 auto;
}

.blogmenu li::before{
  content: "";
  background: url(money.png) no-repeat;
  width: 24px;
  height: 24px;
  float: left;
  margin: 0 6px 0 0;
  display: block;
  -webkit-filter: invert(9%) sepia(94%) saturate(3788%) hue-rotate(238deg) brightness(142%) contrast(96%);
      filter: invert(9%) sepia(94%) saturate(3788%) hue-rotate(238deg) brightness(142%) contrast(96%);
}



.offer{
  max-width: 70em;
  padding: 3em 0;
}

.offer h1{
  width: 100%;
}

.offergroup > div{
  justify-content: stretch;
  align-items: stretch;
}

.offer .offergroup{
  width: 100%;
}

.offergroup .offergroup{
  width: 50%;
}

.offergroup .offergroup div{
  height: 50%;
}

.offergroup > div > div{
  width: 100%;
}

.offer div, .offeritem, .offergroup{
  width: 50%;
}

.offeritem{
  padding: 5%;
  background: #1A237E;
}

.offer .img{
  width: 50%;
  background: url('https://qtagrupa.pl/wp-content/uploads/2019/04/17-520x780.jpg') center center no-repeat;
  background-size: cover;
}

.offer .img2{
  width: 50%;
  background: url('calculator-g69ea3f1ec_1280.jpg') center center no-repeat;
  background-size: cover;
}

.offer .olink{
  text-align: center;
  background: #FFF176;
}

.offer .olink:hover{
  font-weight: 500;
  background-color: #FFF9C4;
}

.offer h2{
  color: #ffffff;
}

.olink img{
  width: 45%;
  margin: 19% 27.5%;
}

.offeritem.right{
  background-image: url('right.png');
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 50%;
}

.offeritem.left{
  background-image: url('left.png');
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 50%;
}

.offeritem.down{
  background-image: url('down.png');
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 50%;
}





.art ul{
  margin: 0;
  padding: 1em;
  color: #0D47A1;
  font-weight: 400;
}

.art li{
  padding-bottom: 1em;
  list-style: none;
}

.art li::before{
  content: "";
  background: url(check.png) no-repeat;
  width: 32px;
  height: 32px;
  float: left;
  margin: -.3em 1em .7em 0;
  display: block;
  -webkit-filter: invert(9%) sepia(94%) saturate(3788%) hue-rotate(238deg) brightness(142%) contrast(96%);
  filter: invert(9%) sepia(94%) saturate(3788%) hue-rotate(238deg) brightness(142%) contrast(96%);
}


ul ul{
  margin-left: 2em !important;
}

ul ul li{
  padding-bottom: 25px !important;
}






.tilemenu{
  width: 100% !important;
}

.tile{
  width: 33.3333%;
  padding: 5%;
  background: #BBDEFB;
  font-weight: 500;
}
.tile2{
  background: #90CAF9;
}

.tile3{
  background: #82B1FF;
}

.tile:hover{
  background: #E3F2FD;
}
.tile2:hover{
  background: #BBDEFB;
}

.tile3:hover{
  background: #90CAF9;
}

.tile img{
  width: 30%;
  min-width: 6em;
  max-width: 100%;
  margin-right: 1em;
  float: left;
}

.tile p{
  font-size: .95em;
  color: #000000;
}

.heading{
  font-size: 1.25em !important;
}

@media all and (min-width: 40em){
  aside, .map{
    display: flex;
    flex-wrap: wrap;
  }

  aside div{
    width: 49%;
    height: 30em;
  }

  .art, .blogart{
    display: flex;
    flex-wrap: wrap;
  }

  .art div{
    width: 42%;
  }

  .art div:first-child{
    width: 56%;
    padding: 1em;
  }

  .blogart > div{
    width: 33%;
    padding: 1em;
  }

  .blogart > div:first-child{
    width: 65%;
  }

  .map > div{
    width: 60%;
  }

  .address{
    width: 40% !important;
  }

  .addr{
    width: 65%;
  }

  footer ul{
    width: 30%;
  }

  .ctx2{
    height: 20em;
    align-self: flex-end;
    margin-top:-10.75em;
  }

  .ctx2 .front, .ctx2 .back{
    height: 20em;
  }

  .ctx3{
    height: 9em;
    align-self: flex-end;
    margin-top:-10.75em;
  }

  .ctx3 .front, .ctx3 .back{
    height: 9em;
  }

  .ctx4{
    width: 60%;
    height: 12em;
  }

  .ctx4 .front, .ctx4 .back{
    height: 12em;
  }

  .ctx5{
    width: 38%;
    height: 12em;
  }

  .ctx5 .front, .ctx5 .back{
    height: 12em;
  }

  header h3{
    font-size: 6em;
  }

  h4{
    font-size: 1.925em;
  }

  aside div:first-child h2, aside div:first-child p{
    padding: 0;
  }

  .contain:hover{
    transform: translateX(-50%);
  }

  label{
    width: 35%;
  }
  
  input{
    width: 65%;
  }

  .offer .offergroup, .offergroup .offergroup{
    width: 50%;
  }
}

@media all and (max-width: 34em){
  .tile{
    width: 100%;
  }
}





.parallax-background {
  display:block;
    background-position: 50% 0;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    -moz-transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width: 100% !important;
    height: 100vh !important;
}

.a1{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width: 100% !important;
    height: 100vh !important;
}

.a2{
    background: url('21-4.png');
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width: 100% !important;
    height: 100vh !important;
}

.a3{
    background: url('21-3.png');
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width: 100% !important;
    height: 100vh !important;
}

.a4{
    background: url('21-2.png');
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width: 100% !important;
    height: 100vh !important;
}

.xxx{
  width: 100%;
  height: 100vh;
  background: url('https://qtagrupa.pl/wp-content/themes/kordit/img/header-bg.jpg');
  background-position: center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}



.sticky{
  top: 0;
  background: #ffffff;
  border-bottom: 1px solid #000000;
  transition-duration: .5s;
}

nav .button a{
  font-weight: 500;
  background: none;
}

.sticky .button a{
  color: #000000;
}





.hide{
  opacity:0;
}

.visible {
  opacity: 1;
}

.title{
  display: block;
  margin: 0;
  padding: 1em;
  font-size: 2em;
}

.xxx .title{
  margin-top: -3em;
  margin-left: -10%;
}





















.col-sm-6{
  width: 50%;
}

.sale{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
}

.col{
  width: 24%;
  margin: 0.5%;
  text-align: center;
  box-shadow: 0 0 15px #aaaaaa;
  border-radius: 10px;
}

.price, .pln, .sale h3{
  color: #ffffff;
}

.pricebox{
  width: 160px;
  height: 160px;
  margin: -25px auto 0 auto;
  padding: 15px;
  border: 7px solid #ffffff;
  border-radius: 50%;
  background-image: linear-gradient(to bottom, rgba(96, 125, 206,1), rgba(96, 125, 206,1), rgba(5,20,106,1));
}

.price{
  font-size: 2.5em;
  font-weight: 100;
  line-height: 0em;
}

.pln{
  font-size: 1em;
  line-height: .2em;
}

.params{
  font-size: .65em;
  margin-top: 20px;
  padding: 5px;
}

.params strong{
  display: block;
  font-size: 1.5em;
  margin-bottom: 10px;
}

.sale h3{
  margin: 0;
  padding: 5px 0 45px 0;
  font-family: 'Roboto', sans-serif;
  font-size: 2.25em;
  font-weight: 100;
  border-bottom: 1px solid #ffffff;
  background-image: linear-gradient(to bottom, rgba(96, 125, 206,1), rgba(96, 125, 206,1), rgba(5,20,106,1));
  border-radius: 10px 10px 0 0;
}

.sale h3 strong{
  font-size: .5em;
}

.col:last-of-type .pricebox, .col:last-of-type h3{
  background-image: linear-gradient(to bottom, rgba(255, 241, 118,1), rgba(96, 125, 206,1)) !important;
}

.col:nth-last-child(2) .pricebox, .col:nth-last-child(2) h3 {
  background-image: linear-gradient(to bottom, rgba(207, 216, 220,1), rgba(96, 125, 206,1)) !important;
}





table{
  border-collapse: separate;
  border-spacing: 5px;
  width: 100%;
  text-align: center;
}

th{
  color: #ffffff;
  background: #1A237E;
}

th, td{
  padding: 18px;
}

tr{
  background: #E1F5FE;
}

td:nth-child(odd){
  font-weight: bold;
}

td:nth-child(3n+3){
  width: 170px;
  background: #90CAF9;
}









.header li{
  text-shadow: 0 0 7px #000000;
}

.sticky li{
  text-shadow: 0 0 3px #ffffff;
}







.list-cols{
  column-count: 2;
}