@charset "utf-8";
* {margin:0; padding:0}
html, body {height: 100%}

/* STRUCTURE
------------------------------------------ */
body {
font-family:Helvetica, Arial, sans-serif;
font-size:12px;
text-align:left;
color:#333;
line-height:18px;
width:100%;
overflow-y:scroll
}

#header-contents, #bookBannerFrame, #footer_contents, #home, #pages, #caught404, #pd-main-image, #related, #pd-info, #maintanance_msg, #projects {margin:0 auto; width:940px; padding:0 10px}

#logo, #play, #pause, #rw, #ff, #grid_link, #list_link, #prevArrow, #nextArrow, .expand, .collapse, #searchIcon, #bullet,
#cancel_search, #cancel_filter, #header_cancel_filter, #map_symbol{background:url('graphics/graphics.png') no-repeat; text-indent:-9999px}

.expand, .collapse, #rw, #ff{cursor:pointer}

#container{
min-width:960px;
min-height: 100%;
height: auto !important;
height: 100%;
}
#header{width:100%; height:113px; position:fixed; top:0; left:0; background-color:#FFF; z-index:1000}
#header-contents{position:relative; top:0; left:0; overflow:hidden}
#bookBannerFrame{position:fixed; top:0; left:50%; margin-left:-480px}
#content{padding:269px 0 50px 0}
#footer {
 font-size:11px;
 color:#999;
 border-top:1px solid #CCC;
 padding-top:13px;
 clear: both;
 position: relative;
 z-index: 10;
 height: 70px;
 margin-top: -84px;
}
#footerMail, .mailLabel{display:none}

a {color:#737373; outline-color:-moz-use-text-color; outline-style:none; outline-width:0}
a:hover {text-decoration:none}
a img {border:none}

h2{font-size:13px; margin-bottom:20px; font-weight:normal; color:#333}

hr{border:none; border-bottom:1px solid #CCC; margin-bottom:90px}

#logo-wrapper{width:168px; float:left; border-right:1px solid #CCC; height:71px;}
#logo{margin:49px 0 0 -1px; display:block; width:140px; height:18px}
#home-link-note{color:#999; font-style:italic; position:absolute; top:25px; font-size:11px}

#menu{list-style:none; float:left; margin:44px 26px 0 31px; border-right:1px solid #CCC; padding-right:11px; height:27px; line-height:27px}
#menu li, #submenu li{display:inline}
#menu li h1{color:#000; margin-right:17px; font-size:12px; font-weight:normal; display:inline}
#menu a, #submenu a{color:#737373; margin-right:17px; text-decoration:none}
#menu a:hover, #menu a.selected{color:#000}
#submenu a:hover, #submenu a.selected{color:#333}

#submenu{list-style:none; float:left; margin:44px 0 0 0; height:27px; line-height:27px; width:425px}
#submenu a{float:left}
#submenu li a.anchor{display:none}

#lang_link{color:#8F7070; float:left; width:88px}
#lang_link:hover, #lang_link_home a:hover{color:#422929}
#lang_link_home a{color:#8F5959; text-decoration:none}

#contact_info{float:right; width:800px; text-align:right}
#footer span.separator{margin-left:8px}
#footer span.darker{color:#CCC; margin-left:8px}
#footer a{text-decoration:underline}
#footer a:hover{color:#000; text-decoration:none}

.grey{color:#8C8C89}
.hidden{display:none}
.link{cursor:pointer}
.clearfloat{clear:both; width:1px; height:1px; font-size:1px; line-height:0}
.size11{font-size:11px}
sup{font-size:9px; vertical-align:inherit; position:relative; top:-4px; line-height:0}

#caught404{font-style:italic; margin-bottom:20px; color:#666}

/* PAGES
------------------------------------------ */
#pages{position:relative}
#pages p{width:520px}
#pages img{}
#pages ul{margin:10px 0 10px 30px}

#pages a{text-decoration:underline; color:#000}
#pages a:hover{text-decoration:none}
#pages h2 a{text-decoration:none; color:#333}

.column{float:left; width:300px; padding-right:20px; margin-bottom:20px}
#pages .column .grey {color:#999; margin:-6px 0 6px 0; font-size:11px}
#pages .no_padding{padding:0}
#pages .column p{width:auto; line-height:14px; margin-bottom:6px}

.box{padding-bottom:90px; margin-bottom:90px; border-bottom:1px solid #CCC}
.box:last-child{border:none}

.people{width:220px; float:left; margin:0 20px 36px 0}
.person_img{width:100%; height:150px; margin-bottom:15px}
.people h3{font-size:12px; font-weight:normal; margin-bottom:10px}
#pages .people .bio p{width:100%; font-size:11px}
#pages .no_right_margin {margin:0 0 36px 0; clear:right}

#banner-home{position:absolute; top:17px; right:-7px; z-index:1005}
#banner-home #textlink{position:absolute; top:76px; left:78px; color:#3523B0; text-decoration:none}
#banner-home #textlink:hover{text-decoration:underline}

#banner{position:absolute; top:37px; right:10px; color:#5C5987}
#banner p{width:350px; margin:20px 0 13px 0}
#banner a{color:#3523B0}
#banner a:hover{text-decoration:none}
#publication-banner-en{background:url('graphics/thessaloniki-graphic-design.png') no-repeat -5px 0; width:200px; height:94px; display:block}
#publication-banner-en:hover{background-position:-5px -140px}
#publication-banner-el{background:url('graphics/thessaloniki-graphic-design.png') no-repeat -244px 0; width:200px; height:94px; display:block}
#publication-banner-el:hover{background-position:-244px -140px}

.newspost{border-bottom:1px solid #CCC; float:left; padding-bottom:50px; margin-bottom:50px; width:100%}
.newsyear{color:#000; float:left; width:211px}
.newstitle{float:left; width:175px}
.newstitle h2{color:#000; margin-bottom:3px; font-size:12px; line-height:17px}
.newsdate{color:#A6A6A6}
.newsbody{float:right; width:520px; overflow:hidden} /* overflow hides large images */
.newsbody p{margin-bottom:4px; line-height:17px}

#pages.contact h2{color:#8C8C89; font-weight:normal}
#pages.contact .column{width:220px; line-height:19px}
#pages span.lighter{color:#A6A6A6; margin-right:5px}

#map_link{display:none; cursor:pointer; color:#000; text-decoration:underline; float:left; margin:0 0 120px 0}
#map_link:hover{text-decoration:none}
#map_symbol{background-position: -610px 0; width:19px; height:20px; margin:-2px 10px 0 0; float:left; display:none}
#mapArea{margin:-20px 0 20px 0; width:940px; height:0; float:left; overflow:hidden}
#mapArea iframe{margin-top:20px}

#pages.msg404 h2{font-size:13px; font-weight:bold}
#pages.msg404 p{margin-bottom:10px}

/* HOME
------------------------------------------ */
#home{position:relative}
#loader_home{width:24px; position:absolute; top:100px; left:50%; margin-left:-12px; z-index:-1}

#slideshow{width:700px; height:433px; margin:-70px auto 120px auto; overflow:hidden; position:relative}
#slideshow img{cursor:pointer}
#slideshow_bar, #slideshow_bar_background{width:700px; margin:0 auto; position:absolute; bottom:0; height:45px; line-height:45px}
#slideshow_bar_background{z-index:100; background-color:#FFF; opacity:0.7}
#slideshow_caption{z-index:101; position:absolute; bottom:0; width:700px; text-align:center}
#slideshow_bar{display:none}
.ss_caption_title{color:#000}
.ss_caption_client{color:#595959}

#slideshow_controls_wrapper{text-align:center; width:100%; margin-top:35px; height:35px; padding-top:10px}
#slideshow_controls{width:59px; margin:0 auto; display:none}
#play{background-position: -832px -50px; width:21px; height:23px; float:left; display:none}
#pause{background-position: -702px -50px; width:21px; height:23px; float:left; display:none}
#rw{background-position: -734px -50px; width:28px; height:23px; margin:0 0 0 1px; float:left}
#ff{background-position: -764px -50px; width:28px; height:23px; margin:0 0 0 1px; float:left}
#play:hover{background-position: -832px -100px}
#pause:hover{background-position: -702px -100px}
#rw:hover{background-position: -734px -100px}
#ff:hover{background-position: -764px -100px}

/* NEWS
------------------------------------------ */
.expand, .collapse{background-position: -519px 0; width:19px; height:20px; margin-right:10px; float:left; display:none; padding-top:1px}
.expand:hover {background-position: -519px -40px; text-indent:30px; font-style:italic; color:#999; white-space: nowrap}
.collapse{background-position: -555px 0}
.collapse:hover{background-position: -555px -40px}

/* PROJECTS
------------------------------------------ */
#search{right:10px; top:45px; position:absolute}
#searchTerm{width:157px; border:none; color:#737373; position:absolute; right:0; top:0; border-bottom:1px solid #E6E6E6; padding:5px 26px 5px 26px; font-size:12px; font-family:Helvetica, Arial, sans-serif}
#searchIcon{background-position:-371px 0; width:14px; height:16px; margin-top:4px; position:absolute; top:0; right:189px; z-index:2}

#search.filterON{}
#search.filterON #searchTerm{right:-300px; width:147px; padding-left:36px}
#search.filterON #searchIcon{background-position:-358px -90px; right:0; width:26px}
#search.filterON #searchIcon:hover{background-position: -358px -120px; cursor:pointer}

#search.filterON.expanded #searchTerm{right:0}
#search.filterON.expanded #searchIcon{background-position:-358px -180px; right:181px; width:26px}
#search.filterON.expanded #searchIcon:hover{background-position: -358px -210px; cursor:pointer}

#matches_info{margin:0 0 0 30px; font-style:italic}
#alternative_searches{margin-top:30px; clear:both}
.alternative_searches{color:#A6A6A6; margin-bottom:6px}
#cancel_search{background-position: -412px 0; width:19px; height:18px; margin-top:4px; float:right; position:absolute; top:0; right:4px}
#cancel_search:hover{background-position: -412px -40px}

#grid_link{background-position: -187px -0px; width:12px; height:16px; float:left; margin:5px 8px 0 0}
#list_link{background-position: -207px -0px; width:12px; height:16px; float:left; margin:5px 0 0 -20px}
#grid_link:hover, #grid_link.selected{background-position: -187px -40px}
#list_link:hover, #list_link.selected{background-position: -207px -40px}

#projects-header{height:42px}
#projects-header h2 {float:left}
#projects-header h2 span{color:#A6A6A6; }
#projects-header #cancel_filter{background-position: -412px 0; width:19px; height:18px; margin:1px 0 0 5px; float:right}
#projects-header #cancel_filter:hover{background-position: -412px -40px}

#submenu a#header_filter_link{}
#submenu a.no_right_margin{margin-right:0}
#header_cancel_filter{background-position: -414px 0; width:15px; height:18px; margin:5px 0 0 5px; float:right}
#header_cancel_filter:hover{background-position: -414px -40px}

#projects{margin-bottom:120px}
.project{float:left; margin-bottom:20px; margin-right:20px; border:1px solid #E1E1E1; width:218px; height:218px}
/*.project:hover{opacity:0.3}*/
.project-thumb img{background-color:#EEE; float:left}
#projects .no_right_margin, #related .no_right_margin {margin-right:0}
#projects-hover{position:absolute; cursor:pointer; background-color:#F0F0F0; display:none; overflow:hidden}
#projects-hover-info{padding:20px; width:180px; height:180px; color:#737373}

#projects-hover-title, #slideshow_caption {
  color:#000;
  /* need it for the overflow-ellipsis
	white-space:nowrap;
	width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
  */
}
#projects-hover-client{color:#595959; padding-bottom:7px; margin-bottom:7px; border-bottom:1px solid #999}
#projects-hover-details{color:#333; font-size:11px}
#projects-hover-details span.year{color:#737373}
#projects-hover-details span.grey{margin-right:5px}
#projects-hover-awards{font-size:11px; color:#944449; margin-top:12px}

#archive{clear:both; padding:60px 0 0 0; display:none}

#view_archive_btn{width:110px; color:#FFF; background-color:#999; text-decoration:none; margin:0 auto; text-align:center;
border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px; height:30px; line-height:30px; padding:0 20px}
#view_archive_btn:hover,#view_archive_btn.active{color:#FFF; background-color:#4D4D4D; cursor:pointer}
#view_archive_btn img{margin:0 0 0 10px; position:relative; top:4px}

.category_group{float:left; clear:both}
.category_column{float:left; width:235px; margin:0 0 54px 0}
.category_column h2{border-bottom:1px solid #CCC; padding-bottom:14px; margin-bottom:18px}
.category_column p{padding-right:20px}
.category_column p.t a{color:#1A1A1A; text-decoration:none}
.category_column p.t a:hover{text-decoration:underline}
.category_column p.c{color:#595959}
.category_column p.y{color:#999; font-size:11px; margin-bottom:18px}

/* PROJECTS DETAILS
------------------------------------------ */
#project-details{}
#pd-main-image{line-height:0; font-size:0; text-align:right; margin-bottom:50px}
#pd-main-image #layout{position:relative; overflow:hidden}
#pd-main-image img{position:absolute}

#filter{float:left; margin-right:27px; max-width:196px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; position:relative}
#filter span{color:#A6A6A6}

#pd-info {font-size:11px; margin-top:20px; margin-bottom:77px}
#pd-info h1{font-size:12px; font-weight:normal; color:#000}
#client{border-bottom:1px solid #CCC; font-size:12px; color:#595959; padding-bottom:7px; margin-bottom:7px}
#pd-info #subtitle{margin-bottom:46px; width:300px; color:#737373; float:left}
#pd-info #subtitle a{text-decoration:none; color:#333}
#pd-info #subtitle a:hover{color:#000; text-decoration:underline}
#pd-info #subtitle .grey{margin-right:5px}
#comments{color:#737373; width:300px; float:left; margin-left:20px}
#tags{color:#A6A6A6; width:300px; float:left; margin-left:20px}
#tags span:first-child{float:left; margin-right:9px}
#tags a{color:#333; text-decoration:none; margin-right:9px; float:left}
#tags a:hover{color:#000; text-decoration:underline}
#awards{color:#944449; clear:both}
/*.shadow {-moz-box-shadow: 3px 3px 10px #888; -webkit-box-shadow: 3px 3px 10px #888; box-shadow: 3px 3px 10px #888}*/

#related{margin-top:93px; margin-bottom:166px}

#submenu span#inactive_prev, span#inactive_next{cursor:default; color:#CCC}
#inactive_prev{margin-right:17px; float:left}
#inactive_next span{float:left}

#prevArrow{background-position: -266px -0px; width:13px; height:16px; float:left; margin:5px 5px 0 0}
#nextArrow{background-position: -299px -0px; width:13px; height:16px; float:left; margin:5px 0 0 5px}
#bullet{background-position: -470px -0px; width:13px; height:16px; float:left; margin:3px 3px 0 0}

#inactive_prev #prevArrow, #inactive_next #nextArrow{opacity:0.33}
#nextlink{float:left}

.no_margin{margin:0}