﻿/* BEGIN Regular */
@font-face {
	font-family: 'Open Sans';
	src: url("/include/fonts/OpenSans-Regular.eot?v=1.1.0");
	src: url("/include/fonts/OpenSans-Regular.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/include/fonts/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("/include/fonts/OpenSans-Regular.woff?v=1.1.0") format("woff"), url("/include/fonts/OpenSans-Regular.ttf?v=1.1.0") format("truetype"), url("/include/fonts/OpenSans-Regular.svg?v=1.1.0#Regular") format("svg");
	font-weight: normal;
	font-style: normal;
}
/* END Regular */
/* BEGIN Semibold */
@font-face {
	font-family: 'Open Sans';
	src: url("/include/fonts/OpenSans-Semibold.eot?v=1.1.0");
	src: url("/include/fonts/OpenSans-Semibold.eot?#iefix&v=1.1.0") format("embedded-opentype"), url("/include/fonts/OpenSans-Semibold.woff2?v=1.1.0") format("woff2"), url("/include/fonts/OpenSans-Semibold.woff?v=1.1.0") format("woff"), url("/include/fonts/OpenSans-Semibold.ttf?v=1.1.0") format("truetype"), url("/include/fonts/OpenSans-Semibold.svg?v=1.1.0#Semibold") format("svg");
	font-weight: 600;
	font-style: normal;
}
/* END Semibold */


html,
body {
	margin: 0;
	padding: 0;
}

body {
	font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html {
	position: relative;
	min-height: 100%;
}

body {
	line-height: 24px;
	letter-spacing: .1px;
	color: #545454;
	/* Margin bottom by footer height */
	margin-bottom: 65px;
}

.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	/* Set the fixed height of the footer here */
	height: 60px;
	/*background-color: #FFF;*/
	text-align: center;
	z-index: 0;
}

@media( max-height: 700px) {

	.body {
		margin-bottom: 0;
	}

	.footer {
		display: none;
	}

}

.navbar-bootsnap {
	background-color: #5da9dd;
	border-radius: 0;
	margin-bottom: 0;
	z-index: 1000;
	padding-bottom: 5px;
	transition: top 0.2s ease-in-out;
}

	.navbar-bootsnap.nav-up{
		top:-95px !important;
	}

.fancyShadow {
	box-shadow: 0 3px 2px 0 rgba(0,0,0,.18),0 3px 1px -2px rgba(0,0,0,.24),0 1px 5px 0 rgba(0,0,0,.16);
}

a {
	color: #277DB8;
	text-decoration: none;
}

.pagination a {
	background: #277DB8;
}

.navbar-bootsnap a {
	color: #FFF;
}

#sidebarContentHolder {
	padding-top: 15px;
}


.navbar-bootsnap .navbar-toggle .icon-bar {
	background-color: #ffffff;
}


.navbar-bootsnap .navbar-nav li.active,
html.no-touchevents .navbar-bootsnap .navbar-nav li > a:hover,
html.no-touchevents .navbar-bootsnap .navbar-nav li > a:focus,
#navbar-collapse .nav > li > a:hover, #navbar-collapse .nav > li > a:focus {
	color: #FFF;
	border-bottom: 4px solid #216C9E;
	background-color: #7fc0ea;
	height: 50px;
}


#navbar-collapse .nav > li > a:hover{
	border-bottom: 2px solid #216C9E;
}

#navbar-collapse .nav > li > a:focus{
	height:50px;
	border-bottom: 2px solid #216C9E;
}


html.no-touchevents .navbar-bootsnap .navbar-nav li > a:focus {
	border-bottom: 4px solid #216C9E;
	background-color: #7fc0ea;
	height: 50px;
}

html.no-touchevents .navbar-bootsnap .navbar-nav li > a:hover,
html.no-touchevents .navbar-bootsnap .navbar-nav li > a:focus {
	border-bottom: 2px solid #216C9E;
	background-color: #7fc0ea;
}

html.no-touchevents .navbar-bootsnap .navbar-nav .dropdown-menu li > a:hover,
html.no-touchevents .navbar-bootsnap .navbar-nav .dropdown-menu li > a:focus {
	background-color: transparent;
	height: auto;
	border-bottom: none;
	color:#337ab7;
}

.btn-default,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger {
	border-radius: 2px;
}


.btn-default {
	color: #000;
	background-color: rgba(158,158,158,.2);
	background-image: none;
}

.btn-lowered {
	box-shadow: none;
}


.btn-primary {
	border-color: #4F90BC;
	background: #5DA9DD;
	color: #fff;
}

html.no-touchevents .btn-primary:hover,
html.no-touchevents .btn-primary:focus {
	border-color: #76B6E2;
	background: #76B6E2;
}

html.no-touchevents .btn-primary:active,
.btn-primary.active {
	background: #76B6E2;
	border-color: #76B6E2;
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn-primary:disabled,
.btn-primary[disabled] {
	background: #CBE3F4;
	background-image: none;
}


.buttonBar .btn,
.buttonBarSortPosition .btn {
	box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
}

.navbar-collapse,
.navbar-form {
	border-color: #cccccc;
}

.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a:visited,
.navmenu-default .navmenu-nav > li > a,
.navmenu-default .navmenu-nav > li > a:visited,
.dropdown-menu > li > a,
.dropdown-menu > li > a:visited,
.navmenu-default .navmenu-nav > li > a,
.navbar-default .navbar-offcanvas .navmenu-nav > li > a {
	color: #337ab7;
}


.navbar-nav > li.active > a,
.navbar-nav > li.active li > a:visited,
.navmenu-nav .active > a,
.navmenu-nav .active > a:visited {
	color: #3ea1ec;
}

html.no-touchevents .navbar-bootsnap .navbar-nav > li > a:hover,
html.no-touchevents .navbar-bootsnap .navbar .navbar-nav > li > a:hover,
html.no-touchevents .navbar-bootsnap .navbar-nav .navbar .dropdown .dropdown-menu > li > a:hover {
	color: #216C9E;
}

.navbar-bootsnap .navbar-nav li.active > a {
	color: #555;
	font-weight: 600;
}

.navmenu-fixed-left,
.navmenu-fixed-right,
.navbar-offcanvas {
	width: 240px;
}

.layoutLogoImage {
	margin-top: -5px;
	border: 0;
	padding-right: 0px;
}

button.navbar-toggle {
	color: #5FB0E4;
}

hr {
	margin-top: 15px;
	margin-bottom: 10px;
}

.field-validation-error {
	display: none;
}

.main {
	padding-left: 15px;
	margin-bottom: 20px;
	transition: top 0.2s ease-in-out;
}

.main.nav-up{
	margin-top:20px;
}

.navMain.main {
	margin-top: 0;
	margin-bottom: 0px;
}

.navMenu {
	background-color: #F6F8F9;
	border: none;
	z-index: 100;
	transition: top 0.2s ease-in-out;
}

.navbar > .container .navbar-brand,
.navbar > .container-fluid .navbar-brand {
	margin-left: 0px;
}

.navbar-brand {
	padding-left: 0px;
	padding-top: 12px;
	padding-right: 0px;
}

.navbar-toggle {
	padding: 10px;
	margin-top: 10px;
}

.backgroundGray {
	background-color: #ECEFF1;
}

.backgroundWhite {
	background-color: White;
}

@media (max-width: 1220px) {

	.navMain {
		width: auto;
	}

	.navMain.main {
		padding-left: 5px;
	}

	.navbar-bootsnap {
		padding-left: 10px;
	}
}

/* This adjust the threshold at which we switch to the mobile style */
@media (max-width: 767px) {

	.navbar-header {
		float: none;
	}

	.navbar-bootsnap li.active,
	html.no-touchevents .navbar-bootsnap li > a:hover,
	html.no-touchevents .navbar-bootsnap li > a:focus,
	#navbar-collapse .nav > li > a:hover, #navbar-collapse .nav > li > a:focus {
		color: #FFF;
		border-bottom: 4px solid #216C9E;
		background-color: #7fc0ea;
		height:40px;
	}

	#navbar-collapse .nav > li > a:focus{

		border-bottom: 2px solid #216C9E;
	}

	.navbar-toggle {
		display: block;
		margin-bottom: 0px;
		margin-top: 5px;
		margin-right:0px;
		margin-left:10px;
	}

	.navbar-collapse {
		border-top: 1px solid transparent;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
	}

	.navbar-fixed-top {
		top: 0;
		border-width: 0 0 1px;
	}

	.navbar-collapse.collapse {
		display: none !important;
	}

	.navbar-nav {
		float: none !important;
		margin: 0px;
	}

	.navbar-nav > li {
		float: none;
		border-radius: 2px;
	}

	.navbar-nav > li > a {
		padding-top: 10px;
		padding-bottom: 10px;
		border-bottom: 2px solid transparent;
		height: 40px;
	}

	html.no-touchevents button.navbar-toggle:hover {
		border-color: #76B6E2;
		background-color: #76B6E2;
	}

	html.no-touchevents button.navbar-toggle:active {
		border-color: #5da9dd;
		box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
	}

	button.navbar-toggle {
		color: #fff;
	}

		button.navbar-toggle.glyphicon {
		color: #545454;
	}
	
	button.actionToggle {
		display:none;
	}

	.navbar-bootsnap li.active,
	html.no-touchevents .navbar-bootsnap li > a:hover,
	html.no-touchevents .navbar-bootsnap li > a:focus {
		height: 40px;
	}

	.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
		background-color: transparent;
	}


	.collapse.in {
		display: block !important;
	}

	.layoutLogoImage {
		margin-top: -5px;
		border: 0;
		height: 34px;
	}

	.footerMargin {
		margin-bottom: 0px;
		margin-top: 4px;
		font-size: 10px;
	}

	.input-group {
		margin-top: 0px;
		margin-bottom: 7px;
		width: 100%;
	}

	.main {
		padding-left: 15px;
		margin-top: 70px;
		margin-bottom: 20px;
	}

	.navMenu {
		top: 0px;
	}

	.navbar-fixed-top .navbar-collapse,
	.navbar-fixed-bottom .navbar-collapse {
		max-height: 100%;
	}



	.nav.navbar-nav .dropdown-menu li > a,
	.nav.navbar-nav .dropdown-menu li > span {
		color: #ffffff;
	}

}



.hiddenEllipsedOverflow {
	overflow: hidden;
	text-overflow: ellipsis;
}

.modal-title {
	overflow: hidden;
	text-overflow: ellipsis;
}


.placeholder {
	color: #999 !important;
}

::-webkit-input-placeholder {
	color: #999 !important;
}

:-moz-placeholder { /* Firefox 18- */
	color: #999 !important;
}

::-moz-placeholder { /* Firefox 19+ */
	color: #999 !important;
}

:-ms-input-placeholder {
	color: #999 !important;
}

div.tooltip-inner {
	max-width: 6000px;
	white-space: pre;
}

.bootstrap-select .btn-default {
	background: #FFFFFF;
}

.form-group {
	padding: 5px;
}

/* Give an item with floated children a size so it doesn't collapse*/
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
}

.error-color {
	color: #a94442;
}

.warning-color {
	color: #FFA500;
}

.textOverflowEllipsis-inline-block {
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 90%;
	display: inline-block;
	white-space: nowrap;
	padding-bottom: 3px;
}

.vertical-align-middle {
	vertical-align: middle;
}

.vertical-align-baseline {
	vertical-align: baseline;
}

.vertical-align-textBottom {
	vertical-align: text-bottom;
}

.vertical-align-textTop {
	vertical-align: text-top;
}

.vertical-align-super{
	vertical-align:super;
}

a.disabled {
	color: #545454;
	text-decoration: none;
	cursor: default;
}

.alert-danger{
	background:#f2dede;
	background-image:none;
}


.bottomPager{
	margin-top:10px;
}


@media(max-width:480px){

	.extraSmallScreenAction{
		display: block;
	}

	.extraSmallScreenAction-inlineBlock{
		display:inline-block;
	}

	.btn-group.extraSmallScreenAction{
		display:inline-block;
	}

	.smallScreenAction{
		display:none;
	}

	.subTabletScreenAction {
		display: block;
	}

	.dropdown-menu li,
	.dropDownListItem{
		height:34px;
	}

	.col-tn-12{
		width:100%;
		float: left;
	}

	.col-tn-7{
		width: 58.33333333%;
	}

	.col-tn-5{
		width: 41.66666667%;
	}

	.col-tn-4{
		width: 33.33333333%;
	}

	.hidden-tn{
		display:none !important;
	}

	.visible-tn{
		display: block !important;
	}

	.visible-xs-block {
		display: block !important;
	}

	button.actionToggle {
		margin-top: 6px;
		padding: 5px;
		display:block;
	}

	.layoutBody{
		padding-left:15px;
	}

	.main{
		margin-top:75px;
	}

	#playerPanel .panel-body{
		padding:0px;
	}

}



/* Fun iOS browser bug: https://github.com/twbs/bootstrap/issues/14839
	https://bugs.webkit.org/show_bug.cgi?id=153852 */
@media screen and (max-device-width:1024px){
	.modal-open {
		width: 100%;
		position: fixed;
	}
}

/* This lets us use the Impact font for meme text on devices that don't
	already have the Impact font, such as iOS devices. */
@font-face {
	font-family: 'Impact';
	src: local('Impact'),
		url('/include/fonts/impact.eot');
	src: local('Impact'),
		url('/include/fonts/impact.eot?#iefix') format('embedded-opentype'),
		url('/include/fonts/impact.woff') format('woff'),
		url('/include/fonts/impact.ttf') format('truetype'),
		url('/include/fonts/impact.svg#impact') format('svg');
	font-weight: normal;
	font-style: normal;
}

button.navbar-toggle-color,
button.navbar-toggle-color:focus,
button.navbar-toggle-color:active{
	background-color: #286090;
	border-color: #204d74;
}

button.navbar-toggle-color.collapsed{
	border-color: #8bc1e6;
	background-color: #76B6E2;
}

button.navbar-toggle-color.collapsed:hover{
	border-color: #8bc1e6;
	background-color: #8bc1e6;
}

.closeSmallSidebarButton{
	font-size:20px;
	padding-right:10px;
	margin-top: -3px;
	cursor:pointer;
}

/*Font awesome icons are not centered, so when we animate them, they wiggle in FF*/
/* adjusting the origin of the rotation in FF only */
@-moz-document url-prefix() {
	.notificationSpinner {
		transform-origin: 49.5% 57% 0px;
	}
}
