@font-face{
  font-family: montserrat;
  src: url(fonts/montserrat/Montserrat-Regular.otf);
}
@font-face{
	font-family: montserratLight;
	src: url(fonts/montserrat/Montserrat-Light.otf);
}
@font-face{
	font-family: montserratThin;
	src: url(fonts/montserrat/Montserrat-Thin.otf);
}
body{
	font-family: montserrat;
}
.image {
	width: 100%;
}
.padding-null {
	padding: 0;
}
.blue {
	color: #002a4b;
}
.blue-bgr {
	background-color: #002a4b;
}
.white {
	color: white;
}
h3 {
	margin-top: 1rem;
	margin-bottom: 1.5rem;
}
.row {
	margin: 0;
}
.orange {
	color: #f15a22;
}
.blue {
	color: #002a4b;
}
.flex {
	display: flex;
}
.space {
	padding-right: 5px;
}
.black {
	color: black;
}
/*********************************
HEADER
**********************************/
header .headerLogo img{
	width: 300px;
}
header .headerLogo{
	text-align: center;
}
header .headerMail{
	text-align: left;
	font-size: 14px;
	padding-top: 25px;
}
header .headerPhone{
	text-align: right;
	font-size: 14px;
	padding-top: 25px;
}
header .headerMail span{
	color: #002a4b;
}
header .headerMail span:hover{
	color: #f15a22;
}
header .headerMail .fa{
	color: #f15a22;
}
header .headerMail a:hover{
	text-decoration: none;
}
.headerSocial{
	text-align: right;
    font-size: 25px;
    padding-top: 25px;
    color: #002a4b;
}
.headerSocial .fa{
	cursor: pointer;
}
.headerSocial .fa-facebook-official:hover{
	color: #3b5999;
}
.headerSocial .fa-youtube-square:hover{
	color: #cd201f;
}
.headerSocial .fa-linkedin-square:hover{
	color: #0077B5;
}
	
/*********************************
NAVIGATION
**********************************/
.blackBgr{
	background: #f15a22;
	color: #fff;
	padding: 0;
}
.logo{
	line-height: 2.7;
}
.navigator{
	padding: 0;
}
.navOnSmall{
	display: none;
}
.hamburgerIcon{
	padding-top: 10px;
	float: right;
}
.hamburgerIcon div{
	width: 20px;
	border-bottom: 3px solid #fff;
	margin-bottom: 4px;
	cursor: pointer;
}
.mainNav ul li{
	list-style-type: none;
	cursor: pointer;
	padding-top: 15px;
}
.mainNav ul li a{
	color: #fff;
}
.mainNav ul li a:hover{
	color: #002a4b;
}
.mainNav ul li a:hover{
	text-decoration: none;
}
.mainUl{
	padding: 0;
	text-align: center;
}
.mainUl li{
	display: inline-block;
	text-align: center;
	padding: 0 10px;
}
/*************
	SLIDER
**************/
.carouselText{
	position: absolute;
	top: 65%;
    width: 100%;
}
.carousel-caption{
	color: white;
	text-align: left;
	margin: 0;
	left: 10px;
	bottom: 40px;
}
.carousel-caption h1{
    font-size: 48px;
	margin-bottom: 5px;
	line-height: 0.8;
}
.carousel-caption p{
	font-weight: 500;
}
.slide{
	position: relative;
}
.carousel-control-prev-icon, .carousel-control-next-icon{
	background: none;
	width: 100px;
	height: 100px;
}
.absoluteContainer{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 900;
}
.carousel-control-prev-icon, .carousel-control-next-icon {
	font-size: 40px;
}
.carousel-control-prev-icon i{
	width: 7%;
   	position: absolute;
    left: 15%;
}
.carousel-control-next-icon i{
	width: 7%;
   	position: absolute;
    right: 15%;
}
/******************
		INDEX
*******************/
.index-heading {
	margin-top: 15px;
	margin-bottom: 15px;
}
.index-informations div {
	display: flex;
}
.index-informations div p:first-child {
	width: 27%;	
}
.index-informations div p:nth-child(2) {
	width: 73%;	
}
#map{
	width: 100%;
	height: 400px;
}
.index-compresors-bgr {
	padding: 50px;
}
.index-compresors-content {
	padding-bottom: 20px;
}
.index-compresors-content div p {
	margin-bottom: 0;
}
.index-compresors-second-content div p {
	margin-bottom: 0;
}
.index-tehno-bgr {
	padding-top: 30px;
	padding-bottom: 30px;
}
.index-contact-bgr {
	padding-top: 50px;
	padding-bottom: 50px;
}
.index-informations-bgr {
	margin-bottom: 20px;
}
/*********************************
ABOUT US
**********************************/
.aboutUSBgr{
	background: url("images/o-nama-glavna.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	padding: 200px 0;
}
.aboutUs .row{
	display: block;
}
.aboutUs .container{
	padding-top: 50px;
	padding-bottom: 50px;
}
.aboutUs h1, 
.aboutUs p,
.aboutUs ul li{
	color: #002a4b;
}
/*********************************
PRODAJA KOMPRESORA
**********************************/
.sellBgr{
	background: url("images/slide-3.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	padding: 200px 0;
}
/*********************************
SERVIS KOMPRESORA
**********************************/
.serviceBgr{
	background: url("images/slide-2.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	padding: 200px 0;
}
/*********************************
REZERVNI DELOVI ZA KOMPRESORE
**********************************/
.reserveBgr{
	background: url("images/slide-1.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	padding: 200px 0;
}
/******************
FOOTER
********************/
footer{
	background: #002a4b;
	padding: 50px 0;
}
footer h2{
	color: #fff;
	margin: 0;
} 
footer p,
footer a{
	font-family: montserratLight;
	color: #fff;
}
footer a:hover{
	text-decoration: none;
	font-weight: 900;
	color: #fff;
}
footer img{
	width: 100px;
	background: #fff;
	border-radius: 5px;
	margin: 10px 0;
}
footer ul{
	padding-left: 0;
}
footer ul li{
	list-style-type: none;
	/*border-bottom: 1px solid rgba(0, 0, 0, 0.1);*/
}
footer form{
	text-align: right;
}
footer #mail, 
footer #phone{
	color: #fff;
	font-size: 14px;
	background: #002a4b;
	width: 100%;
    border: none;
    border-bottom: 1px solid  rgba(255, 255, 255, 0.5);
    margin: 10px 0;
}
footer #mail:focus, 
footer #phone:focus{
	outline: none;
}
::-webkit-input-placeholder{
	font-size: 14px;
	color: rgba(255, 255, 255, 0.5);
}
.footerSocial{
	text-align: right;
	margin: 10px 0;
}
.footerSocial i{
	color: #fff;
	font-size: 40px;
	margin-left: 20px;
	cursor: pointer;
}
.footerSocial .fa-facebook-official:hover{
	color: #3b5999;
}
.footerSocial .fa-youtube-square:hover{
	color: #cd201f;
}
.footerSocial .fa-linkedin-square:hover{
	color: #0077B5;
}
#send{
	color: #fff;
	background: transparent;
	border: 1px solid  rgba(255, 255, 255, 0.5);
	padding: 20px 50px;
	cursor: pointer;
	outline: none;
}
#send:hover{
	background: #f15a22;
	color: #002a4b;
	border: 1px solid #f15a22;
}
.footerContact, 
.footerInfo,
.footerForm{
	padding: 0;
}
/*-----------------------------------------kontakt.html-------------------------------------*/
#map{
	width: 100%;
	height: 400px;
}
.contact{
	padding: 50px 0;
}
.contact .row:first-child{
	display: block;
}
.contact h2, 
.contact h1 {
	color: #002a4b;
}
.contactOffice a, 
.contactServices a{
	color: #002a4b;
}
.contactOffice a:hover, 
.contactServices a:hover{
	text-decoration: none;
	font-weight: 900;
}
.contactForm h2{
	text-align: center;
}
.contactForm {
	display: block;
}
.contactForm form input{
	width: 100%;
	border: 1px solid rgba(0,0,0,0.5);
	border-radius: 5px;
	margin: 5px 0;
	padding: 10px 5px;
	outline: none;
}
.contactForm form input:focus{
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}
.contactForm form textarea:focus{
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}
.contactForm form textarea{
	width: 100%;
	border: 1px solid rgba(0,0,0,0.5);
	border-radius: 5px;
	outline: none;
}
#sendContact{
	background: #002a4b;
	color: #fff;
	border: none;
	cursor: pointer;
}
#sendContact:hover{
	background: #f15a22;
}
/******************
MEDIA
********************/
@media (max-width: 1200px){
	.mainNav ul li a{
		font-size: 15px;
	}
	.carouselText{
		top: 70%;
	}
}
@media (max-width: 992px) { 
	header .headerLogo img {
    	width: 250px;
	}
	.mainNav{
		display: none;
	}
	.navOnSmall{
		display: block;
	}
	/*small-menu*/
	.onSmallMainUl{
		display: none;
		padding-top: 10px;
	}
	.onSmallMainUl li{
		list-style-type: none;
	}
	.onSmallMainUl li a{
		text-decoration: none;
		color: #fff;
	}
	.row.contactForm, 
	.margin-0{
		margin: 0;
	}
	.contactForm, 
	.contact h1{
		padding: 0 15px;
	}
}
@media only screen and (max-width: 991px){
	.carouselText{
		top: 73%;
	}
}
@media (max-width: 767px) { 
	header .headerMail, 
	header .headerSocial{
		text-align: center;
		line-height: 3;
		padding: 0;
	}
	section .aboutUSBgr{
		padding: 100px 0;
	}
	.carousel-control-prev-icon i, .carousel-control-next-icon i {
		top: 35%;
	}
	.carousel-caption h1{
		font-size: 25px;
	}
	.carousel-caption p{
		font-size: 18px;
	}
	.carouselText{
		top: 75%;
	}
	footer form{
		text-align: left;
	}
	.footerSocial{
		text-align: left;
	}
	.footerSocial i{
		margin-left: 0;
		margin-right: 20px;
	}
 }
@media (max-width: 576px) {
	.aboutUs .container{
		padding-left: 30px;
		padding-right: 30px;
	}
	.carouselText{
		top: 87%;
	}
}
@media (max-width: 575px) {
	.carousel-caption {
	    left: 20px;
	}
}
@media (max-width: 475px) {
	.carousel-caption {
	    bottom: 20px;
	}
}
@media only screen and (max-width: 425px){
	.carouselText{
		top: 100%;
	}
	.carousel-caption p{
		text-shadow: 0 0 black;
	}
	.carousel-caption{
	    bottom: 28px;
	}
	.carousel-indicators li {
	    width: 15px;
	}
	.carousel-control-next-icon i {
	    right: 30%;
	}
	.carousel-caption h1 {
	    font-size: 22px;
	}
	.carousel-caption p {
	    font-size: 16px;
	}
}

@media only screen and (max-width: 375px){
	.carouselText{
		top: 110%;
	}
}
@media only screen and (max-width: 320px){
	h1{
		font-size: 35px;
	}
	.carouselText{
		top: 120%;
	}
}
