/* 
    Document   : global.css
    Created on : 17-nov-2010, 16.42.57
    Author     :

#############################################################################################
#      ,ad8888ba,                       ,d8   8888888888   88              ,a8888a,         #
#     d8"'    `"8b                    ,d888   88           88            ,8P"'  `"Y8,       #
#    d8'                            ,d8" 88   88  ____     88           ,8P        Y8,      #
#    88             8b,dPPYba,    ,d8"   88   88a8PPPP8b,  88,dPPYba,   88          88      #
#    88             88P'   "Y8  ,d8"     88   PP"     `8b  88P'    "8a  88          88      #
#    Y8,            88          8888888888888          d8  88       88  `8b        d8'      #
#     Y8a.    .a8P  88                   88   Y8a     a8P  88       88   `8ba,  ,ad8'       #
#      `"Y8888Y"'   88                   88    "Y88888P"   88       88     "Y8888P"         #
#                                                                                           #
#                                                                                           #
#                      ad888888b,                          88           88   ad888888b,     #
#                     d8"     "88                        ,d88           88  d8"     "88     #
#                             a8P                      888888           88          a8P     #
#         8b       d8      aad8"   8b,dPPYba,  8b,dPPYba,  88   ,adPPYb,88       aad8"      #
#         `8b     d8'      ""Y8,   88P'   "Y8  88P'   "Y8  88  a8"    `Y88       ""Y8,      #
#          `8b   d8'          "8b  88          88          88  8b       88          "8b     #
#           `8b,d8'   Y8,     a88  88          88          88  "8a,   ,d88  Y8,     a88     #
#             "8"      "Y888888P'  88          88          88   `"8bbdP"Y8   "Y888888P'     #
#                                                                                           #
#############################################################################################

    Description:
       Classi e selettori per il seguente foglio di stile da adattare al sito.
*/
/*Main Configuration*/
 @import url("font.css");
 @import url("portfolio.css");
 @import url("cards.css");
 @import url("notifiche.css"); 

*{
 margin: 0;
 padding: 0;
 }

html, body{
height:100%;
width:100%;
margin:0;
padding:0;
font-family:"Arial";
font-size:12px;
color:#444748;
background-color:#bec5c8;
background:url(../images/floor.jpg) repeat;
}

#main{
width:100%;
}

#room{
width:100%;
height:10%;
}

.clear {
clear: both;
}

img{
margin:0;
padding:0;
border:none;
}

a{
outline:none;
}

h1{
font-family:Arial;
line-height:25px;
font-size:20px;
color:#5f5f5f;
padding:0;
margin: 0 0 10px 0;
background: url(../images/h1.gif) repeat-x bottom;
}

.shortLeft h1:first-letter,.story h1:first-letter{
color: #FFFFFF;
}

h2{
font-family:Arial;
font-size:16px;
color:#475470;
margin: 0 0 5px 0;
padding:0;
}

h3{
font-family:Arial;
line-height:10px;
font-size:14px;
color:#5f5f5f;
padding:0;
margin: 3px 0 10px 10px;
}

h3:first-letter{
color: #FFFFFF;
}
/*Header Configutration*/

#header{
width:100%;
height: 80px;
}

#header #logo{
position:absolute;
top:5px;
left:20px;
z-index:5;
}

#header #slogan{
display:block;
width:210px;
text-align:right;
position:absolute;
top:55px;
left:155px;
font-size:13px;
color:#525860;
z-index:5;
}

#header #slogan strong{
color: #FFFFFF;
}

#room #loader{
position: absolute;
top: 200px;
right: 130px;
z-index: 3;
}

#room #loader h1 {
font-size: 30px;
color: #FFF;
}

#room #loader img{
margin: 10px 0 0 110px;
}

#header .lang{
width:90px;
height:18px;
position:absolute;
top:0;
right:0;
z-index:3;
font-size:11px;
text-transform:lowercase;
}

#header .lang a{
color: #525860;
text-decoration:none;
margin: 0 3px 0 0;
}

#header .lang a:hover{
color: #818d9c;
}

#header .lang span{
color:#ffffff;
text-decoration:none;
margin: 0 5px 0 0;
}

#header .lang img{
position: relative;
top: 5px
}

#header ul.menu{
margin:0;
padding:0;
width:80%;
text-align:right;
position:absolute;
top:30px;
right:0;
list-style:none;
z-index:6;
}

#header ul.menu li{
margin:0;
padding:0 25px;
display:inline;
font-size:17px;
line-height:27px;
color:#525860;
font-weight:bold;
text-align:center;
}

#header ul.menu li a{
padding: 0 0 2px 0;
color:#525860;
text-decoration:none;
background: url(../images/dotted.gif) repeat-x 0 19px;
}

#header ul.menu li a strong{
color: #525860;
}

#header ul.menu li a:hover strong{
color: #FFFFFF;
}

#header ul.menu li strong{
color: #FFFFFF;
}

/*Body Configuration*/

.middle .home{
color:#5f5f5f;
font-size:11px;
position:relative;
top:-80px;
z-index:4;
width: 300px;
}

.middle .home a{
color:#5f5f5f;
}

.middle .home a:hover{
color:#fff;
}

#room #desk{
width:959px;
height:456px;
background: url(../images/desk.png);
position:relative;
float: right;
z-index: 3;
}

#room #deskTop{
width:381px;
height:206px;
background:url(../images/desk_top.png);
position:relative;
left: 46px;
top:101px;
z-index:5;
}

#room #drawer{
width:354px;
height:211px;
background:url(../images/drawer.png);
position:absolute;
top:150px;
right:517px;
z-index:4;
}

#room #drawerToggle{
display: block;
width: 200px;
height: 170px;
position: absolute;
top: 350px;
right: 590px;
z-index: 6;
}

#room #drawer #drawerPic{
width: 160px;
height: 136px;
position: absolute;
top: 7px;
left: 100px;
overflow: hidden;
display: none;
}

#drawerPicParams{
display: none;
}

#room #chair{
width:380px;
height:320px;
background: url(../images/chair.png);
position:absolute;
top:350px;
right:180px;
z-index:5;
}

#room #chair2{
width:380px;
height:320px;
background: url(../images/pfolio_chair.png);
position:absolute;
top:390px;
right:190px;
z-index:5;
}

#room #phone{
width:60px;
height:60px;
background: url(../images/phone.png);
position:absolute;
top:180px;
right:380px;
z-index:5;
}

#room #note{
width:180px;
height:150px;
background: url(../images/notes.png);
position:absolute;
top:125px;
right:460px;
z-index:5;
}

#room #keyboard{
width:230px;
height:175px;
background: url(../images/keyboard.png);
position:absolute;
top:156px;
right:135px;
z-index: 5;
}

#room #mouse{
width:45px;
height:55px;
background: url(../images/mouse.png);
position:absolute;
top:320px;
right:90px;
z-index: 5;
}

#room #display{
width:268px;
height:181px;
background: url(../images/display.png);
position:absolute;
top: 20px;
right:84px;
z-index:6;
}

#room #harddisk{
width:120px;
height:175px;
background: url(../images/HD.png);
position:absolute;
top: 138px;
right:0px;
z-index:6;
}

#room #magazines{
width:200px;
height:188px;
background: url(../images/magazines.png);
position:absolute;
top: 100px;
right:670px;
z-index:6;
}

#room #flash{
width:65px;
height:40px;
background: url(../images/flash.png);
position:absolute;
top: 69px;
right:780px;
z-index:6;
}

#room #coffee{
width:70px;
height:89px;
background: url(../images/coffee.png);
position:absolute;
top: 140px;
right:97px;
z-index:6;
}

#room #paper{
width:130px;
height:114px;
background: url(../images/paper.png);
position:absolute;
top:26px;
right:540px;
z-index: 5;
}

#room #camera{
width:118px;
height:92px;
background:url(../images/camera.png);
position:absolute;
top:45px;
right:400px;
z-index: 5;
}

#room #plant{
width:150px;
height:160px;
background: url(../images/plant.png);
position:absolute;
top:60px;
right:0;
z-index:5;
}

/* Hint */
#room .hint{
height: 33px;
line-height: 27px;
background: url(../images/hint_bg.gif) repeat-x;
position: absolute;
color: #FFFFFF;
text-align: center;
z-index: 20;
display: none;
}

#room .hint .left{
width: 5px;
height: 33px;
position: absolute;
top: 0;
left: -5px;
background: url(../images/hint_left.gif);
}

#room .hint .right{
width: 5px;
height: 33px;
position: absolute;
top: 0;
right: -5px;
background: url(../images/hint_right.gif);
}

#room .hint .arrow{
width: 13px;
height: 8px;
position: absolute;
top: 25px;
left: 15px;
background: url(../images/hint_arrow.gif) no-repeat;
}

#room #palm{
width:219px;
height:370px;
background: url(../images/palm.png);
position:absolute;
top:70px;
left:0;
z-index:7;
}

/*Login*/

#mask {
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background: #000;
display:none;
opacity:0.9;
z-index: 100;
}

#boxes .window {
position:absolute;
left:0;
top:0;
width:440px;
height:200px;
display:none;
z-index:9999;
padding:20px;
}

#boxes #login_box {
  width:375px;
  height:203px;
}

#login_box .d-header {
  background:url(../images/login-header.png) no-repeat 0 0 transparent;
  width:341px;
  height:146px;
}

#login_box .d-header input {
  position:relative;
  top:60px;
  left:100px;
  border:3px solid #cccccc;
  height:22px;
  width:200px;
  font-size:15px;
  padding:5px;
  margin-top:4px;
}

#login_box .d-blank {
  float:left;
  background:url(../images/login-blank.png) no-repeat 0 0 transparent;
  width:241px;
  height:43px;
}

#login_box .d-login {
  float:left;
  width:100px;
  height:43px;
}

/* Content */

.middle{
line-height:19px;
padding:516px 50px 0 50px;
position:relative;
z-index: 1;
}

.middle .story{
 width: 50%;
 margin-top: -60px;
 text-align: justify;
}

.middle .OurWork{
 width: 26%;
 padding:0 1% 0 3%;
 margin:0 0 0 2%;
 float:left;
 background: url(../images/vertical_divider.gif) no-repeat left center;
}

.middle .OurWork.first{
 background: none;
}

.middle .OurWork .spot{
width:100%;
height:48px;
padding:0 0 7px 0;
margin:0 0 7px 0;
border-bottom:#d5d8da 2px solid;
font-weight:bold;
background:url(../images/we_can.gif) no-repeat 0 46px;
position: relative;
}

.middle .OurWork .spot .labelspot{
 position:absolute;
 top:0;
 left:0;
 font-size:43px;
 line-height:45px;
 padding:0 5px 0 0;
 color:#000;
 }

.middle .OurWork .spot .title{
 position:absolute;
 top:4px;
 left:90px;
 }

.middle .OurWork .spot .title h2{
display:inline;
font-size:16px;
color:#5f5f5f;
margin:0;
padding:0;
line-height:18px;
}

.middle .OurWork .spot .title h2 a{
color:#5f5f5f;
text-decoration:none;
}

.middle .slideLink{
margin: 0 0 5px 0;
}

.slideLink img{
float: left;
padding: 0 6px 0 2px;
}

.middle .slideLink a{
vertical-align:top;
margin:0 0 0 5px;
text-decoration:none;
font-size:15px;
color:#5F5F5F;
background-image: url(../images/dotted.gif);
background-repeat: repeat-x;
background-position: 0 bottom;
}

.middle .slideLink a:hover{
background-image:none;
}

.middle .slideText{
padding:0 0 0 23px;
margin:0 0 10px 0;
display:none;
}

.middle .shortLeft{
 width:49%;
 margin-top: -70px;
}

/* Footer */

#footer{
width:100%;
height:300px;
background:url(../images/wall.png) repeat-x;
background-position: 0 bottom;
position:relative;
top:100px;
z-index:0;
}

#footer #copy{
width:485px;
position:absolute;
bottom:100px;
left:31%;
text-align:center;
z-index:1;
}

#footer #copy a{
color:#444748;
text-decoration:none;
}

#footer #copy a:hover{
text-decoration: underline;
color: #FFFFFF
}

#footer #window{
width:467px;
height:69px;
background: url(../images/window.png);
position:absolute;
bottom:1px;
left:31%;
}

#bottomTable{
height:225px;
width: 240px;
background:url(../images/table.png);
position:absolute;
bottom:66px;
left:0;
color:#6f8fb7;
}

#bottomTable a#twitter{
width:50px;
height:50px;
position:absolute;
left:160px;
bottom:105px;
}

#bottomTable a#facebook{
width:50px;
height:50px;
position:absolute;
left:100px;
bottom:155px;
}

#bottomTable a#blog{
width:30px;
height:30px;
position:absolute;
left:130px;
bottom:40px;
}

#basket{
width:200px;
height:210px;
background:url(../images/basket.png);
position:absolute;
bottom:56px;
right:10px;
}

/*Contacts*/

#main-container{
width:450px;
margin:30px ;
position: absolute;
left: 600px;
top: 600px;
}

#form-container{
background-color:#f5f5f5;
padding:15px;
-moz-border-radius:12px;
-khtml-border-radius: 12px;
-webkit-border-radius: 12px;
-ms-border-radius: 12px;
border-radius:12px;
}

#form-container input,select{
margin: 2px 0 2px 0;
}

td{
white-space:nowrap;
}

#main-container h1{
color:#777777;
font-size:22px;
font-weight:normal;
text-transform:uppercase;
margin-bottom:5px;
z-index:10;
}

#main-container h2{
font-weight:normal;
font-size:10px;
text-transform:uppercase;
color:#777777;
margin-bottom:15px;
border-bottom:2px solid #aaaaaa;
margin-bottom:15px;
padding-bottom:10px;
}

#main-container label{
text-transform:uppercase;
font-size:10px;
font-family:Tahoma,Arial,Sans-serif;
padding-right: 8px;
}

#main-container textarea{
color:#404040;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
}

td > button{
text-indent:8px;
}

#staff_contact{
width: 520px;
font-size: 13px;
font-family: Arial,Helvetica,sans-serif;
}

#staff_contact label{
font-weight: bold;
font-size: 14px;
}

#staff_contact a{
color:#444748;
background:url(../images/dotted.gif) repeat-x;
background-position: 0 bottom;
text-decoration: none;
margin-left:4px;
}

#staff_contact a:hover{
background:none;
color: #FFFFFF;
}

#staff_contact h2{
font-weight:bold;
font-size:14px;
text-transform:uppercase;
padding: 0;
color: #777777;
}

#staff_contact h3{
width: 150px;
font-size: 14px;
font-weight: bold;
color: #525860;
margin: 0;
padding: 0;
padding-bottom:6px;
border-bottom:2px solid #aaaaaa;
}

#staff_contact h3:first-letter{
color:#FFFFFF;
text-transform: uppercase;
}

#staff_contact_one{
width: 220px;
float: left;
padding: 0;
}

#staff_contact_two{
width: 230px;
float: left;
padding: 0;
}

#staff_contact_three{
width: 220px;
margin: 160px 0 0 150px;
padding: 0;
}

#form-container #captchainfo{
background: url(../images/captcha_ico.png);
width:36px;
height:36px;
position:absolute;
top:292px;
right:420px;
z-index:5;
}

/*404 ERROR PAGE*/
#primary{
display:inline;
float:left;
margin:10px 0px 0px 10px;
width:630px;
}
#primary h1:first-letter{
color:#FFFFFF;
}

.staticPage{
margin: 10px 0px 0px 90px;
}

.staticPage p{
margin-bottom: 1em;
}
.staticPage a{
color:#016482;
background:url(../images/dotted.gif) repeat-x;
background-position: 0 bottom;
text-decoration: none;
margin-left:4px;
font-size: 13px;
font-weight: bold;
}

.staticPage a:hover{
background:none;
color: #FFFFFF;
}

.staticPage h2#fourOhFour{
padding:440px 0px 10px;
background: url(../images/404.png) no-repeat top;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
color:#FC4E06;
}

.attention{
font-weight:bold;
color: red;
}

.proviso{
padding:2em 0 0;
font-style:italic;
font-size:80%;
color: #666;
}

@media screen and (-webkit-min-device-pixel-ratio:0){
.slideLink img
{
padding: 4px 6px 0 0;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0){
.slideLink{        
height:16px
}
}

@media screen and (-webkit-min-device-pixel-ratio:0){
.middle .slideText{
 padding: 6px 0 0 23px;
 }
}

@media screen and (-webkit-min-device-pixel-ratio:0){
#form-container #captchainfo{
top:262px;
}
}