/* vilaambient.ro - Website global CSS declarations file: styles.css (for crossbrwsing fixes see styles.ie.css, styles.ie6.css) Copyright (C) 2010 Incremental Ltd. */ /* TOC S1. STYLE RESET S2. GLOBAL ELEMENTS S3. MAIN BOX LAYOUT S4. FORMS S5. TABLES S6. ANCHORS S7. HEADINGS S8. PARAGRAPHS S9. IMAGES S10. PAGE SPECIFIC STYLES */ /* S1. DEFAULT STYLES 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; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } /* S2. GLOBAL STYLES ------------------------------------------------ */ .fl { float: left; } .fr { float: right; } .cl { clear: left; } .cr { clear: right; } .cb { clear: both; } .tl { text-align: left; } .tr { text-align: right; } .tc { text-align: center; } .vt { vertical-align: top; } .vb { vertical-align: bottom; } .vm { vertical-align: middle; } .p50 { width: 50%; } .p80 { width: 80%; } .p90 { width: 90%; } .p100 { width: 100%; } .black { color: #000; } .white { color: #FFF; } .lightgray { color: #808080; } .darkgray { color: #2D2D2D; } .darkyellow { color: #B78B34; } .darkred { color: #992d2b; } /*.scroll-x { overflow-x:scroll; } .scroll-y { overflow-y:scroll; }*/ .indent { text-indent: 40px; } /* S3. GRID LAYOUT ------------------------------------------------ */ html { height: 100%; } body { font-family:Georgia, "Times New Roman", Times, serif; font-size: 12px; color: #2D2D2D; min-width: 775px; min-height: 100%; cursor:default; background:url(images/bg_body.jpg); background-color: #f2eada; } #centerAlign { text-align:center; } #main { width: 775px; margin: 0 auto; text-align: left; } #header { float: left; width: 703px; height: 280px; padding: 0 36px; background: url(images/back_header.jpg) bottom left no-repeat; } #header_menu_left { float: left; width: 165px; height: 280px; } #header_menu_right { float: left; width: 165px; height: 280px; } ul.menu_list { float: left; width: 165px; height: 200px; margin-top: 30px; } ul.menu_list li { float: left; width: 165px; height: 40px; background: url(images/back_menu_list_item.gif) bottom left repeat-x; } ul.menu_list li a { display: block; width: 165px; height:39px; background-position: top left; behavior: url("/templates/default/iepngfix.htc"); } ul.menu_list li a:hover, ul.menu_list li a.selected { display: block; width: 165px; height:39px; background-position: bottom left; } li#villa a { background-image:url(images/menu_villa.png); } li#location a { background-image:url(images/menu_location.png); } li#rooms a { background-image:url(images/menu_rooms.png); } li#services a { background-image:url(images/menu_services.png); } li#entertainment a { background-image:url(images/menu_entertainment.png); } li#photo a { background-image:url(images/menu_photo.png); } li#offers a { background-image:url(images/menu_offers.png); } li#reservations a { background-image:url(images/menu_reservations.png); } li#contact a { background-image:url(images/menu_contact.png); } li#info a { background-image:url(images/menu_info.png); } #header_logo { float: left; width: 373px; height: 228px; padding-top:52px; text-align: center; } #logo { width: 191px; height: 119px; margin:0 auto; padding-bottom: 16px; } #logo img { border: 0; behavior: url("/templates/default/iepngfix.htc"); } #lang_selector { width: 34px; height: 14px; margin: 0 auto; } #lang_ro { float: left; display: block; width: 16px; height: 14px; margin-right:2px; background: url(images/flag_ro.png) top left no-repeat; } #lang_en { float: left; display: block; width: 16px; height: 14px; background: url(images/flag_en.png) top left no-repeat; } #subheader { float: left; width: 775px; height: 150px; } #shEmpty { width: 775px; height: 150px; background: url(images/sh_empty.jpg) top center no-repeat; } #shHome { width: 775px; height: 150px; background: url(images/sh_home.jpg) top center no-repeat; } #shLocation { width: 775px; height: 150px; background: url(images/sh_location.jpg) top center no-repeat; } #shRooms { width: 775px; height: 150px; background: url(images/sh_rooms.jpg) top center no-repeat; } #shEntertainment { width: 775px; height: 150px; background: url(images/sh_entertainment.jpg) top center no-repeat; } #shGallery { width: 775px; height: 150px; background: url(images/sh_gallery.jpg) top center no-repeat; } #content{ float: left; width: 775px; } #pageTopSpacer { width: 775px; height: 36px; background: url(images/bg_content_top.png ) repeat-x; } #pageWrapper { width: 703px; padding: 0 36px 26px 36px; background: url(images/bg_page_content.png ); } #pageTitle { width: 703px; padding-bottom: 20px; margin-bottom: 20px; background: url(images/spacer_title_h_large.png ) bottom center no-repeat; text-align: center; } #pageTitle img { width: 250px; height: 20px; margin:0 auto; } #pageIntro { width: 703px; margin-bottom:36px; } #pageContent { width: 703px; } #pageIntroSecond { width: 703px; margin:36px 0; } #pageContentSecond { width: 703px; } #footer { float: left; width: 775px; height: 42px; background: url(images/bg_page_content.png ); text-align: center; } #footerContent { width: 703px; margin:0 auto; height: 29px; border-top: 1px solid #C1C1C1; padding-top: 12px; font-family: "Trebuchet MS"; font-size: 10px; color: #919191; } #footerLeft { float: left; } #footerLeft p { float:left; margin-top: 3px; font-family:Georgia, "Times New Roman", Times, serif; font-size: 11px; color: #2D2D2D; } #footerLeft div { float: left; margin-left: 6px; } #footerLeft a { float: left; display: block; width: 16px; height: 32px; margin-right: 6px; background: top left no-repeat; } #footerLeft a.facebook { background-image: url( images/social_facebook_icon.png ); } #footerLeft a.linkedin { background-image: url( images/social_linkedin_icon.png ); } #footerLeft a.twitter { background-image: url( images/social_twitter_icon.png ); } #footerLeft a.gplus { background-image: url( images/social_gplus_icon.png ); } #footerRight { float: right; } #footerCenter { float: left; padding-left: 30px; } /* S4. FORMS ------------------------------------------------ */ #reservationForm input, #reservationForm textarea, #reservationForm select { margin-left: 5px; border: 0; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; } #reservationForm select { height: 24px; padding: 3px; border: 1px solid #eae0c9; } #reservationForm select.short { width: 50px; } #reservationForm select.medium { width: 95px; } #reservationForm select.long { width: 210px; padding-top:5px; } #reservationForm select#extraServices { height: 80px; font-size: 10px; } #reservationForm textarea { width: 200px; height: 93px; padding: 5px; background: url(images/back_textarea.png) top left no-repeat; } #reservationForm input.text { height: 24px; border: 0; padding:0 5px; } #reservationForm input.long { width: 200px; background: url(images/back_input_long.png) top left no-repeat; } #reservationForm input.short { width: 34px; background: url(images/back_input_short.png) top left no-repeat; } /* S5. TABLES ------------------------------------------------ */ /* S6. ANCHORS ------------------------------------------------ */ a { color: #b78b34; text-decoration: underline; } a:hover { color: #b78b34; text-decoration: none; } /* S7. HEADINGS ------------------------------------------------ */ /* S8. PARAGRAPHS ------------------------------------------------ */ #pageIntro p, #pageIntroSecond p { line-height: 22px; font-style: italic; font-size: 12px; text-indent: 40px; } br.lineSpacer { line-height: 12px; } #pageIntro p.pageIntroTitle { padding: 20px 0 5px 0; color: #b78b34; font-weight: bold; } /* S9. IMAGES ------------------------------------------------ */ img.endbullet { width: 33px; height: 13px; margin-bottom:-2px;} img.payment { margin: 3px 0 10px 0; } /* S10. PAGE SPECIFIC STYLES ------------------------------------------------ */ /* HOME PAGE*/ #home {} #home #LC { float: left; width: 251px; padding-right: 26px; } #home #RC { float: left; width: 400px; padding-left: 26px; background: url(images/spacer_home_v_medium.png) center left no-repeat; } div.homeBrdBtmSmall { padding-bottom: 18px; margin-bottom: 18px; background: url(images/spacer_home_h_small.png) bottom center no-repeat; } div.homeBrdRghSmall { padding-right:25px; margin-right: 25px; background: url(images/spacer_home_v_small.png) center right no-repeat; } div.homeBox { width: 251px; } img.homeBoxTitle { clear: left; width: 120px; height: 32px; margin-bottom: 20px; behavior: url("/templates/default/iepngfix.htc"); } p.homeText { line-height: 18px; font-style: italic; font-size: 11px; } div.homeBoxWelcome { float: left; padding-bottom: 28px; margin-bottom: 28px; } img.homeBoxTitleWelcome { clear: left; width: 137px; height:15px; margin-bottom: 25px; behavior: url("/templates/default/iepngfix.htc"); } p.homeTextWelcome { line-height: 22px; font-style: italic; font-size: 12px; text-indent: 40px; } div.homeBoxCellar { float: left; width: 215px; } p.homeTextCellar { line-height: 22px; font-style: italic; font-size: 11px; } div.homeBoxReservation { float: left; width: 120px; } p.homeTextReservation { line-height: 18px; font-style: italic; font-size: 11px; } div.homeBoxVideoTour { width: 251px; } div.homeBoxVideoTour div.videoHolder { width: 232px; height: 148px; margin: 0 auto; padding: 1px; border: 1px solid #beb074; background-color: #FFF; } div.homeBoxVideoTour div.videoHolder a { display: block; width: 232px; height: 148px; background: url(images/home_video_tour.png) top left no-repeat; } div.homeBoxVideoTour div.videoHolder a:hover { background: url(images/home_video_tour_over.png) top left no-repeat; } a.homePhotoTour { display: block; width: 114px; height: 70px; margin: 0 auto; } a.homePhotoTour img { float: left; width:104px; height: 70px; border: 0; } a.homeBookNow { display: block; width: 90px; height: 25px; margin: 20px auto 0 auto; } a.homeBookNow img { float: left; width: 90px; height: 25px; border: 0; } ul.homeList { margin-left: 15px; } ul.homeList li { padding-left: 12px; line-height: 18px; font-style: italic; font-size: 11px; background: url(images/bullet_home_list.png) 0 7px no-repeat; behavior: url("/templates/default/iepngfix.htc"); } ul.privacyList { margin-left: 50px; } ul.privacyList li { padding-left: 12px; line-height: 18px; font-style: italic; font-size: 12px; background: url(images/bullet_home_list.png) 0 7px no-repeat; behavior: url("/templates/default/iepngfix.htc"); } /*REGULAR PAGE*/ div.pageBrdBtmSmall { padding-bottom: 35px; margin-bottom: 35px; background: url(images/spacer_home_h_small.png) bottom center no-repeat; } div.pageBrdBtmLarge { padding-bottom: 35px; margin-bottom: 35px; background: url(images/spacer_title_h_large.png ) bottom center no-repeat; } div.pageBrdLeftLarge { width: 316px; background: url(images/spacer_page_v_large.png) top left no-repeat; } div.pageBrdLeftMedium { width: 316px; background: url(images/spacer_page_v_medium.png) top left no-repeat; } div.pageBrdLeftSmall { width: 316px; background: url(images/spacer_home_v_small.png) center left no-repeat; } div.pageBoxLeft { width: 315px; } div.pageBoxRight { width: 315px; padding-left: 36px; } div.pageBoxWide { width: 703px; } img.pageBoxTitle { clear: left; width: 250px; height: 32px; margin-bottom: 20px; behavior: url("/templates/default/iepngfix.htc"); } p.pageText { line-height: 22px; font-size: 11px; } a.pageBoxThumb { float: left; display: block; width: 258px; height: 174px; outline: none; margin-top: 35px; margin-left:28px; } a.pageBoxThumb img { width: 258px; height: 174px; border: 0; } /*LOCATION*/ #locationPage {} #locationPage #LC { float: left; width: 315px; padding-right: 36px; } #locationPage #RC { float: left; width: 352px; } a.locationMap { display: block; width: 280px; height: 352px; margin: 20px auto; } a.locationMap img { float: left; width: 280px; height: 352px; border: 0; } #locationGallery { width: 288px; margin:0 auto; } #locationGallery a { float: left; display: block; width: 124px; height: 124px; padding: 10px; outline: none; } #locationGallery a img { width: 124px; height: 124px; border: 0; } /*ROOMS*/ #roomsPage {} #roomsPage #LC { float: left; width: 315px; padding-right: 36px; } #roomsPage #RC { float: left; width: 352px; } /*SERVICES & FACILITIES*/ #facilitiesPage {} #facilitiesPage #LC { float: left; width: 315px; padding-right: 36px; } #facilitiesPage #RC { float: left; width: 352px; } #facilitiesPage p.list { line-height: 20px; } #facilitiesPage #RC p.pageText { padding-bottom: 20px; } #facilitiesPage #RC span.sectionTitle { color: #b78b34; font-style:italic; } /*ENTERTAINMENT*/ #entertainmentPage {} #entertainmentPage #LC { float: left; width: 315px; padding-right: 36px; } #entertainmentPage #RC { float: left; width: 352px; } #entertainmentPage a.pageBoxThumb { margin-top: 0; } /*GALLERY*/ #galleryPage {} div.galleryHolder { float: left; width: 703px; } div.galleryHolder a { float: left; width: 124px; height: 124px; margin: 20px 0 0 20px; outline: none; } div.galleryHolder a.first { margin-left: 0; } div.galleryHolder a img { width: 124px; height: 124px; border: 0; } #gallery img.pageBoxTitle { margin-bottom: 0; } #galleryPage div.videoHolder { float: left; width: 177px; height: 120px; padding: 1px; margin: 20px 20px 0 0; border: 1px solid #beb074; background-color: #FFF; } #galleryPage div.videoHolder a { display: block; width: 177px; height: 120px; margin: 0; padding: 0; background: url(images/gallery_video_tour.png) top left no-repeat; } #galleryPage div.videoHolder a:hover { background: url(images/gallery_video_tour_over.png) top left no-repeat; } /*OFFERS*/ #offersPage { text-align: center; } #offersPage #LC { float: left; width: 315px; padding-right: 36px; } #offersPage #RC { float: left; width: 352px; } #offersPage .offerTitle { line-height: 22px; font-size: 13px; padding-bottom:15px; } #offersPage .offerBody { line-height: 18px; font-size: 11px; } .offerBody ul {} .offerBody ul li { padding: 0; background: url(images/bullet_home_list.png) center left no-repeat; padding-left:20px; } #offersPage .border { padding-bottom: 35px; margin-bottom: 35px; background: url(images/spacer_home_h_small.png) bottom center no-repeat; } #offersPage div.ambienthotelsBannerHolder { margin-bottom: 50px; } /*CONTACT*/ #contactPage {} #contactPage #LC { float: left; width: 315px; padding-right: 36px; } #contactPage #RC { float: left; width: 352px; } #contactPage p.pageText { padding-bottom: 10px; line-height:16px; } #contactPage span.sectionTitle { color: #b78b34; font-size: 12px; } /*USEFUL INFORMATION*/ #infoPage {} #infoPage #LC { float: left; width: 315px; padding-right: 36px; } #infoPage #RC { float: left; width: 352px; } #infoPage p.pageText { padding-bottom: 10px; line-height:22px; } #infoPage span.sectionTitle { color: #b78b34; font-size: 12px; } #infoPage ul.usefulLinks li { padding-bottom: 8px; font-size: 11px; } #infoPage ul.usefulLinks li a { margin-left: 5px; } /*RESERVATIONS*/ #reservationsPage {} #reservationsPage #LC { float: left; width: 315px; padding-right: 36px; } #reservationsPage #RC { float: left; width: 352px; } #reservationsPage p.list { line-height: 20px; } #reservationsPage span.sectionTitle { color: #b78b34; font-style: italic; } #reservationsPage #LC p.pageText { padding-bottom: 20px; } #reservationsPage #LC div.reservationRates { width: 250px; height: 92px; margin-left: 30px; line-height: 18px; font-size: 11px; border: 1px solid #EAE2CC;} div.reservationRates .wrapper { float: left; width: 235px; height: 82px; background-color: #F2ECDC; border: 2px solid #FFF; padding: 10px 0 0 15px; } div.reservationRates .wrapper span { color: #b78b34; } table.reservationTable { width: 315px; } table.reservationTable tr td { font-family: Georgia, "Times New Roman", Times, serif; font-size: 11px; padding:8px 0; } table.reservationTable tr td.label { width: 90px; } table.reservationTable tr td span { font-size: 10px; font-style: italic; } #reservationsPage #RC #updatedDiv { padding-top: 35px; } div.calendar-caption { float: left; width: 265px; height: 20px; padding-left: 7px; font-size:12px; font-weight: bold; color: #B78B34; } div.calendar-holder { float: left; width: 272px; height: 165px; margin-bottom: 30px; background: url(images/back_calendar.png) top left no-repeat; } table.calendar { margin: 15px auto 0 auto; } table.calendar tr th { font-style: italic; padding: 3px 5px 7px 5px; font-size: 11px; border-bottom: 1px solid #FFF; } table.calendar tr th.weekend { color: #b78b34; } table.calendar tr td { font-style: italic; padding: 4px 5px 4px 5px; font-size: 11px; text-align: center; } table.calendar tr td.available a { text-decoration: none; color: #000/*#992d2b*/; } table.calendar tr td.partially a { text-decoration: none; color: #000; } table.calendar tr td.booked a { text-decoration: line-through; color: #A0A0A0; cursor: default; } table.calendar tr td.past a { text-decoration: line-through; color: #000; cursor: default; } table.calendar tr td.selected a { text-decoration: none; color: red/*#3169b6*/; font-weight: bold; } table.calendar tr td.highlighted { text-decoration: line-through; } table.calendar tr td div.today { color: #b78b34; font-weight: bold; } div.calendar-navi { float: left; width: 265px; padding-top: 5px; margin-top: 5px; text-align: center; } div.calendar-navi span { color: #A0A0A0; font-size: 10px; text-decoration: underline; } div.calendar-navi a { text-decoration: underline; color: #000; font-size: 10px; } div.calendar-navi a:hover { text-decoration: underline; color: #b78b34; } div.calendar-events { float: left; width: 285px; padding:0 0 35px 5px; margin: 30px 0 35px 0; background: url(images/spacer_home_h_small.png) bottom center no-repeat; } div.calendar-events h4 { padding-bottom: 10px; font-size:11px; font-weight: bold; } div.calendar-events p.dayInfo { width: 280px; padding-top: 10px; padding-bottom: 2px; font-size:11px; border-bottom: 1px solid #a0a0a0; color: #000; } div.calendar-events p.booked { color: #808080; } div.calendar-events p.available { color: #000/*#992d2b*/; } div.calendar-events p.dayInfo span { } div.calendar-events p.dayHistory { width: 280px; padding: 4px 0 0 20px; font-size:10px; } #clickMenu { display: none; position: absolute; top: 0; left: 0; width: 147px; height: 50px; border: 1px solid #c8c8c8; background-color: #f5f5f5; } #clickMenu .clickMenuItem { float: left; width: 145px; height: 22px; margin:1px; font-family: "Tahoma"; font-size: 11px; border-bottom: 1px solid #CFCFCF; } #clickMenu .second { border: 0; } #clickMenu .selected { background-color: #3169b6; } #clickMenu .clickMenuItem a { float: left; margin: 5px 0 0 10px; text-decoration: none; color: #000; } #clickMenu .selected a { color: #FFF; } div.TA_vrbadge { width: 155px; margin: 30px auto;} /* ambient exclusive */ #AmbientExclusive { width: 280px; text-align: center; } #AmbientExclusive a { display: block; width: 143px; height: 25px; margin: 0 auto; background: url(images/ambient_exclusive_badge.png) top left no-repeat; } /* tourist informator */ #touristInformator { width: 305px; padding: 5px; background-color: #cccccc; border-radius: 6px; } #touristInformator #touristInformatorTitle { float: left; padding: 15px; } #touristInformatorTitle h1 { float: left; padding-bottom: 10px; margin-bottom: 10px; font-size: 16px; font-family:Arial, Helvetica, sans-serif; border-bottom: 1px solid #fff; } #touristInformatorTitle a { float: right; font-size: 11px; font-family:Georgia, "Times New Roman", Times, serif; padding-bottom: 5px; } #touristInformatorTitle a.poweredBy { color: #666; text-decoration: none; } #touristInformator iframe { width: 305px; height: 500px; } /* cookie notice */ .cookie-notice { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 30px; background-color: rgba(0,0,0,.8); color: #FFF; z-index:9000;} .cookie-notice .cookie-notice-wrapper { width: 994px; margin: 0 auto; padding-top: 5px; font-size:90%;text-align: center;} .cookie-notice a.read-more-btn { display: inline-block; height: 20px; line-height: 20px; padding: 0 8px; margin: 0 3px 0 10px; background-color: #8D8166; color: #FFF; text-decoration: none; cursor: pointer; border-radius: 2px; font-size: 11px;} .cookie-notice a.read-more-btn:hover { color: #FFF; text-decoration: none; background-color: #971014;} .cookie-notice a.ack-btn { display: inline-block; height: 20px; line-height: 20px; padding: 0 8px; margin: 0 3px 0 10px; background-color: #971014; color: #FFF; text-decoration: none; cursor: pointer; border-radius: 2px; font-size: 11px;} .cookie-notice a.ack-btn:hover { color: #FFF; text-decoration: none; background-color: #971014; opacity: .7;} .cookie-notice a.close-btn { position: absolute; top: 8px; right: 10px; display: block; width: 16px; height: 16px; line-height: 14px; text-align: center; background-color: #000; border-radius: 2px; font-family: "Trebuchet Ms"; cursor: pointer; } .cookie-notice a.close-btn:hover { background-color: #9A349A; }