/*************************************************************
  Copyright (c) Microsoft Corporation.  All rights reserved. 

 
*************************************************************/

/****************
Base
(Currently commented out)This Forces a vertical scroll bar in Non IE6/7 browsers(where a disabled scroll is by default) for consistency
Prevent iOS text size adjust on device orientation change, without disabling user zoom
*****************/

/*Customizable*/ /*indicates a customizable style*/
@import url(/css/customizable.css);

html  
{
    font-size: 100%; 
    /*overflow-y: scroll;*/
    -webkit-text-size-adjust: 100%; 
    -ms-text-size-adjust: 100%; 
}

body
{
    margin:0;
    line-height: 1.231;
    font-size: 14px; /*Customizable*/
    background-color: #ced5ec;  /*Customizable*/
    text-rendering: optimizeLegibility;
    scrollbar-face-color: #ECECEC;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-3dlight-color: #D6D3CE;
    scrollbar-shadow-color: #FFFFFF;
    scrollbar-darkshadow-color: #848284;
    scrollbar-arrow-color: #848284;
    scrollbar-track-color: #EAEAEA;
}

body,
button, 
input, 
select, 
textarea 
{ 
    font-family: Segoe UI, Arial, Verdana, Sans-Serif, Helvetica; /*Customizable*/
    color: #595959; /*Customizable*/
}

/****************
Links
*****************/

a { color: #396faf; text-decoration: none; }  /*Customizable- Link Color and Underline */
a:visited { color: #396faf; text-decoration: none; } /*Customizable- After Link is clicked color and underline */
a:hover { color: #6486ae; text-decoration: none; } /*Customizable- Hover mouse over Link color and underline */
a:focus { outline: thin dotted; } /*Customizable- Keyboard event to Link and Link is in focus outline*/
a:hover, a:active { outline: 0; } /*Customizable- Hover and Active Link outline */

/****************
Typography
*****************/

b, strong { font-weight: bold; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #acd9ec; margin: 1em 0; padding: 0; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

/****************
Lists
*****************/

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

/****************
improves image quality when scaled in IE7
Removes gap between images and borders on image containers
*****************/

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/****************
Corrects overflow not hidden in IE9 
*****************/

svg:not(:root) { overflow: hidden; }

/****************
Tables
*****************/

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

/****************
Forms
*****************/

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicates that 'label' will shift focus to the associated form element */

label { cursor: pointer; }

/****************
Corrects bad alignment displaying in IE6/7 
*****************/

legend { border: 0; *margin-left: -7px; padding: 0; }

/****************
Corrects font-size not inheriting in all browsers
Removes margins in FF3/4 S5 Chrome
Defines consistent vertical alignment display in all browsers
*****************/

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/****************
Defines line-height as normal to match FF3/4
*****************/

button, input { line-height: normal; }

/****************
 Reintroduces inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
*****************/

table button, table input { *overflow: auto; }

/****************
Displays hand cursor for clickable form elements
Allows styling of clickable form elements in iOS
*****************/

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/****************
Consistent box sizing and appearance
*****************/

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/****************
Removes inner padding and border in FF3/4
*****************/

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/****************
Removes default vertical scrollbar in IE6/7/8/9 
Allows only vertical resizing
*****************/

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/****************
Colors for form validity
*****************/

input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

/* Registration/Reset Portal Layout */

#wrapper
{
    margin: 20px auto;
    background: url(../images/bg-top-slice.png) repeat-x 0 0; /*Customizable-remove background img to remove top gradient */
    background-color:#fff;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: 1px 1px 7px rgba(153, 153, 153, 0.2);
    -moz-box-box-shadow: 1px 1px 7px rgba(153, 153, 153, 0.2);
    -webkit-box-shadow: 1px 1px 7px rgba(153, 153, 153, 0.2);
    width: 637px;
    min-height: 460px;
    height:100%;
    position: relative;
}

.ie6 #wrapper
{
    background-image: none;
    height: auto !important;
    height: 460px;
} 

#container
{
    background: url(../images/bg-bottom-slice.png) repeat-x 100% 100% transparent;  /*Customizable-remove background img to remove top gradient */
    padding: 15px;
    min-height: 430px;
    height:100%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    -moz-border-bottom-left-radius: 5px;
    -moz-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
}

.ie6 #container
{
    background-image: none;
    height: auto !important;
    height: 460px;
}

.page
{
    width:100%;
}

#header
{
    margin-bottom: 15px;
}

.title-block
{
    background: url("../images/fimlogo.png") no-repeat scroll 0 0 transparent;  /*Customizable- Logo must be 600px or less in width. Logo must be 50px or less in height. */
    border-bottom: 2px solid #acd9ec; /*Customizable- 2px border color under logo */
    height: 50px; 
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.ie6 .title-block
{
    background-image: url(../images/fimlogo-ie6.png);    /*Customizable- Can make a non-transparent image for IE6 only */
}

.rc-text
{
    font-size:12px;
    position:absolute;
    top:47px;
    right:0;
}

h2, h3
{
    font-size: 18px;
    font-weight: normal;
    float:left;
    color: #578e4c; /*Customizable- h2 page header color */
    line-height: inherit;
    margin: 0;
}

h2
{
    margin-right:10px; 
}
 
h3
{
    color: #333; /*Customizable- h3 page header color */
}

.row
{
    position:relative;
}

.ie6 .row
{
    margin-bottom: 55px;
}

.main-content
{
    margin:15px 0 25px 15px;
}

.validationSummaryClass ul
{
    list-style-type:none;
    padding:10px;
    font-size:13px;
    color:#595959 !important;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: url(../images/icon-error.png) no-repeat 1% 50% #f0dddd;
    margin:-10px 0 5px 0;
}
.ie7 .validationSummaryClass ul
{
    zoom:1;
}
.ie6 .validationSummaryClass ul
{
    background-image: url(../images/icon-error-ie6.png);
    zoom:1;
    margin:0 0 5px 0;
}

.validationSummaryClass ul li
{
    margin-left:25px;
}

div#loadingTemplate
{
    display: none;
}

input[type=text], input[type=password], textarea, select
{
    font-family: "Segoe UI" , "Arial" , "Verdana" , "Sans-Serif" , "Helvetica";
    font-size: 11px;
    border: 1px solid #999;
    height: 18px;
    width: 163px;
    padding: 2px 5px 3px;
}

input[type=password]
{
    min-width: 150px;
}

input.button
{
    height: 25px;
    padding: 0px;
    min-width: 80px;
}

input[type=text]:focus, input[type=password]:focus
{
    border: #82bd3b 2px solid; /*Customizable- Highlight color around textbox when cursor is inside */
    height: 16px;
    width: 161px;
    outline:none;
}

/*for keyboard event. If checkbox is in focus - show outline (in case of no text and no default outline) */
.forcedOutlineOnFocus input[type=checkbox]:focus {
    outline: thin dotted;
}

.ie7 input[type=text], .ie7 input[type=password], .ie7 textarea, .ie7 select
{
    padding: 4px 5px 0 0;
}

.ie6 input[type=text], .ie6 input[type=password], .ie6 textarea, .ie6 select
{
    padding: 2px 5px 0 0;
}

.QAGate-spacer
{
    height:1px;
}

div#chromeButtons
{
    height:27px;
    margin: 0 0 10px 0;
    float:left;
}

.ie6 #chromeButtons
{
    position: relative;
    margin-top: -5px;
}

.chromeButton, .chromeButton:visited
{
    background-color: #333; /*Customizable- Color of button */
    color: #fff; /*Customizable- Color of text on the button */
    border: 1px solid #666; /*Customizable- Border color of button */
    min-width: 75px;
    height: 27px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.chromeButton:hover
{
    background-color: #666; /*Customizable- Hover color of button */
    border: 1px solid #999; /*Customizable- Hover border color of button */
}

.ie .chromeButton, .chromeButton:visited
{
    border: 1px solid #333;
    width:15%;
    min-width: 15%;
}

.ie .chromeButton:hover
{
    border: 1px solid #666;
}

.helpImage
{
    padding-top: 5px;
    border: 0px;
    float:right;
}

.errorImageDiv
{
    background: url(../images/icon-error.png) 0 0 no-repeat transparent;
    width:22px;
    height:22px;
    float:left;
    margin:0px 10px 100px 0;
}

.ie6 .errorImageDiv
{
    background-image: url(../images/icon-error-ie6.png);
}

.errorHeadingTitle
{
    color: #676767 !important;
}

#ctl00_ContentPlaceholderBottom_labelTimestamp 
{
    display:block;
    clear:both;
    margin-left:35px;
}

#footer
{
    bottom: 0;
    font-size: 10px;
    padding: 10px 15px;
    position: absolute;
    right: 0;
    width: 607px;
}
.ie #footer
{
    padding: 0 15px 5px 15px;
}

.ie6 #footer
{
    zoom: 1;
}

.ie hr
{
    margin-bottom:5px;
}

#footer #footerControlsDiv
{
    float:right;
	display:none;
}
/****************
Contain floats
*****************/
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/****************
Hide from both screenreaders and browsers
Hide only visually, but have it available for screenreaders
Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard
Hide visually and from screenreaders, but maintain layout
*****************/
.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; }

/****************
Media Queries
*****************/

/* Smartphones ----------- */
@media only screen and (max-width: 480px)
{
    body /*Customizable- Body Font Size for devices */
    {
        font-size:12px;
    }
    div#wrapper 
    {
        max-width:296px; /*306px - 10px padding)*/
        min-height:320px;
        height: 100%;
        margin:5px auto;
    }
    div#container
    {
        min-height:315px;
        height:100%;
        padding-top:5px;
    }
    #header
    {
        margin-bottom:5px;
    }

    .title-block
    {
        background: url("../images/fim-logo-portrait.png") no-repeat scroll 0 0 transparent;  /*Customizable- Logo must be 458px (landscape) or less in width. Logo must be 50px or less in height. */
        border-bottom: 2px solid #acd9ec;
        height: 50px;
        padding-bottom:6px;
    }
    
    .rc-text
    {
        font-size:10px;
        position:absolute;
        right:0;
        top:58px;
    }
    div.icon,
    div.icon-reg-complete
    {
        display:none;
    }
    h2, h3
    {
        font-size:14px; /*Customizable- H2 and H3 Heading Size for devices */
    }
    .main-content
    {
        margin:5px 0 25px 0;
    }
    .validationSummaryClass ul
    {
        margin:0;
        background-image: none;
        padding:5px;
        font-size:12px;
    }
    .validationSummaryClass ul li
    {
        margin-left:0;
    }

    div#chromeButtons
    {
        margin: 0 0 10px 0;
    }
    #footer
    {
        max-width: 263px;
    }
}

.mainUpdatePanelContentClass {
    margin-bottom: 20px;
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and 
(max-device-width : 1024px) and 
(orientation : landscape) 
{
    div#wrapper 
    {
        min-height: 460px;
        height:100%;
    }
    div#container
    {
        min-height: 430px;
        height:100%;
    }
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and 
(max-device-width : 1024px) and 
(orientation : portrait) 
{
    div#wrapper 
    {
        min-height: 460px;
         height:100%;
    }
    div#container
    {
        min-height: 430px;
         height:100%;
    }
}





