/* CSS Document */ /* --------------------------------------------- 01. main/default elements --------------------------------------------- */ body { background:#1070AA url(http://www.info-alberghi.com/code/images/bg_body.gif) repeat-x top; font-family:Verdana, Arial, Helvetica, sans-serif} p { font-size:11px; color:#374054} p a { color:#3FA7E6; text-decoration:underline; font-weight:bold} p a:hover { color:#3FA7E6; text-decoration: none} h1 { font-size:20px; color:#384155} h4 { font-size:15px; color:#3A4357} h5 { font-size:14px; color:#FEFEFE} h6 { font-size:13px; color:#384155} /* --------------------------------------------- 02. container and wrapper --------------------------------------------- */ #container { width:100%; height:400px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_container.jpg) no-repeat top center} #wrapper { width:970px; margin:0 auto} /* --------------------------------------------- 03. header --------------------------------------------- */ #header { width:945px; height:79px; float:left; padding-right:25px; position:relative} #header .logo { float:left; padding-top:2px; margin-left:-31px; margin-bottom:-14px; position:relative} #header .icons { float:right; padding-top:30px} #header .icons ul li { float:left; padding-left:10px} #header .icons ul li a { float:left; padding:6px 5px 5px 5px} #header .icons ul li a:hover { background:url(http://www.info-alberghi.com/code/images/header_icon_hover.gif) no-repeat} /* --------------------------------------------- 04. box 1 --------------------------------------------- */ #box1 { width:970px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_box1.jpg) repeat-y; margin-bottom:5px} #box1 .box1_bordertop { width:930px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_box1_bordertop.jpg) no-repeat top left; padding:0 20px} #box1 .box1_borderbottom { width:970px; height:34px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_box1_borderbottom.jpg) no-repeat bottom left} /* --------------------------------------------- 04.1 box 1 - navbar --------------------------------------------- */ #navbar { width:880px; height:35px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_navbar.jpg) no-repeat; padding-left:60px; padding-bottom:12px} #navbar ul li { float:left; font-size:11px; font-weight:normal; color:#FFFFFF} #navbar ul li a { height:20px; float:left; color:#FFFFFF; text-decoration:none; padding:7px 6px 0 6px; position:relative} #navbar ul li a:hover { color:#FFFFFF; text-decoration:none; background:#5593B2 url(http://www.info-alberghi.com/code/images/bg_nav_hover.png) repeat-x} #navbar ul li a.selected { color:#FFFFFF; text-decoration:none; background:#5593B2 url(http://www.info-alberghi.com/code/images/bg_nav_hover.png) repeat-x} /* --------------------------------------------- 04.2 box 1 - top-box --------------------------------------------- */ #top-box { width:930px; height:218px; float:left; padding-bottom:5px} #top-box ul li { float:left; font-family:Arial, Helvetica, sans-serif} #top-box ul li a { width:465px; height:218px; float:left; color:#FFFFFF; text-decoration:none; cursor:pointer} #top-box ul li a.left { width:445px; background:url(http://www.info-alberghi.com/code/images/bg_top-box_left.jpg) no-repeat; padding-left:20px} #top-box ul li a.left:hover { background:url(http://www.info-alberghi.com/code/images/bg_top-box_left_hover.jpg) no-repeat} #top-box ul li a.right { background:url(http://www.info-alberghi.com/code/images/bg_top-box_right.jpg) no-repeat} #top-box ul li a.right:hover { background:url(http://www.info-alberghi.com/code/images/bg_top-box_right_hover.jpg) no-repeat} #top-box ul li a span { width:180px; float:left; font-size:48px; letter-spacing:-2px; color:#F5D50A; padding-left:10px; padding-top:17px; text-shadow:#054769 -2px -1px 2px} #top-box ul li a:hover span { color:#FFFFFF} #top-box ul li a p { width:240px; float:left; font-size:12px; color:#FFFFFF; padding:20px 0px 38px 0px} #top-box ul li a h2 { float:right; font-size:24px; color:#FFFFFF; letter-spacing:-1px; word-spacing:-3px; text-shadow:#105375 2px 1px 2px} #top-box ul li a .set { width:237px; float:left; padding-right:15px} #top-box ul li a .set2 { width:240px; float:left; padding-left:20px} /* --------------------------------------------- 04.3 box 1 - hotellist --------------------------------------------- */ #hotellist { width:930px; float:left} #hotellist ul li { width:204px; height:209px; float:left; padding-right:38px; margin-top:8px} #hotellist ul li.topbox1 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -888px;} #hotellist ul li.topbox2 { background:url(http://www.info-alberghi.com/code/images/bg_topbox2.png) no-repeat} #hotellist ul li.topbox3 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -1346px;} #hotellist ul li.topbox4 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -10px; padding-right:0} #hotellist ul li.topbox5 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -1575px;} #hotellist ul li.topbox6 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -1804px;} #hotellist ul li.topbox7 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -2033px;} #hotellist ul li.topbox8 { background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -239px; padding-right:0} #hotellist ul li a { width:174px; height:89px; float:left; text-decoration:none; padding:120px 20px 0 10px} #hotellist ul li a:hover { background:url(http://www.info-alberghi.com/code/images/bg_topbox_hover.png) no-repeat bottom left} #hotellist ul li a h4 { font-family:Arial, Helvetica, sans-serif; font-weight:bold; padding-bottom:5px} #hotellist ul li a:hover h4 { color:#FFFFFF} #hotellist ul li a p { font-size:11px; color:#384155} #hotellist ul li a p span { font-weight:bold} /* --------------------------------------------- 05. box 2 --------------------------------------------- */ #box2 { width:970px; float:left; position:relative; margin-bottom:-30px; } #box2 .box2_bordertop { width:970px; height:29px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -468px;} #box2 .box2_bordermiddle { width:930px; float:left; background:url(http://www.info-alberghi.com/code/images/bg_box2_bordermiddle.png) repeat-y; padding:0 20px; } /* --------------------------------------------- 05.1 box 2 - leftpanel --------------------------------------------- */ #leftpanel { width:640px; float:left; padding-right:30px} /* --------------------------------------------- 05.1.1 box 2 - leftpanel - residence --------------------------------------------- */ #residence { width:640px; float:left; background:url(http://www.info-alberghi.com/code/images/divider.gif) no-repeat bottom; padding-bottom:8px} #residence .photo { width:108px; height:92px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -517px; padding:3px 18px 3px 3px} #residence #titolo { font-family:Arial, Helvetica, sans-serif; line-height:.8em; padding-bottom:15px; font-weight:bold; color:#384155;} #residence #titolo span { font-size:11px; color:#9F9F9F; font-weight:normal;} #residence p { line-height:1.4em; padding-bottom:14px} /* --------------------------------------------- 05.1.1 box 2 - leftpanel - news-romina --------------------------------------------- */ .eventinews { width:640px; float:left; background:url(http://www.info-alberghi.com/code/images/divider.gif) no-repeat bottom; padding-bottom:8px} .eventinews .photo { width:108px; height:92px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -517px; padding:3px 18px 3px 3px} .eventinews .titolo { font-family: Arial, Helvetica, sans-serif; line-height:.8em; padding-bottom:1px; font-size:16px; font-weight:bold; color:#384155;} .eventinews .titolo span { font-size:11px; color:#9F9F9F; font-weight:normal;} .eventinews p { line-height:1.4em; padding-bottom:4px; padding-top: 3px;} .titolonews {font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#384155;} .contenutonews {line-height:1.4em;} /* --------------------------------------------- 05.1.1 box 2 - leftpanel - residence - set --------------------------------------------- */ #leftpanel .set { width:640px; float:left; background:url(http://www.info-alberghi.com/code/images/divider.gif) no-repeat bottom; padding-bottom:8px; padding-top:12px} #leftpanel .set .photo { float:left; padding-bottom:8px} #leftpanel .set h4 { font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold; color:#384155; padding-bottom:15px} #leftpanel .set h4 span { font-size:11px; font-weight:normal; color:#9F9F9F} #leftpanel .set p { line-height:1.4em; padding-bottom:15px} #leftpanel .set .set_left { width:304px; float:left; padding-right:32px} #leftpanel .set .set_right { width:304px; float:left} /* --------------------------------------------- 05.2 - rightpanel --------------------------------------------- */ #rightpanel { width:260px; float:left} #rightpanel h5 { width:250px; height:23px; float:left; font-weight:bold; background-image:url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -635px; padding-left:10px; padding-top:5px; padding-bottom:4px} /* --------------------------------------------- 05.2.1 - rightpanel - video box --------------------------------------------- */ #videobox { width:260px; float:left; padding-bottom:20px} #videobox .video { float:left} /* --------------------------------------------- 05.2.2 - rightpanel - news --------------------------------------------- */ #news { width:260px; float:left; padding-bottom:15px} #news h6 { font-family:Arial, Helvetica, sans-serif; font-weight:bold; padding-bottom:2px} #news h6 span { font-size:11px; font-weight:normal; color:#9F9F9F} #news p a { color:#374054; text-decoration:none; font-weight:normal} #news p a:hover { color:#374054; text-decoration:underline} #news .set { width:260px; float:left; padding-bottom:5px} #news .set .photo { width:70px; float:left; border:1px solid #B4B0A5; padding:3px; margin-right:15px} /* --------------------------------------------- 05.2.3 - rightpanel - web cam --------------------------------------------- */ #webcam { width:260px; float:left; padding-bottom:10px} #webcam .photo_left {float:left; padding-bottom:9px} #webcam .photo_left img {float:left;} /* --------------------------------------------- 05.2.4 - rightpanel - metro --------------------------------------------- */ #metero { width:260px; float:left; padding-bottom:20px} #metero .photo { float:left} /* --------------------------------------------- 05.2.5 - rightpanel - condividi --------------------------------------------- */ #condividi { width:260px; float:left; padding-bottom:13px} #condividi .set { width:260px; float:left; padding-bottom:7px} #condividi .icon { width:48px; float:left; padding-right:8px} #condividi .list { float:left} #condividi .list h6 a { font-size:12px; color:#035692; text-decoration:none} #condividi .list h6 a:hover { font-size:12px; color:#3FA7E6; text-decoration:none} /* --------------------------------------------- 05.2.6 - rightpanel - newsletter --------------------------------------------- */ #newsletter { width:260px; float:left} #newsletter p { padding-bottom:8px} #newsletter p span { font-weight:bold} #newsletter fieldset { width:230px; float:left; padding-left:10px} #newsletter fieldset .input { width:225px; height:16px; float:left; border:1px solid #C42529; padding:3px; margin-bottom:10px} #newsletter fieldset .checkbox { float:left} #newsletter fieldset p { float:left; padding-left:5px; line-height:1.5em} #newsletter fieldset .button a { width:62px; height:18px; float: right; background:url(http://www.info-alberghi.com/code/images/bg_button_invia.gif) no-repeat; font-size:10px; color:#FFFFFF; text-align:center; text-decoration:none; padding-top:4px} /* --------------------------------------------- 06. footer --------------------------------------------- */ #bg_footer { width:100%; float:left; background:#EEEEEE url(http://www.info-alberghi.com/code/images/bg_footer.gif) repeat-x top;padding:30px 0 110px 0} #footer { width:970px; margin:0 auto; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -725px; padding-top:25px} #footer .logo_footer { float:left; padding-right:39px; padding-left:20px; padding-top:20px} #footer h5 { font-size:12px; font-weight:bold; color:#374054} /* --------------------------------------------- 06.1 footer - nav list --------------------------------------------- */ #footer .list { width:161px; float:left; padding-left:24px; padding-top:20px} #footer .list h5 { background: url(http://www.info-alberghi.com/code/images/bg_dottedborder.gif) repeat-x bottom left; padding-bottom:4px; margin-bottom:2px} #footer .list ul li { width:151px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -2403px; font-size:11px; color:#374054; line-height:1.5em; padding-left:10px} #footer .list ul li a { color:#374054; text-decoration:none} #footer .list ul li a:hover { color:#3FA7E6; text-decoration:underline} /* --------------------------------------------- 06.2 footer - grey bar --------------------------------------------- */ #footer .greybar { width:960px; height:27px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -774px; margin-top:15px; padding-top:15px; padding-bottom:29px} #footer .greybar h5 { text-align:center} #footer .greybar h5 a { color:#374054; text-decoration:none} #footer .greybar h5 a:hover { color:#3FA7E6; text-decoration:none} /* --------------------------------------------- 06.3 footer - bottom content --------------------------------------------- */ #footer .footer_bottomcontent { width:960px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -855px; padding-top:10px} #footer .footer_bottomcontent p { color:#000000; text-align:center} /* --------------------------------------------- AGGIUNTI DOPO PER NEWSLETTER E SOCIAL --------------------------------------------- */ #container_social{ margin:32px 0 0 0; font-size:10px; } .social_facebook{ height:50px; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -2262px; padding:7px 0 0 57px; } .social_facebook .link_facebook a{ font-weight:800; text-decoration:none; color:#035692; line-height:12px; font-size: 10px; } .social_facebook .link_facebook a:hover{ font-weight:800; text-decoration:none; color:#3fa7e6; line-height:12px; } .social_twitter{ height:50px; padding:18px 0 0 57px; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -2330px;} .social_twitter .link_twitter a{ font-weight:800; text-decoration:none; color:#3fa7e6; line-height:12px; font-size: 10px; } .social_twitter .link_twitter a:hover{ font-weight:800; text-decoration:none; color:#035692; line-height:12px; } #container_newsletter{ position:relative; font-size:10px; } #container_newsletter .textfield_newsletter{ margin-top:10px; color:#333; } #container_newsletter .textfield_newsletter input{ font-size:11px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#333; width:255px; height:20px; border:1px solid #c42529; } #container_newsletter .invia_newsletter{ margin:10px 0 0 195px; } #container_newsletter .invia_newsletter input{ background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -683px; height:22px; width:62px; border:0; font-size:1px; color:#c42529; cursor:pointer; } #container_newsletter .privacy{ position:absolute; top:112px; left:0px; color:#374054; } #container_newsletter .privacy a{ color:#374054; text-decoration:none; } #container_newsletter .privacy a:hover{ color:#374054; text-decoration:underline; } .puliscifloat{ clear:both; } #lingue{ position:absolute; right:20px; top:30px; } .bandiera{ float:left; } .bandiera a:hover{ background:url(http://www.info-alberghi.com/IA2010/immagini/bandiere_hover.gif) transparent no-repeat center center; width:34px; height:28px; display:block; } #box1 .box1_bordertop_NEW { width:930px; border:0px solid gray; margin: 0 auto; /*float:left; */ background:url(http://www.info-alberghi.com/code/images/bg_box1_bordertop_NEW.jpg) no-repeat top left; padding:20px 20px; } .special_and_last { width:930px; float:left; background:url(http://www.info-alberghi.com/code/images/divider_home.gif) no-repeat bottom; padding-bottom:8px; margin-bottom: 5px;} .special_and_last .photo { width:108px; height:92px; float:left; background-image: url(http://www.info-alberghi.com/code/images/sprite-index.png); background-position: -10px -517px; padding:3px 18px 3px 3px} .special_and_last .titolo { font-family: Arial, Helvetica, sans-serif; line-height:.8em; padding-bottom:1px; font-size:16px; font-weight:bold; color:#384155;} .special_and_last .titolo span { font-size:11px; color:#9F9F9F; font-weight:normal;} .special_and_last p { line-height:1.4em; padding-bottom:4px; padding-top: 3px;} .titolonews {font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#384155;} .contenutonews {line-height:1.4em;} #offers_hp{ border:0px solid gray; margin: 0 auto; width: 930px; height: 440px; } #last_minutes_hp{ margin-bottom: 20px; margin: 0 auto; padding-left: 7px; /*float:right;*/ display: block; /*width: 465px;*/ border:0px solid gray; padding-bottom: 20px; } #special_offers_hp{ /*padding-left: 40px;*/ margin: 0 auto; padding-left: 7px; /*float:right;*/ display: block; /*width: 465px;*/ border:0px solid gray; padding-bottom: 20px; }