@font-face {
			font-family: oswald;
			src: url("../fonts/oswald.ttf");
		}

		@font-face {
			font-family: poppins;
			src: url("../fonts/poppins.ttf");
		}

		@font-face {
			font-family: comfortaa;
			src: url("../fonts/comfortaa.ttf");
		}

		@font-face {
			font-family: montserrat;
			src: url("../fonts/montserrat.ttf");
		}

		::-webkit-scrollbar {
			width: 10px;
		}

		::-webkit-scrollbar-thumb {
			background: #444444;
			border-radius: 10px;
		}

		::-webkit-scrollbar-thumb:hover {
			background: #cccccc;
		}

		a {
			text-decoration: none;
		}

		a:visited {
			color: inherit
		}

		a:hover {
			text-decoration: none;
		}

		body {
			-webkit-user-select: none;
			-ms-user-select: none;
			user-select: none;
			-webkit-tap-highlight-color: transparent;
			overflow-x: hidden;
		}

		html {
			scroll-behavior: smooth;
		}

		.header {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 90px;
			background: linear-gradient(90deg, rgba(46, 52, 61, 1) 0%, rgba(46, 52, 61, 1) 100%);
			font-family: montserrat;
			text-align: center;
			overflow: hidden;
			margin: 0;
			transition: ease 0.2s;
		}

		.header:hover .gradient {
			opacity: 1;
		}

		.header:hover {
			box-shadow: 10px 10px 30px rgba(180, 180, 180, 0.2);
		}

		.gradient {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			background: linear-gradient(90deg, rgba(46, 52, 61, 1) 0%, rgba(87, 90, 98, 1) 100%);
			opacity: 0;
			transition: ease 0.3s;
		}

		.headerLinks {
			position: relative;
			margin: 35px 15px;
			display: inline-block;
			text-decoration: none;
			color: white !important;
			cursor: pointer;
			width: auto;
			overflow: hidden;
			font-size: 20px;
			transition: 0.3s ease;
		}


		.headerLinks:hover {
			color: #ae0000 !important;
		}

		.headerLinks:hover .linija {
			left: 0%;
		}

		.linktosite:hover .linija {
			left: 0%;
		}

		.burger {
			position: absolute;
			right: 10px;
			top: 10px;
			width: auto;
			height: auto;
			cursor: pointer;
			display: none;
		}

		.bar1,
		.bar2,
		.bar3 {
			width: 30px;
			height: 4px;
			background-color: white;
			margin: 6px 0;
			border-radius: 2px;
			transition: transform 0.4s;
		}

		.change .bar1 {
			-webkit-transform: rotate(-45deg) translate(-9px, 6px);
			transform: rotate(-45deg) translate(-6px, 6px);
		}

		.change .bar2 {
			opacity: 0;
		}

		.change .bar3 {
			-webkit-transform: rotate(45deg) translate(-8px, -8px);
			transform: rotate(45deg) translate(-8px, -8px);
		}

		.newline {
			width: auto;
			display: inline-block;
		}

		.main {
			width: 100%;
			position: absolute;
			left: 0;
			top: 90px;
			background: linear-gradient(90deg, #ffffff 0%, #dddddd 100%);
			overflow-x: hidden;
		}

		.home {
			position: relative;
			float: left;
			width: 100%;
			margin: 0;
			text-align: center;
			overflow: hidden;
		}

		.about {
			position: relative;
			float: left;
			width: 100%;
			padding: 0;
			left: 0;
			height: auto;
			text-align: left;
			font-family: oswald;
			overflow: hidden;
			font-size: 2.5vw;
			text-align: center;
			background-color: white;
		}

		.scSlider {
			position: absolute;
			top: 25vw;
			left: 20%;
			width: 60%;
			height: auto;
		}


		.scValue {
			position: absolute;
			left: 48%;
			top: 28vw;
		}

		.showcase {
			width: 100%;
			position: relative;
			margin: 0;
			height: auto;
			min-height: 40vw;
			background: white;
		}

		.scPhoto {
			position: absolute;
			top: 2vw;
			left: 30%;
			width: 40vw;
			height: auto;
			background: none;
			opacity: 0;
			transition: opacity ease 1s;
		}

		.scPhotoTint {
			position: absolute;
			top: 2.5vw;
			left: 30%;
			width: 40vw;
			height: 19vw;
			background-color: rgba(0, 0, 0, 0.5);
			opacity: 0;
			transition: background-color ease 0.5s;
		}

		.forscroll {
			position: absolute;
			top: -100px;
			left: 0;
			width: 0;
			height: 0;
		}

		.logo {
			position: absolute;
			top: 20%;
			height: 60%;
			left: 3vw;
		}

		.homeproducts {
			margin: 0;
			padding: 2vw 0;
			width: 100%;
			height: auto;
			min-height: 80vh;
			background-color: #ddd;
			border-bottom: double #333 1vw;
		}

		.oneside {
			position: relative;
			float: left;
			margin: 0 5%;
			width: 40%;
			height: auto;
			background-color: rgba(24, 26, 48, 0.7);
			border-radius: 20px;
			overflow: hidden;
			text-align: center;
			cursor: pointer;
			transition: background-color ease 0.2s;
		}

		.oneside:hover {
			background-color: rgba(24, 26, 48, 0.5);
		}

		.onesideimg {
			position: absolute;
			top: 0;
			left: 0;
			height: 100%;
			mix-blend-mode: multiply;
		}

		.onesidesvg {
			position: absolute;
			top: 2vw;
			width: 25%;
			left: 37.5%;
			cursor: pointer;
		}

		.onesidetext {
			position: relative;
			font-size: 1.7vw;
			width: 80%;
			color: white;
			margin: 15vw 10% 0 10%;
		}

		.moreinfo {
			position: relative;
			margin: 3vw auto;
			width: auto;
			max-width: fit-content;
			height: auto;
			padding: 0.5vw 3vw;
			border: solid white 0.3vw;
			border-radius: 50px;
			color: white;
			font-size: 1.5vw;
			font-family: poppins;
			cursor: pointer;
			transition: ease 0.3s;
			background-color: rgba(255, 255, 255, 0.15);
		}

		.moreinfo:hover {
			color: #ae0000;
			border-color: #ae0000;
		}

		.divTitle {
			width: 100%;
			position: relative;
			margin: 0;
			height: auto;
			font-size: 2.5vw;
			color: rgba(24, 26, 48, 0.7);
		}

		.aboutCars {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: auto;
			background: #ae0000;
			color: white;
			text-align: left;
			border-bottom: double #333 1vw;
		}

		.aboutObjects {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: auto;
			background: #394664;
			color: white;
			text-align: left;
		}

		.spanTop {
			position: absolute;
			top: -90px;
		}

		.gallery {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: auto;
			background: #ddd;
			color: white;
			height: 50vw;
			text-align: center;
		}

		.pricing {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
		}

		.pricingtTitle {
			position: relative;
			float: left;
			width: 94%;
			padding: 3%;
			font-size: 2em;
			text-align: center;
		}

		.pricingCars {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: auto;
			background: #ae0000;
			color: white;
			text-align: center;
			border-bottom: double #333 1vw;

		}

		.pricingCarsTypes {
			height: max-content;
			position: relative;
			float: left;
			width: 94%;
			padding: 3%;
			font-size: 1em;
			text-transform: uppercase;
		}

		.pricingCars-table {
			position: static;
			width: auto;
			margin: auto;
			flex-wrap: wrap;
			display: flex;
			align-items: flex-end;
			justify-content: center;
			text-align: center;
		}

		.col {
			flex: 20%;
			padding: 5px;
			box-sizing: border-box;
			font-size: 1em;
			font-family: oswald;

		}

		.table {
			position: relative;
			overflow: hidden;
			bottom: 10px;

		}

		.priceDescription {
			font-size: 0.5em;
			display: block;
		}

		.price {
			font-size: 1em;
			margin-bottom: 10px;
			margin-top: 10px;
		}

		.pricingObjects {
			width: 90%;
			position: relative;
			float: left;
			margin: 0;
			padding: 0 5% 3% 5%;
			height: auto;
			background: #394664;
			color: white;
		}

		.pricingObjectsText {
			position: relative;
			font-size: 0.75em;
			text-align: left;
		}

		.pricingObjectsText ul {
			margin: 0;
			padding: 0;
			text-align: center;
			padding: 0 5%;
		}

		.pricingObjectsText ul li {
			list-style: none;
		}

		.atest {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: auto;
			background: #223142;
			color: #eee;
			text-align: center;
			font-size: 1.3vw;
		}

		.atestTitle {
			position: relative;
			float: left;
			width: 94%;
			padding: 3%;
			font-size: 2em;
			text-align: center;
		}

		.atestText {
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			width: 50%;
			padding: 0 5%;
			height: auto;
			text-align: left;
		}

		.atestPhoto {
			position: relative;
			float: right;
			width: 25%;
			height: 35%;
			padding: 0;
			margin-top: 5%;
			margin-bottom: 5%;
			margin-right: 10%;
		}

		.atestTitleImportant {
			border-top: double #333 1vw;
			position: relative;
			float: left;
			width: 94%;
			padding: 3%;
			font-size: 2em;
			background-color: #ae0000;
			color: #fff;
			text-align: center;
		}

		.atestTextImportant,
		.atestTextBalkan {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			background-color: #ae0000;
			color: #fff;
			height: auto;
			text-align: center;
		}

		.hint {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			background-color: #ae0000;
			color: #fff;
			height: auto;
			text-align: center;
			border-bottom: double #333 1vw;
		}

		.morePhotos {
			position: absolute;
			top: 47vw;
			font-size: 2vw;
			transform: translate(-50%, 0);
			background-color: #394664;
			border: solid 0.3vw white;
			padding: 0 2vw;
			border-radius: 5vw;
			cursor: pointer;
			color: white !important;
		}

		.morePhotos:hover {
			border-color: #ae0000;
			text-decoration: underline;
		}

		.aboutCarsTitle {
			position: relative;
			float: left;
			width: 94%;
			padding: 3%;
		}

		.aboutObjectsTitle {
			position: relative;
			float: left;
			width: 45%;
			padding: 3% 3% 3% 47%;
		}

		.aboutCarsText {
			position: relative;
			float: left;
			font-size: 0.5em;
			width: 45%;
			padding: 0 5%;
		}

		.aboutObjectsText {
			position: relative;
			float: right;
			font-size: 0.5em;
			width: 45%;
			padding: 0 5%;
		}

		.aboutCarsPhoto {
			position: relative;
			float: left;
			width: 38%;
			padding: 0;
			margin-top: -6%;
			margin-left: 7%;
		}

		.aboutObjectsPhoto {
			position: relative;
			float: right;
			width: 38%;
			padding: 0;
			margin-top: -7%;
			margin-right: 7%;
		}

		.kontaktiraj {
			width: fit-content;
			margin: 2vw auto;
			padding: 0 1.5vw;
			color: rgba(8, 14, 78, 0.7);
			border-radius: 50px;
			border: solid rgba(8, 14, 78, 0) 0vw;
			border-left: solid rgba(8, 14, 78, 0.7) 0.15vw;
			border-right: solid rgba(8, 14, 78, 0.7) 0.15vw;
			transition: border ease 0.3s;
			cursor: pointer;
		}

		.kontaktiraj:hover {
			border: solid rgba(8, 14, 78, 1) 0.25vw;
			color: rgba(8, 14, 78, 1);
		}

		.kontakt {
			width: 100%;
			position: relative;
			float: left;
			margin: 0;
			padding-bottom: 3%;
			height: 20vw;
			background: rgba(15, 17, 20, 0.9);
			color: white;
			text-align: left;
		}

		.col1 {
			position: relative;
			float: left;
			width: 20%;
			margin: 0 0 0 10%;
			height: 100%;
		}

		.col2 {
			position: relative;
			float: left;
			width: 40%;
			padding: 0 0 0 5%;
			margin: 0;
			height: 95%;
		}

		.col3 {
			position: relative;
			float: left;
			width: 15%;
			padding: 4% 0;
			margin: 0;
			height: 75%;
		}

		.footerlogo {
			position: relative;
			float: left;
			width: 70%;
			margin: 10% 50% 10% 0;
			opacity: 0.6;
		}

		.kontaktTitle {
			position: relative;
			float: left;
			width: 100%;
			margin: 3% 0 5% 0;
			color: rgba(255, 255, 255, 0.6);
		}


		.finalfooter {
			font-family: montserrat;
			width: 90%;
			padding: 15px 5% 5px 5%;
			position: relative;
			float: left;
			margin: 0;
			height: 35px;
			font-size: 15px;
			color: rgba(255, 255, 255, 0.6);
			background-color: #121212;
			border-top: solid 1px black;
			text-align: right;
		}

		.finalfooter span a {
			color: rgba(255, 255, 255, 0.6);
		}

		.finalfooter span a:visited {
			color: rgba(255, 255, 255, 0.6);
		}

		.links {
			font-size: 2vw;
			cursor: pointer;
			color: rgba(255, 255, 255, 0.6);
			text-decoration: none;
			transition: color ease 0.2s;
			margin-left: 0%;
		}

		.social {
			position: relative;
			height: 2.5vw;
			cursor: pointer;
			margin: 0;
			vertical-align: sub;
			fill: rgba(255, 255, 255, 0.6);
			transition: fill ease 0.2s;
		}

		.links:hover .social {
			fill: #ae0000;
		}

		.links:hover {
			color: #ae0000;
		}

		.leftPhoto {
			position: absolute;
			top: 14.5vw;
			left: 15vw;
			height: 13.5vw;
			width: 21vw;
			text-align: center;
			overflow: hidden;
			opacity: 0.3;
		}

		.mainPhoto {
			position: absolute;
			top: 8vw;
			left: 29vw;
			height: 27vw;
			width: 42vw;
			text-align: center;
			overflow: hidden;
			cursor: zoom-in;
			transition: ease 0.3s;
		}

		.mainPhoto:hover {
			top: 0;
			left: 18.5vw;
			height: 40.5vw;
			width: 63vw;
		}


		.rightPhoto {
			position: absolute;
			top: 14.5vw;
			right: 15vw;
			height: 13.5vw;
			width: 21vw;
			text-align: center;
			overflow: hidden;
			opacity: 0.3;
		}

		.leftChange {
			position: absolute;
			top: 16.25vw;
			left: 5vw;
			width: 0;
			height: 0;
			border-top: 5vw solid transparent;
			border-bottom: 5vw solid transparent;
			border-right: 5vw solid #444;
			cursor: pointer;
		}

		.leftChange:hover {
			border-top: 5vw solid transparent;
			border-bottom: 5vw solid transparent;
			border-right: 5vw solid #ae0000;
		}

		.rightChange {
			position: absolute;
			top: 16.25vw;
			right: 5vw;
			width: 0;
			height: 0;
			border-top: 5vw solid transparent;
			border-bottom: 5vw solid transparent;
			border-left: 5vw solid #444;
			cursor: pointer;
		}

		.rightChange:hover {
			border-top: 5vw solid transparent;
			border-bottom: 5vw solid transparent;
			border-left: 5vw solid #ae0000;
		}


		.photosHolder {
			position: absolute;
			top: 38vw;
			left: 5vw;
			width: 90vw;
			height: 6vw;
			display: flex;
			flex-direction: row;
			justify-content: center;
		}

		.miniphoto {
			width: 5vw;
			height: 5vw;
			margin: 0 1vw;
			border: solid 0.3vw #444;
			cursor: pointer;
			text-align: center;
			overflow: hidden;
		}

		.miniphoto:hover {
			border-color: #ae0000 !important;
		}

		.galleryPhoto {
			height: 100%;
			margin: 0 auto;
		}

		.galleryMiniPhoto {
			height: 5.6vw;
			width: 5.6vw;
			margin: 0 auto;
		}

		.changeGallery {
			position: absolute;
			top: 4vw;
			width: 20vw;
			left: 39.7vw;
			font-size: 1.5vw;
			border: solid 0.15vw #fff;
			border-radius: 4vw;
			color: #444;
			display: flex;
			justify-content: space-between;
			flex-direction: row;
		}

		.oneOption {
			margin: 0;
			padding: 0 10%;
			width: 30%;
			cursor: pointer;
		}

		.oneOption:hover {
			color: #394664;
		}

		.selectedOption {
			background-color: #394664;
			color: white;
			border-radius: 4vw;
		}

		.selectedOption:hover {
			color: white;
		}

		.footerLink:hover {
			text-decoration: underline;
		}

		.container {
			display: inline-block;
			margin: 0 1vw;
			position: relative;
			padding-top: 2vw;
			margin-bottom: 0.5vw;
			cursor: pointer;
			font-size: 2vw;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
			opacity: 0;
			transition: opacity ease 0.3s;
		}

		.container input {
			position: absolute;
			opacity: 0;
			cursor: pointer;
		}

		.checkmark {
			position: absolute;
			top: 0;
			left: 0;
			height: 2vw;
			width: 2vw;
			background-color: #eee;
			border-radius: 50%;
		}

		.container:hover input~.checkmark {
			background-color: #ccc;
		}

		.container input:checked~.checkmark {
			background-color: #ae0000;
		}

		.checkmark:after {
			content: "";
			position: absolute;
			display: none;
		}

		.container input:checked~.checkmark:after {
			display: block;
		}

		.container .checkmark:after {
			top: 0.6vw;
			left: 0.6vw;
			width: 0.8vw;
			height: 0.8vw;
			border-radius: 50%;
			background: white;
		}


		@media screen and (max-width:1250px) {
			.burger {
				display: block;
			}

			.linksHolder {
				display: none;

				padding: 3vh 0;
			}

			.headerLinks {
				width: auto;
				margin: 10px;
			}

			.changeHolder {
				display: block;
			}

			.newline {
				width: 100%;
				display: block;
			}

			.header {
				min-height: 50px;
				height: auto;
			}

			.slider {
				height: 2vh;
				border-radius: 2vh;
			}

			.slider::-webkit-slider-thumb {
				width: 2vh;
				height: 2vh;
				border-radius: 2vh;
			}

			.slider::-moz-range-thumb {
				width: 2vh;
				height: 2vh;
				border-radius: 2vh;
			}

			.displayNone {
				display: none;
			}

			.spanTop {
				top: -50px;
			}

			.main {
				top: 50px;
			}

		}

		@media screen and (max-width:650px) {
			.oneside {
				width: 90%;
				margin: 5%;
				min-height: 50vh;
			}

			.onesidetext {
				margin: 35% 10% 0 10%;
				font-size: 2em;
			}

			.moreinfo {
				font-size: 2em;
				margin: 3vh auto;
			}

			.main {
				top: 50px;
			}

			.divTitle {
				font-size: 2em;
			}

			.scPhoto {
				width: 80vw;
				left: 10vw;
			}

			.scPhotoTint {
				width: 79vw;
				height: 39vw;
				left: 10.5vw;
			}

			.scSlider {
				top: 45vw;
				width: 96%;
				left: 2%;
			}

			.showcase {
				min-height: 90vw;
			}

			.aboutCars {
				font-size: 2em;
			}

			.aboutCarsText {
				width: 90%;
			}

			.aboutCarsPhoto {
				margin: 5%;
				width: 70%;
			}

			.aboutObjects {
				font-size: 2em;
			}

			.aboutObjectsTitle {
				float: left;
				padding: 3%;
				width: 90%;
			}

			.aboutObjectsText {
				width: 90%;
				float: left;
			}

			.aboutObjectsPhoto {
				margin: 5%;
				width: 70%;
				float: left;
			}

			.kontaktiraj {
				font-size: 2em;
			}

			.finalfooter {
				font-size: 0.7em;
				height: 25px;
			}

			.kontakt {
				height: 30vw;
			}

			.kontaktTitle {
				margin-top: 2%;
				font-size: 2em;
			}

			.links {
				font-size: 1em;
			}

			.social {
				height: 2.2vh;
			}

			.footerlogo {
				width: 95%;
				margin: 12% 2.5%;
			}

			.col1 {
				width: 25%;
				margin: 0 0 0 5%;
			}

			.col2 {
				position: relative;
				float: left;
				width: 40%;
				padding: 0 0 0 5%;
				margin: 0;
				height: 95%;
			}

			.col3 {
				width: 20%;
				padding: 5% 0;
				margin: 0;
				height: 75%;
			}

			.gallery {
				height: 95vw;
			}

			.changeGallery {
				top: 8vw;
				font-size: 4vw;
				width: 50vw;
				left: 25vw;
			}

			.mainPhoto {
				top: 20vw;
				width: 75vw;
				left: 12.5vw;
				height: 48vw;
			}

			.mainPhoto:hover {
				top: 20vw;
				width: 75vw;
				left: 12.5vw;
				height: 48vw;
			}

			.leftPhoto {
				top: 36.5vw;
				height: 15vw;
				left: 10vw;
			}

			.rightPhoto {
				top: 36.5vw;
				height: 15vw;
				right: 10vw;
			}

			.leftChange {
				top: 40vw;
				left: 2vw;
			}

			.rightChange {
				top: 40vw;
				right: 2vw;
			}

			.photosHolder {
				top: 75vw
			}

			.morePhotos {
				top: 85vw;
				font-size: 4vw;
			}

			.container {
				margin: 0 3vw;
				padding-top: 6vw;
				margin-bottom: 1.5vw;
				font-size: 6vw;
			}

			.checkmark {
				height: 6vw;
				width: 6vw;
			}

			.container .checkmark:after {
				top: 1.8vw;
				left: 1.8vw;
				width: 2.4vw;
				height: 2.4vw;
			}

		}