/* info -------------------------------------------------------- Start: 03.12.2009. Name: Mare Charter URL: www.marecharter.hr Author: BozooArt, www.bozooart.com */ /* Colors ----------------------------------------------- #4b4b55 = black (text) #f05e09 = orange #0b5583 = blue #8fc8eb = light blue ----------------------------------------------- */ /* Normalize ----------------------------------------------- */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { font-size: 100%; margin: 0; font-weight: normal; } ol, ul { list-style: none; } address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: normal; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } caption, th { text-align: left; } q:before, q:after { content:''; } /*hr { display: none; }*/ legend { display: none; } input, textarea, select { font: 1em Arial,Helvetica,sans-serif; color: #494627; } img { margin: 0; padding: 0; } /* Classes ----------------------------------------------- */ a { text-decoration: none; color: #0b5583; } a:hover { border: none; text-decoration: none; } a:focus { outline: none; } blockquote { margin: 0 0 30px 50px; } .clr { clear: both; } .left { float: left; } .center { text-align: center; } .hide { display: none; } .orange { color: #f05e09 } /* General ----------------------------------------------- */ body { font: 62.5%/1.4 Arial,Helvetica,sans-serif; color: #58595B; background: #0a6eba; } #sky { background: #eef8fe url(../../include/images/design/bg.jpg) repeat-x; } #sea { background: url(../../include/images/design/sea.jpg) repeat-x 0 100%; position: relative } #wrap { width: 988px; margin: 0 auto; padding-bottom: 20px; } #boat { background: url(../../include/images/design/boat.png); width: 93px; height: 79px; position: absolute; right:12%; margin-top: -90px } #header { height: 90px; position: relative } #container_top { background: url(../../include/images/design/container_top.gif) no-repeat; height: 10px; font-size: 0; } #container_wrap { background: url(../../include/images/design/content_bg.gif) repeat-y; } #container_wrap.home { background: #0b5583; } #container { background: url(../../include/images/design/content_bottom.gif) no-repeat 10px bottom; } /*#content { background: url(../../include/images/design/content_bottom.gif) no-repeat 0 bottom; }*/ #home_content { background: #fff url(../../include/images/design/content_bottom.gif) no-repeat 0 bottom; padding: 20px 30px 20px 30px; font-size: 1.2em; } h1 { /*padding: 10px 0 0 30px;*/ } h1 a { background: url(../../include/images/design/logo.png) no-repeat; width: 198px; height: 82px; display: block; text-indent: -9999em; } #lang { background: url(../../include/images/design/lang_bg.png) no-repeat; width: 252px; height: 30px; position: absolute; right: 20px; top: 10px; padding: 8px 0 0 0; color: #fff !important; text-align: center; } #top_links { width: 452px; height: 30px; line-height: 30px; position: absolute; right: 20px; top: 60px; color: #0b5583; text-align: right; } #nav { padding: 10px 0 0 30px; background: #0b5583; height: 30px } #nav li { display: inline; float: left; font: 1.3em Trebuchet MS, Arial, Helvetica, sans-serif; text-transform: uppercase; } #nav li a { background: #0b5583 url(../../include/images/design/nav_bg.gif) repeat-x; padding: 6px 17px 6px; display: block; margin-right: 1px; color: #8fc8eb; } #nav li a:hover,#nav li a.active_true { background: #fff; color: #0b5583; } #left_col { width: 690px; float: left; padding: 0 0 0 10px; } #sidebar { width: 288px; float: right; padding-top: 8px; position: relative; } #slideshow { width: 630px; height: 379px; background: url(../../include/images/design/slideshow_bg.png) no-repeat; margin: 0 0 20px 0; padding: 30px 30px 0 30px } #footer { font-size: 1.1em; padding-left: 10px; height: 70px; background: url(../../include/images/design/footer_bg.gif) no-repeat 0 bottom; width: 988px; margin: 0 auto; color: #a5bcca; } #footer a { color: #a5bcca; } #footer a:hover { color: #f05e09; } #nav_foot { padding: 5px; height: 24px; } #nav_foot li { display: inline; float: left; font: 1.0em Trebuchet MS, Arial, Helvetica, sans-serif; text-transform: uppercase; } #nav_foot li a { padding: 6px; display: block; margin-right: 1px; color: #8fc8eb; } #nav_foot li a:hover,#nav_foot li a.active_true { color: #FFFFFF; } #content_top { background: #fff url(../../include/images/design/content_top.gif) no-repeat; height: 10px } #content a:hover { color: #f05e09; } #popular_links { background: url(../../include/images/design/rope.gif) no-repeat center bottom; height: 230px; margin-bottom: 30px; } #popular_links li { display: inline; float: left; width: 190px; position: relative; margin-left: 30px; } #popular_links li.first_child { margin: 0; } #popular_links li h2 { font: 1.4em Arial, Helvetica, sans-serif; font-weight: bold; padding-top: 40px; margin-bottom: 10px; } #popular_links li h2 a:hover { color: #f05e09 } #popular_links li .more a { display: block; background: url(../../include/images/design/home_icons.jpg) no-repeat; text-indent: -9999em; position: absolute; top: 0; background-color: orange; } #popular_links li.flota a.more { display: block; width: 81px; height: 79px; margin-left: 50px; background: url(../../include/images/design/icon_flota.jpg) no-repeat; } #popular_links li.cjenik a.more { display: block; width: 81px; height: 79px; margin-left: 50px; background: url(../../include/images/design/icon_cjenik.jpg) no-repeat; } #popular_links li.ostalo a.more { display: block; width: 81px; height: 79px; margin-left: 50px; background: url(../../include/images/design/icon_ostalo.jpg) no-repeat; } #popular_links li.flota a.more:hover { background: url(../../include/images/design/icon_flota_hover.jpg) no-repeat; } #popular_links li.cjenik a.more:hover { background: url(../../include/images/design/icon_cjenik_hover.jpg) no-repeat; } #popular_links li.ostalo a.more:hover { background: url(../../include/images/design/icon_ostalo_hover.jpg) no-repeat; } #popular_links ul { margin: 10px 0 0 0; } #popular_links ul li { display: block; float: none !important; width: auto; position: static; padding-left: 10px; background: url(../../include/images/design/bullet.gif) no-repeat 0 7px; } #popular_links ul li a:hover { color: #f05e09 } #map a { display: block; width: 165px; height: 165px; background: url(../../include/images/design/map.gif) no-repeat; text-indent: -9999em; float: left; } #base { float: left; width: 240px; padding: 15px 20px 0 20px; } #base h3 { font: 1.3em Trebuchet MS, Arial, Helvetica, sans-serif; font-weight: bold; margin-bottom: 16px } #base p { margin-bottom: 10px; } #base p a { text-decoration: underline; padding: 1px 2px } #base p a:hover { text-decoration: none; } #weather { float: left; width: 180px; } /* side */ .side { padding: 40px 0 10px 40px; position: relative; } #search.side { padding: 50px 0 0 40px } #sidebar h3 { background: url(../../include/images/design/side_title_bg.png) no-repeat; width: 266px; height: 40px; font: 1.2em Trebuchet MS, Arial, Helvetica, sans-serif; color: #8fc8eb; top: 0; text-transform: uppercase; padding: 8px 0 0 20px; font-weight: bold; position: absolute; right: -10px } #sidebar label { display: block; color: #a5bcca; font-size: 1.1em; margin-bottom: 3px; padding-left: 3px } #sidebar p { position: relative; margin-bottom: 10px; } #sidebar dl { font-size: 1.2em; color: #8fc8eb; padding: 0 33px 0 0; } #sidebar dl dt { background: #064972; padding: 3px 5px; margin: 0 0 5px -4px } #sidebar dl.main { margin-bottom: 20px; } #sidebar dd { margin-left: 0} #sidebar dd.indent { margin-top: 10px; } #sidebar dd span { display: inline-block; width: 45px; } #sidebar dd a { color: #8fc8eb } #sidebar dd a:hover { color: #f05e09; } #cards { background: url(../../include/images/design/cards.gif) no-repeat; width: 217px; height: 21px; text-indent: -9999em; margin-bottom: 20px } #option { background: #fff; padding: 5px 10px; color: #0b5583; font-weight: bold; font-size: 1.2em; width: 196px } #insurance { background: url(../../include/images/design/uniqua.gif) no-repeat; height: 20px; color: #a5bcca; font-size: 1.1em; padding: 25px 0 0 63px; margin-top: 20px; } #insurance strong { display: none; } #insurance span { font-size: .9em; line-height: 1.2em; display: block; } #links ul { width: 216px; } #links li { background: url(../../include/images/design/2lines.gif) repeat-x 0 bottom; padding: 5px 0 0px 0; height: 35px; } #links a { display: block; background: url(../../include/images/design/small_icns.png) no-repeat; color: #a5bcca; font-size: 1.1em; padding: 6px 0 8px 50px; } #links a:hover { color: #f05e09; } #links li.bm { padding: 10px 0 0 0; } #links li span { display: none; } #links ul ul li { display: inline; float: left; padding: 0; margin: 0; background: none; } #links ul ul li a { width: 29px; height: 29px; padding: 0; text-indent: -9999em; margin: 0 0 0 30px; } #links ul ul li.face a { margin-left: 0; } #links ul ul li.face a { background-position: 0 -28px; } #links ul ul li.yt a { background-position: 0 -57px; } #links ul ul li.flickr a { background-position: 0 -86px; } #links ul ul li.skype a { background-position: 0 -115px; } #links ul li.cro a { background-position: 0 -143px; } #links ul li.meteo a { background-position: 0 -172px; } #links ul li.gmaps a { background-position: 0 -202px; } .thumbs { margin-top: 16px; } .thumbs li { display: inline; float: left; } .thumbs li { display: block; width: 60px; height: 50px; border: 1px solid #666; margin-right: 1px; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /* text */ #content { line-height: 1.5em; font-size: 1.3em; padding: 60px 70px 0px 70px; } #content h1 { font: 1.8em Trebuchet MS, Arial, Helvetica, sans-serif; color: #0b5583; font-weight: bold; text-transform: uppercase; margin-bottom: 30px; border-bottom: 1px solid #666; /*padding-bottom: 15px;*/ text-shadow: 2px 2px 1px #CCCCCC } #content h2 { font: 1.2em Trebuchet MS, Arial, Helvetica, sans-serif; color: #0b5583; font-weight: bold; margin-bottom: 10px; } #content p { margin-bottom: 30px; } #content ul { margin: 0 40px 40px; } #content ul li { list-style-type: disc; margin-bottom: 5px } /* contact */ #contact_info { padding-bottom: 20px; border-bottom: 1px solid #e5e5e5; margin-bottom: 20px; } #contact_info dl { float: left; width: 250px; } #contact_info dl dt { color: #0b5583 } #contact_info dl dd { margin-bottom: 0px; } #contact_info dl span { font-weight: bold; display: inline-block; width: 60px; } #contact_info dl .indent { margin-top: 15px; } #contact_info dl.base { margin-left: 50px } .contact { margin-left: 30px; } .contact label { display: inline-block; width: 100px; font-weight: bold; font-size: .9em; } .contact p { margin-bottom: 15px !important; } .contact .input_text { padding: 3px 4px; font-size: .9em; width: 200px; border: 1px solid #ccc; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } .contact .input_text:focus, .contact textarea:focus { border-color: #0b5583; } .contact textarea { width: 400px; border: 1px solid #ccc; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; padding: 4px; height: 130px } .contact p.msg label { height: 130px; float: left; margin-top: 4px } .contact .btn { margin-left: 100px; padding: 0; } .contact .btn input { border: none !important; color: #fff; font: .9em Arial, Helvetica, sans-serif; font-weight: bold; cursor: pointer; background: url(../../include/images/design/submit.gif) no-repeat; width: 78px; height: 32px; padding-top: 2px; } .contact .btn input:hover { background-position: 0 -32px; } #contact_form h3 { padding-bottom: 10px; } #contact_form label { display: inline-block; width: 100px; font-weight: bold; font-size: .9em; } #contact_form p { margin-bottom: 5px !important; } #contact_form .input_text { padding: 3px 4px; font-size: .9em; width: 200px; border: 1px solid #ccc; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } #contact_form .input_text:focus, #contact_form .select:focus { border-color: #0b5583; } #contact_form .select { width: 209px; padding: 2px; -moz-border-radius: 4px; border: 1px solid #ccc; -khtml-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /* tablica */ #price_info { font-size: .9em; margin: 0 !important; padding: 0; } #price_info li { margin-bottom: 5px; } #price_info .price_indent { margin-top: 30px } #price_info strong { padding-right: 10px; } /* lightbox */ #jquery-overlay{position:absolute; top:0; left:0; z-index:90; width:100%; height:500px} #jquery-lightbox{position:absolute; top:0; left:0; width:100%; z-index:100; text-align:center; line-height:0} #jquery-lightbox a img{border:none} #lightbox-container-image-box{position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto} #lightbox-container-image{padding:10px} #lightbox-loading{position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0} #lightbox-nav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:10} #lightbox-container-image-box >#lightbox-nav{left:0} #lightbox-nav a{outline:none} #lightbox-nav-btnPrev, #lightbox-nav-btnNext{width:49%; height:100%; zoom:1; display:block} #lightbox-nav-btnPrev{left:0; float:left} #lightbox-nav-btnNext{right:0; float:right} #lightbox-container-image-data-box{font:10px Verdana,Helvetica,sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em; overflow:auto; width:100%; padding:0 10px 0} #lightbox-container-image-data{padding:0 10px; color:#666} #lightbox-container-image-data #lightbox-image-details{width:70%; float:left; text-align:left} #lightbox-image-details-caption{font-weight:bold} #lightbox-image-details-currentNumber{display:block; clear:left; padding-bottom:1.0em} #lightbox-secNav-btnClose{width:66px; float:right; padding-bottom:0.7em} #gallery { background-color: #444; padding: 10px; width: 520px; } #gallery ul { list-style: none; } #gallery ul li { display: inline; } #gallery ul img { border: 5px solid #3e3e3e; border-width: 5px 5px 20px; } #gallery ul a:hover img { border: 5px solid #fff; border-width: 5px 5px 20px; color: #fff; } #gallery ul a:hover { color: #fff; } /* boat */ DIV.boat h3 { margin: 0 0 2px; } DIV.boat ul { margin: 0; } DIV.boat ul li { border-top: 1px solid #e5e5e5; padding-left: 10px !important } DIV.boat ul li { list-style-type: none; margin: 0; padding: 2px 0; font-size: .9em; } DIV.boat ul li strong { padding-right: 5px;} #main_info ul { float: left; width: 200px; padding-right: 45px; clear: both; margin: 0; } #main_info ul li { list-style-type: none; margin: 0; padding: 2px 0; font-size: .9em; } #techical_info ul { padding-right: 45px; clear: both; margin: 0; } #techical_info ul li { border-top: 1px solid #e5e5e5; padding-left: 10px !important; list-style-type: none; margin: 0; padding: 2px 0; font-size: .9em; } #techical_info { float: left; width: 245px;margin-bottom: 20px; clear: both; } #photogallery, #main_image { float: left; width: 300px; height: 225px; overflow: hidden;} #main_image img { width: 300px; padding: 2px; border: 1px solid #ccc; margin: -10px 0 0; } #photogallery { float: right; height: 182px; overflow: hidden; } #photogallery img { width: 94px; height: 71px; } #photogallery a { padding: 1px; border: 1px solid #ccc; display: block; width: 94px; float: left; height: 71px; } #equipment { clear: both; margin-bottom: 40px; line-height: 1.3em; } #equipment ul li { margin: 0 !important; border: none !important; padding: 0 !important } #content.boat .pricelist { margin-bottom: 20px; } .booking { margin-left: 100px; padding: 0; } .booking a { color: #fff; font: .9em Arial, Helvetica, sans-serif; font-weight: bold; background: url(../../include/images/design/submit.gif) no-repeat; width: 78px; height: 24px; padding-top: 8px; display: block; text-align: center; position: absolute; margin: -120px 0 0 410px } .booking a:hover { background-position: 0 -32px; color: #fff !important; } .booking.bottom, .booking.bottom a { margin: 40px 0 0 0px !important; position: static; } #content #rent_price p { margin-bottom: 0px; font-size: .9em; } #content #rent_price { margin-bottom: 60px; } #rent_price p#total { background: #f1f1f1; padding: 10px 10px; margin: 20px 0; width: 150px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc } #extra { margin-top: 40px; } #extra h3 { padding-bottom: 10px } #extra_equipment_table { width: 100%; font-size: 11px; margin: 0 0 10px 0; border: 1px solid #f1f1f1 } #extra_equipment_table input { margin-right: 10px; } #extra_equipment_table td { padding: 2px 10px 2px } #extra_equipment_table .grey { background: #f1f1f1; } #total_price { margin-bottom: 40px } .total_price_table { width: 100%; font-size: .9em; } .total_price_table td { padding: 4px; border-bottom: 1px solid #ccc; vertical-align: top } .total_price_table .sum td { border-top: 2px solid #ccc; border-bottom: none !important; } #details { clear: both; } #content #details p { margin-bottom: 5px; font-size: .9em; } #content #details h3 { margin-bottom: 10px; } #details strong { display: inline-block; width: 60px; } #details .select { padding: 2px; margin-left: 10px; } #content #news { padding: 0; margin: 0; } #content #news li { list-style-type: none !important; margin: 0; padding: 0; } #content #news li .img { padding: 2px; border: 1px solid #666; float: left; width: 140px; margin: 6px 20px 0 0; } #pagination_wrap { background: url(../../include/images/design/rnd_grey_small.gif) no-repeat; height: 37px; font-size: .9em; margin-top: 80px } #pagination { text-align: center; position: relative; padding-top: 9px; text-transform: uppercase; height: 28px } #pagination a { color: #494e58; } #pagination a:hover { text-decoration: underline; color: #f05e09 !important } #pagination a.prev, #pagination a.next, #pagination .current { font-weight: bold; color: #0b5583; } #pagination .current { font-size: 1.5em; } #pagination .prev, #pagination .next, #pages { position: absolute; } #pagination .prev { left: 5%; } #pagination .next { right: 5%; } #pagination #pages { display: block; left: 30%; text-align: center; margin: -2px 0 0 0; width: 200px; font-weight: bold; font-size: 1.1em; } #pagination .page { padding: 0 7px; } #content .share { background: url(../../include/images/design/small_icns.png) no-repeat 0 -28px; padding: 5px 0 5px 40px; margin-top: 40px; } #content .date { font-weight: bold; margin: -10px 0 20px; display: block; } #breadcrumbs { color: #666; font-size: .9em; position: absolute; margin-top: -40px; width: 550px; line-height: 1.2em } #breadcrumbs a, #breadcrumbs strong { padding-right: 15px; } #breadcrumbs a { color: #666; background: url(../../include/images/design/arrow.gif) no-repeat right 4px; margin-right: 5px } /* slideshow */ #photos { width: 630px; height: 379px !important; } #photos .panel { width: 630px !important; height: 282px !important; overflow: hidden !important; position: absolute; } .panel-overlay { z-index: 999 !important; } .panel-overlay h2 { font-size: 2.5em; margin: 18px 0 0 30px } .panel-overlay p { text-align: right; margin: -20px 20px 0 0; font-size: 1.1em; } .panel-overlay p a { text-decoration: none !important; } .panel-overlay p a:hover { text-decoration: underline !important; } #jquery-lightbox { z-index: 1000 !Important; } .filmstrip { overflow: none; height: 50px; } .filmstrip li { display: inline; } .strip_wrapper { margin-top: 15px } .nav-prev, .nav-next { margin-top: 15px } #send_query { padding: 10px 0; background: #fffedd; text-align: center; font-size: 1.1em; } #send_query a { text-decoration: underline; } DIV.thumblist { width:200px; float: right; text-align: right; } DIV.thumblist A { margin: 0px; padding: 0px; } A.partners IMG { border: none; } IMG.thumb { border: double 3px #ccc; } IMG.thumb:hover { border: solid 3px #ccc; } IMG.content_box_image_foot { border: solid 2px #FFFFFF; } IMG.content_box_image { border: double 3px #ccc; margin-right: 10px; } /* BOXES */ /* small search */ DIV.small_search_box { padding: 40px 0px 0px 16px; position: relative; } DIV.small_search_box DIV.content { margin-right: 10px; } DIV.wbm_ssf_box DIV.left_data { float:left; width:80px; height: 30px; font-size: 1.2em; color: #8fc8eb; } DIV.wbm_ssf_box DIV.right_data { float:right; width: 180px; height: 30px; font-size: 1.2em; color: #8fc8eb; } DIV.wbm_ssf_box DIV.right_data SELECT { border: 2px solid #074064; padding: 2px; color: #136192; background: #fff url(../../include/images/design/input_bg.gif) repeat-x 0 0px; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } DIV.wbm_ssf_box DIV.right_data SELECT.wide { width: 180px; } #filter_month_id { width: 45px; } #filter_date_id { width: 45px; } /* small search kraj */ .hideme {visibility:hidden;height:1px;padding:2px;}