/* MSI APP TEMPLATE GENERAL STYLES */

/* ===== Fonts ===== */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}

/* ===== Basics ===== */
html, body {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  line-height:160%;	
}

/* optional background styles */
body.background {
	background:url(../Images/background.jpg) no-repeat;
	background-size:cover;
	min-height:900px;
}
@media (max-width:480px) {
body.background {
	background:none;
	min-height:1500px;
	background-color:#9FC3E0;
}	
}

body.color {
	/* optional, change to whatever it needs to be in the skin file */
}

.background-texture-1 {/* black dots */
background:url(../Images/body-bg3.png) repeat;	
}

.background-texture-2 {/* white dots */
background:url(../Images/body-bg4.png) repeat;	
}

.background-texture-3 {/* tranparent white */
background:url(../Images/body-bg5.png) repeat;	
}

.background-texture-4 {/* tranparent gray */
background:url(../Images/body-bg6.png) repeat;	
}

/* end background styles */

a:link {
color:#00678C;	
}

h1 {
text-transform:uppercase;
font-size:2em;
color:#616161;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  line-height:100%;		
}

h2 {
text-transform:uppercase;
font-size:1.65em;
color:#616161;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  line-height:100%;		
}

h3 {
text-transform:uppercase;
font-size:1.25em;
color:#616161;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  line-height:100%;		
}

/* ===== Global Horizontal Bar ===== */
#global {
background-color:#444444;
color:#fff;	
min-height:30px;
}

#global-logo, #global-chat {
padding:8px;	
}

#global-chat img {
margin-right:4px;	
}

#global-chat {
padding-right:12px;	
}

#global-chat a:link, #global-chat a:visited{
color:#fff !important;	
}

/* ===== Header ===== */

#appTitle {
text-transform:uppercase;
font-size:2.5em;
color:#fff;/* if background light, use #616161 */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  padding-top:1.5em;
  line-height:100%;	
  text-align:right !important;
background-color:none;
}

#agency-logo {
padding-top:1.5em;
text-align:left !important;
}

@media (max-width:990px) {
	#appTitle {
font-size:2em;
padding-top:1em;	
}
}

@media (max-width:768px) {
	#appTitle{
text-align:center !important;
}

#agency-logo img {
margin:0 auto 0 auto;	
}
}

/* ===== App ===== */

#app {
background: rgb(246, 246, 246);	/* Fallback for older browsers */
background: rgba(246, 246, 246, 0.9);
margin-top:36px;
margin-bottom:16px;
padding:8px; 	
}

#app ul li {
list-style-image: url(../Content/images/bullet.png);
margin-bottom:4px;
}

/* ===== Footer ===== */
footer {
background: rgb(246, 246, 246);/* Fallback for older browsers */
background: rgba(246, 246, 246, 0.9);
margin-top:36px;
margin-bottom:16px;
padding:8px; 	
}

#footer-logo {
text-align:right !important;	
}

@media (max-width:768px) {
	#footer-links, #footer-logo {
text-align:center !important;
}

#footer-logo img {
margin:0 auto 0 auto;	
}
}
/* ===== Utilities ===== */

.important {
	color:#8C0000;
}

.container-fluid {/* use for areas that are to span the full width of the screen */
margin-left: 0; margin-right: 0;	
}

.divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #fff;
}

/* ===== Buttons ===== */

.btn {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;	
margin-bottom:12px;
margin-right:10px;
}

.btn-xlg a:link, .btn-xlg a:visited {
color:#fff;	
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
}

.btn-xlg a:hover, .btn-xlg a:active {
text-decoration:none;
}

.btn-xlg,
.btn-group-xlg > .btn {
  padding: 14px 20px;
  font-size: 24px;
  line-height: 150%;
  border-radius: 6px;
}

@media (max-width:480px) {
.btn-xlg,
.btn-group-xlg > .btn {
  padding: 10px 14px;
  font-size: 16px;
  line-height: 150%;
  border-radius: 6px;
}	
}

.btn-primary {
  color: #fff;
  background-color: #467C8C;
  border-color: #467C8C;

}



.btn-primary, .btn-default {
	  text-transform:uppercase;
}


.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #36616D;
  border-color: #36616D;
}
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #36616D;
  border-color: #36616D;
}

/* ===== Progress bar ===== */

.progress-bar {
  font-size: 14px;
  line-height: 150%;
  background-color: #5999AC;
}

/* ===== Forms ===== */

@media (max-width:768px) {
input.form-control{
height:50px;	
}

input[type="file"]	{
height:30px;	
}
}

form, label {
color:#444444;
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;	
}



/* ===== Nav bar ===== */

ul.dropdown-menu li {
list-style-type:none  !important;
list-style-image:none !important;	
}

a.navbar-brand {
display:none;
color:#fff;	
}

a.navbar-brand:link {
color:#fff;	
}



@media (max-width:768px) {
a.navbar-brand {
display:block;	
}	
}

.navbar-nav a:link {
color:#fff !important;	
}

.navbar-custom {
  background-color: #5999AC;
  border-color: #5999AC;
  
}

.navbar-custom ul.dropdown-menu{
background-color:#5999AC;
}

ul.dropdown-menu li a:hover {
background-color:#467C8C !important;	
}
.navbar-custom .navbar-brand {
  color: #fff;
}
.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-custom .navbar-text {
  color: #fff;
}
.navbar-custom .navbar-nav > li > a {
  color: #fff;
}
.navbar-custom .navbar-nav > li > a:hover,
.navbar-custom .navbar-nav > li > a:focus {
  color: #fff;
  background-color: #467C8C;
}
.navbar-custom .navbar-nav > .active > a,
.navbar-custom .navbar-nav > .active > a:hover,
.navbar-custom .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #467C8C;
}
.navbar-custom .navbar-nav > .disabled > a,
.navbar-custom .navbar-nav > .disabled > a:hover,
.navbar-custom .navbar-nav > .disabled > a:focus {
  color: #444;
  background-color: transparent;
}
.navbar-custom .navbar-toggle {
  border-color: #fff;
}
.navbar-custom .navbar-toggle:hover,
.navbar-custom .navbar-toggle:focus {
  background-color: #467C8C;
}
.navbar-custom .navbar-toggle .icon-bar {
  background-color: #5999AC;
}
.navbar-custom .navbar-collapse,
.navbar-custom .navbar-form {
  border-color: #101010;
}
.navbar-custom .navbar-nav > .open > a,
.navbar-custom .navbar-nav > .open > a:hover,
.navbar-custom .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #467C8C;
}

span.icon-bar {
background-color:#fff !important;	
}

/* ===== Panel ===== */
.panel-custom {
  border-color: #467C8C;
}
.panel-custom > .panel-heading {
  color: #fff;
  background-color: #467C8C;
  border-color: #467C8C;
}
.panel-custom > .panel-heading + .panel-collapse .panel-body {
  border-top-color: #467C8C;
}
.panel-custom > .panel-footer + .panel-collapse .panel-body {
  border-bottom-color: #467C8C;
}

.panel-heading {
text-transform:uppercase;	
}

/* ===== Wizard styles ===== */

/* = custom CONTAINER
----------------------------*/
.wizard-custom {
	padding:0px;
	position: relative;
	clear:both;
	display: block;
	margin-top: 20px;
	margin-right: 10px;
	margin-bottom: 75px;
	margin-left: 10px;
}
.wizard-custom div {
    position:relative;
margin-bottom:16px !important;
}

.wizard-custom i {
font-style:normal;	
}

@media (max-width:480px) {
.wizard-custom i {
display:none;
}	
.wizard-custom div b {
text-align:center!important;
padding-left:8px;	
}
.wizard-custom span {
	display: block;
	float: left;
	font-size: 1.5em !important;
	
	width:auto;
border:none;
}
}
/* = STEP NUMBERS
----------------------------*/
.wizard-custom span {
	display: block;
	float: left;
	font-size: 75%;
	text-align:center;
	width:15px;
border:none;
}
/* = DEFAULT custom
----------------------------*/
.wizard-custom a {
    position:relative;
    display:block;
    width:auto;
    height:24px;
    margin-right: 18px;
    padding:0px 10px 0px 3px;
    float: left;
    font-size:11px;
    line-height:24px;
    color:#fff;
    background: #73A9B9;
    text-decoration:none;
	border:none !important;
}

.wizard-custom b {
    position:relative;
    display:block;
    width:auto;
    height:24px;
    margin-right: 18px;
    padding:0px 10px 0px 3px;
    float: left;
    font-size:11px;
    line-height:24px;
    color:#fff;
    background: #73A9B9;
    text-decoration:none;
	border:none !important;
}

 
/* = COMPLETED custom
----------------------------*/
 
.wizard-custom .completed-step a {
    color:#fff;
    background: #888888;
}

.wizard-custom .completed-step span {
	color: #fff;
	text-shadow:none;
}

.wizard-custom .completed-step b {
    color:#fff;
    background: #888888;
	text-shadow:none !important;
}

.wizard-custom .completed-step span {
	color: #fff;
}
/* = ACTIVE custom
----------------------------*/
.wizard-custom .active-step a {
	color:#FFFFFF !important;
	background: #467C8C;
}


.wizard-custom .active-step b {
	color:#FFFFFF !important;
	background: #467C8C;
}

.wizard-custom .active-step span {
	color: #fff;
	text-shadow:none;
}
/* = HOVER STATES
----------------------------*/
.wizard-custom .completed-step:hover a, .wizard-custom .active-step:hover a {
    color:#fff;
    background: #244048;	
}
.wizard-custom .completed-step:hover span, .wizard-custom .active-step:hover span {
    color:#fff;
}
.wizard-custom b:hover {
background: #244048;
}

/* ===== Nav Pills ===== */

.nav-pills > li.active > a
 {
  color: #fff;
  background-color: #3D93AF;
}

.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
	color: #fff;
  background-color: #467C8C;
}

.nav-pills  li {
	 background-color: #D1E1E5;

}


