@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,600;1,400;1,600&display=swap');
html {scroll-behavior: smooth; font-size: 16px;}
body {	font-family: 'Montserrat', sans-serif; background-color: #f4f2ee; color: #10252f;}
    a { color: #10252f; position: relative; text-decoration: underline;}
    a:hover, .d1.navbar .nav-link:hover, .d1-footer2 a:hover { color:#ff7900; transition: 0.3s; text-decoration: underline;}
    h1, h2, h3, h4 {color: #ff7900; font-weight: bold;}
	h2 {font-size: 3rem;}
    h3 { font-size: 1.5rem; letter-spacing: 3px;}
    h5 {font-weight: bold;}
	
	.d1.navbar .nav-link { text-transform: uppercase; font-weight: bold; color: #000000;}
	.d1.navbar .active .nav-link  {color: #ff7900;}
	.d1-search .targetDiv {width: 450px;}	
	.d1-search img {  height: 30px;  width: 30px;  border: none;	margin-right: 20px;}
	.d1-langs { display: block; position: absolute; top: 5px; right: 5px; font-size: 0.7rem;}
	
    .d1.btn {border-radius: 8px; text-transform: uppercase; letter-spacing: 2px; font-weight: bold; border-color: #ff7900; border-style: solid; border-width: 1px; color:#ff7900; margin-right: 15px; margin-top: 5px; min-width: 150px; border: 1px solid;}
	.d1.navbar  .d1.btn {margin-top: 0;}
	.d1.navbar a,  .d1.btn , .d1.btn-primary, .d1.btn-secondary, .slick-track a {text-decoration: none;}
    .d1.btn:hover {background-color: #ffffff; color:#ff7900;}	
    .d1.btn-primary {background-color: #ff7900;  color: #ffffff; }
	.d1.btn-secondary {background-color: #f4f2ee; }	
    .d1.btn-info {background-color: #ffffff; }	
	.d1-kolaz img { width: 100%;   height: auto; min-width: 360px; max-width: 645px;}
	.d1-b2b, .d1-elektro {max-width: 420px;}
	.d1-b2b h2, .d1-elektro h2 {font-size: 2rem;}
	.d1-b2b img, .d1-elektro img{max-width: 60px; width: auto; height: 60px; padding-bottom: 10px;}
    .d1-b2b a, .d1-elektro a{font-size: 15px; line-height: 18px; text-decoration: none; }
	.d1-b2b a:hover img, .d1-elektro a:hover img { filter: invert(56%) sepia(62%) saturate(3772%) hue-rotate(359deg) brightness(101%) contrast(108%);}
	.d1-elektro .d1.btn {margin-right: 0;}
    .d1-whitestripe {background-color: #ffffff;}
    .d1-whitestripe .container {max-width: 1600px; overflow: auto;}
    .d1-whitestripe .container .row{min-width: 900px;}
	.d1-whitestripe img { filter: brightness(0%) invert(98%) sepia(5%) saturate(2014%) hue-rotate(324deg) brightness(86%) contrast(92%); max-height: 40px;}
	.d1-whitestripe img.active, .d1-whitestripe img:hover { filter: none;}
    .targetDiv a {color: #ff7900; font-weight: bold;}
    .d1-outer {max-width: 1600px; overflow: auto;}
 
#navbarNav {z-index:11;}

#registration {padding-top: 50px;}
#registration .box-gray {width: 950px; padding-bottom: 50px;}
/*#registration .box-gray:nth-child(6) {width: auto; margin: 0; padding-right: 10vw;}*/

#registration .form-group {padding: 5px 0;}
#registration label {min-width: 11rem; justify-content: left; margin:0 5px;}

/*.checkbox {float: left; margin:5px 5px 0 0; padding-top: 23px;}*/
 
.block--login {  z-index: 14;  background-color: #d4c8ae;  color: #ffffff; padding-bottom: 5px; margin-top:30px;}
.block--login br { display:none; visibility:hidden;}
.block--login h5 {margin-bottom: 0; width: auto; padding-top: 5px;}
.block--login a h5 { font-size: 1rem;padding-top: 0px;}
.login-links {font-size:0.75rem;}
.login-links a {color:#ffffff;}
.login-links a:hover {color:#000000;}
.login-links a:after {content: "\a"; white-space: pre;}

.block--login input, .block--login btn {margin-top:5px;}

.block--login i {
  color: #ffffff;
  font-size: 1.22222rem;
  margin-left: 0.83333rem;
  line-height: 1.94444rem;
  cursor: pointer;
}
.icon-close {position: absolute;top: 35px;right: 20px;transform: rotate(45deg);}
.icon-close::before {font-size: 50px;color: #ffffff;  content: "+";}

.block--login .form-control, .block--login .form-group.file .control-label, .form-group.file .block--login .control-label {
  min-width: 13.05556rem;
}
.block--login .form-control, .block--login .form-group.file .control-label, .form-group.file .block--login .control-label {
  border: none;
  margin-right: 0.83333rem;
  line-height: 1.11111rem;
}
.block--login .login-links {
  margin-left: 1.66667rem;
  padding-left: 0.83333rem;
  border-left: 1px solid rgba(255, 255, 255, 0.75);
}
.block--login .form-inline {
  display: flex;
  justify-content: space-evenly;
}
 
	.d1-top3 {counter-reset: css-counter 0; min-width: 1070px; font-weight: bold;}
	
    .d1-top3 div {
    box-sizing: border-box;
    counter-increment: css-counter 1;
    background-color: #ffffff;
    border-radius: 50%;
    border: 3px solid #ffffff;
    position: relative;
    float: left;
	flex-grow: 1;
	width: 28vw;
    height: 28vw;
	padding-top: clamp(45px, 6vw, 120px);
    margin: clamp(0px, 1vw, 15px);
    max-width: 465px;
    max-height: 465px;
	min-width: 330px;
	min-height: 330px;
}
.d1-top3 div:before {  content: counter(css-counter); position: absolute; top: clamp(0px, 2vw, 45px); left: clamp(30px, 2vw, 45px); background-color:  #ff7900; color: #ffffff;  border-radius: 50%; width: 50px; height: 50px; font-size: 32px; z-index: 10;  }
	
	
    .d1-top3 div:hover {border: 3px solid #ff7900;}
    .d1-top3 a:hover {color:#ff7900; text-decoration: none;}
	
    .d1-six { padding-left: 15vw; padding-right: 15vw; font-size: 0.8em; position: relative;font-weight: bold;}
    .d1-six a:hover {color: #ff7900; text-decoration: none;}
    .d1-six img { max-width: 70px; min-width:30px; margin: 0 auto;}
	.d1-six a:hover img { filter: invert(56%) sepia(62%) saturate(3772%) hue-rotate(359deg) brightness(101%) contrast(108%);}
    .d1-slick-prev, .d1-slick-next {width: 30px; height: 30px; display: block; border-left: 2px solid #000000; border-bottom: 2px solid #000000; transform: rotate(45deg); position: absolute; top:70px; left: 13vw;}
    .d1-slick-next {transform: rotate(-135deg); left: auto;  right: 13vw; }
	.d1-slick-prev:hover, .d1-slick-next:hover {border-color:#ff7900; }
    .d1-two img { float: left; border-radius: 50%; margin-right: 3vw; max-width: 20vw;}
    .d1-two .textwrap {padding-right: 4vw;}
    .d1-two .d1-slick-prev {top:170px; left: 0;}
    .d1-two .d1-slick-next {top:170px; left: auto;  right: 0;}
    
.carousel-fade .carousel-item { opacity: 0; transition-duration: .6s; transition-property: opacity;}
.carousel-fade  .carousel-item.active,.carousel-fade  .carousel-item-next.carousel-item-left,.carousel-fade  .carousel-item-prev.carousel-item-right {  opacity: 1;}
.carousel-fade .active.carousel-item-left,.carousel-fade  .active.carousel-item-right { opacity: 0;}
.carousel-fade  .carousel-item-next,.carousel-fade .carousel-item-prev,.carousel-fade .carousel-item.active,.carousel-fade .active.carousel-item-left,.carousel-fade  .active.carousel-item-prev { transform: translateX(0); transform: translate3d(0, 0, 0);}
    
		/* search box start*/
.search-box {
  border: solid 3px black;
  display: inline-block;
  position: relative;
  border-radius: 30px;
  margin-right: 20px;
}	  
.search-box input[type=text] {
  width: 30px;
  height: 30px;
  border: none;
  box-sizing: border-box;
  border-radius: 30px;
  transition: width 800ms cubic-bezier(0.68, -0.55, 0.27, 1.55) 150ms;
  background-color: #f4f2ee;
    padding-left: 10px;
}
.search-box input[type=text]:focus {
  outline: none;
}
.search-box input[type=text]:focus, .search-box input[type=text]:not(:placeholder-shown) {
  width: 180px;
  transition: width 800ms cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.search-box input[type=text]:focus + button[type=submit], .search-box input[type=text]:not(:placeholder-shown) + button[type=submit] {
  bottom: 10px;
  right: 10px;
  transition: bottom 150ms ease-out 50ms, right 150ms ease-out 50ms;
}
.search-box button[type=submit] {
  background-color: transparent;
  width: 15px;
  height: 18px;
  border: 0;
  padding: 0;
  outline: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: -6px;
  right: -13px;
/*  transition: bottom 150ms ease-out 150ms, right 150ms ease-out 150ms;*/
     
}    
.search-box button[type=submit]:before, .search-box button[type=submit]:after {
  content: "";
  height: 15px;
  border-left: solid 4px black;
  position: absolute;
 top: 10px;
  transform: rotate(-45deg);
 
}
.search-box button[type=submit]:after {
  transform: rotate(-45deg);
  opacity: 0;
  top: -10px;
  right: -10px;
/*  transition: top 150ms ease-out, right 150ms ease-out, opacity 150ms ease-out;*/
    border-color: #ff7900;
}	  
.search-box input[type=text]:focus + button[type=submit]:after, 
.search-box input[type=text]:not(:placeholder-shown) + button[type=submit]:after{
      top: 2px;
      right: 5px;
      height: 15px;
      opacity: 1;
      transition: top 150ms ease-out 50ms, right 150ms ease-out 50ms, opacity 150ms ease 50ms;
}      
.search-box input[type=text]:focus + button[type=submit]:before, 
.search-box input[type=text]:not(:placeholder-shown) + button[type=submit]:before{
        transform: rotate(45deg);  
        border-color: #ff7900;
          }	 
/* search box end*/          
    


.d1-header {max-width: 50%;}
.d1-header h3 {padding-top: 2rem;}
.d1-regform {background-color: #ffffff;}
.d1-regform .d1.btn {margin-top: 0; margin-right: 0;}
.d1-vyhody img { filter: brightness(0%) invert(98%) sepia(5%) saturate(2014%) hue-rotate(324deg) brightness(86%) contrast(92%);}
.d1-vyhody img:hover {filter: invert(53%) sepia(98%) saturate(3126%) hue-rotate(2deg) brightness(106%) contrast(103%);}
.d1-footer {background-color: #ffffff;}
.d1-footer2 {background-color: #f3f3f3; color: #787878; font-size: 0.8rem;}
.d1-footer2 a{color: #787878;}

.hideme:after{
	content: "";
    display: block;
	width: 30px;
    height: 30px;
    border-left: 2px solid #000000;
    border-bottom: 2px solid #000000;
    transform: rotate(-45deg);
	margin: 0 auto;
}

.showme:before{
	content: "";
    display: block;
	width: 30px;
    height: 30px;
    border-left: 2px solid #000000;
    border-bottom: 2px solid #000000;
    transform: rotate(135deg);
	margin: 0 auto;
}
.icon::before, .article-preview__link::before {
  font-family: "icon-font";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  text-decoration: none;
  text-transform: none;
}
.d1-regform label {color: #ff7900; font-weight: bold;}
.d1-regform input {color: #000000; font-weight: bold; border-color: #ff7900;}
.d1-regform .form-check-label {font-weight: normal; color: #000000;}

.d1-benefit img{float: left; width: 100px; filter: brightness(0%) invert(98%) sepia(5%) saturate(2014%) hue-rotate(324deg) brightness(86%) contrast(92%);}  
.d1-benefit:hover {color:#ff7900; }  
.d1-benefit:hover img {filter: invert(53%) sepia(98%) saturate(3126%) hue-rotate(2deg) brightness(106%) }


.d1-b2b-letak img {width: 100%;height: auto;}

	@media (max-width: 576px) {
        .d1-kolaz img { min-width: 50px; max-width: 100vw;} 
        h2 {font-size: 2rem;}
/*        .d1-top3 { width: 240vw;}
		.d1-top3 div { width: 70vw; height: 70vw; padding-top: 13vw;}
	    .d1-top3 img {max-width: 40vw; height: auto;}
	    .d1-top3 div::before { top: 0vw; left: 0vw;}*/
	    h3 { font-size: 1.1rem; letter-spacing: 2px;}
	}
		@media (max-width: 700px) {.form-inline .form-group {  flex: fit-content; }}
	
	@media (max-width: 992px) {.d1-b2b, .d1-elektro {max-width: 100%;} .d1-six {padding-left: 0; padding-right: 0;} .d1-slick-prev, .d1-slick-next {left: 0vw;} .d1-slick-next { left: auto; right: 0vw; } .d1.navbar .d1.btn {width: 90%; margin-top: 20px; margin-right: 0;} .search-box {    margin-left: 30px;} .d1-header {max-width: 100%;} .block--login h5 {    display: block;    width: 100%;    text-align: center;} .login-links a::after {  content: ""; padding-right:5px;} }	
    @media (min-width: 992px) {.d1-b2b, .d1-elektro {max-width: 30%; } /*.d1-top3 img{	    width: 15vw;    height: auto; max-width: 190px;}*/  }	
    @media (min-width: 1200px) {.container {max-width: 1600px;}    
    }
    @media (max-width: 1300px) {.d1-two img {    float: none; max-width: 100%; margin: 0 auto; padding-bottom: 15px;}  }	
	