:root
{
    /* see util -> setClubSessionVars where these are also set as default colors */
    --primaryColor:#2e75b6;
    --lightColor:#dae3ef;
    --lighterColor:#f2f3f7;
    --bodyBGColor:#fafafa;
    --bodyTextColor:#2e75b6;
    --buttonTextColor:#fafafa;
    --altTextColor:#2e75b6;
    --roundBtn:37px;
}
#divTeamLists {width: 1200px; float: left; }
#divTeamLeft {width: 310px; float: left; display: inline-block; white-space: normal;}
#divTeamMiddle {width: 220px; float: left; display: inline-block; white-space: normal;}
#divTeamRight {width: 310px; float: left; display: inline-block; white-space: normal;}
#divMessage {clear:left; display: block; white-space: normal;}
#divBulkEditLeft {width: 265px; float: left; display: inline-block; white-space: normal;}
#divBulkEditRight {width: 650px; float: left; display: inline-block; white-space: normal;}
#divLogo {height: 100px; width: 282px; padding-left: 62px; float: left; display: table-cell; white-space: normal; vertical-align: middle;}
#divAdBanner {height: 100px;width: 800px; float: left; display: inline-block; white-space: normal; margin-bottom: 5px;}
#navbar { clear: left; }
#tree {width: 400px; height:1200px; float: left; overflow:scroll; margin-right:20px}
#divCenter {margin-left:20px}
html 
{
    margin-bottom:100px;
    font-size:14px !important;
}

/* CLASS identifier   .                     */
/* ID identifier      #                     */
/* MAIN BLUE BUTTON/THEME COLOR #2e75b6;    */
/*                                          */
body 
{
	font-family: 'Segoe UI', Tahoma, Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0;
	color: var(--bodyTextColor);
    background-color:var(--bodyBGColor);
}
select
{ 
    color:#555555;
}
input
{ 
    color:#555555;
}
label
{
    /* bootstrap font weight of 700 is too bold   */
    font-weight: 600;
    /* bootstrap bottom margin of 5px is too much */
    margin-bottom: 4px;
}
button {
  font-size: 14px;
}
/*
this blurs the main body 
https://sweetalert2.github.io/
body.swal2-shown > [aria-hidden="true"] 
{
    transition: .3s filter;
    filter: blur(1px);
}*/
.swal2-html-container
{
    text-align: left !important;
    font-size: 12px !important;
}
.swal2-popup {
    font-size: 12px !important;
}
.popover-content {
  color:var(--primaryColor);
}
.rtl {
    direction: rtl;
    text-align: right;
}
/* boat image table overlay classes */
.swBoatTable
{
    margin-top:16px;
    width:220px;
}
.swSeatTD
{
    vertical-align:bottom;
    width:115px;
}
.swMiddleTD
{
    width:40px;
}
.swBoatOarsTDCol1
{
    vertical-align:bottom;
    width:72px
}
.scBoatTDCol1
{
    vertical-align:bottom;
    width:47px
}
.scBoatOarsTD
{
    font-weight:bold;
    vertical-align:bottom;
    text-align:center;
    width:120px;
    text-wrap:wrap;
}
.scRower
{
    border-radius:6px;
    text-align:center;
    color:black;
    background-color:white;
    font-weight:bold;
    font-size:12px;
    border-style: solid;
    border-color:#7a7373;
    border-width:1px;
}
.swBoatOarsTD
{
    font-weight:bold;
    vertical-align:bottom;
    text-align:center;
    width:120px;
    text-wrap:wrap;
}
.swCox
{
    border-radius:6px;
    text-align:center;
    color:white;
    background-color:#767474;
    font-weight:bold;
    font-size:12px;
}
.scCox
{
    border-radius:6px;
    text-align:center;
    color:white;
    background-color:#767474;
    font-weight:bold;
    font-size:12px;
}
.swStarboardRower
{
    border-radius:6px;
    text-align:center;
    background-color:white;
    color:black;
    font-weight:bold;
    font-size:12px;
    border-style: solid;
    border-color:#7a7373 #7a7373 #7a7373 green;
    border-width:1px 1px 1px 9px;
}
.swPortRower
{
    border-radius:6px;
    text-align:center;
    background-color:white;
    color:black;
    font-weight:bold;
    font-size:12px;
    border-style: solid;
    border-color:#7a7373 red #7a7373 #7a7373;
    border-width:1px 9px 1px 1px;
}
.editable-container {
    display:flex;
    align-items:center;
    max-width:100%;   
}
.editable {
    border-width:thin;
    border-style:solid;
    border-color:var(--primaryColor);
    border-radius:4px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    padding:10px;
    width:100%;
    height:70px;
    overflow-y:auto;
    box-sizing:border-box; /* Ensure padding and border are included in the width */
}
.sunTimesDawnDusk {
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    text-align:center;
    width:80px;
}
.sunTimesSunriseSunset {
    background-color:var(--bodyBGColor);
    color:var(--bodyTextColor);
    text-align:center;
    width:80px;
}
table.psschedtbl tr 
{ /* Target all rows within the table */
  height:22px; /* Set the desired height */
}
.psschedtbldiv
{
    margin-bottom:12px;
    border-radius:8px;
    padding:10px;
    color:var(--bodyTextColor);
    background-color:var(--lightColor)
}
.pspmttbldiv
{
    margin-bottom:12px;
    border-radius:8px;
    padding:10px;
    color:var(--bodyTextColor);
    background-color:var(--bodyBGColor)
}
.psaccount 
{ 
    border-style:solid; 
    border-width:1px; 
    padding:6px;
    margin-right:6px;
    margin-bottom:4px;
    border-radius:8px;
    width:350px;
    cursor:pointer;
}
.psaccountmobile
{ 
    border-style:solid; 
    border-width:1px; 
    padding:6px;
    margin-right:6px;
    margin-bottom:4px;
    border-radius:8px;
    cursor:pointer;
}
.dbgRowerbtn 
{
    width: 152px;
    height: 24px;
    border:1px;
    color:red;
    border-radius: 6px;
    font-weight:normal;
    border-color:#7a7373;
    border-style: solid;
    background-color: #ffffff; 
    text-align:center;
    display: inline-block;
    vertical-align: top;
    padding-left: 4px;
    padding-right: 4px;
    cursor:pointer; 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.blink 
{
    animation: blink 2.5s infinite;
}
/* Fade effect */
@keyframes blink 
{
    0% { opacity: 1; }
    100% { opacity: 0; color: darkgray; }
}
.blinkIcon 
{
    /* can be added to any font awesome icon to cause the icon to blink */
    animation: blinker 1.2s cubic-bezier(.5, 0, 1, 1) infinite alternate; 
}
@keyframes blinker 
{ 
    from { opacity: 1; } to { opacity: .05; } 
}
@media (min-width:601px) {   /* LARGE SCREEN DEVICE */
    .page-header
    {
        padding-left:20px;
        padding-right:4px;
        margin-top:6px;
        margin-bottom:16px;
        padding-bottom:8px;
        border-bottom: 1px solid var(--lightColor);
    }
    .page-header-nohr
    {
        padding-left:20px;
        padding-right:16px;
        margin-top:6px;
    }
    .otwlCardResBase 
    {
        margin-top:12px;
        margin-right:15px;
        padding-right:15px;
        display:inline-block;
        padding-left:8px;
        padding-top:15px;
        padding-bottom:15px;
        border-radius:9px;
        vertical-align:top;
    }
    .portalItem:active
    {
        transform: scale(0.99);
    }
    .memberPortalItem:active
    {
        transform: scale(0.99);
    }
    .portalTypeRow:active
    {
        transform: scale(0.99);
    }
    .portalTypeRowClickable:active
    {
        transform: scale(0.99);
    }
	.profileSection:active
	{
		transform: scale(0.99);
	}
	.portalItemStandout:active
	{
		transform: scale(0.99);
	}
	.functionbtn:active
	{
		transform: scale(0.95);
	}
    .functionbtnbright:active
	{
		transform: scale(0.95);
	}
    .functionbtnyellow:active
	{
		transform: scale(0.95);
	}
	.tmdTile:active
	{
		transform: scale(0.94);
	}
    .tmdTile:hover
	{
		box-shadow:  0px 0px 0px, -1px -1px 2px var(--primaryColor);
		cursor:pointer;
	}
	.dbTile:active
	{
		transform: scale(0.90);
	}
    .dbTile:hover
	{
		box-shadow:0px 0px 0px, -1px -1px 2px var(--lightColor);
		cursor:pointer;
	}
	.smTile:active
	{
		cursor: pointer;
		transform: scale(0.90);
	}
    .sxsTile
    {
        color:var(--altTextColor);
        background-color:var(--lighterColor);
        box-shadow:2px 2px 3px var(--lightColor);
        height:80px;
        margin-right:14px;
        margin-bottom:14px;
        display:inline-block;
        vertical-align:middle;
        transition: transform 0.2s ease-in-out;
        cursor:pointer;
    }
    .sxsIcon
    {
        height:80px;
        width:80px;
        display:inline-block;
        font-size:44px;
        text-align:center;
        vertical-align:middle;
        padding-top:9px;
        background-color:var(--lightColor);
        color:var(--bodyTextColor);
    }
    .sxsText
    {
        width:80px;
        display:inline-block;
        text-align:center;
        vertical-align:middle;
        font-size:11px;
        padding:4px;
        background-color:var(--lighterColor);
    }
    .sxsTile:active
	{
		transform: scale(0.96);
	}
    .sxsTile:hover
	{
        box-shadow: 0px 0px 0px, -1px -1px 2px var(--lightColor);
        cursor:pointer;
	}
	.ohpTile:active
	{
		transform: scale(0.96);
	}
    .ohpTile:hover
	{
        box-shadow: 0px 0px 0px, -1px -1px 2px var(--lightColor);
        cursor:pointer;
	}
    .ohpTileWide:active
	{
		transform: scale(0.96);
	}
    .ohpTileWide:hover
	{
        box-shadow: 0px 0px 0px, -1px -1px 2px var(--lightColor);
        cursor:pointer;
	}
	.otwlTile:active
	{
		box-shadow: 0px 0px 0px, -1px -1px 2px var(--lightColor);
		cursor:pointer;
	}
    .otwlTile:hover
	{
		cursor:pointer;
	}
	.mastheadbtn:active
	{
		transform: scale(0.94);
	}
	.mastheadbtn:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
	}
    .mastheadbtnfocus:hover
	{
		background-color:var(--primaryColor) !important;
		color:var(--buttonTextColor) !important;
		border-color:var(--primaryColor) !important;
	}
	.mastheadbtnicon:active
	{
		transform: scale(0.85);
	}
	.mastheadbtnicon:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
	}
	.mastheadbtnbkmk:active
	{
		transform: scale(0.90);
	}
	.mastheadbtnbkmk:hover
	{
		background-color:var(--lightColor) !important;
		color:var(--primaryColor) !important;
	}
	.mastheadbtnsm:active
	{
		transform: scale(0.90);
	}
	.mastheadbtnsm:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
	}
}
@media (max-width:600px) {  /*SMALL SCREEN DEVICE*/
    .page-header
    {
        padding-left:16px;
        padding-right:6px;
        margin-top:6px;
        margin-bottom:16px;
        padding-bottom:8px;
        border-bottom: 1px solid var(--lightColor);
    }
    .page-header-nohr
    {
        padding-left:16px;
        padding-right:16px;
        margin-top:6px;
    }
    .otwlCardResBase 
    {
        margin-top:12px;
        padding-left:8px;
        padding-top:15px;
        padding-bottom:15px;
        border-radius:9px;
        vertical-align:top;
    }
    .portalItem:hover
    {
        transform: scale(0.97);
    }
    .memberPortalItem:hover
    {
        transform: scale(0.97);
    }
    .portalTypeRow:hover
    {
        transform: scale(0.97);
    }
    .portalTypeRowClickable:hover
    {
        transform: scale(0.97);
    }
	.profileSection:hover
	{
		transform: scale(0.99);
	}
	.portalItemStandout:hover
	{
		transform: scale(0.99);
	}
	.functionbtn:hover
	{
		transform: scale(0.95);
	}
    .functionbtnbright:hover
	{
		transform: scale(0.95);
	}
    .functionbtnyellow:hover
	{
		transform: scale(0.95);
	}
	.tmdTile:hover
	{
		box-shadow:  0px 0px 0px, -1px -1px 2px var(--primaryColor);
		cursor:pointer;
        transform: scale(0.95);
	}
	.dbTile:hover
	{
		box-shadow:0px 0px 0px, -1px -1px 2px var(--lightColor);
		cursor:pointer;
		transform: scale(0.95);
	}
	.smTile:hover
	{
		box-shadow:0px 0px 0px, -1px -1px 2px var(--primaryColor);
		cursor:pointer;
		transform: scale(0.95);
	}
    .sxsTile
    {
        color:var(--altTextColor);
        background-color:var(--lighterColor);
        box-shadow:2px 2px 3px var(--lightColor);
        height:80px;
        margin-right:14px;
        margin-bottom:14px;
        display:inline-block;
        vertical-align:middle;
        transition: transform 0.2s ease-in-out;
        cursor:pointer;
    }
    .sxsIcon
    {
        height:80px;
        width:80px;
        display:inline-block;
        font-size:38px;
        text-align:center;
        vertical-align:middle;
        padding-top:12px;
        background-color:var(--lightColor);
        color:var(--bodyTextColor);
    }
    .sxsText
    {
        width:80px;
        display:inline-block;
        text-align:center;
        vertical-align:middle;
        font-size:13px;
        padding:4px;
        background-color:var(--lighterColor);
    }
	.sxsTile:hover
	{
		box-shadow:0px 0px 0px, -1px -1px 2px var(--lightColor);
		cursor:pointer;
		transform: scale(0.94);
	}
	.ohpTile:hover
	{
		box-shadow:0px 0px 0px, -1px -1px 2px var(--lightColor);
		cursor:pointer;
		transform: scale(0.94);
	}
	.otwlTile:hover
	{
		cursor:pointer;
		transform: scale(0.96);
	}
	.mastheadbtn:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
		transform: scale(0.95);
	}
	.mastheadbtnicon:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
		transform: scale(0.95);
	}
	.mastheadbtnbkmk:hover
	{
		background-color:var(--lightColor) !important;
		color:var(--primaryColor) !important;
		transform: scale(0.95);
	}
	.mastheadbtnsm:hover
	{
		background-color:var(--lighterColor) !important;
		color:var(--altTextColor) !important;
		border-color:var(--lightColor) !important;
		transform: scale(0.95);
	}
}
/*
img
{
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
}*/
.clubLogo
{
    cursor:pointer; 
    margin-bottom:10px;
    margin-right:10px;
    height:45px;
}
.testoptions
{
    border-radius:6px;
    padding-top:7px;
    padding-left:7px;
    padding-bottom:5px;
    margin-bottom:10px;
    background-color:var(--bodyBGColor);
}
.hdgDDMenuItem 
{
    margin-left:-1px !important;
    display:inline-block !important;
    text-decoration:underline !important;
    cursor:pointer !important;
    color:var(--bodyTextColor) !important;
}
.hdgDDMenuItem:hover
{
    color:var(--buttonTextColor) !important;
    background-color:var(--primaryColor) !important;
}
.hdgDDMenuBtn
{
    margin-left:8px;
    margin-top:4px;
    margin-bottom:4px;
    margin-right:4px;
    width:43px !important;
    height:43px !important;
    border-radius:50% !important;
}
.hdgDDMenuBtn:hover
{
    color:var(--primaryColor) !important;
    background-color:var(--buttonTextColor) !important;
}
.bmac
{
    background-color:#FFE1D6 !important;
    color:black !important;
}
.donateTile
{
    background-color:var(--lightColor) !important;
}
.resetCode
{
    margin-right:16px;text-align:center;font-size:18px;height:40px;width:40px;border-radius:6px;border-color:gainsboro;border-width:1px;
}
.scrollListDiv
{
    border-style:solid;
    border-width:1px;
    border-radius:6px;
    border-color:var(--lightColor);
    height:200px;
    width:225px;
    overflow-x:hidden;
    padding-left:3px;
    overflow-y:auto
}
.modal-dialog 
{
  position: absolute;
  top: 50px;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow:auto;
  width:100%;
  height:100%;
}
.modal-content 
{
     margin:15% auto;
     padding:10px;
     width:85%;
     background-color:var(--bodyBGColor);
     color:var(--bodyTextColor);
}
.badge-notification .fa-stack[data-count]:after 
{
  position: absolute;
  right: 0%;
  top: 1%;
  content: attr(data-count);
  font-size: 40%;
  padding: .6em;
  border-radius: 999px;
  line-height: .75em;
  color: white;
  background: rgba(255, 0, 0, 0.85);
  text-align: center;
  min-width: 2em;
  font-weight: bold;
}
#divOpenCloseSB
{
    cursor:pointer;
    margin-left:-2px;
    margin-top:-20px;
    margin-bottom:-5px;
}
.kioskBackArrow
{
    display:inline-block;
    margin-left:-5px;
    margin-top:-10px;
    margin-bottom:-6px;
    cursor:pointer;
    font-size:64px
}
.taskgroupparent
{
    display:inline-block;
    height:35px;
    margin-bottom:2px;
    background-color:var(--primaryColor);
}
.taskgroupbtn
{
    margin-bottom:4px;
    border-style:none;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    cursor:pointer; 
    height:35px;
    padding-left:10px;
    padding-right:10px;
}
.taskgroupselbtn
{
    vertical-align:bottom;
    margin-bottom:4px;
    margin-left:4px;
    margin-right:4px;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    border-style:none;
    background-color:var(--bodyBGColor);
    color:var(--bodyTextColor);
    cursor:pointer; 
    height:31px;
    padding-left:10px;
    padding-right:10px;
}
.coxcreditbtn 
{
    display:inline-block;
    width:160px;
    height:37px;
    border:0px;
    color:var(--altTextColor);
    border-radius:20px;
    font-weight:normal;
    border-color:var(--primaryColor);
    border-style: solid;
    background-color:var(--lighterColor);
    text-align:center;
    vertical-align:top;
    cursor:pointer; 
    margin-top:8px;
    margin-right:8px;
    padding-top:6px;
}
.emtext
{
    font-style:italic;
}
.weatherFrame
{
    margin-top:4px;
    background-color:var(--lightColor);
    border-radius:8px;
}
.weatherTemp
{
    margin-top:12px;
    width:240px;
    background-color:var(--lightColor);
    border-radius:8px;
    padding:10px;
    padding-top:12px;
}
.emailaddrsframe
{
    background-color:var(--lightColor);
    border-radius:8px;
    margin-top:12px;
    margin-bottom:20px;
    padding-left:20px;
    padding-top:12px;
    padding-bottom:20px;
    padding-right:20px;
}
.disbutton
{
    border-radius:20px;
    border:1px;
    border-color:lightgray;
    border-style: solid;
    height:37px;
    background-color:gainsboro;
    color:darkgray;
}
.viewSelectionDiv
{
    vertical-align:top;
    display:inline-block;
    padding-left:10px;
    margin-left:20px;
    margin-bottom:5px;
    margin-top:3px;
    border:1px solid gainsboro;
    width:190px;
    max-height:200px;
    overflow-y:auto;
    line-height:.10
}
.clubHomePageDiv
{
    margin-bottom:12px;
    margin-top:16px;
    padding:12px;
    border-radius:6px;
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
}
.portalListSelected
{
    border-top: 2px solid var(--primaryColor);
    border-left: 2px solid var(--primaryColor);
    border-bottom: 2px solid var(--primaryColor);
}
.portalListItemDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:2px;
    margin-bottom:8px;
    flex-grow:1;
    height:40px;
    border-top-left-radius:6px;
    border-bottom-left-radius:6px;
}
.arrowDivSelected
{
    border-top: 2px solid var(--primaryColor);
    border-right: 2px solid var(--primaryColor);
    border-bottom: 2px solid var(--primaryColor);
}
.arrowDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:2px;
    padding-right:6px;
    margin-bottom:8px;
    display:inline-block;
    height:40px;
    border-top-right-radius:6px;
    border-bottom-right-radius:6px;
}
.portalRowOuterDiv
{
    display:flex;
    width:100%;
}
.portalTallListItemDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:8px;
    margin-bottom:8px;
    flex-grow:1;
    border-top-left-radius:6px;
    border-bottom-left-radius:6px;
    transition: transform 0.2s ease-in-out;
}
.arrowTallDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:8px;
    padding-right:6px;
    margin-bottom:8px;
    display:inline-block;
    border-top-right-radius:6px;
    border-bottom-right-radius:6px;
}
.portalVeryTallListItemDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:6px;
    margin-bottom:8px;
    flex-grow:1;
    border-top-left-radius:6px;
    border-bottom-left-radius:6px;
    transition: transform 0.2s ease-in-out;
}
.arrowVeryTallDiv
{
    cursor:pointer;
    padding-left:10px;
    padding-top:1px;
    padding-bottom:6px;
    padding-right:6px;
    margin-bottom:8px;
    display:inline-block;
    border-top-right-radius:6px;
    border-bottom-right-radius:6px;
}
.h2div
{
    cursor:pointer;
    padding-left:8px;
    padding-top:1px;
    padding-bottom:2px;
    margin-bottom:2px;
    display:inline-block;
    vertical-align:middle;
}
.h2iconsdiv
{
    cursor:pointer;
    padding-left:4px;
    padding-top:1px;
    padding-bottom:2px;
    margin-bottom:2px;
    margin-left:20px;
    display:inline-block;
}
.h2icondiv
{
    text-align:center;
    width:50px;
    display:inline-block;
    font-size:12px;
}
.profileSection
{
    cursor:pointer;
    padding-left:8px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:6px;
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    transition: transform 0.2s ease-in-out;
}
.profileSectionHidden
{
    cursor:pointer;
    padding-left:8px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:6px;
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    transition: transform 0.2s ease-in-out;
    display:none;
}
.portalItemStandout
{
    cursor:pointer;
    padding-left:8px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    transition: transform 0.2s ease-in-out;
}
.portalItemStandout h4
{
    margin-top:0px;
}
.importantInfo
{
    padding-left:8px;
    padding-top:10px;
    padding-bottom:10px;
    margin-bottom:6px;
    border-radius:4px;
    color:black;
    background-color:cyan;
}
.portalItem
{
    cursor:pointer;
    padding-left:8px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
    transition: transform 0.2s ease-in-out;
}
.portalItem h4
{
    margin-top:0px;
}
.memberPortalItem
{
    cursor:pointer;
    padding-left:8px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    transition: transform 0.2s ease-in-out;
}
.memberPortalItem h4
{
    margin-top:0px;
}
.portalTypeRow
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    transition: transform 0.2s ease-in-out;
}
.portalTypeRow a
{
    color:var(--altTextColor);
}
.portalTypeRowStatic
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    transition: transform 0.2s ease-in-out;
}
.portalTypeRowStatic a
{
    color:var(--altTextColor);
}
.portalTypeRowClickable
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    cursor:pointer;
    transition: transform 0.2s ease-in-out;
}
.portalTypeRowClickable a
{
    color:var(--altTextColor);
}
.portalTypeRowClickableSelected
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:10px;
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    cursor:pointer;
    border: 2px solid var(--primaryColor);
}
.portalTypeRowBarBodyColorBG
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:12px;
    margin-top:20px;
    border-radius:6px;
    background-color:var(--bodyBGColor);
    color:var(--bodyTextColor);
    font-size:16px;
}
.portalTypeRowBarLightColorBG
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:12px;
    margin-top:20px;
    border-radius:6px;
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
    font-size:16px;
}
.portalTypeRowBar
{
    padding-left:12px;
    padding-right:12px;
    padding-top:8px;
    padding-bottom:8px;
    margin-bottom:8px;
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    font-size:16px;
}
.portalTypeRowBar a
{
    color:var(--buttonTextColor);
}
.regfld 
{
    margin-top:8px;
}
.memberProfile
{
    height:600px;
    overflow-y:auto;
    display:block;
    margin-bottom:16px;
    background-color:var(--bodyBGColor);
    padding-top:10px;
    padding-right:12px;
    padding-bottom:15px;
    padding-left:15px;
    border-radius:8px;
    border-color:var(--primaryColor);
    border-style: solid;
    border-width:1px;
}
.storeitem
{
    background-color:var(--lighterColor);
    color: var(--altTextColor);
    border-color:var(--lightColor);
    border-radius:8px;
    border-style: solid;
    border-width:1px;
    padding:12px;
    margin-bottom:12px;
}
.storeitem a
{
    color:var(--altTextColor);
}
.divShaded
{
    background-color:var(--lighterColor);
    color: var(--altTextColor);
    border-color:var(--lightColor);
    border-radius:8px;
    border-style: solid;
    border-width:1px;
    padding:12px;
    margin-bottom:12px;
    margin-top:12px;
    display:inline-block;
}
.divShaded a
{
    color:var(--altTextColor);
}
.memberCard
{
    background-color:var(--lighterColor);
    color:var(--altTextColor);
}
.memberCard a
{
    background-color:var(--lighterColor);
    color:var(--altTextColor);
}
.imageshadow
{
    box-shadow:4px 4px 8px var(--primaryColor);
}
.recommendations
{
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor); 
    margin-top:10px;
    padding-top:8px; 
    padding-bottom:3px;
    padding-left:8px;
    padding-right:8px
}
.recommendations a
{
    text-decoration: underline;
}
.divPSPmtAcct
{
    border-radius:6px;
    border-color:var(--bodyTextColor);
    border-style: solid;
    border-width:1px;
    padding:12px;
    margin-bottom:8px;
}
.bright
{
    display:block;
    color:black;
    background-color:yellow;
    border-radius:6px;
    border-color:black;
    border-style:solid;
    border-width:1px;
    padding:8px;
    margin-bottom:8px;
    text-align:left;
}
.bright a
{
    color:black;
}
.iCrewMemberAlert
{
    display:inline-block;
    margin-right:10px;
    color:black;
    background-color:yellow;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:8px;
    margin-bottom:12px;
    margin-right:8px;
    text-align: left;
}
.iCrewMemberAlert a
{
    text-decoration: underline;
    color:black;
}
.iCrewMemberAlertBlack
{
    display:inline-block;
    margin-right:10px;
    color:white;
    background-color:black;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertBlack a
{
    text-decoration: underline;
}
.iCrewMemberAlertRed
{
    display:inline-block;
    margin-right:10px;
    color:white;
    background-color:red;
    border-radius:6px;
    border-color:white;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertRed a
{
    text-decoration: underline;
}
.iCrewMemberAlertOrange
{
    display:inline-block;
    margin-right:10px;
    color:black;
    background-color:orange;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertOrange a
{
    text-decoration: underline;
}
.iCrewMemberAlertYellow
{
    display:inline-block;
    margin-right:10px;
    color:black;
    background-color:#FFFF00;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertYellow a
{
    text-decoration: underline;
}
.iCrewMemberAlertBlue
{
    display:inline-block;
    margin-right:10px;
    color:black;
    background-color:lightskyblue;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertBlue a
{
    text-decoration: underline;
}
.iCrewMemberAlertGreen
{
    display:inline-block;
    margin-right:10px;
    color:black;
    background-color:#66FF33;
    border-radius:6px;
    border-color:black;
    border-style: solid;
    border-width:1px;
    padding:6px;
    margin-bottom:12px;
    margin-right:8px;
}
.iCrewMemberAlertGreen a
{
    text-decoration: underline;
}
.crewAlertTile
{
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    border-color:var(--lightColor);
    border-style: solid;
    border-width:1px;
    padding:12px;
    width:340px;
    margin-right:15px;
    margin-bottom:15px;
    word-wrap:normal;
    display:inline-block;
}
.crewAlertTile a
{
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    text-decoration: underline;
}
.crewAlertTileHdr
{
    border-radius:6px 6px 0px 0px;
    background-color:yellow;
    color:black;
    border-color:yellow;
    border-style: solid;
    border-width:1px;
    padding: 4px 4px 4px 12px;
    width:338px;
    height:30px;
    margin-top:-12px;
    margin-left:-12px;
    margin-right:-12px;
    margin-bottom:8px;  
    word-wrap:normal;
    font-weight:bold;
}
.portalListItemRTL
{
    padding-right:10px;
    padding-left:0px;
    border-top-left-radius:0px;
    border-bottom-left-radius:0px;
    border-top-right-radius:6px;
    border-bottom-right-radius:6px;
}
.portalListItemArrowRTL
{
    padding-right:10px;
    padding-left:0px;
    border-top-left-radius:6px;
    border-bottom-left-radius:6px;
    border-top-right-radius:0px;
    border-bottom-right-radius:0px;
}
.formTile
{
    border-radius:6px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    border-color:var(--lightColor);
    border-style: solid;
    border-width:1px;
    height:95px;
    width:320px;
    margin-right:15px;
    margin-bottom:20px;
    text-align:center;
    word-wrap:normal;
    float: left;
}
.shadedDivFrameFixedWidth
{
    clear:both;
    padding:10px;
    width:330px;
    margin-bottom:12px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    border-color:var(--primaryColor);
    border-radius:8px;
    border-style: solid;
    border-width: 0px;
}
.shadedDivFrameFixedWidth a
{
    color:var(--altTextColor);
    text-decoration:underline;
}
.shareWithRecruitersInfo
{
    clear:both;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:12px;
    width:290px;
    margin-bottom:12px;
    margin-top:2px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    border-color:var(--primaryColor);
    border-radius:8px;
    border-style: solid;
    border-width: 1px;
}
.shareWithRecruitersInfo a
{
    color:var(--altTextColor);
    text-decoration:underline;
}
.iformfield
{
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    border-color:var(--lightColor);
    border-style:solid;
    border-width:1px;
    border-radius:6px;
    padding:15px;
    margin-bottom:15px;
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color:var(--lightColor);
  color:var(--bodyTextColor);
}
.table-hover > tbody > tr:hover {
  background-color:var(--lightColor);
  color:var(--bodyTextColor);
}
.table-striped > tbody > tr:nth-of-type(odd) a {
  color:var(--bodyTextColor);
}
.table-hover > tbody > tr:hover a {
  color:var(--bodyTextColor);
}

.tt-hint {
	color: gray;
}
.tt-menu {
	background-color: lightgray;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	margin-top: 4px;
	padding: 2px 2px;
	width: 150px;
}
.tt-suggestion {
	font-size: 14px;  /* Set suggestion dropdown font size */
	padding: 2px 2px;
}
.tt-suggestion:hover {
	cursor: pointer;
	background-color: #0097CF;
	color: #FFFFFF;
}
.tt-suggestion p {
	margin: 0;
}
.selectLargeList {
  height:35px; 
  background-position: center right;
  background-repeat: no-repeat;
  border: 1.5px solid #cccccc;
  border-radius:3px;
  color:#555555;
  font-size: inherit;
  margin: 0;
  overflow: hidden;
  padding-top: 2px;
  padding-left:4px;
  padding-bottom: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
  display:block;
}
a
{
    color:var(--bodyTextColor);
}
td a
{
    color:var(--bodyTextColor);
}
a:hover 
{
    cursor:pointer;
}
a:visited 
{
    background-color: transparent;
}
.navSidebar
{
    left:0;
    overflow-x:hidden;
    transition:.75s;
    width:0px;
    vertical-align:top;
    display:inline-block;
    margin-left:20px;
    border-radius:6px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    padding-top:15px;
    padding-left:0px;
    max-height:1075px;
}
.sidebarIconDivHilite
{
    font-size:9px;
    cursor:pointer;
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
}
.sidebarIconDiv
{
    font-size:9px;
    cursor:pointer;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
}
.sidebarIconDiv:hover
{
    cursor:pointer;
    background-color:var(--lightColor) !important;
    color:var(--bodyTextColor) !important;
}
.alinkIcon
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
}
.alinkIcon:hover
{
    cursor:pointer;
    background-color:var(--lightColor) !important;
    color:var(--bodyTextColor) !important;
}

/* no spinner buttons on number input */
/* Chrome, Safari, Edge, Opera        */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button 
{
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -appearance: textfield;
}
/* Another radio button option ... see function newRadio in util.php */
.newradio {
  display: block;
  position: relative;
  padding-left:26px;
  margin-bottom:2px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default radio button */
.newradio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
/* Create a custom radio button */
.newradiocheckmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 19px;
  width: 19px;
  background-color:var(--lightColor);
  border-color:var(--primaryColor);
  color:var(--altTextColor);
  border-radius: 50%;
}
/* On mouse-over, add a grey background color */
.newradio:hover input ~ .newradiocheckmark {
  background-color:gainsboro;
}
/* When the radio button is checked, add a blue background */
.newradio input:checked ~ .newradiocheckmark {
  background-color:var(--primaryColor);
  border-color:var(--buttonTextColor);
  border-style:solid;
  border-width:1px;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.newradiocheckmark:after {
  content: "
  position: absolute;
  display: none;
}
/* Show the indicator (dot/circle) when checked */
.newradio input:checked ~ .newradiocheckmark:after {
  display: block;
}
/* Style the indicator (dot/circle) */
.newradio .newradiocheckmark:after {
 	top: 6px;
	left: 6px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: white;
}

/* NEW CHECKBOX CLASS */
.newcbx {
  position: absolute;
  opacity: 0;
  z-index: -1;
  -webkit-appearance:none; 
  -moz-appearance:none;
}
.newcbx+span:before {
  font: 16pt FontAwesome;
  content: '\00f096';
  display: inline-block;
  width: 16pt;
  padding: 0 0 0 0;
  margin-right:3px;
  vertical-align:middle;
}
.newcbx:checked+span:before {
  content: '\00f046';
}
.newcbx:disabled+span {
  color: #999;
}
.newcbx:not(:disabled)+span:hover:before {
  text-shadow: 0 1px 2px #77F;
}
/*                                  */
#showNavbarArrow, #hideNavbarArrow
{
    cursor:pointer; 
    font-size:24px
}
#showNavbarArrow:hover, #hideNavbarArrow:hover
{
    background-color: white;
}
#divShowNavbar
{
    margin-top:-3px;
    margin-bottom:0px;
    padding-left:6px;
    width:26px;
    background-color: gainsboro;
    clear:left;
}
#divHideNavbar
{
    margin-top:-3px;
    margin-bottom:10px;
    padding-left:6px;
    width:26px;
    background-color: gainsboro;
    clear:left;
}
#divShowNavbar:hover, #divHideNavbar:hover
{
    background-color: white;
}
#logout
{
    text-decoration: none;
}
#logout:hover
{
    text-decoration: underline;
}
#vraRaceResults
{
	display: none;
	padding: 1em 0;
	margin: 1em 0;
	color: #555;
	cursor: default;
}
#alllineups{
    margin-bottom:15px;
    display:inline-block;
}
.msgBody
{
    border: 1px;
    border-radius: 8px;
    border-color:var(--primaryColor);
    border-style: solid;
    background-color:var(--lighterColor);
    color:var(--altTextColor);   
    padding-left:10px;
    padding-right:10px;
    padding-top:10px;
    padding-bottom:10px;
    margin-bottom: 20px;
    margin-top: 10px;
    text-wrap: normal;
}
.infodiv 
{
    margin-top:14px;
}
#vraRaceResults:hover
{
	color:var(--bodyTextColor);
	border-color:var(--bodyTextColor);
	border-style: dashed;
	box-shadow: inset 0 3px 4px #888;
}

.todayatimage
{
    margin-bottom: 10px; 
    margin-right: 10px; 
    height:100px;
}
.todayatimage:hover
{
    cursor: pointer;
    border: 3px solid var(--bodyBGColor);
}
.portSeat
{
    border-radius:6px;
    color:white;
    background-color:red;
}
.starboardSeat
{
    border-radius:6px;
    color:white;
    background-color:green;
}
.coxSeat
{
    border-radius:6px;
    color:white;
    background-color:#000099;
}
.scullSeat
{
    border-radius:6px;
    color:white;
    background-color:#3B3B3B;
}
.dragonBoatRowLabel
{
    border-radius:6px;
    color:white;
    background-color:#3B3B3B;
    width:36px;
    height:26px;
    margin-bottom:2px;
    margin-right:8px;
    text-align:center;
    padding-top:4px;
}
.regattamainbtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border: 1px;
    border-color:var(--primaryColor);
    border-style: solid;
    border-radius: 6px;
    height: 80px;
    width:180px;
    margin-bottom:10px;
    margin-right:10px;
}
.deletebtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-width:1px;
    border-style:solid;
    border-color:#7a7373;
    border: 1px;
    border-radius: 3px;
    height: 25px;
    width: 25px;
}
.deletebtn:hover
{
    background-color:var(--lighterColor);
    color:var(--altTextColor);
}
.recentlineupbtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-width:1px;
    border-style:solid;
    border-color:#7a7373;
    color: white;
    border: 1px;
    border-radius: 3px;
    height: 35px;
    width: 35px;
    margin-bottom:4px;
}
.recentlineupbtn:hover
{
    background-color:var(--lightColor);
    color:var(--primaryColor);
}
.paybtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-radius:20px;
    border-width:0px;
    height:37px;
    transition: transform 0.2s ease-in-out;
    font-family: Verdana;
    font-weight: bold;
    font-size:10px;
    width:100px;
    margin-top:8px;
}
.paybtn:hover
{
    background-color:var(--buttonTextColor);
    color:var(--primaryColor);
    border-width:1px;
    font-weight:bold;
}
.paypalBtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-radius:20px;
    border-width:0px;
    height:37px;
    transition: transform 0.2s ease-in-out;
    font-family: Verdana;
    font-weight: bold;
    font-size:10px;
    width:100px;
    margin-top:8px;
}
.paypalBtn:hover
{
    background-color:var(--buttonTextColor);
    color:var(--primaryColor);
    border-width:1px;
    font-weight:bold;
}
.paysimpleBtn
{
    background-color: #08c;
    color: #fff;
    font-family: Verdana;
    font-weight: bold;
    font-size:10px;
    border: 1px;
    border-color: #08c;
    border-style: solid;
    border-radius: 10px;
    margin-right:6px;
    width:110px;
    height: 35px;
    margin-top:8px;
}
.paysimpleBtn:hover
{
    background-color: #7dbad8;
    border-color: #7dbad8;
}
.imageRoundCorners
{
    border-radius:8px;
    margin-bottom:10px;
}
.circledNumber
{
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding-top: 7px;
    border: 1px solid var(--primaryColor);
    text-align: center;
    font: 11px Arial, sans-serif;
    display: inline-block;
    vertical-align: middle;
    margin-top: -10px;
    margin-right: 4px;
}
.circledNumberHilight
{
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding-top: 7px;
    border: 1px solid var(--primaryColor);
    background-color: var(--primaryColor);
    color: var(--buttonTextColor);
    text-align: center;
    font: 11px Arial, sans-serif;
    display: inline-block;
    vertical-align: middle;
    margin-top: -10px;
    margin-right: 4px;
}
.circledNumber2
{
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding-top: 7px;
    color:var(--buttonTextColor);
    border: 1px solid var(--buttonTextColor);
    text-align: center;
    font: 11px Arial, sans-serif;
    display: inline-block;
    vertical-align: middle;
    margin-top:0px;
    margin-right:4px;
}
.circledNumber3
{
    border-radius: 50%;
    width: 28px;
    height: 28px;
    padding-top: 7px;
    color:var(--primaryColor);
    border: 1px solid var(--primaryColor);
    text-align: center;
    font: 11px Arial, sans-serif;
    display: inline-block;
    vertical-align: middle;
    margin-top:-8px;
    margin-right:4px;
}
.roundbtnBig
{
    border:1px;
    border-color:var(--lightColor);
    border-style:solid;
    border-radius:50%;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    box-shadow:3px 3px 6px #dcdfe3;
    height:76px;
    width:76px;
    text-align: center;
    padding-top:20px;
    margin-top:3px;
}
.roundbtnBig:hover
{
    padding-left:8px;
    padding-top:21px;
    box-shadow:0px 0px 0px, -3px -3px 6px #dcdfe3;
    cursor:pointer;
}
.roundbtnMed
{
    border:1px;
    border-color:var(--lightColor);
    border-style:solid;
    border-radius:50%;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    box-shadow:2px 2px 4px #dcdfe3;
    height:56px;
    width:56px;
    text-align: center;
    padding-top:12px;
    margin-top:3px;
}
.roundbtnMed:hover
{
    padding-left:11px;
    padding-top:6px;
    box-shadow:0px 0px 0px, -2px -2px 4px #dcdfe3;
    cursor:pointer;
}
.roundbtn
{
    border:1px;
    border-color:var(--lightColor);
    border-style:solid;
    border-radius:50%;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    box-shadow:2px 2px 4px #dcdfe3;
    height:38px;
    width:38px;
    padding-left:8px;
    padding-top:2px;
    margin-top:3px;
}
.roundbtn:hover
{
    padding-left:9px;
    padding-top:3px;
    box-shadow:0px 0px 0px, -2px -2px 4px #dcdfe3;
    cursor:pointer;
}
.roundbtnPrimaryColors
{
    border:1px;
    border-color:var(--lightColor);
    border-style:solid;
    border-radius:50%;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    box-shadow:2px 2px 4px #dcdfe3;
    height:38px;
    width:38px;
    padding-left:8px;
    padding-top:2px;
    margin-top:3px;
}
.roundbtnPrimaryColors:hover
{
    cursor:pointer;
}
.roundbtnfa
/* when a font awesome icon is used */
{
    border:1px;
    border-color:var(--lightColor);
    border-style:solid;
    border-radius:50%;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    box-shadow:2px 2px 4px #dcdfe3;
    height:38px;
    width:38px;
    padding-left:8px;
    padding-top:7px;
    margin-top:3px;
}
.roundbtnfa:hover
{
    padding-left:9px;
    padding-top:8px;
    box-shadow:0px 0px 0px, -2px -2px 4px #dcdfe3;
    cursor:pointer;
}
.fadedbutton
{
    background-color:var(--bodyBGColor);
    color:var(--bodyTextColor);
    border: 1px;
    border-color:var(--bodyBGColor);
    border-style: solid;
    height: 30px;
}
.fadedbutton:hover
{
    background-color: var(--lighterColor);
    border-color:var(--primaryColor);
    color:var(--altTextColor);
}
.disabledbutton
{
    background-color: var(--lighterColor);
    border-color:var(--primaryColor);
    color:var(--altTextColor);
}
.functionbtnTrans
{
    background-color:var(--bodyBGColor);
    color:var(--bodyTextColor);
    border-style: none;
    height:37px;
}
.functionbtnTrans:focus
{
    outline: none;
}
.functionbtnTrans:active
{
    outline: none;
}
.functionbtnTrans2
{
    background-color:var(--bodyLightColor);
    color:var(--bodyTextColor);
    border-style: none;
    height: 30px;
}
.functionbtnTrans2:focus
{
    outline: none;
}
.functionbtnTrans2:active
{
    outline: none;
}
.menubtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-width:0px;
    height:37px;
    transition: transform 0.2s ease-in-out;
}
.functionbtn
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border-radius:20px;
    border-width:0px;
    height:37px;
    transition: transform 0.2s ease-in-out;
}
.functionbtn:hover
{
    background-color:var(--buttonTextColor);
    color:var(--primaryColor);
    border-width:1px;
    font-weight:bold;
}
.functionbtn:focus
{
    font-style:italic;
    font-weight:bold;
}
.functionbtnred
{
    background-color:#ec0a0a;
    color:white;
    border-radius: 20px;
    border:1px;
    border-style: solid;
    height: 37px;
}
.functionbtnred:hover
{
    background-color:#f2cece;
    border-color:#940505;
    color:#940505;
    font-weight:bold;
}
.functionbtnred:focus
{
    font-style:italic;
    font-weight:bold;
}
.functionbtnyellow
{
    background-color:yellow;
    color:black;
    border-radius:20px;
    border-width:1px;
    border-color:gray;
    height: 37px;
}
.functionbtnyellow:hover
{
    background-color:#F7F6A8;
    font-weight:bold;
}
.functionbtnyellow:focus
{
    font-style:italic;
    font-weight:bold;
}
.functionbtnbright
{
    background-color:var(--buttonTextColor);
    color:var(--primaryColor);
    border-radius:20px;
    border-width:1px;
    border-color:var(--primaryColor);
    height:37px;
    font-weight: bold;
    transition: transform 0.2s ease-in-out;
}
.functionbtnbright:hover
{
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    font-weight:bold;
}
.functionbtnyellow
{
    background-color:yellow;
    color:black;
    border-radius:20px;
    border-width:1px;
    border-color:black;
    height:37px;
    font-weight: bold;
    transition: transform 0.2s ease-in-out;
}
.functionbtnyellow:hover
{
    background-color:black;
    color:#FFFFFF;
    font-weight:bold;
}
.functionbtncancel
{
    background-color:var(--buttonTextColor);
    color:var(--primaryColor);
    border-width:0px;
    border-radius:20px;
    height: 37px;
}
.functionbtncancel:hover
{
    background-color:var(--lightColor);
    color:var(--buttonTextColor);
    font-weight:bold;
}
.pseudolink
{
    text-decoration: underline;
}
.pseudolink:hover
{
    cursor:pointer;
}
#divOHPInfo
{
    clear: left;
}
.divDiscListEntry {
    border-radius:14px;
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
    padding-top:12px;
    padding-bottom:12px;
    padding-left:16px;
    padding-right:16px;
    margin-bottom:10px;
}
.discPost {
    margin-top:10px;
    border-radius:6px; 
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    padding:8px;
}
.chatPost {
    margin-top:10px;
    margin-right:10px;
    padding:6px; 
    border-radius:6px; 
    border:solid; 
    border-width:1px; 
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    padding:8px;
}
.navbar-fixed-bottom a
{
    text-decoration:none;
}
.navbar-fixed-bottom a:hover
{
    text-decoration:underline;
}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus 
{
    border-radius: 5px;
    color:var(--buttonTextColor) !important;
    background-color:var(--primaryColor);
    height:44px;
}
.nav-pills > li > a:hover 
{
    border-radius: 5px;
    background-color: #fff;
    color: var(--primaryColor) !important;
}
.achpTabHeader
{
    padding-top:1px;
    border-radius:5px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    height:44px;
    width: 335px;
    text-align: center;
    margin-bottom:14px;
}
.tmdTile
{
    /* teams dashboard tiles */
    border: 1px;
    border-radius: 6px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    box-shadow: 2px 2px 4px var(--primaryColor);
    height: 85px;
    width: 85px;
    padding-top: 14px;
    font-size:12px;
    margin-right: 12px;
    margin-bottom: 12px;
    text-align: center;
    word-wrap: normal;
    float: left;
    transition: transform 0.2s ease-in-out;
}
.dbTile
{
    /* dashboard tile */
    border-radius: 9px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    box-shadow:2px 2px 4px var(--lightColor);
    height: 90px;
    width: 90px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding-right: 3px;
    padding-left: 3px;
    padding-top: 10px;
    text-align: center;
    word-wrap: normal;
    float: left;
    font-size:11px;
    transition: transform 0.2s ease-in-out;
}
.smTile
{
    /* trackerboat start/stop tracking buttons */
    border-radius:6px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    box-shadow:1px 1px 2px var(--primaryColor);
    height:80px;
    width:80px;
    margin-right:10px;
    margin-bottom:10px;
    padding-right:2px;
    padding-left:2px;
    padding-top:5px;
    text-align:center;
    word-wrap:normal;
    display:inline-block;
    font-size:11px;
}
.smTileIcon
{
    margin-top:16px;
    margin-bottom:12px;
    font-size:24px;
}
.sxsAppIcons
{
    height:80px;
    width:80px;
    display:inline-block;
    font-size:22px;
    text-align:center;
    vertical-align:middle;
    padding-top:9px;
    background-color:var(--lightColor);
}
.ohpTile
{
    /* club home page and functions panel tiles */
    border-radius:6px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    box-shadow:2px 2px 3px var(--lightColor);
    height:100px;
    width:100px;
    margin-right:10px;
    margin-bottom:10px;
    padding-right:2px;
    padding-left:2px;
    text-align:center;
    word-wrap:normal;
    display:inline-block;
    font-size:12px;
    transition: transform 0.2s ease-in-out;
}
.ohpTileWide
{
    /* club home page and functions panel tiles */
    border-radius:6px;
    color:var(--altTextColor);
    background-color:var(--lighterColor);
    box-shadow:2px 2px 3px var(--lightColor);
    height:100px;
    width:150px;
    margin-right:10px;
    margin-bottom:10px;
    padding-right:2px;
    padding-left:2px;
    text-align:center;
    word-wrap:normal;
    display:inline-block;
    font-size:12px;
    transition: transform 0.2s ease-in-out;
}
.ohpTileIcon
{
    margin-top:16px;
    margin-bottom:12px;
    font-size:24px;
}
.otwlTile
{
    /* OTW Log page tile */
    border-radius: 9px;
    color:var(--buttonTextColor);
    background-color:var(--primaryColor);
    box-shadow:2px 2px 4px var(--primaryColor);
    height: 90px;
    width: 170px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding-right: 2px;
    padding-left: 2px;
    padding-top: 12px;
    text-align: center;
    word-wrap: normal;
    display:inline-block;
    font-size:14px;
}
.rdcpTile
{
    /* regatta control panel tile */
    border: 2px;
    border-radius: 6px;
    border-color: #99c1e6;
    border-style: solid;
    background-color: #f2f9ff;
    height: 123px;
    width: 123px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding-right: 3px;
    padding-left: 3px;
    text-align: center;
    word-wrap: normal;
    float: left;
    font-size:12px;
}
.rdcpTile:hover
{
    background-color:white;  
    border: 3px solid #99c1e6;
    cursor:pointer;
}
#shWeatherInfo
{
    cursor:pointer; 
}
#shRegattas
{
    cursor:pointer; 
}
#shPractices
{
    cursor:pointer; 
}
#shMorePractices
{
    cursor:pointer; 
}
#shOtherTeams
{
    cursor:pointer; 
}
#shEntries
{
    cursor:pointer; 
}
.showhidetoggle
{
    cursor:pointer; 
}
.tmspopup {
    position: fixed;
    padding: 20px;
    border: solid;
    border-radius: 12px;
    border-width: 5px;
    background-color: var(--bodyBGColor);
    border-color:var(--primaryColor);
    width:680px;
    height:610px;
    left:5%;
    top:8%;
    margin:20px 0 0 20px;
    display:none;
}
.dorbpopup {
    position: fixed;
    padding: 10px;
    border: solid;
    border-radius: 8px;
    border-width: 2px;
    background-color: var(--bodyBGColor);
    border-color:var(--primaryColor);
    width:280px;
    padding-left:15px;
    display:none;
    z-index:10;
}
.mtmspopup {
    position: fixed;
    padding: 20px;
    border: solid;
    border-radius: 12px;
    border-width: 3px;
    background-color: var(--bodyBGColor);
    border-color:var(--primaryColor);
    width:300px;
    height:435px;
    left:5%;
    top:10%;
    margin:20px 0 0 20px;
    display:none;
}
#masthead 
{
    text-align: right;
    width: 1400px;
    height:121px;
}
.todayColorLegendTile {
    padding-top:2px;
    padding-left:2px;
    padding-right:2px;
    display:inline-block;
    margin-right:8px;
    height:20px;
    font-size:10px;
}
.todayCardSessionBase
{
    display: inline-block; 
    width: 260px; 
    height: 100px; 
    margin-right: 10px; 
    margin-top: 6px;
    margin-bottom: 6px;
    padding-left: 10px; 
    padding-right: 5px; 
    padding-top: 5px; 
}
.todayCardSessionBase a
{
    color:var(--bodyTextColor);
}
.todayCardSessionUpcoming
{
    border-radius: 9px;
    background-color:#0670c3;
    color:#fafafa;
}
.todayCardSessionUpcoming a
{
    color:#fafafa;
}
.todayCardSessionOTW 
{
    border-radius: 9px;
    background-color:#92f2d5;
}
.todayCardSessionDone
{
    border-radius:9px;
    background-color:darkgray;
    color:#fafafa;
}
.todayCardSessionDone a
{
    color:#fafafa;
}
.todayCardResBase 
{
    display: inline-block;
    width: 355px;  
    margin-right: 10px; 
    margin-top: 6px;
    margin-bottom: 6px;
    padding-left: 10px; 
    padding-right: 5px; 
    padding-top: 5px; 
    padding-bottom: 10px;
}
.todayCardOTWLog
{
    border-radius: 9px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
}
.todayCardOTWLog a
{
    color:var(--buttonTextColor);
}
.todayCardResUpcoming
{
    border-radius: 9px;
    background-color:gainsboro;
    color:black;
}
.todayCardResUpcoming a
{
    color:black;
}
.todayCardResOTW
{
    border-radius: 9px;
    background-color:#92f2d5;
    color:black;
}
.todayCardResOTW a
{
    color:black;
}
.todayCardResDone
{
    color:#fafafa;
    border-radius:9px;
    background-color:#727171;
}
.todayCardResDone a
{
    color:#fafafa;
}
.otwlKioskCardResBase 
{
    margin-bottom:8px;
    border-radius:8px;
}
.otwlCardResUpcoming
{
    color:black;
    background-color:gainsboro;
}
.otwlCardResUpcoming a
{ 
    color:black;
}
.otwlCardResOTW
{
    background-color:#92f2d5;
    color:black;
}
.otwlCardResOTW a
{
    color:black;
}
.otwlCardResDone
{
    color:#fafafa;
    background-color:#727171;
}
.divboatlineupBIG
{
    box-shadow: 5px 5px 3px #73a5d2;
    border-radius: 8px;
    border-color:var(--primaryColor);
    border-style: solid;
    border-width:1px;
    background-color:#ffffff;
    color:var(--primaryColor);
    display: none; 
    float: left; 
    margin-right: 15px; 
    margin-top: 15px; 
    padding: 15px; 
    text-align: justify; 
    font-size: 16px;
}
.blineupBIG
{
    white-space: nowrap;
    overflow: hidden; 
    text-overflow: ellipsis; 
    color:var(--primaryColor);
    font-weight: bold;
}
.divboatlineupREG
{
    border-radius: 8px;
    display: none; 
    float: left; 
    margin-right: 15px; 
    margin-top: 10px; 
    padding: 10px; 
    border-color:var(--primaryColor); 
    border-style: solid;
    border-width:1px;
    background-color:#ffffff;
    color:var(--primaryColor);
    text-align: justify; 
    font-size: 11px;
}
.blineupREG
{
    white-space: nowrap;
    overflow: hidden; 
    text-overflow: ellipsis; 
    color:var(--primaryColor);
}
.divboatlineup
{
    border-radius: 8px;
    display: none; 
    float: left; 
    margin-right: 15px; 
    margin-top: 10px; 
    padding: 10px; 
    border-color:var(--primaryColor); 
    border-style: solid;
    border-width:1px;
    background-color:#ffffff;
    color:var(--primaryColor);
    text-align: justify; 
    font-size: 12px;
}
.blineup
{
    white-space: nowrap;
    overflow: hidden; 
    text-overflow: ellipsis; 
    color:var(--primaryColor);
    font-weight: bold;
}
.rowertilenarrow
{
    width: 120px;
    height: 23px;
    border: 1px;
    color: red;
    border-radius: 6px;
    font-weight: normal;
    border-color: #7a7373;
    border-style: solid;
    background-color: #ffffff; 
    text-align: center;
    display: inline-block;
    vertical-align: top;
}
.rowertile
{
    width: 150px;
    height: 23px;
    border: 1px;
    color: red;
    border-radius: 6px;
    font-weight: normal;
    border-color: #7a7373;
    border-style: solid;
    background-color: #ffffff; 
    text-align: center;
    display: inline-block;
    vertical-align: top;
}
.rowertile:hover
{
    border: 1px;
    background-color:#f2ecec;
    border-color: darkgray; 
    border-style: solid;   
}
.mastheadbtn
{
    padding-left:10px;
    padding-right:10px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    border:1px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-color:var(--primaryColor); 
    border-style:solid;  
    height:36px;
    outline: none;
    font-size: 11px;
    transition: transform 0.2s ease-in-out;
}
.mastheadbtnfocus
{
    padding-left:10px;
    padding-right:10px;
    background-color:var(--lighterColor);
    color:var(--altTextColor);
    border:1px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-color:var(--lighterColor); 
    border-style:solid;  
    height:36px;
    outline: none;
    font-size: 11px;
    transition: transform 0.2s ease-in-out;
}
.mastheadbtnicon
{
    padding-right:2px;
    background-color:var(--primaryColor);
    color:var(--buttonTextColor);
    width:45px;
    border:1px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-color:var(--primaryColor);
    border-style:solid;  
    height:36px;
    outline: none;
    font-size:11px;
    transition: transform 0.2s ease-in-out;
}
.mastheadbtnbkmk
{
    background-color:yellow;
    color:var(--buttonTextColor);
    width:45px;
    border:1px;
    border-color:var(--primaryColor);
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-style:solid;  
    height:36px;
    outline:none;
    font-size:11px;
    transition:transform 0.2s ease-in-out;
}
.mastheadbtnsm
{
    background-color:var(--primaryColor);
    width:85px;
    color:var(--buttonTextColor);
    border: 1px;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    border-color:var(--primaryColor); 
    border-style: solid;  
    height: 36px;
    outline: none;
    font-size:11px;
}
.bookmarkbar
{
   border-radius:4px; 
   background-color:var(--lightColor); 
   color:var(--bodyTextColor);
   margin-top:-10px;
   margin-bottom:14px;
   padding-left:10px;
   padding-top:9px;
   padding-bottom:7px;
   width:fit-content;
}
.mastheadbtnadmn
{
    background-color: #F2F2F2;
    width: 135px;
    color: white; 
    border: 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-color: var(--bodyBGColor); 
    border-style: solid;  
    height: 23px;
    outline: none;
}
.mastheadbtnadmn:hover
{
    background-color:var(--lightColor) !important;
    color: white !important;
}
#navbuttons
{
    width: 1400px;
    background-color:#F2F2F2;
}
.discinfo
{
    padding-right:15px;
}
.icrewforum{
    background-color:var(--primaryColor);
    font-style:italic;
    color:white;
}
.dischdr4pinned
{
    padding-right:15px;
    background-color:yellow;
    color:black;
}
.discpinned
{
    background-color:yellow;
    color:black;
}
.dischdrpinned
{
    font-size:16px;
    font-weight:bold;
    padding-right:15px;
    background-color:yellow;
    color:black;
}
.dischdrpinned a {
	text-decoration:none;
}
.dischdr
{
    font-size:16px;
    font-weight:bold;
    padding-right:15px;
}
.dischdr a {
	text-decoration:none;
}
.hdgcelllabel 
{ 
    font-size:16px; 
    font-weight:bold; 
    font-family: Tahoma, Helvetica, Arial, sans-serif; 
    padding-right:15px;
    width:260px;
}
.hdgcelllabel-nw
{ 
    font-size:16px; 
    font-weight:bold; 
    font-family: Tahoma, Helvetica, Arial, sans-serif; 
    padding-right:15px;
    width:120px;
}
.hdgcelltext 
{ 
    width: 1000px;
    font-size:16px; 
    font-family: Tahoma, Helvetica, Arial, sans-serif; 
}
h2
{
    margin-top: -2px;
    font-size: 22px;
}
h3
{
    margin-top: -1px;
    font-size: 18px;
}
h4
{
    font-size: 16px;
}
h4 a {
	text-decoration:none;
}
h5
{
    font-size: 14px;
}
tr
{
    height: 35px;
}
a
{
    text-decoration: underline;
}
.rotate90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.simpleYellow
{
    color:black;
    background-color:yellow;
}
.footercellicon
{
    padding-top:2px;
}
.footercellicon:hover
{
    background-color:var(--lightColor);
    border-radius:4px;
    cursor:pointer;
}
.footercelliconhilite
{
    padding-top:2px;
    background-color:var(--lightColor);
    border-radius:4px;
}
.footercellyellow
{
    background-color:violet;
    color:white;
    font-size:11px;
    width:70px;
}
.footercellhilite
{
    background-color:var(--lightColor);
    color:var(--bodyTextColor);
    font-size:11px;
    width:70px;
    border-radius:4px;
}
.footercell
{
    font-size:11px;
    width:70px;
}
.footercelldiv
{
    width:70px;
    display:inline-block;
}
#footer
{
    background-color:var(--primaryColor);
    color: white;
    padding-top:6px;
}
#footer a
{
    color: var(--buttonTextColor);
}
#footerMenu li 
{
    display:inline;
    color:var(--primaryColor);
    list-style-type:none;
    padding-left:.4em;
    padding-right:.4em;
    margin-left:0em;
    border-left:1px solid white
}
#footerMenu li:first-child 
{
    border-left:none;
}
.cursor-wait 
{
    cursor: wait !important;
}
.medCheckbox 
{
    width:17px;
    height:17px;
}
.bigCheckbox 
{
    width:20px;
    height:20px;
}
#zemail
{
    display: none;
}
#popuphdr
{
    cursor:pointer; 
}
#mainbody
{
    padding-left:20px;
	width: 100%;
}
#moreheadings
{
    padding-left:20px;
}
#moreinfo
{
    padding: 22px;
	width: 100%;
}
#eventlist
{
    padding-left: 22px;
}
.memberfieldlabels
{
    width: 500px;
}
.imgMainHeader 
{
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}
#btnBack
{
    background-color: white;
    color:var(--bodyTextColor); 
    border: 1px;
    border-color: white;
    border-style: solid;
    border-radius: 6px;
}
#slideout {
  position: fixed;
  top: 240px;
  left: 0;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
#slideout_inner {
  position: fixed;
  top: 40px;
  left: -250px;
  background-color:var(--primaryColor);
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
#slideout:hover {
  left: 250px;
}
#slideout:hover #slideout_inner {
  left: 0;
}
/* .fancyCbx checkbox squaredFour from http://codepen.io/bbodine1/pen/novBm */
.fancyCbx {
  width: 20px;
  position: relative;
  margin: 20px auto;
}

.fancyCbx label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  background: #fcfff4;
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 4px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.fancyCbx label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 4px;
  left: 4px;
  border: 3px solid #333;
  border-top: none;
  border-right: none;
  background: transparent;
  opacity: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.fancyCbx label:hover::after {
  opacity: 0.5;
}
.fancyCbx input[type=checkbox] {
  visibility: hidden;
}
.fancyCbx input[type=checkbox]:checked + label:after {
  opacity: 1;
}