@import "_home.instafeed";
@import "@css/project/components/_tagline";
@import "_home.sections";
@import "_home.newsletter";

.container--gray {
   background-color: $bg-alt;

   .display-table {
      table-layout: fixed;
   }

   @media screen and (min-width: 544px) {
      padding: 50px 0; // + 10px padding = 60px grafika
   }
}

.container--white {
   background: $white;
   padding: 10px 30px;
   border-bottom: 1px solid $bg-alt;

   @media screen and (min-width: 1200px) {
      padding: 15px 30px 30px;
   }

   @media screen and (min-width: 768px) {
      border: 10px solid $bg-alt;
      float: none;
   }

   @media screen and (max-width: 410px) {
      padding: 10px;
   }
}

.container--slider {
   float: none;
   padding: 0;

   @media screen and (min-width: 768px) {
      border: 10px solid $bg-alt;
   }
}


@media screen and (max-width: 1199px) and (min-width: 992px) {
   .home-products > div {
      max-width: 850px;
      margin: 0 auto;
      float: none;
   }
}


.accept-cookies {
   padding: 5px 0;
   background: $gray-dark;
   position: fixed;
   bottom: 0;
   width: 100%;
   text-align: center;
   z-index: 2002;

   p {
      color: $border-color;
      margin: 5px 0;

      a {
         color: inherit;
         @include underline-default;
      }
   }

   p, .btn {
      display: inline-block;
      vertical-align: middle;
   }

   .btn {
      padding: 5px 20px;
      margin: 10px;
   }

   @media screen and (min-width: 992px) {
      .col-xs-12 {
         display: flex;
         align-items: center;
         justify-content: center;
      }

      .btn {
         margin: 5px 0;
      }

      p {
         padding-right: 20px;
         text-align: left;
      }
   }
}

.home-icon {
   color: $brand-primary;
   font-size: .9em;
   margin-right: 15px;
}

.homepage-h1 {

   a {
      &:hover,
      &:active,
      &:focus {

         h1, h2 { text-decoration: underline; }
      }
   }

   h1, h2 { display: inline-block; }
}
