/* CSS style sheet for titanic.com.au web site */

/* Default styles */

body, p, input, h1, h2, div, a,
.fullform, .halfform, .quarterform, .thirdform, .twothirdform, .form20pct, .form30pct,
.standard, .redirect, .accom, .history, .testimonial, .passenger, .signature, .remark,
.alert, .alertsml, .readonly
{
    font-family: Arial,Helvetica,sans-serif;
    font-style: normal;
    font-variant: small-caps;
    font-weight: normal;
    font-size: medium;
    line-height: normal;
    direction: ltr;
}

body
{
    margin: 0px;
    border: none 0px;
    padding: 0px;
    text-align: center;
    background: #222222 url(../image/bg/black.jpg) repeat top left;
    height: 100%;
    list-style-position: inside;
    vertical-align: baseline;
    text-transform: none;
    direction: ltr;
    list-style-type: disc;
    letter-spacing: normal;
    color: black;
}

iframe, object, embed
{
    display: inline;
    margin: 0px;
    border: none 0px;
    padding: 0px;
    float: left;
}

img
{
    margin: 0px;
    border: none 0px;
    padding: 0px;
    display: block;
}

p
{
    margin: 0px 0px 0.8em 0px;
}

input
{
    text-align: left;
    letter-spacing: normal;
    color: black;
}

h1
{
    color: red;
    text-align: center;
    letter-spacing: 2px;
    text-transform: capitalize;
    text-decoration: underline;
    margin: 0px 0px 10px 0px;
    font-weight: bold;
    font-size: large;
}

h2
{
    color: black;
    text-align: center;
    vertical-align: middle;
    text-transform: capitalize;
    text-decoration: none;
    font-weight: bold;
    margin: 0px;
}

div
{
    margin: 0px auto 0px auto;
    border: none 0px;
    padding: 0px;
    max-height: 100%;
    background-color: transparent;
    width: auto;
    font-size: 0px;
    text-align: center;
}

/* DIV styles */

div#startpage
{
    position: absolute;
    top: 50px;
    left: 50%;
    height: auto;
    margin-left: -250px;
    margin-top: 0px;
    color: white;
    text-align: center;
}

div#header
{
    width: 100%;
    height: 120px;
    background: transparent url(../image/bg/white.jpg) repeat-x top center;
    text-align: center;
}

div.floatcontainer
{
    left: 190px;
    margin-left: 200px;
    margin-right: 10px;
    background-color: transparent;
    text-align: center;
    z-index: 0;
}

div.floatmain
{
    height: 100%;
    margin: 13px auto 10px auto;
    border-top: solid 1px transparent;
    border-bottom: solid 1px transparent;
    background-color: #ffffbb;
    text-align: center;
    z-index: 1;
}

div.fixmain
{
    height: 100%;
    margin: 13px auto 10px auto;
    border-top: solid 1px transparent;
    border-bottom: solid 1px transparent;
    background-color: transparent;
    text-align: center;
    z-index: 1;
}

div.textcontent
{
    clear: both;
    height: auto;
    width: auto;
    color: black;
    text-align: center;
    border: solid 2px #222222;
    margin: 10px;
    z-index: 2;
}

div.fixcontent
{
    clear: both;
    height: auto;
    background-color: transparent;
    text-align: center;
    margin: 0px;
    z-index: 2;
}

div.address
{
    clear: both;
    height: auto;
    background-color: #ffffbb;
    text-align: center;
    margin: 0px auto;
    z-index: 2;
}

div.paragraph
{
    max-height: 100%;
    background-color: transparent;
    width: 95%;
    margin: 0px auto;
}

div.food
{
    height: auto;
    color: black;
    text-align: center;
    width: 88%;
    margin: 10px auto 20px auto;
    border: dashed 1px #222222;
    padding: 15px 15px 10px 15px;
}

div.fullblock
{
    width:100%;
    clear: both;
}

div.framedbooking
{
    height: auto;
    width: 25%;
    text-align: center;
    border: dotted 2px red;
    padding: 8px;
    margin: 10px auto 0px auto;
}

/* Page specific styles */

.bgship {background: transparent url(../image/bg/bghome.jpg) no-repeat center center;}
.bgtitanic {background: transparent url(../image/bg/bgtitanic.jpg) no-repeat center center;}
.bgsteerage {background: transparent url(../image/bg/bgsteerage.jpg) no-repeat center center;}
.bgfirstclass {background: transparent url(../image/bg/bgfirstclass.jpg) no-repeat center center;}
.bgcaptable {background: transparent url(../image/bg/bgcaptable.jpg) no-repeat center center;}
.bgfunc {background: transparent url(../image/bg/bgfunc.jpg) no-repeat bottom right;}
.bgbooking {background: transparent url(../image/bg/bgbooking.jpg) no-repeat center center;}
.bgservice {background: transparent url(../image/bg/bgservice.jpg) no-repeat center center;}
.bgaccom {background: transparent url(../image/bg/bgaccom.jpg) no-repeat center right;}
.bgvoucher {background: transparent url(../image/bg/bgfunc.jpg) no-repeat bottom right;}

.widthhome, .widthsteerage, .widthfirstclass, .widthcaptable, .widthtestimonial, .widthhistory, .widthservice {width: 640px;}
.widthacc {width: 500px;}
.widthfunc {width: 600px;}
.widthvoucher {width: 540px;}
.widthbooking {width: 580px;}
.widthmapframe {width: 640px;}
.widthmap {width: 620px;}
.widthgalleryframe {width: 620px;}
.widthgallery {width: 600px;}

.heightmapframe, .heightgalleryframe {height: 420px;}
.heightmap, .heightgallery {height: 400px;}
.heightaddress {height: 4em;}

/* Header elements */

div#titanic
{
    position: absolute;
    top: 0px;
    left: 0px;
    height: 120px;
    width: 180px;
    background: transparent url(../image/bg/titanic.jpg) no-repeat top center;
}

div#restaurant
{
    left: 180px;
    top: 0px;
    height: 120px;
    margin-left: 180px;
    margin-right: 360px;
    text-align: center;
}

div#leftshipwindow
{
    position: absolute;
    top: 0px;
    right: 240px;
    height: 120px;
    width: 120px;
    float: right;
    background: transparent url(../image/bg/window1.jpg) no-repeat top center;
}

div#middleshipwindow
{
    position: absolute;
    top: 0px;
    right: 120px;
    height: 120px;
    width: 120px;
    float: right;
    background: transparent url(../image/bg/window2.jpg) no-repeat top center;
}

div#rightshipwindow
{
    position: absolute;
    top: 0px;
    right: 0px;
    height: 120px;
    width: 120px;
    background: transparent url(../image/bg/window3.jpg) no-repeat top center;
}

/* Top menu elements */

div#topmenu
{
    clear: both;
    width: 100%;
    height: 26px;
    background: transparent url(../image/bg/rusty.jpg) repeat-x top left;
}

div#topmenucontent
{
    position: relative;
    display: inline;
    height: 24px;
    width: 960px;
    /*	width: 620px;*/
    /*	width: 800px;*/
    float: left;
    /* margin-left: 180px; */
    margin-left: 20px;
    margin-right: auto;
}

div#captable, div#captable a, div#accommodation, div#accommodation a
{
    height: 24px;
    width: 180px;
    float: left;
}
div#firstclass, div#firstclass a, div#voucher, div#voucher a
{
    height: 24px;
    width: 160px;
    float: left;
}

div#steerage, div#steerage a, div#function, div#function a
{
    height: 24px;
    width: 140px;
    float: left;
}

div#captable {background: transparent url(../image/topmenu/hover/hcaptable.jpg) no-repeat top center;}
div#firstclass {background: transparent url(../image/topmenu/hover/hfirstclass.jpg) no-repeat top center;}
div#steerage {background: transparent url(../image/topmenu/hover/hsteerage.jpg) no-repeat top center;}
div#function {background: transparent url(../image/topmenu/hover/hfunction.jpg) no-repeat top center;}
div#accommodation {background: transparent url(../image/topmenu/hover/haccommodation.jpg) no-repeat top center;}
div#voucher {background: transparent url(../image/topmenu/hover/hvoucher.jpg) no-repeat top center;}

div#captable a {background: transparent url(../image/topmenu/normal/captable.jpg) no-repeat top center; display: block;}
div#firstclass a {background: transparent url(../image/topmenu/normal/firstclass.jpg) no-repeat top center; display: block;}
div#steerage a {background: transparent url(../image/topmenu/normal/steerage.jpg) no-repeat top center; display: block;}
div#function a {background: transparent url(../image/topmenu/normal/function.jpg) no-repeat top center; display: block;}
div#accommodation a {background: transparent url(../image/topmenu/normal/accommodation.jpg) no-repeat top center; display: block;}
div#voucher a {background: transparent url(../image/topmenu/normal/voucher.jpg) no-repeat top center; display: block;}

div#captable a:hover, div#firstclass a:hover, div#steerage a:hover, div#accommodation a:hover, div#function a:hover, div#voucher a:hover
{
    background: none transparent scroll repeat 0% 0%;
}

/* Side menu elements */

div#sidemenu
{
    position: absolute;
    left: 0px;
    top: 150px;
    width: 180px;
    height: 280px;
}

div#home, div#home a, div#booking, div#booking a, div#otherservice, div#otherservice a, div#testimonial, div#testimonial a, div#history, div#history a, div#gallery, div#gallery a, div#contact, div#contact a
{
    position: relative;
    height: 40px;
    width: 180px;
    float: left;
}

div#home {background: transparent url(../image/sidemenu/hover/hhome.jpg) no-repeat top center;}
div#booking {background: transparent url(../image/sidemenu/hover/hbooking.jpg) no-repeat top center;}
div#otherservice {background: transparent url(../image/sidemenu/hover/hservices.jpg) no-repeat top center;}
div#testimonial {background: transparent url(../image/sidemenu/hover/htestimonial.jpg) no-repeat top center;}
div#history {background: transparent url(../image/sidemenu/hover/hhistory.jpg) no-repeat top center;}
div#gallery {background: transparent url(../image/sidemenu/hover/hgallery.jpg) no-repeat top center;}
div#contact {background: transparent url(../image/sidemenu/hover/hcontact.jpg) no-repeat top center;}

div#home a {background: transparent url(../image/sidemenu/normal/home.jpg) no-repeat top center; display: block;}
div#booking a {background: transparent url(../image/sidemenu/normal/booking.jpg) no-repeat top center; display: block;}
div#otherservice a {background: transparent url(../image/sidemenu/normal/services.jpg) no-repeat top center; display: block;}
div#testimonial a {background: transparent url(../image/sidemenu/normal/testimonial.jpg) no-repeat top center; display: block;}
div#history a {background: transparent url(../image/sidemenu/normal/history.jpg) no-repeat top center; display: block;}
div#gallery a {background: transparent url(../image/sidemenu/normal/gallery.jpg) no-repeat top center; display: block;}
div#contact a {background: transparent url(../image/sidemenu/normal/contact.jpg) no-repeat top center; display: block;}

div#home a:hover, div#booking a:hover, div#otherservice a:hover, div#testimonial a:hover, div#history a:hover, div#gallery a:hover, div#contact a:hover
{
    background: none transparent scroll repeat 0% 0%;
}

div#sideshow
{
    position: relative;
    height: 260px;
    width: 180px;
    float: left;
    margin: 10px;
}

/* Booking form elements */

.fullform, .halfform, .quarterform, .thirdform, .twothirdform, .form20pct, .form30pct
{
    color: black;
    text-align: center;
    margin-top: 5px;
    float: left;
    display: block;
    background-color: transparent;
}

.fullform {width: 100%;}
.halfform {width: 50%;}
.quarterform {width: 25%;}
.form20pct {width: 20%;}
.form30pct {width: 30%;}
.thirdform {width: 33%;}
.twothirdform {width: 67%;}

.margintop20 {margin-top: 20px;}

/* Fixed main border */

div.frame_bg
{
    clear: both;
    width: auto;
    text-align: center;
    height: 10px;
    min-height: 10px;
    background: transparent url(../image/bg/frame_h.jpg) repeat-x top left;
    z-index: 2;
}

div.frame_tl
{
    position: relative;
    width: 10px;
    height: 10px;
    float: left;
    background: transparent url(../image/bg/frame_tl.jpg) no-repeat top left;
    z-index: 3;
}

div.frame_tr
{
    position: relative;
    width: 10px;
    height: 10px;
    float: right;
    background: transparent url(../image/bg/frame_tr.jpg) no-repeat top right;
    z-index: 3;
}

div.frame_ml
{
    position: relative;
    width: 10px;
    height: 10px;
    float: left;
    background: transparent url(../image/bg/frame_l.jpg) no-repeat top left;
    z-index: 3;
}

div.frame_mr
{
    position: relative;
    width: 10px;
    height: 10px;
    float: right;
    background: transparent url(../image/bg/frame_r.jpg) no-repeat top right;
    z-index: 3;
}

div.frame_left
{
    left: 0px;
    width: 10px;
    float: left;
    background: transparent url(../image/bg/frame_v.jpg) repeat-y top left;
}

div.frame_right
{
    right: 0px;
    width: 10px;
    float: right;
    background: transparent url(../image/bg/frame_v.jpg) repeat-y top right;
}

div.frame_bl
{
    position: relative;
    width: 10px;
    height: 10px;
    float: left;
    background: transparent url(../image/bg/frame_bl.jpg) no-repeat bottom left;
    z-index: 3;
}

div.frame_br
{
    position: relative;
    width: 10px;
    height: 10px;
    float: right;
    background: transparent url(../image/bg/frame_br.jpg) no-repeat bottom right;
    z-index: 3;
}

/* Yellow paper corner styles */

div.paper_bg
{
    clear: both;
    width: auto;
    color: black;
    text-align: center;
    margin: 0px;
    z-index: 2;
    min-height: 44px;
    height: 44px;
    background-color: transparent;
}

div.paper_tl
{
    position: relative;
    top: -6px;
    left: -6px;
    width: 44px;
    height: 44px;
    float: left;
    background: transparent url(../image/bg/edge_tl.gif) no-repeat top left;
    z-index: 3;
}

div.paper_tr
{
    position: relative;
    top: -6px;
    right: -6px;
    width: 44px;
    height: 44px;
    float: right;
    background: transparent url(../image/bg/edge_tr.gif) no-repeat top right;
    z-index: 3;
}

div.paper_bl
{
    position: relative;
    bottom: -6px;
    left: -6px;
    width: 44px;
    height: 44px;
    float: left;
    background: transparent url(../image/bg/edge_bl.gif) no-repeat bottom left;
    z-index: 3;
}

div.paper_br
{
    position: relative;
    bottom: -5px;
    right: -6px;
    width: 44px;
    height: 44px;
    float: right;
    background: transparent url(../image/bg/edge_br.gif) no-repeat bottom right;
    z-index: 3;
}

/* Text, font and paragraph styles */

.alert
{
    font-weight: bold;
    color: #ff3300;
    letter-spacing: 1pt;
    text-align: center;
}

.alertsml
{
    font-weight: bold;
    color: #ff3300;
    letter-spacing: 1pt;
    text-align: center;
    font-size: small;
}

.standard
{
    color: black;
    text-align: center;
    letter-spacing: normal;
}

.standardsml
{
    color: black;
    text-align: center;
    letter-spacing: normal;
    font-size: small;
}

.accom
{
    color: black;
    text-align: left;
    letter-spacing: normal;
}

.redirect
{
    color: white;
    text-align: center;
    letter-spacing: normal;
}

.history
{
    color: black;
    text-align: justify;
}

.testimonial
{
    color: black;
    text-align: left;
}

.passenger
{
    margin-top: -12px;
    color: black;
    text-align: right;
    font-style: italic;
    font-weight: bold;
    font-size: small;
}

.signature
{
    text-align: left;
    margin-left: 5%;
    margin-right: auto;
    float: left;
    font-style: italic;
}

.remark
{
    font-size: small;
}

.bold
{
    font-weight: bold;
}

.left {text-align: left; float: left;}
.center {text-align: center; margin-left: auto; margin-right: auto;}
.right {text-align: right; float: right;}
.date {	vertical-align:super; font-size: smaller;}

a.internal
{
    text-decoration: none;
    color: #ff9933;
    font-weight: bold;
}

a.internalsml
{
    text-decoration: none;
    color: #ff9933;
    font-size: small;
    font-weight: bold;
}

a.external
{
    text-decoration: none;
    color: #ffcc66;
    font-weight: bold;
}

a.book
{
    text-decoration: none;
    color: red;
    font-weight: bold;
    font-size: large;
}

a.book:hover
{
    text-decoration: blink;
}

input.button
{
    text-align: center;
    letter-spacing: normal;
    color: black;
}

.readonly
{
    border: none 0px;
    background-color: transparent;
    text-align: center;
    font-size: smaller;
    font-variant: normal;
}

/* Image styles */
img.rightphoto
{
    text-align: right;
    float: right;
    margin: 0px 0px 0px 10px;
    border: solid 2px black;
    padding: 0px;
}

img.leftphoto
{
    text-align: left;
    float: left;
    margin: 0px 10px 0px 0px;
    border: solid 2px black;
    padding: 0px;
    display: block;
}

img.centerphoto
{
    text-align: center;
    margin: 0px auto 10px auto;
    border: solid 2px black;
    padding: 0px;
    display: block;
}

img.rightimage
{
    text-align: right;
    float: right;
    margin: 0px 0px 0px 10px;
    border: none;
    padding: 0px;
    display: block;
}

img.leftimage
{
    text-align: left;
    float: left;
    margin: 0px 10px 0px 0px;
    border: none;
    padding: 0px;
    display: block;
}

div#titleimage {background: transparent url(../image/bg/telfax.jpg) no-repeat top center;}
div#titleimage a {background: transparent url(../image/bg/restaurant.jpg) no-repeat top center;}
div#titleimage a:hover {background: none transparent scroll repeat 0% 0%;}

div#titleimage, div#titleimage a
{
    top: 0px;
    height: 120px;
    width: 360px;
    margin: 0px auto;
    border-width: 0px;
    padding: 0px;
    display: block;
    text-align: center;
}