/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea
{
    color: #222;
}

body
{
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection
{
    background: #D8B33A;
    -webkit-text-shadow: none;
    text-shadow: none;
}

::selection
{
    background: #D8B33A;
    -webkit-text-shadow: none;
    text-shadow: none;
}

hr
{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img
{
    vertical-align: middle;
}

fieldset
{
    border: 0;
    margin: 0;
    padding: 0;
}

textarea
{
    resize: vertical;
}


html
{
    font-size: 100%; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */

    background-color: #C4C4C4;
    
    /* Background image - remove the following lines if this is not desired */
    background: url(../Images/RTXPPBackground.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body
{
    font-family: Arial, Helvetica, sans;
}

a
{
    color: #FFC425;
    font-weight: Bold;
}

p
{
}

h4
{
    margin-bottom: 5px;
}

.container
{
    max-width: 960px;
    margin: auto;
    padding-top: 8px;
    margin-top: 30px;
    overflow: hidden;
    background: #3b6f8f url('../Images/pattern.jpg');
    -webkit-box-shadow: 0px 0px 25px grey;
    box-shadow: 0px 0px 25px grey;
}

    .container .content
    {
        max-width: 678px;
        margin: auto;
        vertical-align: top;
        padding: 4px;
    }

    .container .header .content
    {
        max-width: 800px;
        margin: auto;
    }

.box {
    /*background: #D8B33A;*/
    color: black;
    border-radius: 4px;
    border: 2px solid;
    border-color: #333333;
    -webkit-box-shadow: 0px 2px 5px #32607c;
    box-shadow: 0px 2px 5px #32607c;
    padding: 8px;
    margin-bottom: 5px;
    font-weight: bold;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.box-error {
    background: #ff4040;
}

.box-success {
    background: #7cff40;
}

.regMail {
}

    .regMail > div {
        width: 520px;
        float: left;
    }

    .regMail > button {
        float: right;
        width: 150px;
        padding: 8px;
    }

.header
{
    background: white;
    border-bottom: 2px solid #FFC425;
    margin-bottom: 38px;
    -webkit-box-shadow: 0px 5px 15px #32607c;
    box-shadow: 0px 5px 15px #32607c;
}

    .header .content .logo
    {
        display: block;
        padding: 30px;
        padding-bottom: 0px;
    }

    .header a {
        text-decoration: none;
    }

.serviceTitle
{
    color: #396d8d;
    font-size: 17px;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: -22px;
}

.serviceTitlePreview
{
    color: #396d8d;
    font-size: 15px;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: -22px;
}

.menu
{
    color: #396d8d;
    margin: 0px;
}

    .menu li
    {
        display: inline;
    }

        .menu li a
        {
            text-decoration: none;
            color: #396d8d;
            font-weight: bold;
        }

@media only screen and (max-width : 675px)
{
    .header .content .logo
    {
        margin: auto;
    }

    .header .menu
    {
        padding: 0px;
        margin: 10px;
        margin-top: 25px;
    }

        .header .menu li
        {
            padding: 0px;
            margin: 0px;
            display: block;
            text-align: center;
        }

            .header .menu li a
            {
                background: white;
                display: block;
                padding: 0px;
                border-top: 4px;
            }

    .coldivider
    {
        display: none!important;
    }

    label, input, .fieldpair
    {
        display: block!important;
    }

    .fieldpair, .fieldpair p, .fileupload i
    {
        width: 220px!important;
    }

    .aside
    {
        display: block!important;
        width: 220px;
    }

    .fileupload a
    {
        display: block;
    }

    #terms_check
    {
        display: inline-block!important;
        vertical-align: middle!important;
    }

    .terms
    {
        width: 150px!important;
        display: inline-block!important;
        vertical-align: middle!important;
    }
}

.menu li a:hover
{
    text-decoration: underline;
}

.header .menu
{
    text-align: right;
    display: block;
    margin-bottom: 10px;
}

    .header .menu li a
    {
        padding: 10px 16px;
        font-size: 14px;
        border: 0px solid white;
        transition: border-top 150ms ease-out;
        -webkit-transition: border-top 150ms ease-out;
        -moz-transition: border-top 150ms ease-out;
        -o-transition: border-top 150ms ease-out;
        transition: background 150ms ease-out;
        -webkit-transition: background 150ms ease-out;
        -moz-transition: background 150ms ease-out;
        -o-transition: background 150ms ease-out;
    }

        .header .menu li a:hover, .header .menu li a.active
        {
            border-top: 2px solid #396d8d;
            background: url('../Images/menu_arrow.png') no-repeat center top;
            text-decoration: none;
        }
/* Display Inline doesn't work in IE7, so we add Zoom:1 and *display inline */
.coldivider
{
    display: inline-block;
    -ms-zoom: 1;
    zoom: 1;
    *display: inline;
    padding: 10% 0px;
    margin: 0px;
    height: 100%;
    border-right: 1px solid grey;
    border-left: 1px solid #030303;
    border-top: 1px solid #030303;
    border-bottom: 1px solid grey;
    opacity: .25;
}

.content .hero
{
    position: relative;
    background: #00223D url('../Images/banner.jpg') no-repeat center;
    height: 302px;
    max-width: 100%;
    border-bottom: 2px solid transparent;
    background-position: center; /* Internet Explorer 7/8 */
    cursor: pointer;
}
/*Change this to the image size*/
a .hero
{
    text-decoration: none;
}

.hero:hover
{
    border-bottom: 2px solid #FFC425;
    margin-bottom: 0px;
}

.content .hero h1, .content .hero h3
{
    cursor: pointer;
    position: absolute;
    background: black;
    padding: 4px 10px;
    color: white;
    right: 0px;
}

.content .hero h1
{
    bottom: 40px;
    font-size: 36px;
}

.content .hero h3
{
    bottom: 10px;
    font-size: 18px;
}

.content .twocol
{
    display: inline-block;
    vertical-align: top;
    -ms-zoom: 1;
    zoom: 1;
    *display: inline;
}

    .content .twocol p
    {
        max-width: 300px;
        min-width: 300px;
        display: inline-block;
        -ms-zoom: 1;
        zoom: 1;
        *display: inline;
        margin: 15px 10px;
    }

    .content .twocol p
    {
        padding: 5px;
    }

.content hr
{
    border: 1px inset;
    opacity: .25;
    border-bottom: 1px solid grey;
    border-top: 1px solid #030303;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}

.content
{
    font-size: 12px;
    color: white;
}

.footer
{
    width: 100%;
    height: 113px;
}

    .footer .menu
    {
        font-size: 10px;
        padding-bottom: 25px;
    }

    .footer .menu
    {
        display: block;
        width: 460px;
        margin: auto;
    }

    .footer .logo
    {
        width: 91px;
        display: block;
        margin: auto;
        padding: 25px;
    }

.footer
{
    background: url('../Images/footer_arch.png') no-repeat center top;
    margin-top: 70px;
}




/* ========================================================
   Forms 
   ======================================================== */
.Button
{
    background: #D8B33A;
    color: black;
    border-radius: 4px;
    border: 2px solid;
    border-color: #333333;
    -webkit-box-shadow: 0px 2px 5px #32607c;
    box-shadow: 0px 2px 5px #32607c;
    padding: 4px 16px;
    font-weight: bold;
    width: auto;
}

.Button-small {
    width: 150px;
}

.Button-width {
    width: 250px;
}

.Chevron-right {
    float: right;
    width: 11px;
    height: 13px;
    margin-top: 1px;
    margin-right: -5px;
    background-image: url("../Images/chevron-right.png");
    background-repeat: no-repeat;
}

.Button:disabled, .Button[disabled]
{
    /* Setting the background color only works in IE >= 9, it's ignored by IE 8.
       The text color is ignored by all IEs up to 9, it's always gray with a shadow which cannot be disabled. */
    background-color: gray;
    color: lightgray;
}

input, select, textarea
{
    background: white;
    border: none;
    width: 230px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 4px #2c2c2c;
    box-shadow: inset 0 0 4px #2c2c2c;
    padding: 5px 2px 5px 2px;
}

select
{
    margin-left: 3px;
}

input[type='file'], select
{
    background: none;
    padding: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

select
{
    padding: 1px;
}

input[type='checkbox'], input[type='radio']
{
    width: 15px;
    padding: 0px;
    margin: 5px;
    vertical-align: middle;
}

input[type='file']
{
    border: 0px solid transparent;
    font-weight: bold;
    font-size: 11px;
    color: Grey;
    padding-left: 5px;
    text-align: center;
    height: 20px;
}

/*shadow_style allows cross browser formatting of the select & browse fields*/
.shadow_style
{
    padding: 3px 2px 4px 0px;
    -webkit-box-shadow: inset 0 0 6px #2c2c2c;
    box-shadow: inset 0 0 6px #2c2c2c;
    background: white;
    border-radius: 4px;
    display: inline-block;
    -ms-zoom: 1;
    zoom: 1;
    *display: inline;
}

label
{
    width: 120px;
    display: inline-block;
    -ms-zoom: 1;
    zoom: 1;
    *display: inline;
    text-align: right;
}

    label.terms
    {
        font-size: 11px;
        padding: 0px;
        margin: 0px;
        width: auto;
        text-align: left;
        margin: 15px 0px;
    }

/* Make the radio button labels on the Reports page use their automatic widths, not the
   limited width from the label style above. */
.ReportsRadioButtons label
{
    width: auto;
}

.fileupload a
{
    vertical-align: middle;
    line-height: 21px;
    display: inline-block;
    -ms-zoom: 1;
    zoom: 1;
    *display: inline;
}

.fieldpair
{
    width: 550px;
    display: block;
    margin: 5px 0px;
}

/* Reset the width of the fieldpair and the file upload control to auto.
   This overrides the width set in other CSS classes and makes the file upload control usually wider.
   This is a workaround; without it, Firefox 20 will display the Browse button at a wrong place
   relative to the textbox. */
.resetWidthToAuto {
    width: auto;
}

.aside
{
    color: #C2CBD2;
    font-size: 11px;
}

.SupportedTable
{
    border: 10px solid rgb(92, 131, 155);
}

.SupportedTable td
{
    vertical-align: top;
}


/* ============================================================================
   Data Tables
   ============================================== */
th
{
    background: darkgrey;
}

td, th
{
    padding: 4px 8px;
}

.SupportedTable tr:nth-child(even)
{
    background: #3D6C88;
}

.SupportedTable tr:nth-child(odd)
{
    background: #5C839B;
}







/* ==========================================================================
   Media Queries
   ========================================================================== */

@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi)
{
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir
{
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

    .ir:before
    {
        content: "";
        display: block;
        width: 0;
        height: 150%;
    }

.hidden
{
    display: none !important;
    visibility: hidden;
}

.visuallyhidden
{
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

    .visuallyhidden.focusable:active,
    .visuallyhidden.focusable:focus
    {
        clip: auto;
        height: auto;
        margin: 0;
        overflow: visible;
        position: static;
        width: auto;
    }

.invisible
{
    visibility: hidden;
}

.clearfix:before,
.clearfix:after
{
    content: " ";
    display: table;
}

.clearfix:after
{
    clear: both;
}

.clearfix
{
    *zoom: 1;
}


.Error
{
    color: #FC856E;
    font-weight: bold;
}

.Success
{
    color: Lime;
    font-weight: bold;
}


/********************** Calendar - Styles for Infragistics WebDateChooser ******************************/

.Calendar td
{
    padding: 0px 2px;
}

.CalendarFrame
{
    background-color: #104676;
    color: White;
}

.CalendarContent,
.CalendarDropDown
{
    background-color: #F5F5F5;
    color: Black;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.CalendarDropDown
{
    /* Override the hard-coded default width for select controls from the above CSS */
    width: auto;
}

.CalendarContent td
{
    padding: 0;
}


/* ==========================================================================
   Print styles
   ========================================================================== */

@media print
{
    *
    {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        -webkit-text-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited
    {
        text-decoration: underline;
    }

        a[href]:after
        {
            content: " (" attr(href) ")";
        }

    abbr[title]:after
    {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after
    {
        content: "";
    }

    pre,
    blockquote
    {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead
    {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img
    {
        page-break-inside: avoid;
    }

    img
    {
        max-width: 100% !important;
    }

    @page
    {
        margin: 0.5cm;
    }

    p,
    h2,
    h3
    {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3
    {
        page-break-after: avoid;
    }
}
