﻿/*   Design:   Multiflex-5.4                                    */
/*   Type:     Design with sidebar                              */

/******************/
/* GLOBAL LAYOUT  */
/******************/

body {
    font-size: 62.5%;
    background-color: rgb(0,0,80);
}
    /*Font-size: 1.0em = 10px when browser default size is 16px*/
    body.master {
        min-height: 950px;
    }

/* Standard layout */
.container {
    width: 978px;
    padding-top: 10px;
    padding-bottom: 40px;
    margin: 0 auto;
}

    .container .container-inner {
        width: 978px;
        background: rgb(255,255,255) url(Images/mf/content_bg.png);
    }

    .container .page-header {
        color: rgb(0,0,80);
        width: 978px;
        min-height: 130px /*Non-IE6*/;
        height: auto !important /*Non-IE6*/;
        height: 130px /*IE6*/;
        background: url(images/mf/header_bg.png);
    }

    .container .header-top {
        clear: both;
        width: 958px;
        height: 102px;
        padding: 10px 10px 0 10px;
    }

    .container .header-bottom {
        clear: both;
        width: 958px;
        height: 35px;
        padding: 0 10px 0 10px;
    }

    .container .navbar {
        white-space: nowrap /*IE hack*/;
        float: left;
        width: 968px;
        margin-left: 5px;
        margin-right: 5px;
        height: 46px;
        background: /*rgb(40,104,240)*/ #000050 url(Images/mf/menu_bg.png) repeat-x;
    }

    .container .main {
        clear: both;
        width: 958px;
        padding: 10px 0 20px 0;
        margin-left: 10px;
        margin-right: 10px;
    }

    .container .content {
        display: inline /*Fix IE floating margin bug*/;
        float: right;
        width: 706px;
        overflow: visible !important /*Non-IE6*/;
        overflow: hidden /*IE6*/;
    }

    .container .subcontent {
        display: inline /*Fix IE floating margin bug*/;
        float: left;
        width: 250px;
        overflow: visible !important /*Non-IE6*/;
        overflow: hidden /*IE6*/;
    }

    .container .page-footer {
        clear: both;
        width: 978px;
        padding: 30px 0 10px 0;
        background: url(images/mf/footer_bg.png);
        height: 39px;
    }

/* Small layout for printer friendly windows */
.container-small {
    width: 706px;
    padding-top: 10px;
    padding-bottom: 20px;
    margin: 0 auto;
}

    .container-small .main {
        clear: both;
        width: 706px;
        padding: 10px 0 20px 0;
        border-left: solid 10px rgb(200,200,200);
        border-right: solid 10px rgb(200,200,200);
        background-color: rgb(200,200,200);
    }

    .container-small .content {
        display: inline /*Fix IE floating margin bug*/;
        float: left;
        width: 706px;
        background-color: rgb(200,200,200);
        overflow: visible !important /*Non-IE6*/;
        overflow: hidden /*IE6*/;
    }

    .container-small .page-footer {
        clear: both;
        width: 706px;
        padding: 1.0em 0 1.0em 0;
        border-left: solid 10px rgb(200,200,200);
        border-right: solid 10px rgb(200,200,200);
        background-color: rgb(225,225,225);
        overflow: visible !important /*Non-IE6*/;
        overflow: hidden /*IE6*/;
    }

    .container-small .navbar {
        white-space: nowrap /*IE hack*/;
        float: left;
        width: 706px;
        border-left: solid 10px rgb(200,200,200);
        border-right: solid 10px rgb(200,200,200);
        background-color: rgb(225,225,225);
    }
/*Color navigation bar normal mode*/


/* Smaller layout for pop-up windows */
.container-popup {
    width: 480px;
    padding: 10px;
    background: #fff;
}

/****************/
/*  HEADER-TOP  */
/****************/

.page-header {
    color: /*rgb(198,221,238)*/ rgb(0,0,80);
}

    .page-header a {
        color: rgb(91,91,97);
        text-decoration: none;
        font-weight: bold;
    }

        .page-header a:visited {
            color: rgb(91,91,97);
            text-decoration: none;
        }

        .page-header a:hover {
            color: rgb(91,91,97);
            text-decoration: underline;
        }

/* SITE LOGO */
.sitelogo {
    width: 750px;
    height: 110px;
    position: absolute;
    z-index: 1;
    margin: 20px 0 0 15px;
    background: url(Images/SORlogo1.png);
    background-repeat: no-repeat;
    /*border: 2px solid yellow;*/
}

/* CART BOX */
.header-top .cart-box {
    color: rgb(0,0,0);
}

.header-top .cart-box {
    float: right;
    width: 220px;
    margin: 10px 10px 10px 10px;
    padding: 10px 10px 10px 10px;
    border: double 4px rgb(200, 200, 200);
    background: rgb(255,255,255)
}

    .header-top .cart-box .cart-button {
        float: left;
        width: 50px;
    }

    .header-top .cart-box .cart-status {
        float: left;
        width: 160px;
    }

    .header-top .cart-box a {
        color: rgb(0,0,80);
        font-weight: bold;
        text-decoration: none;
    }

        .header-top .cart-box a:hover {
            color: rgb(0,0,80);
            text-decoration: underline;
        }

        .header-top .cart-box a:visited {
            color: rgb(0,0,80);
        }

/*******************/
/*  HEADER BOTTOM  */
/*******************/

/* SEARCH FORM */
.header-bottom .searchform {
    float: left;
    width: 530px;
    padding: 5px 0 1px 10px;
}

    .header-bottom .searchform fieldset {
        float: left;
        border: none
    }

    .header-bottom .searchform select {
        border: 1px solid rgb(200,200,200);
        width: 300px;
    }

    .header-bottom .searchform input.field {
        border: 1px solid rgb(200,200,200);
        width: 144px;
        height: 18px;
    }

    .header-bottom .searchform input.button {
        padding: 1px;
        background: rgb(230,230,230);
        border: solid 1px rgb(150,150,150);
        text-align: center;
        color: rgb(150,150,150);
    }

        .header-bottom .searchform input.button:hover {
            cursor: pointer;
            border: solid 1px rgb(80,80,80);
            background: rgb(220,220,220);
            color: rgb(80,80,80);
        }

    .header-bottom .searchform img {
        vertical-align: middle;
        padding: 0px 0px 4px 0px;
        cursor: pointer;
    }

/* CART STATUS */
.header-bottom .login-status {
    float: right;
    padding: 8px 10px 3px 0;
    width: 405px;
}

    .header-bottom .login-status ul {
        float: right;
    }

    .header-bottom .login-status li {
        display: inline;
        list-style: none;
        margin-left: 8px;
    }

        .header-bottom .login-status li.hello {
            font-weight: bold;
        }

/********************/
/*  NAVIGATION BAR  */
/********************/

/* MAIN MENU */
.navbar ul {
    list-style-type: none;
}

    .navbar ul li {
        float: left;
        z-index: auto !important /*Non-IE6*/;
        z-index: 1000 /*IE6*/;
    }

        .navbar ul li a {
            float: none !important /*Non-IE6*/;
            float: left /*IE-6*/;
            display: block;
            height: 1.7em;
            line-height: 1.7em;
            padding: 0 16px 0 16px;
            text-decoration: none;
            font-weight: bold;
            color: rgb(255,255,255);
            border-right: solid 0px rgb(215,215,215);
        }

        .navbar ul li ul {
            display: none;
            border: none;
        }

.arrowNav {
    position: absolute;
    z-index: 1;
    margin-top: 12px;
    margin-left: 12px;
    margin-right: 0;
    margin-bottom: 12px;
    padding-left: 25px;
    background: url(Images/mf/arrow1.png) no-repeat;
}

/* SUBMENU (Non-IE6 hovering) */
.navbar ul li:hover {
    position: relative;
}
    /*Sylvain IE hack*/
    .navbar ul li:hover a {
        text-decoration: none;
    }
    /*Color main cells hovering mode*/
    .navbar ul li:hover ul {
        display: block;
        width: 10.0em;
        position: absolute;
        z-index: 1000;
        top: 3.0em;
        margin-top: 0.1em;
        left: 0;
        padding: 0px 16px 0px 16px;
        border-top: solid 1px rgb(215,215,215);
    }

        .navbar ul li:hover ul li a {
            white-space: normal;
            display: block;
            width: 10.0em;
            height: auto;
            line-height: 1.3em;
            margin-left: -17px;
            padding: 4px 16px 4px 16px;
            border-right: solid 1px rgb(215,215,215);
            border-left: solid 1px rgb(215,215,215);
            border-bottom: solid 1px rgb(215,215,215);
            background-color: rgb(235,235,235);
            font-weight: normal;
            color: /*rgb(100,100,100)*/ rgb(255,255,255);
        }
            /*Color subcells normal mode*/
            .navbar ul li:hover ul li a:hover {
                background-color: /*rgb(225,225,225)*/ rgb(254,218,116);
                color: rgb(0,0,0);
                text-decoration: none;
            }
/*Color subcells hovering mode*/

/* SUBMENU (IE6 hovering) */
.navbar table {
    position: absolute;
    z-index: 1000;
    top: 0px;
    left: -1px;
    border-collapse: collapse;
}

.navbar ul li a:hover {
    position: relative /*Sylvain IE hack*/;
    z-index: 1000 /*Sylvain IE hack*/;
    text-decoration: none;
}
    /*Color main cells hovering mode*/
    .navbar ul li a:hover ul {
        display: block;
        width: 10.0em;
        position: absolute;
        z-index: 1000;
        top: 3.1em;
        top: 3.0em;
        left: 0px;
        margin-top: 0.1em;
        border-top: solid 1px rgb(215,215,215);
    }

        .navbar ul li a:hover ul li a {
            white-space: normal;
            display: block;
            width: 10.0em;
            height: 1px;
            line-height: 1.3em;
            padding: 4px 16px 4px 16px;
            border-right: solid 1px rgb(215,215,215);
            border-left: solid 1px rgb(215,215,215);
            border-bottom: solid 1px rgb(215,215,215);
            background-color: rgb(235,235,235);
            font-weight: normal;
            color: rgb(100,100,100);
        }
            /*Color subcells normal mode*/
            .navbar ul li a:hover ul li a:hover {
                background-color: rgb(225,225,225);
                text-decoration: none;
            }
/*Color subcells hovering mode*/
.navbar iframe {
    position: absolute;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    display: none;
}

.navbar :hover iframe {
    left: 0;
    top: 0px;
    width: 300px;
    height: 1000px;
    display /**/: block;
    filter: mask();
}

/* BUTTON BAR */
.navbar .button-bar {
    width: 100%;
    text-align: center;
    padding: 10px 0 10px 0;
}

/************/
/*  CONTENT */
/************/

.content-1col-nobox {
    width: 666px;
    background-color: rgb(255,255,255);
    padding: 0 20px 0 20px;
}

/***************/
/* SUBCONTENT  */
/***************/

.subcontent-box {
    width: 250px;
    background-color: /*rgb(237,253,206)*/ rgb(245,250,254);
    padding: 0.5em 0 0.5em 0; /*border-bottom: solid 2px /*rgb(114,141,38)*/ /*rgb(0,102,153);*/
}

/************/
/*  FOOTER  */
/************/
.page-footer p {
    clear: both;
    line-height: 1.3em;
    text-align: center;
    font-weight: bold;
    color: rgb(0,0,80);
}

    .page-footer p.credits {
        clear: both;
        font-weight: normal;
    }

.page-footer a, .page-footer a:visited {
    text-decoration: underline;
    color: rgb(0,0,80);
}

    .page-footer a:hover {
        text-decoration: none;
        color: rgb(0,0,0);
    }

.container .page-footer p {
    color: rgb(0,0,80);
}

.container .page-footer a, .page-footer a:visited {
    color: rgb(0,0,80);
}

/* Special footer elements for pop-up windows */
.container-popup .page-footer {
    font-size: 0.9em;
    margin-top: 1.0em;
}

.container-popup .close-bar {
    text-align: center;
    background-color: rgb(240,240,240);
    padding: 0.2em;
    border: solid 1px rgb(125,125,125);
}

/*********************/
/*  ROUNDED CORNERS  */
/*********************/

/* PAGE */
.container .corner-page-top {
    visibility: hidden;
    height: 0;
}

.container .corner-page-bottom {
    visibility: hidden;
    height: 0;
}

/* For printer-friendly windows */
.container-small .corner-page-top {
    width: 706px;
    height: 10px;
    background: transparent url(Images/mf/bg_corner_page_top_small.gif) no-repeat;
    overflow: hidden;
}

.container-small .corner-page-bottom {
    width: 706px;
    height: 10px;
    padding-bottom: 20px;
    background: transparent url(Images/mf/bg_corner_page_bottom_small.gif) no-repeat;
    overflow: hidden;
}

/* CONTENT */
.container .corner-content-1col-top {
    clear: both;
    width: 706px;
    visibility: hidden;
    height: 0;
}

.container .corner-content-1col-bottom {
    clear: both;
    width: 706px;
    visibility: hidden;
    height: 0;
}

.container-small .corner-content-1col-top {
    clear: both;
    width: 706px;
    height: 7px;
    background: white url(Images/mf/bg_corner_content_1col_top.gif) no-repeat;
    overflow: hidden;
}

.container-small .corner-content-1col-bottom {
    clear: both;
    width: 706px;
    height: 7px;
    background: transparent url(Images/mf/bg_corner_content_1col_bottom.gif) no-repeat;
    overflow: hidden;
}


/* SUBCONTENT */
.corner-subcontent-top {
    clear: both;
    width: 240px;
    visibility: hidden;
    height: 0;
}

.corner-subcontent-bottom {
    clear: both;
    width: 240px;
    visibility: hidden;
    height: 0;
}

/******************/
/*  CLEAR FLOATS  */
/******************/
.container:after, .header:after, .header-top:after, .header-bottom:after, .navbar:after, .main:after, .content:after, .subcontent:after, .footer:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clear {
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.content-1col-nobox:after, .content-1col-box:after, .subcontent-box:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.corner-content-1col-top:after, .corner-content-1col-bottom:after, .corner-subcontent-top:after, .corner-subcontent-bottom:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

p:after {
    content: ".";
    display: block;
    height: 0; /*clear:both Do not use here to avoid paragraphs clearing next to images;*/
    visibility: hidden;
}

/**************/
/*  PRINTING  */
/**************/
@media print {
    img {
        max-width: 100%;
    }

    h1 {
        font-size: 24pt;
    }
}


@page {
    margin: 2cm;
}


/**************/
/* Questionaire STYLE */
/**************/

.helpText {
    /*color:rgb(125,125,125);*/
    vertical-align: top;
    /*line-height:1em;*/
    font-size: 1.1em;
    /*font-style:italic;*/
}

.responseText {
    /*vertical-align:bottom;*/
    /*text-align:left;*/
    width: 600px;
}

    .responseText td {
        width: 220px;
        /*background-color:yellow;*/
    }

.promptText {
    /*vertical-align:bottom;*/
    /*background-color:red;*/
    width: 143px;
}

.checkListStyle {
    width: 200px;
}
