html, body { margin: 0; padding: 0; height: 99%; }
body { background: #000; color: #000; font: normal 12px/15px 'Didact Gothic', Verdana, Arial, sans-serif; position: relative; }
a { color: #000; text-decoration: none; }
a:hover, a.active { text-decoration: underline; }
h1, h2, h3, h4, h5, p { margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
h3 { font-size: 14px; line-height: 17px; font-weight: bold; font-family: 'Didact Gothic', Verdana, Arial, sans-serif; }
h4 { font-size: 13px; font-weight: bold; font-family: 'Didact Gothic', Verdana, Arial, sans-serif; margin-bottom: 3px; }
p { margin-bottom: 4px; }
.ui-draggable { cursor: move; }
.ui-resizable-handle { display: block; font-size: 0.1px; position: absolute; z-index: 1; }
.ui-resizable-e { top: 0; right: 0; width: 5px; height: 100%; cursor: e-resize; }
.ui-resizable-s { bottom: 0; left: 0; width: 100%; height: 5px; cursor: s-resize; }
.ui-resizable-se { bottom: 1px; right: 1px; width: 11px; height: 11px; cursor: se-resize; background: url(../images/resize_corner.png) no-repeat; }

#menubox { width: 350px; height: 440px; background: #FF3; right: 45px; top: 120px; position: absolute; z-index: 1002; overflow: hidden; }
#contentbox { height: 780px; background: #FFF; position: absolute; left: 0; right: 210px; top: 0; overflow: hidden; padding: 10px; }
#menu { margin: 160px 0 0 100px; font-size: 30px; line-height: 32px; font-family: 'Didact Gothic', Verdana, Arial, sans-serif; }
#languages { position: absolute; right: 40px; top: 30px; }
#languages images { border: 0; padding: 0 0 0 4px; }
#business-card { position: absolute; width: 200px; height: 115px; top: 0; right: 0; z-index: 2000; }
#footer { position: absolute; bottom: 5px; right: 5px; color: #666; font-size: 10px; }
#footer a {color: #666;}

#mobileHandler {  position: absolute; bottom: 5px; left:5px; font-size: 10px; color:#FFF; background-color: #000; z-index: 1500 }
#mobileHandler a {color: white;}

.photo-link { color: #DFD800; font-weight: bold; }
.image-box {
	position: absolute; z-index: 3000; width: 245px; height: 300px; left: 50%; top: 100px; background: #FFF;
	-webkit-box-shadow: 0 0 5px #888;
	-moz-box-shadow: 0 0 5px #888;
	-o-box-shadow: 0 0 5px #888;
	box-shadow: 0 0 5px #888;
}
.close { position: absolute; top: 1px; left: 1px; width: 11px; height: 11px; background: url(../images/cross.png) no-repeat; cursor: default; }
.close:hover { background-color: #EEE; }

.div { border-top: 1px solid #000; padding-top: 4px; margin-top: 8px; }
.divsp { padding-top: 8px; }

.ref { font-weight: bold; font-size: 14px; padding: 12px 0; position: relative; }
#card1.cs  { position: absolute; left: -174px; top: 84px; background: url(../images/card1-cz.png) no-repeat; width: 449px; height: 448px; }
#card2.cs  { position: absolute; left: 92px; top: -138px; background: url(../images/card2-cz.png) no-repeat; width: 340px; height: 384px; }
#card3.cs  { position: absolute; left: 27px; top: 347px; background: url(../images/card3-cz.png) no-repeat; width: 362px; height: 402px; }
#card4.cs  { position: absolute; left: 161px; top: 203px; background: url(../images/card4-cz.png) no-repeat; width: 338px; height: 382px; }
#card5.cs  { position: absolute; left: 354px; top: 71px; background: url(../images/card5-cz.png) no-repeat; width: 398px; height: 428px; }
#card6.cs  { position: absolute; left: 446px; top: 353px; background: url(../images/card6-cz.png) no-repeat; width: 334px; height: 379px; }
#card7.cs  { position: absolute; left: 520px; top: -41px; background: url(../images/card7-cz.png) no-repeat; width: 371px; height: 408px; }
#card8.cs  { position: absolute; left: 676px; top: 206px; background: url(../images/card8-cz.png) no-repeat; width: 439px; height: 446px; }

#card1.en { position: absolute; left: -174px; top: 84px; background: url(../images/card1-en.png) no-repeat; width: 449px; height: 448px; }
#card2.en { position: absolute; left: 92px; top: -138px; background: url(../images/card2-en.png) no-repeat; width: 340px; height: 384px; }
#card3.en { position: absolute; left: 27px; top: 347px; background: url(../images/card3-en.png) no-repeat; width: 362px; height: 402px; }
#card4.en { position: absolute; left: 161px; top: 203px; background: url(../images/card4-en.png) no-repeat; width: 338px; height: 382px; }
#card5.en { position: absolute; left: 354px; top: 71px; background: url(../images/card5-en.png) no-repeat; width: 398px; height: 428px; }
#card6.en { position: absolute; left: 446px; top: 353px; background: url(../images/card6-en.png) no-repeat; width: 334px; height: 379px; }
#card7.en { position: absolute; left: 520px; top: -41px; background: url(../images/card7-en.png) no-repeat; width: 371px; height: 408px; }
#card8.en { position: absolute; left: 676px; top: 206px; background: url(../images/card8-en.png) no-repeat; width: 439px; height: 446px; }


#business-card {
	background-image: url(../images/contact.png);
	width:200px; height: 115px;
	
}
#business-card .contact {
	margin-left: 20px;
	margin-top: 20px;
	color:white;
	font-size: 12px;
	line-height: 18px;
	font-weight: bold;
}
#business-card a { color:white;}

#ajax-spinner {
	margin: 15px 0 0 15px;
	padding: 13px;
	background: white url('../images/spinner.gif') no-repeat 50% 50%;
	font-size: 0;
	z-index: 123456;
	display: none;
}

div.flashesOverlay {   position: fixed; left: 10px; top:10px; width:70%; z-index: 44; }
div.flashesOverlay .flash { padding: 8px; margin: 0; border-left: 0; border-right: 0; border-top: 0; font-size: 15px; }
div.content .flash { padding:2em;	margin: 2em 0;  }

div.flash {
	color: black;
	background: #FFFF33;
	border: 1px solid #E2C822;	
}
div.flash.error ,div.flash.warning {
    background: #FF0000;
    color:white;
    border: 1px solid #CC0000;
}

a[href^="error:"] {
	background: red;
	color: white;
}

form th, form td {
	vertical-align: top;
	font-weight: normal;
}

form th {
	text-align: right;
}

form .required label {
	font-weight: bold;
}

form .error {
	color: #D00;
	font-weight: bold;
}

html.js .jshidden {
	display: none;
}

.clearer { clear: both;}

#languages {  font-size: 14px; text-transform: uppercase}
div.serviceControl, div.referenceControl , div.teamControl {  background-color: #F5F5F5; position: absolute; padding:5px; border:0; border-bottom: 1px dotted #CCC;border-right: 1px dotted #777; margin: 10px;}
#contentbox  a.reference { display: block;  color:black; background-color: #F5F5F5; padding: 5px; font-size: 20px; margin: 5px; 
			/*text-decoration: underline */ }
#contentbox  a.reference:hover {text-decoration: underline }

#contentbox form  {  margin: 10px; width: 500px; }
#contentbox form fieldset {  background-color: #EEE; padding: 5px; border: 1px solid #ccc; }
#contentbox input, #contentbox textArea { font: normal 12px/15px 'Didact Gothic', Verdana, Arial, sans-serif; font-size: 14px; }
#contentbox h1 { font-size: 15px; font-weight: bold; margin-bottom: 5px;}
#contentbox a { color:black; background-color:  #FF3; padding: 0 5px; }

img.photo { float:left; margin-right: 5px;}

div.fullPhoto1 { position: absolute; top:100px;left:50px; z-index: 3; display: none;}
div.fullPhoto2 { position: absolute; top:175px;left:75px;z-index: 3; display: none;}

div.fullPhoto1 img { z-index: 4;
	-moz-transform: scale(1) rotate(-5deg);
	-webkit-transform: scale(1) rotate(-5deg);
	-o-transform: scale(1) rotate(-5deg);
	-ms-transform: scale(1) rotate(-5deg);
	transform: scale(1) rotate(-5deg);
}
div.fullPhoto2 img { z-index: 5;
	-moz-transform: scale(1) rotate(2deg);
	-webkit-transform: scale(1) rotate(2deg);
	-o-transform: scale(1) rotate(2deg);
	-ms-transform: scale(1) rotate(2deg);
	transform: scale(1) rotate(2deg);
}
div.photoCloser { background-image: url(../images/close.png); position: absolute;  z-index: 7; width: 32px; height:32px; }