.clear { clear: both; }
body {
	font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
	font-size: 13px;
}
a {
	text-decoration: none;
	color: #000;
}
a:visited {
	color: #000;
}
p {
	margin-bottom: 5px;
}
b { font-weight: bold; }

.ribbon {
    display: block;
    float: left;
    position: relative;
    left: -150px;
    width: 142px;
    height: 28px;
    text-align: center;
    margin-right: -142px;
    color: black;
    font-weight: normal;
}

.ribbon span {
	display: block;
	margin-left: 12px;
	padding-top: 7px;
}

.ribbon-green {
	background-image: url('/ui/images/ribbon-green.png');
}
.ribbon-yellow {
	background-image: url('/ui/images/ribbon-yellow.png');
}
.ribbon-red {
	background-image: url('/ui/images/ribbon-red.png');
}

.clearfix:before,
.clearfix:after {
  content: ".";    
  display: block;    
  height: 0;    
  overflow: hidden; 
}
.clearfix:after {clear: both;}
.clearfix {zoom: 1;} /* IE < 8 */

img.center { display: block; margin-left: auto; margin-right: auto; }
#print { display: none; }
#noprint { display: block; }
#container {
	margin: 10px auto 0 auto;
	width: 900px;
	background: #fff;
	border: 1px solid #000;
	/*overflow: hidden;*/
}
#header {
	background: #eee;
	padding: 10px;
	font-size: 1.5em;
	font-weight: bold;
	height: 50px;
}
#header div a {
	color: #039;
}
#header div a:hover {
	text-decoration: underline;
}
#header img {
	width: 120px;
	vertical-align: middle;
}
#navigation, #subnav {
	float: left;
	width: 900px;
}
#navigation {
	background: #333;
}
#subnav {
	background: #eee;
	border-bottom: 1px solid #000;
}
#navigation ul, #subnav ul {
	margin: 0;
	padding: 0;
}
#navigation ul li, #subnav ul li {
	list-style-type: none;
	display: inline;
}
#navigation li a, #subnav li a {
	display: block;
	float: left;
	padding: 8px 16px 8px 17px;
	text-decoration: none;
}
#navigation li a {
	color: #fff;
	border-right: 1px solid #fff;
}
#subnav li a {
	color: #000;
	border-right: 1px solid #000;
}
#navigation li a:hover {
	background: #2075a1;
}
#subnav li a:hover {
	background: #e2b69b;
}
#content-container {
	float: left;
	width: 900px;
	background: #fff;
}
#content {
	padding: 10px;
	margin: 0;
	/* overflow: hidden; */
}
#content a:hover {
	text-decoration: underline;
	color: #2075a1;
}
#content h2 {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 1.2em;
}
#content h2 {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 1.1em;
}
#sidebar {
	float: left;
	width: 200px;
	padding: 20px 0;
	margin: 0 20px 0 0;
	display: inline;
}
#sidebar h3 {
	margin: 0;
}
#footer {
	clear: both;
	background: #eee;
	text-align: center;
	padding: 10px;
	border-top: 1px solid #000;
}
form {
	margin: 1em 0;
	padding-top: 10px;
}
form fieldset {
	margin: 0;
	padding: 0;
	border: none;
	float: left;
	display: inline;
	width: 260px;
	margin-left: 25px;
}
form legend {
	display: none;
}
form p {
	margin: .5em 0;
}
form label {
	display: block;
}
form input, form textarea {
	width: 252px;
	border: 1px solid #ddd;
	padding: 3px;
}
form textarea {
	height: 125px;
	overflow: auto;
}
form p.submit {
	clear: both;
	padding: 0 25px 20px 25px;
	margin: 0;
	text-align: right;
}
form button {
	padding: 5px 10px;
	cursor: pointer;
}
#hor-zebra {
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}
#hor-zebra tr:hover td {
	color: #000;
	cursor: pointer;
}
#hor-zebra td:first-child {
	border-left: 5px solid #ffffff;
}
#hor-zebra tr:hover td:first-child {
	border-left: 5px solid #d5d5d5;
}
#hor-zebra th {
	font-size: 1.1em;
	font-weight: bold;
	padding: 10px 8px;
	color: #039;
}
#hor-zebra td {
	padding: 8px;
	color: #666;
	font-weight: bold;
}

#hor-zebra .odd {
	/* background: #f3f3f3; */
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
}

dl {
	width: 425px;
	float: left;
	overflow: hidden;
	background: #fff;
	border: 1px solid #666;
	margin: 5px;
}
dl dl {
	width: auto;
	overflow: hidden;
	float: none;
	border: none;
	margin: 0 0 10px 0;
}
dl dt {
	background: #DDD;
	color: #000;
	font-weight: bold;
	padding: 8px;
	width: auto;
}
dl dt a{
	color: #000;
}
dl dt a:visited{
	color: #000;
}
dl dt a:hover{
	color: #039 !important;
}
dl dt div{
	float: right;
}
dl dl dt {
	color: #000;
	background: #fff;
	font-weight: normal;
	float: left;
	padding: 0 0 5px 0;
	width: 135px;
	margin: 0;
}
dl.wider dl dt { width: 250px; }
dl dd {
	padding: 10px;
	font-weight: bold;
	width: auto;
	background: #fff;
	margin: 0;
}
dl dd p{
	font-weight: bold;
}
dl dd p b{
	font-weight: normal;
}
dl dl dd {
	float: left;
	padding: 0 0 5px 0;
	width: 250px;
	margin: 0;
	font-weight: bold;
}
dl.wider dl dd {
	width: 135px;
}
.info, .success, .warning, .error, .announce, .emergency {
	border: 1px solid;
	margin: 10px 0px;
	padding: 15px 10px 15px 50px;
	background-repeat: no-repeat;
	background-position: 10px center;
}
.info {
	color: #00529B;
	background-color: #BDE5F8;
	background-image: url('/ui/css/images/info.png');
}
.success {
	color: #4F8A10;
	background-color: #DFF2BF;
	background-image: url('/ui/css/images/success.png');
}
.warning {
	color: #9F6000;
	background-color: #FEEFB3;
	background-image: url('/ui/css/images/warning.png');
}
.error {
	color: #D8000C;
	background-color: #FFBABA;
	background-image: url('/ui/css/images/error.png');
}
.announce {
	font-size: 1.1em;
	font-weight: bold;
	color: #102241;
	background-color: #dceff8;
	padding-left: 70px;
	background-image: url('/ui/css/images/announcement.png');
}
.emergency {
    background-color: #D8000C;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 1.3em;
    background-image: url('/ui/css/images/error.png');
}

.btnFunction {
	margin-top: -6px;
}

.btnFunction .ui-button-text {
	padding-top: 0.2em !important;
	padding-bottom: 0.2em !important;
	font-size: 0.9em;
	color: #1C94C4 !important;
}

#navigateForm {
	display: none;
}

div.paginator {
    overflow: hidden;
    margin-top: 10px;
    margin-bottom: 10px;
    float: right;
}

div.paginator a {
    display: block;
    width: 30px;
    height: 20px;
    line-height: 20px;
    margin: 2px;
    border: 1px solid #aaa;
    float: left;
    text-align: center;
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px; 
    border-radius: 4px;  
    font-size: 0.8em;
}
           
div.paginator a:hover {
    background: #2075A1;
    color: #fff !important;
    text-decoration: none !important;
}

div.paginator a.active {
    background: #ddd;
}

div.paginator a.active:hover {
    color: #fff !important;          
}

.dialog
{
    display: none;
}
 
.dialogIFrame
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    border: 0px;
}

.slide-out-div {
	padding: 20px 20px 20px 50px;
	background: #fdf5ce;
	border: 1px solid #fbcb09;
}

#risk-tab { width: 300px; }
#docs-tab { width: 240px; }
#checklist-tab { width: 350px; }

#editForm
{
	clear:both!important;
}

/* ============================================================================================================================
== Message Bubbles
** ============================================================================================================================ */

.message-bubble {
	font-size: 1.1em;
	position:relative;
	padding:15px 30px;
	margin:0;
	color:#000;
	background:#f3961c; /* default background for browsers without gradient support */
	/* css3 */
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f0f8d1));
	background:-moz-linear-gradient(#ffffff, #f0f8d1);
	background:-o-linear-gradient(#ffffff, #f0f8d1);
	background:linear-gradient(#ffffff, #f0f8d1);
	/* Using longhand to avoid inconsistencies between Safari 4 and Chrome 4 */
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	border: solid 1px #678a00;
	width: 500px;
}

/* display of quote author (alternatively use a class on the element following the blockquote) */
.message-bubble + p {
	margin:10px 0 2em 67px;
	text-align:left;
	font-style:italic;
	color: #666;
}

.message-bubble span {
	color:#aaa;
	font-weight:bold;
	font-size:0.8em;
}

/* creates the larger triangle */
.message-bubble:before {
	content:"";
	position:absolute;
	bottom:-29px;
	left:30px;
	border-width:15px;
	border-style:solid;
	border-color: #678a00 #678a00 transparent transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* creates the smaller triangle */
.message-bubble:after {
	content:"";
	position:absolute;
	bottom:-27px;
	left:31px; 
	border-width:14px;
	border-style:solid;
	border-color:#f0f8d1 #f0f8d1 transparent transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

.message-bubble-reply {
	font-size: 1.1em;
	position:relative;
	padding:15px 30px;
	margin:0;
	color:#000;
	background:#075698; /* default background for browsers without gradient support */
	/* css3 */
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e5eff9));
	background:-moz-linear-gradient(#ffffff, #e5eff9);
	background:-o-linear-gradient(#ffffff, #e5eff9);
	background:linear-gradient(#ffffff, #e5eff9);
	/* Using longhand to avoid inconsistencies between Safari 4 and Chrome 4 */
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	border: solid 1px #004890;
	width: 500px;
	float:right;
}

/* display of quote author (alternatively use a class on the element following the blockquote) */
.message-bubble-reply + p {
	margin:0px 67px 2em 0;
	text-align:right;
	font-style:italic;
	display:block;
	clear:both;
	padding-top:10px;
	color: #666;
}

.message-bubble-reply span {
	color:#aaa;
	font-weight:bold;
	font-size:0.8em;
}

/* creates the larger triangle */
.message-bubble-reply:before {
	content:"";
	position:absolute;
	bottom:-29px;
	right:29px;
	border-width:15px;
	border-style:solid;
	border-color: #004890 transparent transparent #004890;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* creates the smaller triangle */
.message-bubble-reply:after {
	content:"";
	position:absolute;
	bottom:-27px;
	right:30px; 
	border-width:14px;
	border-style:solid;
	border-color:#e5eff9 transparent transparent #e5eff9;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

.message-bubble-note {
	font-size: 1.1em;
	position:relative;
	padding:15px 30px;
	margin-left: auto;
	margin-right: auto;
	color:#000;
	background:#FFFF00; /* default background for browsers without gradient support */
	/* css3 */
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#fffcd7));
	background:-moz-linear-gradient(#ffffff, #fffcd7);
	background:-o-linear-gradient(#ffffff, #fffcd7);
	background:linear-gradient(#ffffff, #fffcd7);
	/* Using longhand to avoid inconsistencies between Safari 4 and Chrome 4 */
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	border: solid 1px #333333;
	width: 500px;
}

.message-bubble-note span {
	color:#aaa;
	font-weight:bold;
	font-size:0.8em;
}

.message-bubble-note + p {
	margin:0px 200px 2em 0;
	text-align:right;
	font-style:italic;
	display:block;
	clear:both;
	padding-top:5px;
	color: #666;
}

.message-bubble-fee {
	font-size: 1.1em;
	position:relative;
	padding:15px 30px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	color:#000;
	background:#f3961c; /* default background for browsers without gradient support */
	/* css3 */
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#ffffd7));
	background:-moz-linear-gradient(#ffffff, #ffffd7);
	background:-o-linear-gradient(#ffffff, #ffffd7);
	background:linear-gradient(#ffffff, #ffffd7);
	/* Using longhand to avoid inconsistencies between Safari 4 and Chrome 4 */
	-webkit-border-top-left-radius:10px;
	-webkit-border-top-right-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-border-bottom-left-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	border: solid 1px #FF0000;
	width: 500px;
}

.message-bubble-fee span {
	color:#aaa;
	font-weight:bold;
	font-size:0.8em;
}

/* cropzoom styles */
#zoomMin.vertical,#zoomMax.vertical{color:#000;font:700 14px Arial;margin:auto;width:100%;text-align:center}
#zoomSlider.vertical{margin: 7px auto;height: 150px;width:6px;position:relative}
#zoomContainer.vertical{background-color:#FFF;z-index:3;width:31px;height: 200px;top:50px!important;}

#rotationMin.vertical,#rotationMax.vertical{color:#000;font:700 14px Arial;margin:auto;width:100%;text-align:center}
#rotationSlider.vertical{margin: 7px auto;height: 150px;width:6px;position:relative}
#rotationContainer.vertical{background-color:#FFF;z-index:3;width:31px;height: 200px;top:50px!important;}

#zoomMin.horizontal,#zoomMax.horizontal{color:#000;font:300 12px Arial;margin:2px 3px;padding:0 5px;float:left;text-align:center}
#zoomSlider.horizontal{margin: 7px auto;height: 6px;width:300px;float:left;position:relative}
#zoomContainer.horizontal{background-color:#FFF;z-index:3;width:auto;}

#rotationMin.horizontal,#rotationMax.horizontal{color:#000;font:300 12px Arial;margin:2px 4px;float:left;text-align:center}
#rotationSlider.horizontal{margin: 7px 5px;height: 6px;width:300px;float:left;position:relative}
#rotationContainer.horizontal{background-color:#FFF;z-index:3;width:auto;}

/* payday apr table */
.payday-apr-table {
    width: 500px;
    margin-right: 35px;
    margin-top: 25px;
}

.payday-apr-table td, .payday-apr-table th {
    border: 1px solid;
    padding: 10px;
}

.payday-apr-table th {
    background-color: #ddd;
    font-weight: bold;
}

/* service providers */
.left {
    float: left;
    margin-right: 5px;
}

@-webkit-keyframes myanimation {
    from {
        left: 0%;
    }
    to {
        left: 50%;
    }
}

.checkout-wrap {
    color: #444;
    font-family: 'PT Sans Caption', sans-serif;
    margin: 10px auto;
    max-width: 1200px;
    position: relative;
}

ul.checkout-bar li {
    color: #ccc;
    display: block;
    font-size: 14px;
    font-weight: 600;
    padding: 14px 20px 14px 80px;
    position: relative;
}
ul.checkout-bar li:before {
    -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
    box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
    background: #ddd;
    border: 2px solid #FFF;
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    left: 20px;
    line-height: 37px;
    height: 25px;
    position: absolute;
    text-align: center;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
    top: 4px;
    width: 25px;
    z-index: 999;
}
ul.checkout-bar li.active {
    color: #8bc53f;
    font-weight: bold;
}
ul.checkout-bar li.active:before {
    background: #8bc53f;
    z-index: 99999;
}
ul.checkout-bar li.visited {
    background: #ECECEC;
    color: #57aed1;
    z-index: 99999;
}
ul.checkout-bar li.visited:before {
    background: #57aed1;
    z-index: 99999;
}
ul.checkout-bar li:nth-child(1):before {
    content: "1";
}
ul.checkout-bar li:nth-child(2):before {
    content: "2";
}
ul.checkout-bar li:nth-child(3):before {
    content: "3";
}
ul.checkout-bar li:nth-child(4):before {
    content: "4";
}
ul.checkout-bar li:nth-child(5):before {
    content: "5";
}
ul.checkout-bar li:nth-child(6):before {
    content: "6";
}
ul.checkout-bar a {
    color: #57aed1;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

@media all and (min-width: 800px) {
    .checkout-bar li.active:after {
        -webkit-animation: myanimation 3s 0;
        background-size: 25px 25px;
        background-color: #8bc53f;
        background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        content: "";
        height: 10px;
        width: 100%;
        left: 50%;
        position: absolute;
        top: -25px;
        z-index: 0;
    }

    .checkout-wrap {
        margin: 20px auto;
    }

    ul.checkout-bar {
        -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        background-size: 35px 35px;
        background-color: #EcEcEc;
        background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
        background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
        border-radius: 10px;
        height: 10px;
        margin: 0 auto;
        padding: 0;
        position: absolute;
        width: 100%;
    }
    ul.checkout-bar:before {
        background-size: 25px 25px;
        background-color: #57aed1;
        background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        border-radius: 10px;
        content: " ";
        height: 10px;
        left: 0;
        position: absolute;
        width: 10%;
    }
    ul.checkout-bar li {
        display: inline-block;
        margin: 25px 0 0;
        padding: 0;
        text-align: center;
        width: 16%;
    }
    ul.checkout-bar li:before {
        height: 25px;
        left: 43%;
        line-height: 25px;
        position: absolute;
        top: -35px;
        width: 25px;
        z-index: 99;
    }
    ul.checkout-bar li.visited {
        background: none;
    }
    ul.checkout-bar li.visited:after {
        background-size: 25px 25px;
        background-color: #57aed1;
        background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
        -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        box-shadow: inset 2px 2px 2px 0px rgba(0, 0, 0, 0.2);
        content: "";
        height: 10px;
        left: 50%;
        position: absolute;
        top: -25px;
        width: 100%;
        z-index: 99;
    }
}

.no-js #preloader { display: none; }
.js #preloader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('/ui/images/loading.gif') center no-repeat #fff;
}

.cell-highlight { background: yellow; }

.check-green-text, .cross-grey-text {
    font-size:0.75em;
    padding:3px;
    background-size: 10px 10px !important;
    padding-left: 14px;
    display: inline;
	line-height: 17px;
}

.check-green-text {
    border: solid 1px #99CF50;
    background: #DFF2BF url(/ui/images/tick.png) no-repeat 2px center;
}

.cross-grey-text {
    color: #aaaaaa;
    border: solid 1px #c0c0c0;
    background: #F8EDEF url(/ui/images/cross-grey.png) no-repeat 2px center;
}

.apr-setting-disabled { color: #F0F0F0 !important; }

.singleLineCheckbox label { display: inline-block !important; }
.singleLineCheckbox input { width: 50px; }

.singleLineCheckboxLabel { display: inline-block !important; }
.singleLineCheckboxInput { width: 50px; }

.day-spinner { width: 50px !important; }