@import url('https://fonts.googleapis.com/css?family=Kanit:200,200i,300,300i,400,400i,500,500i,600,600i,700,700i&subset=latin-ext');

//GRID
@column-width: 60;
@gutter-width: 20;
@columns: 12;

// Utility variable — you should never need to modify this
@gridsystem-width: (@column-width*@columns) + (@gutter-width*@columns) * 1px;

// Set @total-width to 100% for a fluid layout
@total-width: @gridsystem-width;

// Uncomment these two lines and the star-hack width/margin lines below to enable sub-pixel fix for IE6 & 7. See http://tylertate.com/blog/2012/01/05/subpixel-rounding.html
// @min-width: 960;
// @correction: 0.5 / @min-width * 100 * 1%;

// The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack/
.clearfix() {
	*zoom:1;

	&:before,
	&:after {
	    content:"";
	    display:table;
	}
	&:after {
	    clear:both;
	}
}


//////////
// GRID //
//////////

body {
	width: 100%;
	.clearfix;
	font-size: 16px;
	background: #fafafa;
}

.row(@columns:@columns) {
	display: block;
	width: @total-width*((@gutter-width + @gridsystem-width)/@gridsystem-width);
	margin: 0 @total-width*(((@gutter-width*.5)/@gridsystem-width)*-1);
	// *width: @total-width*((@gutter-width + @gridsystem-width)/@gridsystem-width)-@correction;
	// *margin: 0 @total-width*(((@gutter-width*.5)/@gridsystem-width)*-1)-@correction;
	.clearfix;
}
.column(@x,@columns:@columns) {
	display: inline;
	float: left;
	width: @total-width*((((@gutter-width+@column-width)*@x)-@gutter-width) / @gridsystem-width);
	margin: 0 @total-width*((@gutter-width*.5)/@gridsystem-width);
	// *width: @total-width*((((@gutter-width+@column-width)*@x)-@gutter-width) / @gridsystem-width)-@correction;
	// *margin: 0 @total-width*((@gutter-width*.5)/@gridsystem-width)-@correction;
}
.push(@offset:1) {
	margin-left: @total-width*(((@gutter-width+@column-width)*@offset) / @gridsystem-width) + @total-width*((@gutter-width*.5)/@gridsystem-width);
}
.pull(@offset:1) {
	margin-right: @total-width*(((@gutter-width+@column-width)*@offset) / @gridsystem-width) + @total-width*((@gutter-width*.5)/@gridsystem-width);
}



//ZMI

div { box-sizing: border-box;}
button {outline: 0 none !important;}

@phone: ~"only screen and (min-width: 1px) and (max-width: 479px)";
@smartphone: ~"only screen and (min-width: 480px) and (max-width: 768px)";
@tablet: ~"only screen and (min-width: 769px) and (max-width: 992px)";

@smallmobile: ~"only screen and (min-width: 1px) and (max-width: 768px)";
@mobile: ~"only screen and (min-width: 1px) and (max-width: 992px)";
@desktop: ~"only screen and (min-width: 993px)";
@bigscreen: ~"only screen and (min-width: 1200px)";

body, html {margin: 0; padding: 0; font-family: Kanit; 	 scroll-behavior: smooth;}
.full {width: 100%; float: left; position: relative;}
.container {width: 100%; margin: 0 auto; padding: 0 20px;}
.container1200 {width: 100%; max-width:1400px;  margin: 0 auto; padding: 0 50px;
@media @smallmobile {padding: 0 10px;}}

.flex-inline {display: flex; flex-direction: row;}
.space {justify-content: space-between;}

.transitions {-webkit-transition: all 200ms linear; -moz-transition: all 200ms linear; -ms-transition: all 200ms linear; -o-transition: all 200ms linear; transition: all 200ms linear; }
.xtransitions {-webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }

.shadow {-webkit-box-shadow: 0 0 20px 0 rgba(22,22,22,0.15); box-shadow: 0 0 20px 0 rgba(22,22,22,0.15);}
.xshadow {-webkit-box-shadow: none; box-shadow: none;}

.border {border: 1px solid #e1e1e1;}
.xborder {border: 0 none transparent;}

.scale {
-moz-transform: scale(1.02);
-webkit-transform: scale(1.02);
-o-transform: scale(1.02);
-ms-transform: scale(1.02);
transform: scale(1.02);
}

.hid {display: none !important;}

a {text-decoration: none !important; .transitions;
&:hover {.transitions; color: @green;}
}

p, a, ul li {
  color: @text;
  font-size: 1rem;
  line-height: 1.6;
	font-weight: 200;

}

.thin {font-weight: 300;}

h1, h2, h3, h4, h5, h6 {
font-weight: 400;
line-height: 1.3;
color: @heading;
margin-bottom: 1.5rem;
margin-top: 2.5rem;
font-family: Kanit;
}

h1 {font-size: 2.1875rem;}
h2 {font-size: 1.75rem;}
h3 {font-size: 1.53125rem}
h4 {font-size: 1.3125rem}
h5 {font-size: 1.09375rem}
h6 {font-size: 0.875rem}


@green: #118d85;
@white: #ffffff;
@dark: #2b2a2a;
@lightgrey: #292929;
@text: #727272;
@heading: #2b2a2a;
@footer-text: #645c5c;

.i {font-style: italic;}

//menu

.main-menu {
	@media @smallmobile {display: none;}
	ul {.flex-inline; padding: 0; margin: 0;}
	ul li {list-style: none; padding: 0 0 0 50px;}
	ul li a {
		font-size: 16px;
		font-weight: normal;
		letter-spacing: 1.6px;
		color: #645a70;
		text-transform: uppercase;
		padding: 15px 0 15px 0;
		border-bottom: 2px solid transparent;
		}
	ul li a:hover {
		color: #ffffff;
		border-bottom: 2px solid transparent;
	}
	ul li.current a {
		color: #ffffff;
		border-bottom: 2px solid @green;
	}
}

//mobile meni

.hamburger {display: none;
@media @smallmobile {
	position: relative; z-index: 999999999; display: flex;}
 }

#nav-icon3 {
  position: relative;
  right: 0px;
  width: 70px;
  transform: rotate(0deg);
  transition: .5s ease-in-out;
  cursor: pointer;
  z-index: 9999;
  display: flex;
	align-self: center;
	justify-content: center;
	@media @desktop {display: none !important;;}
}

#nav-icon3:hover span:nth-child(4) {
  width: 100%;
}

#nav-icon3.open {
  background: transparent;
}

@media (max-width: 768px) {
  #nav-icon3 {
  }
}

#nav-icon3 div {
  height: 20px;
  width: 29px;
  position: relative;
}

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  border-radius: 0px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) {
  top: 0px;
  background: @green;
}

#nav-icon3 span:nth-child(2), #nav-icon3 span:nth-child(3) {
  top: 8px;
  background: @green;
}

#nav-icon3 span:nth-child(4) {
  top: 16px;
  background: @green;
  width: 50%;
  transition-duration: 0.2s;
}

#nav-icon3.open span:nth-child(1) {
  top: 8px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 8px;
  width: 0%;
  left: 50%;
}
.logo {position: relative; z-index: 99999; padding: 50px 40px;}
.mobile-menu {position: absolute; width: 100%; background: #ffffff; z-index: 999; display: none; top: 0; background: #40374B;
	ul {flex-direction: column; text-align: center; padding: 150px 15px;}
	ul li {list-style: none;}
	ul li a {color: @green; font-size: 24px; padding: 10px; display: block; font-weight: 200;}
	ul li.current a {color: #ffffff;}

}


//STRUKTURA STRONY
.full h6 {position: absolute; left: 0; top: 50%;   transform: translateY(-50%);
color: @heading;
-moz-transform: rotate(270deg);
-webkit-transform: rotate(270deg);
-o-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
font-weight: 200;
margin: 0;
}
@media screen and (max-width: 1440px) {.full h6 {display: none;}}
.full h6::before {content: ""; width: 50px; height: 3px; background: @green;     display: inline-block; margin: 3px 10px;}
.full h6.white {color: #ffffff;}

.navbar {.flex-inline; justify-content: space-between;}
.navbar-right {display: flex; padding-right: 40px;
@media @smallmobile {padding-right: 0px;}
}
.main-menu {align-self: center;}
.logo img {width: 120px;}
.top {padding-bottom: 50px; background: url('/images/top-img.jpg') no-repeat center top; background-size: cover; }
.top h1 {text-align: center; font-weight: 200; font-size: 52px; line-height: 1.5; letter-spacing: 1.5px; color: #ffffff; max-width: 900px; display: block; margin: 0 auto;
	@media @mobile {min-height: 160px;}

	@media @phone {font-size: 20px; line-height: 1.5; letter-spacing: 1px; max-width: 90%; padding: 0 5%; min-height: 60px;}
}

.slider-container {display: flex; flex-direction: column; margin-top: 7%;}

.top-svg {max-width: 1200px; width: 100%; display: flex; margin: 80px auto 20px auto; position: relative;}
.top-svg-image {position: absolute; width: 96% ; padding: 0 2%;}
ul.top-icons {padding: 0 2%; margin: 0; display: inline-flex; width: 96%; position: relative; z-index: 99999;
	@media @desktop {height: 274px;}
	li {list-style: none; width: 25%;  align-self: center;
		a {
			img {margin: 0 auto; display: block; .transitions; max-width: 50%; width: 50px;
			@media @phone {width: 30px;}
		}
		&:hover {
			img {-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
.transitions;}
		}
			}
		}
	}
ul.top-icons li.first a img, .first-title {padding-left: 2%;}
ul.top-icons li.fourth a img, .fourth-title {padding-right: 2%;}

ul.top-icons-title {padding: 0 2%; margin: 0; display: inline-flex; width: 96%; max-width: 1200px; margin: 0 auto;  position: relative; z-index: 99999;
	@media @phone {display: none;}
	li {list-style: none; width: 25%;  align-self: center; text-align: center;
		&:hover {cursor: pointer;}
		}
	}


.slide {max-width: 1100px;margin: 60px auto;
	p {color: #ffffff; font-size: 16px; color: #ffffff; text-align: center; font-weight: 200; padding: 5px;}
	a.more {display: table; margin: 60px auto; padding: 20px 30px; font-size: 13px; text-transform: uppercase; font-weight: normal; letter-spacing: 2px; color: @green; border: 2px solid @green;
		&:hover {background: @green; color: @white;}
		}
}

.slide {display: none;}
.slide-active {display: block;}

.title {opacity: 0.3; font-size: 18px; margin-top: 20px; color: #ffffff; cursor: pointer;}
.title-visible {opacity: 0.9;}

.counters .custom {.flex-inline; width: 100%; justify-content: space-evenly;
	@media @phone {flex-direction: column;}
}
.numbers {
	color: @lightgrey;
	font-size: 16px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.5;
  letter-spacing: 1.6px;
	max-width: 250px;
	margin: 50px auto;
	display: block;
	text-align: center;
	padding: 0 10px;
	@media @smallmobile {margin: 10px auto;}
 }
.count {
	width: 100%;
	font-size: 64px;
  font-weight: normal;
	letter-spacing: 3.2px;
	color: @dark;
	display: block;
	text-align: center;
	@media @phone {font-size: 44px;}

}
.moduletable {padding: 50px 0;
	@media @smallmobile {padding: 20px 0;}
}
.moduletable h3, .page-header h3, h3.ul, .case-details h3 {text-align: center; margin: 0 auto; display: block; font-size: 30px; font-weight: 200; margin-bottom: 60px; margin-top: 30px;}
.moduletable h3::after, .page-header h3::after,  h3.ul::after, .case-details h3:after {
		content: "";
    display: block;
    margin: 15px auto;
    width: 50px;
    height: 3px;
    background: @green;
	}
.projekty::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/projekty.svg') no-repeat; margin: 0 auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px;}
}
.klienci::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/klienci.svg') no-repeat; margin: 0 auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px; margin-top: 20px;}
}
.transakcje::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/transakcje.svg') no-repeat; margin: 0 auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px; margin-top: 20px;}

}

.items-featured {.flex-inline; justify-content: space-evenly;}

.featured-item {position: relative; .transitions;
	&:hover {.shadow; .transitions; .scale;}
}
.items-row, .case-item {width: 31.333%; padding: 1%;
			@media @smallmobile {width: 98%;}
	}
.items-featured, .case-category {
    display: flex;
    width: 100%;
		margin-top: 100px;
    justify-content: space-evenly;
			@media @smallmobile {
				flex-direction: column;
				margin-top: 10px;
			}
}
.intro-image img {width: 100%;
	@media @smallmobile {
		width: 100%;
		height: 200px;
		object-fit: cover;
	}
}


.featured-item {position: relative;}
.intro-text {position: absolute; bottom: 20px; padding: 5%; width: 90%;
	h4 {
		font-size: 24px;
		font-weight: 300;
		letter-spacing: 0.6px;
		color: #ffffff;
		text-shadow: 0 0 1px #000000;
		@media @phone {line-height: 1; font-size: 16px;}
		@media @tablet {line-height: 1.2; font-size: 16px;}

	}
	a {
		font-size: 14px;
		font-weight: normal;
		line-height: 1.71;
		color: #92b99c;
			&:hover {text-decoration: underline;}
	}
	}
.items-featured * {-webkit-border-radius: 0;
border-radius: 0;}

.zarzad {.flex-inline; width: 100%; justify-content: space-evenly;
	@media @smallmobile {flex-direction: column;}
}

.zarzad h2 {
	font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 2px;
	margin-bottom: 0;
}

.zarzad strong {font-size: 16px;
  font-weight: 300;
  letter-spacing: 1.6px;}

.zarzad p {
	font-size: 14px;
font-weight: 200;
line-height: 1.71;
letter-spacing: 0.7px;
color: #727272;
}

.custom-team {width: 94%; margin: 3%; background: #ffffff; .shadow; padding: 0 3% 3%; margin-top: 50px;
@media @smallmobile {margin-bottom: 30px;}
}
.team-photo img {margin: 0 auto; display: block;  margin-top: -50px;     max-width: 140px;}

a.button, input.send-button {display: table; margin: 40px auto; padding: 20px 30px; font-size: 13px; text-transform: uppercase; font-weight: normal; letter-spacing: 2px; color: @white; background: @green; border: 2px solid @green; border-radius: 5px; .transitions; opacity: 0.8;
	&:hover {background: @green; color: @white; .transitions; border-radius: 0; opacity: 1;}
	}

input.send-button {width: auto !important; cursor: pointer; background: #107c74; padding: 30px 60px;
		&:hover {background: #105d57;}
}
.footer {
	background-image: linear-gradient(183deg, #2a1f36, #31243e); padding: 50px;
	p, a {color: #584e64; font-size: 14px; font-weight: 300;}
	a:hover {color: #fff;}
}

.l {display: inline-block; float: left;}
.r {display: inline-block; float: right;}


//case studies
.top-content {position: relative; z-index: 99999;}

.case-studies {margin-top: -170px;}
.article-bg {height: 500px; position: relative;}
.article-bg::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(41, 31, 62, 0.8);}
.article-bg-mask {min-height: 500px; background: url('../img/mask.png'); position: absolute; height: 500px; width: 100%;}
.article-content-bg {  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
text-align: center;}
.article-name {max-width: 1000px; margin: 0 auto; display: block;}
.article-name h1  {margin: 0; z-index: 9999; position: relative;
	font-size: 36px;
	  font-weight: 200;
	  line-height: 1.5;
	  letter-spacing: 1.8px;
	  color: #ffffff;
	@media @phone {font-size: 26px;}
}

.case-studies {margin-bottom: 100px;}
.case-fields {margin-top: -100px; z-index: 9999; position: relative;}
.case-details {max-width: 1200px; .shadow; background: #ffffff; margin: 0 auto; padding: 70px;
	@media @smallmobile {padding: 25px;}
}
.img1 img {margin: 0 auto; display: block;
	@media @smallmobile {max-width: 100px;}
}
.case-details {
	font-size: 16px;
  font-weight: 200;
  line-height: 1.5;
  letter-spacing: 0.8px;
  text-align: justify;

}

.opis h3::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/opis.svg') no-repeat; margin: 0 auto 30px auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px;}
}

.dzialania h3::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/dzialania.svg') no-repeat; margin: 0 auto 30px auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px;}
}

.efekty h3::before {content: ""; width: 70px; height: 70px; background: url('/images/icons/efekt.svg') no-repeat; margin: 0 auto 30px auto; display: block; background-size: cover;
@media @phone {width: 40px; height: 40px;}
}

.case-item {
	h4 a {
		font-size: 24px;
		font-weight: 300;
		letter-spacing: 0.6px;
		color: #ffffff;
		@media @phone {line-height: 1; font-size: 16px;}
text-shadow: 0 0 1px #000000;
@media @tablet {line-height: 1.2; font-size: 16px;}

	}

	h2 {
		font-size: 24px;
		font-weight: 300;
		letter-spacing: 0.6px;
		color: #ffffff;
		@media @phone {line-height: 1; font-size: 16px;}
text-shadow: 0 0 1px #000000;
@media @tablet {line-height: 1.2; font-size: 16px;}

	}

	a {
		font-size: 14px;
		font-weight: normal;
		line-height: 1.71;
		color: #92b99c;
		@media @phone {line-height: 1;}
			&:hover {text-decoration: underline;}
	}
}




.top-border {min-height: 500px; position: relative; background: #2a1f36;}
.top-border .page-header {  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
	@media @mobile {left: 0; top: 200px; transform: translate(0, 0);}
text-align: center;}
.top-border .page-header h1  {margin: 0; z-index: 9999; position: relative;
	font-size: 36px;
	  font-weight: 200;
	  line-height: 1.5;
	  letter-spacing: 1.8px;
	  color: #ffffff !important;
			@media @phone {font-size: 26px;}
}
.main-content {max-width: 1200px; margin: 0 auto;}
.main-content h3  {text-align: center; margin: 0 auto; display: block; font-size: 30px; font-weight: 200; margin-bottom: 60px; margin-top: 30px;}
.main-content h3:after {
			content: "";
	    display: block;
	    margin: 15px auto;
	    width: 50px;
	    height: 3px;
	    background: @green;
		}

.item-pageoferta .main-content {max-width: 1200px; margin: 0 auto; text-align: justify;}

 h3.szpitale::before {content: ""; width: 160px; height: 180px; background: url('/images/icons/dlaszpitala.png') no-repeat; margin: 50px auto 30px auto; display: block; background-size: cover;
		@media @phone {width: 50px; height: 56px;}
		}

h3.finansowe::before {content: ""; width: 160px; height: 180px; background: url('/images/icons/dlainstytucji.png') no-repeat; margin: 50px auto 30px auto; display: block; background-size: cover;
@media @phone {width: 50px; height: 56px;}
	 		}

h3.dostawcy::before {content: ""; width: 160px; height: 180px; background: url('/images/icons/dladostawcy.png') no-repeat; margin: 50px auto 30px auto; display: block; background-size: cover;
@media @phone {width: 50px; height: 56px;}
				 		}
.main-content h4
{  font-size: 30px;
  font-weight: 200;
  line-height: 1.8;
  letter-spacing: 1.5px;}

.main-content h4:after {
									content: "";
							    display: block;
							    margin: 15px 0;
							    width: 50px;
							    height: 3px;
							    background: @green;
								}
.main-content p {
	font-size: 16px;
  font-weight: 200;
  line-height: 1.5;
  letter-spacing: 0.8px;
	margin: 0;
}

.main-content ul li {
	font-size: 16px;
  font-weight: 200;
  line-height: 1.5;
  letter-spacing: 0.8px;
	margin: 0;
}

.main-content p strong {font-weight: 500;}
.main-content .moduletable {padding: 0;}
.contact-details  {width: 50%; float: left; padding: 20px;
	@media @smallmobile {width: 100%;}
}

 .form {width: 50%; float: left; padding: 20px;
	@media @smallmobile {width: 100%; margin-bottom: 50px;}
}


.fox-column {
	.controls {margin-bottom: 10px !important;
		input {
		font-size: 16px; line-height: 20px; border: 0 none; border: 1px solid transparent; .shadow; padding: 20px !important; display: inline-block; outline: none !important; width: 100% !important; height: auto !important; font-weight: 200 !important;
		&:focus {color: @green; border-color: @green; .xshadow;}
		}
		textarea {
		font-size: 16px; border: 0 none; border: 1px solid transparent; .shadow; padding: 20px  !important; display: block; outline: none !important; width: 100% !important; font-weight: 200 !important;
		&:focus {color: @green; border-color: @green;}
		}
		label.checkbox {font-size: 12px !important; font-weight: 300 !important; }
	}
}



.fox-item, .fox-item-text-area {display: block; width: 50%; padding-right: 25px;
@media @phone {width: 100%; padding: 0;}
}
.controls {width: 100%; margin: 0;}
input {width: 100% !important;}
.fox-item-board {width: 100% !important;}

div#fox-container-m111 .radio input[type="radio"], div#fox-container-m111 .checkbox input[type="checkbox"] {
    float: left;
    width: 10px!important;
    margin-right: 10px;
}

.fox-item-text-area, .fox-item-checkbox, .fox-item-submit {width: 100% !important; margin: 0 !important;}


.alert-error {padding: 10px; border: 1px solid #d00000; margin-bottom: 30px;}
ul.fox-messages {padding: 20px !important; font-size: 14px !important; color: #fff; background: @green;}
ul.fox-messages p {color: #fff;}
.close {cursor: pointer;     font-size: 40px !important ;}

.fox-item-submit .controls {width: 100% !important; margin: 0 !important; margin-top: 30px !important;}
.submit-button {float: right; margin: 0 !important; border: 0 !important; background: @green !important; text-transform: uppercase; letter-spacing: 2.6px; font-size: 13px !important; padding: 15px 45px; color: #ffffff; .transitions; opacity: 0.8;
	@media @smartphone {float: none; margin: 0 auto !important; display: block;}
	@media @phone {float: none; margin: 0 auto !important; display: block;}
	&:hover {background: @green !important; opacity: 1; color: #ffffff; .transitions; cursor: pointer;}
}

a.closecookiewarning {
		 float: right;
		 width: 2%;
		 display: block;
		 font-weight:bold;
		 text-decoration: none;
		 color: #fff;
	 }
.cookiealert {
	display: none; position: fixed; bottom: 30px; left: 30px; background: #fe4b68; color: #ffffff; width: 250px; padding: 30px; border-radius: 10px;
}


.form-container {
	background-image: linear-gradient(183deg, #128e86, #1d988a);
	padding: 80px 0;
	h2 {text-align: center; color: #ffffff; font-weight: 200; letter-spacing: 1.5px; font-size: 30px;}
	p {text-align: center; color: #ffffff; font-weight: 200; letter-spacing: 0.8px; font-size: 16px; max-width: 400px; margin: 0 auto;}

}

/* The slider itself */

.lead {margin: 50px auto;}
.values-info {.flex-inline; justify-content: space-between; color: #ffffff; font-size: 14px; font-weight: 200; letter-spacing: 0.7px; margin-top: 20px;}
.values-info div {@media @phone {

font-size: 10px;

	} }
.ranges {.flex-inline; justify-content: space-evenly; flex-wrap: wrap;}
.rangeContainer {width: 50%; padding: 30px;
@media @mobile {width: 100%;}
}
#cash, #time {color: #105d57;}
#cash::after {content: " PLN";}
#time::after {content: " mies.";}

.rangeSlider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 7px; /* Specified height */
  background: #107c74; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.rangeSlider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.rangeSlider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 22px; /* Set a specific slider handle width */
  height: 22px; /* Slider handle height */
  background: #39b6ae; /* Green background */
  cursor: pointer; /* Cursor on hover */
	border-radius: 22px;
}

.rangeSlider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #39b6ae; /* Green background */
  cursor: pointer; /* Cursor on hover */
	border-radius: 22px;

}

.cinfo {
     display: flex;
		 @media @mobile {flex-direction: column;}
}

.cinfo input {
	background: transparent;
	border: solid 2px #39b6ae;
	padding: 25px;
	font-size: 16px;
	font-weight: 200;
	color: #ffffff;
	margin: 15px;
	border-radius: 4px;
	max-width: 100%;
	@media @mobile {	width: auto !important;}
}

.cinfo input::placeholder {
	font-size: 16px;
	font-weight: 200;
	color: #ffffff;
}

.newscontainer {padding: 80px 50px 40px 50px;
@media @mobile {padding: 20px 15px;}
}
.gkHighlighterInterface div a {width: 18px !important; height: 18px !important;     margin: 5px !important;}
.news {padding: 30px 50px; background: #ffffff; .shadow;
	@media @smallmobile {padding: 15px; .xshadow; background: transparent;}
	@media @phone {min-height: 150px;}
}

.gkHighlighterWrapper img {width: 32px; height: 32px; float: left; margin-right: 20px;
}
.gkHighlighterWrapperSub {margin-left: 55px;

}
.gkHighlighterWrapperSub a {font-size: 16px;
  font-weight: 300;

  line-height: 32px;
}

.top50 {padding-top: 50px;}

.animated {visibility: visible !important;}

.case-details,
.img1,
.counters,
.feautured,
.zarzad
{visibility: hidden;}

#tabs {
	ul.tabsnav {.flex-inline; list-style: none; width: 100%; justify-content: center; padding: 0; flex-wrap: wrap; margin: 70px 0 80px 0;
		li {margin: 10px 16px;
			@media @mobile {margin: 5px 13px; display: flex;}
			a {
				font-size: 20px; font-weight: 300; outline: 0 none !important; padding: 16px 0; border-bottom: 2px solid transparent;
				@media @mobile {font-size: 16px; padding: 7px 0;}
			}
		}
		li.ui-tabs-active {
			a {
				border-bottom: 2px solid #118d85;
			}
		}
	}
}

#tabs-4 {
	table {width: 100%;
		thead {
			border-radius: 4px;
		  box-shadow: 0 0 15px 0 rgba(22, 22, 22, 0.1);
		  background-color: #ffffff;
			th {
					padding: 20px 10px;
					font-size: 16px;
				  font-weight: 500;
				  letter-spacing: 0.8px;
				  color: #107c74;
			}
		}
		td {
			padding: 10px;
			font-size: 16px;
			font-weight: 200;
			line-height: 1.5;
			letter-spacing: 0.8px;
			color: #727272;
		}
		tr:hover {
			background: #ffffff;
			cursor: default;
		}
	}
}

table.bt {margin: 0 auto; width: auto !important;

	tr {
		margin: 15px 0;
		padding: 15px;
		display: block;
		border-radius: 4px;
		box-shadow: 0 0 15px 0 rgba(22, 22, 22, 0.1);
		background-color: #ffffff;}
	td {display: flex; flex-direction: column; padding: 5px;}
	td::before {
		font-size: 16px;
		font-weight: 500 !important;
		letter-spacing: 0.8px;
		color: #107c74;
		padding-right: 30px;
		width: auto !important;
		text-align: left;
    line-height: 1;
    padding-bottom: 10px;
	}
}


.dropfiles-container {
	background: #ffffff;
	padding: 15px;
	display: block;
	border-radius: 4px;
	box-shadow: 0 0 15px 0 rgba(22, 22, 22, 0.1);
	thead, .extcol {display: none;}
	.mediaTableWrapperWithMenu {padding: 0 !important;}
	a.title {padding: 0 !important; margin: 0 !important; font-size: 16px !important; color: #777777 !important; opacity: 1 !important;}
	.bt-content {float: right;
		@media @phone {width: 100%;}
	}
	.persist .bt-content {float: left;}
	.openlink:hover {box-shadow: 0px 0px 0px #ffffff !important;}
	a.downloadlink.dropfiles_downloadlink {box-shadow: 0px 0px 0px #ffffff !important;}
	table.bt tfoot th::before, table.bt tfoot td::before, table.bt tbody td::before {display: none !important;}
	td.essential.persist {
    margin: 0;
    padding: 0;
    vertical-align: middle;
}
td.essential {
	@media @phone {width: 100%; text-align: center; display: table-row !important;}
}

}

.colstyle .mediaTableMenu {
    display: none !important;
}

.dropfiles-content-table.dropfiles-content .table {box-shadow: 0 0 0 transparent !important; margin-bottom: 0 !important;}
.dropfiles-content-table.dropfiles-content .table th, .dropfiles-content-table.dropfiles-content .table td {
	border: 0 !important;
}

#website {display: none;}
#fox-m96-textfield3-box {display: none !important;}

iframe {
    max-width: 100%;
}

.projekty .count::before {content: "+"; }