/*
*
* Name of Site
* Copyright 2013, name of company
* company link
*
*/

/* =============================================================================
    1. TYPOGRAPHY
============================================================================= */

/*    font-family: "Barmeno Regular";
    src: url(font/barmeno_regular.ttf) format("truetype");
}
*/
body{
    /*background: #EDEFF1;*/
    background: url(../img/bg.png) repeat;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 20px;
    color: #888;
}

h1{
    font-size: 22px;
    color: #0f0f0f;
}

h2{
    color: #3c3d43;
 
}

h3{
    color: #00b0b5;

}

h4{
    font-size: 21px;
    color: #00b0b5;
    padding-bottom: 25px;
}

h5{
    color: #444;
}

h6{
    color: #444;
}

p{
    font-size: 15px;
    line-height: 18px;
    color: #998675;
    line-height: 21px;
}
a{
    color: #777;
    text-decoration: none;
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    -ms-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12{
	margin-bottom: 0;
}

/* ============================================================================ 
    2. ELEMENTS
============================================================================ */

::-moz-selection {
 color: #fff;
 text-shadow: none;
 background: #35a7f7;
}
::selection {
    color: #fff;
    text-shadow: none;
     background: #35a7f7;
}
.left {
    float: left;
}
.right {
    float: right;
    margin-top: 20px;
}
.section > .row .grid_12{
    margin-bottom: 0;
}
/* ============================================================================ 
    3. HEADER
============================================================================ */
form.newsletter{
	float: right;
    display: block;
    position: relative;
    margin-top: 10px;
    width: 300px;
}
header form.newsletter input[type=email] {
    font-size: 15px;
    padding: 0 5px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    box-sizing: border-box;
    height: 24px;
    border: 1px solid #d3d3d3;
    font-style: italic;
    width: 70%;
    display: block;
    float: left;
}
.nwsubmit{
    background: #d3d3d3 url(../img/email.png) no-repeat 2px 1px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 0;
    padding: 4px 10px 4px 25px;
    cursor: pointer;
    margin: 0;
    font-weight: bold;
    width: 30%;

}
header .flog{
    float: right;
    clear: both;
    display: block;
    padding-top: 10px;	
}
.sertifikat-block img{
    margin: 5px auto;
    display: block;
}
header .flog a.bam{
    background: url(../img/bam.png) no-repeat;
    width: 32px;
    height: 32px;
    display: block;
    float: left;
    margin-right: 10px;
}
header .flog a.ser{
	background: url(../img/ser.png) no-repeat;
	width: 32px;
	height: 32px;
	display: block;
	float: left;
	margin-right: 10px;
}
.categoty img{
    width: 100%;
    height: 155px;
}
header .flog a.eng{
	background: url(../img/eng.png) no-repeat;
	width: 32px;
	height: 32px;
	display: block;
	float: left;
}
/* 3.1 Menu
============================================================================ */
.menu-top{
	/*border-bottom: 2px solid #e57e2f;*/
	background: #db3131;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
ul.menu, ul.menu-1{
    float: left;

}
ul.menu li, ul.menu-1 li{
    float: left;
}
ul.menu li a{
    color: #fff;
    font-size: 16px; 
    text-transform: uppercase;
    padding: 10px 15px;
    display: block;
    font-weight: 700;
    font-style: italic;
}
ul.menu li a.novosti{
    background: url(../img/novosti.png) no-repeat 0px 7px;
    margin-left: 10px;
}
ul.menu-1 li a{
     padding: 10px 15px;
     display: block;
       color: #fff;
    font-size: 16px; 
}
ul.menu li a:hover{
	color: #444;
}
ul.menu li a.active{
    color: #444;
}
.menu-2{
    display: none;
    background: #f1f1f7;
    float: right;
    color: #000;
    border-radius: 5px;
    margin: 10px;
    padding: 5px 10px;
}
.menu-2{
    display: none;
}
.menu-1{
    display: none;
}

/* ============================================================================ 
    4. SLIDER
============================================================================ */
#slideshow {
    position:relative;
    height:350px;
}
#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
    width: 100%;
	height: 350px;
}
#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}
#slideshow IMG.last-active {
    z-index:9;
}

/* ============================================================================ 
    5. CONTENT
============================================================================ */
.row.home .grid_6 {
	width: 50%;
	margin-left: 0;
}
.white{
	background: #fff;
	padding-bottom: 30px;
}
.content-home-left h3, .content-home-right h3, .new-product a{
	background: #db3131;
	padding: 10px;
	color: #fff;
	width: 100%;
	box-sizing: border-box;
	text-transform: uppercase;
    font-weight: bold;
    font-style: italic;
}
.new-product a{
    font-size: 20px;
    line-height: 25px;
}
.content-home-right h3, .content-home-left h3{
    font-size: 20px;
}
.content-home-left p{
	padding: 10px;
}
.new-product{
	float: left;
	padding: 15px 10px;
	width: 49%;
	padding-right: 17px;
}
.content-home-right .new-product h3, .new-product a{
	background: none;
	color: #db3131;
	padding: 0;
}
.content-home-right img{
	float: left;
    padding-top: 0;
    width: 230px;
    margin-bottom: 15px;

}
.home-text{
	padding-top: 45px;
}

/* ============================================================================ 
    6. SERTIFIKAT
============================================================================ */
.content-sertifikat-left, .content-sertifikat-right{
	padding: 15px;
}
.content-sertifikat-left h3{
	font-size: 24px;
    padding: 20px 0;
    font-weight: 700;
}
.content-sertifikat-left p{
	padding-bottom: 20px;
}
.content-sertifikat-right img{
	border: 1px solid #d3d3d3;
	padding-left: 35px;
}
ul.lista-deklaracija{
    padding: 15px;
    width: 50%;
}
ul.lista-deklaracija li{

    padding: 5px 0;
    list-style: none;
}
ul.lista-deklaracija li:first-child{
    font-weight: bold;
}

ul.lista-deklaracija li a{
    background: url(../img/lupa.jpg) no-repeat;
    font-size: 18px;
    font-weight: 700;
    padding-left: 45px;
    height: 30px;
    display: block;
}
ul.lista-deklaracija li a:hover{
    color: #000;
}
.lista-deklaracija h2{
    text-transform: uppercase;
    font-size: 20px;
    color: #000;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 2px solid #ddd;
}

/* ============================================================================ 
    7. REFERENCE
============================================================================ */

.content-reference-left{
	padding: 20px;
}
.content-reference-right{
	padding: 20px;
    float: left;
    margin-top: 30px;
}
.content-reference-left h3{
    font-size: 20px;
    padding: 10px 0;
    margin-bottom: 20px;
    font-weight: 700;
    border-bottom: 2px solid;
}
.reference{
    float: left;
    position: relative;
    margin: 0 20px 20px 10px;
}
.reference img{
    float: left;
}
.reference h3{
    position: absolute;
    bottom: 0;
    padding: 5px 10px;
    color: #fff;
    background: #000;
    opacity: 0.8;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    font-family: 'Open Sans', sans-serif;
}
/* ============================================================================ 
    3. PROIZVODI
============================================================================ */
.categoty{
    padding: 32px;
}
.categoty a{
    display: block;
    position: relative;
}
.categoty a h3{
    background: #000;
    opacity: 0.7;
    color: #fff;
    position: absolute;
    width: 100%;
    bottom: 0;
    text-align: center;
    padding: 5px;
    box-sizing: border-box;
    font-style: italic;
    font-weight: 700;
}
.categoty:hover h3{
    background: #db3131;
    font-weight: 700;
    opacity: 1;
    webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s
}
/* proizvodi
============================================================================ */

ul.list-category{
    margin-top:20px;
    margin-left: 15px;
}
ul.list-category li{
    
    width: 100%;
    margin-bottom: 1px;
    background: #d3d3d3;
}
ul.list-category li a{
    color: #000;
    width: 100%;
    display: block;
    padding: 6px 10px;
    box-sizing: border-box;
}
ul.list-category li a:hover{
    color: #fff;
    background: #db3131;
}
ul.list-category li a.active{
    color: #fff;
    background: #db3131;
    font-weight: 700;  
}
.product-category{
    padding-top: 15px;
    border-bottom: 1px solid #d3d3d3;
    margin-right: 20px;
    padding-bottom: 16px;
}
.product-category h3{
    font-size: 23px;
    text-align: left;
    padding: 20px 0;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 28px;
}
.product-category p{
    padding-bottom: 10px;
    font-size: 16px;
    line-height: 15px;
}
.product-category img{
    float: right;
}
.text-block p{
    color: #000;
    line-height: 25px;
}
.text-block ul{
    padding-left: 50px;
    margin-top: -10px;
    margin-bottom: 20px;
}
.text-block ul li{
    list-style: initial;
    color: #000;
}
.small-block{
        float: right;
    width: 32.7%;

}
.small-block img{
    margin-bottom: 5px;
}
.small-block .small img{
    width: 100px;
    float: none;
    height: 60px;
}
.block-proizvodi{
    overflow: hidden;
    margin-bottom: 25px;
}
table
{
    border-collapse:collapse;
}
table, td, th
{

    text-align: center;
}
tbody{
    border-bottom: 1px solid #444;
}
td{
    padding: 2px 14px;
    font-size: 14px;
    color: #444;
}
th{
    border: 1px solid #fff;
    padding: 5px 10px;
    background: #444;
    color: #fff;
    font-size: 14px;
    vertical-align: middle;
    display: table-cell;
}
tr.color{
    background: #d3d3d3;
}
.image{
    width: 300px;   
    height:200px;
    background: #d3d3d3;
}
.listing-proizvoda{
    margin: 20px 0;
    border-top: 1px solid #d3d3d3;
    padding-top: 25px;
}
table.big{
    width: 65%;
}
table.table-full{
    width: 100%;
    margin-bottom: 30px
}
ul.page-site{
    float: right;
    margin-right: 20px;
    width: 25%;
    margin-top: 10px;
}
ul.page-site li{
    float: left;
    border: 1px solid #d3d3d3;
}
ul.page-site li:first-child{
    border: none;
    line-height: 33px;
    margin-right: 10px;
    color: #c62406;
}
ul.page-site li a{
    font-size: 20px;
    padding: 5px 10px;
    display: block;
    float: left;
    background: #d9d9d9;
}
ul.page-site li a:hover{
   color:  #c62406;
}
.active-page{
    color:  #c62406;
}
.fancybox-title {
    visibility: hidden;
    font-size: 20px;
    position: relative;
    text-shadow: none;
    z-index: 8050;
}
.product-category h2{
    color: #333;
    font-size: 20px;
    padding-bottom: 25px;
}
/* ============================================================================ 
    6. KATALOG
============================================================================ */
.katalog{
    padding: 20px;
}
.katalog h3{
    font-size: 23px;
    margin-bottom: 30px;
    padding-bottom: 10px;
    border-bottom: 2px solid;
    font-weight: 700;
}
.katalog {
    margin-right: auto;
    margin-left: auto;
    background-color: #fff;
    margin: 30px 0px;
}
.katalog img {
   margin: 0 auto;
   display: block;
}

.katalog-1 a{
   display: block;
}
.katalog-1, .katalog-2{
    float: left;
    width: 50%;
    padding-top: 15px;
}
.katalog-1 a, .katalog-2 a {
    display: block;
    text-align: center;
    margin-top: 20px;
    color: #444;
}
.katalog p{
    font-size: 15px;
    color: #444;
    line-height: 24px
}
/* ============================================================================ 
    7. ABOUT
============================================================================ */
.about{
    padding-top: 30px;
}
.about-left h4{
    font-size: 21px;
    color: #00b0b5;
    padding-bottom: 15px;
}
.about-left h3{
    padding-top: 45px;
    font-size: 30px;
    color: #00b0b5;
    padding-bottom: 15px;
}
.about-left p{
    padding-top: 15px;
    font-size: 15px;
    color: #998675;
}

ul.blog-left-menu{
    float: left;
    width: 100%;

}
ul.about-left-menu li{
    padding: 10px 0 10px 30px;
    border-bottom: 1px dotted #c7b299;
}
ul.about-left-menu li a:hover .arrow{
    display: block;
}
ul.about-left-menu li a{
    color: #00b0b5;
    font-size: 21px;
}
ul.about-left-menu li:hover, ul.about-left-menu li.active{
     background: url(../img/arrow-blue.png) no-repeat 0px 5px;
}
.about-right{
    float: left;
}
.about-right h4{
    font-size: 21px;
    color: #00b0b5;
    padding-bottom: 15px;
    padding-top: 20px;
    float: left;
}
.about-right p{
    font-size: 15px;
    color: #998675;
    clear: both;
}
.about-right img{
    float: left;
    width: 49%;
    margin-right: 5px;
    padding-bottom: 20px;
}
.about-right .text{
    font-size: 19px;
    padding-top: 30px;
}
.text-ormari{
    padding-top: 20px;
}
.text-ormari >p:nth-child(1){
    font-weight: 700;
}
/* ============================================================================ 
    8. CONTACT-US
============================================================================ */
.map{
    padding: 5px;
    border: 1px solid #d3d3d3;
}
.title{
    margin-top: 20px;
    margin-bottom: 20px;
}
.title p{
    padding-left: 10px;
}

.contact-right{
    padding: 0 0 0 1px;
    float: left;
}
.contact-right h3{
   background: #998675;
    font-size: 21px;
    color: #fff;
    padding: 5px 10px;
    letter-spacing: 10px;
    width: 86%;
    margin-bottom: 10px;
}
#twitter{
   background: #00afb4;
    width: 75%;
    float: right;
    box-sizing: border-box;
    margin-top: 1px;
}
#twitter img{
    float: left;
    border-right: 1px dashed #fff;
    padding: 20px 10PX 20PX 20PX;
    margin-right: 10PX;
}
#twitter p{
    padding-top: 15px;
    color: #fff;
}
.button-contact-left{
    margin-top: 40px;
}
a.button-contact{
    background: #db3131;
    padding: 5px 10px;
    display: block;
    border-radius: 3px;
    margin: 5px 15px;
    color: #fff;
    width: 50%;
    text-align: center;
}
/* 8.1 CONTACT-US-FORM
============================================================================ */

.contact-right form{
    float: left;
    width: 90%;
}
.contact-right span{
    font-size: 12px;
    color: #998675;
    clear: both;
    display: block;
    padding-left: 10px;
}
#field{
    width: 100%;
}
input[type=text]{
    height: 36px;
    border: 0;
    font-size: 20px;
    padding: 0 5px;
    width: 100%;
    float: left;
    box-sizing: border-box;
    border: 1px solid #d3d3d3;
}
label{
    float: left;
    width: 48%;
    margin-right: 4%;
    padding-bottom: 10px;
}
.row .grid_6 .contact-right > form label:first-child{
    width: 100%;
}
.row .grid_6 .contact-right > form label:nth-child(3){
    margin-right: 0;
}
.row .grid_6 .contact-right > form label:nth-child(5){
    width: 100%;
}
.row .grid_6 .contact-right > form label:nth-child(7){
    width: 25%;
    float: left;
}
.row .grid_6 .contact-right > form label:nth-child(8){
    width: 36%;
    float: left;
    padding-top: 20px;
}

.row .grid_6 .contact-right > form label:nth-child(4){
    width: 100%;
}
textarea{
    height: 100px;
    width: 100%;
    border: 0;
}
#textarea{
    width: 100%;
    background: #fff;
}
div#textarea textarea { 
    width:100%; 
    background-color:transparent; 
    background-image:none; 
    -webkit-appearance: none; 
    border:none; 
    box-shadow:none; 
    padding:0.3em 0.5em;
    box-sizing: border-box;
    border: 1px solid #d3d3d3;
}
form img{
    float: left;
    padding-top: 20px;
    padding-right: 10px;
}
#captcha{
    width: 100%
}
.submit{
    background: #998675;
    border: 0;
    height: 36px;
    display: block;
    float: right;
    border-radius: 5px;
    color: #fff;
    font-size: 20px;
    padding: 7px 15px;
    cursor: pointer;
}
.contact-right a{
    font-size: 11px;
    float: right;
}
.contact-left h4{
    line-height: 23px;
}
.contact-forma-title{
    margin: 10px 15px;
}
.contact-forma-title h3{
    text-transform: uppercase;
    padding-bottom: 5px;
}
/* ============================================================================ 
    8. GALERY
============================================================================ */

.galeri-block{
    height:960px;
    width: 100%[]
}
.galeri-block p{
    padding-top: 200px;
    font: 16px;
    text-transform: uppercase;
    text-align: center;
}
/* ============================================================================ 
    3. NOVOSTI
============================================================================ */
.novosti-text{
    padding: 20px 10px;
}
.novosti-text h2{
    font-size: 28px;
    padding-bottom: 20px;
    font-weight: 700;
}
ul.lista-novosti{
    margin-top: 20px;
    margin-left: 15px;
}
ul.lista-novosti a{
    background: #ddd;
    display: block;
    padding: 10px 15px;
}
.novosti-text span{
    padding: 15px 0;
    display: block;
    font-weight: bold;
}
.novosti-text table tr td, .novosti-text table tr th{
    border: 1px solid #000;
    vertical-align: middle;
}
.novosti-text table tr td{
    font-size: 13px;
    padding: 5px;
    color: #000;
}
.novosti-text table tr th{
    font-weight: bold;
    background: #797257;
}
.novosti-text table tr > td:last-child{
    text-align: left;
}
/* ============================================================================ 
    . FOOTER
============================================================================ */
footer .row{
	background: #3f3f3f;
    padding-bottom: 10px;
}
footer .title{
    padding: 10px;
}
footer .title h3{
	float: left;
	font-size: 24px;
	color: #fff;
    padding-left: 5px;
}
footer .left{
	padding: 0 10px;
}
footer .left p, footer .right p{
	padding: 0 10px 10px 10px;
	color: #fff;
}
 footer .middle p{
	color: #fff;
}
footer .right p{
	margin-top: 65px;
}
footer .title .border{
	border-top: 1px solid #e57e2f;
    margin-left: 13%;
    margin-top: 18px;
}
footer .title p{
	clear: both;
	display: block;
	color: #fff;
}
footer .number{
	padding-left: 19%;
	margin: 10px 0;
}
footer .fax{
	padding-left: 31px;
}


/*** Boca style ***/
.formResponse {
    float: left;
}

.formResponse.error {
    padding: 15px;
    border: 1px solid #ebccd1;
    border-radius: 4px;
    color: #a94442;
    background-color: #f2dede;
}

.formResponse.success {
    padding: 15px;
    border: 1px solid #d6e9c6;
    border-radius: 4px;
    color: #3c763d;
    background-color: #dff0d8;
}