.flex {
	display:flex;
}

img {
	max-width:100%;
	width: 100%;
}

.image.main-page {
	max-width:75%;
	margin:auto;
}
body {
	/* color:#000; */
	margin: 0;
	font: 14px 'Open Sans', sans-serif;
}
ul li {
	list-style:none;
}
/* MENU */
#navbar-top, #navbar-bottom {
	background-color: white;
	/*margin-bottom:1.5rem;*/
}
#navbar-top ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  /*overflow: hidden;*/
}
table tr {
    border-bottom: 1px solid #292929;
}

table tr:last-child {
    border-bottom: none;
}
.header .text {
    padding: 1rem;
}

#navbar-top li a, .dropbtn {
  display: inline-block;
  color: #000;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 16px;
  font-weight: 600;
}
#navbar-top div.navbar-header {
  display: flex;
  align-items:center;
  justify-content:space-between;
}
#navbar-top div.navbar-header > ul {
  display: flex;
  align-items:center;
}

#navbar-top li a:hover, .dropdown:hover .dropbtn {
  color: red;
}

#navbar-top .dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

#navbar-top .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

#navbar-top .dropdown-content a:hover {background-color: #f1f1f1;}

#navbar-top .dropdown:hover .dropdown-content {
  display: block;
}

#navbar-bottom {
	background: #333;
	color: #fff;
	/*margin-top: 3rem;*/
	padding-bottom:20px;
	border-top: 1px solid #000;
}
#navbar-bottom .container {
	align-items:baseline;
}

#navbar-bottom ul {
  list-style-type: none;
  font-size: 1.2rem;
  line-height: 1.8rem;
  padding-left: 0;
}

#navbar-bottom a {
	color: #ccc;
	text-decoration: none;
}

#navbar-bottom a:hover {
  color: #fff;
  text-decoration:none;
  font-weight:600;
}
/* MENU END */

@media (max-width: 768px) {

.spaces-mobile {
	margin: 2rem 0;
}
}



/* language switcher */
.language-switcher>div, .language-switcher>div>a {
	min-width:160px;
}

#navbar-top .language-switcher a {
	display:flex;
	justify-items:left;
}
.language-switcher img {
	width: 30px;
	height: 20px;
	margin-right:10px;
}


	#kontakt iframe {
		width: 100%;
		height: 450px;
	}

	#kontakt > section > section:nth-child(2) {
		width: 100%;
		height: 450px;
	}
a#open_preferences_center {
	position: fixed;
	left: 0;
	bottom: 0;
	background: #eee;
	padding: 5px;
	border-radius: 0px 5px 0 0;
}

/*zacatek GUIL */
.pros img {
    max-width: 40px;
    min-width: 40px;
}

.pros {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    color: #fff;
    background-color: #000;
    margin-bottom: -1.2rem;
}

.pros-icon-field {
    width: 25%;
}

.pros-icon-field {
    display: flex;
}

.image-icon.main-page {
    min-width: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.image {
    margin: 10px;
    overflow: hidden;
    position:relative;
    /* transition: transform 0.5s linear; */
    width: 350px;
    position: relative;
}
.image img {
    overflow:hidden;
    position:relative;
    transition: transform 0.5s linear;
}
.categories img {
    width: 350px;
}

.categories {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.categories .fou {
    width: 350px;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    margin: 2.5rem;
}

.image img:hover {
    transform: scale(1.1);
    overflow: hidden;
    width: 350px;
}

.field-of-use {
    text-align: center;
    color: #fff;
    background-color: #000;
    padding-top: 3rem;
}
.lifters .images.main-page {
    width: 50%;
}

.lifters {
    display: flex;
}

.lifters > div {
    display: flex;
    width: 50%;
    padding-top: 100px;
}

.manufacture .lifters {
    background-color: #000;
    color: #fff;
}
.manufacture > div> h2 {
    padding: 400px 0 50px;
    background-color: #555;
    text-align: center;
    background-image: url(/img/home/background.jpg);
    margin: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    color: #fff;
    font-size: 5rem;
}

.lifters span {
    color: red;
    font-size: 2.8rem;
}

.lifters p {
    line-height: 1.6rem;
    text-align: justify;
}

.lifters .text {
    padding: 1.2rem;
    width: 50%;
}

.lifters h2 {
    line-height: 2.5rem;
    text-transform: uppercase;
    margin: 2rem auto 0;
}

.lifters .top-loading {
    border-right: 1px solid red;
}
.why-guil {
    background-image: url(/img/home/background2.jpg);
    padding-top: 2rem;
}

.why-guil H2 {
    text-align: center;
    font-size: 2.5rem;
}
.why-guil > div {
    display: flex;
    justify-content: center;
}

.why-guil > div >div {
    display: flex;
    width: 100%;
    justify-content: center;
}

.why-guil .images.main-page {
    width: 500px;
}

.why-guil ul li:before {
    content: "\2022";
    color: red;
    margin-right: 0.5rem;
    font-size: 1.5rem;
}
.field-of-use > h2 {
    font-size: 2.5rem;
    margin-top: 6rem;
}

.field-of-use:before {
    content: " ";
    width: 40%;
    height: 10px;
    background-color: red;
    position: absolute;
    transform: translateX(-50%);
}
.header {
    display: flex;
    align-items: baseline;
    justify-content: space-evenly;
    text-align: center;
    margin-top: 5rem;
}

.header .img {
    width: 450px;
    margin: auto;
}

.header span {
    font-size: 2.5rem;
}
.zvedaky .lifters, .acc .lifters {
    padding: 1rem 0;
    display: flex;
    margin: auto;
    flex-direction: column;
    justify-content: center;
    background-image: url(/img/zvedaky/banner.jpg);
    font-size: 2rem;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}
thead {
    background-color: #000;
    color: #fff;
    font-size: 1.2rem;
    border: 1px solid #000;
    text-align: left;
}

table.table {
    width: 60%;
    border-spacing: 0;
    text-align: center;
}

.table tbody tr {
    line-height: 2rem;
    /* border-bottom: 1px solid #000; */
}

.table tbody tr td:first-child {
    font-weight: 600;
    width: 145px;
}

.table tbody tr:nth-child(2n+1) {
    background-color: #eee;
}

.table td {
    border-bottom: 1px solid #bbb;
    padding-left: 10px;
}

.comparison-table.basic {
    display: flex;
    justify-content: center;
    /* display: none; */
}

.table th {
    padding: 1.3rem 10px;
}
.comparison-table a {
    color: #000;
    text-decoration: none;
}
.acc .img {
    width: 350px;
    overflow: hidden;
}

.acc ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-left: 0;
}
.acc a {
    text-decoration:none;
    color:#000;
}
.acc ul li {
    width: 350px;
    margin: 1rem 1rem 2rem;
}

.acc div#zvedaky {
    background-color: #ededed;
}

.acc .text {
    background-color: #eff1f2;
}

.acc .text h2 {
    margin: 0;
    padding: 1.5rem 0;
    text-align: center;
}

.acc .img:hover {
    filter: brightness(80%);
}
.acc .lifters {
    background-color: #333;
    background-image: none;
    padding: 2rem 0;
}
div#acc {
    background-color: #ededed;
}
article#kontakt {
    max-width: 1280px;
    margin: auto;
}

#kontakt p {
    line-height: 1.7rem;
}
#navbar-bottom > div {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

#navbar-bottom > div > div {
    width: 400px;
    text-align: center;
}
div#homepage, div#zvedaky, div#acc {
    padding-bottom: 5rem;
}

.elem, .elem * {
	box-sizing: border-box;
	margin: 0 !important;
}
.elem {
	display: inline-block;
	font-size: 0;
	width: 400px;
	/* border: 20px solid transparent; */
	border-bottom: none;
	background: #fff;
	padding: 10px;
	height: auto;
	background-clip: padding-box;
	position: relative;
	transition: filter 1.5s ease;
	filter: brightness(1);
}
.elem > span {
	display: block;
	cursor: pointer;
	height: 0;
	padding-bottom:	70%;
	background-size: cover;
	background-position: center center;
	transition: filter 0.5s ease;
	filter: brightness(1);
	border-radius: 15px;
}
.pouziti span {
    text-transform: uppercase;
}
div#pouziti {
    text-align: center;
    display: flex;
    flex-direction: column;
    max-width: 1920px;
    justify-content: center;
    margin: auto;
    min-height: 76vh;
}

.pouziti a.button, .zvedaky a.button, .acc a.button {
    text-decoration: none;
    padding: 1rem 2rem;
    background-color: rgb(255 0 0 / 70%);
    color: #fff;
    margin: 2rem auto;
    border-radius: 15px;
}
.zvedaky a.button {
	padding: 1.5rem 2rem 1rem;
}
.pouziti > div:first-child:not(.header) {
    height: fit-content;
    /* margin: 3rem; */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.pouziti .image a.button {
    position: absolute;
    z-index: 999;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    /* border-radius: 15px; */
}

.pouziti a.button:hover, .zvedaky a.button:hover, .acc a.button:hover {
    background-color: rgba(68,68,68,1);
}
.applications {
    display: flex;
    flex-wrap: wrap;
    margin: auto;
    justify-content: center;
}

.pouziti .header {
    font-size: 2.5rem;
    margin-top: 0;
}
ul.radio-buttons {
    display: flex;
    justify-content: center;
    margin: 1rem 0 2rem;
    padding: 0;
}

.radio-buttons li {
    content: " ";
    width: 20px;
    height: 20px;
    background-color: #eee;
    border: 1px solid #222;
    border-radius: 20px;
    margin: 0 0.2rem;
    position: relative;
    cursor: pointer;
}

.radio-buttons li.selected:before {
    content: " ";
    position: absolute;
    z-index: 999;
    color: #000;
    width: 10px;
    height: 10px;
    background-color: #000;
    border-radius: 16px;
    top: 28%;
    left: 50%;
    transform: translateX(-50%);
}
div.applications section {
    display: none;
}

div.applications section.selected {
    display: block;
}
a.elem:hover:before {
    content: "\002B";
    width: 50px;
    height: 50px;
    position: absolute;
    top: 40%;
    color: #fff;
    font-size: 6rem;
    left: 50%;
    transform: translate(-50%, -50%);
	z-index:2;
}

a.elem:hover span {
    filter: brightness(0.7);
}
.applications >div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* margin: auto; */
}
div#slider {
    margin: auto;
    display: flex;
    justify-content: center;
    color: #fff;
    background: linear-gradient(0deg, black, #555);
}
.slider > div> div {
    display: flex;
    flex-direction: row;
}
.slider .text {
    font-size: 1.6rem;
    width: 20%;
    text-transform: uppercase;
    margin: auto;
    padding-left: 1rem;
}

.slider .text span {
    color: red;
    font-size: 3rem;
}

.slider > div h3 {
    font-size: 2rem;
    margin: auto;
    text-align: center;
    margin-top: 0.8rem;
}
.slider > div.second-slide > div {
    flex-direction: column;
    position: relative;
}

.second-slide h2 {
    position: absolute;
    right: 5%;
    top: -20px;
    text-align: right;
    font-size: 2rem;
    color: #fff;
}

.second-slide h2 span {
    font-size: 3.1rem;
    background-color: rgba(85,85,85,0.6);
    padding: 0 1rem 0 3rem;
}
.subtitles {
    display: flex;
    justify-content: right;
}

.subtitles p {
    padding: 0 12px;
    font-size: 1.6rem;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    margin: 0;
    margin-top: 4px;
}

.subtitles p:nth-child(1)::after, .subtitles p:nth-child(2)::after {
    border-right: 5px solid red;
    content: " ";
    width: 5px;
    height: 20px;
    top: 50%;
    right: -2px;
    position: absolute;
    transform: translateY(-50%);
}

.slider .third-slide .text {
    font-size: 2rem;
    width: 25%;
    line-height: 4rem;
}
#slider .bx-wrapper {
    box-shadow: none;
    border: none;
    background-color: transparent;
    background: transparent;
}
.pouziti .bx-wrapper .bx-pager.bx-default-pager a:hover, .pouziti .bx-wrapper .bx-pager.bx-default-pager a.active, .pouziti .bx-wrapper .bx-pager.bx-default-pager a:focus {
	background: #ccc!important;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {
	background:#fff!important;
}
.slider > div.forth-slide> div {
    display: block;
    position: relative;
    background-color: #fff;
}

.slider > div.forth-slide> div >div:not(.img) {
    position: absolute;
    content: " ";
    top: 19%;
    left: 26%;
    color: #000;
    font-size: 1.6rem;
    flex-direction: column;
    width: 20%;
}

.slider > div.forth-slide> div >div h2 span:first-child {
    font-size: 4rem;
    font-weight: 800;
}

.slider > div.forth-slide> div >div h2 span.dva {
    font-size: 3.7rem;
    font-weight: 600;
}

.slider > div.forth-slide> div >div p {
    margin: 0;
}

.slider > div.forth-slide> div >div h2 {
    margin: 1rem 0;
    line-height: 2.9rem;
}
.comparison-table a:hover {
    font-size: 1rem;
}
.header a.button span {
    font-size: 1.8rem;
}
.acc .lifters span {
    color: #fff;
    font-size: 1.8rem;
}

.acc a.button {
    padding: 0.6rem 1.6rem;
}
.acc .img>img {
    transition: transform 0.5s linear;
}

.acc .img>img:hover {
    transform: scale(1.1);
    overflow: hidden;
}
.applications .bx-wrapper {
    box-shadow: none;
    border: none;
}
.pouziti .header h2 {
    margin: 1rem;
}
#kontakt > section {
    display: flex;
    width: 95%;
    margin: auto;
    align-items: center;
}

#kontakt > h1 {
    margin: auto;
    text-align: center;
    font-size: 2.5rem;
}

.first-slide .img.first {
    width: 80%;
    display: flex;
    margin: auto;
}

.first-slide .img.first img {
    width: 32%;
    margin: auto;
}
.second-slide .img.second {
    display: flex;
    width: 100%;
    align-items: baseline;
    margin: auto;
    justify-content: center;
}

.second-slide > div >div:first-child {
    background-image: url(/img/home/slider/2_back.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.second-slide .img.second img {
    width: 16%;
    height: fit-content;
}
.slider > div.forth-slide> div >div {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.slider > div.forth-slide> div >div img {
    width: 25%;
    height: fit-content;
}

.slider > div.forth-slide div.img.forth >div img.first-img-forth {
    margin-right: -75px;
    /* float: right; */
}
.slider > div.forth-slide> div >div > div > img {
    width: 50%;
}
.img.forth > div {
    display: flex;
    position: relative;
    justify-content: end;
    width: 60%;
}
.logos {
    display: flex;
    /* flex-direction: column; */
    align-items: baseline;
    position: relative;
}

#navbar-top li .logos a {
    padding: 0;
    position: relative;
}
.logo {
    width: 200px;
    margin: auto 0;
}
@media only screen and (max-width: 1024px) {
	.header .img {
		width:350px;
	}
	.zvedaky .header>div {
		width:350px;
		margin-bottom: 2rem;
	}
	.first-slide .img.first img:last-child {
		display: none;
	}

	.first-slide .img.first {
		width: 78%;
		justify-content: flex-end;
		margin: 2rem auto;
	}

	.first-slide .img.first img {
		margin: 0 1rem 0 0;
		height: fit-content;
	}
	.slider .first-slide .text > h2 {text-align: left;font-size: 1.5rem;}

	.slider .first-slide .text {
		width: 30%;
	}

	.slider .text span {
		font-size: 2.4rem;
	}

	.slider .third-slide .text {
		font-size: 1.5rem;
		line-height: 1.3;
	}

	.subtitles p {
		font-size: 1.1rem;
	}

	.subtitles {
		margin-top: 1rem;
	}
	.slider > div.forth-slide> div >div:not(.img) {
		width: 30%;
		left: 20%;
		font-size: 1.3rem;
		top: 12%;
	}
	.why-guil > div {
		width: 100%;
		flex-direction: column;
		justify-content: center;
	}
	.slider > div.forth-slide> div >div h2 span {
		font-size: 3rem!important;
		line-height:2rem;
	}
	.slider > div.forth-slide> div >div:not(.img) {
		left: 23%;
		
	}.manufacture .lifters {
		flex-direction: column;
	}

	.lifters .top-loading {
		border-right: none;
	}
	.lifters > div {
		width:100%;
	}
	.pros-icon-field {
		flex-direction: column;
		min-width: 230px;
		margin: 1rem 0;
	}

	.pros {
		flex-wrap: wrap;
	}

}
@media only screen and (max-width: 800px) {
	#navbar-bottom > div > div {
		margin-top:1rem;
	}
}
@media only screen and (max-width: 768px) {
	.language-switcher span {
		display:none;
	}
	#navbar-top .language-switcher>div, .language-switcher>div>a {
		min-width:30px;
	}
	#navbar-top .navbar-header {
		
	}
	#kontakt > section {
		flex-direction: column;
	}
	#navbar-bottom > div {
		flex-direction: column;
		margin:auto;
	}
	#navbar-bottom > div > div {
		width: 100%!important;
	}
	.header {
		flex-direction: column;
		margin-top:0;
	}

	.header >div:nth-child(2) {
		margin-top: 3rem;
	}
	.header >div {
		margin-bottom: 3rem;
	}
	.header .img, .zvedaky .header>div {
		width: 80%;
		margin: auto;
	}
	.manufacture .lifters {
		flex-direction: column;
	}

	.manufacture .lifters >div {
		width: 100%;
		flex-direction: column;
	}

	.why-guil > div {
		flex-direction: column;
	}
	.first-slide .img.first img:last-child {
		display: none;
	}

	.first-slide .img.first {
		width: 70%;
		justify-content: flex-end;
		margin: auto;
	}

	.first-slide .img.first img {
		margin: 0 1rem 0 0;
		height: fit-content;
	}
	.slider .first-slide .text > h2 {text-align: left;font-size: 1.5rem;}

	.slider .first-slide .text {
		width: 30%;
	}

	.slider .text span {
		font-size: 2.4rem;
	}

	.slider .third-slide .text {
		font-size: 1.5rem;
		line-height: 1.3;
	}

	.subtitles p {
		font-size: 1.1rem;
		text-align: center;
		margin: auto;
	}

	.subtitles {
		margin-top: 1rem;
	}
	.slider > div.forth-slide> div >div:not(.img) {
		width: 30%;
		left: 20%;
		font-size: 1.3rem;
		top: 12%;
	}

	.slider > div.forth-slide> div >div h2 {
		line-height: 1;
	}

	.slider > div.forth-slide> div >div h2 span {
		font-size: 2.3rem!important;
	}
	.lifters .text {
    width: 95%;
    padding: 0;
    margin: auto;
}
}
@media only screen and (min-width: 601px) {
	.table.mobile {
		display:none;
	}
}
@media only screen and (max-width: 600px) {
	.comparison-table.basic {
		display:none;
	}
	.table.mobile > table {
		width:100%;
		margin: 2rem 0;
	}
	.table.mobile {
		display:block;
	}
	thead a {
		color: #fff;
		text-decoration: none;
	}
	#slider .bx-viewport {
		height: 350px!important;
	}
	.slider > div.forth-slide> div >div h2 span {
		line-height: 1;
		font-size: 1.8rem!important;
	}
	.slider > div.forth-slide> div >div h2 {
		font-size: 1.5rem;
	}

	.slider > div.forth-slide> div >div:not(.img) {
		width: 35%;
		left: 25%;
	}
	.first-slide img {
		content: url(/img/home/slider/01_mobil.jpg);
	}
	.second-slide img {
		content: url(/img/home/slider/02_mobil.jpg);
	}
	.third-slide img {
		content: url(/img/home/slider/03_mobil.jpg);
	}
	.forth-slide img {
		content: url(/img/home/slider/04_mobil.jpg);
	}
	.first-slide {
		/*width: 100vw!important;*/
	}

	.bx-viewport {
		width: 100vw!important;
	}
	.bx-wrapper img {
    height: 350px;
    width: auto;
    margin: auto;
	}

}
@media only screen and (max-width: 500px) {
	#navbar-top .navbar-header ul:first-child{
		max-width:80%;
	}
	
	#navbar-top .navbar-header ul:last-child{
		max-width:100%;
	}
    #navbar-top li a, .dropbtn{
        min-width: 40px;
    }
	.zvedaky .lifters, .acc .lifters h2 {
		font-size: 1.8rem;
		padding: 5px;
		text-align: center;
	}
	.slider > div.forth-slide> div >div h2 span {
		line-height: 1;
		font-size: 1.4rem!important;
	}
	.slider > div.forth-slide> div >div h2 {
		font-size: 1.3rem;
	}
	.slider .third-slide .text {
		font-size: 1rem;
	}

	.slider .text span {
		font-size: 1.5rem;
	}

	.third-slide .text>h2 {
		text-align: left;
	}
	.toro > div, .elc > div {
		width: 100%;
	}
	.second-slide h2 {
		font-size: 1.5rem;
	}

	.second-slide h2 span {
		font-size: 2rem;
	}
	.slider > div h3 {
		font-size: 1.5rem;
	}

	.slider .first-slide .text > h2 {
		font-size: 1.3rem;
	}

	.first-slide .img.first img {
		width: 45%;
	}

	.why-guil .images.main-page {
		width:100%;
	}
	.logos {
		width: 75%;
	}
	#navbar-top .header-mobile-menu {
		margin: 0 1rem;
	}
}
@media only screen and (max-width: 400px) {
	.applications .image, #acc.acc .img, .header .img {
		width:300px;
		margin:auto;
	}.first-slide .img.first img:nth-child(2) {
		display: none;
	}

	.first-slide .img.first {
		/* width: 100%; */
	}

	.slider .first-slide .text {
		/* width: 100%; */
	}

	.first-slide .img.first img {
		width: 70%;
	}
	.second-slide h2 {
		position: relative;
	}
	.slider .third-slide .text {
		margin: auto;
		width: 100%;
	}

	.third-slide .text>h2 {
		font-size: 1rem;
		text-align: center;
	}

	.third-slide .text>h2 span {
		font-size: 1.3rem;
	}

	.subtitles p {
		font-size: 0.9rem;
	}

	.slider > div> div {
		/* flex-direction: column; */
	}

	.slider > div.forth-slide> div {
		display: flex;
		flex-direction: column;
	}

	.slider > div.forth-slide> div >div:not(.img) {
		position: relative;
		width: 100%;
		left: 0;
	}

	.slider > div.forth-slide> div >div h2 {
		width: 100%;
		text-align: center;
	}

	.slider > div.forth-slide> div >div p {
		margin: auto;
	}.second-slide > div >div:first-child {
		max-height: 250px;
		height: 250px;
	}
}