/* commoncss */
body,html{width:100%;height:100%;margin:0;padding:0;font-size:12px;font-family:Arial,Verdana,Helvetica,sans-serif;color:#000;}
html{}
body{}
a{text-decoration:none;}
a:hover{text-decoration:none;}
img{border:0;}
h1,h2,h3{font-family:Arial,Verdana,Helvetica,sans-serif;margin:0;padding:0;font-weight:normal;font-style:normal;}
form{margin:0;padding:0;}
input,select,textarea{font-family:Arial,Verdana,Helvetica,sans-serif;}
input[type=hidden]{display:none;}
.cleaner{clear:both;line-height:0;height:0;font-size:0;display:block;}
.hidden{display:none;height:0;border:none;background:none;line-height:0;}
ul,li{margin:0;padding:0;list-style-type:none;}
/* main */#main{width:960px;position:relative;margin:0 auto;}
#cont{width:100%;min-height:600px;height:auto;margin:7px 0 0;border-top:1px solid #dfdfdf;border-bottom:1px solid #dfdfdf;}
#cont h1{padding:0 0 20px;font-size:12px;font-weight:bold;color:#666;}
#cont .content_box{width:960px;position:relative;margin:0 auto;}
.article{padding:20px 0 0 0px;font-size:14px;line-height:18px;color:#666;width:960px;text-align:justify;}
/* flags *//*
ul#flags {}
ul#flags li {}
ul#flags li a {}
*//* nav */ul#nav{width:130px;margin:20px 0 0;float:left;}
ul#nav li{margin:0 20px 2px 0;}
ul#nav li a{font-size:12px;color:#666;}
ul#nav li a:hover{color:#000;text-decoration:underline;}
.projects_nav{width:600px;float:left;}
ul#nav_projects{margin:20px 0 0;position:absolute;top:0;}
ul#nav_projects li{margin:0 20px 2px 0;}
ul#nav_projects li a{font-size:14px;color:#666;}
ul#nav_projects li a:hover{color:#000;text-decoration:underline;}
ul#nav_projects li ul{padding-left:100px;}
#projects0,ul.projects,ul.category,ul.subcategory{width:120px;margin-top:20px;float:left;}
#projects0 li,ul.projects li,ul.category li,ul.subcategory li{margin:0 0 2px;}
ul.projects li a,ul.category a,ul.subcategory a{font-size:12px;color:#666;}
ul.projects li a:hover,ul.category a:hover,ul.subcategory a:hover{color:#000;text-decoration:underline;}
ul#projects0 a{font-size:12px;color:#666;}
ul#projects0 a:hover{color:#000;text-decoration:underline;}
.active{font-weight:bold;color:#000;}
a#logo{width:85px;height:85px;margin:28px 0 0;display:block;float:right;}
div.message{padding:35px 0 0 30px;font-weight:bold;}
/* footer */#footer{width:100%;padding:6px 0;}
#footer .info{width:960px;position:relative;margin:0 auto;text-align:center;}
#footer a{color:#000;}
#footer a:hover{text-decoration:underline;}
#footer .credits{font-size:10px;color:#999;}
#footer .credits a{color:#999;}
#footer .credits a:hover{text-decoration:underline;color:#000;}
/* 404 google search */#goog-wm{}
#goog-wm h3.closest-match{}
#goog-wm h3.closest-match a{}
#goog-wm h3.other-things{}
#goog-wm ul li{}
#goog-wm li.search-goog{display:block;}
/* mainscss */
#nav_mains{font-weight:bold;}
/* index */#categories_box{width:960px;height:600px;overflow:hidden;}
div.box{margin:0 1px;}
/*ul#categories {width:10000px;}
ul#categories li {width:480px; float:left;}
ul#categories li a {width:480px; height:600px; display:block; color:#000; font-size:18px; text-align:center;}
ul#categories li a span.hover {width:480px; height:600px; cursor:pointer; display:block; position:relative; margin:-600px 0 0 0; padding:0; background:url(../img/mains/hover.png); visibility:hidden;}
ul#categories li a span { width:480px; height:70px; cursor:pointer; padding:30px 0 0 0; display:block; position:relative; margin:-100px 0 0 0;  background:url(../img/mains/white.png);}
ul#categories li a:hover span.hover {visibility:visible;}*/div#categories{width:10000px;position:relative;}
div#categories div.scrollableArea *{position:relative;float:left;margin:0;padding:0;}
div#categories div{/*width:480px;*/float:left;}
div#categories div a{/*width:480px;*/height:600px;display:block;color:#000;font-size:18px;text-align:center;}
div#categories div a span.hover{/*width:480px;*/height:600px;cursor:pointer;display:block;position:relative;margin:-600px 0 0;padding:0;background:url(../img/mains/hover.png);visibility:hidden;}
div#categories div a span{/*width:480px; height:100px;*//*width:480px;*/height:70px;cursor:pointer;padding:30px 0 0;display:block;position:relative;margin:-140px 0 0;background:url(../img/mains/white.png);}
ul#categories div a:hover span.hover{visibility:visible;}
/* projects */a#prev{width:49px;height:53px;display:block;margin:244px 50px 0 -40px;float:left;}
a#next{width:49px;height:53px;display:block;margin:244px -70px 0 0;float:right;}
/*
ul#projects {width:740px; padding:65px 0 0 0; float:left;}
ul#projects li {width:370px; margin:0 0 30px 0; float:left;}
ul#projects li a {display:block; float:left; line-height:18px; color:#333;}
ul#projects li a:hover {color:#000; text-decoration:underline;}
ul#projects li a.pic {width:140px; height:105px; margin:0 18px 0 0;}
ul#projects li a.text {width:180px; font-size:14px; font-weight:bold; padding:10px 0 0 0;}
*/div#projects{padding:65px 0 0;float:left;}
div#projects div.wrapper{width:740px;float:left;}
div#projects div{width:370px;margin:0 0 30px;float:left;}
div#projects div a{display:block;float:left;line-height:18px;color:#333;}
div#projects div a:hover{color:#000;text-decoration:underline;}
div#projects div a.pic{width:140px;height:105px;margin:0 18px 0 0;}
div#projects div a.pic img{width:140px;height:105px;}
div#projects div a.text{width:180px;font-size:14px;font-weight:bold;padding:10px 0 0;}
div#projects div.scrollWrapper{width:740px;overflow:hidden;}
div#projects div.scrollableArea{width:9999px;}
/* detail */#scrollbar1{width:370px;height:500px;margin:20px 0 0 0px;float:left;}
.viewport{height:500px;width:310px;overflow:hidden;position:relative;float:left;}
.overview{position:absolute;overflow:hidden;}
.scrollbar{width:8px;position:relative;float:right;}
.disable{visibility:hidden;}
#scrollbar1 .track{position:relative;width:11px;background:url(../img/mains/scrollbar-bkg.gif) repeat-y;}
#scrollbar1 .thumb{width:9px;background:#828282;overflow:hidden;cursor:pointer;position:absolute;}
#cont .viewport h1{display:block;padding:0 0 20px;font-size:12px;font-weight:bold;color:#666;}
.viewport .text{line-height:18px;color:#666;}
.viewport h2{display:block;font-size:14px;margin:30px 0 15px;font-weight:bold;color:#666;}
ul.partners li{margin:0 3px 3px 0;padding:0;float:left;}
ul.authors{margin:20px 0 0;}
ul.authors li{color:#666;margin:0 0 4px;font-size:14px;}
ul.authors li b{color:#000;font-weight:normal;}
#gallery{width:580px;height:600px;overflow:hidden;float:right;}
#gallery .scrollWrapper{width:580px;height:600px;float:left;}
#nav_gallery{width:290px;position:absolute;top:0;left:50%;margin:660px 0 0 120px;#margin:660px 0 0 120px;z-index:2;}
#nav_gallery div{width:50px;height:47px;float:left;margin:0 8px 0 0;}
#nav_gallery a{display:block;float:left;color:#000;padding:10px 0;text-align:center;font-size:18px;background:url(../img/mains/white.png);}
#nav_gallery a:hover{background:#fff;}
#nav_gallery a.active{background:#fff;}
#footer{width:100%;padding:10px 0 0;}
/* smoothDivScrollcss */
/* You can alter this CSS in order to give SmoothDivScroll your own looknfeel */
/* Invisible left hotspot */
div.scrollingHotSpotLeft{/* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */min-width:75px;width:10%;/*height: 100%;*/height:600px;/* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */background-image:url(../img/smoothdivscroll/big_transparent.gif);background-repeat:repeat;background-position:center center;position:absolute;z-index:200;left:0;/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */cursor:url(../img/smoothdivscroll/cursors/cursor_arrow_left.cur), url(http://www.storic.it/packed/images/cursors/cursor_arrow_left.cur),w-resize;}
/* Visible left hotspot */div.scrollingHotSpotLeftVisible{/*background-image: url(../img/smoothdivscroll/arrow_left.gif);*//*background-color: #fff;*/background-image:url(../img/smoothdivscroll/arrow_left.png);background-repeat:no-repeat;opacity:0.35;/* Standard CSS3 opacity setting */-moz-opacity:0.35;/* Opacity for really old versions of Mozilla Firefox (0.9 or older) */filter:alpha(opacity=35);/* Opacity for Internet Explorer. */zoom:1;/* Trigger "hasLayout" in Internet Explorer 6 or older versions */}
/* Invisible right hotspot */div.scrollingHotSpotRight{min-width:75px;width:10%;/*height: 100%;*/height:600px;background-image:url(../img/smoothdivscroll/big_transparent.gif);background-repeat:repeat;background-position:center center;position:absolute;z-index:200;right:0;cursor:url(../img/smoothdivscroll/cursors/cursor_arrow_right.cur), url(http://www.storic.it/packed/images/cursors/cursor_arrow_right.cur),e-resize;}
/* Visible right hotspot */div.scrollingHotSpotRightVisible{/*background-image: url(../img/smoothdivscroll/arrow_right.gif);*//*background-color: #fff;*/background-image:url(../img/smoothdivscroll/arrow_right.png);background-repeat:no-repeat;opacity:0.35;filter:alpha(opacity=35);-moz-opacity:0.35;zoom:1;}
/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/div.scrollWrapper{position:relative;overflow:hidden;width:100%;height:100%;}
div.scrollableArea{position:relative;width:auto;height:100%;}