/**
 * WBE Base CSS
 *
 * This defines core site styles such as padding, general widths,
 * and background colors (that can be overridden in customization
 * css files).
 *
 * If it is necessary to apply any IE6 hacks in here, please specify
 * with a comment, and a note as to why this was necessary.
 *
 * Base Fonts:
 * Global: Arial, Helvetica, sans-serif
 * Box Headers: Georgia, serif
 *
 * Base Font Size:
 * Global (p, label, etc): 11px (85%)
 *
 * Base Colors:
 * Global Font: rgb(77,77,77)
 * Box Header Font:  rgb(26,83,130)
 *
 * Temporary Colors until finalized
 * Background: #195381
 * Box Header background: #f2f2f2
 * Box background: rgb(255,255,255)
 * Box border: #444 // TODO this subs for the shadow that we have not impl'd
 * Link: rgb(7,137,198)
 */
html {
    background: #195381 url(/wbe/assets/wubu-6/global/background.jpg) repeat-x left top;
    color: rgb(77, 77, 77);
}

body {
    /*
     * The document has a fluid width, but must maintain atleast 760px (to
     * avoid any unforseen layout issues [while this will still work on a
     * 800x600 resolution screen]).
     */
    min-width: 600px;
/*     max-width: 1024px; */
    margin: auto;
}


h2 {
    font-weight: bold;
    margin-bottom: .5em;
}

h3 {
    font-weight: bold;
    font-size: 85%;
    text-transform: uppercase;
}

h4 {
    font-size: 125%;
    color: #1B5483;
    padding: .5em .5em 0 .5em;
    border-bottom: 1px solid #000;
    margin-bottom: .5em;
}

p {
    color: #4E4E4E;
    margin-bottom: 1em;
}

a {
    color: rgb(7, 137, 198);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

p, label, table, li {
    font-size:85%;/*r old 85% */
}

strong {
    font-weight: bold
}

em {
    font-style: italic;
}

ul {
    margin-bottom: .5em;
}

ul li {
    margin-left: 1.5em;
    list-style: circle;
}

h5 {
    font-family: Arial;
    font-size: 17pt;
    color: #0F385B;
    padding: 0px;
    margin: 5px 0px 5px 0px;
}

object, embed {
    display: block;
}

input[type = radio] {
    vertical-align: middle;
}

.title {
    font-weight: bold;
    color: #1B5483;
}

.required {
    color: #E52527;
}

.notice {
    font-style: italic;
    font-size: 77%;
}

/**
 * General Modals
 */
#control_overlay {
    background: #000;
}

/*
 * TODO these are too spec and px oriented. FIXME (see Cart) */
/**
 * Adds a light gray border around an element
 */
.grayBorder {
    border: 1px solid #989898;
}

.padded {
    padding: 5px;
}

/*
 * For padding/margin/colors for generalized grid-containers
 *
 * These are currently used solely by
 * <t:templates.wubu.boxWrapper />
 */
.grid-container, .grid-container-gradient {
    margin-bottom: 1.75em;
    border: 1px solid #676767;
}

.grid-container-content, .grid-container-content-nopadding .innerPadding {
    /*
     * The innerPadding class allows us to delegate the contents of a
     * grid-container to handle padding, and using a block-level element
     * with that class will inherit the default padding.
     */
    padding: .5em;
    background: rgb(255, 255, 255) url(/wbe/assets/wubu-6/box-wrapper/background.png) repeat-x left top;
}
.result-container .grid-container-content, .grid-container-content-nopadding .innerPadding
    background: url("/wbe/assets/wubu-6/box-wrapper/background.png") repeat-x scroll left top #FFFFFF !important;
    padding: 0.5em;
}
.grid-container-gradient .grid-container-content {
    padding: 1em;
    /*
     * TODO move this image to the box-wrapper folder.
     */
    background: #0F385B url(/wbe/assets/wubu-6/global/gradient-1089C5_to_0F385B.png) repeat-x left top;
}

.grid-container-gradient .grid-container-content .innerWrapper {
    /**
     * For the alternate styling of the grid with a blue gradient
     *  with white area in the center. These are enabled when the
     *  BoxWrapper has the addGradient property set to true.
     */
    background: #FFF;
    border: 1px solid #E6E6E5;
    padding: 2em;
}

/*
 * Removes any of the .grid-container-content padding.
 *
 * Notice: only use this generalized css class to compensate for innerPadding/
 * grid-container-content padding. More specific implementations should be
 * paired (in the CSS) with the wrapper that the padding is being eliminated
 * from.
 */
.grid-container-content .removePadding {
    margin: -.5em;
}

/*
 * For any grids containers that need to ignore padding (where the
 * contents of the container itself is responsible for its proper
 * padding)
 */
.grid-container-content-nopadding {
    padding: 0;
}

.grid-container h2.title, .grid-container-content, .border {
    /*
     * The CSS Validator will have a field day with these declarations. Cross
     * browser workings to implement drop shadow without jacking our layout.
     */
    -moz-box-shadow: 3px 3px 12px #333;
    -webkit-box-shadow: 3px 3px 12px #333;
    box-shadow: 3px 3px 12px #333;
}

.grid-container h2.title {
    background: #f2f2f2 url(/wbe/assets/wubu-6/box-wrapper/header.png) repeat-x left bottom;
    font-family: Georgia, sans-serif;
    font-style: italic;
    padding: .5em;
    color: rgb(26, 83, 130);
    margin: 0;
    font-weight: normal;
    font-size: 130%;
}

/* TODO implementing structure for look and feel alone. Fix */
div.graybar {
    border-top: 1px solid #989898;
    height: 1px;
    padding: 0;
    margin: 20px -2em;
}

div.shortgraybar {
    border-top: 1px solid #989898;
    height: 1px;
    padding: 0;
    margin: 0em 0em;
}

/**
 * T5 Grid for booking management
 *
 */
table.ati-data-grid {
    width: 100%;
}

table.ati-data-grid thead th, table.ati-data-grid tbody td {
    text-transform: uppercase;
    border-bottom: 1px solid #4e4e4e;
    padding: 6px 10px;
    font-weight: bold;
}

table.ati-data-grid thead th {
    padding-bottom: 10px;
    color: #676767;
}

table.ati-data-grid thead th a {
    color: #676767;
    text-decoration: underline;
}

table.ati-data-grid tbody td {
    color: #1b5483;
}

/* Added new style to reduce the white space in best-western page - Priya */
/* best-western embed style starts here */
.best-western-embed {
    display:inline;
}
/* best-western embed style ends here */

/**
 * Clearfix utility declaration, makes a container wrap all floated elements
 * without having to float itself.
 *
 * Simply append the class "clearfix" to the element in question.
 */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}