/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-bottom: 40px;
  color: #424242;
  font-family: Arial, 'Droid Sans', sans-serif;
  background: url("../images/bg.jpg") repeat-x #FFF;
  height: 100%;
  width: 100%;
  font-size: 13px;
  }



/* BASIC ELEMENTS
-------------------------------------------------- */

.logo{
	margin-left: 20px;
	margin-top: 20px;
	}
	

h1,h2,h3,h4,h5,h6 {
	font-family: Arial, 'Droid Sans', sans-serif;
	text-transform:uppercase;
	color: #444;
	}

h1{
	font-weight: normal;
	font-size: 20px;
	}	

h2{
	font-weight: normal;
	font-size: 18px;
	}	

h3 {
	font-weight: normal;
	font-size: 15px;
	margin-bottom: 0;	
	}		


h4, h5{
	font-weight: normal;
	font-size: 14px;	
	}		


p{
	font-size: 13px;
	}

a {
	color: #E49900;
	}	
		
.error{
	color: red;
	}	
		
/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */

.nav{
	font-family: Arial, 'Droid Sans', sans-serif;
	text-transform: uppercase;
	background-color: #000000;
	}

.navbar{
	margin-top: 10px;
	height: 36px;
	background: url("../images/navBg.png") !important;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	z-index: 200;
	margin-bottom: 0;
	}    

.navbar .btn-navbar{
	font-size: 12px;
	padding: 3px 10px !important;
	}	    	

.navbar .btn-navbar:hover, .navbar .btn-navbar:focus, .navbar .btn-navbar:active{
	color: #e8b11d;
	}
		
/* Navbar links: increase padding for taller navbar */
.navbar .nav > li{
  padding: 4px 2px;
}

.navbar .nav > li > a {
  padding: 4px 20px;
  text-shadow: none;
  color: #fff;
  border-right: 1px solid #484848;
}

.navbar .nav > li > a:hover {
  color: #e8b11d;
}

.navbar .nav > li > a:active {
  color: #fff;
}


/* Navbar links: increase padding for taller navbar */
.navbar .nav > li.active > a {
  color: #e8b11d;
  text-shadow: none !important; /*replacing bootstrap */
  background: none !important; /*replacing bootstrap */
}

.navbar .nav > li > a:focus {
  color: #FFFFFF !important;
}


/* Offset the responsive button for proper vertical alignment */
.navbar .btn-navbar {
  float: left;
  margin-bottom: 8px;
  color: black;
}

/* Sidebar nav */

.sidebar{
	padding-left: 2%;
	/*max-width: 322px;*/
	}

.sidebar h3{
	font-weight: bold;
	}
	
.nav-list li {
    border-bottom: 4px solid white;
	}

	
.nav-list li a {
    background-color: #ccc;	
    text-transform: none;
    color: #000;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
	}

.nav li > a:hover, .nav li > a:focus {
	background-color: #e8b11d;
}	


.nav-list li ul li a {
	background-color: #FFF !important;
	color: #e8b11d !important;
	}

.nav-list li ul li a:active {
	background-color: #e8b11d !important;
	}

.navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle {
    background-color: #000000;
    color: #FFFFFF;
}
		
		
/* OTHER CUSTOMAZION
-------------------------------------------------- */
.tooltip-inner {
	font-size: 1.2em;
	}	

.header{
	
	}

.languages{
	padding-top: 10px;
	padding-right: 30px;
	}	
	
.language{
	padding: 10px;
	}	
	
.facebookIcon{
	margin-left: 10px;
	}

.shoppingCart{
	margin-top: 10px;
	padding: 0px 0px 0px 30px;
	border-left: 1px solid #CECECE;
	}
	
.shoppingCart p{
	font-size: 0.9em;
	}	
	
.shoppingCart p a{
	font-weight: bold;
	color: #00004E;
	}
	
.mainArea{
	/*background: url("../images/shadow.jpg") repeat-x #FFF;*/
	padding-top: 0;
	}	
		
.mainContent{
	/*background: url("../images/contentBg.png") repeat;*/
	background-color: #000;
	}

.pageContent{
	padding-top: 10px;
	padding-bottom: 20px;
	padding-right: 2%;
	}

.pageMainImage{
	float: right;
	margin-right: 1em;
	margin-bottom: 1em;
}

.cartProduct{
	font-weight: bold;
	}

     body {
        padding-bottom: 40px;
      }
    
    .products_left {
        float:left;
        width: 78%;
        }
        
    .products_right {
	    width: 100%;
	    height: 500px;
	    overflow: auto;
	    margin-bottom: 20px;
        }
        
     @media (max-width: 980px) {
        /* Enable use of floated navbar text */
        .navbar-text.pull-right {
          float: none;
          padding-left: 5px;
          padding-right: 5px;
        }
      }
    
    .pr_navi {
		list-style-type:none;
		margin:0;
		padding:0;
    }
    
    .pr_navi li
	{
		display:inline;
		margin-right: 10px;
		padding: 5px;
	}
	
	.pr_navi li.selected
	{
		background-color: #ccc;
	}
    
    .prolist {
		list-style-type: none;
		text-transform:uppercase;
		margin-left: 0px;
    }
    
    .prolist li {
		background-color: #ccc;
		margin-top: 2px;
    }
    
     .prolist li:hover {
		background-color: #e2e1e1;
    }
    
    .prolist a {
		font-size: 13px;
		color: #444;
		text-decoration: none;
		margin-left: 2px;
		padding: 5px 10px 5px 30px;
		display: block;
		font-weight: bold;
    }
    
    .prolist2 {
		list-style-type:none;
		margin:0;
		padding:0;
		list-style-type: none;
		text-transform:uppercase;
		margin-left: 0px;
		display: block;
    }
    
    .prolist2 li {
	   border: 1px solid #E8B11D;
	   background-color: #FFF;
		margin-top: 2px;
		display:block;
		float:left;
		margin-right: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
    }
    
     .prolist2 li:hover {
		background-color: #F2D480;
    }
    
   .prolist2 a {
		font-size: 12px;
		color: #444;
		text-decoration: none;
		margin-left: 2px;
		padding: 5px 10px;
		font-weight: bold;
		display: block;
    }    
       
   .prolist2 li.active{
	   background-color: #E8E8E8;
	   border: 1px solid #AAAAAA;
    }
        
    .prolist3 {
		list-style-type:none;
		margin:0;
		padding:0;
		list-style-type: none;
		text-transform:uppercase;
		margin-left: 0px;
		display: block;
    }
    
    .prolist3 li {
	   border: 1px solid #E8B11D;
	   background-color: #FFF;
		margin-top: 2px;
		display:block;
		float:left;
		margin-right: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
    }
    
     .prolist3 li:hover {
		background-color: #F2D480;
    }
    
   .prolist3 a {
		font-size: 12px;
		color: #444;
		padding: 5px 10px;
		text-decoration: none;
		margin-right: 2px;
		font-weight: bold;
		display: block;
    }  

   .prolist3 li.active{
		background-color: #F2D480;
    }  
    
    .news {
		padding: 10px;
		border: 1px solid #ccc;
		width: 500px;
    }    
      
    .button {
		display: inline-block;
		outline: none;
		cursor: pointer;
		text-align: center;
		text-decoration: none;
		font: 14px/100% Arial, Helvetica, sans-serif;
		font-weight: bold;
		padding: .5em 2em .55em;
		text-shadow: 0 1px 1px rgba(0,0,0,.3);
		-webkit-border-radius: .5em; 
		-moz-border-radius: .5em;
		border-radius: .5em;
		-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
		-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
		box-shadow: 0 1px 2px rgba(0,0,0,.2);
	}
	
	.button:hover {
		text-decoration: none;
	}
	
	.button:active {
		position: relative;
		top: 1px;
	}
	
	.orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
	}
	
	.orange:hover {
		background: #f47c20;
		background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
		background: -moz-linear-gradient(top,  #f88e11,  #f06015);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
	}
	
	.orange:active {
		color: #fcd3a5;
		background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
		background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
	}
	
	.cartColor {
		color: #B7B7B7;
	}
	
	.cartButton {
		padding: 5px;
		font-weight: bold;
		}

	.ostoskori td{
		padding: 5px;
		}
		
footer{
	border-top: 1px solid #E7E7E7;
	padding: 10px 10px 0px 20px;	
	margin-top: 15px;
	}	
	
footer p{
	text-transform: uppercase;
	font-size: 0.9em;
	color: #828282;
	margin: 0;
	}	
	
/* Kuvagalleria */
ul.kuvagallerialist{
    list-style-type: none;
    height: 50px;
    margin-left: 0px !important;
    }

ul.kuvagallerialist li{
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px solid #D1D1D1;
    }

ul.kuvagallerialist li.active{
    background-color: #d3e8f5;
    }

ul.kuvagallerialist li a{
    padding: 10px;
    display: block;
    width: 100%
    height: 100%;
    }

ul.kuvagalleria {
    list-style-type: none;
    }

ul.kuvagalleria li{
    float: left;
    margin: 0px 10px 10px 0px;
    }


.btn-success {
    background-color: #5BB75B;
    background-image: linear-gradient(to bottom, #2D9767, #267E56);
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}    
    
.frontLift{
	background-color: #EDEDED;
	padding: 1% 2%;
	margin-bottom: 10px;
	min-height: 180px !important;
	}

.frontLift h2{
	font-size: 14px;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	}
	
.frontLift p{
	font-size: 11px;
	color: #424242;
	}
		
	
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 60px;
  margin-top: 20px;
  max-width: 1800px;
  margin:auto;
}

.carousel .container {
  position: relative;
  z-index: 9;
}

.carousel-control {
  height: 80px;
  margin-top: 0;
  font-size: 120px;
  text-shadow: 0 1px 1px rgba(0,0,0,.4);
  background-color: transparent;
  border: 0;
  z-index: 10;
}

.carousel .item {
  height: 600px;
}
.carousel img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
/*  height: 600px; */
}

.carousel-caption {
  background-color: transparent;
  position: static;
  max-width: 550px;
  padding: 0 20px;
  margin-top: 200px;
}
.carousel-caption h1,
.carousel-caption .lead {
  margin: 0;
  line-height: 1.25;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0,0,0,.4);
}
.carousel-caption .btn {
  margin-top: 10px;
}

/* NIVO SLIDER
-------------------------------------------------- */

.nivoSlider {
    height: auto !important;
    max-width: 100%;
    margin-bottom: 20px;
}

.nivo-caption {
	background: #FFF !important;
	color: black !important;
}

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .span4 {
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .span4 p {
  margin-left: 10px;
  margin-right: 10px;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 80px 0; /* Space out the Bootstrap <hr> more */
}
.featurette {
  padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */
  overflow: hidden; /* Vertically center images part 2: clear their floats. */
}
.featurette-image {
  margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
}

/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left {
  margin-right: 40px;
}
.featurette-image.pull-right {
  margin-left: 40px;
}

/* Thin out the marketing headings */
.featurette-heading {
  font-size: 50px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}



/* RESPONSIVE CSS
-------------------------------------------------- */

@media (max-width: 979px) {

  .container.navbar-wrapper {
    margin-bottom: 0;
    width: auto;
  }
  .navbar-inner {
    border-radius: 0;
    margin: -20px 0;
  }

  .carousel .item {
    height: 500px;
  }
  .carousel img {
    width: auto;
    height: 500px;
  }

  .featurette {
    height: auto;
    padding: 0;
  }
  .featurette-image.pull-left,
  .featurette-image.pull-right {
    display: block;
    float: none;
    max-width: 40%;
    margin: 0 auto 20px;
  }
}


@media (max-width: 767px) {

  .navbar-inner {
    margin: -20px;
  }

  .carousel {
    margin-left: -20px;
    margin-right: -20px;
  }
  .carousel .container {

  }
  .carousel .item {
    height: 300px;
  }
  .carousel img {
    height: 300px;
  }
  .carousel-caption {
    width: 65%;
    padding: 0 70px;
    margin-top: 100px;
  }
  .carousel-caption h1 {
    font-size: 30px;
  }
  .carousel-caption .lead,
  .carousel-caption .btn {
    font-size: 18px;
  }

  .marketing .span4 + .span4 {
    margin-top: 40px;
  }

  .featurette-heading {
    font-size: 30px;
  }
  .featurette .lead {
    font-size: 18px;
    line-height: 1.5;
  }

}