/*--------------------------------------------------------------------------
	MANGALAM - Architektonický atelier
		
	Author:			Michael Čečetka
	Author URI:		http://www.michaelcecetka.cz
	Version:			1.1
---------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------
	RESET - resets margin and padding of elements
---------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;	
	vertical-align: baseline;	
}

/*--------------------------------------------------------------------------
	ELEMENTS 
---------------------------------------------------------------------------*/
	
	body { 
		background: url("../images/background.jpg");
		color: #fff;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 75%;
		line-height: 20px;		
	}
	
		#container { margin: 0 auto;	position: relative; width: 1200px; } /* presunout */
	
	h2, h3 { text-transform: uppercase; }
	h2 { font-size: 275%; }
	h3 { font-size: 115%; }
	h4 { font-size: 100%; color: #aaa; font-style: italic; }
	
	a { color: #fff; text-decoration: none; }	
	p { padding: 0px 0px 20px 0px; }
 
	/* It's best to use <div> for cleaner */
	.cleaner {
		clear: both;
		visibility: hidden;
		height: 0; 
		margin: 0;
		padding: 0;
		font-size: 0;
		line-height: 0;
	}
	
	.last { margin: 0 !important; padding: 0 !important; }
	.left { float: left; }
	.right { float: right; }	
	
/*--------------------------------------------------------------------------
	PRETTY PHOTO - lightbox styling
---------------------------------------------------------------------------*/

	.currentTextHolder, .pp_description { color: #787878;}
	.pp_details p { padding: 0px 0px 0px 0px !important; line-height: 1;}
	
/*--------------------------------------------------------------------------
	DISABLED JAVASCRIPT
---------------------------------------------------------------------------*/

	.no-js h2, .no-js h3 { font-weight: normal; }
	.no-js .mainProject:hover .showProjects { display: block; }
	.no-js .mainProject:hover h2 { background: #191919; }
	
	.no-js .info p { height: 180px; overflow-x: hidden; overflow-y: auto; }
	
	.mainProject.ie:hover .showProjects { display: block; } /* IE fadeTo bug */
	
/*--------------------------------------------------------------------------
	HEADER 
---------------------------------------------------------------------------*/
	
	#header { height: 175px; position: relative; }	
		.logo { float: left; height: 55px; padding: 60px 0px 0px 0px; position: relative; width: 295px; }
			.logo a { 
				background: url("../images/Logo.png");
				display: block;
				height: 55px;
				text-indent: -9999px;
				width: 295px; }

		.languageVersions { 
			color: #a0a0a0;
			font-family: arial;
			font-size: 85%;	
			text-align: center;
			position: absolute;
			right: 0px;
			top: 35px;
			width: 75px;
		}	
			.languageVersions img{ display: block; float: left; margin: 0px 15px 0px 0px; }
			.languageVersions p { background: url("../images/languageBorder.gif") no-repeat 0px 13px; line-height: 26px; }
		
		.en { float: right; margin-top: -40px; }
			
			.en p { color: #A0A0A0; }
			.en img { margin: 0px 0px 0px 15px; vertical-align: middle; }
			
			
		
/*--------------------------------------------------------------------------
	CONTENT - MAIN PAGE
---------------------------------------------------------------------------*/
	#content { padding-bottom: 70px; }

		.mainProject {		
			float: left;
			background: #000;
			height: 324px;
			margin: 0px 48px 40px 0px;
			position: relative;
			width: 576px;
		}
			
			/* position absolute */
			.mainProject h2, .showProjects, .showProjects p, .mainProject .border, .project .border, .headingBG { position: absolute; }
			
			.mainProject h2 {			
				bottom: 20px;
				line-height: 45px;
				right: 0;
				text-align: right;
				z-index: 1;
			}
			.mainProject h2 a { display: block;  padding: 2px 35px 2px 10px;}
			
			.showProjects {
				background: url("../images/circle.png");
				display: none;
				height: 90px;
				left: 30px;
				top: 30px;
				width: 90px;				
				z-index: 5;
			}
			
				.showProjects p {
					display: block;
					font-size: 85%;
					line-height: 16px;				
					height: 48px; /* 3x line height */
					margin-top: -24px;
					text-align: center;
					top: 50%;
					width: 90px;
				}
					.showProjects a { border-bottom: 1px dotted #fff; padding-top: 3px; }
					.showProjects a:hover { border: none; }
			
			.mainProject .border, .project .border { 
				background: url("../images/pattern.png");
				height: 324px;
				right: 0;
				top: 0;
				width: 10px;
				z-index: 2;
			}
			
			.headingBG { 
				background: #191919;
				display: none;
				height: 49px; /* 49 = line-height of heading + 4px padding */
				bottom: 20px;
				right: 0;
			}
			
			#p03 .headingBG { height: 94px; } /* double line heading + top and bottom padding 2px */
			
			/* Project borders */
			#p03:hover .border { background: url("../images/patternBD.png"); }
			#p02:hover .border { background: url("../images/patternRD.png"); }
			#p01:hover .border { background: url("../images/patternINT.png"); }
			#p04:hover .border { background: url("../images/patternOST.png"); }

			
		
/*--------------------------------------------------------------------------
	CONTENT - PROJECTS
---------------------------------------------------------------------------*/
	
	.project { background: #191919; height: 324px; margin: 0px 0px 40px 0px; position: relative; width: 1200px; }				
	
		.info { float: left; padding: 25px 0px 0px 25px; width: 370px; }
			
			.info h2 { font-size: 200%; line-height: 30px; }
			.info h3 { display: inline; line-height: 20px; }
			
			.info .year {
				color: #8c8c8c;
				display: inline;
				font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif;
				font-size: 100%;
				font-style: italic;		
				padding: 0;
				vertical-align: -1px;
			}		
			
			.info p { color: #e1e1e1; font-size: 110%; padding: 0px 20px 20px 0px; }
			.info p.last { padding: 0px 20px 0px 0px !important; }					
		
		.scroll-pane { height: 200px; margin: 24px 0px 25px 0px; width: 370px; }
		
		.photos { float: right; width: 764px; }			
			.thumbs { float: left; width: 168px; padding: 0px 20px 0px 0px;}
				.thumbs img { display: block; padding: 0px 0px 21px 0px; }
				
			.plus {
				background: url("../images/plusButton.png");
				bottom: 20px;
				display: none;
				height: 49px;
				position: absolute;
				right: 0;
				width: 59px;		
			}
	
/*--------------------------------------------------------------------------
	PROJECT'S COLOR SCHEME
---------------------------------------------------------------------------*/
	
	/* JSPDRAG - scrollbar's color */
	.bd .project h3 { color: #f65700; }
	.bd .jspDrag { background: #f65700; }
	
	.rd .project h3 { color: #00b9e9; }
	.rd .jspDrag { background: #00b9e9; }
	
	.int .project h3 { color: #17e57e; }
	.int .jspDrag { background: #17e57e; }
	
	.ost .project h3 { color: #ffed00; }
	.ost .jspDrag { background: #ffed00; }
	
/*--------------------------------------------------------------------------
	FOOTER 
---------------------------------------------------------------------------*/

	#footer { padding: 0px 0px 150px 0px; position: relative; width: 1200px; }

		#footer h2 { float: left; line-height: 35px; margin: 0px 0px 30px 0px; }
			span.border { 				
				background: url("../images/border.gif") no-repeat 0 50%;
				float: right;
				height: 35px;
				margin: 0px 0px 0px 15px;
				width: 700px;
			}		
			
		.up { float: left; height: 35px; margin: 0px 0px 0px 15px; }
			.up a { color: #a0a0a0; line-height: 35px; }
			.up a:hover { color: #fff; }
			.up span.border { width: 200px;}

		.col1, .col2, .col3 { border-right: 1px dotted #8c8c8c; float: left; height: 160px; margin: 0px 30px 0px 0px; padding: 0px 30px 0px 0px; }		
		.col3 { border: none; width: 200px;}
		.col3 h4, .col3 p { display: inline; padding: 0; }		
			.col1 a, .col3 a { border-bottom: 1px dotted #777; padding: 1px 2px; }
			.col1 a:hover, .col3 a:hover { border: none; background: #aaa;}
			.col1 a { padding-left: 0;}
			
		.copyright { 
			background: url("../images/Copyright.png");
			height: 135px;
			position: absolute;
			right: 0;
			top: -16px;
			width: 135px;			
		}

			/* VCARD contacts */
			.role, .nonVisual , .fn.org, .country-name { display: none !important; }
			.vcard p { padding: 0; }			
			.margin { margin-bottom: 20px; }
			
			
			/*p.fn.n { float: left; }*/