/* 







    sysapp 0.1.2  Main CSS file (screen width resolution min. 1024)



    ----------------------------------------------------------------------



    Author       Jan Koprajda (jan.koprajda@dzonny.com)



    Last edit    07 Feb 10







*/







html {



     overflow: -moz-scrollbars-vertical;



}







/*  ----- Odkazy -----  */







a:link    { color: #006064; }



a:visited { color: #006064; }







a:hover,



a:active,



a:focus   { 



/*	background: #c00;  */



	color: #000;



	text-decoration: none;



}







/*  ----- Odstavce -----  */



p {



  line-height: 21px;



  margin-bottom: 15px;



  text-align: justify;



}



/* ----- Table -----  */







table {



	border-collapse: collapse;



}



table caption {



	font-style: italic;



	padding: 0;



	text-align: center;



}



table th,



table td {



	border: 0;



	padding: 5px 0 0 0;



}



table th {



	font-weight: bold;



	vertical-align: top;



}







/* ----- Forms -----  */







form table {



  width: 100%;



  margin-bottom: 15px;



}



form td,



form th {



	padding-top: .1em;



	padding-bottom: .1em;



}



form th {



	padding-top: .2em;



}



input,



textarea,



select {



	margin-right: 2px;



}



input,



textarea {



	font-family: Arial, Helvetica, sans-serif;



	padding: 2px 3px;



}



textarea {



	line-height: 1.3em;



	width: 280px;



}



input {



	margin-top: 2px;



	margin-bottom: 2px;



	overflow: visible;



	width: 280px;



}



input:focus,



textarea:focus {



	border-color: #777;



}



input[type="radio"],



input[type="checkbox"]{



	position: relative;



	top: 1px;



	left: -2px;



}



input.submit {



	padding: 4px 10px 3px;



	width: 100px;



}



form .required {



	color: #c33;



}











/*  ----- Clear, Hide -----  */







.hide,



.blind a,



.print {



	left: -10000px;



	overflow: hidden;



	position: absolute;



	width: 0; height: 0;



}



         .clear { clear: both; }



     span.clear { display: block; }



#ie6 span.clear,



#ie7 span.clear { display: inline; }







/* -------- image floats --------- */







img.left {



    float: left;



    margin: 5px 15px 10px 0;



}



img.right {



    float: right;



    margin: 5px 0 10px 15px;



}







/*



    PAGE LAYOUT



    ------------------------------------------------------------------------



*/







body {



  background: url(../img/bg-body.jpg) left top repeat-x #fff ;



  font-family: Arial, serif;



  font-size: 10pt;



  text-align: center;



}







div.body {



  /* background: url(../img/bg-footer.png) center bottom no-repeat; */



}







div#page {



	margin: 0 auto;



	position: relative;



	width: 980px;



	text-align: left;



	color: #333;



/*	background-color: #fff; */



}







/*  ----- Header -----  */







div#header {



   width: 100%;



/*   background: #fff; */



   height: 173px;



   text-align: center;



}







/* -- Logo -- */







div#logo {



  width: 230px;



  float: left;



  padding-right: 0px;



  margin-right: 0;



}







#logo h1,



#logo a {



	display: block;



	height: 150px;



	left: 0px;



	position: relative;



	margin-bottom: 0;



}



	



#logo h1 span,



#logo a span {



	display: block;



	position: absolute;



	left: 0px;



	top: 0;



	background: url(../img/logo.jpg) no-repeat;



	height: 174px;



	width: 330px;



}







/* -- Info -- */



div#info {



	/* background: url(../img/bg-header.png) 0 0 repeat; */



	color: #000;



	font-size: 24px;



        font-weight: bold;



	width: 400px;



	height: 130px;



 	line-height: 40px;



	overflow: hidden;



	float: right;



	margin-right: 0;



}







#info div {



  margin: 40px;



}







/*  ----- Top Navigation -----  */







div#top-navigation {



  position: absolute;



  z-index: 100;



  top: 113px;



  left: 0;



  background: /* url(../img/bg-topnav.png) left bottom repeat */;



  text-align: left;



  width: 100%;



  height: 34px;



}



#top-navigation h2 {



  display: none;



}



#top-navigation ul {



  display: block;



	position: relative;



  left: 0;



	text-align: left;



	width: 980px;



}



#top-navigation li {



	float: left;



	margin: 0;



}



#top-navigation li a, #top-navigation li span {



	color: #121212;



	display: block;



	float: left;



	font-weight: normal;



	font-size: 15px;



	height: 1%;



	line-height: 21px;



	padding: 7px 14px 6px 13px;



	margin-bottom: 0;



	text-decoration: none;



/*	text-transform: uppercase; */



    border-right: 1px solid #E3E3E3;



}



#top-navigation li a:hover,



#top-navigation li a:active,



#top-navigation li a:focus { 



/*	background: #006064;  */



	color: #999;



}







#top-navigation li.active a, #top-navigation li.active span { 



/*	background: #fff; */



	color: #000;



}



#top-navigation li.active a:hover,



#top-navigation li.active a:active,



#top-navigation li.active a:focus { 



/*	background: #006064;  */



	color: #000;



}







/*  ----- Left Blocks -----  */







div#left-blocks {



  width: 980px;



  float: left;



/*  background: #fff; */



  margin: 0px 0 0 0;



  padding-bottom: 15px;



}







/* --------- Quick Path ---- */

div#quick-path {

  position: absolute;

  z-index: 14;

  top: 153px;

  left: 205px;

  font-size: 10px;

/*  padding: 20px 20px 20px 20px; */

}







/* ----- Content -----  */







div#content {



  width: 770px;



  float: right;



  position: relative;



  height: 1%;



  padding: 0;



}



#content .content-in {



  padding: 155px 0px 0px 0px;



}



#content h1 {



	color: #fff;



	line-height: 85px;



	position: relative;



	left: -1px;



    font-size: 2.3em;



    padding: 0px 0px 0px 15px;



}



#content h2 {



	color: #fff;



        font-size: 50px;



}



#content h3 {



	color: #000;



	line-height: 85px;



	position: relative;



	left: -1px;



        font-size: 2.3em;



}



#content h2 {



  color: #000;



  font-size: 20px;



  line-height: 25px;



}



#left-blocks .home h2.title {



    color: #fff;



    line-height: 85px;



    position: relative;



    left: -1px;



    font-size: 2.3em;



    padding: 0px 0px 0px 15px;



}



#content h3 {



  color: #465361;



  font-size: 25px;



  line-height: 25px;



}



#content ul {



  font-size: 10pt;



  line-height: 21px;



  margin-bottom: 15px;



  list-style-image: none;



  list-style-position: inside;



  list-style-type: square;



}







.item {



    background: #f8f8f8;



    padding: 10px;



    margin-bottom: 10px;



}



.item img {



  float: left;



  margin: 0 15px 10px 0;



  border: 1px solid #eee;



}



.item a:hover img {



  border: 1px solid #333;



}







div.basic-info {



    background: #f8f8f8;



    padding: 10px;



}



.basic-info p.ico {



   margin: 0;



   padding: 0;



}















/******* icons *************/



#content .icons.right ul {



  float: right;



  list-style: none;



}



#content .icons.left ul {



  float: left;



  list-style: none;



}



#content .icons.right li {



  margin: 0 0 0 10px;



}



#content .icons.left li {



  margin: 0 10px 0 0;



}







/*** goods parts ***/



#content .goods-detail .description h2 {



  display: none;



}







/* ----- Left column -----  */







div#left-column {



  width: 200px;



  float: left;



}







/* ----- Column navigation -----  */







div#col-navigation {



  width: 190px;



  background: url(../img/bg-colnav.png) 0 0 repeat-x;



}



#col-navigation ul {



  list-style-type: none;



  padding: 10px 0 12px 0;



}



#col-navigation li {



  margin: 0;



}



#col-navigation li a {



  background: url(../img/nav-arrow.gif) 100% 50% no-repeat transparent;



  color: #CCC;



  display:block;



  height: 1%;



  font-size: 12pt;



  font-weight: normal;



  padding: 8px 6px;



  text-decoration:none;



  width: 190px;



}



#ie6 #col-navigation li a {



  width: 190px;



}



#col-navigation li a:hover,



#col-navigation li a:active,



#col-navigation li a:focus { 



	background: #fff;



	color: #fff;



}



#col-navigation li.active a { 



	background: #fff;



	color: #000;



}



#col-navigation li.active a:hover,



#col-navigation li.active a:active,



#col-navigation li.active a:focus { 



	background: #fff;



	color: #fff;



}







/* ----- content navigation -----  */



div#content-navigation ul {



/*    float: left; */



    width: 720px;



    list-style: none;



    margin: auto;



}



div#content-navigation li {



    float: left;



    margin-right: 5px;



}



div#content-navigation li.last {



    margin-right: 0;



}











/* ----- Block -----  */







div.block {



  background: #F8F8F8;



  width: 190px;



  padding-bottom: 2px;



  margin: 0px 0 0px 0px;



}



.block h2 {



  color: #000;



	padding: 7px;



	position: relative;



  font-size: 18px;







}



.block p {



  font-size: 0.8em;



  line-height: 18px;



  text-align: left;



	padding: 7px 5px 2px 7px;



	margin: 0;



}



#ie6 .block table {



  width: 190px;



}



.block table th {



	font-weight: normal;



	vertical-align: middle;



}



.block form table {



  margin: 5px 0 0 5px;



}



.block input {



	margin-top: 2px;



	margin-bottom: 2px;



	overflow: visible;



	width: 125px;



}



.block input.submit {



	width: 80px;



}







/* ----- navigation -------- */



.block.navigation {



}



.block.navigation ul {



  list-style-type: none;



  padding: 0px 0 0px 0;



    width: 170px;



}



.block.navigation li {



  margin: 0;



    width: 170px;



}



.block.navigation li a {



  background: /* url(../img/block-nav-menu.gif) 0 0 repeat-x*/ #F8F8F8;



  display:block;



  height: 1%;



  font-size: 10pt;



  font-weight: normal;



  padding: 8px 6px;



  text-decoration:none;



    width: 170px;



    border-top: 1px solid #fff;



    border-left: 10px solid #F8F8F8;



    border-bottom: 1px solid #fff;







}



#ie6 .block.navigation li a {



    width: 170px;



}



.block.navigation li a:hover,



.block.navigation li a:active,



.block.navigation li a:focus {



    background: #F8F8F8;



    color: #000;



    border-top: 1px solid #fff;



    border-left: 10px solid #00AB4E;



    border-bottom: 1px solid #fff;



    width: 170px;



}



.block.navigation li.active a {



    margin: 0px 0 0px 0px;



    background: none;



    color: #000;



    border-top: 1px solid #fff;



    border-left: 10px solid #00AB4E;



    border-bottom: 1px solid #fff;



    width: 170px;



}



.block.navigation li li a, .block.navigation li.active li a {



    width: 151px;



    padding-left: 25px;



    border-top: 1px solid #fff;



    border-left: 10px solid #F8F8F8;



    border-bottom: 1px solid #fff;



}



.block.navigation li li.active a {



    border-left: 10px solid #00AB4E;



}



.block.navigation li.active a:hover,



.block.navigation li.active a:active,



.block.navigation li.active a:focus {



    background: none;



    border-top: 1px solid #fff;



    border-left: 10px solid #00AB4E;



    border-bottom: 1px solid #fff;



    width: 170px;



}







/* ----- Footer -----  */



div#footer {



  width: 934px;



	font-size: 8pt;



	height: 1%;



	line-height: 13px;



	margin: 0 auto;



	padding: 0;



	text-align: right;



/*	background: #333; */



	clear: both;



}



#footer div {



  padding: 7px 0 10px 215px;



}



/* ----- Pagination -----  */

#content .pagination {

    width: 770px;

    height: 30px;

    font-size: 9pt;

    font-weight: bold;

    background: #54ABE0;

    border: 0;

    color: #fff;

    margin: 0 0 10px 0;

    padding: 0;

}



#content .pagination p {

    display: block;

    width: 590px;

    position: relative;

    float: left;

    z-index: 100;

    text-align: center;

    margin: 0;

    line-height: 2px;

    padding: 13px 0 0 0;

}



#content .pagination a {

    color: #fff;

    font-size: 11pt;

}



#content .pagination span {

    font-size: 14pt;

}



#content .pagination p.prev,

#content .pagination p.next {

    width: 90px;

}



#content .pagination p.next a,

#content .pagination p.prev a {

    text-decoration: none;

    font-size: 14pt;

}



#content .pagination p.next a:hover,

#content .pagination p.prev a:hover {

    color: #fff;

}



#content .pagination .bottom {

    height: 9px;

}







#content .filter ul {



  padding: 3px 0 11px 0;



  background: url("../img/block-bg-bottom.png") no-repeat scroll right bottom;



}



.filter h2 {



    display: none;



}



.filter ul li {



    list-style: none;



    float: left;



    margin: 0 20px 7px 0;



}



.filter ul li.order-2,



.filter ul li.order-5,



.filter ul li.order-8,



.filter ul li.order-11,



.filter ul li.order-14,



.filter ul li.order-17,



.filter ul li.order-20 {



    margin-right: 0;



}



.filter li label {



    font-size: 9pt;



}



.filter input {



    width: 224px;



    padding-top: 1px;



    padding-bottom: 1px;



    margin-top: 0;



}



.filter select {



    width: 217px;



    color: #555;



    padding: 1px;



    border: 1px solid #dedede;



}



.filter select.active {



    background: #aaa;



}



.filter select option {



    color: #000;



}



.filter input.money {



    text-align: right;



}



/*** attributtes table ***/



div#attributes {



    clear: both;



}



#content div.files {



    margin-top: 20px;



}







/* ----- patterns -----  */



div#patterns {



    clear: both;



}



div#patterns div.pattern {



    height: 68px;



}



#patterns .pattern-name {



    width: 20%;



    height: 62px;



    float:left;



    text-align: center;



    background-color: transparent;



}



#patterns .pattern-color {



    width: 80%;



    height: 62px;



    float: right;



}







div#pattern {



    height: 500px;



}