/* SPIS TERŚCI
 *
 * 1. Fonts
 * 2. Główne ustawienia
 * - 2.1 Przyciski
 * - 2.2 Social Media
 * - 2.3 Formularze
 * 3. Nagłówek
 * - 3.1 Logo
 * - 3.2 Userbar
 * - 3.3 Koszyk
 * - 3.4 Menu
 * - 3.5 Menu Mobile
 * - 3.6 Slider
 * - 3.7 Boxy - Góra
 * 4. Stopka
 * - 4.1 Boxy - Dół
 * - 4.2 Newsletter
 * - 4.3 Opinie klientów
 * - 4.4 Menu - Stopka
 * - 4.5 Copyrights
 * 5. Lewe Menu - Produkty
 * - 5.1 Product Search
 * - 5.2 Menu
 * 6. Wspólne dla stron
 * 7. Strona główna
 * 8. Rejestracja
 * 9. Logowanie
 * 10. Widok produktu opartego na wariantach
 * 11. Koszyk
 * 12. Panel klienta
 * 13. Lista zamówień - tabela
 * 14. Lista zamówień - szczegóły
 * 15. Zmień dane
 * 16. Prezenty/Punkty
 * 17. Zamówienie projektu
 * 18. Kontakt
 * 19. Artykuł
 * 20. Opinie
 * 21. Bezpłatne próbki
 * 22. 404
 * 23. Artykuł
 * 24. Formularz kontaktowy
 * 25. Fancybox
 * 26. Oplacenie zamowienia
 * 27. Kontakt 2
 */

@background: #ffffff;
@leftMenuEnabled: true;
@color1: #39ac39;
@color2: #5ba5cb;
@color3: #f6891e;
@color4: #f1f1f1;
@color5: #cccccc;
@color6: #c1c1c1;
@color7: #7a7a7a;
@color8: #414141;
@color9: #000000;

@screen-sm-min: 768px;
@screen-md-min: 992px;
@screen-lg-min: 1200px;

.authorization-view,
.product-view {
  #left-col {
    & when (@leftMenuEnabled = false) {
      display: none;
    }
  }
  #main.col-md-9 {
    & when (@leftMenuEnabled = false) {
      width: 100%;
    }
  }

}

/* -----------------------------------------------------------------------------
1. Fonts */

/* BEGIN Light */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-Light.eot?v=1.1.0");
  src: url("../fonts/OpenSans-Light.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-Light.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-Light.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-Light.svg?v=1.1.0#Light") format("svg");
  font-weight: 300;
  font-style: normal; }
/* END Light */
/* BEGIN Light Italic */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-LightItalic.eot?v=1.1.0");
  src: url("../fonts/OpenSans-LightItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-LightItalic.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-LightItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-LightItalic.svg?v=1.1.0#LightItalic") format("svg");
  font-weight: 300;
  font-style: italic; }
/* END Light Italic */
/* BEGIN Regular */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-Regular.eot?v=1.1.0");
  src: url("../fonts/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg");
  font-weight: normal;
  font-style: normal; }
/* END Regular */
/* BEGIN Italic */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-Italic.eot?v=1.1.0");
  src: url("../fonts/OpenSans-Italic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-Italic.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-Italic.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-Italic.svg?v=1.1.0#Italic") format("svg");
  font-weight: normal;
  font-style: italic; }
/* END Italic */
/* BEGIN Semibold */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-Semibold.eot?v=1.1.0");
  src: url("../fonts/OpenSans-Semibold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-Semibold.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-Semibold.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-Semibold.svg?v=1.1.0#Semibold") format("svg");
  font-weight: 600;
  font-style: normal; }
/* END Semibold */
/* BEGIN Semibold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-SemiboldItalic.eot?v=1.1.0");
  src: url("../fonts/OpenSans-SemiboldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-SemiboldItalic.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-SemiboldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-SemiboldItalic.svg?v=1.1.0#SemiboldItalic") format("svg");
  font-weight: 600;
  font-style: italic; }
/* END Semibold Italic */
/* BEGIN Bold */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-Bold.eot?v=1.1.0");
  src: url("../fonts/OpenSans-Bold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-Bold.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-Bold.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-Bold.svg?v=1.1.0#Bold") format("svg");
  font-weight: bold;
  font-style: normal; }
/* END Bold */
/* BEGIN Bold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-BoldItalic.eot?v=1.1.0");
  src: url("../fonts/OpenSans-BoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-BoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-BoldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-BoldItalic.svg?v=1.1.0#BoldItalic") format("svg");
  font-weight: bold;
  font-style: italic; }
/* END Bold Italic */
/* BEGIN Extrabold */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-ExtraBold.eot?v=1.1.0");
  src: url("../fonts/OpenSans-ExtraBold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBold.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-ExtraBold.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-ExtraBold.svg?v=1.1.0#ExtraBold") format("svg");
  font-weight: 800;
  font-style: normal; }
/* END Extrabold */
/* BEGIN Extrabold Italic */
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/OpenSans-ExtraBoldItalic.eot?v=1.1.0");
  src: url("../fonts/OpenSans-ExtraBoldItalic.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/OpenSans-ExtraBoldItalic.ttf?v=1.1.0") format("truetype"), url("../fonts/OpenSans-ExtraBoldItalic.svg?v=1.1.0#ExtraBoldItalic") format("svg");
  font-weight: 800;
  font-style: italic; }
/* END Extrabold Italic */

/* BEGIN SOCIAL MEDIA */
@font-face {
  font-family: 'Mono Social Icons Font';
  src: url('../fonts/MonoSocialIconsFont-1.10_.eot');
  src: url('../fonts/MonoSocialIconsFont-1.10_.eot?#iefix') format('embedded-opentype'),
  url('../fonts/MonoSocialIconsFont-1.10_.woff') format('woff'),
  url('../fonts/MonoSocialIconsFont-1.10_.ttf') format('truetype'),
  url('../fonts/MonoSocialIconsFont-1.10_.svg#MonoSocialIconsFont') format('svg');
  src: url('../fonts/MonoSocialIconsFont-1.10_.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
/* END SOCIAL MEDIA */


/* -----------------------------------------------------------------------------
2. Główne ustawienia */

body {
  font-family: 'Open Sans', Verdana, sans-serif;
  color: @color9;
  font-size: 14px;
  background: @background;
}

.container {
  padding-right:30px;
  padding-left:30px;
}
@media (min-width:768px) {
  .container {
    width:780px
  }
}
@media (min-width:992px) {
  .container {
    width:1000px
  }
}
@media (min-width:1200px) {
  .container {
    width:1200px;
  }
}

a {
  text-decoration: none;
  color: @color8;
}

a:hover {
  color: @color9;
}

#left-col{
  padding-top:10px;
  margin-top: 30px;
  margin-bottom: 0;
}
@media (min-width: 992px){
  #left-col{
    margin-top: 0;
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 760px) {
  #left-col {margin-top: 0; padding-top: 0;}
}


.gradient-grey{
  background: @background; /* Old browsers */
  background: -moz-linear-gradient(top,  @background 0%, @color5 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@background), color-stop(100%,@color5)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  @background 0%,@color5 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  @background 0%,@color5 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  @background 0%,@color5 100%); /* IE10+ */
  background: linear-gradient(to bottom,  @background 0%,@color5 100%); /* W3C */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@background', endColorstr='@color5',GradientType=0 ); *//* IE6-9 */

}

.loading,
.params_loading{
  background: url(../images/loader-cog.GIF) center center no-repeat;
  width: 100%;
  height: 200px;
}
.params_loading > *{
  display: none;
}

.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- 2.1 Przyciski ---- */

.btn-custom{
  background-color: @color2;
  border: 1px solid @color2;
  padding: 10px 20px;
  color: @background;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: inline-block;
  font-weight: 300;
}
.btn-custom:focus{
  color: @background;
}

.btn-custom:hover,
a.btn-custom:hover{
  color: @background;
  text-decoration: none;
  background-color: darken(@color2, 10%);
}

a.btn-green, .btn-green{
    background-color: @color1;
    border: 1px solid  @color1;
    text-decoration: none;
    &:hover {
        background-color: darken(@color1, 10%);
    }
}
.btn-brown, a.btn-brown{
    background-color: @color1;
    text-decoration: none;
    border: 1px solid  @color1;
    &:hover {
        background-color: darken(@color1, 10%);
    }
}

.creator-create-project-button:hover{
  color: @background;
}

#login-form input[type="submit"],
#register-form .register-button,
#variantParams .upload-button{
  color: @background;
  font-size: 14px;
  font-weight: 300;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 15px 30px;
  border: 0;
  float: right;
  background-color: @color2;
  &:hover {
        background-color: darken(@color2, 15%);
    }
}

#login-form input[type="submit"]
{
  /* background-color: @color8;
  background-color: @color6; */
}

#register-form .register-button{

}






/* ---- 2.2 Social Media ---- */
.social-container{
  margin: 10px 0;
  display: table;
  width:100%;
}

.social-container > a{
  display: table-cell;
  text-align: center;
}

.social {
  background-image: url(../images/social-icons.png);
  background-repeat: no-repeat;
  display: inline-block;
}

.social-facebook {
  width: 28px;
  height: 26px;
  background-position: -5px -5px;
}

.social-google-plus {
  width: 28px;
  height: 26px;
  background-position: -5px -41px;
}

.social-instagram {
  width: 28px;
  height: 26px;
  background-position: -5px -77px;
}

.social-pinterest {
  width: 28px;
  height: 26px;
  background-position: -5px -113px;
}

.social-twitter {
  width: 28px;
  height: 26px;
  background-position: -5px -149px;
}

.social-youtube {
  width: 28px;
  height: 26px;
  background-position: -5px -185px;
}


@media (min-width: 992px) {
  .social-container{
    display: block;
  }
  .social-container > a{
    display: inline-block;
  }
}


.symbol, a.symbol:before {
  font-family: 'Mono Social Icons Font', arial, sans-serif;
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
}

a.symbol:before {
  content: attr(title);
  margin-right: 0.3em;
  font-size: 130%;
}

a.symbol {
  background: @color7;
  padding: 7px 5px 3px 5px;
  color: white;
  text-decoration: none;
}


/* Social Bar */
#social-bar{
  font-size: 30px;
  margin-top: 40px;
}
#social-bar ul{
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid @color4;
}
#social-bar ul:before,
#social-bar ul:after{
  display: block;
  content: '';
  clear: both;
}
#social-bar ul li{
  float: left;
}
#social-bar ul li > a{
  display: block;
}
#social-bar ul li > a:hover{
  text-decoration: none;
  color: @color1;
}

#social-bar ul li.sharethis{
  background-color: @color1;
  color: @background;
  width: 40px;
  text-align: center;
}





/* ---- 2.3 Formularze ---- */
::-webkit-input-placeholder {
  font-weight: 300;
}

:-moz-placeholder { /* Firefox 18- */
  font-weight: 300;
}

::-moz-placeholder {  /* Firefox 19+ */
  font-weight: 300;
}

:-ms-input-placeholder {
  font-weight: 300;
}

input[type="text"],
input[type="email"],
input[type="password"]{
  background-color: @color4;
  border: 1px solid @color6;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-image: url(../images/input-text-bg.png);
  background-position: right 10px center;
  background-repeat: no-repeat;

  font-size: 14px;
  line-height: 19px;
  padding: 5px 2px;
  text-indent: 10px;
  margin-bottom: 10px;
  width: 100%;
  box-shadow: none;
}
input[type="text"][disabled="disabled"],
input[type="email"][disabled="disabled"],
input[type="password"][disabled="disabled"]{
  background-color: @color4;
}


select.hasCustomSelect{
  width: 100%;
}
.customSelect {
  /* This is the default class that is used */
  /* Put whatever custom styles you want here */
  border: 1px solid @color4;
  width: 100%;
  padding: 10px;
  font-weight: 300;
  color: @color8;
  font-size: 14px;
  background: url(../images/arrow-down-select.png) right 15px center no-repeat;
}

.customSelect.customSelectHover {
  /* Styles for when the select box is hovered */
}

.customSelect.customSelectOpen {
  /* Styles for when the select box is open */
}

.customSelect.customSelectFocus {
  /* Styles for when the select box is in focus */
}

.customSelect.customSelectDisabledOption {
  /* Styles for when the selected item is a disabled one */
}

.customSelect.customSelectDisabled {
  /* Styles for when the select box itself is disabled */
}

.customSelectInner {
  /* You can style the inner box too */
}


.styledCheckbox,
.styledRadio{
  display: inline-block;
  margin-bottom: -55px;
}


/* -----------------------------------------------------------------------------
3. Nagłówek */

#main-header{
  margin-bottom: 15px;
}
@media (min-width: 992px){
  #main-header{
    margin-bottom: 5px;
  }
}

/* ---- 3.1 Logo ---- */

#logo-container{
  position: absolute;
  left: 50%;
  margin-left: -50px;
  top: 0;
}

#custom-logo {
  text-align:center;
  display:table;
  width: 100px;
}
#custom-logo a{
  display:table-cell;
  vertical-align:middle;
  height: 50px;
}
#custom-logo a img{
  /*max-width:100%;
  max-height:100%;
  */
  height: 40px;
  max-height: 141px;
  max-width: 393px;
}

@media (min-width: 992px) {

  #logo-container{
    height: 130px;
    margin: 0;
    left: auto;
  }

  #custom-logo {
    text-align:left;
    height: 140px;
  }

  #custom-logo a{
    height: auto;
  }

  #custom-logo a img{
    height: auto;
  }
}


/* ---- 3.2 Userbar ---- */

#header-userbar{
  line-height:40px;
  padding-top:25px;
  padding-bottom:25px;
  font-size: 14px;
}
#header-userbar .infolinia{
  font-weight: bold;
  position:relative;
  padding-right: 9px;
  padding-left: 9px;
}
.infolinia .phone-icon {
  background: url('../images/phone-icon.png') no-repeat;
  display: inline-block;
  width: 24px;
  height: 25px;
  vertical-align: middle;
  margin-top:-5px;
}
#header-usermeta a {
  background: url(../images/arrow-right-user-meta.png) right 20px center no-repeat;
  font-weight: 300;
  padding-right:35px;
  padding-left:18px;
  position:relative;
}
#header-userbar .infolinia:after,
#header-usermeta a:after{
  position:absolute;
  right: 0;
  top:50%;
  margin-top:-20px;
  content:'';
  width:1px;
  height:40px;
  background-color:#ddd;
}
#header-usermeta a:last-child{
  padding-right: 18px;
  background-position:
          right center;
}
#header-usermeta a:last-child:after{
  width:0;
}


/* ---- 3.3 Koszyk ---- */

#header-cart {
  font-size: 12px;
  line-height:40px;
  min-width:260px;
  background-color:@color8;
  float:right;
  padding-left:15px;
  margin-left: 15px;
  color:@background;
  margin-bottom:0;
  position: relative;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#header-cart .cart-icon {
  background: url('../images/basket-icon.png') no-repeat;
  display: inline-block;
  width: 22px;
  height: 19px;
  vertical-align: middle;
}
#header-cart #cart-count{
  font-weight:bold;
}
#header-cart #cart-price{
  font-weight:bold;
  font-size:14px;
  line-height:14px;
}
#header-cart #cart-show {
  width:40px;
  height:40px;
  display:block;
  float:right;
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
  cursor:pointer;
  background: url(../images/arrow-down-cart.png) center no-repeat @color3;
  &:hover {
        background-color: darken(@color3, 10%);
    }
}

#header-cart-container{
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  z-index: 100;
  background-color: @color8;
  border-radius: 3px;
}

.header-single-product{
  display: table;
  table-layout: fixed;
  width: 100%;
  padding: 10px;
  border-bottom: 1px solid @color1;
}
.header-single-product-name{
  display: table-cell;
  width: 70%;
}
.header-single-product-price{
  display: table-cell;
  width: 30%;
  text-align: right;
}

.header-cart-href{
  text-align: center;
  display: block;
  color: @background;
  background: @color3;
}
.header-cart-href:hover{
    text-decoration: none;
    background: darken(@color3, 10%);
    color: @background;
}
/* ---- 3.4 Menu ---- */


#header-menu{
  list-style:none;
  padding:15px 0 0 0;
  margin:0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  display:block;
}

#header-menu:after,
#header-menu:before{
  clear:both;
  content:'';
  display:block;
}
#header-menu li {
  background-color:@color4;
  display:block;
  position: relative;
}
#header-menu ul.sub {
  display:none;
  position: absolute;
  left: 0;
  z-index: 22;
  padding-left: 0;
  top: auto;
  box-shadow: 0 5px 5px 0 rgba(0,0,0,.1);
}

#header-menu ul.sub li {
  float: none;
}

#header-menu li:hover ul.sub {
  display: block;
}

#header-menu li a {
  display: block;
  padding: 13px 25px;
  text-align:center;
  line-height: 14px;
  color:@color9;
  transition: background-color 0.1s ease-in-out;
  font-weight: 300;
  text-decoration:none;
}

#header-menu li a.active,
#header-menu li a:hover {
  color: @background;
  background-color: @color8;
  -webkit-box-shadow: 0 4px 0 0 @color3 inset;
  -moz-box-shadow:    0 4px 0 0 @color3 inset;
  box-shadow:         0 4px 0 0 @color3 inset;
}

@media (min-width: 768px){
  #header-menubar{
    padding: 0;
  }

  #header-menu{
    float: none !important;
  }

  #header-menu li {
    float: none;
  }

  .navbar-collapse.collapse {
    display: none!important;
  }

  .collapse.in {
    display: block !important;
  }

}
@media (min-width: 992px){

  #header-menubar{
    padding: 0 15px;
  }
  #header-menu{
    float: right !important;
    padding: 0;
  }
  #header-menu li {
    float: left;
  }

  .navbar-collapse.collapse {
    display: block!important;
  }
}


/* ---- 3.5 Menu Mobile ---- */

#menu-mobile{
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid @color5;
}
#menu-mobile a{
  color: @color7;
}
.menu-toggle,
.menu-search,
.menu-usermeta,
.menu-basket{
  width: 30px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px auto;
  background-color: transparent;
  border: 0;
  font-size: 0;
}
.menu-toggle{
  background-image: url(../images/hamburger-menu-icon.png);
  margin-right: 15px;
}
.menu-search{
  background-image: url(../images/search-menu-icon.png);
}
.menu-usermeta{
  background-image: url(../images/usermeta-menu-icon.png);
  float: right;
}
.menu-basket{
  background-image: url(../images/basket-menu-icon.png);
  float: right;
  margin-left: 15px;
}

@media (min-width: 768px) {
  .menu-toggle,
  .menu-search,
  .menu-usermeta,
  .menu-basket{
    font-size: 14px;
    font-weight: 700;
    color: @color5;
    width: auto;
    background-position: center left;
    display: inline-block;
    text-indent: 25px;
  }

}

/* ---- Header Fixed ----*/


#main-header.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 21;
  background: @background;
  box-shadow: 0 10px 5px 0 rgba(0,0,0,.1);
}
#main-header.fixed #main-header-top {margin: 0 auto; padding: 10px 30px;}
#main-header.fixed #logo-container {height: 51px;top: 15px;width: 200px;}
#main-header.fixed #custom-logo {height: 51px;width: 200px;}
#main-header.fixed #custom-logo a img {max-width: 100%;}
#main-header.fixed #header-userbar {padding: 0; margin-bottom: 10px; font-size: 12px; line-height: 20px;}
#main-header.fixed #header-menu li a {padding: 8px 25px; line-height: 14px;}
#main-header.fixed #header-cart {font-size: 12px; min-width: 230px; line-height: 30px;}
#main-header.fixed #header-cart #cart-show {width: 30px; height: 30px;}


@media screen and (max-width: 991px) {
  #main-header.fixed #main-header-top {position: static; padding: 0 15px;}
  #main-header.fixed #logo-container {height: 40px; top: 0;}
  #main-header.fixed #custom-logo {height: 40px;}
}



/* ---- 3.6 Slider ---- */

#banner{
  margin-top: 15px;
  position: relative;
  overflow:hidden;
}
#banner .cycle-prev,
#banner .cycle-next{
  width:40px;
  height:40px;
  border: 2px solid @background;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  z-index:10;
  position:absolute;
  top:50%;
  margin-top:-21px;
  cursor:pointer;
  background:no-repeat transparent;
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;

}
#banner .cycle-prev:hover,
#banner .cycle-next:hover{
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
#banner .cycle-prev{
  left:-50px;
  background-image:url(../images/arrow-left-slider.png);
  background-position: 14px center;
}
#banner .cycle-next{
  right:-50px;
  background-image:url(../images/arrow-right-slider.png);
  background-position: 16px center;
}
#banner .imgs{
  z-index:0;
}
#banner .imgs img{
  width:100% !important;
  height:auto !important;
}
#banner .banners-pager{
  z-index:20;
  display:block !important;
  position:absolute;
  bottom: -5px;
  right:10px;
}
#banner .banners-pager > a{
  display:inline-block;
  font-size: 0;
  width:10px;
  height:10px;
  margin:5px;
  background-color: rgba(200,200,200,0.2);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
#banner .banners-pager > a.activeSlide,
#banner .banners-pager > a:hover{
  background-color: rgba(150,150,150,0.5);
}

@media (min-width: 768px) {
  #banner{
    height: 158px;
  }
}

@media (min-width: 992px) {
  #banner{
    height: 206px;
  }
}

@media (min-width: 1200px) {
  #banner{
    height: 250px;
  }
}



/* ---- 3.7 Boxy - Góra ---- */

#boxes-top{
  display: none;
}

#boxes-top a{
  display: block;
  padding: 0;
}


#boxes-top a img{
  max-width: 100%;
  min-width: 100%;
}

#boxes-top p{
  margin-bottom: 0;
}

@media (min-width: 992px) {
  #boxes-top{
    background: url(../images/buttonsTopDivider.png) no-repeat bottom center;
    width: auto;
  }

  #boxes-top a:first-child{
    padding-left: 15px;
  }
  #boxes-top a:last-child{
    padding-right: 15px;
  }
  #boxes-top a:nth-child(even){
    /*padding-right: 15px;*/
  }
}

#box-wrapper {
  display: flex;
}
#box-wrapper p {
  margin-bottom: 0;
}
#box-wrapper a{
  flex-shrink: 0;
  flex-grow: 1;
  transition: ease all 250ms;
  background: @color3;
  color: @background;
  padding: 15px;
}
#box-wrapper h2 {
  font-size: 24px;
  margin: 0;
}
#box-wrapper a:hover {
  opacity: 0.8;
  text-decoration: none
}
#box-wrapper a img{
  max-width: 100%;
  min-width: 100%;
}

@media screen and (max-width: 800px) {
  #box-wrapper {
    display: block;
    text-align: center;
  }
  #box-wrapper a {
    margin: 20px;
    display: inline-block;
    min-width: 42%;
  }
}
@media screen and (max-width: 440px) {
  #box-wrapper a {
    width: 100%;
    margin: 10px 0;
  }
}


/* -----------------------------------------------------------------------------
4. Stopka */

#footer{
  margin-top: 45px;
}

/* ---- 4.1 Boxy - Dół ---- */

#boxes-bottom{
  border-top: 10px solid @color5;
  background-color: @color4;
  padding: 25px 0;
}

#boxes-bottom a > p{
  padding: 0;
  margin: 0;
}
#boxes-bottom a{
  display: block;
  text-align: center;
  -webkit-box-shadow: 1px 0 0 0 @color5, -1px 0 0 0 @background inset;
  -moz-box-shadow:    1px 0 0 0 @color5, -1px 0 0 0 @background inset;
  box-shadow:         1px 0 0 0 @color5, -1px 0 0 0 @background inset;
}
#boxes-bottom a:last-child{
  -webkit-box-shadow: none;
  -moz-box-shadow:    none;
  box-shadow:         none;
}


/* ---- 4.1 Newsletter ---- */

#newsletter-agreements {
    display: none;
}

#newsletter {
  background-color: @color5;
  padding: 35px 0;
}
#newsletter .newsletter-desc {
  text-align: center;
  width: 100%;
  padding-left: 0;
  float:none;
  margin: 0 0 20px 0;

  color: @color7;
  font-weight: 300;
  font-size: 14px;
  line-height: 17px;
}
#newsletter .newsletter-form {
  float:none;
}
#newsletter .newsletter-form input.email{
  width: 100%;
  margin-left: 0;

  height: 48px;
  border: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-size: 16px;
  text-indent: 50px;
  padding:0;
  background: url(../images/newsletter-envelope.jpg) no-repeat left 16px center @background;
}
#newsletter .newsletter-form input.submit{
  margin-left: 0;
  margin-top: 10px;
  width: 100%;

  color: @background;
  background-color:@color1;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 17px 50px;
  border: 0;
  font-weight: 300;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 13px;
  &:hover {
        background-color: darken(@color1, 10%);   
    }
}

@media (min-width: 992px) {
  #newsletter .newsletter-desc {
    text-align: right;
    width: 360px;
    padding-left: 150px;
    margin: 0;
    float:left;
  }
  #newsletter .newsletter-form {
    float:left;
  }
  #newsletter .newsletter-form input.email{
    width: 320px;
    margin-left: 25px;
    margin-bottom: 0;
  }
  #newsletter .newsletter-form input.submit{
    width: auto;
    margin-left: 25px;
    margin-top: 0;
  }
}


/* ---- 4.1 Opinie klientów ---- */

#footer-testimonials-container{
  background-color:#f2f5f8;
  padding: 40px 0;
}
#footer-testimonials-container p{
  color: @color7;
  font-weight: 300;
}
#footer-testimonials-container p.lead{}
#footer-testimonials-container p.desc{
  margin-bottom: 40px;
}
.single-testimonial{
  margin-left: 15px;
  margin-right: 15px;
}
.single-testimonial > p{
  border: 1px solid @color5;
  background-color: @background;
  padding: 30px;
  position: relative;
}
.single-testimonial > p:after{
  content: '';
  display: block;
  position:absolute;
  bottom: -7px;
  left: 50px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 6px 0 6px;
  border-color: @background transparent transparent transparent;
}

.testimonial-client{
  padding-left: 45px;
  padding-top: 10px;
}
.testimonial-client .testimonial-author{
  font-weight: bold;
  font-size: 18px;
  display:block;
}

#footerTestimonials .slick-prev,
#footerTestimonials .slick-next{

  font-size: 0;
  line-height: 0;

  position: absolute;
  top: 50%;

  display: block;

  width: 20px;
  height: 20px;
  margin-top: -10px;
  padding: 0;

  cursor: pointer;

  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}
#footerTestimonials .slick-prev:before,
#footerTestimonials .slick-next:before{
  font-size: 30px;
  line-height: 11px;
  height: 20px;
  width: 20px;
  display: block;
  opacity: .75;
  color: @color8;
  font-weight: 900;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#footerTestimonials .slick-prev{
  left: -10px;
}
#footerTestimonials .slick-prev:before{
  content: '\002039';
}
#footerTestimonials .slick-next{
  right: -10px;
}
#footerTestimonials .slick-next:before{
  content: '\00203A';
}
#footerTestimonials .slick-prev.slick-disabled:before,
#footerTestimonials .slick-next.slick-disabled:before
{
  opacity: .25;
}

@media (min-width: 768px) {
  #footerTestimonials .slick-next{
    right: -20px;
  }
  #footerTestimonials .slick-prev{
    left: -20px;
  }
}


/* ---- 4.1 Menu - Stopka ---- */
#productsFtrMenu {
  padding-top: 20px;
}

#productsFtrMenu ul {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
}
#productsFtrMenu h3 {
  color: @background;
  font-weight: 300;
  font-size: 14px;
  margin: 0 0 10px;
  padding: 10px 15px;
}
#productsFtrMenu a {
  font-size: 12px;
  font-weight: 300;
  line-height: 14px;
  display: block;
  border-bottom: 1px solid @color7;
  color: @color6;
  padding: 7px 0;
}
#productsFtrMenu li {
  padding: 0 15px;
}

#footer-menu-container {
  background-color: @color8;
}
#footer-menu{
  padding-top: 20px;
  padding-bottom: 20px;
  margin-bottom: 0;
}
#footer-menu a {

}
#footer-menu a:hover {

}
#footer-menu li > h3{
  margin: 0;
  background: url(../images/show-more-arrow.png) right 10px center no-repeat;
}
#footer-menu li > h3.opened{
  background: url(../images/show-less-arrow.png) right 10px center no-repeat;
}
#footer-menu li.footerMenuKontakt > h3,
#footer-menu li > h3 > a{
  font-weight: 300;
  font-size: 14px;
  color: @background;
  text-decoration: none;
  display: block;
  margin-bottom: 10px;

  padding: 10px;
  border: 1px solid @color8;
}
.footerMenuMainLi address,
.footerMenuMainLi ul.sub {
  list-style: none;
  margin: 0;
  min-width:150px;
  overflow: hidden;

  display: block;
  padding: 0 10px 10px 10px;
}
.footerMenuMainLi > ul.sub > li > a  {
  font-size: 12px;
  font-weight: 300;
  line-height: 28px;
  display: block;
  border-bottom: 1px solid @color7;
  color: @color6;
}
.kontakt-footer{
  font-size: 12px;
  line-height: 24px;
  color: @color6;
}
.kontakt-footer a:hover{
  color: @color1;
}

@media (min-width: 768px) {
  #footer-menu li.footerMenuKontakt > h3,
  #footer-menu li > h3 > a{
    border: 0;
    padding: 10px 0;
    display: block;
  }
  #footer-menu li > h3,
  #footer-menu li > h3.opened{
    background: transparent;
  }

  .footerMenuMainLi address,
  .footerMenuMainLi ul.sub {
    height: auto;
    display: inline-block;
    padding: 0;
  }
}




/* ---- 4.1 Copyrights ---- */

#copyrights {
  text-align: center;
  font-size: 10px;
  background-color: @color5;
  padding: 10px 0;
}

#copyrights a {
  color: @background;
}

#copyrights a:hover {
  color: @color9;
}

/* -----------------------------------------------------------------------------
5. Lewe Menu - Produkty */

/* 5.1 Product Search */

#mobile-search-container{
  padding-top: 15px;
}
#mobile-search-container #product-search,
#mobile-search-container #product-search input.text{
  margin-bottom: 0;
}

#product-search{
  position: relative;
  margin-bottom: 20px;
}

#product-search input.text{
  width: 100%;
  display: block;
  border: 1px solid @color5;
  border-radius: 5px;
  padding: 10px;
  background: transparent;
}
#product-search button.submit{
  border:0;
  background: transparent;
  position: absolute;
  right: 0;
  top: 0;
  padding: 0;
}
#product-search button.submit .icon-search-btn{

  width: 40px;
  height: 40px;
  display: block;
  border: none;
  background:  url(../images/search-menu-icon.png) center no-repeat;
  background-size: 40%;

}


/* 5.2 Menu */
#products-menu-left{}

#products-menu-left ul.products h3{
  font-weight: 300;
  font-size: 12px;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  cursor: pointer;
}
#products-menu-left ul.products h3.active,
#products-menu-left ul.products h3:hover{
  font-weight: 700;
}
#products-menu-left ul.products ul{
  list-style: none;
  margin: 0 -15px;
  padding: 0;
  display: none;
}
#products-menu-left ul.products ul li a{
  font-weight: 300;
  display: block;
  font-size: 12px;
  border-top: 1px solid @color4;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 25px;
}
#products-menu-left ul.products ul li:first-child a{
  margin-top: 10px;
}
#products-menu-left ul.products ul li:last-child a{
  padding-bottom: 0;
}
#products-menu-left ul.products ul li {
  padding: 0;
  border: none;
}

/* -----------------------------------------------------------------------------
6. Wspólne dla stron */

.page-heading{
  color: @color8;
  font-size: 30px;
  font-weight: 300;
  margin-top: 20px;
  margin-bottom: 20px;
  position: relative;
}
.page-heading:after{
  content: '';
  width: 165px;
  height: 2px;
  display: block;
  position: absolute;
  left: 0;
  top: -15px;
  background-color: @color3;
}

.cart-heading{
  border-bottom: 1px solid @color4;
  padding-bottom: 10px;
}
.cart-heading a{
  text-decoration: none;
}
.cart-heading a.active{
  font-weight: 700;
}

.spacer-15{
  display: block;
  margin: 15px 0;
}
.spacer-30{
  display: block;
  margin: 30px 0;
}
.spacer-60{
  display: block;
  margin: 60px 0;
}

.small {
	font-size: 10px;
}

.drop-container {
    position: relative;
	.drop {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 2;
		background: @color4;
		box-shadow: 0 4px 6px 0 rgba(0,0,0,.1);
		max-height: 200px;
		overflow: auto;
		ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
		a {
			display: block;
			padding: 8px 16px;
		}
	}
	&:hover .drop {
		display: block;
	}
}


/* -----------------------------------------------------------------------------
7. Strona główna */
.icons-wrap {text-align: center;}
.homepage-product{
  display: inline-block;
  width: 164px;
  vertical-align: top;
  margin-top: 10px;
  margin-bottom: 10px;
  float: none;
}
.homepage-product.col-sm-12 {
  width: 100%;
}

.homepage-product:last-child h4{
  font-weight: 900;
  color: @color8;
  font-size: 30px;
}

.homepage-product:last-child .btn{
  background: @color4; /* Old browsers */
  background: -moz-linear-gradient(top,  @color4 0%, @color4 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,@color4), color-stop(100%,@color4)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  @color4 0%,@color4 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  @color4 0%,@color4 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  @color4 0%,@color4 100%); /* IE10+ */
  background: linear-gradient(to bottom,  @color4 0%,@color4 100%); /* W3C */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@color4', endColorstr='@color4',GradientType=0 ); *//* IE6-9 */

  text-transform: lowercase;
  color: @color8;
}

.homepage-product .product-title-front,
.homepage-product .product-title-back{
  text-align: center;
  display: block;
  font-size: 14px;
  padding: 0 10px;
  font-weight: 300;
}
.homepage-product .product-title-front{
  color: @color7;
}
.homepage-product:hover {
  text-decoration: none;
}

.homepage-product .product-title-back{
  color: @color3;
}
/*@media (min-width: 768px) {*/
/*    .homepage-product{*/
/*        height:175px;*/
/*    }*/
/*    .homepage-product .product-title-front,*/
/*    .homepage-product .product-title-back{*/
/*        bottom: -170px;*/

/*    }*/
/*}*/

/*@media (min-width: 992px) {*/
/*    .homepage-product{*/
/*        height:175px;*/
/*    }*/
/*    .homepage-product .product-title-front,*/
/*    .homepage-product .product-title-back{*/
/*        bottom: -165px;*/
/*    }*/
/*}*/

/*@media (min-width: 1200px) {*/
/*    .homepage-product{*/
/*        height:218px;*/
/*    }*/
/*    .homepage-product .product-title-front,*/
/*    .homepage-product .product-title-back{*/
/*        bottom: -197px;*/
/*    }*/
/*}*/





/* entire container, keeps perspective */
.homepage-product.flip-container {
  perspective: 1000px;
}
/* flip the pane when hovered */
.homepage-product.flip-container:hover .flipper,
.homepage-product.flip-container.hover .flipper {

}

.homepage-product.flip-container,
.homepage-product  .front,
.homepage-product  .back {

}

/* flip speed goes here */
.homepage-product .flipper {
  transition: 0.3s;
  transform-style: preserve-3d;
  -webkit-transition: 0.3s;
  -webkit-transform-style: preserve-3d;
  position: relative;
  display: block;
}
.homepage-product .flipper.solo .front {
  transition: ease all 250ms;
}
.homepage-product .flipper.solo:hover .front {
  transform: scale(1.1);
}
.homepage-product .flipper.solo .product-title-front {
  transition: ease all 250ms;
}
.homepage-product .flipper.solo:hover .product-title-front {
  color: @color3;
}

/* hide back of pane during swap */
.homepage-product .front,
.homepage-product .back {
  backface-visibility: hidden;
  display: block;
}

/* front pane, placed above back */
.homepage-product .front {
  text-decoration: none!important;
}

/* back, initially hidden pane */
.homepage-product .back {
  position: absolute;
  top: 0;
  left: 0;
}

.homepage-product.flip-container:hover .flipper,
.homepage-product.flip-container.hover .flipper,
.homepage-product.flip-container.flip .flipper {

}


/*@media (max-width: 767px) {*/

/*    .homepage-product{*/
/*        overflow: visible;*/
/*    }*/

/*    .homepage-product  .front,*/
/*    .homepage-product  .back {*/
/*        position: relative;*/
/*    }*/
/*    .homepage-product  .back{*/
/*        display: none;*/
/*    }*/

/*    .homepage-product .product-title-front,*/
/*    .homepage-product .product-title-back{*/
/*        font-size: 12px;*/
/*        position: absolute;*/
/*        bottom: 5px;*/
/*    }*/

/*}*/

@media (min-width: 768px) {

  /* flip the pane when hovered */
  .homepage-product.flip-container:hover .flipper,
  .homepage-product.flip-container.hover .flipper {
    transform: rotateY(180deg);
  }

  .homepage-product.flip-container:hover .flipper,
  .homepage-product.flip-container.hover .flipper,
  .homepage-product.flip-container.flip .flipper {
    transform: rotateY(180deg);
  }

  /* front pane, placed above back */
  .homepage-product .front {
    z-index: 2;
    /* for firefox 31 */
    transform: rotateY(0deg);
  }

  /* back, initially hidden pane */
  .homepage-product .back {
    transform: rotateY(180deg);
  }



}


#contactWrap {
  background: @color4;
  box-shadow: 0 3px 4px 0 rgba(0,0,0,.1);
  padding: 20px;
}

#map {height:360px;width:100%; z-index: 1;}

@media screen and (max-width: 767px) {
  #contactWrap > div {
    width: 100%;
  }
}
section {padding: 20px 0 0;}
section h1, section h2, section h3 {
  text-align: center;
}
section h1 {
  margin: 0 0 50px;
}
section > p {
  max-width: 800px;
  margin: 20px auto 40px;
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  section > p {font-size:14px;}
}

/* -----------------------------------------------------------------------------
8. Rejestracja */

#register{}

#register-form{}

.register-heading{
  color: @color8;
  font-size: 30px;
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 20px;
  position: relative;
}
.register-heading:after{
  content: '';
  width: 165px;
  height: 2px;
  display: block;
  position: absolute;
  left: 0;
  top: -20px;
  background-color: @color3;
}


#register-login-form h3{
  font-size: 18px;
  font-weight: 300;
  margin-bottom: 20px;
}

#register-form form .type-checkboxes{
  margin-bottom: 15px;
}
#register-form form .type-checkboxes br{
  display: block;
}
#register-form label{
  font-weight: 300;
  font-size: 14px;
}

#register-form #welcome_box{
  -webkit-box-shadow: none;
  -moz-box-shadow:    none;
  box-shadow:         none;
}

#register-form #welcome_box .type-checkboxes label{
  margin-right: 6px;
}


#register-form label[for="korespondencyjne"],
#register-form #welcome_box table:nth-child(5),
#register-form #welcome_box table:nth-child(5) tr:nth-child(even),
#register-form #welcome_box div:nth-child(7) p{
  font-size: 10px;

  margin-bottom:10px;
}
#register-form #welcome_box div:nth-child(7) div:first-child{
  margin-left: 0 !important;
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  #register-form #welcome_box{
    -webkit-box-shadow: 1px 0 0 0 @color4;
    -moz-box-shadow:    1px 0 0 0 @color4;
    box-shadow:         1px 0 0 0 @color4;
  }
}



#login-form form tr,
#register-form form tr{
  display: block;
}

#login-form form td,
#register-form form td{
  display: block;
}

#login-form form br,
#register-form form br{
  display: none;
}

#login-form form td.label,
#login-form form td:first-child,
#register-form form td:first-child{
  display: none;
}

#register-form form > div:nth-of-type(2) table:nth-child(5) > tbody > tr > td{
  display: inline;
}

#login-form form tr:nth-child(3) td:first-child{
  display: block;
}


#login-form form td:last-child,
#register-form form td:last-child{
  box-sizing: content-box;
}



#register-form > form table,
#login-form > form table{
  width: 100%;
}

#register-form > form table td,
#login-form > form table td{
  position: relative;
}

#register-form > form table td select,
#login-form > form table td select{
  width:100%;
}
#register-form > form .customSelect{
  margin-bottom: 15px;
}

#register-form > form > div:first-child tr.extra-nr-budynku-lokalu input,
#register-form > form > div:nth-of-type(2) #dane_korespondencyjne tr.extra-nr-budynku-lokalu > td:nth-child(2) > input{
  width: 48%;
}
#register-form > form > div:first-child tr.extra-nr-budynku-lokalu > td:nth-child(2) input:first-child,
#register-form > form > div:nth-of-type(2) #dane_korespondencyjne tr.extra-nr-budynku-lokalu > td:nth-child(2) > input:first-child{
  float: left;
}
#register-form > form > div:first-child tr.extra-nr-budynku-lokalu > td:nth-child(2) input:last-child,
#register-form > form > div:nth-of-type(2) #dane_korespondencyjne tr.extra-nr-budynku-lokalu > td:nth-child(2) > input:last-child{
  float: right;
}

#register-form > form > div:first-child tr.extra-nr-budynku-lokalu > td:nth-child(2) input:first-child,
#register-form > form > div:nth-of-type(2) #dane_korespondencyjne tr.extra-nr-budynku-lokalu > td:nth-child(2) > input:first-child{
  /*margin-right: 15px;*/
}

.vies-check-info{
  border: 1px solid @color5;
  background: @color4 url(images/ui-bg_flat_95_fef1ec_40x100.png) 50% 50% repeat-x;
  color: @color2;
  padding: 10px;
  margin-bottom: 15px;
  font-size: 12px;
}

#login-form input[type="submit"],
#register-form .register-button,
#variantParams .upload-button{
  /* Przyciski */
}

#login-form input[type="submit"]
{
  /* Przyciski */
}


#login-form .labelInfo{
  color: @color6;
  margin-bottom: 10px;
  text-align: right;
}
#login-form .labelInfo a{
  color: @color6;
  font-weight: 700;
}



.login-desc{
  margin-left: 0;
  box-shadow: none;

  color: @color8;
  font-size: 14px;
  font-weight: 300;
  line-height: 16px;


  padding-left: 100px;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 0;
  margin-right: 20px;
  background: url(../images/login-desc-bg.png) center left 40px no-repeat;
}

@media (min-width: 768px) {
  .login-desc{


    margin-left: 70px;
    box-shadow: -1px 0 0 0 @color4;
    padding-left: 100px;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 0;

  }
}

/* -----------------------------------------------------------------------------
9. Logowanie */

/* Przypomnienie hasła */
#remindPassword{}

#remindPassword > form table tr,
#remindPassword > form table tr td{
  display: block;
}

#remindPassword > form .label{
  color: @color9;
  text-align: left;
}

#remindPassword #recaptcha_image{
  margin-bottom: 20px;

}

#remindPassword input.pinkButton{
  color: @background;
  background-color: @color2;
  border-radius: 5px;
  padding: 15px 30px;
  border: 1px solid @color2;
}

/* Informacja o wysłanym przypomnieniu */
#info{}



/* -----------------------------------------------------------------------------
10. Widok produktu opartego na wariantach */


#topContent h1 {
  font-size: 30px;
  margin: 10px 0
}
#topContent p {
  font-size: 14px; margin: 0;
}
.galleryCnt {
    a {
        display: none;
        text-align: center;
        &:first-child {
          display: block;
          position: relative;
          /*padding-bottom: 40px;*/
          /*&:before {*/
          /*    content: 'Galeria produktu';*/
          /*    line-height: 20px;*/
          /*    font-size: 16px;*/
          /*    padding: 5px;*/
          /*    text-align: center;*/
          /*    display: block;*/
          /*    position: absolute;*/
          /*    bottom: 0;*/
          /*    left: 50%;*/
          /*    margin-left: -80px;*/
          /*    width: 160px;*/
          /*    background: @color3;*/
          /*    color: @background;*/
          /*    transition: ease all 250ms;*/
          /*  }*/
            &:hover:before {
              opacity: 0.8;
            }
        }
        img {
          max-width: 100%;
        }
    }
}

#product-page{

}

#product-variant{

}

.product-heading{
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid @color4;
  &.mobile {
        display: none;
    }
}
@media screen and (max-width: 991px) {
    .product-heading {
        &.mobile {
            display: block;
        }
        &.desktop {
            display: none;
        }
    }
}
.product-heading .heading-templates{
  margin-top: 10px;
  float: none;
  display: block;
}

.product-heading .heading-templates:after,
.product-heading .heading-templates:before{
  content: '';
  display: block;
  clear: both;
}

@media (min-width: 992px) {
  .product-heading .heading-templates{
    margin-top: 0;
    float: right;
    display: inline;
  }
}

#variantParamsFields{
  margin-bottom: 20px;
}

.heading-third,
.heading-alt,
#variantParamsFields h2{
  font-size: 18px;
  font-weight: 300;
  color: @color7;
  position: relative;
}
.heading-alt:after,
#variantParamsFields h2:after{
  content: '';
  width: 165px;
  height: 2px;
  background-color: @color1;
  position: absolute;
  left: 0;
  top: -15px;
}
.heading-third:after{
  content: '';
  width: 165px;
  height: 2px;
  background-color: @color5;
  position: absolute;
  left: 0;
  top: -10px;
}

#variantParamsFields .paramName{
  font-size: 12px;
  font-weight: 700;
  color: @color8;
  display: inline-block;
  text-indent: 0;
  float: none;
  margin-right: -4px;
  vertical-align: middle;
}

#variantParamsFields .paramValue{
  position: relative;
  float: none;
  display: inline-block;
  width: 380px;
}
@media screen and (max-width: 991px) {
  #variantParamsFields .paramValue {width: 100%; margin-top: 5px;}
}

#variantParams{
  margin-bottom: 20px;
}

#variantParams .product-files-form-information{
  color: @color9;
  font-size: 12px;
  line-height: 14px;
  margin: 20px 0;
}
#variantParams .upload-button{
  background-color: @color2;
  float:none;
  display: inline-block;
  margin-top: 20px;
  padding: 10px 35px;
}

#variantParams .product-file-list table{
  width: 100%;
  margin: 0;
}
#variantParams .product-file-list table td{
  text-align: center;
  font-size: 12px;
  border-bottom: 1px solid @color4;
}
#variantParams .product-file-list table tr:nth-child(even){
  background-color: @color5;
}

#variantParams .file-delete-container input[type="submit"]{
  border: 1px solid @color4;
  background-color: @color4;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: @color7;
}
#variantParams .file-delete-container input[type="submit"]:hover{
  color: @background;
  background-color: darken(@color4, 10%);
}

.product-view #main.col-md-9 {
  width: 75% !important;
}

.heading-third,
.heading-alt,
#variantParamsFields h2, h2.border-top {
  font-size: 18px;
  font-weight: 300;
  color: @color7;
  position: relative;
}

.heading-alt:after,
#variantParamsFields h2:after, .border-top:after {
  content: '';
  width: 165px;
  height: 2px;
  background-color: @color1;
  position: absolute;
  left: 0;
  top: -15px;
}

#result {
  padding-top: 21px;
}

.product-heading {

}

.param-auto-changed {
  font-size: 10px;
  color: darkgray;

}

.third-column-price-chosen {
  border: 2px solid @color3 !important;
}

td.price .inner {
  cursor: pointer;
  border: 1px solid transparent
}
td.price .inner:hover {
  border: 1px solid @color3
}

.tc-hidden {
  display: none;
}
@media screen and (min-width: 992px) {
  .paramName {
    text-align: right
  }
}
select.paramSelect {
  margin-bottom: 10px
}
#variantParamFields input[type="text"] {
  margin-bottom: 0;
}
#productTabsContent > div {display: none}
#productTabsMenu {
  border-bottom: 1px solid @color4;
  margin-bottom: 15px;
}
#productTabsMenu > ul {
  list-style: none;
  padding: 15px 0;
  margin: 0;
}
#productTabsMenu > ul > li {
  color: @color8;
  display: inline-block;
  padding: 10px 30px;
  background-color: transparent;
  border: 1px solid @color8;
  text-decoration: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-weight: 300;
  margin: 1px 0;
  cursor: pointer;
}
#productTabsMenu > ul > li.active {
  background-color: @color3;
  color: @background;
}
#productTabsMenu > ul > li:hover {
  background-color: @color3;
  color: @background;
  opacity: 0.7
}
#productTabsMenu > ul > li.active:hover {
  opacity: 1
}
#productTabsContent .productImg {
  display: none;
}
#productTabsContent p {
  font-weight: 300;
  color: @color7;
  line-height: 20px;
}

.order-info-params {position: relative}
.order-info-params .right {position: absolute; bottom: 20px; right: 20px}
.order-info-params .right span {color: @color1}
.order-info-params .upload-button {
  color: @background;
  font-size: 14px;
  font-weight: 300;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 0;
  background-color: @color8;
  float: none;
  display: inline-block;
  margin-top: 20px;
  padding: 10px 35px;
}

.order-info-params .product-files-form-information{
  font-size: 12px;
  line-height: 14px;
  margin: 20px 0 0;
  max-width: 250px
}

.order-info-params .product-file-list table{
  width: 100%;
  margin: 0;
}
.order-info-params .product-file-list table td{
  text-align: center;
  font-size: 12px;
  border-bottom: 1px solid @color5;
}
.order-info-params .product-file-list table tr:nth-child(even){
  background-color: @color4;
}

.order-info-params .file-delete-container input[type="submit"]{
  border: 1px solid @color5;
  background-color: @color4;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: @color8;
}
.order-info-params .file-delete-container input[type="submit"]:hover{
  color: @background;
  background-color: darken(@color4, 10%);
}

.order-info-params {
  border: 1px solid @color5;
  padding: 20px;
}
.order-info-params h2 {
  margin-top: 0
}
.order-info-params span {
  line-height: 16px;
  font-weight: 700;
  font-size: 12px;
  color: @color7;
}

.order-info-params .light {
  font-size: 12px;
  font-weight: 100;
  color: @color7;
}

.order-info-params .addToCart {
  color: @background;
  display: inline-block;
  padding: 10px 30px;
  background-color: @color1;
  border: 1px solid @color1;
  text-decoration: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-weight: 500;
  margin-top: 20px;
}
#result-container {
  width: 100%;
  padding: 0;
}
#variantParamsFields .param {
  padding-right: 0;
}
#productParams {
    padding-top: 40px;
    #main {
        &> .col-md-3 {
            float: right;
            padding: 0;
            width: 260px;
        }
        .clearfix.mobile {display: none}
    }
}
@media screen and (max-width: 1199px) {
    #productParams {
        #main {
            &> .col-md-3 {
                width: 25%;
            }
        }
    }
}
@media screen and (max-width: 991px) {
    #productParams {
        #main {
            &> .col-md-3 {
                width: 100%;
                padding: 0 15px;
                text-align: center;
                .galleryCnt {
                    min-width: 250px;
                    width: 45%;
                    display: inline-block;
                }
                #result-container {
                    display: inline-block;
                    float: none;
                    min-width: 350px;
                    width: 55%;
                    margin-left: -4px;
                    padding: 0 0 0 15px;
                    vertical-align: top;
                    #result {
                        margin-top: 0;
                        .border-top {
                            text-align: left;
                        }
                    }
                }
            }
            .clearfix.mobile {display: block}
        }
    }
}
@media screen and (max-width: 600px) {
    #productParams {
        #main {
            &> .col-md-3 {
                .galleryCnt {
                    max-width: 350px;
                    width: 100%;
                }
                #result-container {
                    width: 100%;
                    margin-left: auto;
                    padding: 0 15px;
                }
            }
        }
    }
}
#variantParamsFields {
    .position-relative {
        position: relative;
    }
    .variant-header {
        background: @color5;
        text-align: right;
        width: 43%;
        float: left;
        padding: 5px 10px;
        .small {
            font-size: 11px;
            color: @color8;
        }
        .highlighted {
            font-weight: 700;
            font-size: 16px;
            color: @color8;
        }
    }
    .priceCnt {
        background: @color7;
        color: @background;
        width: 351px;
        position: absolute;
        left: 43%;
        bottom: 0;
        top: 0;
        .priceCol {
            position: absolute;
            padding-left: 70px;
            bottom: 0;
            top: 0;
            .left {
                position: absolute;
                left: 10px;
                top: 50%;
                font-size: 14px;
                line-height: 20px;
                margin-top: -10px;
            }
            .right {
                margin-top: 10px;
                .big {
                    font-size: 20px;
                    font-weight: 700;
                }
                .small {
                }
            }
        }
        .buttonCol {
            position: absolute;
            left: 50%;
            bottom: 0;
            top: 0;
            background: @color5;
            right: 0;
            a {
                background: @color1;
                position: absolute;
                top: 50%;
                margin-top: -17px;
                right: 20px;
                left: 20px;
                color: #fff;
                &:hover {
                    background: darken(@color1, 10%)
                }
            }
        }
    }
}
@media screen and (max-width: 1199px) {
    #variantParamsFields {
        .variant-header {
            .small {
                font-size: 9px;
            }
            .highlighted {
                font-size: 18px;
            }
        }
        .priceCnt {
            .priceCol {
                padding-left: 60px;
                .left {
                    font-size: 16px;
                }
                .right {
                    .big {
                        font-size: 16px;
                    }
                }
            }
            .buttonCol {
                a {
                    right: 10px;
                    left: 10px;
                }
            }
        }
    }
}
@media screen and (max-width: 991px) {
    #variantParamsFields {
        .variant-header {
            width: 50%
        }
        .priceCnt {
            width: 50%;
            left: 50%
        }
    }
}
@media screen and (max-width: 680px) {
    #variantParamsFields {
        .variant-header {
            width: 100%;
            float: none;
        }
        .priceCnt {
            position: relative;
            width: 100%;
            float: none;
            left: auto;
            top: auto;
            bottom: auto;
            .buttonCol {
                position: relative;
                left: auto;
                bottom: auto;
                top: auto;
                width: 50%;
                margin: 0 0 0 auto;
                padding: 20px;
                a {
                    display: block;
                    margin: 0;
                    position: static;
                }
            }
        }
    }
}


#variantMatrix {
  margin-bottom: 0;
}
#variantMatrixTable {
  margin-top: 0
}
#variantMatrixTable th {
  background: @color7;
  color: @color4
}
#variantMatrixTable .variant-second-row th {
  background: @color4;
  color: @color8
}
.modal-header {
  padding: 5px;
}
.modal-body {
  padding: 0;
}

/* Informacje o zamówieniu */
.project-order-widget-in-product{
  text-align: left;
  margin-bottom: 45px;
}
.project-order-widget-in-product legend{
  display: none;
}
.project-order-description-label{
  font-size: 18px;
  font-weight: 300;
  color: @color7;
  position: relative;
  border: 0;
  display: block;
}
.project-order-description-label:after{
  content: '';
  width: 165px;
  height: 2px;
  background-color: @color1;
  position: absolute;
  left: 0;
  top: -15px;
}
.project-creation-user-info{
  display: none;
}
#project-order-description{
  max-width:100%;
  width:100%;
  height: 100px;
  border: 1px solid @color4;
}

#set-project-order-pre-cart-form input[type="submit"]{
  background-color: @color2;
  float: none;
  margin-top: 20px;
  border-radius: 5px;
  padding: 15px 30px;
  color: @background;
  border: 0;
  display: none;
}
#set-project-order-pre-cart-form .loading{
  height: 32px;
}


/* Tabs */
#productTabsMenu{
  border-bottom: 1px solid @color4;
  margin-bottom: 15px;
}

#productTabsMenu > ul{
  list-style:none;
  padding: 15px 0;
  margin: 0;
}
#productTabsMenu > ul > li{
  display: inline-block;
  margin: 1px 0;
}
#productTabsMenu > ul > li > a{
  color: @color5;
  display: inline-block;
  padding: 10px 30px;
  background-color: transparent;
  border: 1px solid @color4;
  text-decoration: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-weight: 300;
}
#productTabsMenu > ul > li > a.active{
  background-color: @color4;
  color: @background;
}

#productTabsContent .productImg{
  display: none;
}

#productTabsContent p{
  font-weight: 300;
  color: @color8;
  line-height: 20px;
}

#templateList{
  list-style: none;
  padding: 0;
  margin: 0;
}

#templateList li{
  display: inline-block;
  margin: 0 5px;
}

.heading-templates li{
  display: inline-block;
  margin: 0 5px;
}

/* Tabs Galeria Portfolio*/
#product-gallery a{
  display: block;
  width: 200px;
  float: left;
  height:auto;
  overflow: hidden;
  position: relative;
}
#product-gallery a img{
  width: 100%;
}


/* Table */

#variantMatrixTable{
  width: 100%;
  border: 1px solid @color4;
  margin-bottom: 30px;
}

#variantMatrixTable th{
  text-align: center;
  padding: 5px 5px;
}

#variantMatrixTable tr.even{
  background-color: @color4;
}
#variantMatrixTable tr.even td{
  border-right: 1px solid @background;
}
#variantMatrixTable tr.odd td,
#variantMatrixTable tr:nth-child(odd) td{
  border-right: 1px solid @color4;
}

#variantMatrixTable tr td:last-child{
  border-right: none;
}


#variantMatrixTable td{
  text-align: center;
  font-weight: 300;
  padding: 5px 5px;
  color: @color9;
}

#variantMatrixTable .addToCart{
  width: 37px;
  height: 35px;
  display: inline-block;
  background: url(../images/do-koszyka-produkt.png) center center no-repeat @color5;
  font-size:0;
  border: 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;

}
#variantMatrixTable .addToCart:hover{
  background-color: @color2;
}


.projectsWidget{
  text-align: right;
}
.creator-create-project-button{
  background-color: @color4;
  padding: 10px 20px;
  color: @background;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  display: inline-block;
}
.creator-create-project-button:hover{
  color: @background;
}

/* Automatyczny Preflight */
.pre-order-automatic-preflight-root{
  text-align: left;
  padding-bottom: 20px;
}

.pre-order-automatic-preflight-root legend{
  border-bottom: 0;
  font-size: 18px;
  font-weight: 300;
  color: @color7;
  position: relative;

}

.pre-order-automatic-preflight-root legend:after{
  content: '';
  width: 165px;
  height: 2px;
  background-color: @color1;
  position: absolute;
  left: 0;
  top: -15px;
}




/* Matrix Toggle */
#variantMatrix{
  position: relative;
  overflow: hidden;
  margin-bottom: 40px;
}

.matrix-on span,
.matrix-off span{
  width: 12px;
  line-height: 45px;
  display:inline-block;
  background: url('../images/show-more-arrow.png') no-repeat center center;
  color: transparent;
}

.matrix-off span{
  transform: rotate(180deg);
}

#matrix-toggle-table{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  font-size: 14px;
  color: @color4;
  font-weight: 300;
  text-align: center;
  line-height: 45px;
  background-color: @background;
  box-shadow: 0 0 0 1px @color4 inset;
  cursor: pointer;
}

/* Parametry produktu */

#variantParamsFields{
  margin-bottom: 20px;

}
#variantParamsFields .param{
  position: relative;
}

#variantParamsFields .param .popover-content{
  font-size: 12px;
  min-width: 200px;
}
#variantParamsFields .param .popover-content hr:first-child{
  display: none;
}
#variantParamsFields .param .popover-content hr{
  margin: 5px 0;
}
#variantParamsFields .paramAsk{
  display: none;
}

.param-info{
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 13px;
  border: 1px solid @color6;
  color: @color6;
  text-align: center;
  line-height: 18px;
  font-style: normal;
  cursor: pointer;
  position: absolute;
  right: -5px;
  top: 50%;
  margin-top: -2px;
  font-weight: 700;
  font-family: serif;
  text-indent: -1px;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

}
.param-info:hover{
  background-color: @color6;
  color: @background;
}

.paramAnswer{
  display: none;
}




/* -----------------------------------------------------------------------------
11. Koszyk */
#cart{}

/* Pojedynczy produkt w koszyku */
#cart-items-container .cart-item{
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid @color4;
}
/* - Image */
#cart-items-container .product-img{}
#cart-items-container .product-img img{}

/* - Product Info */
#cart-items-container .product-info{
  color: @color8;
}
#cart-items-container .product-info-name{
  font-weight: 700;
  font-size: 18px;
  margin-top: 15px;
}
#cart-items-container .product-info-params{
  font-size: 14px;
  font-weight: 300;
  margin-bottom: 20px;
}
#cart-items-container .product-remove{
  border: 1px solid red;
  display: inline-block;
  background: transparent;
  font-weight: 300;
  padding: 6px 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  
}
#cart-items-container .product-icon-remove{
  background: url(../images/remove-x.png) center center no-repeat;
  width: 10px;
  height: 10px;
  background-size: 100%;
  display: inline-block;
  margin-right: 5px;
}

/* - Pliki */
#cart-items-container .product-attachment{
  margin-top: 48px;
  box-shadow: 1px 0 0 0 @color4, -1px 0 0 0 @color4;
}

#cart-items-container .product-attachment >.row{
  display: table;
}
#cart-items-container .product-attachment >.row > div{
  display: table-cell;
  float: none;
  vertical-align: middle;
}
#cart-items-container .product-attachment .loading{
  height: 120px;
}
#cart-items-container .product-attachment legend{
  display: none;
}
#cart-items-container .cart-temporary-order-files-manager{
  margin-bottom: 10px;
}

#cart-items-container .product-attachment .upload-button{
    display: block;
    cursor: pointer;
    text-align: center;
    padding: 10px 20px;
    border: 1px solid @color3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: @color3;
    color: @background;
    font-weight: 300;
    text-transform: uppercase;
    position: relative;
    &:hover {
      background-color: darken(@color3, 10%);
    }
}
#cart-items-container .product-attachment .loading{
  width: 100%;
  text-align: center;
  position: absolute;
  top: 50%;
  margin-top: -20px;
  padding: 20px 0;
  background-color: @background;
  z-index: 99;
  box-shadow: 0 0 10px 0 @background;
}
#cart-items-container .file-list-container{
  padding: 0 0 10px 0;
}
#cart-items-container .file-list-container > table{
  /*float: right;*/
}
#cart-items-container .file-list-container .file-name{
  font-weight: 300;
  font-size: 11px;
}
#cart-items-container .file-list-container .file-delete-container input[type="submit"]{
  font-size: 0;
  background: url(../images/remove-x.png) no-repeat center center transparent;
  background-size: 75%;
  border: 1px solid @color4;
  width: 15px;
  height: 15px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-weight: 300;
}


/* - Rabat -*/
.single-element-rabat-form{}

.single-element-rabat-form input[type="text"]{
  border: 1px solid @color5;
  border-radius: 5px;
  background: transparent;
  /*width: 120px;*/
  margin-bottom: 0;
  display: block;
}
.single-element-rabat-form input[type="submit"]{
  display: block;
  width:100%;
  text-align: center;
  padding: 10px 20px;
  border: 1px solid @color2;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-color: @color2;
  color: @background;
  text-transform: uppercase;
  margin: 5px 0;
  &:hover {
      background-color: darken(@color2, 10%);
    }
}

/* hover dla przycisków w koszyku */
#cart-items-container .product-attachment .upload-button:hover,
.single-element-rabat-form input[type="submit"]:hover{
  text-decoration: none;
}


/* - Duplikuj */
.product-duplicate-container{
  text-align: center;
  box-shadow: -1px 0 0 0 @color4;
}
.product-duplicate{
  font-size: 0;
  display: inline-block;
  width: 37px;
  height: 44px;
  background: url(../images/duplicate-icon.png) center center no-repeat;
}
.product-duplicate:hover{
  background-image: url(../images/duplicate-icon-hover.png);
}

/* - Cena */
#cart-items-container .product-price{
  color: @color8;
  font-weight: 400;
  text-align: right;
  position:relative;
  min-height: 158px;
  box-sizing: border-box;
}
#cart-items-container .product-price-container{
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  padding: 0 15px;
}
#cart-items-container .value{
  font-weight: 700;
}
#cart-items-container .price{
  font-size: 14px;
  margin: 0;
}
#cart-items-container .price .value{
  font-size: 32px;
  display: block;
  font-weight: 300;
}

/* Dodatkowe ustawienia */
#additional-settings-container{
  border-bottom: 1px solid @color4;
  margin-bottom: 20px;
}
#additional-settings-container .paramValue{
  position: relative;
}

#additional-settings-container .sendingPrice {
  font-weight: 300;
  color: @color8;
  padding: 20px 0;
}
#additional-settings-container .sendingPrice .value{
  font-size: 32px;
  font-weight: 300;
  display: block;
  line-height: 32px;
}

/* Informacje dodatkowe */
#additionalRealizationInfo{
  margin-bottom: 40px;
}
#additionalRealizationInfo > div{
  border: 1px solid @color4;
  padding: 10px;
  color: @color8;
}
#additionalRealizationInfo > div strong{
  display: block;
  margin-bottom: 10px;
}

/* Informacje o wysyłce */

.sendingRealizationInfo{}
.sendingRealizationInfo .borderBox{
  border: 1px solid @color4;
  padding: 10px;
  color: @color8;
}

#additional-settings-container .sendingRealizationInfo .sendingPrice{
  padding-bottom: 0;
}

/* Ilość paczek */
#cartRealizationInfo{
  margin-bottom: 40px;
}
#cartRealizationInfo > .row{
  margin-right: 0;
  margin-left: 0;
  border: 1px solid @color4;

}
#cartRealizationInfo .title{
  margin-top: 10px;
  color: @color8;
}

.editAddress {
  background-image: url(../images/input-text-bg.png);
  font-size: 0;
  width: 21px;
  height:21px;
  display: inline-block;
  line-height: 30px;
  float:right;
}

.newAddress{
  display: none;

}

.oldAddress{
  font-weight: 700;
}
.oldAddress span{
  display: block;
}



/* Sposób wysyłki */
#boxDetails{
  margin-bottom: 50px;
}

#boxDetails .selected{
  padding-left: 20px;
  background: url(../images/yes-icon-green.png) center left no-repeat;
}

/* Kontener rabatu i podsumowania */
#summary-container{
  margin-bottom: 40px;
}
#summary-container > div:first-child{}
#summary-container > div:first-child > #discount-form{
  box-shadow: 0 0 0 1px @color4 inset;
}
#summary-container > div:last-child{
  color: @background;
}
#summary-container > div:last-child > form{
  background-color: @color1;
}

/* Kupon rabatowy */
#discount-form{
  padding: 40px 20px;
}
#discountForm{}

#discountForm h2{
  font-size: 18px;
  font-weight: 700;
  color: @color9;
  margin: 0 0 10px 0;
}


/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  #summary-container > div:first-child{
    padding-right: 0;
  }
  #summary-container > div:last-child{
    padding-left: 0;
  }

  #discount-form{
    padding: 46px 80px 47px;
  }

}


#summary-container #cartAmount{
  padding: 20px 20px;
  background-color: @color7;
}

#summary-container .cartAmountTotalNetto{
  font-size: 14px;
  font-weight: 300;
}
#summary-container .cartAmountTotalNetto .value{
  font-size: 32px;
  line-height: 32px;
  font-weight: 300;
  display: block;
}

#summary-container .cartAmountTotal{
  font-size: 14px;
  font-weight: 300;
  text-transform: uppercase;
}
#summary-container .cartAmountTotal .value{
  font-size: 44px;
  line-height: 44px;
  font-weight: 700;
  display: block;
}

/* Preflight info */

#confirm .cart-automatic-preflight-container,
#cart .cart-automatic-preflight-container{
  border: 1px solid @color4;
  padding: 5px 10px;
  color: @color8;
  font-size: 12px;
  font-weight: 300;
  margin: 5px 0;
}


#confirm .cart-automatic-preflight-container a,
#cart .cart-automatic-preflight-container a{
  color: @color2;
}


/* Podsumowanie */
#user-comments-container {
  margin-right: 0;
  margin-bottom: 20px;

}
#user-comments-container textarea {
  max-width:100%;
  min-width:100%;
  width:100%;
  min-height: 100px;
  border: 1px solid @color4;
  padding: 10px;
}


@media (min-width: 992px) {
  #user-comments-container {
    margin-right: 20px;
  }
}



.leftMiddleCol {
  float: left;
  width: 752px;
}

.rightRightCol {
  float: right;
  width: 156px;
  margin-left: 8px;
}

.rightRightCol .boxes-right .box { margin-bottom: 16px; }


.rightLeftCol {
  float: left;
  width: 620px;
}

.banners-right {
  /* float: right; */
}

#productMenu {
  position: relative;
  background: url('../images/products-menu-label.png') no-repeat left top;
  overflow: hidden;
  margin-bottom: 14px;
}

#productMenu .menuBackground {
  position: relative;
  border: 1px solid @color5;
  border-radius: 9px;
  z-index: 10;
  background-color: @color4;
  padding: 4px;
  width: 118px;
  margin: 10px 0 0 28px;
}

#productMenu ul > li > h3 {
  display: none;
}
#productMenu li.item ul li {
  background: url('../images/arrowGrayRight.png') no-repeat left 9px;
  padding-left: 14px;
}
#productMenu a {
  display: block;
  color: @color7;
  margin-left: -4px;
  padding: 9px 0 9px 4px;
  line-height: 1.5;
  border-bottom: 1px solid @color5;
  font-size: 10px;
  font-family: Arial, sans-serif;
}

#productMenu li.item ul li:last-of-type a {
  border: none
}

#productMenu a:hover {
  color: @color9;
}


.main-products {
  float: left;
  width: 608px;
  font-size: 8pt;
  color: @color7;
}
.main-products > a {
  width: 142px;
  height: 100px;
  float: left;
  padding: 10px 5px;
  color: @color7;
  position: relative;
}
.main-products > a .bg {
  position: absolute;
  z-index: -10;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  transition: opacity 0.15s ease-in-out;
  border-radius: 9px;
  background: rgb(0,153,255); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(0,153,255,1) 0%, rgba(7,132,196,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,153,255,1)), color-stop(100%,rgba(7,132,196,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(0,153,255,1) 0%,rgba(7,132,196,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(0,153,255,1) 0%,rgba(7,132,196,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(0,153,255,1) 0%,rgba(7,132,196,1) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(0,153,255,1) 0%,rgba(7,132,196,1) 100%); /* W3C */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0099ff', endColorstr='#0784c4',GradientType=0 ); *//* IE6-9 */
}

.main-products > a:hover {
  font-weight: bold;
  color: @background;
}

.main-products > a:hover .bg {
  opacity: 1;
}

.main-products > a .img {
  text-align: center;
  vertical-align: middle;

  height: 100px;
}




/* -----------------------------------------------------------------------------
12. Panel klienta */

/* Menu panelu klienta */
#panelMenu{}
#panelMenu ul,
.addressTabsLinks{
  border-top: 1px solid @color6;
  border-bottom: 1px solid @color6;
  padding: 10px 0;
  margin-bottom: 20px;
  margin-left: 0;
}
#panelMenu ul li,
.addressTabsLinks li{
  padding: 0;
  margin: 5px 0;
}
#panelMenu ul a,
.addressTabsLinks a{
  border-color: @color7;
  color: @color7;
  font-weight: 300;

}
#panelMenu ul a:hover,
#panelMenu ul a.active,
.addressTabsLinks a:hover,
.addressTabsLinks a.active{
  color: @background;
  background-color: @color3;
  border-color: @color3;
  box-shadow: none;
}

/* -----------------------------------------------------------------------------
13. Lista zamówień - tabela  */

#panelContentOrders{
  margin-top: 20px;
}
#panelContentOrders table{
  border: 1px solid @color6;
}
@media screen and (max-width: 767px){
  #panelContentOrders table {
    width:1140px;
  }
}
#panelContentOrders table thead{
  background-color: @color6;
  color: @background;
}
#panelContentOrders table thead th{
  border-bottom: 0;
  text-align: center;
}

#panelContentOrders table tbody tr:nth-child(3),
#panelContentOrders table tbody tr:nth-child(4n-1){
  background-color: @color4;
}

#panelContentOrders .order td{
  vertical-align: middle;
  text-align: center;
  color: @color9;
  font-weight: 300;
  border-top: 0;
  padding: 5px 0;

}
#panelContentOrders tr:nth-child(4n+1) td{
  border-right: 1px solid @color5;
}
#panelContentOrders tr:nth-child(4n-1) td{
  border-right: 1px solid @color6;
}

#panelContentOrders tr td:last-child{
  border-color: @color6;
}

#panelContentOrders .orderDetailsContent{
  display: none;
  border-bottom: 1px solid @color6;
}
#panelContentOrders .orderDetailsContent .row > div:first-child{
  box-shadow: 1px 0 0 0 @color6;
}

#panelContentOrders .orderDetailsContent td{
  padding: 20px 0;
}

/* Lista zamówień - rząd */
.order{

}

.orderDetails .show-details{
  width: 40px;
  height: 40px;
  display: block;
  margin: 0 auto;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 0;
  cursor: pointer;
  background: url(../images/arrow-down-cart.png) center no-repeat @color5;
}
.show-details.hidden-detalis{
  transform: rotate(180deg);
}


/* -----------------------------------------------------------------------------
14. Lista zamówień - szczegóły  */

.orderDetailsContent{

}

.orderStatusDetails{
  border-bottom: 1px solid @color4;
  padding-bottom: 10px;
}
.orderStatusBig{
  background-color: @color1;
  padding: 15px 20px;
  border-radius: 5px;
  display: inline-block;
  color: @background;
  font-size: 18px;
  font-weight: 800;
}

/* Dane osobowe */
.addressTabsLinks{
  border-top: 0;
}
.addressTabsContent{
  padding-bottom: 15px;
}
.addressTabsContent > div{
  padding: 15px;
  border: 1px solid @color5;
  border-radius: 3px;
  color: @color8;

}

/* Historia zamówienia */
.orderHistory{
  font-weight: 300;
  padding-bottom: 10px;
}
.orderHistory ul{
  border: 1px solid @color5;
  border-radius: 3px;
  padding: 10px;
}
.orderHistory ul li{
  padding: 10px 0;
}
.orderHistory ul li span{
  display: block;
  width: 50%;

  float: left;
}
.orderHistoryDate{
  color: @color9;
  padding-right: 10px;
}
.orderHistoryContent{
  overflow: hidden;
  text-overflow: ellipsis;
  color: @color8;
  padding-left: 10px;
}

/* Informacje o produkcie */
.productInfo{
  border: 1px solid @color4;
  margin:20px 0;
  padding: 15px;
  color: @color8;
  font-weight: 300;
  white-space: normal;
}

.productInfoName{
  margin-top: 0;
  margin-bottom: 20px;
  font-weight: 700;
  font-size: 18px;
  color: @color9;
}

.productInfo .orderNo{
  margin-bottom: 10px;
}

.productInfo .col-1,
.productInfo .col-2,
.productInfo .col-3{
  padding: 0 10px;
  box-shadow: 1px 0 0 0 @color4;
  float: left;
}
.productInfo .col-1{
  width: 20%;
  padding-left: 0;
}
.productInfo .col-2{
  width: 40%;
  padding: 0 20px;
}
.productInfo .col-3{
  width: 40%;
  padding-right: 0;
  box-shadow: 0 0 0 0 @background;
}
.productInfo .complain-button:hover{
  background-color: @color2;
  color: @background;
  text-decoration: none;
}
.productInfo .productInfoParams{
  margin-bottom: 10px;
}
.productInfo .status-green{
  color: @color2;
}

.statusFinished{
  position: relative;
  margin-top: 5px;
  padding-top: 5px;
}
.statusFinished strong{
  display: block;
  color: @color2;
}
.statusFinished:before{
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 1px;
  background-color: @color2;
}

/* Wgrywanie plików */
.productInfo .addFiles{
  margin-top: 10px;
}

.order-file-list{
  padding: 0;
  margin: 10px 0 0;
  list-style: none;
  color: @color8;
}


.order-file-list .fileDetailsName{
  font-weight: 700;
}


.order-file-list .fileDetails span:last-child{
  font-size: 10px;
}

.order-file-list li{
  padding: 5px 0;
  border-top: 1px solid @color4;
}
.order-file-list .fileStatus .yellow{
  color: @color1;
  font-weight: 300;
  background: url(../images/file-check-clock.png) left top no-repeat;
  display: block;
  padding-left: 30px;
}

.productInfo .automatic-preflight-check-list-main{
  box-shadow: 0 0 0 1px @color4 inset;
  font-size: 12px;
}

.productInfo .automatic-preflight-check-list-main .total-status{
  padding: 10px 10px 5px 10px;
}

.productInfo .automatic-preflight-check-list-main .show-elements{
  padding: 0 10px 10px 10px;
  display: block;
}


.pricesActions{
  text-align: right;
}

.pricesDetails{
  background-color: @color7;
  border-radius: 2px;
  padding: 25px;
  margin-bottom: 20px;
  color: @background;
  text-align: right;
  font-weight: 300;
}
.additionalPrices,
.mainPrice{
  float:left;
}
.additionalPrices{
  width:60%;
}
.mainPrice{
  width:40%;
}
.additionalPrices .postPrice,
.additionalPrices .changePrice{
  float:left;
  width:50%;
  padding-top: 8px;
}
.additionalPrices .special{
  font-size: 32px;
  line-height: 32px;
}
.mainPrice .special{
  font-size: 44px;
  line-height: 40px;
  font-weight: 700;
}

/* -----------------------------------------------------------------------------
15. Zmień dane  */

#responsive-personal-panel-wrapper{}
#responsive-personal-panel-wrapper table{
  width:100%;
}
#responsive-personal-panel-wrapper table td:first-child{
  display: none;
}
#responsive-personal-panel-wrapper table td:last-child{
  width: 100%;
}

#responsive-personal-panel-wrapper #personalDetails form > #welcome_box{
  box-shadow: 1px 0 0 0 @color4;
}
#responsive-personal-panel-wrapper #personalDetails form > div:nth-child(3) > div:first-child{
  float: left;
}
#responsive-personal-panel-wrapper #personalDetails form > div:nth-child(3) > div:nth-child(2){
  float: right;
}


#responsive-personal-panel-wrapper input[name="nr_budynku"],
#responsive-personal-panel-wrapper input[name="nr_lokalu"],
#responsive-personal-panel-wrapper input[name="kod_pocztowy"],
#responsive-personal-panel-wrapper input[name="korespondencyjne_nr_budynku"],
#responsive-personal-panel-wrapper input[name="korespondencyjne_nr_lokalu"],
#responsive-personal-panel-wrapper input[name="korespondencyjne_kod_pocztowy"]{
  width: 48%;
}
#responsive-personal-panel-wrapper input[name="korespondencyjne_nr_budynku"],
#responsive-personal-panel-wrapper input[name="nr_budynku"]{
  float:left;
}
#responsive-personal-panel-wrapper input[name="korespondencyjne_nr_lokalu"],
#responsive-personal-panel-wrapper input[name="nr_lokalu"]{
  float: right;
}

#responsive-personal-panel-wrapper #passwordChange input[type=submit]:hover{
  background-color: darken(@color2, 10%);
}

/* -----------------------------------------------------------------------------
16. Prezenty/Punkty */

#promotionHeader{
  text-align: center;
}
#promotionHeader:before,
#promotionHeader:after{
  content: '';
  display: block;
  clear: both;
}
#promotionHeader h1{
  font-size: 20px;
  font-weight: 300;
  padding: 30px 15px;
  text-transform: lowercase;
  color: @color5;

}
#promotionHeader h1 span{
  font-size: 48px;
  font-weight: 900;
  color: @color2;
  display: block;
  padding: 10px 0;
}
#promotionHeader a{
  display: inline-block;
  color: @background;
  background: @color4;
  border-radius: 3px;
  padding: 12px 30px;
}

/* -----------------------------------------------------------------------------
17. Zamówienie projektu */

#project-order-view{}

#project-order-view h1{
  display: none;
}

.project-propositions{
  border-bottom: 1px solid @color4;
  margin-bottom: 40px;
}
.project-proposition{
  margin-bottom: 40px;
}

.project-order-description{}
.project-order-description .label{
  display: block;
  text-align: left;
  padding: 0;
  margin: 30px 0 15px 0;
}
.project-order-description .contents pre{
  border: 0;
  background-color: transparent;
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  color: @color8;
  padding: 0;
  margin-bottom: 40px;
}

.proposition-image{
  position: relative;
  text-align: center;
}
.proposition-image img{
  max-width:100%;
}
.proposition-title{
  display: none;
}

.comments-form-container .comment-add-button,
.proposition-choose-button{
  background-color: @color4;
  border-radius: 3px;
  border: 1px solid @color4;
  padding: 10px 20px;
  color: @background;
  font-weight: 300;
  display: inline-block;
  margin: 20px auto;
}
.proposition-choose-button:hover{
  background-color: @color2;
  border-color: @color2;
}
.proposition-choose-form{
  text-align: center;
  border-bottom: 1px solid @color4;
}

.proposition-details{
  color: @color4;
  font-weight: 300;
  line-height: 20px;
  margin-top: 10px;
}
.proposition-details .label{
  padding: 0;
  margin: 0;
  font-weight: 700;
  font-size: 14px;
  width: 60px;
  display: inline-block;
  text-align: left;
  color: @color4;
}

.comments-form-container textarea{
  max-width:100%;
  width:100%;
  min-height:50px;
  height: 150px;
  border: 1px solid @color4;
  padding: 10px;
}
.comments-form-container .comment-add-button{
  float: right;
}

.comment-heading-wrapper{
  margin-bottom: 20px;
  clear:both;
}

#project-order-view h1.comments-heading{
  display: block;
}


.comments-list{
  margin-bottom: 40px;
}
.comment{
  background: url(../images/comment-bg.png) top left no-repeat;
  padding-left: 70px;
  min-height: 60px;
  position: relative;
  margin-bottom: 20px;
}
.comment:after{
  position:absolute;
  background: url(../images/comment-divider.png) left center no-repeat;
  height: 7px;
  width: 100%;
  content: '';
  display: block;
  bottom: -15px;
  left: 0;
}
.comment-header{
  padding-top: 10px;
}
.comment-date,
.comment-author{
  display: inline;
  font-weight: 700;
}
.comment-author{
  color: @color7;
}
.comment-date{
  color: @color8;
  font-size: 10px;
}
.comment-date .label,
.comment-author .label{
  display: none;
}
.comment-content pre{
  background-color: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  font-size: 14px;
  color: @color8;
  line-height: 22px;
  font-weight: 300;
  font-family: 'Open Sans', sans-serif;

  white-space: pre-wrap;       /* CSS 3 */
  white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */

}


/* -----------------------------------------------------------------------------
18. Kontakt */

.kontakt{
  font-weight: 300;
}
.kontakt > div{
  margin-bottom: 20px;
}
.kontakt .kontakt-divider{
  border-top: 2px solid @color1;
  display:block;
  margin-bottom: 10px;
}
.contact-form {
    padding-top: 40px;
  h1, h2 {
    margin: 0;
    padding: 0 0 40px;
    font-size: 30px;
    color: @color8!important;
    font-weight: 700!important;
    text-transform: uppercase;
  }
  .page-heading:after {content: none}
  .contact-row p {
    padding-left: 0;
  }
  .contact-row .dummy-border {
    border: none;
  }
  a.mainColor {
    color: @color3;
  }
  h1 span, h2 span {
    position: relative;
    padding: 20px;
  }
  h1 span:after, h2 span:after {
    height: 2px;
    background: @color1;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
  }

  #contactFormContactPage {
    max-width: 400px;
    padding-top: 30px;
    margin: 0 auto;
    float: none;
  }
  #contactFormContactPage textarea {
    resize: none
  }
  #contactFormContactPage .button {
    margin-top: 20px;
  }
}

/* -----------------------------------------------------------------------------
19. Artykuł */



/* -----------------------------------------------------------------------------
20. Opinie */
.singleOpinion{
  border: 1px solid @color4;
  padding: 10px;
  border-radius: 2px;
  margin-bottom: 30px;
}
.opinionAuthor{
  font-weight: 700;
  display: block;
}
.opinionDate{
  font-size: 10px;
  color: @color8;
}
.opinionText{
  background: url(../images/opinion-divider.png) top 15px left -20px no-repeat;
  padding-top: 30px;
  font-weight: 300;
  color: @color8;
}

#addOpinionForm{}

#addOpinionForm #message{
  width:100%;
  padding: 10px;
  max-width:100%;
  min-width:100%;
  height: 160px;
  margin-bottom: 20px;
  border-color: @color4;
}

#addOpinionForm label[for="rate"]{
  float: left;
  padding-right: 10px;
}

#addOpinionForm #rate-container{
  float: left;
}

#addOpinionForm button[type="submit"]{
  color: @background;
}


/* -----------------------------------------------------------------------------
21. Bezpłatne próbki */

.samplesDesc p:first-child{
  width: 100%;
  float: none;
  margin-right: 0;
  margin-top: 0;
  line-height: 24px;
  font-size: 24px;
  text-align: center;
  font-weight: 300;
  color: @color8;
}
.samplesDesc p:nth-child(2){
  float: none;
  text-align: center;

  font-weight: 600;
  font-size: 260px;
  line-height: 230px;
  color: @color6;
  margin-top: 40px;
}
.samplesDesc p:nth-child(2) span{
  font-size: 34px;
  line-height: 34px;
  font-weight: 300;
  display: block;
  text-align: right;
}
.samplesDesc p:last-child{
  font-weight: 300;
  font-size: 20px;
  color: @color8;
  display: block;
  margin-top: 20px;
  margin-bottom: 40px;
}

.samplesFormContainer h4{
  font-size: 18px;
  font-weight: 700;
  color: @color8;
  margin-bottom: 20px;
}
.samplesReqFields{
  font-size: 10px;
  color: @color8;
}
.samplesSubmit{
  padding-right: 40px;
  padding-left: 40px;
}

@media (min-width: 768px) {
  .samplesDesc p:first-child{
    text-align: left;
    font-size: 48px;
    width: 170px;
    margin-right: 90px;
    margin-top: 100px;
    line-height: 45px;
    float: left;

  }

  .samplesDesc p:nth-child(2){
    float: left;
    text-align: left;
    margin-top: 40px;

    font-weight: 600;
    font-size: 260px;
    line-height: 230px;
    color: @color6;

  }
}
@media (min-width: 992px) {
  .samplesFormContainer{
    box-shadow: -1px 0 0 0 @color4;
  }
}

/* -----------------------------------------------------------------------------
22. 404 */
.error404cover{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99;
  box-sizing: content-box;
  background-color: rgba(204,153,51,0.7);
}

.error404page{
  color: @background;
}

.ups404{
  font-size: 48px;
  font-weight: 900;
  color: @background;
  text-transform: uppercase;
}
.code404{
  font-size: 48px;
  font-weight: 300;
  color: @background;
  background: url(../images/404-bg.png) center center no-repeat;
  height: 90px;
  margin: 20px 0 40px 0;
}
.code404 span{
  font-size: 120px;
  font-weight: 900;
}
.noExists404{
  font-size: 36px;
  font-weight: 300;
  color: @background;
  margin-bottom: 40px;
}

.toHome404 a{
  background-color: @color1;
  font-weight: 300;
  color: @background;
  text-transform: lowercase;
  font-size: 14px;
}


/* -----------------------------------------------------------------------------
23. Artykuł */
#article{
  color: @color8;
  font-size: 14px;
  font-weight: 300;
}
#article-heading{
  font-size: 36px;
  font-weight: 700;
  margin-bottom:20px;
}
#article-meta{
  padding-bottom: 20px;
  margin-bottom: 30px;
  border-bottom: 1px solid @color4;
}
#article-content{
  line-height: 24px;
}



/* -----------------------------------------------------------------------------
24. Formularz kontaktowy */

#tresc.contact-form{}

#tresc.contact-form input[type=text]{
  background: transparent;
}
#tresc.contact-form textarea{
  max-width:100%;
  width:100%;
  border: 1px solid @color6;
  height: 100px;
}
#tresc.contact-form #recaptcha_image{
  margin-top: 20px;
}


/* -----------------------------------------------------------------------------
25. Fancybox */
#fancybox-content{
  background-color: @background;
}

/* ------------------ ---------- ------------------ */




/* --- FAQ --- */

#faq {
  .hidden {
    display: none;
  }

  background: url(../images/faq-bg.png) transparent no-repeat right 100px center;

  .subject {

    border: 1px solid @color5;
    margin-bottom: 10px;

    .title {
      display: block;
      padding: 15px 10px;
      font-size: 14px;
      cursor: pointer;
      font-weight: bold;
      &:hover {
        background: @color1;
        color: white;
      }

      &.selected {
        background: @color1;
        color: white;
      }
    }

    .elements {

      padding: 10px 10px 0 10px;

      .element {
        padding: 10px;
        margin-bottom: 10px;

        border: 1px solid @color5;

        .element-title {
          font-weight: bold;

          cursor: pointer;
          &:hover {
            color: @color2;
          }
        }

        .content {
          margin-top: 10px;
        }
      }

    }
  }
}












span.menu-tag {
  display: inline-block;
  background:#f23b3b;
  border-radius: 5px;
  text-align: right;
  padding: 0 4px;
  font-size: 8px;
  color: white;
  font-weight: bold;
  margin-left: 4px;
  line-height: 14px;
}

#found
{
  .right {
    float: right;
  }
  .yellowBtn {
    color: @background;
    font-size: 14px;
    font-weight: 300;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 15px 30px;
    border: 0;
    float: right;
    background-color: @color6;
  }
  .clear {
    clear: both;
  }

  .found-list-item
  {
    border-bottom:1px solid @color8;
    padding-bottom: 10px;
    .img
    {

      float: left;
      margin-right: 10px;
      margin-top: 10px;
    }
    .title{
      margin-top: 10px;
      font-weight: bold;
      font-size: 20px;
      float: left;
    }
    .content{

      float: left;

      margin-top: 5px;
      margin-bottom: 5px;

      width:495px;
    }

  }
}



.price-before-discount {
  color:#f23b3b;
  text-decoration: line-through;
}

.order-file-list {
  .remove::before {
    content: "Usuń";
  }
  .remove {
    color:#f23b3b;
    float: right;
  }
}


/* -----------------------------------------------------------------------------
26. Oplacenie zamowienia */


.pay-button{
  border: 1px solid @color4;
  border-radius: 4px;
  color: @color7;
  padding: 10px 70px 10px 10px;
  display: inline-block;
  position: relative;
}

.pay-button:after{
  content:'';
  position: absolute;
  width:1px;
  height: 40px;
  right: 59px;
  top: 0;
  background-color: @color4;
}

.paypal-button{
  background: url(../images/paypal-icon.png) center right 10px no-repeat;
}

.payu-button{
  background: url(../images/payu-icon.png) center right 10px no-repeat;
}

/* -----------------------------------------------------------------------------
26. Kontakt 2 */

.contact-row  .dummy-border{
  border-top: 2px solid @color3;
  margin-bottom: 15px;
}
.contact-row> div{
  margin-bottom: 20px;
}

.contact-row p{
  padding-left: 26px;
  margin-bottom: 5px;
  font-weight: 300;
}

.contact-row .tel-icon,
.contact-row .email-icon,
.contact-row .home-icon{
  position: relative;
}

.contact-row .tel-icon:before,
.contact-row .email-icon:before,
.contact-row .home-icon:before{
  content: '';
  width: 20px;
  height: 24px;
  position: absolute;
  left: 0;
  top: -2px;
  display: block;
  background-position: center left;
  background-repeat: no-repeat;
}
.contact-row .tel-icon:before{
  background-image:url(../images/phone-icon-grey.png);
}
.contact-row .home-icon:before{
  background-image:url(../images/home-icon-grey.png);
}
.contact-row .email-icon:before{
  background-image:url(../images/envelope-icon-grey.png);
}

#contactFormContactPage{
  padding-top: 34px;
  padding-bottom: 30px;
}

#contactFormContactPage table{
  width:100%;
}
#contactFormContactPage tr td:first-child{
  display: none;
}

#contactFormContactPage textarea{
  padding: 10px;
}


/* PLATNOSCI */

#platnosci-form{

}

#platnosci-form > table{
  width:100%;
  text-align: left;
  table-layout: fixed;
}

#platnosci-form > table > tbody > tr > td{
  padding: 3px;
}

#platnosci-form > table table{
  width: 100%;
  border: 1px solid @color4;
  border-radius: 4px;
  padding: 3px;
}
#platnosci-form > table table td:first-child{
  background-color: @color4;
  width:25px;
  text-align: center;
}
#platnosci-form > table table td:first-child input{
  margin: 0 auto;
}

/* REKLAMACJE */
.reklamacja-page{}
.reklamacja-page table{

}
.reklamacja-page table td{
  position: relative;
  padding: 5px;
}
.reklamacja-page table td:last-child{
  min-width: 200px;
}
.reklamacja-page table td select{
  width:100%;
}

.reklamacja-page textarea{
  border: 1px solid @color4;
  min-width: 200px;
}


/* PRE CREATOR PRODUCT */
.pre-creator-product{}

.pre-creator-product .product{
  display: block;
  padding: 5px 5px 15px 5px;
}

.pre-creator-product .product a{
  display: block;
  position: relative;
}

.pre-creator-product .product a img{
  margin: 0 auto;
  display: block;
  max-width:100%;
}

.pre-creator-product .product a .title{
  display: block;
  position: absolute;
  left: 0;
  width:100%;
  text-align: center;
  bottom: 20px;
}



.pre-creator-product fieldset{
  display: block;
  padding: 5px 5px 15px 5px;
}

.pre-creator-product fieldset a{
  display: block;
  position: relative;
}

.pre-creator-product fieldset a img{
  margin: 0 auto;
  display: block;
  max-width:100%;
  width:auto !important;
}

.pre-creator-product fieldset legend{
  display: block;
}





/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .pre-creator-product fieldset,
  .pre-creator-product .product{
    width: 33.333333%;
    float: left;
    padding: 5px 5px 10px 5px;
  }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .pre-creator-product fieldset,
  .pre-creator-product .product{
    width: 25%;

  }
}


/* PRODUCTCATEGORY */

#productCategory{

}

#productCategory .productInfo{
  display: block;
  text-align: center;
}
#productCategory .productInfo img{
  max-width: 100%;
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  #productCategory .productInfo{
    width: 33.333333%;
    float: left;
    padding: 5px 5px 10px 5px;
  }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  #productCategory .productInfo{
    width: 25%;
    border: 0;
  }
}

.editable-module-representation a {
  height: 26px !important;
}


#cookie-policy-popup {
  height: 70px !important;
}

select.paramSelect{
  position: relative;
  left:0;
  top: 0;
  width:100%;
  border: 1px solid @color6;
  padding: 5px;
  font-size: 14px;
  background: url(../images/arrow-down-select.png) right 15px center no-repeat @color4;
}
select.paramSelect::-ms-expand {
  display: none;
}
select.paramSelect {
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: '';
}

#header-menu li a {
  -webkit-transition: background-color 0.1s ease-in-out;
}

.homepage-product.flip-container {
  -webkit-perspective: 1000;
}

.homepage-product .back {
  -webkit-backface-visibility: hidden;
}

.homepage-product.flip-container:hover .flipper,
.homepage-product.flip-container.hover .flipper {
  -webkit-transform: rotateY(180deg);
}

.homepage-product.flip-container:hover .flipper,
.homepage-product.flip-container.hover .flipper,
.homepage-product.flip-container.flip .flipper {
  -webkit-transform: rotateY(180deg);
}

.homepage-product .front {
  /* for firefox 31 */
  -webkit-transform: rotateY(0deg);
}

.homepage-product .back {
  -webkit-transform: rotateY(180deg);
}

.matrix-off span{
  -webkit-transform: rotate(180deg);
}

.main-products > a .bg {
  -webkit-transition: opacity 0.15s ease-in-out;
}


.show-details.hidden-detalis{
  -webkit-transform: rotate(180deg);
}

.upload-progress-bar.active {
  display: block !important;
}
.upload-progress-bar {

  border: 1px solid @color4;
  margin-right: 10px;
  text-align: center;
}
.upload-progress-bar-inside {

  padding-top: 4px;
  padding-bottom: 4px;
  background: @color2;
  text-align: center;
}
.upload-progress-bar-value {
  color: white;
}


#offer-view {
  .clear{
    clear: both;
  }

  .offer-number {
    @media (max-width: @screen-sm-min) {
      width: 100%;
      margin-bottom: 20px;
    }
    float: left;
    width: 31%;
    span {
      display: block;
      font-size: 16px;
    }
    font-size: 10px;
    height: 60px;
  }

  .offer-date {
    @media (max-width: @screen-sm-min) {
      width: 100%;
      margin-bottom: 20px;
    }
    float: left;
    width: 31%;
    span {
      display: block;
      font-size: 16px;
    }
    font-size: 10px;
    font-weight: bold;
    height: 60px;
  }

  .additional-info {
    @media (max-width: @screen-sm-min) {
      width: 100%;
      margin-bottom: 20px;
    }
    float: left;
    width: 31%;
    span {
      display: block;
      font-size: 16px;
    }
    font-size: 10px;
    font-weight: bold;
    height: 60px;
    .extrainfo{
      border: 1px solid @color4;
      padding: 5px;
      color: @color5;
    }
  }

  .products-table {
    color: @color5;
    .contents{
      .vcenter {
        display: inline-block;
        vertical-align: middle;
        float: none;
      }
      .product:first-of-type{
        border-top: 1px solid @color4;
      }
      .product {
        border-bottom: 1px solid @color4;
        .product-files {
          text-align: center;
        }

        .product-files,
        .product-price {
          float: left;
          width: 25%;
          padding: 5px;
          border-left: 1px solid @color4;
          height: 160px;
        }
        .product-params {
          float: left;
          width: 50%;
          padding: 5px;
          h2 {
            font-weight: bold;
            padding-bottom: 15px;
          }
        }
        .product-price {
          text-align: right;
          .price-netto {
            font-weight: bold;
            font-size: 18px;
          }
          .price-brutto {
            font-weight: bold;
            font-size: 20px;
            color: @color3;
          }
        }
      }
    }

  }

  .shipment-tabs{
    @media (max-width: @screen-md-min) {
      width: 100%;
      margin-bottom: 0;
      margin-top: 10px;
    }
    color: @color5;
    margin-top: 20px;
    margin-bottom: 40px;
    float: left;
    width: 30%;
    border: 1px solid @color5;
    .tabs-offer{
      font-size: 18px;
      display: block;
      height: 41px;
      padding: 0;
      margin: 0;
      list-style: none;
      text-align: center;
      >li{
        &:first-of-type{
          border-right: 1px solid @color5;
        }
        border-bottom: 1px solid @color4;
        font-weight: 600;
        float: left;
        list-style-type: none;
        width: 50%;

        a{
          text-decoration: none;
          padding: 10px;
          color: @color5;
          display: block;
        }

        &.active{
          text-decoration: underline;
        }
      }
    }
    .tabs-content{
      .table{
        margin: 20px;
        thead{
          display: none;
        }
        td{
          font-size: 15px;
          border: 0;
          padding: 0 15px 0 0;
        }
      }
    }
  }
  .summary{
    @media (max-width: @screen-sm-min) {
      width: 100%;
    }

    float: right;
    background: @color3;
    color: white;
    width: 60%;
    padding: 15px;
    margin-top: 20px;
    margin-bottom: 30px;

    .shipment-method,
    .discount-summary,
    .netto{
      display: block;
      width: 33%;
      font-size: 14px;
      float: left;
      text-align: right;
      font-weight: normal;
      span{
        font-size: 20px;
        font-weight: bold;
      }
    }

    .price-brutto{
      text-align: right;
      float: right;
      border-top: 1px solid @color5;
      display: block;
      font-size: 16px;
      font-weight: normal;
      width: 100%;
      margin-top: 30px;
      padding: 5px 15px;
      span{
        font-size: 22px;
        font-weight: bold;
      }
    }

  }

  .offer-footer{
    .contener
    {
      @media (max-width: @screen-sm-min) {
        width: 100%;
        margin-bottom: 3px;
      }
      width: 33%;
      float: left;
    }
    button{
      color: @background;
      text-align: center;
      height: 60px;
      width: 200px;
      background-color: @color1;
      border: 1px solid @color1;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      @media (min-width: @screen-sm-min) {
        float: right;
      }
    }
    .delete-button{
      float:none;
      color: @background;
      text-align: center;
      height: 60px;
      width: 200px;
      background-color: @color5;
      border: 1px solid @color5;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
    }
    .back{
      color: @background;
      height: 60px;
      width: 200px;
      background-color: @color5;
      border: 1px solid @color5;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      @media (min-width: @screen-sm-min) {
        float: left;
      }
      a{
        color: @background;
        text-decoration: none;
      }
    }

  }
}

.center {
  text-align: center;
}



/* address book */
.user-address-book {


  .btn-group-xs>.btn, .btn-xs {
    padding: 10px 20px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 5px;
    color: @color5;
    border: 1px solid @color4;
  }
  .btn-group-xs>.btn, .btn-xs:hover {
    color: @background;
    border: 1px solid @color4;
  }

  .btn-primary{
    padding: 10px 20px;
    color: @background;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    display: inline-block;
    font-weight: 300;
    background-color: @color1;
  }
  .btn-primary:focus{
    background-color: darken(@color1, 10%);
    text-decoration: none;
  }

  .btn-primary:hover,
  a.btn-primary:hover{
    background-color: darken(@color1, 10%);
    text-decoration: none;
  }

  .btn-danger{
    padding: 10px 20px;
    color: @background;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    display: inline-block;
    font-weight: 300;
    background-color: @color3;
    margin-top: 4px;
  }

  .btn-danger:hover, a.btn-danger:hover, .btn-danger:focus{
    background-color: darken(@color3, 10%);
    text-decoration: none;
  }

  select {
    position: relative;
    left: 0;
    top: 0;
    border: 1px solid @color4;
    width: 100%;
    padding: 10px 20px;
    font-size: 14px;
    /*background: url(http://ksiazkaadresowa.iwareprint.pl/layouts/kompromix6/images/arrow-down-select.png) right 15px center no-repeat;*/
  }
}