/* reset -------------------------------------------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;} body{line-height:1;} ol, ul{list-style:none;} blockquote, q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse;border-spacing:0;} /* colors -------------------------------------------------- blu -> fff: 004F68 407B8E 7FA7B3 BFD3D9 E5EDF0 000 -> blu: 00080B 00141A 002834 003B4E 004F68 verde -> fff: A3C300 BAD240 D1E17F E8F0BF F6F9E5 000 -> verde: 111400 293100 526200 7A9200 A3C300 */ /* global -------------------------------------------------- */ html{background:#004F68;font-size:16px;} body{color:#003B4E;background:#fff url(./images/body.png) repeat-x 0 0;border-bottom:10px solid #004F68;text-align:center;font:12px/18px Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans serif;} h1{color:#407B8E;margin-bottom:18px;font:36px/36px "Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} h2{color:#A3C300;margin:36px 0 18px 0;font:24px/36px "Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} h3, h3 a{color:#407B8E;border:none;font:24px/36px "Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} p, ul, ol{margin-bottom:18px;} a{color:#7A9200;text-decoration:none;border-bottom-color:#7FA7B3;} a:hover{color:#004F68;border-bottom-color:#A3C300;} #container{width:960px;margin:0 auto;text-align:left;} #logo{position:absolute;top:20px;left:100px;border:none;} #slogan{position:absolute;left:-9999px;} #content{float:left;position:relative;margin:36px 0;} /* #branding */ #branding{position:relative;height:150px;background:#004e67 url(./images/branding.jpg) no-repeat 0 0;} #branding blockquote{position:absolute;left:-9999px;} /* nav */ #nav{position:relative;float:right;top:-31px;right:5px;clear:both;margin-bottom:-10px;} #nav li{float:left;padding:0 15px;} #nav li a{display:block;padding:5px 0px 5px 0px;border:none;color:#fff;text-decoration:none;text-transform:lowercase;font-size:16px;} #nav li a:hover{color:#BAD240;} body.chi-siamo #nav li.chi-siamo a, body.home #nav li.home a, body.servizi #nav li.servizi a, body.portfolio #nav li.portfolio a{color:#BAD240;} /* breadcrumb */ #breadcrumb{position:absolute;top:-36px;left:0;width:960px;height:36px;} #breadcrumb li{float:left;padding:0 15px 0 0;margin:0 10px 0 0;background:url(./images/breadcrumb.png) no-repeat 100% 50%;} #breadcrumb li.last{background:none;} #breadcrumb a{text-decoration:none;} #breadcrumb strong{font-weight:bold;} /* .box -------------------------------------------------- */ .box{width:300px;float:left;margin:0 20px 18px 0;background:url(./images/box.jpg) repeat-x top left;overflow:hidden;} .box li{padding:0 0 0 32px;margin:18px 0 0 0;background:#fff url(./images/icons/ico_<.jpg) no-repeat top left;} .box li a{display:block;color:#004F68;border-color:#BFD3D9;cursor:pointer;} .box li a:hover{color:#7A9200;border-color:#7FA7B3;} .box h3 em{font-size:12px;font-style:normal;line-height:18px;} /* box-main */ .box-main{width:620px;float:left;margin:0 20px 18px 0;background:url(./images/box.jpg) repeat-x top left;} /* #servizi.box */ #servizi.box{padding-bottom:18px;overflow:hidden;} #servizi.box ul.icons{width:300px;} #servizi.box ul.icons li{width:280px;height:144px;} #servizi.box ul.icons li a span{width:185px;} #servizi.box li.webdesign{background-position:-688px -1588px;} #servizi.box li.webmarketing{background-position:-688px -1792px;} #servizi.box li.multimedia{background-position:-334px -976px;} #servizi.box li.sviluppo{background-position:-688px -976px;} /* #contattaci.box */ #contattaci.box h3{margin-bottom:18px;} #contattaci.box ul{float:left;} #contattaci.box li{margin:9px 0 0 0;} #contattaci.box p{float:right;width:300px;} #contattaci.box p.phone{margin:-9px 0 0 0;color:#407B8E;font-size:32px;line-height:36px;letter-spacing:-1px;font-family:Arial,sans-serif;} #contattaci.box p.mail{margin:0 0 0 0;font-size:24px;line-height:36px;letter-spacing:1px;font-family:Arial,sans-serif;} #contattaci.box p.mail a{color:#BAD240;border:none;} #contattaci.box p.mail a:hover{color:#A3C300;border-bottom:1px dotted #BAD240;} /* #portfolio.box */ #portfolio.box{padding-bottom:18px;} #portfolio.box h3 a:hover{color:#004F68;} #portfolio.box h4{display:block;margin:9px 0 0 0;font-size:14px;font-weight:normal;letter-spacing:0.25px;} #portfolio.box img{width:148px;height:88px;border:1px solid #ccc;float:left;display:block;margin-top:8px;padding:0;} #portfolio.box p{margin:9px 0 0 160px;} #twitter.box li{background-image:url(./images/icons/ico-twitter.png);} #delicious.box li{background-image:url(./images/icons/ico-delicious.png);} #info.box h3{margin-bottom:18px;} #lorem.box{width:940px;} /* #site-info */ #site-info{position:relative;clear:both;height:180px;} #site-info .extra{position:absolute;width:212px;height:193px;bottom:0px;right:0px;background:url(./images/icons.gif) no-repeat bottom right;} /* ul.icons */ ul.icons{float:left;margin:0 0 18px 0;} ul.icons li{float:left;margin:0 20px 0 0;width:280px;height:126px;text-align:left;} ul.icons li a{cursor:pointer;} ul.icons li > a{display:block;width:100%;height:100%;border:none;} ul.icons li a strong{display:block;float:left;width:200px;padding-left:80px;font-size:14px;font-weight:bold;cursor:pointer;font-family:"Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} ul.icons li span{display:block;float:left;width:200px;padding-left:80px;color:#003B4E;} ul.icons li a:hover strong{color:#BAD240;} ul.icons li a:hover span{color:#407B8E;} /* ul.icons li{background:url(./images/icons/ico_42.jpg) no-repeat 9px 20px;} ul.icons li.webmarketing {background-image:url(./images/icons/ico_37.jpg);} ul.icons li.statistiche {background-image:url(./images/icons/ico_27.jpg);} ul.icons li.sem {background-image:url(./images/icons/ico_39.jpg);} ul.icons li.seo {background-image:url(./images/icons/ico_12.jpg);} ul.icons li.newsletter {background-image:url(./images/icons/ico_23.jpg);} ul.icons li.socialnetwork {background-image:url(./images/icons/ico_18.jpg);} ul.icons li.webdesign {background-image:url(./images/icons/ico_25.jpg);} ul.icons li.layout {background-image:url(./images/icons/ico_24.jpg);} ul.icons li.mobile {background-image:url(./images/icons/ico_26.jpg);} ul.icons li.standard {background-image:url(./images/icons/ico_40.jpg);} ul.icons li.usabilita {background-image:url(./images/icons/ico_22.jpg);} ul.icons li.accessibilita {background-image:url(./images/icons/ico_28.jpg);} ul.icons li.hosting {background-image:url(./images/icons/ico_38.jpg);} ul.icons li.multimedia {background-image:url(./images/icons/ico_13.jpg);} ul.icons li.audio {background-image:url(./images/icons/ico_36.jpg);} ul.icons li.video {background-image:url(./images/icons/ico_33.jpg);} ul.icons li.foto {background-image:url(./images/icons/ico_34.jpg);} ul.icons li.sviluppo {background-image:url(./images/icons/ico_15.jpg);} ul.icons li.api {background-image:url(./images/icons/ico_30.jpg);} ul.icons li.cms {background-image:url(./images/icons/ico_20.jpg);} ul.icons li.mashup {background-image:url(./images/icons/ico_29.jpg);} ul.icons li.chi {background-image:url(./images/icons/ico_16.jpg);} ul.icons li.cosa {background-image:url(./images/icons/ico_44.jpg);} ul.icons li.come {background-image:url(./images/icons/ico_35.jpg);} ul.icons li.dove {background-image:url(./images/icons/ico_17.jpg);} ul.icons li.quando {background-image:url(./images/icons/ico_14.jpg);} ul.icons li.perche {background-image:url(./images/icons/ico_19.jpg);} */ ul.icons li{background: url(./images/icons.gif) no-repeat top left;} ul.icons li.accessibilita {background-position: 0 -150px;} ul.icons li.api {background-position: 0 -354px;} ul.icons li.audio {background-position: 0 -558px;} ul.icons li.chi {background-position: 0 -762px;} ul.icons li.cms {background-position: 0 -966px;} ul.icons li.come {background-position: 0 -1170px;} ul.icons li.cosa {background-position: 0 -1374px;} ul.icons li.dove {background-position: 0 -1578px;} ul.icons li.foto {background-position: 0 -1782px;} ul.icons li.hosting {background-position: -354px -150px;} ul.icons li.layout {background-position: -354px -354px;} ul.icons li.mashup {background-position: -354px -558px;} ul.icons li.mobile {background-position: -354px -762px;} ul.icons li.multimedia {background-position: -354px -966px;} ul.icons li.newsletter {background-position: -354px -1170px;} ul.icons li.perche {background-position: -354px -1374px;} ul.icons li.quando {background-position: -354px -1578px;} ul.icons li.sem {background-position: -354px -1782px;} ul.icons li.seo {background-position: -708px -150px;} ul.icons li.socialnetwork {background-position: -708px -354px;} ul.icons li.standard {background-position: -708px -558px;} ul.icons li.statistiche {background-position: -708px -762px;} ul.icons li.sviluppo {background-position: -708px -966px;} ul.icons li.usabilita {background-position: -708px -1170px;} ul.icons li.video {background-position: -708px -1374px;} ul.icons li.webdesign {background-position: -708px -1578px;} ul.icons li.webmarketing {background-position: -708px -1782px;} /* #promo-servizi */ #promo-servizi{width:580px;clear:both;margin:18px 0 36px 0;padding:18px 20px;height:108px;background:url(./images/ul.png) no-repeat;} #promo-servizi li{height:90px;width:145px;position:relative;/*background-position:top center;*/margin:0;cursor:pointer;} #promo-servizi li.webdesign{background-position:-678px -1588px;} #promo-servizi li.webmarketing{background-position:-678px -1792px;} #promo-servizi li.multimedia{background-position:-324px -976px;} #promo-servizi li.sviluppo{background-position:-678px -976px;} #promo-servizi li a{display:block;width:100%;height:100%;} #promo-servizi li strong{position:absolute;float:none;bottom:0;text-align:center;width:100%;padding-left:0;color:#407B8E;font-size:16px;font-weight:normal;letter-spacing:0.5px;font-family:"Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} #promo-servizi li a:hover strong{color:#003B4E;} /* body.home */ body.home #content-main{width:620px;} body.home #content-main p{margin:0 20px 18px 0;} body.home #content-main .pic{float:left;margin:0 20px 0px 0;} /* body.portfolio */ body.portfolio #content-main{width:620px;overflow:hidden;} body.portfolio #content-main .items{float:left;width:640px;overflow:hidden;} body.portfolio #content-main .items li{float:left;width:320px;height:306px;/*margin:18px 20px 18px 0px;*/} body.portfolio #content-main .items li a{color:#A3C300;} body.portfolio #content-main .items li a strong{display:block;font-weight:normal;font:24px/36px "Century Gothic","Futura Lt BT","Lucida Sans",Verdana,sans-serif;} body.portfolio #content-main .items li a img{/*width:280px;*/width:298px;height:178px;display:block;margin-bottom:17px;padding:0;border:1px solid #ccc;} body.portfolio #content-main .items li a:hover{color:#7FA7B3;} body.portfolio #content-main .items li a:hover img{border-color:#7FA7B3;} body.portfolio #content-main .items li p{width:280px;} body.portfolio #content-main h2.line{clear:both;float:left;width:100%;color:#407B8E;font-size:36px;line-height:36px;margin:36px 0 18px 0;background:transparent url(./images/box.jpg) repeat-x left top;} body.portfolio #content-main #collaborations li{float:none;width:auto;height:auto;margin:0 0 9px 0;padding:0;} body.portfolio #content-main #collaborations li a{color:#A3C300;display:inline;} body.portfolio #content-main #collaborations li a strong{display:inline;font-weight:normal;font-size:100%;line-height:1em;} body.portfolio #content-main #collaborations li a img{display:none;} body.portfolio #content-main #collaborations li a:hover{color:#7FA7B3;} body.portfolio #content-main #collaborations li p{width:auto;margin:0;padding:0;} /* body.chi-siamo */ body.chi-siamo #content-main{width:620px;} body.chi-siamo #content-main #items h2{margin-bottom:0;} body.chi-siamo #content-main #items h3{position:relative;top:-36px;margin-bottom:-36px;} body.chi-siamo #content-main li{margin:0 0 54px 0;clear:both;} body.chi-siamo #content-main li p{margin:0 20px 18px 320px;} body.chi-siamo #content-main .pic{float:left;margin:0 20px 18px 0;} body.chi-siamo div.pic img {border:1px solid #D1E17F;} /* body.sitemap */ body.sitemap #content-main ul{list-style:square;margin-left:30px;} /* varie */ .mdr{position:absolute;left:-9999px;}