/*new css */
body {
  font-family: 'Lato', sans-serif;
}
.custom-scrollbar {
  overflow-y: scroll;
  overflow-x: hidden;
}
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px white; 
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #000; 
  border-radius: 3px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #000; 
}

.navbar {
  z-index: 1040;
  background-color: 000;;
}
.navbar-brand {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}
.offer-box {
  background-color: black;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 300px;
  display: flex;
  transition: 1s all;
}
.offer-box:hover {
  transform: scale(1.1);
}
.content {
  color: white;
  width: 100%;
  font-size: 1.2rem;
  transition: 1s all;
  text-transform: uppercase;
}
.separate-line-offer {
  background: #fff;
  height: 2px;
  width: 100%;
}
.text-shadow {
  text-shadow: 0 0 10px black;
}
.separate-line {
  background: #000;
  height: 2px;
  width: 10%;
  margin-left: auto;
  margin-right: auto;
}

.logo-box-parent {
  position: relative;
}
.logo-box-child {
  position: absolute;
  top: 0;
  left: calc(50% - 189px);
  font-size: 26px;
  font-weight: 400;
  text-align: center;
  width: 378px;
  background-color: #fdeb01;
  color: #000;
  padding: 12px 0 27px 0;
}
.bg-page {
  background-color: #F7F7F7;
}
.padding-top {
  padding-top: 150px;
}
.item-pakiet {
  width: 18%;
  margin: 0 1%;
  text-align: center;
  text-transform: uppercase;
}
.item-pakiet-small {
  width: 10.5%;
  margin: 0 1%;
  text-align: center;
  text-transform: uppercase;
}
.pakiet-box-small {
  position: relative;
  padding: 15px 0;
  margin: 20px 0;
  background: #fff;
  cursor: pointer;
  min-height: 200px;
}
.pakiet-box-small-alt {
  position: relative;
  padding: 15px 0;
  margin: 20px 0;
  background: #C8C8C8;
  cursor: none;
  color: white!important;
  min-height: 200px;
}
.bg-yellow {
  background: #FDEB01 !important;
  height: 4px;
}
.pakiet-box {
  position: relative;
  padding: 70px 0;
  margin-top: 50px;
  margin: 20px 0;
  background: #fff;
  cursor: pointer;
  min-height: 350px;
}
.pakiet-bar {
  position: absolute;
  height: 30px;
  width: 100%;
  background: #212121;
  top: 0;
  color: white;
  padding: 3px;
}
.change_color {
  background: #FDEB01;
  color: black!important;
}
.active_pakiet {
  background: #212121;
  color: white;
}
.active_pakiet .icon, .active_pakiet .fa-check {
  color: #FDEB01 !important;
}
.pakiet-box-small-alt .icon img{
  filter: brightness(0) invert(1);
}
.icon {
  font-size: 5rem;
}
.show-modal {
  position: fixed;
  top: 40%;
  right:0;
  font-size: 2rem;
  padding: 10px 20px;
  background: white;
  cursor: pointer;
  border: 1px solid #212121;
  border-right: 0;
  color: #212121;
}
.btn-outline-primary {
  border: 2px solid #fff !important;
  background-color: transparent !important;
  color: #fff !important;
}
.btn-outline-primary:hover {
  border: 2px solid #FDEB01 !important;
  background-color: transparent !important;
  color: #FDEB01 !important;
}
.choose_template {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
position: relative;
}
.choose_template:hover {
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
}
.icon_template {
position: absolute;
top: calc(50% - 24px);
left: calc(50% - 24px);
margin: 0 auto;
font-size: 3rem;
color: green;
display: none;
}
.grejskale {
  filter: grayscale(0%) !important;
}


/*old css */

/*moj css - Karol*/

  .side-nav {
      margin-top: 70px !important;
      margin-left: 13px;
      color: white;
       /* Fallback for web browsers that don't support RGBa */
       background-color: rgb(0, 0, 0);
       /* RGBa with 0.6 opacity */
       background-color: rgba(0, 0, 0, 0.6);
       /* For IE 5.5 - 7*/
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
       /* For IE 8*/
       -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
    }
    
    @media (min-width: 1200px){
    .fixed-sn main {
        margin-left: 20% !important;
        margin-right: 20% !important;
      }
    }
  main {
      background-position: center;
      background-repeat: no-repeat;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: contain;
    }
  .side-nav .logo-wrapper {
    height: 140px;
    border: 0px !important;
  }
  .nav-item {
    color: black;
  }
  .navigations-blocks {
    background-color: rgba(0, 0, 0, 0.6);
    color: #FFD401;
    height: 300px;
    width: 100%;
    font-size: 1.5rem;
    -webkit-transform: perspective(5px) translateZ(0);
    transform: perspective(5px) translateZ(0);
    box-shadow: 0 0 8px black;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow;
    transition-property: box-shadow;
  }
  .navigations-blocks:hover {
    background-color: rgba(0, 0, 0, 0.8);
    color: #FFD401;
    height: 300px;
    width: 100%;
    -webkit-transform: perspective(5px) translateZ(0);
    transform: perspective(5px) translateZ(0);
    box-shadow: 0 0 20px black;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow;
    transition-property: box-shadow;
  }
  .side-nav .collapsible a:hover {
    color: #fff;
    font-weight: 300;
    opacity: 0.9 !important;
    font-size: 1.2rem;
    height: 100%;
    line-height: 36px;
    background: rgb(0,0,0);
    background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 7%, rgba(255,212,0,1) 100%, rgba(0,212,255,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 7%, rgba(255,212,0,1) 100%, rgba(0,212,255,1) 100%);
    background: linear-gradient(90deg, rgba(0,0,0,1) 7%, rgba(255,212,0,1) 100%, rgba(0,212,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#00d4ff",GradientType=1);
  }
  .side-nav .collapsible a {
    color: #fff;
    font-weight: 300;
    font-size: 1.2rem;
    height: 100%;
    line-height: 36px;
    padding: 10px;
  }
  .logo-wrapper{
    position: relative;
    bottom: 0px;
  }
  .fixed-sn main, .hidden-sn main {
    padding-top: 0!important; 
  }
  .icon-style {
    width: 200px;
    height: 200px;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: contain;
  }
  .icon-navbar {
    width: 32px;
    height: 19px;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: contain;
  }
  
  
  /*moj css - Dawid*/
  
  .bg-grey {
    background-color: #E9ECEF; 
  }
  .bg-main {
      background-color: #E9ECEF; 
    height: calc(100vh - 60px);
  }
  
  .water-logo {
      background-image: url('../img/logo_CMS.png');
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: calc(100vh - 60px);
  
  }
  .side-nav {
      -webkit-transform: translateX(0%);
      -ms-transform: translateX(0%);
      transform: translateX(0%);
      height: 0px;
      transition-property: all;
      transition-duration: 1s;
  }
  .show-menu {
      height: 90%;
  }
  .side-nav .collapsible .fab, .side-nav .collapsible .far, .side-nav .collapsible .fas {
      font-size: 1.5rem;
  }
  .header-font-size {
      font-size: 1.2rem !important;
  }
  .menu-icon {
      max-width: 15%;
  }
  #bg-opacity {
      position: fixed;
      width: 100%;
      background-image: url(../img/bg-opacity.png);
      background-size: 100% 100%;
      z-index: 1000;
      height: 100%;
      opacity: 0.8;
  }
  
  .navi-header {
    background-color: #dee2e6;
    height: 2.5rem;
    display: table-cell;
    vertical-align: middle;
    width: 100vw;
  }
  
  .navi-header a {
    color: #000000;
  }
  
  .main-section {
    background-color: #E9ECEF;
    min-height: 100vh;
  }
  .gold-gradient {
    background: linear-gradient(40deg,#000,#FED300)!important;
  }
  .shadow-alt {
    box-shadow: 0 0 8px black !important;
  }
  .shadow-alt:hover {
    box-shadow: 0 0 20px black !important;
  }
  .btn-outline-dark:hover {
    border: 2px solid #E8C001!important;
    background-color: transparent!important;
    color: #E8C001!important;
  }
  .md-form input[type=date]:focus:not([readonly]), .md-form input[type=datetime-local]:focus:not([readonly]), .md-form input[type=email]:focus:not([readonly]), .md-form input[type=number]:focus:not([readonly]), .md-form input[type=password]:focus:not([readonly]), .md-form input[type=search-md]:focus:not([readonly]), .md-form input[type=search]:focus:not([readonly]), .md-form input[type=tel]:focus:not([readonly]), .md-form input[type=text]:focus:not([readonly]), .md-form input[type=time]:focus:not([readonly]), .md-form input[type=url]:focus:not([readonly]), .md-form textarea.md-textarea:focus:not([readonly]) {
    -webkit-box-shadow: 0 1px 0 0 #FFD401;
    box-shadow: 0 1px 0 0 #FFD401;
    border-bottom: 1px solid #FFD401;
  }
  input {
    color: black !important;
  }
  .btn-hover-alt:hover {
    border: 2px solid #FFF!important;
    background-color: transparent!important;
    color: #FFF!important;
  }
  .md-form input[type=date]:focus:not([readonly])+label, .md-form input[type=datetime-local]:focus:not([readonly])+label, .md-form input[type=email]:focus:not([readonly])+label, .md-form input[type=number]:focus:not([readonly])+label, .md-form input[type=password]:focus:not([readonly])+label, .md-form input[type=search-md]:focus:not([readonly])+label, .md-form input[type=search]:focus:not([readonly])+label, .md-form input[type=tel]:focus:not([readonly])+label, .md-form input[type=text]:focus:not([readonly])+label, .md-form input[type=time]:focus:not([readonly])+label, .md-form input[type=url]:focus:not([readonly])+label, .md-form textarea.md-textarea:focus:not([readonly])+label {
    color: #FFD401;
  }
  button {
    cursor: pointer;
  }
  .counter-fields {
    background: #000; 
    border-radius: 50%;
    color: white;
    padding: 5px 10px;
  }
  
  .form-check-input[type=checkbox]:checked+label:before, label.btn input[type=checkbox]:checked+label:before {
    border-right: 2px solid #FFD401;
    border-bottom: 2px solid #FFD401;
  }
  .cursor {
    cursor: pointer;
  }
  .side-nav .collapsible, .custom-scrollbar {
    height: 100%;
  }
  .primary-color, ul.stepper li.active a .circle, ul.stepper li.completed a .circle {
    background-color: #FED300 !important;
  }
  /*moj css - Karol*/
  .a-link {
    color: black !important;
  }
  .flash-info {
    background-color:#000;
    color:white;
    padding: 10px;
    text-align: center;
    
    
  }
  .modal-dialog.modal-notify.modal-danger .badge, .modal-dialog.modal-notify.modal-danger .modal-header {
      background-color: #000;
  }
  .modal-dialog.modal-notify.modal-danger .fab, .modal-dialog.modal-notify.modal-danger .far, .modal-dialog.modal-notify.modal-danger .fas {
      color: #FFD401;
  }
  .btn-outline-danger {
      border: 2px solid #FFD401!important;
      background-color: transparent!important;
      color: #000!important;
  }
  .btn-danger {
      color: #fff;
      background-color: #000!important;
      border-color: #000!important;
  }
  .btn-outline-danger:not(:disabled):not(.disabled).active, .btn-outline-danger:not(:disabled):not(.disabled):active, .show>.btn-outline-danger.dropdown-toggle {
      color: #fff;
      background-color: #000!important;
      border-color: #000!important;
  }
  .btn-outline-danger.active, .btn-outline-danger:active, .btn-outline-danger:active:focus, .btn-outline-danger:focus, .btn-outline-danger:hover {
      border-color: #000!important;
      background-color: transparent!important;
      color: #000!important;
  }
  .btn-danger:not([disabled]):not(.disabled).active, .btn-danger:not([disabled]):not(.disabled):active, .show>.btn-danger.dropdown-toggle {
      -webkit-box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
      box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
      background-color: #000!important;
  }
  .btn-elegant {
  
      color: #fff;
      border-radius: .25rem;
  }
  a.bg-dark:focus, a.bg-dark:hover, button.bg-dark:focus, button.bg-dark:hover {
      background-color: #212121!important;
  }
  .btn-elegant:not([disabled]):not(.disabled).active, .btn-elegant:not([disabled]):not(.disabled):active, .show>.btn-elegant.dropdown-toggle {
      -webkit-box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
      box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
      background-color: #212121!important;
  }
  
  .head {
      padding: 9px;
      background-color:#000;
      width: 100%;
      margin-left: 0; 
      margin-right: 0;
      text-align: center;
      color: white;
      border-radius: .25rem;
      font-size: 25px;
  }
  .input_css {
      border-top: 0px;
      border-left: 0px;
      border-right: 0px;
  }
  .btn-primary {
      background-color: #FFD401!important;
      color: #000!important;
  }
  .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
      color: #000!important;
      background-color: #FFD401!important;
      border-color: #FFD401!important;
  }
  [type=radio]:checked+label:after {
      border-color: #FFD401!important;
      background-color: #FFD401!important;
      z-index: 0;
      -webkit-transform: scale(1.02);
      -ms-transform: scale(1.02);
      transform: scale(1.02);
  }
  .md-form .prefix.active, .md-form textarea~label.active, .md-form.md-outline .prefix:focus, .md-form.md-outline input[type=date]:focus:not([readonly])+label, .md-form.md-outline input[type=datetime-local]:focus:not([readonly])+label, .md-form.md-outline input[type=email]:focus:not([readonly])+label, .md-form.md-outline input[type=number]:focus:not([readonly])+label, .md-form.md-outline input[type=password]:focus:not([readonly])+label, .md-form.md-outline input[type=search-md]:focus:not([readonly])+label, .md-form.md-outline input[type=search]:focus:not([readonly])+label, .md-form.md-outline input[type=tel]:focus:not([readonly])+label, .md-form.md-outline input[type=text]:focus:not([readonly])+label, .md-form.md-outline input[type=time]:focus:not([readonly])+label, .md-form.md-outline input[type=url]:focus:not([readonly])+label, .md-form.md-outline textarea.md-textarea:focus:not([readonly])+label {
      color: #000!important;
  }
  .main-background {
    background-image: url('../img/test.jpg');
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  .login-head {
    background-color: #66686B;
  }
  .login-form input[type=date]:focus:not([readonly]), .login-form input[type=datetime-local]:focus:not([readonly]), .login-form input[type=email]:focus:not([readonly]), .login-form input[type=number]:focus:not([readonly]), .login-form input[type=password]:focus:not([readonly]), .login-form input[type=search-md]:focus:not([readonly]), .login-form input[type=search]:focus:not([readonly]), .login-form input[type=tel]:focus:not([readonly]), .login-form input[type=text]:focus:not([readonly]), .login-form input[type=time]:focus:not([readonly]), .login-form input[type=url]:focus:not([readonly]), .login-form textarea.md-textarea:focus:not([readonly]) {
      -webkit-box-shadow: 0 1px 0 0 #212121;
      box-shadow: 0 1px 0 0 #212121;
      border-bottom: 1px solid #212121;
  }
  .login-form input[type=date]:focus:not([readonly])+label, .login-form input[type=datetime-local]:focus:not([readonly])+label, .login-form input[type=email]:focus:not([readonly])+label, .login-form input[type=number]:focus:not([readonly])+label, .login-form input[type=password]:focus:not([readonly])+label, .login-form input[type=search-md]:focus:not([readonly])+label, .login-form input[type=search]:focus:not([readonly])+label, .login-form input[type=tel]:focus:not([readonly])+label, .login-form input[type=text]:focus:not([readonly])+label, .login-form input[type=time]:focus:not([readonly])+label, .login-form input[type=url]:focus:not([readonly])+label, .login-form textarea.md-textarea:focus:not([readonly])+label {
      color: #212121;
  }
.btn-outline-primary {
  border: 2px solid #000 !important;
  background-color:transparent !important;
  color: #000 !important;
}

@media (max-width: 1440px) { 

  .item-pakiet-small {
    width: 18%;
    margin: 0 1%;
    text-align: center;
    text-transform: uppercase;
  }
}

@media (max-width: 1199.98px) { 
  .item-pakiet {
    width: 23%;
    margin: 0 auto;
  }

  .item-pakiet-small {
    width: 18%;
    margin: 0 1%;
    text-align: center;
    text-transform: uppercase;
  }
}
@media (max-width: 767.98px) { 
  .item-pakiet {
    width: 31.333%;
    margin: 0 auto;
  }

  .item-pakiet-small {
    width: 23%;
    margin: 0 1%;
    text-align: center;
    text-transform: uppercase;
  }
}
@media (max-width: 575.98px) { 
  .item-pakiet {
    width: 48%;
    margin: 0 auto;
  }

  .item-pakiet-small {
    width: 47.33%;
    margin: 0 1%;
    text-align: center;
    text-transform: uppercase;
    font-size: 13px;
}
}
.carousel-control-next, .carousel-control-prev {
  width: 10%;
  background-color: rgb(0,0,0, 0.7);
}
.carousel-control-prev {
  left: -150px;
}
.carousel-control-next {
  right: -150px;
}
.template_item img {
  height: 500px;
}
.news_background_image {
  height: 500px;
  background-repeat: no-repeat;
  background-size: cover;
}
.view .newsmask {
  opacity: 0.8 !important;
  height: 15%;
  bottom: 0 !important;
  top: auto;
}
.rgba-green-strong, .rgba-green-strong:after {
  background-color: #000;
}
.carousel-multi-item {
  margin-bottom: 2rem;
}

.login-page {
  min-height: calc(100vh - 76px);
}

.loading-page {

  min-height: calc(100vh - 76px);

}

.padding-second-section {
  padding-top: 63px;
}

.linkanchor:hover {

  color: #fdeb01!important;

}

.section_font {
  padding: 10px;
}

.float{
	position:fixed;
	width:60px;
	height:60px;
	top: 120px;
	left:40px;
	background-color:#FDEB01;
	color:#000;
	border-radius:50px;
	text-align:center;
  box-shadow: 2px 2px 3px #000;
  z-index: 5;
}

.float:hover{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#FDEB01;
	color:#000;
	border-radius:50px;
	text-align:center;
	box-shadow: 2px 2px 3px #000;
}

.my-float{
	margin-top:22px;
}

.dropdown .dropdown-menu.dropdown-secondary .dropdown-item.active, .dropdown .dropdown-menu.dropdown-secondary .dropdown-item:active, .dropdown .dropdown-menu.dropdown-secondary .dropdown-item:hover, .dropleft .dropdown-menu.dropdown-secondary .dropdown-item.active, .dropleft .dropdown-menu.dropdown-secondary .dropdown-item:active, .dropleft .dropdown-menu.dropdown-secondary .dropdown-item:hover, .dropright .dropdown-menu.dropdown-secondary .dropdown-item.active, .dropright .dropdown-menu.dropdown-secondary .dropdown-item:active, .dropright .dropdown-menu.dropdown-secondary .dropdown-item:hover, .dropup .dropdown-menu.dropdown-secondary .dropdown-item.active, .dropup .dropdown-menu.dropdown-secondary .dropdown-item:active, .dropup .dropdown-menu.dropdown-secondary .dropdown-item:hover {
  background-color: #FDEB01!important;
  box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
  border-radius: .125rem;
  color: black!important;
}

.offer_title{
  cursor: pointer;
  color: black!important;
}

.gallery {
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
  -webkit-column-width: 33%;
  -moz-column-width: 33%;
  column-width: 33%; }
  .gallery .pics {
  -webkit-transition: all 350ms ease;
  transition: all 350ms ease; }
  .gallery .animation {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1); }
  
  @media (max-width: 450px) {
  .gallery {
  -webkit-column-count: 1;
  -moz-column-count: 1;
  column-count: 1;
  -webkit-column-width: 100%;
  -moz-column-width: 100%;
  column-width: 100%;
  }
  }
  
  @media (max-width: 400px) {
  .btn.filter {
  padding-left: 1.1rem;
  padding-right: 1.1rem;
  }
  }

  .trader-name {
    font-weight: 800;
    font-size: 17px;
    letter-spacing: -0.39px;
      line-height: 24px;
      color: #272425;
  }

  .trader-experience {
    color: #272425;
      font-family: Poppins;
      font-size: 15px;
      letter-spacing: 1.35px;
      line-height: 14px;
  }

  .trader-phone, .trader-mail, .number-phone {
    color: #272425;
  }
  
  .trader-phone:hover, .trader-mail:hover, .number-phone:hover {
    color: #FFE81F;
  }

  .contact_avatar {
    width: 50%!important;
    margin: auto!important;
    border-radius: 50%!important;
    height: auto!important;
  }

  textarea{  
    overflow-y: scroll;
  }

.shadow-textarea textarea.form-control::placeholder {
    font-weight: 300;
}
.shadow-textarea textarea.form-control {
    padding-left: 0.8rem;
}