/***************  Icomoon  ********************/

@font-face {

    font-family: 'icomoon';

    src:    url('fonts/icomoon.eot?jfjivw');

    src:    url('fonts/icomoon.eot?jfjivw#iefix') format('embedded-opentype'),

        url('fonts/icomoon.ttf?jfjivw') format('truetype'),

        url('fonts/icomoon.woff?jfjivw') format('woff'),

        url('fonts/icomoon.svg?jfjivw#icomoon') format('svg');

    font-weight: normal;

    font-style: normal;

}



[class^="icon-"], [class*=" icon-"] {

    /* use !important to prevent issues with browser extensions that change fonts */

    font-family: 'icomoon' !important;

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;



    /* Better Font Rendering =========== */

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



.icon-youtube:before {

    content: "\e907";

}

.icon-twitter:before {

    content: "\e905";

}

.icon-facebook2:before {

    content: "\e903";

}

.icon-cross:before {

    content: "\e902";

}

.icon-menu:before {

    content: "\e901";

}



/***************  General  ********************/



*{

	font-family: 'Roboto', sans-serif;

	word-wrap: break-word;

	box-sizing: border-box;

}

body{

	background: #000;

}

body{

	margin: 0;

	padding: 0;

	-webkit-transition: -webkit-transform 0.3s;

	transition: transform 0.3s;

}

body.is-moved {

	-webkit-transform: translateX(260px);

	-ms-transform: translateX(260px);

	transform: translateX(260px);

	/*overflow: hidden;*/

}

a{

	text-decoration: none;

}

li{

	list-style: none;

}

.clear{

	clear: both;

}

.btn-red{

	border: 1px solid #EE1C24;

	color: #EE1C24;

	background: #fff;

	padding: 8px 15px;

	transition: all 0.3s;

	cursor: pointer;

	margin: 10px 0;

	outline: none;

}

.btn-red:hover{

	color: #fff;

	background: #EE1C24;

}

/*******************************************/

.wrap{

	/*position: relative;*/

	/*width: 100%;

	background: url('../img/bg_resize.jpg');

	background-repeat: no-repeat;

	background-size: cover;

	background-attachment: fixed;

	background-position: 50% 50%;*/

}

.home-wrap{

	position: relative;

	height: 100%;

	width: 100%;

}

.content{

	max-width: 920px;

	margin: 0 auto;

	padding: 10px 0;

}

.home-wrap .overlay-bg{

	background: rgba(0, 0, 0, 0.8);

}

.home-wrap .section{

	background: url('../img/welding_bg.jpg');

	background-repeat: no-repeat;

	background-size: cover;

	/*background-attachment: fixed;*/

	background-position: 50% 50%;

}

.wrap .content{

	background: #fff;

	max-width: 100%;

}

.text{

	max-width: 920px;

	margin: 0 auto;

	padding: 20px;

}

.text p{

	line-height: 25px;

}

.text h1{

	color: #009703;

}

.img-holder{

	display: inline-block;

	padding: 5px;

	background: #ddd;

	border-radius: 5px;

}

.img-holder img{

	display: block;

	max-width: 100%;

}

/***************  Menu  ********************/



.menu_close, .menu_icon{

	display: none;

}

.menu{

	text-align: center;

	background: #000;

	padding: 20px 5px;

	z-index: 20;

	border-bottom: 10px solid #EE1C24;

	display: flex;
	align-items: center;

}

.menu ul{

	margin: 0;

	padding: 0;
	flex: 1;

}

.menu li{

	display: inline-block;

	line-height: 25px;

	margin: 0 20px;

}

.menu a{

	display: block;

	color: #666;

	transition:all 0.3s;
	text-transform: uppercase;
}

.menu a:hover{

	color: #CFCFCF;

}

.menu_active a{

	color: #CFCFCF;
}



.menu_close, .menu_icon {

	text-align: right;

}

.menu_icon span{

	color: #888;

	display: inline-block;

	padding: 20px;

	cursor: pointer;

	transition: all 0.3s;

	font-size: 30px;

}

.menu_close span{

	padding: 10px;

	cursor: pointer;

	color: #888;

	font-size: 25px;

	transition: all 0.3s;

}

.menu_close span:hover{

	color: #fff;

}

.menu_icon span:hover{

	color: #fff;

}

.menu .lang a{
	display: inline-block;
	padding: 5px;
	margin: 5px;
}

/****************** Logo  ******************/

.logo{

	text-align: center;

	padding: 20px;

}

.logo img{

	/*float: left;*/

	position: relative;

	/*top: 50%;*/

	/*transform:translateY(-50%);*/

	/*margin-top: -64px;*/

}

.logo h3{

	color: #fff;

}

/***************** Content *******************/



.dobrodosli{

	padding: 20px;

	color: #fff;

}
.dobrodosli p{

	line-height: 30px;

}

.dobrodosli a{

	padding: 0 20px;

	color: #888;

	border: 1px solid #888;

	margin: 5px;

	border-radius: 10px;

	transition: all 0.3s;

}

.dobrodosli a:hover{
	color: #000;
	border: 1px solid #fff;
	background: #fff;
}

.plazma-vid h1{
	padding: 20px;
	color: #fff;
}
.plazma-vid video{
	width: 100%;
	margin-bottom: 20px;
}

/****************** O Nama *******************/

.o_nama{}

.onama-img{

	padding: 5px;

	margin: 10px;

	background: #ddd;

	border-radius: 5px;

	float: right;

}

.o_nama img{

	max-width: 100%;



}

.o_nama a{

	color: #EE1C24;

	border-bottom: 1px solid transparent;

	transition: all 0.3s;

}

.o_nama a:hover{

	color: #EE1C24;

	border-bottom: 1px solid #cc3300;

}

/****************** Reference *******************/

.gallery {

	text-align: center;

	border: 1px solid #888;

	display: none;

}

.gallery .img-holder {

	margin: 5px;

}

.gallery img{

	max-width: 100%;

	max-height: 150px;

}

/****************** Usluge *******************/

.usluge li{

	position: relative;

	line-height: 25px;

}

.usluge li:before{

	position: absolute;

	content: '';

	width: 10px;

	height: 10px;

	border-radius: 50%;

	background: #EE1C24;

	top: 8px;

	left: -18px;

}

/****************** Proizvodi *******************/

.proizvodi img{

	max-width: 100%;

	height: 75px;

	width: 100px;

}

.pagination{

	text-align: center;

}

.pagination p{

	display: inline-block;

}

.pagination .active{

	display: inline-block;

	padding: 5px 10px;

}



.pagination div{

	margin: 5px 0;

}

.pagination div:first-child a{

	display: inline-block;

	min-width: 110px;

}



.pagination div:nth-child(2) a{

	color: #EE1C24;

	text-align: center;

	padding: 5px 10px;

	transition: all 0.3s;

}

.pagination div:nth-child(2) a:hover{

	background: #EE1C24;

	color: #fff;

}

/****************** Kontakt *******************/

.kontakt p{

	line-height: 16px;

}

.kontakt p a:hover span{

	opacity: 0.7;

}

.kontakt p img{

	float: left;

}

.kontakt p span{

	display: inline-block;

	margin: 8px;

	color: #000;

	text-decoration: underline;

}

.contact-info{

	display: inline-block;

}

.mapa{

	float: right;

}

.mapa iframe{

	width: 350px;

	height: 400px;

	border: none;

}

/****************** Footer *******************/

.footer{

	padding: 30px 10px;;

	background: #141414;

}

.footer p{

	text-align: center;

	color: #888;

}

.social{

	text-align: center;

}

.social span{

	color: #888;

	font-size: 23px;

	margin: 20px;

	transition: all 0.3s;

	cursor: pointer;

	padding: 10px;

}

.social span:hover{

	color: #fff;

}

/****************** proizvodi *******************/

.proizvodi div{

	padding: 10px 0;

	border-bottom: 1px solid #009703;

}

/****************** Mobile *******************/

@media only screen and (max-width: 768px){



	.menu_close, .menu_icon{

		display: block;

	}



	.menu {

		position: fixed;
		display: block;

		top: 0;

		left: -260px;

		width: 260px;

		height: 100%;

		padding: 15px 20px;

		background: #0c0c0c;

		overflow: auto;

		text-align: center;

		border-bottom: none;

	}



	.menu a{

		display: block;

		padding: 10px 0;

	}

	.menu li{

		display: block;

	}
	.menu .lang a{

		display: block;

	}



	/****************** O Nama *******************/

	.onama-img{

		max-width: 100%;

		display: inline-block;

		float: none;



	}



	.mapa{

		float: none;

	}

	.mapa iframe{

		width: 100%;

	}



	.proizvodi div{

		text-align: center;

	}

	/*Slider dots*/

	.jssorb05{

		display: none;

	}



}/*end 768px*/





@media only screen and (max-width: 400px){

	.proizvodi div img{

		width: 48%;

	}





}/*End 400px*/