/************************************
    *                                   *
    *             karex.sk              *
    *    CSS by: fatchilli.com, mB      *
    *                                   *
    *         All web content           *
    *                                   *
    *  Last update: 27.02.2008, 19:48   *
    *                                   *
    ************************************/

	* {margin:0; font-family: sans-serif;}
	html {height: 100%;}
	body {height: 100%; background: #c5c5c5 url(../images_/body_background.jpg) repeat-x;}
	fieldset, a img {border: none; padding: 0;}
	hr {border: none; height: 1px; color: #989898; background-color: #989898;}
	p {margin-bottom: 1em;}
	a {color: #e7060a;}
	a:hover {color: #000;}

	.d-n {display: none;}
	.clear {clear: both;}
	.f-l {float: left;}
	.f-r {float: right;}
	.t-c {text-align: center;}
	.t-r {text-align: right;}
	.p {font-size: 0.75em; text-align: justify; line-height: 1.4em;}
	.p a {color: #e7060a; padding: 0.06em 0.23em;}
	.p a:hover {color: #FFF; background-color: #e7060a; text-decoration: none;}
	
	/* --- | LAYOUT | --- */
	#holder {position: relative; min-height: 100%; _height: 100%;}
	.page {margin: 0 auto; padding: 0 0.63em; width: 59.38em;}
	#page {position: relative; padding-bottom: 3em; min-height: 300px; background: url(../images_/page_background.jpg) center top no-repeat;}
	#head {position: relative; margin-bottom: 21px; height: 10.06em; z-index: 5;}
	#logo {position: absolute; top: 1.1em; left: 1em;}
	/* --- search --- */
	#search-form {position: absolute; right: 7em; top: 0.5em; z-index: 2; width: 13em; height: 3.38em;}
	#search-form fieldset {padding: 0; border: none;}
	#search-form label {display: none;}
	#search {position: absolute; bottom: 0; left: 0; padding: 0.56em 0.44em; border: none; width: 13em; font-size: 0.69em; color: #4c4c4c; background: url(../images_/field_background.png) no-repeat; _background-attachment: fixed;/*IE*/}
	#search-form legend span {position: absolute; left: 1em; z-index: 1; padding: 0.5em 1em 1em 1em; background: url(../images_/legend_background.png) no-repeat; text-align: center; font-size: 0.69em; color: #FFF;}
	*html #search-form span {background: url(../images_/legend_background.gif) no-repeat;}
	#words-col {float: left; color: #000;}
	#ajax-inteli-search-button {display:none;}
	#ajax-inteli-search-output {display: none; position: absolute; left: 0; top: 52px; z-index: 1000; background-color: #FFF; border: #C4C4C4 solid 1px; border-top: 0px; text-align:left; font-size: 12px; width: 12.5em;}
	#ajax-inteli-search-output p {padding: 2px 0; line-height: 120%; margin: 0;  margin-bottom: 1px; width: 100%; cursor: pointer; font-size: 11px;}
	#ajax-inteli-search-output p em {float: right; margin-right: 5px; color: #008000; font-style: normal;}
	#ajax-inteli-search-output p span {padding-left: 10px; background: none;}
	#ajax-inteli-search-output p.active:active {color: #FF0000;}
	#ajax-inteli-search-output p.active { background-color: #E60004; color: #FFF;}
	#ajax-inteli-search-output p.active em {color: #FFF;}
	#ajax-inteli-search-output p.similar {border-top: 1px dotted #999; font-size: 10px; color: #999; margin-top: 3px; cursor: default; padding-left: 10px; width: auto;}
	/* --- navigation --- */
	#nav {position: absolute; bottom: 0.05em; left: 0; padding: 0; width: 100%; list-style: none; text-align: right;}
	#nav li {float: left; margin-right: 0.5em;}
	#nav a {position: relative; display: block; float: left; padding: 0 1em 0 2em; border-bottom: 5px solid #dadada; height: 5.9em; color: #000; font-size: 0.63em; line-height: 120%; text-transform: uppercase; text-decoration: none; background-repeat: no-repeat; background-position: top right;}
	#nav a:hover,
	#nav a.active {border-bottom-color: #e7060a; color: #e7060a;}
	#nav b {position: absolute; bottom: 1em; right: 1em; font-size: 1.1em; cursor: pointer;}
	.n0 {width: 4.2em; background-image: url(../images_/nav_01.png);}
	.n1 {width: 8.3em; background-image: url(../images_/nav_02.png);}
	.n2 {width: 9.2em; background-image: url(../images_/nav_03.png);}
	.n3 {width: 7em; background-image: url(../images_/nav_04.png);}
	.n4 {width: 4.6em; background-image: url(../images_/nav_05.png);}
	.n5 {width: 4.6em; background-image: url(../images_/nav_06.png);}
	.n6 {width: 5.2em; background-image: url(../images_/nav_07.png);}
	.n7 {width: 5.2em; background-image: url(../images_/nav_08.png);}
	#sitemap {position: absolute !important; top: -7.5em; right: 2.5em; padding: 0 17px 0 0 !important; border: none !important; height: auto !important; background: url(../images_/ico_sitemap.png) right center no-repeat !important; text-transform: none !important; font-size: 0.69em !important; color: #8f8f8f !important;}
	#sitemap:hover {text-decoration: underline;}
	/* --- footer --- */
	#foot {position: absolute; bottom: 0; width: 100%; height: 2.75em; background: #FFF url(../images_/foot_background.jpg) top repeat-x;}
	#foot small {padding-top: 1.3em; font-size: 0.75em;}
	#foot a {color: #e60004;}
	#fatchilli {color: #000 !important; text-decoration: none;}
	#fatchilli:hover {text-decoration: underline;}
	#fatchilli span {color: #e60004;}
	#fatchilli i {font-style: normal; color: #c5c5c5;}
	
	/* --- | TEMPLATES | --- */
	#content {padding-bottom: 3.5em; min-height: 570px;}
	/* projects/photos listing */
	#content .t-c {clear: both; font-size: 0.69em;}
	#content .t-c strong {text-transform: uppercase;}
	#content .t-c a,
	#content .t-c b {margin-left: 0.75em;}
	#content .t-c a {color: #e7060a;}
	#content .t-c a:hover {color: #000;}	

	/* --- | Homepage |--- */
	.win h2 {margin-bottom: 13px;}
	.win h2,
	.win h2 span,
	.win h2,
	.win h2 span {position: relative; display: block; width: 414px; height: 44px; overflow: hidden; background: url(../images_/h2_prave_realizujeme_sk.jpg) top right no-repeat;}
	.win h2 span,
	.win h2 span {position: absolute; top: 0; right: 0; z-index: 1;}
	/* layout */
	.win .project {float: left; margin: 0 2.34em 4em 0; overflow: hidden;}
	.win .project.last {margin: 0 !important;}
	.win .project,
	.win .project h3,
	.win .project a,
	.win .project span {position: relative; display: block; width: 402px; height: 379px; overflow: hidden; cursor: pointer;}
	.win .project h3,
	.win .project img,
	.win .project span,
	.win .project a,
	.win .project b {position: absolute; top: 0; left: 0;}
	.win .project h3 {z-index: 1;}
	.win .project a {background-position: -500em top; background-repeat: no-repeat;}
	.win .project a:hover {background-position: left top;}
	.win .project span {background: url(../images_/window2_project.png) no-repeat; _background: none;/*IE*/}
	.win .project strong {position: absolute; top: 51.5%; right: 10px; z-index: 2; display: block; width: 100%; font-size: 1.32em; text-align: right; letter-spacing: -1px; line-height: 80%;}
	.win .project small {display: block; font-size: 0.5em; font-weight: normal; letter-spacing: 0px; text-transform: none;}
	.win .project h3 a {color: #FFF; text-decoration: none;}
	.win .project b {position: absolute; top: 48%; z-index: 2; font-size: 11px; font-weight: normal; text-decoration: underline; background: url(../images_/detail_projektu.png) left -60px no-repeat; padding: 3.2em 0.69em 0.9em 0.69em;}
	*html .win .project b {background: url(../images_/detail_projektu.gif) left -60px no-repeat;/*IE*/}
	.win .project a:hover b {background-position: left top;}
	*html .project a:hover {color: #FFF;}
	/* 2 projects */
	.x2 {height: 37em; padding: 0 3.3em; background: url(../images_/content_2window.jpg) top center no-repeat;}
	/* 3 projects */
	.x3 {height: 37em; padding: 0 3em 0 3.3em; _width: 53.16em; background: url(../images_/content_3window.jpg) top center no-repeat;/*IE*/}
	.x3 .project {margin: 0 2.34em 4em 0;}
	.x3 h2,
	.x3 h2 span {width: 258px !important;}
	.x3 .project,
	.x3 .project h3,
	.x3 .project a,
	.x3 .project span {position: relative; display: block; width: 258px; height: 379px; cursor: pointer;}
	.x3 .project strong {font-size: 0.75em !important;}
	/* arrows */
	.arrow,
	.arrow b {position: absolute; top: 54.36%; display: block; width: 26px; height: 61px;}
	.arrow b {top: 0; left: 0; cursor: pointer;}
	.arrow.left b {background: url(../images_/arrow_left.png) no-repeat;}
	.arrow.right b {background: url(../images_/arrow_right.png) no-repeat;}
	*html .arrow.left b {background: url(../images_/arrow_left.gif) no-repeat;/*IE*/}
	*html .arrow.right b {background: url(../images_/arrow_right.gif) no-repeat;/*IE*/}
	.arrow.left {left: 25px;}
	.arrow.right {right: 20px;}
	.arrow strong {margin-left: 3px;}
	.x3 .arrow {top: 48%;}
	
	/* --- | Detail | --- */
	body.detail {background: #FFF url(../images_/body_background_detail.jpg) repeat-x;}
	.detail #holder {background: url(../images_/holder_background_detail.jpg) center 480px no-repeat;}
	.detail #content {min-height: 37em; width: 100%; background: url(../images_/content_detail.jpg) -1px top no-repeat; _height: 37em; /*IE*/}
	.detail h2 {margin-bottom: 1.15em; padding: 0.75em 15em 0 0; font-size: 1.13em; text-align: right; letter-spacing: -1px;}
	/* -- Cols -- */
	.detail .pic {position: relative; float: left; background-position: left bottom; background-repeat: no-repeat; overflow: hidden;}
	.c0,
	.c2 {padding-top: 50px; width: 214px; height: 276px;}
	.c2 {position: relative; right: -1px;}
	/* Center photo */
	.c1,
	.c1 .bkg {width: 493px; height: 379px;}
	.c1 .bkg_arrow  {width: 493px; height: 379px;}
	.c1 {margin: 0 0.91em 3em 0.9em; =margin-bottom: 1.5em;/*IE*/}
	.bkg {position: absolute; top: 0; left: 0; background: url(../images_/detail_project.png) no-repeat; _background: none;/*IE*/}
	.bkg_arrow {position: absolute; top: 0; left: 0; background: url(../images_/detail_project_arrow.png) no-repeat; _background: none;/*IE*/}
	.c1 a {position: absolute; right: 0.75em; top: 47%; display: block; padding-left: 30px; background: url(../images_/out.png) left 5px no-repeat; color: #FFF; font-size: 0.75em; text-align: right; text-decoration: none;}
	.c1 a strong {font-size: 2.5em; letter-spacing: -1px;}
	.c1 a:hover strong {text-decoration: underline;	}
	/* arrows */
	.pic .arrow.left {left: auto; right: -2px !important;}
	.pic .arrow.right {left: -2px;}
	/* divider */
	.detail hr {margin: 1.8em 0;}
	/* Content columns */
	.detail .col-2 {float: left; width: 45.19em;}
	.spe.col-2 {width: 40em !important;}
	.detail .col-1,
	.col-1.special {float: right; width: 13.44em !important; padding-bottom: 53px; background: url(../images_/col-1_background.jpg) left bottom no-repeat; min-height: 0 !important; _height: 0 !important;}
	.detail .col-1 .border,
	.col-1.special .border {padding: 0.63em 1em; border: 8px solid #e2e2e2; background-color: #f5f5f5;}
	.detail .col-1 ul,
	.col-1.special ul {padding: 0; border-top: 1px solid #989898; list-style: none;}
	.detail .col-1 li,
	.col-1.special li {padding: 0.5em 0 0.5em 1em; border-bottom: 1px solid #989898;}
	.detail .col-1 a,
	.col-1.special a {color: #e60004; font-size: 0.69em; text-decoration: none;}
	.detail .col-1 a:hover,
	.col-1.special a:hover {color: #000;}
	.col-1 a.active_submenu {color:#000;}
	
	/* --- | Text | --- */
	/* heading */
	.text #content h2 {font-size: 1.88em; font-weight: normal; letter-spacing: -1px;}
	/* shadows */
	.edge {position: absolute; top: 0; width: 16px; height: 100%;}
	.edge.left {left: -7px; background: url(../images_/content_text_left.jpg) no-repeat;}
	.edge.right {right: -2px; background: url(../images_/content_text_right.jpg) no-repeat;}
	.edge.bottom {top: auto; bottom: 0; left: -7px; width: 101%; height: 101px; background: url(../images_/content_text_bottom.jpg) no-repeat;}
	*html .edge.bottom,
	*html .edge.left,
	*html .edge.right {display: none; /*IE*/}
	*html .text #content {background: #FFF;/*IE*/}
	/* layout */
	.text #content {position: relative; padding: 1.5em 2.5em 101px 1.88em; background: #FFF url(../images_/content_text_top.jpg) repeat-x; _height: 1px;}
	.text #content .col {margin-top: 1em;}
	.text #content .col-1 {float: left; width: 12.50em; min-height: 400px; _height: 400px;/*IE*/}
	.text #content .col-2 {float: right; width: 41.38em;}
	/* Contact form */
	form table {border-collapse: collapse;}
	form table th {padding-right: 0.5em; text-align: left; font-size: 0.69em; vertical-align: top;}
	form table textarea,
	form table .field {font-size: 0.69em; border: 1px solid #CCC;}
	.col-1 form table textarea {width: 12em;}
	.col-1 form table .field {width: 9em;}
	.button {font-size: 0.69em;}
	.special_bt {float:left; font-size: 0.9em; width:190px; height:30px; display:block; padding:4px 0 0 4px; text-decoration:none; background: url(../images_/special_bt_background.png) no-repeat; color:#fff;}
	.special_bt:hover {color:#fff;}
	#error {color: #CC0000; font-size: 0.75em;}
	
	/* --- | Realizacie | --- */
	.item {position: relative; margin-bottom: 0.94em; padding: 0.81em 0 0.5em 7.5em; border: 1px solid #CCC; min-height: 5.94em; _height: 5.94em; background: #dbdbdb url(../images_/item_background.jpg) repeat-x;/*IE*/}
	.item h3 {margin-bottom: 0.44em; font-size: 0.75em;}
	.item h3 a {color: #e60004; text-decoration: none;}
	.item h3 a:hover {color: #000;}
	.item p {font-size: 0.69em; line-height: 180%;}
	.item span {position: absolute; left: 0.63em; top: 0.81em; border: 5px solid #dbdbdb; display: block; width: 90px; height: 90px; overflow: hidden;}
	.item form {position: relative; right: 20px; float: right;}
	.item form td,
	.item form th {height: 1em; overflow: hidden; vertical-align: middle;}
	.item form .field {width: 8em;}