﻿@font-face {
	font-family: Arial, Sans-serif;
	src: url('fonts/OpenSans-Regular.woff') format('woff');
}

html, body {
	text-align: left;
	font-family: Arial, Sans-serif;
	font-size: 100%;
	color: #15204a;
	margin: 0px;
	padding: 0px;
	min-width: 960px;
	background-color: #ebebeb;
}

#header {
	height: 80px;
	margin: 0px;
	clear: both;
	color: #15204a;
	background: url(images/header_gradient.png) center repeat-x;
	background-color: #dfecf1;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
}

#header_content {
	width: 100%;
	padding: 0px;
	background: url(images/header_shine.png) center no-repeat;
	font-size: 220%;
	font-style: italic;
	color: #532e73;
}

#q2logo {
	float: left;
	width: 140px;
	height: 60px;
	margin: 10px 0px 0px 20px;
	background: url(images/q2_logo.png) top left no-repeat;
}

#q2tagline {
	font-family: Arial, Sans-serif;
	float: left;
	width: 150px;
	height: 37px;
	margin: 0px;
	padding: 41px 0px 0px 15px;
	color: rgb(204, 153, 102);
	font-size: 9pt;
	font-style: italic;
	font-weight: bold;
}

#header_shadow {
	width: 100%;
	height: 14px;
	background: url(images/header_shadow.png) center;
	background-repeat: no-repeat;
	background-color: #ebebeb;
	margin: 0px 0px 30px 0px;
	padding: 0px;
	clear: both;
	position: fixed;
	top: 80px;
	left: 0;
	right: 0;
}

#header2 {
	height: 40px;
	margin: 0px;
	clear: both;
	color: #15204a;
	background-color: #ebebeb;
	position: fixed;
	top: 94px;
	left: 0;
	right: 0;
	z-index: 100;
}

.fadeIn {
	/* Animation CSS
	---------------------------------------------------- */
	opacity: 0;
	-webkit-animation: fadeIn ease-in 1;
	-moz-animation: fadeIn ease-in 1;
	-o-animation: fadeIn ease-in 1;
	animation: fadeIn ease-in 1;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
 
/* Animation Time
---------------------------------------------------- */
.fadeIn-1s {
	-webkit-animation-duration: 0.25s;
	-moz-animation-duration: 0.25s;
	-o-animation-duration: 0.25s;
	animation-duration: 0.25s;
}
 

/* Animation Delay
---------------------------------------------------- */
.fadeIn-Delay-0s {
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-o-animation-delay: 0s;
	animation-delay: 0s;
}
 
/* Key Frames
---------------------------------------------------- */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

/**
a:link {
	color: #3b3131;
}
a:visited {
	color: #3b3131;
}
a:hover {
	color: #3b3131;
	text-decoration: none;
}
a:active {
	color: #3b3131;
}
*/

.pager {
	width: 100%;
	/*background-color: gray;*/
	word-wrap: break-word;
	overflow: hidden;
}

#maincontentwrapper {
	display: block;
	width: 97%;
	min-width: 740px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 32px;
}

#modulesMenu {
	display: block;
	width: 97%;
	height: 40px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

td.menuItem {
	font-family: Arial, Sans-serif;
	color: white;
	background: url(images/menu_unselected.png);
    background-repeat: repeat-x;
	padding: 0px 12px;
	width: 120px;
	height: 38px;
	line-height: 38px;
	text-align: center;
	float: left;
	position: relative;
}

a.menuText {
	color: #15204a;
	font-size: 9pt;
	text-decoration: none;
	border: none;
	color: rgb(88, 47, 126);
	font-weight: bold;
}

td.menuItem:hover {
	background: url(images/menu_selected.png);
}

#formcontainer {
	width: 100%;
	margin-top: 134px;
	padding-bottom: 20px;
	background: url(images/content_pane_gradient.png) top left repeat-x;
	background-color: white;
	border-left-style: solid;
	border-left-width: 1px;
	border-right-style: solid;
	border-right-width: 1px;
	border-left-color: #bed6f8;
	border-right-color: #bed6f8;
	border-bottom: 1px solid #bed6f8;
	box-shadow: 0 8px 6px -6px gray;
	-webkit-box-shadow: 0 8px 6px -6px gray;
	-moz-box-shadow: 0 8px 6px -6px gray;
}

#formtitle {
	color: white;
	font-size: 125%;
	font-weight: bold;
	text-align: left;
	height: 28px;
	line-height: 28px;
	padding: 24px 0px;
	margin: 40px 0px;
	background: url(images/form_title.png) left;
	background-repeat: repeat-y;
	background-color: #232b2e;
	transition: background 0.5s ease;
	-webkit-transition: background 0.5s ease; /*safari/chrome*/
	-moz-transition: background 0.5s ease;  /*firefox*/
	-o-transition: background 0.5s ease;  /*opera*/
}

#formtitle:hover {
	background-color: #232b2e;
	font-weight: bold;
}

#form {
	width: 100%;
	font-size: 100%;
	background-color: white;
}

#formcontent {
	text-align: left;
}

DIV.item { border-top: 1px dotted gray; padding-top: .7em; margin-bottom: .7em; }
DIV.item:first-child { border-top: none; padding-top: 0; }
DIV.item H3 { font-size: 1.3em; margin: 0 0 .25em 0; }
DIV.item H4 { font-size: 1.1em; margin: .4em 0 0 0; }

DIV.pager { text-align: center; border-top: 2px solid silver; padding: .5em 0 .5em 0; margin-top: 1em; }
DIV.pager A { font-size: 1.1em; color: #666; text-decoration: none; padding: 0 .4em 0 .4em; }
DIV.pager A:hover { background-color: Silver; }
DIV.pager A.selected { background-color: #353535; color: White; }

div.outerContainer {
	text-align: center;
}

#mainContentDiv {
	text-align: center;
	margin: 0px auto;
}

#pagetitle {
	width: 100%;
	float: left;
	clear: both;
	margin: 15px 0px 20px 10px;
	text-align: left;
	font-family: Arial, Sans-serif;
	color: #15204a;
	font-size: 16pt;
	font-weight: bold;
}

#contentwrapper {
	width: 98%;
	text-align: center;
	margin: 0px auto 0px auto;
}

#content {
	margin-left: 0px;
	margin-right: 0px;
	text-align: left;
}

#tablewrapper {
	text-align: center;
}

.tablewrapper {
	margin: 0 auto;
	text-align: center;
	position: relative;
}

table { text-align: center; margin: 0 auto; cursor: default; }
table th { text-align: center; padding: 10px 0px 10px 0px; background-color: #dee7ef; font-weight: normal; overflow: hidden; text-overflow: ellipsis; }
table td { text-align: left; padding: .2em 5px; margin: 0px 0px; overflow: hidden; text-overflow: ellipsis; }

/*
th:hover { background: #c6dfef; }
tr:hover { background: #eeeeee; }
*/

div.radioButtonsFilter { display: inline-block; float: left; text-align: center; }

div.error { display: inline-block; color: red; }
span.error {color: red; }

.formrow {
	width: 95%;
	margin-bottom: 15px;
	clear: both;
}

.formitem1 {
	height: 25px;
	width: 35%;
	float: left;
	vertical-align: top;
	text-align: left;
	padding-left: 10px;
}

.formitemReadOnly {
	width: 50%;
	vertical-align: top;
	background-color: lightgray
}

.formitem2 {
	width: 50%;
	vertical-align: top;
}

.formitem3 {
	width: 40%;
	margin-right: 5%;
	margin-top: 2px;
	vertical-align: top;
}

.centeralign {
	text-align: center;
}

.applicationTitle {
	text-align: left;
	/*margin: 0px 0px 0px 32px;*/
	margin-bottom: 10px;
	font-size: 200%;
}

#leftbar {
	z-index: 2;
	width: 160px;
	position: fixed; top: 0; bottom: 0;
	margin: 0px 36px 0px 24px;
	padding: 0px 0px 0px 10px;
	background-color: white;
	border-right: 2px solid #ade3f7;
	border-left: 2px solid #ade3f7;
}

.formBordered {
	min-height: 24px;
	clear: both;
	border: 1px solid #bed6f8;
	margin: 10px auto;
	vertical-align: central;
	padding: 10px 0;
	background-color: #dfecf1;
}

/*Button Arrow Styles*/
.arrows {
    font-size:90%;
    margin:0.2em;
}

.button {
    /*adjust the roundness*/
    border-radius: 4px;
    moz-border-radius: 4px;
    webkit-border-radius: 4px;
    /*adjust height and width*/
    height: 20px;
    width: 20px; 
    /*change border colour*/
    border:1px #245ec6 solid;
}

#checkoutbutton {
    background-color: #33FF00;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border: 5px solid #009900;
  padding: 5px;
}

.db_button {
    display: inline-block;
    width: 450px;
    height: 31px;
    line-height: 31px;
    vertical-align: middle;
    text-align: center;
    color: #15204a;
    font-weight: bold;
    text-decoration: none;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border: 1px solid #4f7e9e;
    background: #e5f5ff; /* Old browsers */
    background: -moz-linear-gradient(top, #e5f5ff 0%, #b1d2e8 50%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5f5ff), color-stop(50%,#b1d2e8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* IE10+ */
    background: linear-gradient(to bottom, #e5f5ff 0%,#b1d2e8 50%); /* W3C */
    opacity: 0.9;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -kthtml-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.db_button:hover {
    opacity: 1;
    background: #e5f5ff; /* Old browsers */
    background: -moz-linear-gradient(top, #e5f5ff 0%, #b1d2e8 50%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5f5ff), color-stop(50%,#b1d2e8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #e5f5ff 0%,#b1d2e8 50%); /* IE10+ */
    background: linear-gradient(to bottom, #e5f5ff 0%,#b1d2e8 50%); /* W3C */
    -webkit-box-shadow: 
    0px 0px 5px #ffffe0, 
    inset 0 0 5px #1b3f8b;
    -moz-box-shadow: 
    0px 0px 5px #ffffe0, 
    inset 0 0 5px #1b3f8b;
    -o-box-shadow: 
    0px 0px 5px #ffffe0, 
    inset 0 0 5px #1b3f8b;
    box-shadow: 
    0px 0px 5px #ffffe0, 
    inset 0 0 5px #1b3f8b;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -kthtml-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

a.db_button {color: #15204a; font-weight: bold; text-decoration: none;}
a.db_button:link {color: #15204a; font-weight: bold; text-decoration: none;}
a.db_button:visited {color: #15204a; font-weight: bold; text-decoration: none;}
a.db_button:hover {color: #15204a; font-weight: bold; text-decoration: none;}
a.db_button:active {color: #15204a; font-weight: bold; text-decoration: none;}

input {
    max-width: 90%;
    margin: 0 auto;
}

input[type="image"] 
{
    opacity: 1;
    filter: alpha(opacity=100);
}

input[type="image"]:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
}

input[type="image"]:active {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-box-shadow: 
    0px 0px 5px red, 
    inset 0 0 5px red;
    -moz-box-shadow: 
    0px 0px 5px red, 
    inset 0 0 5px red;
    -o-box-shadow: 
    0px 0px 5px red, 
    inset 0 0 5px red;
    box-shadow: 
    0px 0px 5px red, 
    inset 0 0 5px red;
}

li:hover {
    cursor: pointer;
}

#UpdateProgress1 {
    position: fixed;
    top: 45%;
    left: 45%;
    background-color: white;
    padding: 10px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
	-moz-box-shadow: 1px 1px 2px #cacacc, -1px 1px 2px #c6dfef;
	-webkit-box-shadow: 1px 1px 2px #cacacc, -1px 1px 2px #c6dfef;
	box-shadow: 1px 1px 10px 3px #cacacc, -1px 1px 10px 3px #c6dfef;
}

pre 
{
    color: #2b3b7e;
    white-space: pre-wrap; /* CSS 3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    -ms-word-wrap: break-word;
    word-wrap: break-word;
    font-family: Arial, Sans-serif;
    font-size: 11pt;
    width: 70%;
}