/*****************************************************************************
  DESKTOP
******************************************************************************/

@media screen and (min-width: 768px) and (max-width: 1100px) {
	#logos {
		clear:both;
		float:left;
		width:100%;		
	}
	#logo_iso9001 {
		float:left;
		position:relative;
		width:57px;
		height:65px;
		background-image:url(images/iso9001.jpg);
		background-size:57px 65px;
		background-repeat: no-repeat;
		background-position: 0px 0px;
		margin:0px 0px 20px 40px;
	}
	#logo_crocert {
		float:left;
		position:relative;
		width:73px;
		height:65px;
		background-image:url(images/crocert.jpg);
		background-size:73px 65px;
		background-repeat: no-repeat;		
		margin:0px 0px 20px 30px;
	}
    #logo_fondovi {
		float:left;
		position:relative;
		width:120px;
		height:45px;
		background-image:url(images/logo-fondovi.jpg);
		background-size:120px 45px;
		background-repeat: no-repeat;		
		margin:20px 0px 20px 30px;
	}
    #logo_eu {
		float:left;
		position:relative;
		width:67px;
		height:45px;
		background-image:url(images/logo-eu.jpg);
		background-size:67px 45px;
		background-repeat: no-repeat;		
		margin:20px 0px 20px 30px;
	}
}
@media screen and (min-width: 1101px) {
	#logo_iso9001 {
		float:left;
		position:relative;
		width:47px;
		height:55px;
		background-image:url(images/iso9001.jpg);
		background-size:100% 100%;
		margin:85px 10px 30px 80px;
	}
	#logo_crocert {
		float:left;
		position:relative;
		width:62px;
		height:55px;
		background-image:url(images/crocert.jpg);
		background-size:100% 100%;
		margin:85px 10px 30px 20px;
	}
    #logo_fondovi {
		float:left;
		position:relative;
		width:120px;
		height:45px;
		background-image:url(images/logo-fondovi.jpg);
		background-size:120px 45px;
		background-repeat: no-repeat;		
		margin:90px 10px 30px 20px;
	}
    #logo_eu {
		float:left;
		position:relative;
		width:67px;
		height:45px;
		background-image:url(images/logo-eu.jpg);
		background-size:67px 45px;
		background-repeat: no-repeat;		
		margin:90px 10px 30px 20px;
	}
}

@media screen and (min-width: 768px) {
	/*---------------------------------------------------------------
	 HEADER
	 --------------------------------------------------------------*/
	#header_container {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
	}
	#header {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
	}
	#logo {
		float:left;
		position:relative;
		background-image:url(images/logo.png);
		background-size: 290px 70px;
		background-repeat: no-repeat;
		width: 290px;
		height: 70px;
		margin:80px 0px 40px 40px;		
	}
	
	#header_right {
		position:relative;
		float:right;
		margin:0px;
		width:280px;
	}
	#languages {
		float:right;
		position:relative;
		margin:20px 40px 0px 0px;
		white-space: nowrap;
		text-align:right;
		width:50%;
		clear:both;
	}
	#languages img {
		margin-left:5px;
	}
	#header_contact {
		position:relative;
		float:right;
		margin:35px 40px 0px 0px;
	}
	#header_contact div {
		clear:both;
		margin-bottom:4px;
		float:right;
	}
	
	/*---------------------------------------------------------------
	 MENU
	 --------------------------------------------------------------*/
	#menu_container {
		position:relative;
		float:left;		
		width:100%;				
		text-align: center;
		background-color: #282d33;
		height:75px;
	}
	#menu {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
		color:#f5f5f5;
		padding:0px;
	}
	#menu ul {
		display:inline-block;
		width:92%;
		list-style-type: none;
		margin: 0px;		
		padding: 0;
		overflow: hidden;
	}
	
	.nodropdown,.dropdown {
		float: left;
	}
	
	.nodropdown a, .dropbtn {
		display: inline-block;
		color: white;
		text-align: center;
		padding: 30px 0px 22px 0px;
		text-decoration: none;
		font-size:18px;
		font-weight:bold;
		margin-right:40px;
		border-bottom:8px solid #282d33;
	}
	
	.nodropdown a:hover, .dropdown:hover .dropbtn {
		border-bottom:8px solid #fd5a0b;
	}
	
	.dropdown {
		display: inline-block;
	}
	
	.dropdown-content {
		display: none;
		position: absolute;
		background-color: #f9f9f9;
		min-width: 160px;
		box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
		border-top:1px solid #cccccc;
		overflow:hidden;
		z-index:5;
	}
	
	.dropdown-content a {
		color: #282d33;
		padding: 20px;
		text-decoration: none;
		display: block;
		text-align: left;
		width:100%;
		clear:both;
		border-top:1px solid #cccccc;
	}
	.dropdown-content a:nth-child(1) {
		border-top:none;
	}
	
	.dropdown-content a:hover {color: #fd5a0b}
	
	.dropdown:hover .dropdown-content {
		display: block;
	}
	
	/*---------------------------------------------------------------
	 MOBILE_MENU
	 --------------------------------------------------------------*/
	#menu_mobile_container {
		visibility:hidden;
		display:none;
	}
	
	/*---------------------------------------------------------------
	 SLIDER
	 --------------------------------------------------------------*/
	#slider_container {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
		background-image:url(images/slide1.jpg);
		background-size: cover;
	}
	.slider_box_button {
		position:absolute;
		bottom:20px;
		right:20px;
		border:2px solid #ffffff;
		padding:10px 20px 10px 20px;
		font-size:36px;
		color:#f5f5f5;		
	}
	.slider_box_button:hover {
		background-color:#1D1F21;
		color:#ffffff;
		cursor:pointer;
		cursor:hand;
	}
	.slider_counts {
		position:absolute;
		bottom:30px;
		right:50px;		
	}
	.slider_count {
		float:left;
		padding:5px 12px 5px 12px;
		border:2px solid #ffffff;
		background-color:#000;
		opacity:0.7;
		color:#ffffff;
		margin-left:10px;
	}
	/*---------------------------------------------------------------
	 SLIDER1
	 --------------------------------------------------------------*/
	#slider_container1 {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
		background-image:url(images/slide1.jpg);
		background-size: cover;
	}
	#slider1 {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
	}
	#slider_box1 {
		margin:30px 0px 40px 40px;
		position:relative;				
		color:#ffffff;
		text-align: left;
	}
	#slider_box_overlay1 {
		max-width:480px;
		padding:30px;
		position:relative;
		background-color:#fd5a0b;
		opacity:0.8;
	}
	#slider_box_overlay1 div {line-height: 120%}
	/*---------------------------------------------------------------
	 SLIDER2
	 --------------------------------------------------------------*/
	#slider_container2 {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
		background-image:url(images/slide2.jpg);
		background-size: cover;
	}
	#slider2 {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
	}
	#slider_box2 {
		margin:30px 0px 40px 40px;
		position:relative;				
		color:#ffffff;
		text-align: left;
	}
	#slider_box_overlay2 {
		max-width:480px;
		padding:30px;
		position:relative;
		background-color:#fd5a0b;
		opacity:0.8;
	}
	#slider_box_overlay2 div {line-height: 120%}	
	
	/*---------------------------------------------------------------
	 SLIDER3
	 --------------------------------------------------------------*/
	#slider_container3 {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
		background-image:url(images/slide3.jpg);
		background-size: cover;
	}
	#slider3 {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
	}
	#slider_box3 {
		margin:30px 0px 40px 40px;
		position:relative;				
		color:#ffffff;
		text-align: left;
	}
	#slider_box_overlay3 {
		max-width:480px;
		padding:30px;
		position:relative;
		background-color:#fd5a0b;
		opacity:0.8;
	}
	#slider_box_overlay3 div {line-height: 120%}
	
	/*---------------------------------------------------------------
	 LAND BOXES
	 --------------------------------------------------------------*/
	#landboxes_container {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
	}
	#landboxes {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
		padding:2% 0% 0px 0%;
	}
	.landbox {
		position:relative;
		display:inline-block;
		max-width:44%;
		height:260px;
		margin:2%;
		overflow:hidden;
	}
	.landbox_overlay {
		position:absolute;
		width:100%;
		height:100%;
		background-image:url(images/land_box_over.png);
		background-size: 100% 100%;
		background-position:0px 0px;
	}
	
	/*---------------------------------------------------------------
	 LAND TEXTBOXES
	 --------------------------------------------------------------*/
	#landtextboxes_container {
		position:relative;
		float:left;		
		width:100%;		
		background-color:#ffffff;
		text-align: center;
	}
	#landtextboxes {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
		padding:0;
	}
	.landtextbox {
		position:relative;
		display:inline-block;
		max-width:44%;		
		margin:2%;
		overflow:hidden;
		text-align: left;
		vertical-align: top;
	}
	
	.productlisting .column {
		width:33%;
		float:left;
		text-align: left;
	}
	
	/*---------------------------------------------------------------
	FOOTER
	--------------------------------------------------------------*/
	#footer_container {
		position:relative;
		float:left;
		width: 100%;
		text-align: center;
		background-color:#282d33;
	}
	#footer {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
		text-align: center;
		color:#ffffff;
		margin:10px 0px 10px 0px;
	}
	.footerbox {
		position:relative;
		display:inline-block;			
		margin:2%;
		overflow:hidden;
		text-align: left;
		vertical-align: top;
	}
	.footerbox_left {width:34%}
	.footerbox_right {width:54%}
	.footerbox .title {
		line-height:150%;
		margin-bottom:10px;
	}
	.footerbox .text {
		line-height:200%;
		font-size:14px;
	}
	.gmaps {
		width:100%;
		height:260px;
	}
	
	
	/*---------------------------------------------------------------
	CONTENT
	--------------------------------------------------------------*/
	.content_container {
		position:relative;
		float:left;
		width: 100%;
		text-align: center;
		background-color:#ffffff;
		color:#282d33;
	}
	
	.content {
		position:relative;
		display:inline-block;		
		width:100%;
		height:auto;
		max-width:1180px;
		text-align: center;
		margin:10px 0px 10px 0px;		
	}
	
	/*---------------------------------------------------------------
	O NAMA
	--------------------------------------------------------------*/
	.column3 {
		position:relative;
		float:left;
		width:29%;		
		max-width:30%;		
		margin-left:2%;			
		text-align:left;
		vertical-align: top;
		line-height: 150%;
	}
	.column3:nth-child(1) {margin-left:40px;}
	.column3 h1 {margin-bottom:30px;line-height:100%;}
	.column3 h2 {margin-bottom:20px;line-height:100%;}	
	
	.povijest_line {
		position:relative;
		width:100%;
		clear:both;		
	}
	.povijest_line .year {
		position:absolute;
		top:0px;
		left:0px;
		width:48px;
		height:12px;
	}
	.povijest_line .text {
		position:relative;
		width:auto;
		float:left;
		padding-left:60px;
		margin-bottom:30px;		
	}
	
	.black_container .column3 div {margin-bottom:20px;}
	
	.button_o_nama {
		float:left;
		position:absolute;
		bottom:0px;
		left:0px;
		background-color:#282d33;
		padding:15px 20px;
		font-size:14px;
		color:#f5f5f5;		
	}
	.button_o_nama:hover {
		background-color:#fd5a0b;		
		cursor:pointer; 
		cursor:hand;
	}
	
	/*---------------------------------------------------------------
	TVRTKA
	--------------------------------------------------------------*/
	#tvrtka_container {
		display:inline-block;
		width:92%;
	}
	.tvrtka_left {
		text-align: left;
		width:60%;
		float:left;
		line-height: 150%;
	}
	.tvrtka_left div {
		line-height: 150%;
	}
	.tvrtka_left h1 {
		margin-bottom:40px;
	}
	.tvrtka_right {
		text-align: left;
		width:30%;
		margin-left:4%;
		float:left;
		line-height: 130%;
		padding-top:90px;
	}
	
	/*---------------------------------------------------------------
	SUSTAV VRIJEDNOSTI
	--------------------------------------------------------------*/
	#sustav_container {
		display:inline-block;
		width:92%;
		text-align: left;
	}
	.sustav_col {
		text-align: left;
		width:48%;
		float:left;
		line-height: 150%;
		margin-right:2%;
	}
	.sustav_col div {
		line-height: 150%;
	}
	.sustav_col h1 {
		margin-bottom:30px;
	}
	.sustav_nagovor {
		line-height: 150%;
		margin:30px 0px 20px 0px;
	}
	
	/*---------------------------------------------------------------
	PARTNERI
	--------------------------------------------------------------*/
	#partneri_container {
		display:inline-block;
		width:92%;
	}
	.partneri_left {
		text-align: left;
		width:70%;
		float:left;
		line-height: 150%;
	}
	.partneri_left div {
		line-height: 150%;
	}
	.partneri_left h1 {
		margin-bottom:40px;
	}
	.partneri_right {
		text-align: left;
		width:22%;
		margin-left:4%;
		float:right;
		line-height: 130%;
		padding-top:90px;
	}
	.partneri_right img {margin-bottom:30px;}
	.partneri_div {
		text-align: left;
		width:100%;
		float:left;
		line-height: 150%;
	}
	.partneri_div img {
		width:32%;
	}
	
	/*---------------------------------------------------------------
	NOVOSTI
	--------------------------------------------------------------*/
	#news_container {
		display:inline-block;
		width:92%;
		text-align: left;
	}
	#news_container h1 {
		margin:20px 0px 10px 0px;
		line-height:100%;
	}
	.news_column3 {
		position:relative;
		float:left;
		width:31%;		
		max-width:31%;		
		margin-right:2%;			
		text-align:left;
		vertical-align: top;
		line-height: 150%;
	}
	.news_column3 img {margin-bottom:10px}
	.news_column3 h1 {margin-bottom:10px;line-height:100%;}
	#news_container div {text-align: left;line-height: 150%;}
	.news_column3 h2 {margin-bottom:20px;line-height:100%;}	
	.news_date {
		position:absolute;
		left:0px;
		top:0px;
		background-color:#1b2026;
		color:#f5f5f5;
		padding:10px;
		font-weight: bold;
		font-size:22px;
	}
	.novosti_left {
		text-align: left;
		width:62%;
		float:left;
		line-height: 150%;
	}
	.novosti_left div {
		line-height: 150%;
	}
	.novosti_right {
		text-align: right;
		width:31%;
		margin-left:4%;
		float:left;
	}
	.novosti_right img {margin-bottom:30px;}
	.button_novosti {
		float:left;
		position:relative;
		margin-top:20px;
		background-color:#282d33;
		padding:15px 20px;
		font-size:14px;
		color:#f5f5f5;		
	}
	.button_novosti:hover {
		background-color:#fd5a0b;		
		cursor:pointer; 
		cursor:hand;
	}
	
	/*---------------------------------------------------------------
	KONTAKT
	--------------------------------------------------------------*/
	#kontakt_container {
		display:inline-block;
		width:92%;
		text-align: left;
	}
	#kontakt_container a {color:#333;}
	#kontakt_container td {text-align: left}
	#kontakt_container td:nth-child(3) {text-align: right}
	#kontakt_container input {
		width:100%;
		padding:10px 10px;		
	}
	#kontakt_container textarea {
		width:100%;		
		height:100px;
		padding:10px 10px;
	}
	#kontakt_container form {padding:0px;}
	.kontakt_submit {
		position:relative;
		margin-top:20px;
		float:left;
		background-color:#282d33;
		padding:10px 20px 10px 20px;
		color:#f5f5f5;		
	}
	.kontakt_submit:hover {
		background-color:#fd5a0b;
		color:#ffffff;
		cursor:pointer;
		cursor:hand;
	}
	#formb {
		display:none;
		visibility:hidden;
	}
	
	
	/*---------------------------------------------------------------
	PROIZVODI
	--------------------------------------------------------------*/
	.product_item {
		position:relative;
		width:20%;
		margin-right:4%;
		margin-bottom:40px;
		display:inline-block;
		vertical-align: top;
		text-align: center;
		padding-bottom:30px;
		border-bottom:1px solid #cccccc;
	}
	#product_page_listings {
		position:relative;
		float:left;
		width:250px;
	}
	#product_page_listings_mobile_container {
		visibility:hidden;
		display:none;
	}
	#product_page {
		position:relative;
		text-align:left;
		width:auto;
		margin-left:280px;
		line-height:130%;
	}
	
	#product_page_listings table {width:250px;border-collapse: collapse;border: 1px solid #cccccc;}
	#product_page_listings th {background-color:#fd5a0b;color:#ffffff;padding:14px 20px;font-size:20px;text-align: left;font-weight:bold;}
	#product_page_listings td {background-color:#dedede;color:#1b2026;padding:14px 20px;font-size:18px;text-align: left; font-weight:bold;border-bottom:1px solid #cccccc;line-height: 130%;}
	#product_page_listings td a {text-decoration: none;color:#1b2026;}
	#product_page_listings td a:hover {color:#fd5a0b;cursor:pointer;cursor:hand}
	

	.prototip_aktuatori {
		width:100%;
		float:left;
		margin:30px 0px 30px 0px;
	}
	.prototip_images {
		text-align: left;
		width:100%;
		float:left;
	}
}