body {
    background: url('../images/background.jpg') center top no-repeat #f3f3f3;
    font-family: 'Rationale', 'Helvetica', sans-serif;
    font-size: 11px;
}

#view {
    width: 900px;
    margin: auto;
}

#error {
	padding-top: 200px;
	width: 100%;
	text-align: center;
	font-size: 14px;
	color: #da6969;
	
}

#error a {
	color: #da6969;
}

#header {
    width: 100%;
    height: 120px;
    position: relative;
    background: url('../images/dots.gif') repeat-x bottom;
}

#header a {
    color: black;
    text-decoration: none;
}

#logo {
    position: absolute;
    width: 327px;
    height: 50px;
    top: 40px;
    left: 23px;
}

#logo a {
    display: block;
    width: 100%;
    height: 100%;
}

#header-content {
    position: absolute;
    left: 30px;
    height: 12px;
    bottom: 6px;
    width: 840px;
}

#header-content div {
    position: absolute;
}

#header-content-contact {
    right: 100px;
}

#header-content-lang {
    right: 0;
}

#header-content-lang a {
    color: #9f9f9f;
}

#header-content-lang .active {
    color: black;
}

#content {
    margin-top: 60px;
    width: 100%;
	padding-left: 29px;
	padding-right: 29px;
}

#content .loading {
    background: url('../images/loader.gif') no-repeat center white;
}

#content-left {
    float: left;
    width: 405px;
    height: 450px;
    border: solid 1px #9f9f9f;
    background: white;
    overflow: auto;
}

#content-right {
    position: relative;
    float: left;
    width: 405px;
    height: 450px;
    border: solid 1px #9f9f9f;
    margin-left: 28px;
    background: white;
    overflow: hidden;
}

#dynamic-content {
    position: absolute;
    width: 100%;
    height: 100%;
}

.resume-item {
    width: 100%;
}

.resume-category {
    width: 100%;
}

.resume-category-title {
    width: 380px;
    height: 14px;
    color: white;
    font-size: 13px;
    padding-left: 25px;
    padding-top: 2px;
}

.resume-category-shadow {
    width: 405px;
    height: 8px;
    background: url('../images/resume-category-shadow.jpg') repeat-x;
}

.resume-category .red    { background: #da6969 url('../images/resume-category-university.jpg') no-repeat 5px 1px; }
.resume-category .blue   { background: #6997da url('../images/resume-category-briefcase.jpg') no-repeat 5px 1px; }
.resume-category .green  { background: #79da69 url('../images/resume-category-lightbulb.jpg') no-repeat 5px 1px; }
.resume-category .yellow { background: #dac369 url('../images/resume-category-heart.jpg') no-repeat 5px 1px; }

.resume-line {
    padding: 0 15px 8px 15px;
    font-size: 13px;
}

.resume-line-title {
    float: left;
}

.resume-line-date {
    float: right;
}

.resume-line-description {
    margin-top: 2px;
    float: left;
    font-size: 11px;
    color: #848484;
}

.resume-line-more {
    margin-top: 2px;
    float: right;
    font-size: 10px;
}

.resume-line-more a {
    color: #848484;
}

#footer {
    margin-top: 5px;
    width: 830px;
}

#download {
	width: 400px;
	padding-left: 5px;
	float: left;
}

#download img {
    vertical-align: bottom;
}

#download span {
    padding-left: 4px;
    font-size: 13px;
}

#download a {
    color: #666666;
    text-decoration: none;
}

#download a:hover {
    text-decoration: underline;
}

#social {
    float: left;
    width: 300px;
    margin-left: 30px;
}

#social li {
	display: block;
	float: left;
	margin-left: 5px;
}

/**
 * Contact
 */
#dynamic-content #top-contact{
    padding: 8px;
    height: 201px;
    width: 389px;
}

#dynamic-content #bottom-contact {
	position: relative;
    height: 233px;
    width: 100%;
    background: url('../images/contact.jpg');
}

#contact-form {
	position: absolute;
	top: 34px;
	left: 40px;
	width: 326px;
	height: 177px;
}

#contact-form #email {
	margin: 0;
	margin-top: 10px;
	border: none 0;
	padding-left: 10px;
	padding-right: 10px;
	height: 15px;
	width: 306px;
	font-size: 15px;
	font-family: Times;
}

#contact-form #message {
	margin: 0;
	border: none 0;
	padding: 10px;
	width: 306px;
	height: 70px;
	resize: none;
	font-size: 15px;
	font-family: Times;
}

#contact-form .prompt {
	color: #cccccc;
}

#contact-form .error {
	border: none;
	border-bottom: 1px gray solid;
	padding: 0 10px;
	width: 306px;
	height: 10px;
	color: #da6969;
}

#contact-form #submit {
	margin-top: 10px;
	margin-left: 113px;
	width: 100px;
	height: 20px;
	font-family: Times;
}

#contact-confirm {
	width: 100%;
	padding-top: 80px;
	font-size: 15px;
	color: #79da69;
	text-align: center;
}

/**
 * Icons
 */

.icon {
	padding-top: 8px;
}

.icon-image {
	width: 16px;
	height: 16px;
	float: left;
	padding-left: 10px;
}

.icon-text {
	float: left;
	width: 310px;
	font-size: 14px;
	padding-top: 1px;
	margin-left: 10px;
}

/**
 * One photo
 */
#dynamic-content #top {
	padding: 8px;
    height: 229px;
    width: 389px;
}

#dynamic-content #bottom {
    height: 205px;
    width: 100%;
}

#dynamic-content .photo-polytech {
    background: url('../images/photo-polytech.jpg');
}

#dynamic-content .photo-cranfield {
    background: url('../images/photo-cranfield.jpg');
}

#dynamic-content .photo-publyxis {
    background: url('../images/photo-publyxis.jpg');
}

/**
 * Galery
 */
#dynamic-content #top-galery {
	padding: 8px;
    height: 297px;
    width: 389px;
}

#dynamic-content #bottom-galery {
    position: relative;
    height: 137px;
    width: 100%;
}

#dynamic-content .galery-1 {
    background: url('../images/galery-1.jpg');
}

#dynamic-content .galery-2 {
    background: url('../images/galery-2.jpg');
}

#dynamic-content .galery-3 {
    background: url('../images/galery-3.jpg');
}

.galery {
    position: absolute;
    width: 100%;
    height: 70px;
    top: 40px;
}

.galery .photo a {
    display: block;
    width: 100%;
    height: 100%;
}

.galery .photo {
    float: left;
    width: 107px;
    height: 100%;
}

.galery-1 #photo1 {    
    padding-left: 149px;
}

.galery-2 #photo1 {    
    padding-left: 82px;
}

.galery-2 #photo2 {    
    padding-left: 27px;
}

.galery-3 #photo1 {    
    padding-left: 15px;
}

.galery-3 #photo2 {
    padding-left: 27px;
}

.galery-3 #photo3 {
    padding-left: 27px;
}

.clear {
    clear: both;
}

/**
 * Details
 */
#top-left {
	float: left;
	width: 250px;	
}

#top-right {
	float: left;
	width: 139px;
	text-align: center;
}
 
#top h1, #top-galery h1, #top-contact h1 {
	font-size: 15px;
	text-align: justify;
}

#top h2, #top-galery h2 {
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: justify;
	line-height: 1.2;
}

#top p, #top-galery p {
	padding-top: 3px;
	font-size: 13px;
	text-align: justify;
	line-height: 1.3;
}

#top h2 span, #top-galery h2 span {
	color: gray;
}

#top a, #top-galery a, #top-contact a {
	color: #6997da;
}

/**
 * Scrollbar customization
 */
.jspVerticalBar {
    width: 4px;
}
.jspTrack {
    background: #eeeeee;
    margin-right: 1px;
    opacity: .8;
}

.jspDrag {
    background: #848484
}