table.layout {

    width: 232px;

    height: 240px;

}




td {

    padding: 2px 2px 1px 2px;

    text-align: left;

    vertical-align: top;

    margin: 0px;

}





td.center {

    padding: 8px 0 0 0;

    vertical-align: middle;

    text-align: left;

}



input {

    width: 110px;

    color: #000000;

    font-size: 11px;

    border: 1px solid #000000;
}





input.checkbox {

    width: 30px;

    color: #000000;

    font-size: 11px;

}





input.radio {

    width: 30px;

    color: #000000;

    font-size: 11px;

}





input.extraSmall {

    width: 25px;

    color: #000000;

    font-size: 11px;

}





input.small {

    width: 50px;

    color: #000000;

    font-size: 11px;

}





input.large {

    width: 250px;

    color: #000000;

    font-size: 11px;

}


input.btn {

    width: 60px;

    padding: 1px 2px;

    color: #000000;

    font-size: 11px;
    
    text-align: center;

}


select {

    width: 150px;

    color: #000000;

    font-size: 11px;

}





select.small {

    margin: 0 5px 0 0;

    width: 40px;

    color: #000000;

    font-size: 11px;

    border: 1px solid #000000;

}


select.medium {

    width: 60px;

    color: #000000;

    font-size: 11px;

    border: 1px solid #000000;

}


select.large {

    width: 250px;

    color: #000000;

    font-size: 11px;

}








img.medium {

    margin: 0px;

    border: none;

    width: 100px;

    height: 100px;

}






.tabActive {

    background-color: #ccd9e6;

    border: none;

    border-collapse: collapse;

    height: 21px;

    color: #000000;

    text-align: center;

    font-weight: bold;

}





.tabInactive {

    background: #eeeeee;

    border: none;

    border-collapse: collapse;

    height: 21px;

    text-align: center;

    font-weight: bold;

}





.tabInactiveLink:link    { color: #000000; background-color: #eeeeee; text-decoration: none;      font-weight: bold;}

.tabInactiveLink:active  { color: #000000; background-color: #eeeeee; text-decoration: none;      font-weight: bold;}

.tabInactiveLink:visited { color: #000000; background-color: #eeeeee; text-decoration: none;      font-weight: bold;}

.tabInactiveLink:hover   { color: #000000; background-color: #eeeeee; text-decoration: underline; font-weight: bold;}





input.button {

    cursor: hand;

    min-width: 60px;

    width: auto;

    height: 18px;

    text-align: center;

    text-decoration: none;

    font-size: 10px;

    vertical-align: middle;

}



a.button {

    cursor: hand;
    
    display: block;
    
    height: 20px;
    
    line-height: 20px;
    
    width: 50px;
    
    font-weight: bold;
    
    color: #ffffff;

    text-align: center;

    vertical-align: middle;
    
    font-family: verdana;
    
    background: #435f49 url(../website/css/images/search_button.jpg) no-repeat top left; 
    
    border: none;

    text-decoration: none;

}

a.button:link    {
    color: #ffffff;
    text-decoration: none;
}

a.button:active  {
    color: #ffffff;
    text-decoration: none;
}

a.button:visited {
    color: #ffffff;
    text-decoration: none;
}

a.button:hover   {
    color: #ffffff;
    background: #435f49 url(../website/css/images/search_button_over.jpg) no-repeat top left; 
    text-decoration: none;
}





input.buttonDisabled {

    cursor: hand;

    min-width: 60px;

    width: auto;

    height: 18px;

    color: #aaaaaa;

    text-align: center;

    text-decoration: none;

    font-size: 10px;

    vertical-align: middle;

}





.buttonDisabled {

    cursor: hand;

    vertical-align: middle;

}

.buttonDisabled:link    { color: #aaaaaa; text-decoration: underline;}

.buttonDisabled:active  { color: #aaaaaa; text-decoration: underline;}

.buttonDisabled:visited { color: #aaaaaa; text-decoration: underline;}

.buttonDisabled:hover   { color: #aaaaaa; text-decoration: underline;}





.errorTitle {

    color: #ff0000;

    font-weight: bold;

}





.errorMessage {

    color: #ff0000;

    font-weight: bold;

}



.warning{

    color: #ff0000;

}



.label {



}





td.label {

    padding: 2px 2px 0px 2px;

    text-align: left;
    
    width: 110px;
    
    height: 20px;

    padding-left: 5px;
    
    font-size: 12px;

    color: #4a463e;
    
    font-weight: normal;
    
    font-family: trebuchet ms, arial, verdana;

}

td.label2 {

    vertical-align: bottom;
    
    padding: 2px 2px 0px 2px;

    text-align: left;
    
    width: 110px;

    color: #4a463e;
    
    height: 20px;

    padding-left: 5px;
    
    font-size: 12px;
    
    font-weight: normal;
    
    font-family: trebuchet ms, arial, verdana;

}

td.arrav {

    margin: 0;

    padding: 0px 2px 4px 2px;

    text-align: left;
    
    height: 18px;

    padding-left: 5px;
    
    font-size: 11px;
    
    font-weight: bold;
    
    vertical-align: top;    
    
    font-family: arial, verdana;

}

td.labelSmall {

    text-align: left;

    padding-left: 5px;

    width: 15%;

}





.section {

    color: #4a463e;

    font-weight: bold;
    
    font-family: trebuchet MS, verdana;
    
    font-size: 16px;

    height: 20px;

    padding: 8px 5px 0 5px;

}





.required {

    color: #ff0000;

}





.header {

    padding-left: 15px;

    border: 10px solid;

}





.tableHeader {

    font-weight: bold;

    background-color: #eeeeee;

    margin-left: auto;

    margin-right: auto;

    vertical-align: middle;

    text-align: center;

    border-collapse: collapse;

    border: 1px solid #000000;

}





.tableContent {

    padding-left: 5px;

    border-collapse: collapse;

    border: 1px solid black;

}





.tableContentCenter {

    padding-left: 5px;

    border-collapse: collapse;

    border: 1px solid black;

    margin-left: auto;

    margin-right: auto;

    vertical-align: middle;

    text-align: center;

}





.countryAreaFont {

    font-size : 9px;

}





/*-- detailed styles --*/

/* hotel/room list screen */



a.hotelRoomListHotelContentLink:link    { font-size: 12px; font-weight: bold;}

a.hotelRoomListHotelContentLink:active  { font-size: 12px; font-weight: bold;}

a.hotelRoomListHotelContentLink:visited { font-size: 12px; font-weight: bold;}

a.hotelRoomListHotelContentLink:hover   { font-size: 12px; font-weight: bold;}





td.hotelRoomListHotelNameTD {

    width: 75%;

}





a.hotelRoomListChoseHotelRoomLink:link    { }

a.hotelRoomListChoseHotelRoomLink:active  { }

a.hotelRoomListChoseHotelRoomLink:visited { }

a.hotelRoomListChoseHotelRoomLink:hover   { }





/* hotel list screen */

td.hotelListNavigatorTD {

    width: 20%;

}





/* booking bar screen */

td.bookingBarBackground {

    padding-left: 15px;

    height: 21px;

    vertical-align: middle;

    background-color: #ccd9e6;

}





.bookingBarTitle {



}





.bookingBarCurrentStep {

    text-decoration: underline;

}





.bookingBarOtherStep {



}





/* reservationHistory screen */

.reservationHistoryActiveReservation {

    font-weight: bold;

    color: #00dd00;

}





.reservationHistoryInactiveReservation {

    font-weight: bold;

    color: #ff0000;

}





/* resendBookingClientConfirmation */

.resendBookingClientConfirmationDisabledText {

    color: #aaaaaa;

}





/* CALENDAR */

/* Calendar Day Header - the cells showing "Sunday", "Monday" .... */

.CalHead {

    cursor:default;

    text-align:center;

}

/* Day of Week - the Anchor inside CalHead showing the day of week */

.DoWAnchor {

    text-decoration:none; font:bold 7.5pt Tahoma, Verdana, sans-serif;

    color:white;

}

/* Day Column Cell - the TD cell of each day */

.CalCol {

}

/* Day Cell - the DIV cell inside TD */

.CalCell {

    cursor:hand;

    text-align:center;

}

/* Day Number - the Anchor inside DIV showing the day number  */

.CellAnchor {

    text-decoration:none; font:9pt verdana;

}

/* WeekNo Header - the top header cell of the week number column */

.WeekHead {

    cursor:default;

    text-align:center; font:bold 10pt arial;

    color:white;

}

/* WeekNo Column Cell - the cells of the week number column */

.WeekCol {

    cursor:default;

    text-align:center;

    background:#b0c4de;

}

/* WeekNo Anchor style */

.WeekAnchor {

    text-decoration:none; font:bold 8pt arial;

    color:white;

}

/* Month navigators - the "<" or ">" used to move to previous or next month */

.MonthNav {

    vertical-align:middle;

    height:22px;

    width:18px; font:bold 10pt arial bold;

    color:black;

}

A.MonthNav:hover {

    color:yellow

}

A.MonthNav:active {

    color:red

}

/* styles for the 3 calendar sections (actually 3 table TDs) */

.CalTop {

    text-align:center;

}

.CalMiddle {

}

.CalBottom {

    text-align:center;

}

/* Calendar title - showing year and month. when giDCStyle=0, it's the style of the year/month dropdowns; giDCStyle>0, it's the style to show gsCalTitle.  */

.CalTitle {

    vertical-align:middle;

    font:10pt arial;

    color:black;

    width: 60px;

    color: #000000;

}

/* The style of internal floating div/layer tags, which are usually used to create the artificial dropdown selectors. */

.FreeDiv {

}

/* The style of the outer TABLE tag which is the outer calendar panel. */

.outerTable {

    border:2px ridge #ffffff;

}

/* The style of the inner DIV tag that holds the inner panel of all calendar cells. */

.innerDiv {

    border:1px solid #dcdcdc;

}

/*===== Above CSS styles are commonly used in the script engine =====*/



/*====== Following are additional per-theme styles, e.g. the inner dropdown selectors and today etc. You may have your own defined. ======*/

.BottomAnchor {

    text-decoration:none; font:bold 9pt Tahoma, Verdana;

    color:white;

}

A.BottomAnchor:hover {

    color:white;

}

A.BottomAnchor:active {

    color:white;

}

/* the background color of the outer calendar panel.*/

.gcCalBG {

    background-color: #668EB5;

}

/* the background color of the inner table, showing as a frame.*/

.gcCalFrame {

    background-color: #004184;

}

/* default background color of the cells. Use "" for transparent!!!*/

.gcCellBG {

    background-color: #ebebeb;

}

/* Saturday background color*/

.gcSatBG {

    background-color: #cbcbcb;

}

/* Sunday background color*/

.gcSunBG {

    background-color: #cbcbcb;

}

/* the font color of days in other months; It's of no use when giShowOther is set to hide.*/

.gcOtherDay {

    background-color: silver;

}

/* the background color of days in other months. when giShowOther set to hiding, it'll substitute the gcOtherDay.*/

.gcOtherDayBG {

    background-color: #ebebeb;

}

/* the highlight color for the focused cell*/

.gcToggle {

    background-color: #ababab;

}

/* the font color for today*/

.gcFGToday {

    background-color: #7F6C73;

}

/* the background color for today*/

.gcBGToday {

    background-color: #004184;

}

/* the font color for the selected date*/

.gcFGSelected {

    background-color: white;

}

/* the background color for the selected date*/

.gcBGSelected {

    background-color: #004184;

}

/* Workday font color*/

.gcWorkday {

    background-color: black;

}

/* Saturday font color*/

.gcSat {

    background-color: black;

}

/* Sunday font color*/

.gcSun {

    background-color: black;

}

.bodyCalendar {

    margin-top: 0;

    font-weight: normal;

    font-size: 12px;

    margin-left: 0;

    color: white;

    font-family: verdana;

    background-color: #668EB5;

}