@charset "UTF-8";
@import "defaults.css";
@import "typography.css";
@import "forms.css";
@import "colorbox.css";




#kaubamarkInfo { text-align:left; border:1px solid #e8e8e8; padding:0 30px 0 30px; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
	#kaubamarkInfo img { float:left; margin:0 50px 30px 0; }
	#kaubamarkInfo p { }

/* =============================================================================
   reusable
   ========================================================================== */
.container{
	width: 960px;
	margin: 0 auto;
}
#slider-prev a, #slider-next a{display: inline-block; height: 15px; width: 15px; text-indent: -9999px; background-image: url(../failid/Project/content/slider_arrow.png); background-position: 0 0; background-repeat: no-repeat;margin-left: 5px;}
#slider-prev a:hover{background-position: 0 -15px;}
#slider-next a{background-position: 0 -30px;}
#slider-next a:hover{background-position: 0 -45px;}
.row{clear:both; overflow: hidden;}
/* =============================================================================
   layout
   ========================================================================== */
#wrap{
	min-height: 100%;
	position: relative;
}

#head{
	background: #f7f7f7;
	-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.06);
	-moz-box-shadow:    0px 1px 1px rgba(0, 0, 0, 0.06);
	box-shadow:         0px 1px 1px rgba(0, 0, 0, 0.06);
}

#main{
	margin-top: 15px;
	overflow:hidden;
	padding-bottom: 57px;
}
#sidebar{
	width: 200px;
	float:left;
	margin-bottom: 20px;
}

#footer{
	position: absolute;
	bottom: 0;
	height: 57px;
	width: 100%;
}

/* =============================================================================
   head
   ========================================================================== */
#head .container{position: relative;}
.head_bottom{
	margin-top: 10px;
	border-top: 1px solid #dfdede;
}
#head_nav ul li{
	height: 44px;
	line-height: 44px;
	float: left;
}
	#head_nav > ul > li > a{
		display: block;
		font-family: 'dosismedium';
		font-size: 15px;
	}
	#head_nav > ul > li > a:first-child span{border-left: 0;}
	#head_nav > ul > li > a span{border-left: 1px solid #dfdede; padding: 2px 21px; border-right: 1px solid #dfdede;}

	#head_nav > ul > .has_sub:hover > a span{background: url(../failid/Project/content/head_arrow.png) 92% center no-repeat;}

	#head_nav > ul > li:hover > a, #head_nav > ul > li.active > a{
		color: #009ee3;
		background: rgb(54,54,54);
		background: -moz-linear-gradient(top,  rgba(54,54,54,1) 0%, rgba(35,35,35,1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(54,54,54,1)), color-stop(100%,rgba(35,35,35,1)));
		background: -webkit-linear-gradient(top,  rgba(54,54,54,1) 0%,rgba(35,35,35,1) 100%);
		background: -o-linear-gradient(top,  rgba(54,54,54,1) 0%,rgba(35,35,35,1) 100%);
		background: -ms-linear-gradient(top,  rgba(54,54,54,1) 0%,rgba(35,35,35,1) 100%);
		background: linear-gradient(to bottom,  rgba(54,54,54,1) 0%,rgba(35,35,35,1) 100%);
	}
	#head_nav > ul > li:hover > a:first-child span, #head_nav > ul > li.active > a:first-child span{border-right: 1px solid transparent; border-left: 0;}
	#head_nav > ul > li:hover > a span, #head_nav > ul > li.active > a span{border-right: 1px solid transparent; border-left: 1px solid transparent}
	#head_nav ul li ul li{float: none; height: auto!important; line-height: 18px;}
	#head_nav > ul > li .sub_nav{
		display: none;
		border-top: 5px solid #232323;
		-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
		-moz-box-shadow:    0px 1px 2px rgba(0, 0, 0, 0.25);
		box-shadow:         0px 1px 2px rgba(0, 0, 0, 0.25);
		position: absolute;
		z-index: 9999;
		padding: 10px 0;
		margin: 0;
		list-style: none;
		left: 0;
		background: #fff;
		width: 100%;
	}
	#head_nav > ul > li:hover .sub_nav{display: block;}

	#head_nav .filters{margin: 10px 10px 20px;}
	#head_nav .filters li{float: left;}
	#head_nav .sub_nav .one_quarter.alpha{border-left: 0;}
	#head_nav .sub_nav .one_quarter{padding: 0; margin: 0; list-style: none; margin-bottom: 20px; width: 100%;}
	#head_nav .sub_nav .one_quarter li{padding: 5px 10px; width: 22%; float: left; border-left: 1px solid #e8e8e8;}
	.no_border{border: 0 !important;}
	#head_nav .sub_nav .one_quarter .active a{color:#636263}

/* =============================================================================
   Sidebar
   ========================================================================== */
#side_nav > ul > li:first-child{border-top: 1px solid #dfdede;}
#side_nav > ul > li{ border-left: 1px solid #dfdede; border-right: 1px solid #dfdede; border-bottom: 1px solid #dfdede; padding: 5px 0 5px 10px;}
#side_nav li{padding: 5px 0;}
	#side_nav ul ul{margin: 5px 0 5px 10px;}
	#side_nav .active.has_sub > a{background: url(../failid/Project/content/sub_nav_arrow_sub.png) 0 4px no-repeat;}
	#side_nav li a{display: block; background: url(../failid/Project/content/sub_nav_arrow.png) 0 4px no-repeat; padding-left: 15px;}
		#side_nav li.active > a{color: #242424;}


/* =============================================================================
   Content
   ========================================================================== */
.half:first-child{border-right: 1px solid #dfdede; margin-right: 10px; padding-right: 17px; width: 48%;}
.half{
	width: 49%;
	float: left;
	margin-bottom: 20px;
}
.content img{margin-bottom: 10px;}
#content{margin-bottom: 20px; width: 100%;}

#breadcrumbs{
	padding: 0 0 7px 0 ;
	list-style: none;
	line-height: 24px;
	font-size: 20px;
	overflow: hidden;
	border-bottom: 1px solid #dfdede;
	font-family: 'dosisregular';
}
#breadcrumbs li{float: left; color: #dfdede; padding-right: 20px;}
	#breadcrumbs .active{
		border-left: 5px solid #3ab5ed;
		font-family: 'dosismedium';
		font-size: 24px;
	}
	#breadcrumbs .active h1 a{
		font-family: 'dosismedium';
	}
	#breadcrumbs .active h1 {margin:0;}
	#breadcrumbs .active a{padding-left: 10px;}
	#breadcrumbs a{color: #363636; display: inline-block;  padding-left: 20px;}
#content.has_sidebar{
	float: right;
	width: 739px;
}
.product_list{
	list-style: none;
	padding: 0;
	margin-top: 0;
}
	.product_list li:first-child{border-top: 0; padding-top: 0; margin-top: 0;}
	.product_list li{
		overflow: hidden;
		border-top: 1px solid #dfdede;
		padding-top: 15px;
		margin-top: 15px;
	}
	.product_list .thumb_area{width: 220px; height: 154px; line-height: 154px; float: left; margin-right: 15px; overflow: hidden;}
/* =============================================================================
   Footer
   ========================================================================== */
#footer .container{position: relative; overflow: hidden; border-top: 1px solid #dfdede; padding-top: 10px; padding-bottom: 10px;}
#footer p{float: left; margin-right: 20px;}

#ama{
	display:block;
	text-indent:-3000px;
	position:absolute;
	top: 10px;
	right:0;
	background-image:url(../failid/Project/ama.png);
	width:27px;
	height:15px;
}

/* =============================================================================
   media query
   ========================================================================== */
/* #Base 960 Grid
================================================== */
.container{position:relative;width:960px;margin:0 auto;padding:0}.container .column,.container .columns{float:left;display:inline;margin-left:10px;margin-right:10px}.row{margin-bottom:20px}.container .one.column,.container .one.columns{width:40px}.container .two.columns{width:100px}.container .three.columns{width:160px}.container .four.columns{width:220px}.container .five.columns{width:280px}.container .six.columns{width:340px}.container .seven.columns{width:400px}.container .eight.columns{width:460px}.container .nine.columns{width:520px}.container .ten.columns{width:580px}.container .eleven.columns{width:640px}.container .twelve.columns{width:700px}.container .thirteen.columns{width:760px}.container .fourteen.columns{width:820px}.container .fifteen.columns{width:880px}.container .sixteen.columns{width:940px}.container .one-third.column{width:300px}.container .two-thirds.column{width:620px}.container .one.column.alpha,.container .one.column.omega{width:50px}.container .two.columns.alpha,.container .two.columns.omega{width:110px}.container .three.columns.alpha,.container .three.columns.omega{width:170px}.container .four.columns.alpha,.container .four.columns.omega{width:230px}.container .five.columns.alpha,.container .five.omega{width:290px}.container .six.columns.alpha,.container .six.columns.omega{width:350px}.container .seven.columns.alpha,.container .seven.columns.omega{width:410px}.container .eight.columns.alpha,.container .eight.columns.omega{width:470px}.container .nine.columns.alpha,.container .nine.columns.omega{width:530px}.container .ten.columns.alpha, .container .ten.columns.omega{width:590px}.container .eleven.columns.alpha,.container .eleven.columns.omega{width:650px}.container .twelve.columns.alpha,.container .twelve.columns.omega{width:710px}.container .thirteen.columns.alpha,.container .thirteen.columns.omega{width:770px}.container .fourteen.columns.alpha,.container .fourteen.omega{width:830px}.container .fifteen.columns.alpha,.container .fifteen.columns.omega{width:890px}.container .sixteen.columns.alpha,.container .sixteen.columns.omega{width:950px}.container .one-third.column.alpha,.container .one-third.column.omega{width:310px}.container .two-thirds.column.alpha,.container .two-thirds.column.omega{width:630px}.container .one.column.alpha.omega{width:60px}.container .two.columns.alpha.omega{width:120px}.container .three.columns.alpha.omega{width:180px}.container .four.columns.alpha.omega{width:240px}.container .five.columns.alpha.omega{width:300px}.container .six.columns.alpha.omega{width:360px}.container .seven.columns.alpha.omega{width:420px}.container .eight.columns.alpha.omega{width:480px}.container .nine.columns.alpha.omega{width:540px}.container .ten.columns.alpha.omega{width:600px}.container .eleven.columns.alpha.omega{width:660px}.container .twelve.columns.alpha.omega{width:720px}.container .thirteen.columns.alpha.omega{width:780px}.container .fourteen.columns.alpha.omega{width:840px}.container .fifteen.columns.alpha.omega{width:900px}.container .sixteen.columns.alpha.omega{width:960px}.container .one-third.column.alpha.omega{width:320px}.container .two-thirds.column.alpha.omega{width:640px}.show-grid{background:#fff url(../failid/Project/skeleton-grid.png) repeat-y 50% 0 !important}.show-grid .column,.show-grid .columns{background-color:rgba(0,0,0,0.3)!important}

/* #Tablet (Portrait)
   Note: Design for a width of 768px
================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
img{max-width: 100%; height: auto;}
.container{width:768px}
.half:first-child{width: 45%!important;}
.site_description{width: 60%!important;}

.form_half p{width: 100%!important;}
.form_half label, .form_half input[type=text], .form_half textarea{width: 90%!important}
.form_half textarea{margin-top: 32px;}
.product_list{margin-top: 0!important;}
#searchform{margin-bottom: 10px!important;}
#content.has_sidebar{width: 62%!important;}

}


/*  #Mobile (Portrait)
    Note: Design for a width of 320px
================================================== */
@media only screen and (max-width: 767px) {
img{max-width: 100%; height: auto;}

.container, #sidebar, #content.has_sidebar{width:300px !important}

#head_nav ul li{width: 50%;}

#head_nav > ul > li > a span{border: none!important;}

#sitelogo, #sidebar, #content.has_sidebar{float: none!important;}

#head_nav .filters{display: none!important;}

#head_nav .sub_nav .one_quarter, #head_nav ul li ul li, .product_list .thumb_area, .site_description, .half{width: 100%!important; float: none!important;}

.form input[type="text"], .form input[type="password"], .form input[type="url"], .form input[type="email"], .form textarea, .form select{width: 90%!important;}
.form textarea{margin-left: 0!important; width: 90%!important;}
.form .button{margin-left: 0!important;}
.form_half{float: none!important; width: 100%!important;}
}

/* #Mobile (Landscape)
   Note: Design for a width of 480px
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
.container, #sidebar, #content.has_sidebar{width:420px !important}
#head_nav ul li{width: 33%!important;}
#head_nav .sub_nav .one_quarter, #head_nav ul li ul li{width: 100%!important;}
}


/* =============================================================================
   print
   ========================================================================== */

@media print {
	* { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
	a, a:visited { text-decoration: underline; }
	a[href]:after { content: " (" attr(href) ")"; }
	abbr[title]:after { content: " (" attr(title) ")"; }
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group; } /* h5bp.com/t */
	tr, img { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3 { page-break-after: avoid; }
	#head, #sidebar, #footer, button,
	.error, .alert, .notice, .success, .info, .button
	{ display:none !important; }
	#wrapper, #content{ width:auto !important; float:none !important; margin:0 !important; padding:0 !important;}
}

/** UUS **/
#tiitel {background:  none !important; border:none !important; height:0  !important;}

.page_numbers ul{list-style: none; margin: 0; padding: 0 12px 0 0}
	.page_numbers li:first-child{margin-right: 10px;}
	.page_numbers li{float: left;margin-left: 5px;}
	.page_numbers a{
		display: block;
		width: 19px;
		margin-top: 8px;
		line-height: 19px;
		text-align:center;
		height: 19px;
		color: #898989;
	}
	.page_numbers li.active a, .page_numbers a:hover{
		background: #009EE3;
		color: #fff;
	}
	.page_numbers .omega{
		height: 10px;
		margin-left: 10px;
		margin-top: 12px;
		width: 7px;
		background: url(../failid/Project/content/per_page_arrow.png) center center no-repeat;
		text-indent: -9999px;
	}

.no_image_and_desc h4 {
	float:left;
}
.no_image_and_desc .buttons {
	float:right;
}

.product_nav li {
	float:left;
	width:220px;
}

#news_posts {
	list-style:none;
	padding:0;
}

.profile h3 {
	margin:0;
}


	.partner img{
		padding:0;
	}
	.partner{
		border: 1px solid #eee;
		width: 176px;
		height: 90px;
		float: left;
		margin-left: 10px;
		position: relative;
		text-align: center;
		line-height: 90px;
		margin-bottom: 10px;
		overflow: hidden;
	}

    .partner_link{
    margin-bottom:10px;
    margin-top:-10px;
}

/***
------------ HTML 5 TOOLTIP -----------------
**/

.tooltip{
    display: inline;
    position: relative;
}

	.tooltip:hover:after{
    		background: #333;
    		background: rgba(0,0,0,.8);
    		border-radius: 5px;
    		bottom: 26px;
    		color: #fff;
    		content: attr(title);
    		left: 20%;
    		padding: 5px 15px;
    		position: absolute;
    		z-index: 98;
    		width: 220px;
		}
		
	.tooltip:hover:before{
    		border: solid;
    		border-color: #333 transparent;
    		border-width: 6px 6px 0 6px;
    		bottom: 20px;
    		content: "";
    		left: 50%;
    		position: absolute;
    		z-index: 99;
		}
		
/***
------------LISATUD-----------------
**/

.img-with-text {
    text-align: center;
    width: 200px;
}

.img-with-text img {
    display: block;
    margin: 0 auto;
}

.photobanner {
    height: 77px;
    width: 6790px;
}

.firstbanner {
    -webkit-animation: bannermove 150s linear infinite;
       -moz-animation: bannermove 150s linear infinite;
         -o-animation: bannermove 150s linear infinite;
            animation: bannermove 150s linear infinite;
}
 
@keyframes bannermove {
 0% {
    margin-left: 0px;
 }
 100% {
    margin-left: -6780px;
 }
 
}
 679
@-moz-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -6780px;
 }
 
}
 
@-webkit-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -6780px;
 }
 
}
 
 
@-o-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -6780px;
 }
 
}