@charset "utf-8";
/* CSS Document */

/*Override classes for responsive tempalte*/
.page-content .container {max-width:1170px; width:auto;}
/*End override*/

/*Toast Overwrite*/
#toast-container > div.toast {
	font-family: 'Roboto', sans-serif;
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  filter: alpha(opacity=90);
}
#toast-container.toast-bottom-full-width > div.toast {
	max-width:1170px;
}
/*End Toast Overwrite*/

.stick {
	top:0;
	position: fixed !important;
	z-index: 80;
    
    -webkit-animation: bounce 1.2s ease-out;
	-moz-animation: bounce 800ms ease-out;
	-o-animation: bounce 800ms ease-out;
	animation: bounce 1.2s ease-out;
}
.stickToBottom {position:absolute !important; top:initial !important; bottom:0px;}

@keyframes bounce{
    0% {
        transform: translateY(-10%);
    }
    3% {
        transform: translateY(-10%);
    }
    50% {
        transform: translateY(0);
    }
}

#options.popupMenu {position:absolute; top:15px; right:15px; z-index:90; display:block !important; background-color:#fafafa; height:auto; padding:15px 10px 10px 10px;
    box-shadow: 0 6px 12px 0px #757575;
	-webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: 	all 0.2s;
    transition: all 0.2s;
}
.popupMenu a .MenuText {display:inline-block; line-height:44px; padding:0 15px;}

.popupMenu a {width:100%; display:inline-block; float:left; clear:both; margin-bottom:5px; margin-left:0px;}
.popupMenu a svg {margin-left:0px;}
.popupMenu a svg ,
.popupMenu a .MyOptions {float:left;}

#CloseMenu {display:none;}
.CloseMenu {display:block !important; position:fixed; height:100%; width:100%; opacity:0; top:0; left:0; z-index:80;}

[class^="icon-"], [class*=" icon-"] {
 height: 30px;
 width: 30px;
 display: inline-block;
 fill: currentColor;
 box-sizing:content-box !important;
}
/*Custom CSS Classes*/
.right {float:right;}
.left {float:left;}
.clear-Both {clear:both;}
.display-None {
	display:none !important;
}
.width100per {
	width:100%;
}
.noBreak {
	white-space:nowrap;
}
.margin-0-a {
	margin:0 auto;
}

.padding-0-0 {
	padding:0;
}
.padding-0-15 {
	padding:0 15px;
}
.padding-15 {
	padding:15px;
}
.padding-15-0 {
	padding:15px 0;
}
.padding-30-0 {
	padding:30px 0;
}
.positionAbsolute {
	position:absolute;
}
.top-0 {
	top:0;
}
.top-15 {
	top:15px;
}
.top-30 {
    top:30px;
}
.top-45 {
	top:45px;
}
.top-60 {
	top:60px;
}
.left-0 {
	left:0;
}
.left-15 {
	left:15px;
}
.left-45 {
	left:45px;
}
.right-0 {
	right:0;
}
.right-15 {
	right:15px;
}
.right-45 {
	right:45px;
}
.right-60 {
	right:60px;
}
.bottom-0 {
	bottom:0;
}
.bottom-15 {
	bottom:15px;
}
.bottom-45 {
	bottom:45px;
}
.zindex-middle {
	z-index:60;
}
.zindex-high {
	z-index:70;
}
.zindex-higher {
	z-index:80;
}
.zindex-highest {
	z-index:90;
}
.Icon-Link {position: relative; height: 40px; padding: 5px 0; line-height: 40px; cursor: pointer; display: inline-block;}
.Icon-Link svg {position: absolute; color: #424242; margin: 5px 0;}
.Icon-Link span , .Icon-Link a {font-size:1em; font-weight:bold; line-height:30px; padding-left:40px; text-transform: uppercase; text-decoration: underline !important; display: inline-block; margin:5px 0; white-space: nowrap;}

.Inactive-Button {
	color:#e0e0e0;
}
.Label-Title, .Label-Text, .Icon-Normal {
	color:#757575;
}
.Icon-Action-Standalone, .Info-Text {
	color:#424242;
}
.Icon-Action-Standalone {
	cursor:pointer;
}
.Icon-Selected {background-color:#f5f5f5; border:1px solid #e0e0e0; display:inline-block; margin-left:10px;}
a.Icon-Selected svg {margin-left:0px;}
.Action {
	color:#212121;
	cursor:pointer;
}
.Action-Link {
	color:#212121;
	font-weight:bold;
	text-transform:uppercase;
	text-decoration:underline !important;
	cursor:pointer;
}
.NonCapLink {
	color:#212121;
	font-weight:bold;
	text-decoration:underline !important;
	cursor:pointer;
}
.Popup-Link {
	color:#424242;
	text-decoration:none !important;
	cursor:pointer;
}
.BoxButton {
	background-color: #212121; 
	color: #fafafa; 
	text-align: center; 
	line-height: 45px; 
	height:45px; 
	padding:0  25px;
	display:inline-block; 
	text-transform: uppercase; 
}
.BoxButtonBottom {
	background-color: #212121; 
	color: #fafafa; 
	text-align: center; 
	line-height: 45px; 
	height:45px; 
	padding:0  25px;
	display:inline-block; 
	text-transform: uppercase; 
	width: 100%;
}
.HeaderLabel {
	font-size:1.2em;
	font-weight:500;
	color:#757575;
	
}
.TitleHeader {
	font-size:1.2em;
	font-weight:500;
	color:#757575;
	line-height:60px;
	display:inline-block;
	width:100%;
	position:relative;
}
.PageHeader {
	font-size:1.4em;
	font-weight:500;
	color:#757575;
	line-height:43px;
	display:inline-block;
	width:100%;
	padding-left:90px;  
}

.Border-Light-Left {
	border-left:1px solid #dcdcdc;
}

.Border-Light-Top {border-top:1px solid #dcdcdc;}

.Border-Light-Right {border-right:1px solid #dcdcdc;}

.Border-Light-Bottom {
	border-bottom:1px solid #dcdcdc;
}
.Border-Light-Sep {
	background-color:#dcdcdc;
	width:100%;
	height:1px;
}
.Shadow-Inner-White {
-webkit-box-shadow: inset 0px 0px 30px 25px rgba(250,250,250,1);
-moz-box-shadow: inset 0px 0px 30px 25px rgba(250,250,250,1);
box-shadow: inset 0px 0px 30px 25px rgba(250,250,250,1);
}
.Underline-Text {
	text-decoration:underline;
}
.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
.box-shadow {
	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)
}
.bottom-shadow {
	box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
    height:10px;
    clear:both;
}

.prefix {
	margin:11px 0 12px 0;
}

.Mobile {display:none;}

.WithLabel {position:relative;}
.WithLabel label {position:absolute; font-size:0.8em; top:0; left:0; white-space:nowrap;}
.WithLabel .InfoLineInformation {padding-top:25px;}
.InfoLineInformation {line-height: 40px; font-size: 1em; overflow:hidden;}

.InfoLine .input-field svg {position:absolute;}

.input-field label {position:absolute; font-size:0.8em; top:0px; left:0px;}
.input-field .InfoLineDropdown {margin-bottom:15px; padding-top:25px;}
.input-field .InfoLineDropdown select {height:40px; background-color:transparent; border:0px none transparent; font-size:1em; width:100%;-webkit-appearance: none;  -moz-appearance: none; position:relative; border-bottom: 1px solid #9e9e9e; z-index:2}
.input-field .InfoLineDropdown select::-ms-expand {display: none;}
.input-field .InfoLineDropdown .icon-dropdown {padding:0px; top:30px; right:0px; z-index:1;}

.LightBox {border:1px solid #dbdbdb; background-color:#f5f5f5; padding:10px 20px;}

[class^="InfoGridBox-"], [class*=" InfoGridBox-"] {display:table; width:100%; font-size:1em;}
[class^="InfoGridBox-"] .InfoGridCol , [class*=" InfoGridBox-"] .InfoGridCol {display:table-cell;} 
.InfoGridBox-2 .InfoGridCol {width:50%;}
.InfoGridBox-3 .InfoGridCol {width:33%;}
.InfoGridBox-4 .InfoGridCol {width:25%;}
.InfoGridBox-5 .InfoGridCol {width:20%;}
.InfoGridBox-6 .InfoGridCol {width:16.66%;}
.InfoGridBox-7 .InfoGridCol {width:14.28%;}
.InfoGridLine {width:100%; line-height:40px; display:table-row;}
.InfoGridHeader {font-size:1em; font-weight:500; color:#757575; line-height:30px; width:100%; margin-bottom:10px;}

.ModuleBody * {
	box-sizing:border-box;
}

.ModuleBody {
	width:100%;
	font-family: 'Roboto', sans-serif;
	background-color:#fafafa;
	font-weight:400;
	max-width:1200px;
	margin:0 auto;
	/*min-height:390px;*/
	position:relative;
	color:#424242;
    padding:0px;
    font-size: 16px;
}

.ModuleBody a {text-decoration:none;}

.ng-scope {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.ModuleNavigation {  
    font-family: 'Roboto', sans-serif;
	width:100%;
	height:50px;
	background-color:#212121;
	border-radius:0px;
	border-bottom: 1px solid #212121;
	margin:0px; 
}
.ModuleNavigation ul {padding:0px; margin:0px; list-style:none; height:50px;}
.ModuleNavigation ul li {display:inline-block; padding:0 20px;}
.ModuleNavigation ul li a {line-height:50px; color:#e0e0e0; font-size:18px; text-decoration:none; }
.ModuleNavigation ul li a:hover {line-height:50px; color:#fafafa; text-decoration:none; }
.ModuleNavigation ul li.active{line-height:50px; font-size:16px; background-color: #fafafa; text-decoration:none; border-top: 1px solid #000000; border-right: 1px solid #000000; border-left: 1px solid #000000;}
.ModuleNavigation ul li.active:first-child{line-height:50px; font-size:16px; background-color: #fafafa; text-decoration:none; border-top: 1px solid #fafafa; border-right: 1px solid #000000; border-left: 1px solid #fafafa;}
.ModuleNavigation ul li.active a{line-height:50px; color: #212121; text-decoration:none;}

.ModuleContent {
	padding:35px 15px;
	background-color:#fafafa;
}
.ProfileBar {
	padding:0 0 30px 0;
	background-color:#fafafa;
	display:inline-block;
	width:100%;
	position:relative;
}

.TopProfileBar .icon-back {
	margin:7px 10px 8px 10px;
}

.ProfileBox {height:45px;}
.ProfileBox .RosterPic {content:" "; width:45px; height:45px; border-radius:50%; background-size:cover; position:absolute; left:0; top:0px; background-position: 50% 50%;}
.ProfileBox .Profile {display:inline-block; line-height:45px; font-size:1em; height:45px; white-space:nowrap; overflow:hidden; padding:0 25px 0 70px; position:relative;}

.ProfileBox .Profile .FirstName {display:inline-block; float:left;}
.ProfileBox .Profile .LastName {display:none; padding-left:5px;}
.ProfileBox .Profile .MemberNum {display:inline-block;}
.Mobile.MyOptions {display:none; height:69px;}
.MyOptions {height:45px;}
.MyOptions a {    height: 40px;
    padding: 5px;
    display: inline-block;}
.MyOptions .MenuText {display:none;}

.TitleLine {position:relative; line-height:60px;}

/*FlipSwitch CSS*/
.onoffswitch {
    position: absolute; width: 40px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
	right:5px;
	top:25px;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block!important; 
    overflow: hidden; 
    cursor: pointer;
    height: 15px; 
    padding: 0; 
    line-height: 15px;
    border: 0px solid #999999; 
    border-radius: 21px;
    background-color: #E0E0E0;
}
.onoffswitch-label:before {
    content: "";
    display: block; 
    width: 21px; margin: -3px;
    background: #9E9E9E;
    position: absolute; top: 0; bottom: 0;
    right: 21px;
    border-radius: 21px;
    box-shadow: 0 6px 12px 0px #757575;
	-webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: 	all 0.2s;
    transition: all 0.2s;
	border:1px solid #757575;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: #9e9e9e;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
   border-color: #212121;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0px;
    background-color: #212121;
    box-shadow: 3px 6px 18px 0px rgba(0, 0, 0, 0.2);
}
/*End FlipSwitch*/

/* buddies page styling*/
.MyOptions .AddBuddiesButton {text-decoration:none; color: #ffffff; background-color:#333333; padding: 7px 20px; float: right;}
.MyOptions .AddBuddiesButton:hover {text-decoration:none; color: #ffffff; background-color:#333333; padding: 7px 20px; float: right;}
.AddtoBuddy .icon-close {height: 80px; color: #333333;}

/*Bootstrap Grid Backup*/
.row:before,
.row:after {
  content: " ";
  display: table;
}
.row:after {
  clear: both;
}
/*End Bootstrap Grid Backup*/

/*Overwrite of context menu which we need to replace*/
.context-menu-list {font-size: 14px !important; font-family: 'Roboto', sans-serif !important; min-width: 170px !important; padding: 0 10px !important; z-index: 100 !important;}
.context-menu-item {line-height: 50px !important;}