#DashboardWidgets
{
    width: 100%;
    margin-top: 5px;
}

/* Widget Bar */

#WidgetBar 
{
	border: none !important;
    background: none !important;
    box-shadow: none !important;
    height: 46px;
    padding: 10px 0px;
    border-radius: 0px !important;
}

.Navigator
{
	border: none !important;
}


#DashboardSelectorContainer,
#MobileDashboardSelectorContainer
{
    float: right;
    padding-top: 5px;
    text-transform: uppercase;
    font-size: 0.85em;
}

#DashboardSelectorContainer span,
#MobileDashboardSelectorContainer span
{
    margin-right: 5px;
}

#WidgetBarTitle
{
    float: left;
    padding-left: 10px;
    border-left: 1px solid #d6d6d6;
    margin-left: 5px;
    margin-right: 5px;
    line-height: 35px;
    text-transform: uppercase;
    font-size: 0.85em;
}

.WidgetLayoutSelector
{
    float: left;
    margin-right: 5px;
}

#WidgetBar ul li
{
    float: left;
    line-height: inherit;
    display:inline;
    border: 1px solid #D1D1D1;
    padding: 0 4px;
}

#WidgetBar ul li.WidgetLayoutIconLI:first-child 
{
	margin-left: 0px;
}

#WidgetBar ul li.WidgetLayoutIconLI, 
#WidgetBar ul li.WidgetIconLI 
{
    padding: 6px;
}

#WidgetBar ul li.WidgetIconLI .MediumIcon , .WidgetLayoutIcon img
{
	height: 20px;
	width: 20px;
}

#WidgetBar ul li.WidgetIconLIOn 
{
    display: none; /* this hides the widget icons when they are "turned on" */
}

#WidgetBar ul li.WidgetIconMobileLeftHide
{
    display: none; 
}

#WidgetBar ul li.MobileNavigatorHide
{
    display: none;
}

#WidgetBar ul li.MoveDim
{
    opacity: 0.3 !important;
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
    pointer-events: none;
    cursor: default;
}

#WidgetBar ul li.WidgetIconMobileRightHide
{
    display: none;
}

#WidgetBar.MoveLeft{
    display: none;
} 

.WidgetLayoutSelectorList
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.WidgetLayoutSelectorList li a.WidgetLayoutIcon
{
    text-decoration: none;
    display: block;
}

.WidgetLayoutSelectorList li a.WidgetLayoutIcon img
{
    vertical-align: middle;
}

.WidgetLayoutIconLI
{
    margin-right: 4px;
    margin-left: 4px;
    border-radius: 3px;
    color: #FFFFFF;
	opacity: 0.4;	
}

.WidgetLayoutIconLIOn
{
    background: #D1D1D1;
    border-bottom: 2px solid #1A496D;
    padding: 0 4px;
}

.WidgetList
{
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.WidgetList 
{
    list-style: none;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    display: inline-block;
}

.WidgetList li a.WidgetIcon
{
    text-decoration: none;
    display: block;
}

.WidgetList li a.WidgetIcon img
{
    vertical-align: middle;
}

.WidgetIconLI
{
    position: relative;
    margin-right: 4px;
    margin-left: 4px;
    border-radius: 3px;
    color: #FFFFFF;
}

.WidgetIconLIOn
{
    background: #D1D1D1;
    border-bottom: 2px solid #1A496D;
    padding: 0 8px;
}

.WidgetIconAlert 
{
    display: inline-block;
    padding: 2px 7px;
    font-size: .750em;
    line-height: 1;
    color: #FFFFFF;
    vertical-align: middle;
    background-color: #DE0000;
    border-radius: 3px;
    margin-top: -30px;
    margin-left: -5px;
    font-weight: bold;
}

/* Widget Bar Icons */

#WidgetBar ul li.WidgetLayoutIconLIOn 
{
    opacity: 1.0;
    padding: 6px;
}

/* Widget Container */

#WidgetContainer
{
    display: -webkit-flex;
    display: flex;
    padding: 0;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: transparent;
    border: 0;
    min-height: 400px;
}

/* Tabs Within Widgets */

.WidgetContent ul.TabbedList 
{
	margin: 0 0 20px 0;
}

.WidgetContent ul.TabbedList li 
{
	padding: 8px 0;
}

.WidgetContent ul.TabbedList li:hover:after,
.WidgetContent ul.TabbedList li.TabbedListLIOn:after,
.WidgetContent ul.TabbedList li.TabbedListLIOn:hover:after 
{
    top: 32px;
}

/*

End Tabs Within Widgets

*/

.WidgetColumn
{
    width: 100%;
    min-height: 400px;
    display: table-cell;
    float: left;
}

.OneColumnLayout 
{
    width: 100%;
}

.TwoColumnLayout
{
    width: 50%;
}

.LeftColumn
{
    float: left;
    padding: 0;
    padding-right: 15px;
}

.RightColumn
{
    float: right;
    padding: 0;    
    padding-left: 15px;
}

/* for resizable columns, taken from jQuery-ui CSS so that jQuery UI Themes CSS doesn't need to be loaded */
.ui-resizable 
{
	position: relative;
}

.ui-resizable-handle 
{
	position: absolute;
	font-size: 0.1px;
	display: block;
	-ms-touch-action: none;
	touch-action: none;
}

.ui-resizable-e 
{
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}

.ui-sortable-helper 
{
	border: 1px solid #bbbbbb;
	background-color: #FEFEFE;
	padding: 4px;
}

.DraggableControl
{
    max-width: 100%;
    margin: 0 0px 20px 0px;
    position: relative;    
    background: #FFFFFF;
    box-shadow: 0px 1px 13px -1px #9A9A9A;
    -moz-box-shadow: 0px 1px 13px -1px #9A9A9A;
    -webkit-box-shadow: 0px 1px 13px -1px #9A9A9A;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.WidgetHeader
{
    overflow: hidden;
    height: 36px;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    padding: 4px 8px; 
}

.WidgetHeader:hover
{
    cursor: move;
}

.WidgetHeader p
{
    float: left;
    margin-top: 4px;
	font-family: 'Nunito', 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 1.35em;
	color: #ADADAD;
	text-transform: uppercase;
}

.WidgetHeader p img
{
    vertical-align: middle;
    margin-right: 8px;
	width: 28px;
	height: 28px;
}


/* Enrollments Widget is unmovable */
#EnrollmentsWidgetHeader:hover
{
    cursor: default;
}

.RestrictedWidgetHeader
{
    overflow: hidden;
    height: 36px;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    padding: 4px 8px; 
}

.RestrictedWidgetHeader p
{
    float: left;
    margin-top: 4px;
	font-family: 'Nunito', 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 1.35em;
	color: #ADADAD;
	text-transform: uppercase;
}

.RestrictedWidgetHeader p img
{
    vertical-align: middle;
    margin-right: 8px;
	width: 28px;
	height: 28px;
}

/* Mobile WidgetHeader */

.MobileWidgetHeader
{
    height: 43px;
    margin-bottom: -5px;
    margin-right: 10px;
    margin-left: 10px;
    border-radius: 3px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    border: 1px solid #000000;
    box-shadow: none;
    background: #3a3a3a;
    color: white;
}

.MobileWidgetHeader p
{
    float: left;
    margin-top: 2px;
}

.MobileWidgetHeader p img
{
    vertical-align: middle;
    margin-right: 4px;
}

.WidgetControlIcon
{
    float: right;
    margin-left: 12px;
    margin-right: -5px;
    margin-top: 4px;
    padding-right: 3px;
}

.WidgetControlIcon img
{
    width: 18px;
    height: 18px;
}

.WidgetContent, .WidgetContentNoMinimumHeight
{
    position: relative;
    /* max-height: 500px !important; */
    overflow: hidden;
    -webkit-border-radius:  0 0 4px 4px;
    -moz-border-radius:  0 0 4px 4px;
    border-radius:  0 0 4px 4px;
    border-top: 0;
    font-size: 0.9em;
    padding: 10px;
}

/*

GRID TABLE within Dashboard Reset

*/

.WidgetContent .GridLoadingPanel img
{    
    margin-top: 45px;
}

.WidgetContent .GridTable
{
	border: none;    
    margin-bottom: 6px;
}

.WidgetContent .GridTable th
{
	border: none;
}

.WidgetContent .GridTable tr
{
	border: none;
}

.WidgetContent .GridTable td 
{
	border: none;
}

.WidgetContent .GridTable th:first-child, 
.WidgetContent .GridTable td:first-child
{
	border: none;
}

.WidgetContent .GridTable th:last-child,
.WidgetContent .GridTable td:last-child 
{
	border: none;
}

.WidgetContent #GridPagerTable tr
{
	border-top: 1px solid #DDDDDD;
}

/*

END

*/

.WidgetLoadingPlaceholder
{
    text-align: center;
    margin-top: 30px;
	margin-bottom: 5px;
}

.WidgetSortPlaceholder
{
    border: 2px dashed #C1C1C1; 
    visibility: visible !important;
	margin: 0 0 16px 0; /* adjust for the outline thickness */
}

.WidgetSortPlaceholder *  
{
    visibility: hidden; 
}

.HighlightDroppableColumn
{
    border: 2px dashed #C1C1C1;
    visibility: visible !important;
}

.MobileWidgetLeftEdge
{
    border-radius: 3px;
    display: block;    
    float: left;
    margin: 0px;
    width: 10px;
    height: 440px; 
    background: #FFFFFF;
}

.MobileWidgetLeftEdge:hover
{
    background: #C1C1C1;
}

.MobileWidgetLeftEdgeNone
{
    border-radius: 3px;
    display: block;    
    float: left;
    margin: 0px;
    width: 10px;
    height: 440px; 
    background: #FFFFFF;
}

.MobileWidgetLeftEdgeNone:hover
{
    background: #FFFFFF;
    pointer-events: none;
    cursor: default;
}

.MobileWidgetRightEdge
{
    border-radius: 3px;
    display: block;    
    float: right;
    margin: 0px;
    width: 10px;
    height: 440px; 
    position: relative;
    background: #FFFFFF;
}

.MobileWidgetRightEdge:hover
{
    background: #C1C1C1;
    text-decoration: none;
}

.MobileWidgetRightEdgeNone
{
    border-radius: 3px;
    display: block;    
    float: right;
    margin: 0px;
    width: 10px;
    height: 440px; 
    background: #FFFFFF;
}

.MobileWidgetRightEdgeNone:hover
{
    background: #FFFFFF;
    pointer-events: none;
    cursor: default;
}

/*

WIDGET-SPECIFIC 

*/

.EnrollmentsWidgetCourseTitleText
{
    margin-right: 6px;
}

.EnrollmentsWidgetUnscheduledILTAlert img
{
    width: 20px !important;
    height: 20px !important;
}

#FeedWidgetContent 
{
    max-height: 500px !important;
	overflow: auto;
	border-bottom: none;
	padding-bottom: 10px;
}

#WallModerationWidgetContent 
{
    max-height: 500px !important;
    overflow: auto;
    border-bottom: none;
    padding-bottom: 10px;
}

/* RESPONSIVENESS */

@media (max-width: 768px) 
{

    .TwoColumnLayout 
    {
        width: 100%;
    }

    .WidgetLayoutSelectorList 
    {
        display: none;
    }

    #WidgetBar 
    {
        height: 42px;
        min-width: 275px;
        overflow: hidden;
        display:inline-block;
    }

    .WidgetList li a.WidgetIcon img 
    {
        vertical-align: middle;
        height: 24px;
        position: relative;
        top: -1px;
    }

    .WidgetIconLI 
    {
        margin-right: 2px;
        margin-left: 2px;
    }

    #DashboardSelectorLabel 
    {
        display: none;
    }

    #DashboardSelectorContainer 
    {
        display: none;
    }

    div.scrollWrapper
    {
	    position: relative;
	    overflow: hidden;
	    width: 100%;
	    height: 100%;
    }

    div.scrollableArea
    {
	    position: relative;
	    width: auto;
	    height: 100%;
    }
}

#FeedWidgetLoadedContent video {
    width: 100%;
    height: 100%;
}

#FeedWidgetLoadedContent ul {
    list-style: disc;
}

#FeedWidgetLoadedContent ol {
    list-style: decimal;
}

#FeedWidgetLoadedContent img {
    max-width: 100%;
    height: auto !important;
}