/* SHARED css - used across all themes and all pages, including MyBlackboard pages
 *
 * Rules for this file:
 * - Only put 'named' classes here: Do not style raw elements without a qualifying classname
 * - Only put structural classes here, not colors unless absolutely necessary (comment).
 *
 * The long-term intention is to eventually have the system "functional" with just shared.css included -
 * maybe not colourful and pretty, but functional
 */

@import url("../fonts/icon-core.css");
@import url("../fonts/icon-listing.css");
@import url("core.css");


/* @group TAG DEFAULTS */

h1 {
    font-size: 148%;
}

h2 {
    font-size: 123.1%;
}

h3 {
    font-size: 110%;
}

h1,
h2,
h3 {
    margin: 1em 0;
}

table {
    font-size: 100%;
}

thead th {
    font-weight: bold;
}

.vtbegenerated a {
    text-decoration: underline;
}


#content .vtbegenerated,
#content .vtbegenerated p{
    position: relative;
    overflow: visible;
}

/* @end TAGS*/


/* @group BODIES */

body.login-page {
    min-height: 800px;
    position: relative;
}

body.popup {
    padding: 0;
    margin: 0;
}

body.csMenuFrame,
body.popupMenu {
    border: 0;
    margin: 0;
    padding: 0;
}

.csMenuFrame {
    font-size: 95%;
}

body.external-breadcrumbs {
    background-image: none;
}

body.picker {
    min-width: 400px;
}

/* @end BODIES */

/* @group BREADCRUMBS */

.external-breadcrumbs .breadcrumbs {
    padding: 12px 40px 0 12px;
}


/* @end BREADCRUMBS */


/* @group LOCATION PANE */

.locationPane {
    padding-bottom: 12px;
}

body.picker .locationPane {
    margin: 0;
    display: block;
}

.csPicker .locationPane {
    display: block
}


/* @end LOCATION PANE */


/* @group MENU PANE */

.navigationPane {
    width: 210px;
    margin: 0px;
    top: 0px;
    left: 0;
    margin-left: 0;
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}


/* @end MENU PANE */


/* @group CONTENT PANE */

.contentPane {
    padding: 0;
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}


/*Wide Content pane (used in screens without side navigation)*/

.contentPaneWide,
.portalPane {
    padding: 0;
}

.popup .contentPaneWide,
.picker .contentPaneWide {
    margin: 0;
    padding: 0;
}

.course-tools-page #listContainer {
    padding: 0px 30px
}

.picker .container,
.popup .container {
    padding: 12px 20px
}


/* @end CONTENT PANE */


/* @group MENU PANE TOGGLE */

#puller {
    position: absolute;
    right: -8px;
    z-index: 3;
    top: -1px;
    bottom: 1px;
    -webkit-transition: opacity 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: opacity 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

#puller a {
    height: 100%;
    width: 8px;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
    box-shadow: 1px 0 3px rgba(0, 0, 0, 0.4) inset;
    border: 1px solid #777;
    border-left: 0;
    position: relative;
    overflow: visible;
    opacity: 0;
    filter: alpha(opacity=0);
    /*cursor: w-resize;*/
}

.menuWrap:hover #puller a,
.menuWrap:focus #puller a {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -webkit-transition: opacity 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: opacity 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

#puller.pullcollapsed a {
    background-color: #00ADD0;
    opacity: 1;
    filter: alpha(opacity=100);
}

#puller a img {
    height: 24px;
    width: 10px;
    padding: 3px 6px 3px 1px \9;
    position: relative \9;
    right: -9px \9;
    top: 200px \9;
    width: 12px \9;
    filter: alpha(opacity=0) \9;
}

#puller.pullcollapsed a:hover,
#puller.pullcollapsed a:focus {
    /*cursor: e-resize;*/
    -webkit-transition: background-color 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: background-color 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

#puller.pullcollapsed a:hover img,
#puller.pullcollapsed a:focus img,
#puller a:hover img,
#puller a:focus img {
    filter: alpha(opacity=100);
}


/* @end MENU PANE TOGGLE */


/* @group COLLAPSED/EXPANDED STATES */


/*Navigation pane is collapsed.*/

.navcollapsed {
    margin-left: -210px;
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}


/*Puller location when navigation element is collapsed. */

#puller.pullcollapsed {
    right: -10px;
    opacity: 1;
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

.navcollapsed .menuWrap {
    display: block!important
}


/*Content area margin when navigation element is collapsed. */

.contcollapsed {
    margin-left: 12px;
    -webkit-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: margin-left 300ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

/* @group TOP FRAME */

/* @group TOP FRAME LAYOUT */

/*Branding image container.*/

#topFrame
/*@branding - do not remove*/
.bgBanner {
    background-position: 0 0;
    background-repeat: no-repeat;
}

.brandingImgWrap a {
    display: inline-block;
    position: absolute;
}

.bannerImage {
    max-height: 35px;
}


/*Branding image, hot spots and hot links are hidden when compact tabs are used*/

.topTabs-compact .bannerImage,
.topTabs-compact .brandingImgWrap,
.topTabs-compact .hotItems {
    display: none;
}


/*Compact tabs*/

.topTabs-compact {
    height: 52px;
}


/*Tab wrapper*/

.tabWrapper-left,
.tabWrapper-center,
.tabWrapper-right {
    width: auto;
    padding: 0 28px;
}


/*Table that contains application tabs*/


/*Regular tabs*/

.appTabs {
    width: auto;
    position: relative;
}

.topTabs-compact .tabWrapper-left,
.topTabs-compact .tabWrapper-center,
.topTabs-compact .tabWrapper-right {
    padding-top: 24px;
}


/* @end TOP FRAME LAYOUT */


/* @group APPLICATION TABS */


/*Application tabs*/


/*Regular tabs*/

.appTabs a {
    font-size: 110%;
    text-align: center;
    display: block;
    text-decoration: none;
    padding: 10px 1.2em 19px;
    z-index: 100;
    white-space: nowrap;
    position: relative;
    border: 1px solid transparent;
    border-width: 1px 1px 0;
}

.topTabs-compact .appTabs a span {
    padding-bottom: 0;
}

.appTabs .active .hideoff,
.appTabs .active a:hover .hideoff,
.appTabs .active a:focus .hideoff,
.toppTabs-compact .appTabs .active .hideoff,
.toppTabs-compact .appTabs .active a:hover .hideoff,
.toppTabs-compact .appTabs .active a:focus .hideoff {
    bottom: 0;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-top: 0;
    margin-left: -14px;
    bottom: 0px;
    line-height: 0;
    left: 50%;
    top: auto;
    color: transparent;
    font-size: 0;
    z-index: 100;
}

.appTabs .active a span,
.appTabs .active a:hover span,
.appTabs .active a:focus span {
    border: 0;
}

.topTabs-compact .appTabs .active .hideoff,
.topTabs-compact .appTabs .active a:hover .hideoff,
.topTabs-compact .appTabs .active a:focus .hideoff {
    border-width: 0 7px 7px;
    margin-left: -7px;
}

.topTabs-compact .appTabs a,
.topTabs-compact .appTabs .active a:hover,
.topTabs-compact .appTabs .active a:focus {
    font-size: 95%;
    padding: 0.4em 1em .7em;
}

/* @end APPLICATION TABS*/


/* @group TOP FRAME LINKS (HOME, HELP, LOGOUT)
----------------------------------------------- */


/*Top frame links*/

.topGlobalLinks {
    background-color: rgba(0, 0, 0, 0.15);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33000020, endColorstr=#33000020";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#33000020, endColorstr=#33000020);
}

.topGlobalLinks ul {
    z-index: 1001;
}

.topGlobalLinks ul li {
    display: inline-block;
    margin: 0 0 0 -4px;
}

.topGlobalLinks ul li:first-child {
    margin: 0;
}

.topGlobalLinks a {
    display: inline-block;
    text-align: left;
    padding: 3px 5px;
    text-indent: -10000px;
    min-width: 18px;
    overflow: hidden;
    background: none!important;
}

.topGlobalLinks a .link-icon {
    background-repeat: no-repeat;
    display: block;
    float: right;
    height: 16px;
    width: 16px;
    overflow: hidden;
}


.topGlobalLinks .home .link-icon {
    background-position: -129px 0
}

.topGlobalLinks .home:hover .link-icon,
.topGlobalLinks .home:focus .link-icon {
    background-position: -129px -16px
}

.topGlobalLinks .logout .link-icon {
    display: none
}

.topGlobalLinks .logout {
    text-indent: 0;
    padding: 2px 9px;
    width: auto!important;
}

.topGlobalLinks .help .link-icon {
    background-position: -145px 1px
}

.topGlobalLinks .help:hover .link-icon,
.topGlobalLinks .help:focus .link-icon {
    background-position: -145px 1px
}

/* @end TOP FRAME LINKS*/

/* @group TOP FRAME HOT ITEMS */

.hotItems {
    position: relative;
    margin-right: 3px;
    width: 240px;
    min-height: 28px;
    text-align: center;
}

.hotSpots {
    max-height: 46px;
    overflow: auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3px 3px 5px;
}

.hotSpots li {
    display: inline-block;
    display: inline\9;
    /*IE8*/
    padding: 0 0 2px;
}

.hotSpots a {
    text-decoration: underline;
    background: transparent;
    display: inline-block;
    padding: 0 6px 0 0;
}

.hotSpots li:after {
    position: relative;
    right: 1px;
}

.hotSpots li:last-child:after {
    content: none
}

/* @end TOP FRAME HOT*/

/* @end TOP FRAME */

/* @end TOP FRAME HOT ITEMS */

/* @group BREADCRUMBS

/*Floating breadcrumb elements. Floating is necessary due to RTL rendering issues.*/

.path li,
.simplePath li {
    padding: 0px 12px 0px 0;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
}

/*Optional breadcrumb label style.*/

.path .label,
.simplePath .label {
    padding: 0 6px 0 6px;
    color: #444;
    font-weight: normal;
}

.path a:hover,
.path a:focus,
.simplePath a:hover,
.simplePath a:focus {
    color: #333;
    text-decoration: underline;
}

.path .button,
.simplePath .button {
    padding: 0;
    margin: 0 8px 0 0;
}

.path .root a:hover:before,
.path .root a:focus:before,
.simplePath .root a:hover:before,
.simplePath .root a:focus:before {
    color: #888;
}

.path .button a,
.simplePath .button a {
    background-image: none;
    padding: 1px 1px 2px 1px;
}

.path li.contextPath {
    line-height: 0;
    font-weight: bold;
    padding: 0 12px 0 0;
    margin: 0;
}

.path li.contextPath:last-child {
    background-image: none
}

.contextPath > div,
.contextPath > div:hover,
.contextPath > div:focus {
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    opacity: .6;
}

.contextPath:hover > div,
.contextPath:hover > div:hover,
.contextPath:hover > div:focus {
    opacity: 1
}

.contextPath a.cmimg:hover,
.contextPath a.cmimg:focus,
.courseArrow a.cmimg:hover,
.courseArrow a.cmimg:focus {
    background-position: -28px -142px
}

.courseArrow,
.courseArrow a {
    display: inline-block
}

.coursePath:hover .courseArrow,
.coursePath:focus .courseArrow {
    opacity: 1
}


/*Setting proper styles for breadcrumbs in Outcomes. */

.banner + .breadcrumbs {
    margin: 0;
    background-color: inherit;
}

.breadcrumb-controls {
    float: right
}

.mobile-course-instructor-settings-button {
    visibility: hidden; /*only want available to mobile users to avoid confusion */
}

.lock-unlock-toggle {
    display: inline-block;
    height: 10px;
    width: 35px;
    overflow: visible;
    position: relative;
}

.course-availability-button {
    width: 30px;
    height: 25px;
    width: 30px;
    overflow: visible;
    display: inline-block;
    position: absolute;
}

.course-availability-button:hover:after,
.breadcrumb-controls a:hover:after {
    content: attr(title);
    padding: 15px;
    color: #333;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 20;
    white-space: nowrap;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0px 0px 4px #222;
    -webkit-box-shadow: 0px 0px 4px #222;
    box-shadow: 0px 0px 4px #222;
    background: #fff;
   
  }

.contextPath a.cmimg,
.courseArrow a.cmimg {
    display: inline-block;
    vertical-align: middle;
}

/* @end BREADCRUMBS */

/* @group CONTENT AREA */

.content {
    margin: 0;
    padding: 0;
}

.popup .contentBox,
.picker .contentBox {
    border: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

/*If "OK" button is at the bottom of content area*/

div.okContainer,
div.ok div.container,
.collabContainer {
    padding-bottom: 60px;
    position: relative;
}

/*Shared column attributes*/

.column-1,
.column-2,
.column-3,
.column-4,
.column-5 {
    margin: 6px 0px 0px 0px;
}

/* @group CONTENT AREA COLUMNS */

.picker .leftColumn-narrow,
.picker #bb-question-discover .leftColumn-narrow {
    width: 25%;
    margin: -12px 0 0 -20px;
}

.rightColumn-narrow {
    float: right;
    margin-left: 1%;
    width: 22%;
}

.rightColumn-wide {
    float: right;
    width: 74%;
}

.leftColumn-wide {
    float: left;
    width: 76%;
    margin-left: -3px;
}

.picker .leftColumn-wide,
.picker #bb-question-discover .leftColumn-wide {
    width: 76%;
    margin-top: -12px;
    min-height: 430px;
}

.picker .leftColumn-wide h1 {
    margin: 0;
    padding: 6px 12px;
}

#bb-question-discover .leftColumn-wide {
    width: 80%;
}

#bb-question-discover .leftColumn-wide + .leftColumn-wide {
    border-left: none;
    margin: 0;
    width: auto;
}

#bb-question-discover .leftColumn-narrow {
    width: 24%
}

.leftColumn-narrow h3,
.rightColumn-narrow h3 {
    position: relative;
    margin: 0px 0 3px;
    padding: 0;
    color: #666666;
    font-size: 100%;
}

.leftColumn-narrow h4,
.rightColumn-narrow h4,
.columnPalette h4 {
    display: block;
    margin: 0;
    padding: 0;
}

.leftColumn-narrow a.itemHead:hover,
.leftColumn-narrow a.itemHead:focus,
.rightColumn-narrow a.itemHead:hover,
.rightColumn-narrow a.itemHead:focus,
a.itemHead:hover,
a.itemHead:focus {
    text-decoration: underline;
}


.leftColumn-narrow h3.hideoff {
    margin: 0;
}

.leftColumn-narrow .columnPalette:first-child {
    border-top: 0;
}

.paletteGroup,
.columnPalette {
    position: relative;
    border-top: 2px groove rgba(255, 255, 255, 0.3);
    padding: 4px 0 4px 6px;
}

.paletteGroup div.columnPalette {
    /* remove borders from grouped palettes */
    position: relative;
    margin: 0 0 6px;
    border: none;
    padding: 0;
    background: transparent;
}

.paletteItems {
    margin: 0 0 4px;
    font-size: 95%;
    padding-bottom: 60px;
}

.paletteItems li {
    position: relative;
    margin: 0 0 0 16px;
    padding: 2px;
}

.paletteItems div {
    margin: 0 0 0 16px;
}

#searchForm .paletteItems li {
    margin: 0 0 0 24px;
}


.paletteItems li a {
    padding: 6px 9px;
    line-height: 110%;
    display: block;
}

.paletteItems li label {
    display: inline-block;
    padding-left: 21px;
}

.picker .paletteItems li label {
    font-size: 94%
}

.paletteItems li:last-child {
    border: none;
}

.paletteItems li input[type=checkbox],
ul.paletteItems li input[type=radio] {
    position: absolute;
    left: 0;
    top: 0;
}

.paletteItems li a:hover,
.paletteItems li a:focus {
    text-decoration: underline
}

/* actionbar for column styles. prevents wrapping and gap btw text and icon when background color applied */

.columnActions ul li a {
    display: block;
}

/* @end CONTENT AREA COLUMNS*/

/* @group COPYRIGHT */

#copyright {
    display: inline-block;
    font-size: 82%;
    position: relative;
    margin: 16px 0 0 9px;
}

.newCopyright {
    margin: 0 0 0 12px;
    padding: 20px 12px 6px 60px;
    position: relative;
}

.logo,
.productTitle,
.legal,
.additionalInfo {
    padding: 0 0 1px;
}

.productTitle {
    padding: 9px 12px 0px 9px;
    min-height: auto;
}

.logo {
    margin-top: -20px;
    position: absolute;
    left: 0;
}

.logo img {
    width: 150px;
}

.additionalInfo {
    float: none;
}

.legal p,
.additionalInfo p {
    margin: 0;
    display: inline-block;
}

.additionalInfo p:first-child {
    margin: 0 9px 0 0;
    padding: 0 2px 0 0;
}

.additionalInfo p:first-child:after {
    right: -1px;
    position: relative;
}

.additionalInfo p:first-child a {
    padding-right: 12px
}


.productTitle a {
    font-size: 125%;
    font-weight: bold;
    text-decoration: none;
    line-height: 1.1em;
    text-align: right;
    display: block;
}

.productTitle a:hover,
.productTitle a:focus {
    text-decoration: underline
}

.additionalInfo a:hover,
.additionalInfo a:focus {
    text-decoration: underline
}

.productImg {
    float: left;
    margin-top: 5px;
}

.copyrightDetailContents ul {
    margin: 4px 0 0 24px;
    float: left;
    text-align: left;
}

.copyrightDetailContents ul li span {
    font-weight: bold
}

a.closeCopyright {
    float: right;
    position: relative;
    right: -16px;
    top: -5px;
}

/* @end COPYRIGHT */

/* @group SPLASH PAGE */

.contentBlock ul.threeCol {
    float: left;
    width: 30%;
}

.contentBlock ul.threeCol li {
    font-weight: bold;
    margin: 0px;
    float: none;
}

.contentBlock ul.threeCol li a {
    background-image: none;
}

.contentBlock h3 input,
.contentBlock h3 select,
.contentBlock input,
.contentBlock select {
    font-size: 90%;
    font-weight: normal;
    border: 1px solid #999;
    margin-left: 6px;
    padding: 1px 2px;
    vertical-align: middle;
}

.contentBlock ol li input[type="checkbox"] {
    margin-right: 6px;
    vertical-align: middle;
}

.contentBlock h3 a.browse, 
.contentBlock a.browse, 
.contentBlock input.browse {
    display: inline;
}

/* @end SPLASH PAGE */

/* @group LANDING PAGE */

div.landingListWrapper {
    text-align: center;
    margin: 1.6em 0 0 0;
}

/*2 column setup*/

div.landingListWrapper ul.landingList,
div.landingListWrapper ul.landingList-2cols {
    width: 90%;
    margin: 0 auto;
    list-style: none;
    padding: 0;
}

div.landingListWrapper ul.landingList li {
    margin: 0 0 1.6em 0em;
    width: 50%;
    text-align: left;
}


div.landingListWrapper ul.landingList-2cols li {
    float: left;
    margin: 0 3em 1.6em 0em;
    width: 45%;
    text-align: left;
}

div.landingListWrapper ul.landingList li.restart {
    margin-top: -13.6em;
}

div.landingListWrapper ul.landingList li a,
div.landingListWrapper ul.landingList-2cols li a {
    text-decoration: none;
}

div.landingListWrapper ul.landingList li a:hover,
div.landingListWrapper ul.landingList-2cols li a:hover,
div.landingListWrapper ul.landingList li a:focus,
div.landingListWrapper ul.landingList-2cols li a:focus {
    text-decoration: underline;
}

div.landingListWrapper ul.landingList li p,
div.landingListWrapper ul.landingList-2cols li p {
    padding: 0.4em 0.6em 0 1.4em;
    margin: 0;
    border-top: 1px solid #ddd;
}

div.landingListWrapper ul.landingList li ul {
    list-style-type: square;
    margin: 0em 0.4em 0.4em 0.8em;
}

div.landingListWrapper ul.landingList li ul li {
    clear: left;
    padding: 0;
    margin: 0;
    color: #000;
}

div.landingListWrapper ul.landingList-2cols li ul li {
    float: none;
    padding: 0;
    margin: 0;
    color: #000;
}

div.landingListWrapper ul.landingList li h3,
div.landingListWrapper ul.landingList-2cols h3 {
    margin: 0;
    padding: 0.4em 1.2em;
    font-size: 110%;
}

/* landing Page list column. */

.containerLanding, 
div.landing div.container, 
body.landingBody div.container {
    min-height: 400px;
    padding: 10px 0 12px 0;
}

.inst-email div.landing div.container {
    padding: 20px 30px;
}

div.landingPageColumn {
    margin: 1.2em 0;
    padding: 0;
    float: left;
}

.twoCol {
    margin: 1.2em 0;
    width: 49%;
}

.threeCol {
    margin: 1.2em 0;
    width: 32.5%;
}

.landingPageColumn ul {
    margin: 0 0 0 30px
}

.landingPageColumn .outcomesLanding {
    padding: 0 0 .4em 0;
}

.landingPageColumn ul li {
    margin: 0 0 2.2em 0em;
    text-align: left;
}

.inst-email .landingPageColumn ul li {
    margin: 0;
}

.landingPageColumn .outcomesLanding li {
    margin: 0 0 1.2em 0em;
}

.landingPageColumn ul li a {
    text-decoration: none;
}

.landingPageColumn ul li a:hover,
.landingPageColumn ul li a:focus {
    text-decoration: underline;
}

.landingPageColumn h3,
.landingPageColumn .outcomesLanding li a {
    margin: 0;
    padding: 0.4em 0;
    font-size: 110%;
    /*  background:transparent url(images/indicators.png) no-repeat 3px 10px;*/
}

/* landing Page list column. */

.landingPageColumn .outcomesLanding li h3 {
    background-image: none;
    padding: 0.4em 0;
    font-size: 115%;
    border-bottom: 1px solid #ddd;
}

.landingPageColumn .outcomesLanding li a {
    font-weight: bold;
    font-size: 100%;
}

.landingPageColumn .outcomesLanding li p {
    border-top: 0 !important;
}

/*If image is used in the header*/

.landingPageColumn h3 img {
    margin: 0 0 0 -12px
}

.landingPageColumn h3.hiddenlink img {
    opacity: 0.4;
    filter: alpha(opacity=40);
    position: absolute;
    top: 0;
    left: 1.1em;
    *left: -3.1em;
}

.landingPageColumn ul li ul {
    list-style-type: square;
    margin: 0em 0.4em 0.4em 0.8em;
    padding: 0 0 0 1.6em;
}

.landingPageColumn ul li ul li {
    color: #555;
    float: none;
    padding: 1px 0 2px;
    margin: 0;
}

.landingPageColumn ul li ul li.more {
    padding-top: 3px;
}

.landingPageColumn ul li ul li.more a {
    padding: 0 9px 0 0;
    color: #555;
    background: transparent url(images/indicators.png) no-repeat 0 50%;
}

.landingPageColumn ul li p {
    padding: 0;
    margin: 0;
}

/*#contentPaneWide div.gray b, #contentPane div.gray b  {background:#ededed;}*/

/*hidden tool link*/

.landingPageColumn h3.hiddenlink {
    position: relative;
    padding: 1em 1.2em 0.6em 4.2em;
}

.landingPageColumn h3.hiddenlink a,
.landingPageColumn h3.hiddenlink a:hover,
.landingPageColumn h3.hiddenlink a:focus {
    color: #777;
    text-decoration: none;
}


.subhead_text {
    color: #333333;
    font-size: 90%;
    padding: 0pt 0pt 2px;
}

.list_text {
    color: #666666;
    font-size: 85%;
    font-weight: normal;
    padding: 0pt 2px 2px 1.3em;
}

.landingPageColumn .outcomesLanding .list_text a {
    background-image: none;
    font-weight: normal;
    margin-left: 3px;
    padding: 0pt;
}


/* os landing pages, cs splash pages */

div.datalistScroll {
    margin: 0.4em 0 0.4em 1.4em;
    border: 1px solid #ddd;
    background-color: white;
    height: 360px;
    overflow: auto;
}

div.datalist {
    margin: 0.4em 0 0.4em 1.4em;
    border: 1px solid #ddd;
    background-color: white;
}

div.landingPageColumn ul li ul.datalistScroll {
    margin: 0.4em 0 0.4em 1.4em;
    border: 1px solid #ddd;
    border-top: none;
    padding: 0;
    background-color: white;
    height: 250px;
    overflow: auto;
    list-style: none;
}

div.landingPageColumn ul li ul.datalistScroll li {
    padding: 2px;
    background-color: white;
    border-top: 1px solid #ddd;
}

div.landingPageColumn ul li ul.datalistScroll li:hover,
div.landingPageColumn ul li ul.datalistScroll li:focus {
    background-color: #ffffcc;
}

div.datalist table thead tr th,
div.datalistScroll table thead tr th {
    background-color: #aaa;
    color: #fff;
}

.emptylist {
    margin: 6px 0 0 1.4em;
    background-color: white;
    border: 1px solid #ddd;
    padding: 12px;
}

div.landingPageColumn ul li ul.subcaret {
    margin: 0.4em 0em 0.4em 1.4em;
    padding: 0;
    list-style-type: none;
    border: 1px solid #ddd;
    border-top: none;
}

div.landingPageColumn ul li ul.subcaret li {
    margin: 0;
    padding: 2px 1px 2px 2px;
    list-style-type: none;
    background: white;
    border-top: 1px solid #ddd;
    font-weight: normal;
}
div.landingPageColumn ul li ul.subcaret li.complete {
    padding: 2px 1px 2px 20px;
}

div.landingPageColumn ul li ul.subcaret li.inprogress {
    padding: 2px 1px 2px 20px;
}

.iconLegendLabel {
    margin: 1px 0 1px 1.6em;
    font-size: 95%;
}

div.landingPageColumn ul li ul.subcaret li a,
div.landingPageColumn ul li ul.datalist li a,
div.landingPageColumn ul li div a,
div.landingPageColumn ul li table a,
div.landingPageColumn ul li p a {
    text-decoration: underline;
}

/* @end LANDING*/

/* @group BUTTONS (shared) */

.genericButton, 
.genericButtonImg,
.browse, 
.browseIcon,
input[type="submit"].submit,
.rumble a, 
.rumble_top a,
.paging a,
.itemHeaderControl a,
.actionMenuButton,
/*---*/
.button-1, .button-1-img,
.button-2, .button-2-img,
.button-3, .button-3-img,
.button-4, .button-4-img,
.paletteSearch .button-4,
h3#cs_search + ul div.none:first-child .button-4,
.treeContainer .tree li a.button-4-img, .inlineContextMenu a.browse {
    padding: 6px 16px 7px;
    text-decoration: none;
    vertical-align: middle;
}

.mainButton h2,
.secondaryButton h2 {
    margin: 0;
    font-size: 100%;
}

.sub a img,
.sub .button-1 img,
.sub .button-2 img,
.secondaryButton a img,
.secondaryButton .button-2 img {
    margin: -2px -4px 0 0px;
}

.mainButton a,
.secondaryButton a,
.actionBar .button-1,
.actionBar .button-2 {
    display: block;
}


#primaryActionBrand,
#secondaryActionBrand
/*/branding*/
{
    color: #E9E9E9;
    background: #555;
}

.mainButton > a,
.secondaryButton > a,
.mainButton h2 > a,
.secondaryButton h2 > a {
    color: #E9E9E9;
    display: block;
    padding: 12px 18px 13px;
    text-decoration: none;
    text-shadow: 0 -1px 0 #000000;
    font-size: 105%;
    background: -moz-linear-gradient(center top, #777 0%, #555 100%);
    background: -webkit-gradient( linear, center top, right bottom, color-stop (0%, #777), color-stop (100%, #555));
    background: -webkit-linear-gradient(top, #777 0%, #555 100%);
    background: linear-gradient(center top, #777 0%, #555 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#777777, endColorstr=#555555";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#777777, endColorstr=#555555);
}

.mainButton > a,
.mainButton h2 > a {
    border-right: 1px solid #595959;
    border-left: 1px solid transparent;
}

.secondaryButton > a,
.secondaryButton h2 > a {
    border-left: 1px solid #595959;
    border-right: 1px solid transparent;
    margin: 0;
}

.mainButton.sub a,
.secondaryButton.sub a {
    padding-right: 12px;
}

.mainButton > a {
    font-weight: 600;
}

.containerOptions input.genericButton,
.containerOptions input[type="submit"].genericButton,
.containerOptions input.button-1,
.containerOptions input.button-2,
.containerOptions input.button-3,
.containerOptions input.button-4,
.containerOptions .browse,
.containerOptions input[type="submit"].button-1,
input[type="text"] + input[type="submit"],
input[type="text"] + input[type="submit"].submit,
input[type="button"].genericButton {
    padding: 3px 8px 2px;
}

.genericButtonImg {
    display: inline-block!important;
}

input[type="submit"].genericButton,
.button-3 {
    font-weight: bold;
}

.searchbar input[type="submit"].genericButton {
    font-weight: normal;
}

#editGradeActionList.u_reverseAlign a.genericButton {
    display: inline-block;
    margin-bottom: 5px;
}

.contextArrow.button-4-img:hover,
.contextArrow.button-4-img:focus {
    box-shadow: none;
}

.paletteSearch .button-4:hover,
.paletteSearch .button-4:focus {
    background-image: none!important;
}

/* Button-5 */

.button-5,
.button-5-img {
    display: inline-block;
    border: 1px solid #ccc;
    background: white;
    padding: 0 0.4em 2px;
    text-decoration: none;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.button-5:hover,
.button-5-img:hover {
    background: #ededed;
    color: black;
}

/* Button-6 */

.button-6 {
    text-decoration: none;
}

/* @group DISABLED
----------------------------------------------- */

a.disabled,
a.disabled:hover,
a.disabled:focus,
.disabled:not(input),
.disabled:not(input):hover,
.disabled:not(input):focus,
input.button-3.disabled,
input.button-3.disabled:hover,
input.button-3.disabled:focus {
    opacity: 0.6;
    filter: alpha(opacity=60);
    border-color: #ccc;
    background-color: #ededed;
    cursor: not-allowed;
    box-shadow: none;
    background-image: none;
    color: inherit;
}

.mainButton a.disabled,
.mainButton a.disabled:hover,
.secondaryButton a.disabled:hover,
.mainButton a.disabled:focus,
.secondaryButton a.disabled:focus {
    background: transparent;
    color: #ccc;
    cursor: not-allowed;
}

/* @end DISABLED*/


/* @group LIST ACTION BUTTONS
----------------------------------------------- */

/*List action buttons*/

.rumble a,
.rumble_top a {
    display: block;
}

.rumble .sub a img,
.rumble_top .sub a img {
    margin: -2px -1px 0 3px;
}

.paging a,
.rumble_top .inventory_paging .gotolink,
.rumble .inventory_paging .gotolink {
    display: inline-block;
}


/*Select All/None controls for inventory actions*/

.listItemSelect {
    background: transparent;
    color: #555;
    margin: 0;
}

#threadArea .listItemSelect {
    margin: 0;
}

.rumble_top .listItemSelect {
    padding: 0 0 3px 32px;
    margin: 0 0 4px;
}

.rumble .listItemSelect {
    padding: 3px 0 0 32px;
    margin: 4px 0 0;
}

.rumble .listItemSelect a,
.rumble_top .listItemSelect a {
    display: inline;
    margin: 0;
    border: none;
    padding: 0 3px 2px;
    background: none;
    text-decoration: underline;
}

.rumble .listItemSelect a:hover,
.rumble_top .listItemSelect a:hover {
    text-decoration: none;
}

.listItemSelect label {
    display: inline;
    border-left: 1px dotted #999;
    padding: 0 6px;
}

.listItemSelect select {
    font-size: 95%;
}

/*Calculator buttons*/

input.calcButton {
    width: 2em;
    display: inline-block;
    margin: 2px 0;
}


/*Special file actions*/

input#width,
input#height,
select#border,
select#controls,
.smallControls input[type="text"].width,
.smallControls input[type="text"].height {
    width: 5em;
}

.smallControls select.quality,
.smallControls select.controls,
.smallControls select.border {
    width: auto;
}

/* @group ACTION BAR MICRO (COURSE MENU) CONTROLS */

/* Palette action bar buttons */

.actionBarMicro .mainButton > a,
.actionBarMicro .secondaryButton > a {
    padding: 8px 7px;
    padding: 6px;
    line-height: 1;
}

.actionBarMicro .mainButton a img,
.actionBarMicro .secondaryButton a img {
    margin: 0;
}

.actionBarMicro a span img,
.actionBar a span img {
    visibility: hidden;
}

.actionBarMicro a span,
.actionBar a span {
    height: 16px;
    width: 16px;
    overflow: hidden;
    line-height: 0;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: bottom;
}

.actionBarMicro #quickViewLink a span,
.actionBarMicro #shortcutView a span {
    background-position: 0 0;
}

.actionBarMicro #quickViewLink a:hover span,
.actionBarMicro #quickViewLink.active a span,
.actionBarMicro #shortcutView a:hover span,
.actionBarMicro #shortcutView.active a span {
    background-position: 0 -16px;
}

.actionBarMicro #addCmItem > a span {
    background-position: -16px 0;
}

.actionBarMicro #collapseAllLink ul li a {
    width: 90px
}

.actionBarMicro #addCmItem:hover > a span,
.actionBarMicro #addCmItem.active > a span {
    background-position: -16px -16px;
}

.actionBarMicro #expandAllLink a span,
.actionBarMicro #collapseAllLink a span,
.actionBarMicro #folderView a span {
    background-position: -32px 0;
}

.actionBarMicro #expandAllLink a:hover span,
.actionBarMicro #collapseAllLink a:hover span,
.actionBarMicro #expandAllLink.active a span,
.actionBarMicro #collapseAllLink.active a span,
.actionBarMicro #folderView a:hover span,
.actionBarMicro #folderView.active a span {
    background-position: -32px -16px;
}

.actionBarMicro #courseMapButton a span {
    background-position: -192px 0;
}


.actionBarMicro #courseMapButton a:hover span,
.actionBarMicro #courseMapButton.active a span {
    background-position: -192px -16px;
}

/*Expand All button*/

.actionBarMicro #expandAllLink a span {
    background-position: -208px 0;
}

.actionBarMicro #expandAllLink a:hover span,
.actionBarMicro #expandAllLink.active a span {
    background-position: -208px -16px;
}

/*Collapse All button*/

.actionBarMicro #collapseAllLink a span {
    background-position: -224px 0;
}

.actionBarMicro #collapseAllLink a:hover span,
.actionBarMicro #collapseAllLink.active a span {
    background-position: -224px -16px;
}

.actionBarMicro #refreshMenuLink a span,
.actionBarMicro #refreshView a span {
    background-position: -64px 0;
}

.actionBarMicro #refreshMenuLink a:hover span,
.actionBarMicro #refreshMenuLink.active a span,
.actionBarMicro #refreshView a:hover span,
.actionBarMicro #refreshView.active a span {
    background-position: -64px -16px;
}

a.access-reorder span {
    background-position: -80px 0;
}

a.access-reorder:hover span,
a.access-reorder.active span {
    background-position: -80px -16px;
}

.actionBar .sub a .chevron {
    background-position: -95px 0;
}

.actionBar .sub:hover a .chevron,
.actionBar .sub a:focus .chevron {
    background-position: -95px -16px;
}

.actionBarMicro .active > a,
.actionBarMicro .active > a:hover,
.actionBarMicro .active > a:focus {
      position: relative;
}

.actionBarMicro ul:hover + ul .active a:after {
    display: none;
}


/* Modified actionBarMicro. Extending the class to work with new Column markup. */

.actionBarMicro.columnActions {
    margin: 0 0 3px;
    padding: 3px 0;
    background: transparent;
}

/* @end ACTION BAR MICRO */

.alignPanel li.sub {
    padding: 0;
}

.alignPanel li.sub a.button-4:after {
    content: none;
}

.columnActions ul {
    margin: 0 0 2px;
}

.columnActions .mainButton a {
    padding: 1px 4px;
    text-decoration: none;
}

.columnActions .mainButton a:hover {
    padding: 1px 4px;
    text-decoration: none;
}

/* On/Off toggle switch. Located in:
 *    -My Blackboard Settings
 */

.onOffToggleWrap {
    font-size: 90%;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
    border-right: 1px dotted transparent;
    min-width: 57px;
}

/* End On/Off toggle switch */

/* @group MODE SWITCHES */

/* Mode switch control. Located in:
 *     - orientation bar,
 *    - above VTBE applet.
 */

.modeSwitchWrap {
    font-size: 90%;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
    border-right: 1px dotted transparent;
}

.modeSwitch {
    text-transform: uppercase;
    text-decoration: none;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    border-radius: 16px;
    background: #ccc;
    padding: 0 9px 0 6px;
    text-decoration: none;
    text-transform: uppercase;
    -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
    box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}

.modeSwitch:before {
    content: "\2022";
    font-size: 22px;
    line-height: 0.9;
    color: #bbb;
    left: 0;
    top: 0;
    vertical-align: middle;
    margin-right: 3px;
    font-weight: normal;
    position: relative;
    top: -2px;
    margin-right: 2px;
    font-effect: outline;
}


.read-on {
    margin-right: 0px;
    background-color: #777;
}

.read-on:hover {
    background: #555;
}

.read-on {
    color: #fff;
}

.read-on:before {
    color: lime;
}

.read-on.disabled:before, 
.read-on.disabled {
    color: #999;
}

.read-off:before, .read-off {
    color: #999;
}

.modeSwitch.read-off {
    /*text-decoration: line-through;*/
}

a.read-off img {
    display: none;
}

a.read-on img {
    display: none;
}


/*IE9 fix*/

a.read-on .hideoff,
a.read-off .hideoff {
    position: relative\9;
    /*IE all*/
    width: 0\9;
    height: 0\9;
}


/* /IE9 fix*/

.modeSwitch span {
    display: inline-block;
    vertical-align: middle;
}

.switcherLabel {
    color: #666;
    padding: 2px 4px 2px 0!important;
    font-weight: normal;
}

/*VTBE on/off switch*/

.vtbeSwitch {
    top: 2px;
}

.vtbeSwitch span {
    padding: 0;
    display: inline-block;
    font-size: 100%!important;
}

.legacy .vtbeSwitch {
    height: 2.2em;
}

.vtbeSwitch div.modeSwitchWrap {
    right: 0;
    top: 2px;
    background-color: #eeeeee;
    border: 1px solid #CCCCCC;
    border-bottom: 0;
    padding: 6px 12px;
}

.vtbeSwitch div.modeSwitchWrap a span#statusText {
    padding: 0 9px!important;
}

.vtbeSwitch div.modeSwitchWrap a.read-off {
    background-color: #ddd;
}

.vtbeSwitch div.modeSwitchWrap a.read-off:hover {
    background-color: #fff;
}

.vtbeSwitch div.modeSwitchWrap a.read-off:hover span#statusText {
    color: #000;
}

table.vtbeTable-legacy {
    width: 100%;
}

.vtbeTable-legacy textarea {
    width: 100%;
    *width: 99%;
}

/*end VTBE on/off switch*/

/* @group HELP LINK */

.helpLink {
    border: 0;
    margin: 0;
    display: inline-block;
    vertical-align: middle;
}

.helpLink a.browseIcon {
    padding: 0;
    display: inline-block;
    background: #777;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#777777, endColorstr=#777777);
    padding: 1px 6px;
    border-radius: 12px;
    border: 0;
    position: relative;
    padding: 1px 1px 0;
    border-radius: 12px;
    font-size: 115%;
    box-shadow: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    text-align: center;
}

#helpTextToggleLink {
    display: none;
}

.helpLink a.browseIcon img {
    display: none;
}

.helpLink a.browseIcon:before {
    content: "?";
    color: #FFF;
    display: inline-block;
    z-index: 1;
    height: 18px;
    width: 18px;
    position: relative;
    font-weight: bold;
    right: -4px\9;
}

.helpLink a.browseIcon:hover,
.helpLink a.browseIcon:focus {
    box-shadow: none;
}

.helpLink a[title*="Off"].browseIcon:hover {
    background: #bbb;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#bbbbbb, endColorstr=#bbbbbb);
}

.helpLink a[title*="Off"], 
.helpLink a[title*="Off"]:hover, 
.helpLink a[title*="Off"]:focus {
    /*text-decoration: line-through!important;*/
    background: none repeat scroll 0 0 #CCCCCC;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#cccccc);
    color: #999;
}

.helpLink a[title*="Off"]:before, 
.helpLink a[title*="Off"]:hover:before, 
.helpLink a[title*="Off"]:focus:before {
    color: #999;
    /*text-decoration: line-through;*/
}

.reorder {
    top: 0px;
    left: 0px;
    bottom: 0;
    height: auto;
    width: 18px;
    opacity: 0;
    /*invisible by default*/
    filter: alpha(opacity=0);
    /*invisible by default*/
    border: 0;
    z-index: 2;
}

table.reorder {
    opacity: 1;
}

.reorder span {
    display: inline-block;
    height: 20px;
}

table.reorder span {
    height: auto;
}

.item .reorder {
    top: 0px;
    left: 0px;
    bottom: 0;
    height: auto;
    width: 18px;
    opacity: 0;
    /*invisible by default*/
    filter: alpha(opacity=0);
    /*invisible by default*/
    border: 0;
    z-index: 2;
}

/*Course menu reorder handles.*/

.listCm .reorder,
.subList-reorder .reorder,
.buttonCm .reorder {
    width: 16px;
}

.portlet .reorder span {
    background-position: -237px -116px;
    height: 24px;
    display: block\9;
}


/* Portal module reorder handle.*/

.portlet .reorder {
    border: 1px solid #555;
    border-width: 1px 0 1px 1px;
    bottom: -1px;
    left: -19px;
    opacity: 0;
    position: absolute;
    top: -1px;
    -moz-border-radius: 3px 0 0 3px;
    -webkit-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
}

.portlet.module-dragstate .reorder {
    border-width: 2px 0 2px 2px;
    left: -20px;
    top: -2px;
    bottom: -2px;
}

.reorder img {
    opacity: 0;
    filter: alpha(opacity=0);
}

.item .reorder img {
    margin: 6px 3px
}

.portlet .reorder img {
    width: 18px;
    height: 20px;
}

/*Behavior - seeting opacity to 1 on hover*/

.liItem:hover .reorder,
.liItem:focus .reorder,
.buildList li:hover .reorder,
.listCm li:hover .reorder,
.buttonCm li:hover .reorder,
.portlet h2:hover .reorder,
.contentListPlain li:hover .contextMenuContainer a,
.buildList li:hover .contextMenuContainer a,
.liItem:hover .contextMenuContainer a,
.liItem:hover .reorder,
.contentList > li:hover .contextMenuContainer a {
    opacity: 1;
    filter: alpha(opacity=100);
}

/* @end REORDER HANDLE*/

/* @group CONTEXTUAL MENU CONTROL */

/* Default contextual menu link (large). */

a.cmimg {
    background: transparent url(images/controls.png) no-repeat scroll -320px -125px;
    margin: 0;
    width: 16px;
    height: 16px;
    display: inline-block;
}

a.cmimg.cmMore {
    background: none;
}

table.inventory a.cmimg {
    opacity: 0;
    filter: alpha(opacity=0);
}

table.inventory tr:hover a.cmimg,
table.inventory tr a.cmimg:focus {
    opacity: 1;
    filter: alpha(opacity=100);
}

a.cmimg:hover,
a.cmimg:focus {
    background-position: -320px -143px;
}

a.cmimg img {
    width: 15px;
    height: 15px;
}

.listCm .courseMenu a.cmimg,
.buttonCm .courseMenu a.cmimg,
.portlet a.cmimg,
a.cmimg-small {
    position: absolute;
    right: 6px;
    _right: 0px;
    top: 7px;
    margin: 0;
    padding: 0;
    background-image: url(images/controls.png);
    background-repeat: no-repeat;
    background-position: -28px -124px;
    opacity: 0.7;
    filter: alpha(opacity=70);
    display: inline-block;
    height: 15px;
    overflow: hidden;
}


.listCm .courseMenu a.cmimg:hover,
.portlet a.cmimg:hover,
.listCm .courseMenu a.cmimg:focus,
.portlet a.cmimg:focus,
.buttonCm .courseMenu a.cmimg:hover,
.buttonCm .courseMenu a.cmimg:focus,
/*@since 9.1*/
.cmimg-small:focus,
.cmimg-small:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    background: transparent url(images/controls.png) no-repeat -28px -142px;
    zoom: 1;
}

.courseMenu .subhead a.cmimg {
    top: 9px;
}

/*Contextual menu control in the button version af the course menu*/

.buttonCm .courseMenu .subhead .cmimg {
    top: 2px;
}

.buttonCm .subhead h3 {
    padding: 6px 0 6px 30px;
    margin: 0 18px 0 0;
}

.portlet a.cmimg {
    position: relative;
    right: 0;
    top: 2px;
    *position: static;
}

.listCm .courseMenu a.cmimg img,
.portlet a.cmimg img {
    width: 15px;
    height: 15px;
    opacity: 0;
    filter: alpha(opacity=0);
}

/* Theme-specific behavior*/

.buildList li .contextMenuContainer a,
.item .contextMenuContainer a,
.listCm .courseMenu a.cmimg {
    opacity: 0;
    filter: alpha(opacity=0);
    padding: 0;
    vertical-align: baseline;
}

.buildList li .contextMenuContainer a:focus,
.item .contextMenuContainer a:focus {
    opacity: 1;
    filter: alpha(opacity=100);
}

.listCm .courseMenu li:hover a.cmimg {
    opacity: 1;
    filter: alpha(opacity=100);
}

/* @end CONTEXTUAL MENU CONTROL*/

/* @group CLOSE CONTROL */

a.close,
a.close-menu,
.external-breadcrumbs .breadcrumbs a.close {
    position: absolute;
    top: 11px;
    right: 10px;
    opacity: 0.7;
    filter: alpha(opacity=70);
    z-index: 100;
}

.external-breadcrumbs .breadcrumbs a.close {
    top: 13px;
    right: 10px;
}

a.close {
    top: 0;
    right: 20px;
}

a.close img,
a.close-menu img {
    height: 1px;
    left: -10000px;
    overflow: hidden;
    position: absolute;
    top: -1000px;
    width: 1px;
}

a.close:before {
    content: "X";
    font: 18px/1 "Utilicons";
    color: #aaa;
}

span.close-contextmenu:before {
    content: attr(data-icon);
    font: 14px/1 "Utilicons";
    color: #aaa;
}

a.close-menu:hover span.close-contextmenu:before {
    color: #888;
}

a.close-menu:before {
    font-size: 14px;
}

a.close:hover:before,
a.close-menu:hover:before {
    color: #888;
}

.liveArea a.close {
    right: 6px;
    top: 6px;
}

/* @end CLOSE CONTROL*/

/* @group TITLE COLOR SELECTOR */


/* Color chip: indicates color and opens color picker */

a.colorChip {
    padding: 1px 0 1px 2px;
    display: inline-block;
}

.pageTitle a.colorChip {
    padding: 4px 0 4px 7px;
    vertical-align: top;
}

a.colorChip span {
    display: inline-block;
    padding: 2px;
    background: url(images/controls.png) no-repeat -320px -123px;
    vertical-align: middle;
}

a.colorChip:hover span {
    background-position: -320px -141px
}

a.colorChip span img {
    width: 16px;
    height: 16px;
    opacity: 0;
    filter: alpha(opacity=0);
}


/*Color placeholder*/

a.colorChip img.chipSwatch {
    border: 1px solid #ccc;
    border-bottom: 1px solid #aaa;
    border-right: 1px solid #aaa;
    width: 16px;
    height: 16px;
}

span.colorChipName {
    display: inline-block!important;
    vertical-align: middle;
    padding: 0!important;
}

.smallControls input[type="text"],
.smallControls select {
    padding: 0!important;
    width: 100%;
}

.courseMenu input,
.courseMenu input[type="text"],
.renameCourseToc input {
    margin-left: 18px;
    width: 120px;
}

.renameCourseToc input {
    margin-left: 0
}

/*Calculator module*/

#calculatorValue {
    width: 10em;
    margin: 3px 0;
}

/*Course menu inline controls*/

a.microControl {
    border: 0;
    margin: 0;
    padding: 0;
    float: none;
    display: inline;
}

a.microControl img {
    width: 12px;
    height: 12px;
}

/* @group BACK LINK */


/* Backlink is used on pages that need to display an "ok" button.*/

.backLink {
    position: absolute;
    bottom: 0px;
    right: 0px;
    margin: 0;
}

/* backlink by itself puts the button way too far down and out of the content area on some pages - closeToContentBackLink*/

.closeToContentBackLink {
    margin-top: 10px;
    margin-right: 20px;
    bottom: auto;
}

.tocBottom_min .backLink {
    bottom: 48px
}

.tocBottom_max .backLink {
    bottom: 348px
}

.tocBottom_open .backLink {
    bottom: 178px
}

.shortDoc .backLink {
    position: relative;
    bottom: 0px;
    right: 0px;
    text-align: left;
    margin-top: 15px;
}

.backLink a:before {
    content: "\2190";
    /*left arrow*/
    font-size: 120%;
    line-height: 1.2;
    color: #999;
}

.backLink a:hover {
    background: #ddd;
    color: #333;
}

.backLink a:hover:before {
    color: #00add0
}

/* @end BACK LINK */

/* @group SLIDER (used with item gallery) */

.sliderWrapper {
    /* float:left;*/
    padding: 7px 13px 7px 0;
    font-size: 85%;
    background: #fff;
    position: relative;
    border-bottom: 1px solid #ddd;
    display: inline-block;
}

#sliderHandle {
    background: #999999;
    border: 1px solid #555555;
    cursor: ew-resize;
    display: block;
    height: 4px;
    margin: -2px 0 0;
    width: 4px;
}

#sliderTrack {
    background: #EDEDED;
    border: 1px solid #CCCCCC;
    display: inline-block;
    height: 2px;
    margin: 0 0 0 6px;
    width: 60px;
    position: relative;
    top: -2px;
}

/* @end SLIDER */

/* @group COUNTER */

.itemCounter {
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #cdcdcd;
    padding: 1px 4px;
    font-size: 115%;
    text-align: center;
    border: 1px solid #bbb;
}

/* @end COUNTER*/

/* @end CONTROLS*/

/* @group PAGE HEADER */

/*@branding -- do not remove*/

#pageHeader,
/*Regular selectors*/
.pageTitle,
.pageTitleSmall {
    margin: 0;
    padding: 4px 20px 4px 10px;
}

/* Content Area title*/

#pageHeader,
#schemePreviewHead,
/*/branding*/
.pageTitle h1,
.pageTitleError h1 {
    padding: 0;
    margin: 0;
    line-height: 1;
    color: #000000;
}


.picker .pageTitle h1,
.popup .pageTitle h1 {
    font-size: 160%
}

.pageTitle #titleicon,
.pageTitle h1,
.pageTitle a.cmimg {
    display: inline-block;
}

.pageTitle h1 + .contextMenuContainer {
    margin-left: 2px;
    position: relative;
    top: 2px;
    vertical-align: top;
}

.pageTitle a.cmimg {
    margin: 0;
}

.pageTitle #titleicon {
    margin: 0 6px 0 0;
    display: none;
}

.pageTitle #titleicon[src*="slideshare"] {
    background: #FFFFFF;
    border-color: #DEDEDE;
    border-radius: 0;
    border-style: solid;
    border-width: 0 0 1px 1px;
    display: block;
    height: 39px;
    padding: 4px 12px;
    position: absolute;
    right: 7px;
    top: 1px;
    width: auto;
}

.pageTitle #titleicon[src*="youtube"] {
    display: block;
    height: 44px;
    position: absolute;
    right: 14px;
    top: 8px;
    width: auto;
}

.pageTitleSmall h1 {
    padding: 0;
    font-size: 135%;
    margin: 0;
    color: #fff;
}

/* Picker header mods */

.picker .pageTitle,
.popup .pageTitle {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    padding: 18px 18px 16px;
}

/*@branding -- do not remove*/
#pageHeader,
#schemePreviewHead {
    background-color: #dedede;
}

.pageTitleIcon {
    display: table-row
}

.pageTitle .details {
    display: none
}

.pageTitle .contextMenuContainer,
.pageTitle .titleButtons,
.pageTitleEdit {
    display: inline-block!important
}

#pageTitleBar {
    margin-right: 6px;
    display: inline-block;
}

.pageTitle h2 {
    clear: both;
    margin: 0;
    font-size: 100%;
    color: #333;
}

.pageTitle h2 span {
    font-weight: normal
}

.contextString,
.pageTitle .label {
    color: #777;
    font-weight: normal;
}

.customBanner,
.currentBannerWrapper {
    overflow: hidden;
    text-align: center;
    margin: 0;
    background-color: transparent;
}

/*Lightbox header*/

div#lightboxContent h2 {
    font-size: 130%;
    margin: 0;
    padding: 18px 24px 0;
    position: relative;
}

.mapTabs + .helphelp,
.mapTabs ~ .helphelp {
    border-top: 1px solid #bbb;
    margin: 0 -30px -20px;
    padding: 12px 30px 16px;
    background: #eaeaea;
}

.helphelp a {
    text-decoration: none;
    border-bottom: 1px dotted;
    color: #444;
}

.helphelp a:hover {
    border-style: solid;
}

div.helphelp ul {
    margin: 6px 0;
}

/* @group INSTALLATION DETAILS (ADMIN PANEL)
----------------------------------------------- */

.version {
    font-size: 60%;
    color: #666;
    font-weight: 400;
    margin-top: 6px;
    display: inline-block;
}

.version i {
    font-style: normal;
    font-weight: bold;
}

.version span {
    display: inline-block;
    position: relative;
    width: 28px;
    overflow: hidden;
    top: 0;
    left: -7px;
    color: #999;
    font-weight: 100;
    text-align: right;
}

.version span:before {
    content: "+";
    font-size: 105%;
    color: #00add0;
    font-weight: bold;
    position: relative;
    top: -2px;
    left: 0;
    width: 20px;
    display: inline-block;
    text-align: left;
}

.colophon {
    float: right;
    width: 30em;
    background: transparent;
    font-size: 85%;
    overflow: visible;
    position: relative;
    right: 0;
    margin: 0 0 0 14px;
    padding: 0 0 3px 55px;
}

.colophon img {
    position: absolute;
    left: 0;
}


.installation {
    color: #666 !important;
    line-height: 1.3em;
}

.installation span.label {
    font-weight: bold
}

.actionBar ul li {
    position: relative
}

.actionBar ul li.mainButton {
    z-index: 210
}

.actionBar ul li.secondaryButton {
    z-index: 209
}


.actionBar .mainButton {
    float: left;
    margin: 0;
    padding: 0;
}

.actionBar .secondaryButton {
    float: right;
    margin: 0;
}

.actionMenu {
    z-index: 111;
    position: relative;
}

.actionMenuItem {
    z-index: 123;
    position: relative;
}

.csMenuFrame .actionBarMicro,
.popupMenu .actionBarMicro {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.portlet .actionBarMicro {
    padding: 4px;
    margin: 0;
}

.portlet .actionBarMicro ul {
    margin: 2px
}

.actionBarMicro ul li {
    padding: 0;
    position: relative;
    float: left;
    margin: 0;
}

.actionBarMicro .mainButton {
    z-index: 1000
}

.actionBarMicro .secondaryButton {
    z-index: 10;
}

ul.nav.clearfix.u_floatThis-right:after,
#courseMenuPalette_actionbar:after {
    display: none;
}

/* @group SEARCHBAR
----------------------------------------------- */

/*Permananetly displayed searchbar (has no action bar based button to show/hide it).*/

.searchbar,
.searchbarPicker {
    position: relative
}

.searchbar.searchbarCanvas {
    background: none repeat scroll 0 0 #DFDFDF;
    display: block;
    margin: -24px -30px 20px;
    padding: 0 20px;
    text-align: right;
}

.picker .searchbar.searchbarCanvas {
    margin: -24px -20px 20px
}

.picker .leftColumn-narrow h2,
.picker .leftColumn-wide h2 {
    font-size: 110%;
    margin: 1em 0 9px;
}

#bb-question-discover .searchbar.searchbarCanvas fieldset h2 {
    display: inline-block;
    font-size: 100%;
    font-weight: normal;
}

.searchbar table td,
.searchbar table td table td {
    padding: 1px
}

.searchbar table fieldset {
    padding: 3px 4px
}

.searchbar table div {
    display: inline-block;
    padding: 0;
}

.searchbar form {
    padding: 0;
    margin: 0;
}

.searchbarPicker {
    border: none;
    font-size: 90%;
}

.searchbar:after,
.searchbarPicker:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.receipt a.close {
    top: 1px;
    right: 4px;
    opacity: 0.7;
    filter: alpha(opacity=70);
}

.slideshowControls {
    font-size: 100%;
    margin: 8px auto 12px auto;
    text-align: center;
}

.searchbar fieldset,
.searchbarPicker fieldset {
    padding: 6px 9px 6px 9px
}

.searchbar h2,
.searchbarPicker h2 {
    margin: 0;
    padding: 1px 6px;
    font-size: 110%;
    font-weight: bold;
}

.picker .searchbar h2,
.searchbarPicker h2 {
    display: inline;
    font-size: 100%;
    font-weight: normal;
}

.searchbar .groupLabel,
.searchbarPicker .groupLabel,
.liveArea fieldset .groupLabel, .groupLabel label {
    font-weight: bold;
    padding: 2px 6px 0 0;
}

.searchbar ol li,
.searchbarPicker ol li,
.liveArea fieldset ol li {
    float: left;
    margin: 5px;
}

.searchbar ol li > div {
    display: inline-block;
}

.searchbar ol li.options,
.searchbarPicker ol li.options,
.liveArea fieldset ol li.options {
    float: right;
}

.searchbarPicker span {
    display: inline;
}

.searchbar .spacer {
    margin: 0 4px;
    font-size: 70%;
}

.searchbar .u_floatThis-left {
    margin: 0 4px 4px;
}

.searchbar select {
    padding: 2px 0;
    padding: 0 \9;
}

.filterGroup select {
    width: 100%;
    max-width: 200px;
}

.filterGroup p {
    margin: 2px 0 -18px;
}

.filterGroupLabel {
    padding: 0 4px;
}

/* @end SEARCHBAR*/

/*Course menu image*/

.cmImg {
    overflow: hidden;
    text-align: center;
    margin: 0px 0px 6px 12px;
    width: 180px;
}

.cmImg img {
    width: 180px
}

/*Course menu palette preview wrapper to contstrain width.*/

.cmPreviewWrapper {
    width: 212px;
}

.navPalette {
    margin: 0 0 6px;
    padding: 0;
    zoom: 1;
}

/* Content System menu alette */
.csMenuFrame .navPalette {
    margin: 0 0 18px 0;
}

/* Palette header */

.navPalette h3 {
    padding: 0;
    margin: 0;
    font-size: 105%;
    position: relative;
}

.navPaletteTitle {
    position: relative
}

.navPaletteTitle h3 + h3 {
    position: absolute;
    top: 0;
    right: 0;
}

.navPaletteCol h3 {
    border-bottom: 0;
}


/* Palette category head */

.navPalette h4 {
    margin: 0;
    font-size: 100%;
}

.navPaletteContent ul li {
    zoom: 1;
    position: relative;
    *height: 1%;
}

.navPaletteContent {
    margin-bottom: 0px;
    padding: 0;
}

.listCm .navPaletteContent,
.singleControl .navPaletteContent,
.tools .navPaletteContent {
    border-bottom: 0;
    padding-bottom: 9px;
    padding-top: 6px;
}

#courseMenuPalette div.navPaletteContent {
    padding-top: 14px;
    padding-bottom: 14px;
}

#courseMenuPalette {
    margin-bottom: 0;
}

.singleControl .navPaletteContent {
    padding: 0px !important
}

.singleControl,
.navPalette .discover {
    margin: 24px 0 0 0;
    padding: 0;
    zoom: 1;
    z-index: 110;
}

/*Palette content area links*/

.navPaletteContent a {
    margin: 0;
    padding: 3px 9px 3px 24px;
    font-weight: normal;
    text-decoration: none;
    display: block;
    word-break: normal;
    overflow-x: hidden;
}

.navPaletteContent a:hover, 
.navPaletteContent a:focus {
    cursor: pointer;
}

/* Combo link is used together with submenu link.*/

.navPaletteContent a.comboLink,
.navPaletteContent a.comboLink_active {
    padding: 6px 20px 6px 30px;
    margin: 0;
}

/* comboLink open state.*/

.navPaletteContent a.comboLink_active,
.navPaletteContent a.open {
    color: #333;
    border-bottom: 0;
}

/* Submenu Link*/

.navPaletteContent a.submenuLink,
.navPaletteContent a.submenuLink_active {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0;
    zoom: 1;
    z-index: 2;
}

.navPaletteContent a.submenuLink:hover,
.navPaletteContent a.submenuLink_active:hover,
.navPaletteContent a.submenuLink:focus,
.navPaletteContent a.submenuLink_active:focus {
    background-position: center 7px;
}

.navPaletteContent a.submenuLink img,
.navPaletteContent a.submenuLink_active img {
    width: 14px;
    height: 14px;
    opacity: 0;
    filter: alpha(opacity=0);
}

.navPaletteContent ul li:first-child h4 a,
.navPaletteContent ul li:first-child a {
    border-top: none;
}

.navPaletteContent ul li h4 a {
    padding: 6px 9px 6px 30px;
    margin: 0;
}

/* Palette links *

 /*Palette header links*/

.navPaletteContent h3 a {
    background: transparent url(images/portlet_contract_alt.gif) no-repeat 8px 6px;
    color: #333;
    font-weight: bold;
    border-top: 0;
    text-shadow: 0px 1px 0px #f9f9f9;
    padding: 6px 9px 6px 30px;
    margin: 0;
    word-wrap: break-word;
}

#previewCourseMenu .navPaletteContent h3 a {
    text-shadow: none;
}

.navPaletteContent h3 a:hover,
.navPaletteContent h3 a:focus {
    text-decoration: none;
}

/* Control palette links*/

.controlpanel a.submenuLink, 
.controlpanel a.submenuLink_active,
.tools a.submenuLink, 
.tools a.submenuLink_active,
.navPaletteContent h3 a.submenuLink, 
.navPaletteContent h3 a.submenuLink_active {
    border: none;
    background-image: none;
    line-height: 1.4;
    text-decoration: none;
    overflow: hidden;
}

.navPaletteContent h3 a.submenuLink,
.navPaletteContent h3 a.submenuLink_active {
    display: inline-block;
}

.controlpanel a.comboLink_active, 
.tools a.comboLink_active, 
.controlpanel h4 a.open, 
.navPaletteContent ul li:first-child h4 a.comboLink_active,
.explore h4 {
    font-weight: bold;
    color: #fff;
    margin-top: -1px;
    -webkit-transition: all 100ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: all 100ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

.controlpanel a.comboLink_active, 
.tools a.comboLink_active, 
.controlpanel h4 a.open {
    position: relative;
    z-index: 1;
}

/*Course Files palette inside the course*/

.courseFilesPalette {
    border: 1px solid red;
}

/*Search Palette/Element*/

.paletteSearch {
    font-size: 95%;
    padding: 6px 0 6px 12px;
}

.classFiles h4#cs_search + ul li:first-child {
    border-bottom: 1px dotted #AAAAAA;
    font-size: 95%;
    margin: 2px 9px 2px 0;
    padding: 0 3px 6px;
}

.classFiles h4#cs_search + ul li {
    background-image: none;
}

.classFiles a#filesPaletteContentCollectionLink {
    display: block;
    padding: 3px 16px 3px 16px;
    background-image: url(images/indicators.png);
    background-position: 98% -143px;
    background-repeat: no-repeat;
    color: #aaa;
}

.navPaletteContent .submenu .paletteSearchElement {
    border-top: 1px dotted #BBBBBB;
    margin: 6px 0 0 -16px;
    padding: 10px 0 9px 12px;
}

.paletteSearchElement input {
    width: 99px;
}

.classFiles ul.tree > li {
    background-image: none !important;
}

/* Links in the reorderable course menu palette section */

/* Reorderable Course Menu in List view. */

.listCm .courseMenu {
    padding: 0;
}

.ineditmode div.listCm ul.courseMenu {
    margin: 0;
}

.ineditmode div.listCm ul.courseMenu li {
    border: 1px solid transparent;
    border-left: 0;
    margin: 0 -1px 0 0;
    background-color: transparent;
}

.ineditmode div.listCm ul.courseMenu li:hover {
    -webkit-transition-property: background, border, -webkit-box-shadow;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: border, margin, background, -moz-box-shadow 500ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    border-left: 0;
    background-clip: padding-box;
}

.listCm .courseMenu li,
.buttonCm li {
    padding: 0;
    margin: 0;
    position: relative;
}

.listCm .courseMenu a,
.buttonCm .courseMenu a {
    margin: 0 18px 0 0;
    padding: 6px 0 6px 30px;
    border: 0;
    background: transparent;
    word-break: normal;
    overflow-x: hidden;
}

.listCm .courseMenu .here a.cmimg,
.listCm .courseMenu .here a.cmimg:hover {
    background-color: transparent;
    padding: 0;
    margin: 0;
}

.listCm h3 {
    padding: 0;
    margin: 0;
    font-size: 100%;
}

.listCm .subhead h3 {
    padding: 6px 0;
    margin: 0 0 0 30px;
}

#courseMenu_folderView h4 a {
    background-image: none;
    font-weight: bold;
    border: 0;
}

#courseMenu_folderView .subhead {
    border: 0
}

/* In case we have a link in an h4 header. */

.navPaletteContent .subhead h3 a,
.navPaletteContent .subhead h3 a:hover {
    padding: 0;
    margin: 0;
    text-decoration: none;
    font-weight: bold;
    background-color: transparent;
}

/* List element containg a menu divider. */

.listCm .courseMenu .divider,
.buttonCm .courseMenu .divider {
    padding: 12px 18px;
    position: relative;
}

.buttonCm .courseMenu .divider {
    background-image: none!important;
}

.noteditmode .listCm .courseMenu .divider,
.noteditmode .listCm .buttonCm .divider {
    padding: 8px 18px;
}

.listCm .courseMenu .divider hr,
.buttonCm .courseMenu .divider hr {
    background-color: #ccc;
    vertical-align: middle;
    margin: 0;
    border-width: 0;
    height: 0px;
    position: relative;
    border-top: 1px solid #999;
}

/*  Collapsed class is dynamically assigned whe course menu is in Read mode.
    element padding is removed.
 */

.listCm .courseMenu .collapsed {
    padding: 0 0 0 14px;
    height: 2px;
}


/* Button version of course menu palette */

.buttonCm .navPaletteContent {
    background: transparent;
}

/* List width is set to accommodate button image width.
  * the width of the button course menu is 176px;
  * the width of the button images are 175px.
  */

.buttonCm li {
    background-color: transparent;
    background-position: 12px 0!important;
    background-repeat: no-repeat;
}


/* --- Additional styling for the current location. --- */

.buttonCm .courseMenu .here a,
.buttonCm .courseMenu .here a:hover {
    text-decoration: underline;
    background-color: transparent;
}

/* Hidden and Empty Link indicators. */

.cmLink-hidden,
.cmLink-empty {
    margin: -2px 0 0 3px;
    vertical-align: middle;
}

.cmLink-hidden img,
.cmLink-empty img {
    width: 14px;
    height: 14px;
    opacity: 0;
    filter: alpha(opacity=0);
}


/*Invisible link indicators for button mode*/

.buttonCm .invisible .cmLink-hidden,
.buttonCm .invisible .cmLink-empty {
    position: absolute;
    right: 26px;
    top: 5px;
}

.buttonCm .invisible .cmLink-empty {
    right: 32px;
}

/*End empty/invisible indicators*/

/* Menu in the picker pop-up. */

.pickerMenu {
    position: absolute;
    top: 0;
    left: 14px;
    width: 150px;
    margin: 0;
}

/* Picker Menu */

.pickerMenu ul li a,
div.pickerMenu a.simpleLink {
    background-image: none;
}

/* @group STANDALONE CONTROL (bottom of the palette)
----------------------------------------------- */


/* Stand-alone control. */

.discover .navPaletteContent,
.singleControl .navPaletteContent {
    background-color: ;
}

.discover a img {
    display: none
}

.navPalette.discover {
    margin-bottom: 0;
}


.singleControl a:hover,
.singleControl a:focus,
.discover a:hover,
.discover a:focus {
    background: #555;
    color: #fff;
    text-decoration: none;
}

.singleControl a.enrolled:before,
.singleControl a.not-enrolled:before,
.discover a:before {
    content: "x";
    font-family: 'Utilicons';
    font-size: 19px;
    color: #EF3B3B;
    font-weight: normal;
    position: relative;
    top: 1px;
    left: -4px;
}

.singleControl a.not-enrolled:before {
    content: "+";
    color: #33cc00;
}

.discover a:before {
    content: "F";
    color: #eee;
}

/* @end STANDALONE CONTROL */

/* @group SUBMENU
----------------------------------------------- */

/*Palete submenus*/

/* Used in:
  *  - controlpanel palette
  *  - tools palette
  *  - explore palette in Outcomes (modified)
  */

.navPaletteContent .submenu {
    padding: 0 6px 12px 30px;
    margin: 0;
    -moz-box-shadow: 0 1px 4px #ccc;
    border-bottom: 1px solid #bbb;
    -webkit-transition: all 150ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: all 150ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
}

.explore .submenu {
    font-size: 90%;
    background: #fff
}

.navPaletteContent .submenu li {
    background-image: none;
    padding: 0;
    border: 0;
}

.navPaletteContent .submenu li ul li {
    padding-left: 12px;
    *height: 1%;
}

.navPaletteContent .submenu li a,
h4#cs_search + ul div a {
    padding: 2px 0;
    margin: 0;
    background: transparent;
    background-image: none;
    border: 0;
    color: #333;
}

h4#cs_search + ul div {
    padding: 0 9px 0 0;
}

h4#cs_search + ul div a {
    font-size: 90%;
    display: block
}

/*Palete submenus*/

.controlpanel .submenu a,
.explore .submenu a {
    padding: 2px 9px 2px 6px;
    margin: 0;
    background: transparent;
    border: 0;
    color: #333;
}

.explore .submenu a {
    padding: 2px 0px 2px 0px;
}

.explore .submenu .emptyMsg {
    color: #777;
}

/* Simple link is used where there is no submenu. Clicking it loads another page. */

.navPalette a.simpleLink,
.controlpanel a.simpleLink {
    padding: 6px 9px 6px 30px;
    background-image: none;
}

/* @end SUBMENU */

/* @group HIEARACHY TREE */

div.treeContainer ul.tree,
ul.tree {
    list-style: none;
    margin: 0px;
    padding: 0px 0 6px 0px;
}

div.treeContainer > ul.tree,
div.treeContainer ul.tree > ul {
    padding: 0
}

div.treeContainer ul.tree ul,
ul.tree ul {
    list-style: none;
    margin: 0;
    padding: 0px 0px 0px 20px;
}

div.listCm div.treeContainer ul.tree {
    overflow-x: auto;
    zoom: 1;
    *position: relative;
    *overflow: hidden;
    *padding: 0 0 18px 0
}

div.treeContainer ul.tree li h4 + ul {
    overflow-x: auto;
    margin: 0;
    padding: 0 0 18px 18px;
    zoom: 1;
    *overflow: hidden;
    font-size: 90%;
}

div.treeContainer ul.tree li,
ul.tree li {
    margin: 0px;
    border: 0;
    padding: 0px;
    background: transparent url(/images/ci/icons/nlstree/line.gif) repeat-y 0 0;
    white-space: nowrap;
}

.sideTOC ul.tree > li {
    overflow-x: visible;
}

div.treeContainer ul.tree li a,
ul.tree li a {
    padding: 2px 1px 2px 0px;
    background: none;
    display: inline;
    border-top: none;
}

div.treeContainer ul.tree li a.open_folder {
    padding: 2px 3px 2px 0px;
    display: inline;
    border-top: none;
    font-size: 95%;
}

div.treeContainer h4.treehead {
    margin: 8px 0 2px 0;
    padding: 0px 0px 0px 5px;
    font-size: 105%;
    font-weight: bold;
    font-size: 95%;
}

div.treeContainer h4.first {
    margin: 0 0 2px 0;
}

div#userTreeDiv {
    background: #fff;
    margin: 0;
    padding: 0px;
}

div.treeContainer ul.tree li.subhead {
    background-image: none;
    margin: 0;
    border-top: 1px dotted #ccc;
}

div.treeContainer ul.tree li.subhead h4 {
    margin: 0;
    padding: 0;
    *font-size: 95%;
}

div.treeContainer ul.tree li.subhead h4.first a {
    border-top: none
}

div.treeContainer ul.tree li a.exp {
    padding: 0px 21px 0px 0px;
}

div.treeContainer ul.tree li a.collapse {
    padding: 0px 21px 0px 0px;
}

/* @end HIERARCHY TREE*/

.inventory > tbody tr td .item-description {
    max-width: 600px;
}

.inventory > tbody tr td .item-description img {
    max-width: 300px;
    height: auto;
}

.sortable a.sortheader {
    position: relative;
    padding-right: 17px;
    margin-right: 0px;
    display: block;
}

/*Sorting arrow indicator*/

.sortable .sortarrow {
    color: #ffff00;
    text-decoration: none;
    right: 0px;
    top: 0;
    left: auto;
}

/* Reordering control styling for the old-type reorderable table. */

.inventory .smallCell .reorder,
.inventory > tbody .reorder,
.attachments .smallCell .reorder,
.attachments tbody .reorder {
    opacity: 0;
    filter: alpha(opacity=0);
    min-height: 30px;
    cursor: move;
    position: static;
    display: inline-block;
    width: 18px;
    z-index: 2;
    background: transparent;
}

.attachments {
    width: 100%;
}

/*Drag and Drop handles*/

.inventory .dndHandle {
    padding: 5px 0;
    position: static;
}

.inventory .dndHandle .reorder img,
.inventory .dndHandle .reorder:hover img {
    height: 20px;
}

.inventory .dndHandle .reorder,
.inventory .dndHandle .reorder:hover {
    padding: 0;
    background-position: -172px -125px;
    border: 0;
}

/* Reorderable table*/

.reorderable > tbody tr:hover {
    -moz-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25), 1px 1px 0 #fff inset;
    -webkit-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25), 1px 1px 0 #fff inset;
}

.reorderable > tbody tr:hover td,
.reorderable > tbody tr:hover th {
    background-color: #f4f4f4;
    border-bottom: 1px solid #aaa;
    border-top: 1px solid #aaa;
    -webkit-transition-property: -webkit-box-shadow, border, background;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: border, margin, background 250ms ease-in;
}

.reorderable tbody tr td:first-child {
    border-left: 1px solid transparent
}

.reorderable tbody tr td:last-child {
    border-right: 1px solid transparent
}

/* Table body styles. */

#drawerItems.inventory tr td,
#drawerItems.inventory tr th,
#bb-question-discover .inventory tr td,
#bb-question-discover .inventory tr th {
    padding: 6px 0 6px 9px
}

.inventory > tbody tr:last-child td,
.inventory > tbody tr:last-child th {
    border-bottom: 2px solid #ccc
}

.inventory > tbody tr th {
    font-weight: normal;
    text-align: left;
}

.inventory > tbody tr td:first-child {
    border-left: none
}

.reorderable > tbody tr:hover {
    -moz-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25), 1px 1px 0 #fff inset;
    -webkit-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.25), 1px 1px 0 #fff inset;
}

.reorderable > tbody tr:hover td,
.reorderable > tbody tr:hover th {
    border-bottom: 1px solid #aaa;
    border-top: 1px solid #aaa;
    -webkit-transition-property: -webkit-box-shadow, border, background;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: border, margin, background 250ms ease-in;
}

.attachments td,
.attachments th,
.inventory-simple td,
.inventory-simple th {
    padding: 4px 12px
}

/* @end INVENTORY TABLE*/

/*Styles for the strips containing batch controls*/

/*Strip at the bottom of the table*/

table.inventory > tbody ul.subtabs {
    list-style: none;
    padding: 0;
    margin: 0;
}

table.inventory > tbody ul.subtabs li {
    position: relative;
    padding: 2px 2px 2px 20px;
}


/* @group ITEM STATUS (inventory table)
----------------------------------------------- */

div.status {
    font-size: 90%;
    text-align: left;
    padding: 1px 6px 3px 6px;
    margin: 0;
    background: #f9f9f9;
    display: block;
}

div.status a img {
    vertical-align: middle;
}

div.status p {
    padding: 1px;
    border: 1px solid #ccc;
    font-size: 90%;
    color: #444444;
    margin: 2px auto 4px auto;
    text-align: left !important;
    line-height: 10%;
    background: #fff;
}

div.status p img {
    margin: 0px !important;
    background-color: #8DAFAF;
    height: 8px;
    padding: 0;
}

div.status div {
    position: relative;
    text-align: center;
}

table.inventory-simple {
    margin: 0px 0 12px 0;
    border-collapse: collapse;
    width: 100%;
}

/*------------------------REORDERABLE TABLE--------------------------------------*/

/*
  Used in:
    -- Data Collection Page step ('stepItems-reorder')
    -- Organize Grade Center Page (+ 'gbColumns')
*/

table.stepItems-reorder {
    border-spacing: 0px;
    font-size: 85%;
    margin-bottom: 12px;
}

table.gbColumns {
    font-size: 90%;
    zoom: 1;
}

table.stepItems-reorder td,
table.stepItems-reorder th {
    padding: 6px 6px 6px 12px
}

table.stepItems-reorder thead tr th {
    background: #fff;
    border-bottom: 1px solid #ccc;
    color: #999;
    text-align: left;
}


/* @end ITEM STATUS*/

/* @group REORDERABLE TABLE
----------------------------------------------- */

/*------------------------REORDERABLE TABLE--------------------------------------*/

/*
  Used in:
    -- Data Collection Page step ('stepItems-reorder')
    -- Organize Grade Center Page (+ 'gbColumns')
*/

table.stepItems-reorder {
    border-spacing: 0px;
    font-size: 85%;
    margin-bottom: 12px;
}

table.gbColumns {
    font-size: 90%;
    zoom: 1;
}

table.stepItems-reorder td,
table.stepItems-reorder th {
    padding: 6px 6px 6px 12px
}

table.stepItems-reorder tr th.clearCell {
    border: 0;
    padding: 0;
}

table.stepItems-reorder tbody tr:first-child td,
table.stepItems-reorder tbody tr:first-child th,
table.stepItems-reorder thead tr:first-child {
    border-top: 0
}

table.stepItems-reorder tbody tr td.dragCell {
    padding: 0px;
    border: 0;
    vertical-align: top;
    text-align: right;
}

table.stepItems-reorder tbody tr td span.reorder {
    position: relative;
    width: 18px!important;
    height: 20px;
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-border-radius: 3px 0 0 3px;
    -webkit-border-radius: 3px 0 0 3px;
    border-right: 1px solid #ccc;
    cursor: move;
    display: block;
    left: auto;
    right: 0;
    top: 2px;
}

table.stepItems-reorder tbody tr.frozenbar td span.reorder {
    top: 1px
}

table.stepItems-reorder tbody tr td input {
    vertical-align: middle;
    padding: 2px 3px;
    width: 95%;
}

table.stepItems-reorder tbody tr td.points input {
    width: 3em
}

table.stepItems-reorder tbody tr td.entry input[type=text] {
    width: 90%
}

table.stepItems-reorder tbody tr td.entry input[type=checkbox] {
    width: auto
}

table.stepItems-reorder tbody tr td input[type=checkbox] {
    margin: 0 4px 0 0
}

table.gbColumns tbody tr td input[type=checkbox] {
    width: auto;
    margin: 0;
}

table.gbColumns tbody tr td {
    padding: 6px 6px 6px 12px;
    vertical-align: top;
}

table.gbColumns tbody tr.frozenbar td {
    background: #ccc;
    color: #444;
    font-size: 95%;
    border-top: 0;
}

table.gbColumns tfoot tr.lastRow td {
    background: #999;
    border: 0;
    height: 2px;
    line-height: 0;
    padding: 0;
}

table.gbColumns thead tr td.checkBox,
table.gbColumns tbody tr td.checkBox {
    padding: 3px 0 1px 6px;
    text-align: center;
}

table.gbColumns tbody tr.frozenbar td.dragCell {
    padding: 0!important
}

table.gbColumns tbody tr.placeholder td {
    height: 1px;
    padding: 0;
    border: 0;
    line-height: 0;
}

table.gbColumns tbody tr.placeholder td.clear {
    background: inherit;
}

ul.dragableHighlight li table.gbColumns thead tr td.clear,
ul.dragableHighlight li td.clear,
ul.dragableHighlight li table.gbColumns tbody tr.frozenbar td.dragCell,
ul.dragableHighlight li table.gbColumns tbody tr td.dragCell,
ul.dragableHighlight li table.gbColumns tbody tr.frozen td.dragCell,
ul.dragableHighlight li table.gbColumns tfoot tr.lastRow td.clear,
table.gbColumns thead tr td.clear {
    border: 0;
    padding: 0;
}

tr.rowdrag {
    background: #ccc;
    z-index: 1;
}

.insertImg {
    position: relative;
    top: 12px;
    z-index: 20;
}

.insertImgUp {
    position: absolute;
    right: -10px;
    z-index: 20;
}

table.inventory > tbody tr td.smallCell,
table.inventory > thead tr th.smallCell {
    padding: 9px 0 9px 3px;
    width: 1%;
    white-space: nowrap;
}

table.inventory > tbody tr td.hideCell,
table.inventory > thead tr th.hideCell {
    display: none
}

.clickOrder {
    display: none
}

table.inventory > tbody tr td.clickOrder {
    border-left: none;
}

table.inventory tr td.endCell {
    width: 1px !important;
    padding: 0!important;
}

table.inventory tr.orderRow td.clickOrder {
    text-align: center;
}

table.inventory tr.orderRow td.clickOrder div {
    position: relative
}

.sortedplus {
    background-image: url(images/controls.png);
    background-repeat: no-repeat;
    background-position: 48% -995px;
}

/* @end REORDERABLE COLUMNS */

/* @group INVENTORY CONTROLS
----------------------------------------------- */

.rumble {
    margin: 0 0 9px 0;
}

/* Top inventory action bar. */

.rumble_top {
    margin: 12px 0 0 0;
}


#mapCanvasForm .rumble_top,
#mapCanvasForm .rumble {
    margin-left: 30px;
    margin-right: 30px;
}

#mapCanvasForm .rumble_top {
    border-bottom: 2px solid #eee;
}

.noBatchActions {
    background-image: none!important;
    padding: 5px!important;
}

.rumbleBuildList {
    margin: 0 0 0 18px;
    border-top: 2px solid #eee;
}


.rumbleBuildList ul li,
.rumbleBuildListTop ul li {
    z-index: 1000;
}

/* Inventory action bar buttons. */

.rumble_top ul {
    padding: 4px 2px 4px 34px;
}

.rumble ul {
    padding: 4px 2px 4px 34px;
}

.rumble_top ul li,
.rumble ul li,
.rumble_top ul li.primary,
.rumble ul li.primary {
    display: inline-block;
    margin: 0 3px 0 0;
    vertical-align: top
}

.rumble_top ul li.secondary,
.rumble ul li.secondary {
    float: right;
    margin: 0 0 0 3px;
    position: relative;
}

.contentListPlain .rumble li,
.contentListPlain .rumble_top li {
    padding: 0;
}

.rumble li.listActionDivider,
.rumble_top li.listActionDivider,
.selectList .listActionDivider,
.listActionDivider {
    border-right: 1px dotted #999;
    margin-right: 9px;
    padding-right: 9px;
}

.rumble li.listActionGroup input,
.rumble_top li.listActionGroup input {
    font-size: 95%;
}

.rumble li.listActionGroup a,
.rumble_top li.listActionGroup a {
    display: inline;
}

/*Inventory Paging controls*/

.paging {
    clear: left;
    float: right;
    text-align: right;
}

.pagingprefs {
    color: #666;
    padding: 3px 0px 0 0px;
    margin-top: 3px;
    text-align: right;
}

.paging span {
    padding: 1px 6px 1px 0;
    border-right: 1px dotted #ccc;
    margin: 0 9px 0 0;
}

.rumble_top .inventory_paging,
.rumble .inventory_paging {
    float: right;
    margin-left: 9px;
    padding: 2px 0 0 9px;
}

.jumptopage input,
.inventory_paging input {
    width: auto;
    text-align: center;
    font-weight: bold;
    _display: inline-block;
    padding: 0;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}


.jumptopage input {
    width: 2em;
    font-weight: normal;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
}

.rumble_top .inventory_paging a,
.rumble .inventory_paging a,
.rumble_top .inventory_paging .abutton,
.rumble .inventory_paging .abutton {
    padding: 0;
}

.rumble_top .inventory_paging .gotolink,
.rumble_top .inventory_paging .gotolink {
    padding: 1px 3px;
}

.inventory_paging a,
.inventory_paging img,
.inventory_paging span,
.inventory_paging div,
.jumptopage div,
.inventory_paging .abutton {
    display: inline-block;
}

.inventory_paging a img,
.inventory_paging .abutton img {
    margin: 0;
    display: inline;
    float: none;
    padding: 0;
}

.inventory_paging img {
    margin: 2px 2px 3px 2px;
}

.inventory_paging a.inactive {
    opacity: .4;
    filter: alpha(opacity=40);
}

a.jumpToPageOpen,
a.jumpToPageOpen:hover,
a.jumpToPageOpen:focus {
    border: none;
    border-bottom: 1px solid #ccc;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    background: transparent;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

div.jumptopage input#currentpage_bot,
div.jumptopage input#currentpage_top,
input#currentpage_bot,
input#currentpage_top {
    width: auto;
}

.jumptopage {
    float: right
}

.jumptopage div {
    margin: 0 0 0 3px;
}

.jumptopage button {
    border: none;
    background: transparent;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
}

.jumptopage button img {
    margin: 0
}

.rumble_top .secondaryControl,
.rumble .secondaryControl {
    float: right;
}

/* @end INVENTORY CONTROLS*/

/* @group KEY:VALUE TABLE */

.key-valueTable tr,
.key-valueTable th,
.key-valueTable td,
.key-valueTable tbody {
    border-bottom: none !important;
}

.key-valueTable tbody td,
.key-valueTable tbody th {
    border-top: 1px dotted #ccc!important;
    padding: 2px 6px 2px 0;
    background: transparent!important;
    vertical-align: top;
    font-size: inherit!important;
}

.key-valueTable tbody tr:first-child th,
.key-valueTable tbody tr:first-child td {
    border: none !important;
}

.infoListWrapper .key-valueTable {
    margin: 3px 9px 6px;
}

/* @end --TABLES */

/* @group LISTS
----------------------------------------------- */

.contentList,
.buildList,
.contentListPlain,
.announcementList {
    margin: -20px -30px
}
/* styles the filter menu on the Announcement page as accessed from the Tools panel on the My Institution tab */

.announcementFilter {
    margin: -20px -30px 24px;
    padding: 12px;
    border-bottom: 1px solid #ccc;
}

.gradingList,
#survey.buildList,
#manageFormCanvasForm .buildList {
    margin: 0 -30px
}

#mapCanvasForm .buildList {
    margin: 0 30px
}

.hierarchy-page #toolSettingsForm #dataCollectionContainer {
    margin: -10px -30px
}

.leftColumn-wide .contentListPlain {
    margin: 0
}

/* .item = content list item wrapping title, contextual menu link, etc. */

.contentList > li,
.buildList > li,
.contentListPlain > li,
.announcementList > li,
.contentPageItem {
    padding: 20px 30px;
    margin: 0 -1px;
    position: relative;
    border: 1px solid transparent;
    border-top-color: #ccc;
    -webkit-transition-property: -webkit-box-shadow, border, background;
    -webkit-transition-duration: 200ms;
    -webkit-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
    -moz-transition: border, margin, background 250ms ease-out;
}

.contentList > li:first-child,
.contentList > li.read:first-child:hover,
.buildList > li:first-child,
.contentListPlain > li:first-child,
.announcementList > li:first-child {
    border-top: 1px solid transparent
}

.contentList > li,
.buildList > li,
.contentListPlain > li,
.announcementList > li,
.contentPageItem {
    min-height: 50px
}

.liItem a[onclick*="toggleDetails"] {
    position: relative;
    right: -19px;
    top: -6px;
    visibility: hidden;
}

.liItem:hover a[onclick*="toggleDetails"] {
    visibility: visible
}

.liItem a[onclick*="toggleDetails"] img {
    visibility: hidden
}

.contentListPlain .item_icon {
    display: none
}

.item {
    font-size: 110%;
    margin: 0;
    padding: 0 0 12px;
    cursor: move;
}

.contentList .item {
    padding: 0px 0px 12px 60px
}

.gradingList .item {
    padding-right: 120px
}

.announcementList .item,
.announcementList-read .item,
#announcementList .item {
    padding-right: 13em;
    word-break: normal;
    word-wrap: break-word;
}

.item:hover,
.item:focus {
    cursor: move
}

/* item in read mode */

.read .item,
.announcementList-read .item {
    border: 0!important;
    margin: 0;
}

.contentList-slim .read .item {
    padding-left: 48px
}

.read .item:hover,
.read .item:focus {
    background: transparent;
    cursor: default;
}

/*For Tab Management page*/

.tab-groups h3.item {
    border-bottom: 1px dotted #CCCCCC;
    margin: 0 11em 8px -12px;
    padding: 0 0 8px 12px;
}

.tab-groups h3.item .reorder + span {
    color: #999999;
    font-family: Georgia;
    font-size: 90%;
    font-style: italic;
    font-weight: normal;
    margin: 0 4px 0 0;
}

.item_icon {
    position: absolute;
    left: 24px;
    top: 12px;
    margin: 0 0px 0 0px;
}

.read .item_icon {
    left: 18px;
    margin: 0;
}

.item h3,
.item .contextMenuContainer {
    float: left;
    margin: 0 3px 0 0;
    word-wrap: break-word;
}

.item h3 + .contextMenuContainer {
    top: 2px;
    position: relative;
}

/*For Tab Management page*/

.tab-groups .item .contextMenuContainer {
    float: none
}

#announcementList .item .contextMenuContainer {
    float: none
}

.item input[type=checkbox] {
    float: left;
    margin: 2px 6px 0 -6px;
}

/* Icons only view (WebCT Vista style) list. */

.iconsOnly {
    width: 80%;
    margin: 24px auto;
    border-bottom: 1px solid #ccc;
}

.iconsOnly li {
    text-align: center;
    float: left !important;
    width: 49%;
    padding: 0;
    margin: 0;
    max-height: 116px;
    border: 1px solid #ccc;
}

.iconsOnly > li:first-child {
    border-top-color: #ccc
}

.iconsOnly li:nth-child(even) {
    border-left: 1px solid #ccc
}

.iconsOnly li:nth-child(even):hover,
.iconsOnly li:nth-child(even):focus {
    border-left-color: #666
}

.iconsOnly .read {
    border: 0!important
}

.iconsOnly .item_icon {
    left: auto;
    min-height: 50px;
    top: 0;
    padding: 12px 0 0;
}

.iconsOnly .item {
    padding: 6px;
    border: 0;
    min-height: 3em;
}

.iconsOnly .read .item {
    padding: 6px;
    margin: 0;
}

.iconsOnly .item h3,
.iconsOnly .item .contextMenuContainer {
    float: none;
    display: inline-block;
    top: 0;
}

.iconsOnly .item h3 a {
    word-wrap: break-word;
    word-break: break-word;
    width: 270px\9;
    display: block\9;
}

@-moz-document url-prefix() {
    .iconsOnly .item h3 a {
        max-width: 270px;
        display: block;
    }
}

/* Read mode adjustments for icon-only view */

.iconsOnly .read .item_icon,
.iconsOnly .item_icon {
    position: relative!important;
    text-align: center!important;
    display: block!important;
}

.iconsOnly .read .item_icon,
.iconsOnly .read .item {
    border: 0;
    left: 0;
}

.iconsOnly .read:hover .item_icon,
.iconsOnly .read:hover .item,
.iconsOnly .read:focus .item_icon,
.iconsOnly .read:focus .item {
    background: transparent
}

/*Misc. list support styles*/

/* this class targets the checkboxes on a canvas page */

.buildList li input {
    float: left;
    margin: 2px 8px;
}

.buildList input.browse,
.buildList input.genericButton,
.buildList input[type=button] {
    margin: 0 0 6px
}

.contentListRight {
    font-weight: normal;
    position: absolute;
    right: 6px;
    left: auto;
}

.pagedContentListRight {
    top: 4px
}

.contentListRightOffset {
    margin-right: 12em
}

/* Details element */

.contentList .details {
    padding-left: 60px
}

/* Details element variations */

.contentListPlain .contentListRight + .details {
    padding: 1px 0 1px 28px;
    overflow-x: auto;
}

.announcementList .details,
#announcementList .details {
    margin-right: 12.8em;
    overflow-x: auto;
    overflow-y: visible;
}

.contentList-slim .read .details {
    margin-left: 48px
}


/* Staff Info version of content list*/

.staffInfoList .details {
    margin-right: 160px
}

.staffInfoList .hasPhoto .details {
    min-height: 135px
}

.details > p {
    padding: 0 0 12px;
    margin: 0;
    font-size: 95%;
}

.details .note {
    font-weight: bold
}

.details > p.important {
    font-weight: bold;
    font-size: 90%;
    padding: 0;
    margin: 3px 0 9px 0;
}

.itemDetails,
.announcementInfo {
    position: absolute;
    right: 0;
    top: 2px;
    bottom: 8px;
    width: 14em;
    border-left: 1px dotted #ccc;
    padding: 9px 9px 3px 14px;
    font-size: 85%;
    word-wrap: break-word;
}

.announcementInfo p,
.itemDetails p {
    padding: 2px 4px 0 4px
}

.announcementInfo p span span {
    font-size: 95%!important
}

.noItems,
.additional + p .warnFont {
    padding: 6px 0px;
}

#listContainer .noItems,
.additional + p .warnFont,
.table-scroll-wrapper .helphelp,
.hierarchy-page .noItems {
    text-align: center;
    padding-top: 100px;
}

.table-scroll-wrapper .helphelp {
    display: block;
    margin: 0 auto;
}

/* Content item attachments */

.details .attachments {
    margin-bottom: 9px;
    word-break: normal;
    word-wrap: break-word;
}

.buildList > li.separator {
    background: #ededed;
}

.separator h3.item,
.external-breadcrumbs .receipt {
    font: italic 108% Georgia, serif normal;
    margin: 0;
    padding: 0;
}

.separator .line,
.external-breadcrumbs .contentPaneWide {
    position: absolute;
    left: 30px;
    right: 0;
    top: 50%;
    border-top: 1px dashed #777;
}

.external-breadcrumbs .contentPaneWide {
    position: relative;
    top: 6px;
    left: 0;
    margin: 0 24px 0 30px;
}

.separator .text {
    z-index: 2;
    position: relative;
    padding: 0 12px 0 0;
}

.external-breadcrumbs .receipt,
.external-breadcrumbs .contentPaneWide .receipt {
    box-shadow: none;
    display: inline-block;
    top: -9px;
    z-index: 2;
    position: relative;
    padding: 0 12px 0 0;
    color: #444;
}

.external-breadcrumbs .student-preview-control ~ div.viewToggle ul li {
    float: none;
    position: static;
    margin: 0;
}

/*Tagging*/

.buildList .detailList .hidden {
    display: none;
}

.buildList .detailList .tagContainer {
    position: relative;
}

.buildList .detailList .tagContainer .hidden {
    display: none;
}

.buildList .detailList .tagContainer,
.buildList .detailList .tagContainer span {
    float: none;
    display: inline;
    padding: 2px 2px 2px 0;
    width: auto;
    font-weight: normal;
}

.buildList .detailList .tagContainer input,
.tagContainer input {
    float: none;
    display: inline;
    margin: 0;
    border: 1px solid #555;
    font-size: 95%;
    vertical-align: middle;
}

.tagContainer .newTagForm {
    margin-left: 6px;
    border-left: 1px dotted #999;
}

.tagContainer .newTagForm label {
    padding-left: 6px;
}

.currentTags {
    display: none;
    position: absolute;
    top: 1.2em;
    right: 0;
    width: 16em;
    line-height: 1.8;
    zoom: 1;
    z-index: 100;
    overflow: hidden;
}

.currentTags span {
    display: block;
    padding: 18px 6px 6px;
}

.currentTags a {
    font-weight: bold;
}

.currentTags a.closeCloud {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0 2px 1px;
    width: 98%;
    text-align: right;
    line-height: 1;
}

.auto_complete {
    width: 12em;
    border: 1px solid #5577BB;
    border-top: 1px solid #ACC2DF;
    border-left: 1px solid #ACC2DF;
    z-index: 1000;
}

.auto_complete ul {
    margin: 0;
    padding: 0;
    width: 100%;
    list-style-type: none;
}

.auto_complete ul li {
    margin: 0;
    padding: 2px 1% 2px 3%;
    /* Need to coordinate padding and width to accomodate IE box calucations */
    width: 96%;
    cursor: pointer;
    overflow: hidden;
}

.auto_complete ul strong.highlight {
    margin: 0;
    padding: 0;
}

/* Tag Cloud*/

.freq1 {
    font-size: 90%;
    padding: 0 1px;
}

.freq2 {
    font-size: 105%;
    padding: 0 1px;
}

.freq3 {
    font-size: 120%;
    padding: 0 1px;
}

.freq4 {
    font-size: 135%;
    padding: 0 1px;
}

.freq5 {
    font-size: 150%;
    padding: 0 1px;
}

.freq6 {
    font-size: 165%;
}

/* Tag Cloud*/

.freq1:hover,
.freq2:hover,
.freq3:hover,
.freq4:hover,
.freq5:hover,
.freq6:hover {
    text-decoration: none;
    background: white;
}

.currentTags a.tagDisabled {
    opacity: 0.7;
    filter: alpha(opacity=70);
    text-decoration: none;
    font-weight: normal;
}

.currentTags a.tagDisabled:hover {
    background: transparent;
}

/* @group MISC LISTS
----------------------------------------------- */

.subList,
.subList-reorder {
    margin: 3px 0 6px;
    /*border:1px dotted #CCCCCC;border-width:1px 0 0 1px*/
}

.subList-reorder {
    /*padding-left:23px;*/
}

.subList li {
    padding: 6px 6px 6px 24px;
    border: none;
    font-size: 95%;
}

.buildList .detailList {
    margin: 0;
    padding: 3px 3px 3px 23px;
}

.subList-reorder li {
    padding: 6px 6px 6px 24px;
    font-size: 95%;
    border: 1px solid transparent;
}

.subList li a img,
.subList-reorder li a img {
    vertical-align: middle;
}

.subList li p,
.subList-reorder li p {
    padding: 0;
    margin: 3px 6px 3px 24px;
    font-size: 90%;
    color: #444;
    display: none;
}

.subList li p {
    visibility: hidden;
}

.subList li p span,
.buildList .detailList li .subList li p span,
.subList-reorder li p span {
    font-weight: bold;
    display: inline;
    float: none;
}

.subList-reorder .itemDetails,
.subList-reorder .details,
.subList .details {
    display: none;
}

.itemDetails + .details {
    margin-right: 13em;
    overflow: visible;
}

.subList li p span {
    font-weight: bold;
}

.subListArtifact,
.detailList .subListArtifact {
    clear: both;
}

.subListArtifact li,
.detailList .subListArtifact li {
    position: static;
}

/* corrects layout issue in IE6&7 */

.detailList .subListArtifact,
.detailList .subListArtifact li,
.detailList .subListArtifact li a {
    zoom: 1;
}

.buildList .detailList {
    margin: 0 0 0.6em 0.7em;
}

/* no need to indent sublists (of attached files/objectives) in a canvas page */

.buildList .detailList .subList {
    margin: 0 0 6px 0;
    border: 0;
    padding: 0;
}

/* survey answers are listed in an ordered subList */

ul.buildList ul.detailList ol.subList {
    list-style-type: decimal;
    list-style-position: inside;
}
/* subListArtifact is only used for artifact list on OPT canvas page */

ul.buildList ul.detailList li {
    border: none;
    margin: 0 0 0.2em 0;
    padding: 0 0 0.2em 0;
    display: table-row;
}

ul.buildList ul.detailList .detail-item-title {
    float: left;
    width: 135px;
    font-weight: bold;
    display: block;
}

ul.buildList ul li > div {
    float: none;
    padding: 0 0 0 0.3em;
    width: 79%;
    display: block;
    margin-left: 135px;
}

/* corrects formatting issue with contextual menu in canvas pages: buildList, noimg list */

ul.buildList ul li div.contextMenuContainer,
ul.noimg li div.contextMenuContainer {
    display: inline;
    float: none;
    width: auto;
}

div.itemHeaderControl {
    position: absolute;
    right: 14.5em;
    top: 9px;
}

div.itemHeaderControl a img {
    margin: 0;
    padding: 0;
}

/* @end MISC LISTS*/

/* @end LISTS*/

/* @group CART */

/*Shopping cart */

body.cartMode {
    padding-bottom: 49px
}

.addedRow img {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

table#datatable2 tr td,
table#datatable2 tr th {
    padding: 1px 3px;
    font-size: 85%;
}

table#datatable2 thead th {
    padding: 3px 3px
}

.itemSelector {
    width: 20px;
    height: 20px;
    margin: 0 auto;
}

.itemSelector input {
    opacity: 0;
    filter: alpha(opacity=0);
}

.itemTray {
    z-index: 10000;
    position: fixed;
    bottom: 0;
    left: 18px;
    right: 18px;
    margin: 0;
    border: 1px solid #aaa;
    border-bottom: 0;
    padding: 4px 9px;
    height: 40px;
    zoom: 1;
}

.picker .itemTray {
    left: 12px;
    right: 12px;
}

div.itemTrayContentPane {
    left: 200px;
}

/* styles tray when used with navFrame/contentFrame layout */

div.itemTrayContentPaneWide {
    left: 0;
}

/* styles tray when used with navFrame/contentFrameWide layout */

.itemTray h2,
.itemTray h3 {
    font-size: 110%;
    padding: 6px 0;
    background: transparent;
    margin: 0;
}

.itemTray h2 span.listToggle a,
.itemTray h3 span.listToggle a {
    text-decoration: none;
    border-bottom: 1px dotted #ccc;
}

.itemTray h2 span.listToggle a:hover,
.itemTray h3 span.listToggle a:hover {
    border-bottom: 1px solid #ccc;
}

.itemTray div.noItems {
    text-align: center
}

.itemTray #cartList {
    padding: 9px 0;
}

.itemTray #selectedItemsWrapper {
    padding: 4px;
}

.itemTray .cartTableWrapper {
    max-height: 130px;
    overflow-y: auto;
    border: 1px solid #555;
    background: #fff;
}

.sideTOC .cartTableWrapper {
    overflow: auto;
}

#count,
.itemTray #numberOfElements {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 1px 6px;
    text-align: center;
}

#progress {
    display: none;
    position: absolute;
    width: 100px;
    margin: 300px 50%;
    z-index: 300;
}

#progress div {
    margin-left: -100%;
}

#cartSubmit {
    z-index: 200;
}

#cartList fieldset {
    margin: 0 12px 0;
    padding: 3px 3px 12px;
}

#cartList fieldset ul li input[type=text] {
    border: 1px solid #666666;
    padding: 0px;
    width: 2.3em;
}

/* @end CART*/

/* @group ITEM GALLERY
----------------------------------------------- */

.itemGallery {
    padding: 0;
    margin: 0;
    zoom: 1
}

.itemGallery > li {
    margin: 5px 5px 20px 5px;
    _height: 130px;
    text-align: center;
    vertical-align: top;
    width: 1.2em;
    padding-top: 0.06em;
    zoom: 1
}

.itemGallery .stackFix {
    height: auto;
    width: 100%;
}

.itemIconHolder {
    padding: 0px;
    height: 1em;
    width: 100%;
    position: relative;
    margin: 0 auto .05em auto;
}

.itemIconHolder a {
    display: block;
    overflow: hidden;
    border: 1px solid #ccc;
    zoom: 1
}

.itemIconWrapper {
    border: 0.026em solid #f1f1f1;
    position: absolute;
    bottom: 0;
    margin: 0 50%;
    width: auto;
}

/*Thumbnail size control*/

.x-small li {
    font-size: 70px;
    width: 1.8em
}

.small li {
    font-size: 100px
}

.normal li {
    font-size: 140px
}

.large li {
    font-size: 180px
}

.x-large li {
    font-size: 220px
}

.u_resetFont-px {
    font-size: 12px;
}

.itemIconLink-vertical a {
    width: .78em;
    height: .9em;
}

.itemIconLink-square a {
    width: .78em;
    height: .78em;
}

.itemIconLink-horizontal a {
    width: 1em;
    height: .78em;
}

.itemIconLink-vertical img {
    width: .8em;
    height: .9em;
    vertical-align: top;
}

.itemIconLink-square img {
    width: .8em;
    height: .8em;
    vertical-align: top;
}

.itemIconLink-horizontal img {
    width: 1em;
    height: .8em;
    vertical-align: top;
}

.itemIconLink-vertical .itemIconWrapper,
.itemIconLink-square .itemIconWrapper {
    left: -0.39em;
}

.itemIconLink-horizontal .itemIconWrapper {
    left: -0.5em;
}

.itemInfo {
    padding: .2em 0 0 0;
    margin: 0;
    font-size: 12px;
    width: 100%;
    border-top: 1px dotted #ccc;
}

.itemInfo li {
    font-size: 95%;
    margin: 0;
    text-align: center;
    border: 0;
    width: auto;
    line-height: 1.25em;
    width: 100%;
}

.itemInfo li span {
    vertical-align: top;
}

.itemInfo li .label {
    text-align: right;
}

.itemInfo .cmimg,
.itemInfo .cmimg img {
    width: 18px
}

.itemInfo .title {
    margin-left: 0px;
    font-size: 100%;
    line-height: 1.15em;
    text-align: center;
    padding: 1px 0 3px 0;
    word-break: normal;
    word-wrap: break-word
}

.itemInfo input[type="text"] {
    width: 100%
}

.itemInfo .high {
    margin-left: 0px;
    font-size: 100%;
    line-height: 1.15em;
    text-align: center;
    padding: 1px 0 3px 0;
    overflow-x: hidden;
    word-break: normal;
    word-wrap: break-word;
    background: #fff1c5
}

/*Item metadata in the lightbox*/

.lb-content .itemInfo {
    font-size: 95%;
    padding: 3px 0 6px 0;
}

.lb-content .itemInfo li {
    line-height: 1.45em;
}

.lb-content .itemInfo .title {
    padding: 3px 0;
    border-bottom: 1px dotted #ccc;
}

/*Icon gallery modifications*/

.iconGallery > li {
    width: 75px;
    margin: 5px 5px 12px!important;
}

.iconGallery .itemIconHolder {
    height: 60px;
    border: 0;
}

.iconGallery .itemIconHolder a {
    border: 0;
    overflow: visible;
    width: auto;
    height: auto;
}

.iconGallery .itemTitle {
    font-size: 85%;
}

.iconGallery .itemIconWrapper {
    left: -30px;
    padding: 4px;
    border: 1px solid #ccc;
    width: auto
}

/* @end ITEM GALLERY */

/* @group TOC */

/*TOC .container position change*/

.sideTOC_panelMin .container,
.sideTOC_panel .container,
.sideTOC_panelMax .container {
    position: static !important;
}

.tocWrapper {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 18px;
    z-index: 200;
    margin: 0;
    border: 1px solid #aaa;
    border-bottom: 0;
    padding: 4px 9px;
    height: 40px;
    zoom: 1;
}

.tocBottom_max .tocWrapper {
    z-index: 211;
}

.tocHidden {
    top: -10000px!important
}

.tocHead {
    margin: 0;
    padding: 10px 12px;
}

.tocHead h2,
.tocActions {
    margin-top: 0;
    margin-bottom: 12px!important;
}

/* side margins are applied via .u_floatThis-left */

.sideTOC h2 {
    float: none!important;
    font-size: 110%;
}

/* creates a line break */

.tocActions {
    white-space: nowrap
}

.tocActions a,
.tocActions span,
.tocActions > img {
    display: inline-block;
    margin: 0 0 0 -1px;
}

.tocActions span {
    padding: 0 3px
}

.tocTreeWrapper {
    overflow-y: auto;
    padding: 2px 0 0;
}

.sideTOC .tocTreeWrapper {
    overflow: auto
}

ul#tocTree li {
    padding: 0 0 2px
}

ul#tocTree a.itemActive {
    font-weight: bold;
    text-decoration: none;
}

ul#tocTree span {
    color: #555;
    padding: 0px 3px 0 0;
}

/* numbering scheme and inActive items */

.treeNodeIcon {
    padding: 0 3px 0 0
}

.sideTOC {
    position: absolute;
    top: 0;
    right: auto;
    bottom: auto;
    width: 200px;
    margin: 0;
    padding: 0px;
    border: 1px solid #aaa;
    border-right: 0;
}

.sideTOCMinimize {
    position: absolute;
    top: 0;
    right: auto;
    bottom: auto;
    margin: -4px 0 0 12px;
    padding: 0px;
    width: 9px!important;
    border: none;
    -moz-border-radius: 3px 0 0 3px;
    -webkit-border-radius: 3px 0 0 3px;
}

.sideTOCMinimize .tocActions {
    background: transparent;
    position: relative;
    left: -24px;
    padding: 1px;
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
}

.sideTOCMinimize .tocActions a {
    display: block;
    margin: -1px 0 0;
}

/* styles to align the TOC with the course menu */

.tocBottom_pullExpanded {
    left: 228px
}

.tocBottom_pullExpanded .tocActions {
    margin: 0 12px;
}

.tocBottom_pullCollapsed {
    left: 18px
}

.tocSide_pullExpanded {
    left: 222px;
    top: 4px;
}

.tocSide_pullCollapsed {
    left: 13px
}

/* styles applied to the contentPanel to make room for the TOC */

.sideTOC_panel {
    padding-left: 201px
}

.sideTOC_panelMin {
    padding-left: 21px
}

.sideTOC_panelMax {
    padding-left: 351px
}

.tocBottom_min {
    padding-bottom: 30px
}

.tocBottom_max {
    padding-bottom: 330px
}

.tocBottom_open {
    padding-bottom: 160px
}

.tocBottom_open .container,
.tocBottom_max .container,
.tocBottom_min .container,
.sideTOC_panel .container,
.sideTOC_panelMax .container,
.sideTOC_panelMin .container {
    padding: 18px 30px
}

/* @end TOC */

/* @group TABS */

/* @group LOCAL VIEW TOGGLE */

/*Content area toggle (located above content area title)*/

/*If localViewToggle in a different context (other that atop of content area), create selectors with higher specificity.*/

.localViewToggle {
    zoom: 1;
    padding: 0;
    text-align: right;
    background: #eee;
    border-radius: 3px 3px 0 0;
}

.filePickerWidget .localViewToggle {
    background: transparent;
}


.localViewToggle ul li {
    float: right;
}

.localViewToggle ul li.active {
    position: relative;
}

.localViewToggle a {
    display: block;
    padding: 6px 15px 7px;
    font-size: 90%;
    text-decoration: none;
    margin: 0;
    text-transform: inherit;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
}

.localViewToggle a:hover {
    text-decoration: underline
}

.localViewToggle .active a:hover {
    text-decoration: none
}

.localViewToggle a.active,
div.localViewToggle h2 {
    font-weight: bold;
    margin: 0;
    border: 1px solid #ddd;
    border-top: 0;
    display: inline-block
}

.localViewToggle a.active:before,
div.localViewToggle h2:before,
.localViewToggle a.active:after,
div.localViewToggle h2:after {
    content: "";
    position: absolute;
    bottom: 0;
    border-bottom: 8px solid #ccc;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 0;
    display: block;
    left: 50%;
    margin-left: -8px;
    z-index: 3;
}

.localViewToggle a.active:after,
div.localViewToggle h2:after {
    bottom: -1px;
    border-bottom-color: #eee;
    z-index: 4;
}

/*@sweep*/

.localViewToggle .separator {
    border-left: 1px dotted #D7BB66;
    margin-left: 6px;
    padding-left: 6px;
}

/*@sweep*/

.localViewToggle a.miniComboButton {
    padding-right: 16px;
    border: 1px solid #D7BB66;
    text-decoration: none!important;
}

/* @end LOCAL VIEW TOGGLE */

/*Container tabs*/

.containerTabs {
    font-size: 100%;
    margin: 6px 24px 0;
}

.containerTabs li {
    float: left;
    position: relative;
}

.containerTabs li.active {}

.containerTabs li a,
.containerTabs li h3 {
    padding: 9px 18px 12px;
    display: block;
    text-decoration: none;
    border-left: 1px dotted #ccc;
    margin: 0;
    font-size: 100%;
    white-space: nowrap;
}

.containerTabs li:first-child a,
.containerTabs li h3 {
    border: 0
}

.containerTabs .active a,
.containerTabs .active a:hover,
.containerTabs .active a:focus,
.containerTabs .active h3 {
    font-weight: bold;
    text-decoration: none;
    color: #000;
}

.containerTabs .active a:after,
.containerTabs .active h3:after {
    margin-bottom: -1px;
    z-index: 2;
}

.containerTabs .tabhead h3 {
    /* used for the "label/header" of the tabset for evaluating a self and peer assessment */
    padding: 9px 18px 12px 0;
}

.collapseTabs .containerTabs .active a:before {
    content: none
}

/*@since 9.1*/

/*Container tabs in the portlet*/

.portlet .containerTabs {
    font-size: 95%;
    padding: 8px 0 0;
    margin: 6px 0 0;
}

.portlet .containerTabs li {
    padding: 0;
    background-image: none;
}

.portlet .containerTabs li a {
    padding: 0px 9px 9px;
}

.portlet .containerTabs .active a {
    margin: 0;
}

.collapseTabs .containerTabs {
    margin: 0px 0 0;
}

.portlet .containerTabs .active a:before,
.portlet .containerTabs .active a:after {
    border-bottom-width: 7px;
    border-left-width: 7px;
    border-right-width: 7px;
    border-top: 0;
    left: 50%;
    margin-left: -4px;
}

.portlet .containerTabs .active a:before {
    border-bottom-color: #ddd;
}

.portlet .containerTabs .active a:after {
    border-bottom-color: #FFF4BF;
    bottom: -1px;
}

/*End container tabs*/

/* SEQUENCE MAP STYLES */

.mapTabs,
.lesson-plan-page .mapTabs {
    clear: both;
    border-top: 1px solid #aaa;
    margin: 20px -30px 0;
    position: relative;
    height: auto;
}

.hierarchy-page .mapTabs,
/* .hierarchy-page targets the Administrator Panel > Learning Hierarchy */
.lesson-plan-page .mapTabs,
.evidence-page .mapTabs {
    margin-top: 0px;
    top: 20px;
}

.lesson-plan-page .mapTabs ul.containerTabs,
.evidence-page .mapTabs ul.containerTabs {
    position: relative;
}

.evidence-page .mapTabs {
    border-bottom: 1px solid #bbb;
}

.evidence-page .mapTabs li:before,
.evidence-page .mapTabs li:after {
    display: block;
    content: "";
    border-left: 12px solid #D1EAEF;
    border-top: 23px solid transparent;
    border-bottom: 23px solid transparent;
    border-right: none;
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 101;
}

.evidence-page .mapTabs li:before {
    display: block;
    content: "";
    border-left: 12px solid #bbb;
    border-top: 23px solid transparent;
    border-bottom: 23px solid transparent;
    border-right: none;
    position: absolute;
    top: 0;
    left: 1px;
    z-index: 100;
}

.evidence-page .mapTabs li:first-child:before,
.evidence-page .mapTabs li:first-child:after {
    display: none;
}

.evidence-page .mapTabs li a,
.evidence-page .mapTabs li.active h3 {
    padding-left: 30px;
}

.mapTabs ul {
    margin-top: 0;
    margin-left: 0px
    /*margin:24px 0 -20px;*/
}

div.mapTabs ul li {
    /*margin:4px 3px 4px 0; */
    padding: 0;
}

.lesson-plan-page .mapTabs ul li.active h3,
.mapTabs ul li.active h3 {
    margin: 0;
    font-size: 100%;
    padding: 14px;
    border-left: 1px solid #bbb;
    position: relative;
}

.mapTabs ul li.active h3:after {
    border-bottom-color: #eaeaea;
    bottom: -1px
}

.mapTabs ul li.active:first-child h3:after,
.mapTabs ul li.active:first-child h3:before {
    margin-left: 0px;
}

.mapTabs ul li.active:last-child h3 {
    border-right: 1px solid #bbb;
}

.lesson-plan-page .mapTabs ul li.active h3:after,
.hierarchy-page .mapTabs ul li.active h3:after {
    border-bottom-color: #555;
    bottom: 0
}

.lesson-plan-page .mapTabs ul li.active h3:before,
.hierarchy-page .mapTabs ul li.active h3:before {
    display: none
}

.evidence-page .mapTabs ul li.active h3:after {
    border-bottom-color: #fff;
}

.mapTabs ul li a,
.lesson-plan-page .mapTabs ul li a {
    border: 0;
    padding: 14px;
    border-left: 1px solid #bbb;
    font-size: 100%;
    color: #01869E;
}

.mapTabs ul li a:hover {
    text-decoration: underline
}

.mapTabs ul li span:hover {
    border-bottom-style: solid
}

.mapTabs a.inprogress,
.mapTabs li:first-child a.inprogress {
    padding-left: 32px;
}

.mapTabs a.complete,
.mapTabs li:first-child a.complete {
    padding-left: 32px;
}

.mapTabs li:first-child a.complete {
    padding-left: 54px;
    background-position: 30px 50%;
}

.mapTabs ul li:first-child a,
.mapTabs ul li:first-child h3 {
    border: 0;
    padding-left: 30px;
}

.mapTabs ul li div {
    display: none;
    padding: 7px 12px;
}

.mapTabs ul li.saveTab a,
ul.containerTabs li.saveTab img {
    display: none;
}

.mapTabs ul li.saveFadeIn {
    opacity: 0;
    filter: alpha(opacity=0);
}

.mapTabs ul li.saveTab div {
    display: block;
    padding: 5px 12px 6px 12px;
    color: white;
    background: #44B10E url(images/tab_receipt_back.gif) repeat-x center bottom;
    font-weight: bold;
}

div.mapHelp {
    padding: 4px 12px 0 12px;
    margin: -1px 0 0;
}

ul.setStatus {
    border: 1px solid #eee;
    margin: 15px 0pt 9px 30px;
    padding: 3px;
    list-style: none;
}

ul.setStatus li {
    margin: 0 6px 0 0;
    font-size: 95%;
}

ul.setStatus li input {
    padding: 0;
    margin: 0;
}

ul.setStatus li label {
    padding-left: 22px;
}

ul.setStatus li label.complete {
    padding-left: 22px;
}

/* adjusts layout of the "next step" label on the sequence map canvas page */

form.mapCanvasForm div.steptitle,
form.mapCanvasForm h3.steptitle {
    margin: 15px 0 0 18px;
    padding-left: 0.8em;
}

.mapTabs .containerTabs {
    border-bottom: 0;
}

#mapCanvasForm {
    margin: 0px -30px;
}

#mapCanvasForm #containerDiv {
    margin: 20px 0;
}

/* END SEQUENCE MAP STYLES */

/* -------------- Targeting the Discover UI in OUTCOMES Facilitor (Analyze) View ----------- */

.evidence-page .infoListWrapper h3 a.itemHead {
    padding: 3px 0px 3px 22px;
}

.evidence-page .infoListWrapper h3 a.itemHeadOpen {
    padding: 3px 0px 3px 22px;
}

.evidence-page .leftColumn-narrow {
    margin: 0px 0px 0px 0px;
    width: 26%;
    padding: 6px;
    border-radius: 3px 3px 3px 3px;
    border: 1px solid #EEEEEE;
}

.evidence-page .leftColumn-wide {
    width: 69%;
}

/*session Box applied to infoListWrapper helps us target only Outcomes Specific alignment with Discover UI*/

.sessionBox {
    width: 95%;
}

/*targetting table inside the session Box only*/

.sessionBox .key-valueTable {
    margin: 3px 9px 6px 22px;
}

.sessionBox .key-valueTable tbody td,
.sessionBox .key-valueTable tbody th {
    padding-right: 40px;
}

.evidence-page .criteriaSummary {
    padding-top: 12px;
    border: 1px solid #EEE;
    margin: 0px;
}

.evidence-page .paletteItems li {
    margin-left: 0px;
}

/*  END Facilitar View */

/*Pane tabs*/

.paneTabs {
    background: #EFEDE3;
}

.paneTabs .active a,
.paneTabs .active a:hover,
.paneTabs .active a:focus,
.paneTabs .activepersonal a,
.paneTabs .activepersonal a:hover,
.paneTabs .active h3 {
    position: relative;
}

.paneTabs .active a:after,
.paneTabs .active a:before {
    content: "";
    position: absolute;
    border-bottom: 8px solid #EFEDE3;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 0;
    display: block;
    left: 50%;
    margin-left: -8px;
}

.paneTabs .active a:before {
    bottom: 0px;
    border-bottom: 8px solid #ccc;
}

.paneTabs .active a:after {
    bottom: -1px;
}

.paneTabs .activepersonal a,
.paneTabs .activepersonal a:hover {
    padding: 5px 22px 5px 16px;
}

/*Personal tabs*/

.paneTabs .personal a {
    display: block;
    text-decoration: none;
    padding: 3px 20px 3px 9px;
    margin: 0;
}

.paneTabs .external a {
    padding-left: 20px;
}

.paneTabs .external a:hover {
    padding-left: 20px;
}

.paneTabs .activepersonal a.paneTabOptions,
.paneTabs .personal a.paneTabOptions {
    position: absolute !important;
    display: inline;
    top: 4px;
    right: 5px;
    opacity: 0.3;
    filter: alpha(opacity=30);
    padding: 0;
}

.paneTabs a.paneTabOptions {
    display: none;
}

.paneTabs .activepersonal:hover a.paneTabOptions {
    opacity: 1;
    filter: alpha(opacity=100);
}

.paneTabs a.hiddenTabsLink img {
    height: 2px;
    width: 2px;
    opacity: 0;
    filter: alpha(opacity=0);
}

/*Panel tabs*/

/*@since 9.1*/

.panelTabs {
    list-style: none;
    padding: 0;
    margin: 0;
    background: transparent;
    font-size: 90%;
}

.panelTabs li {
    float: right;
    margin: 0!important;
    padding: 0!important;
    border-bottom: none!important;
    position: relative;
    top: 2px!important;
}

.panelTabs li.active {
    z-index: 2;
}

.panelTabs li a,
.panelTabs li.active a {
    padding: 4px 9px;
    text-decoration: none;
    top: 0!important;
    display: inline-block;
}

/*End panel tabs*/

/* Used for Alignments */

.collapseTabs {
    margin-bottom: 12px;
}

.collapseTabsData {
    position: relative;
    -moz-border-radius: 3px;
    background: #D1EAEF;
    padding: 12px 18px;
    word-wrap: break-word;
}

.containerTabsCollapsed {
    border: none;
}

.collapseTabs li a {
    text-decoration: underline;
}

.collapseTabs li.active {
    z-index: 1000;
}

/* @end TABS*/

/* @group SEQUENCE MAP */

.sequenceMapHead {
    margin: 6px 0
}

.sequenceMapHead h3 {
    margin: 12px 0 6px
}

.sequenceMapHead p {
    margin: 0 0 6px;
    padding: 0;
    font-size: 95%;
}

/* @end SEQUENCE MAP*/

/* @group SEARCH RESULTS */

div.searchResultList-sortOptions {
    border-bottom: 1px solid #bbbbbb;
    padding: 10px;
    margin-bottom: 15px;
    text-align: right;
    min-height: 20px;
}

div.searchResultList-sortOptionsCount {
    width: auto;
    float: left;
}

/* @end SEARCH RESULTS*/


/* @group DYNAMIC ELEMENTS */

.modalOverlay {
    display: none;
    opacity: .01;
    filter: alpha(opacity=1);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 90;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
}

/* Default flyoutmenu, contextual menu, live area attributes. */

.actionBar .mainButton:first-child .flyout {
    margin: 0 0 0 -2px
}

/*Live area and preview area for editable areas */

.liveArea,
.previewArea {
    padding: 9px 14px;
    margin: 0 0 5px 0;
    width: auto;
    position: relative;
}

ul.tree li a + img + a:focus,
ul.tree li img + img + a:focus,
    /*TOC node highlight*/
div.treeContainer ul.tree li a.itemActive,
#learningUnitToc ul.tree li a.itemActive,
ul.tree li a.itemActive {
    border-width: 1px;
    padding: 1px 2px;
    margin: 0 0 0 -2px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

/*Lesson Plans form builder*/

.builderItem .liveArea {
    position: absolute;
    top: 12px;
    left: 22px;
    z-index: 100;
}

.previewArea {
    border: 2px solid #ddd;
    margin-top: 0px;
}

/* cs paging controls */

.jumptopage,
.inventory_paging.jumptopage {
    padding: 8px 24px 8px 12px;
    text-align: left;
    position: relative;
}

.jumptopage label {
    font-size: 90%
}

.liveAreaTab,
a.liveAreaTab,
a.liveAreaTab:hover,
a.liveAreaTab:focus,
.actionBar ul li a.liveAreaTab:focus,
.actionBar ul li.mainButton a.liveAreaTab,
.actionBar ul li.secondaryButton a.liveAreaTab,
.panelTabs li.active a.edit,
.panelTabs li.active a.edit:hover,
.panelTabs li.active a.edit:focus {
    position: relative;
    z-index: 2;
}

.actionBar ul li.mainButton a.liveAreaTab,
.actionBar ul li.secondaryButton a.liveAreaTab {
    overflow: hidden;
}

.liveArea-slim {
    padding: 3px 5px
}

.smallControls {
    font-size: 90%;
    margin-top: 3px!important;
    min-width: 19em;
}

.smallControls .stepHelp {
    font-size: 100%!important;
    padding: 0;
}

.smallControls input[type="text"],
.smallControls select {
    padding: 0!important;
    width: 100%;
}

.smallControls .label {
    width: 29%
}

.smallControls .field {
    width: 70%
}

.columnActions .nav .sub ul {
    margin-top: 0
}

/*Flyout menus*/

/*Default location*/

.nav .sub ul,
.nav .sub .flyout {
    position: absolute;
    display: none;
}

.nav .sub ul li {
    margin: 0;
    padding: 0;
    float: none;
}

.nav .sub ul ul,
.nav .sub .flyout ul {
    display: block
}

/*show the submenus on hover or mouseover (except IE where it's done with javascript)*/

.nav .sub:hover ul,
.actionBarMicro .nav .sub:hover ul,
.nav .sub:hover .flyout {
    top: 22px;
    left: 0px;
    z-index: 101;
}

/*Reducing top position for smaller menus*/

.actionBarMicro .nav .sub:hover ul,
.rumble_top .nav .sub:hover ul,
.rumble .nav .sub:hover ul {
    top: 18px
}

/*.quickAddPal is a miniatiure data collection element.*/

.quickAddPal {
    width: auto
}

/* color picker palette - uses a grid of swatches which is wider than 19em */

.quickAddColor {
    width: 311px
}

.quickAddColor a.genericButton {
    float: left;
    margin: 2px 0;
}

/* Links inside the flyout menu and a contextual menu.. */

/* TODO: This is the only theme that defines the #loginLang version of this style - if it can go everywhere then move to shared.css and cleanup this style */

.nav .sub ul li a,
.cmdiv a,
.menumini a,
#loginLang ul li a {
    width: 190px;
    background: transparent;
    color: #333;
    font-weight: normal;
    text-decoration: none;
    display: block;
    margin: 0;
    padding: 5px 6px 5px 12px;
    border: 0;
    text-shadow: none;
    zoom: 1;
    overflow-x: hidden;
    overflow-y: visible;
    word-break: normal;
    word-wrap: break-word;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    font-size: 95%;
}

/* Contextual menu link specific attributes */

.cmdiv a {
    font-size: 95%;
    border: none;
}

.nav .sub ul li a:hover,
.nav li.sub ul li a:focus,
.cmdiv a:hover,
.cmdiv a:focus,
.menumini a:hover,
.menumini a:focus,
#loginLang ul li a:hover,
#loginLang ul li a:focus {
    border: 0;
    cursor: pointer;
    text-decoration: none;
}

/*Tabbed pane tabs*/

.paneTabs .nav .sub ul li a {
    text-align: left
}

/*Time selection div*/

.timediv ul li a:hover,
.timediv ul li a:focus {
    padding: 3px 6px
}

.topGlobalLinks .nav .sub:hover ul {
    top: 0px;
    left: 0px;
    z-index: 101;
}

.topGlobalLinks .nav .sub:hover ul {
    top: 0px;
    right: 0px;
    left: auto;
    z-index: 101;
}

.cmdiv li.contextmenubar_top a,
.cmdiv li.contextmenubar_top a:focus,
.cmdiv li.contextmenubar_top a:hover,
.currentTags a.closeCloud,
.currentTags a.closeCloud:hover,
.currentTags a.closeCloud:focus {
    padding: 6px 4px 4px;
    overflow: hidden;
}

/*Dynamic data collection palettes*/

/* Wrapping container for keyboard-accessibility and  quick-add palettes is the same as that for cmdiv above.
    See "div.quickAddPal, div.keyboardAccess" above. */

.quickAddPal h3,
.keyboardAccess h3,
.quickAddPal .quickAddPalHeader {
    font-size: 105%;
    font-weight: bold;
    margin: 0 0 8px;
    padding: 8px 8px 4px;
}

.quickAddPal .controls,
.keyboardAccess .controls,
.comText .controls,
.e_expandArea .controls {
    border-top: 2px groove rgba(255, 255, 255, 0.5);
    clear: both;
    margin: 9px -4px 2px;
    padding: 8px 9px 4px;
    text-align: right;
}

.keyboardAccess p.paletteHelp {
    margin: 6px 9px;
    padding: 3px 6px;
    white-space: normal;
    border: 1px solid #ffcc00;
    font-size: 90%;
}

/*Multi-colum flyout*/

.bcMenuDiv-1 {
    width: 190px
}

.bcMenuDiv-2 {
    width: 380px
}

.bcMenuDiv-3 {
    width: 570px
}

.bcMenuDiv-4 {
    width: 760px
}

.bcMenuDiv-5 {
    width: 950px
}

.flyout {
    padding: 9px 12px 9px !important
}

.nav .sub .flyout div {
    position: static;
    padding-bottom: 6px;
    margin: 0;
    min-height: 1px;
    float: left;
}

.flyout h3 {
    font: italic 95% Georgia, serif;
    letter-spacing: 2px;
    margin: 9px 0 0 9px;
    padding: 0;
}

.flyout h3 .line {
    border-top: 1px solid #ccc;
    height: 1px;
}

.nav .sub .flyout ul {
    position: static;
    background: transparent;
    padding: 6px 0px;
    margin: 0px 0px;
    border: 0;
    border-top: 1px dotted #ccc;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    z-index: 1000;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}

.nav .sub .flyout div h3 + ul,
.nav .sub .flyout div ul:first-child {
    border-top: 0
}

.nav .sub .flyout a,
.nav .sub .flyout a:hover,
.nav .sub .flyout a:focus {
    width: auto;
    border: 0;
    text-shadow: none;
}

/* @group COLOR SWATCH PALETTE */

.quickAddPal .colorlist {
    margin: 6px 0 9px 6px;
    width: 288px;
}

.quickAddPal .stepcontent .colorlist li {
    margin: 0;
    padding: 0;
    float: left;
    border: 1px solid #333!important;
    width: 14px;
    height: 14px;
    overflow: hidden;
    cursor: pointer;
}

.quickAddPal .colorlist li a,
.quickAddPal .colorlist li a:link {
    display: block;
    width: 14px;
    height: 14px;
    overflow: hidden;
}

.quickAddPal .colorlist li a:hover {
    border: 1px solid #333;
    width: 12px;
    height: 12px;
}

.quickAddPal .colorlist li a:active,
.quickAddPal .colorlist li a:focus {
    border: 2px solid #fff;
    width: 10px;
    height: 10px;
}

.quickAddPal .colorlist li a.whiteSwatch:active,
.quickAddPal .colorlist li a.whiteSwatch:focus {
    border: 2px solid #ddd;
    width: 10px;
    height: 10px;
}

.quickAddPal .colorPreview {
    padding: 3px;
    background: white;
}

.quickAddPal .colorPreview img {
    background: black;
    width: 42px;
    height: 42px;
    border: 1px solid #444;
    display: block;
    margin: 3px;
    float: left;
}

.quickAddPal .colorPreview div {
    float: left;
    margin-left: 3px;
    width: 66%;
}

.quickAddPal .colorPreview span {
    margin: 0;
    padding: 0;
    color: black;
    font-size: 100%;
}

/* @end COLOR SWATCH*/

/* @end DYNAMIC ELEMENTS*/

/* @group MESSAGES */

.receipt,
.warning,
.inlineDialog {
    margin: 0 0px 6px 0px;
    padding: 6px 9px;
    position: relative;
    border: 1px solid #bbb;
}

.tabbedPane.contentPaneWide .receipt {
    border: 0;
    margin: -12px 0 10px;
    padding: 12px 24px;
    position: relative;
    z-index: 201;
}

.contentPane .receipt,
.contentPaneWide .receipt {
    border: 0 none;
    margin: 0 0 -5px;
    padding: 12px 24px 16px;
    z-index: 0;
}

.container .receipt {
    border: 0 none;
    box-shadow: none;
    margin: 0 0 6px;
    padding: 6px 12px;
    z-index: 0;
    display: inline-block;
}

.receipt ~ #editmodeWrapper,
.receipt ~ .contentBox {
    z-index: 1;
}

.sideTOC_panel .receipt ~ #editmodeWrapper {
    position: static
}

.tabbedPane .receipt a.close img,
.contentPane .receipt a.close img,
.contentPaneWide .receipt a.close img,
a.closeCopyright img {
    display: none;
}

.tabbedPane .receipt a.close,
.contentPane .receipt a.close,
.contentPaneWide .receipt a.close {
    right: 12px;
    top: 10px;
    width: 16px;
    height: 16px;
}

.receipt a.close:before,
a.closeCopyright:before {
    content: "X";
    font: 18px/1 "Utilicons";
}

.receipt a.close:hover,
.receipt a.close:focus {
    filter: alpha(opacity=100);
    opacity: 1;
}

.inlineDialog {
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    padding: 1px 4px;
}

.inlineReceipt {
    margin: 6px 0px;
    padding: 6px 9px;
    position: absolute;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    display: none;
}

/*Floating receipt used with selection elements in the drawer*/

.miniReceipt {
    position: absolute;
    z-index: 300;
    padding: 2px 12px;
    border: 1px solid #bbb;
}

.container .warningReceipt {
    padding-right: 24px;
}

/*Warning Receipt*/

.contentPane .warningReceipt a.close {
    top: 5px;
    right: 5px;
}

.infoAlert {
    border: 1px solid #CCCCCC;
    border-radius: 4px 4px 0 0;
    padding: 5px 24px 5px;
    position: relative;
    margin-bottom: -1px;
}

.infoAlert span {
    display: block;
    min-height: 35px;
    position: relative;
    padding: 5px 140px 5px 0px;
    border-top: 1px solid #CCC;
}

.infoAlert span:first-child {
    border-top: 0px;
}

.infoAlert .button-1 {
    margin-top: -15px;
    position: absolute;
    right: 0px;
    top: 50%;
}

.attention {
    border-width: 2px;
    font-weight: normal;
    margin: 0 0 0 10px;
    padding: 4px 12px;
}

.brokenFileLink,
.portlet span.due.warning {
    border: 1px solid #BF1B17;
    display: inline-block;
    *position: static;
}

.infoBox {
    text-align: center;
    border: 1px solid #AFDF61;
    margin: 6px 0;
    padding: 6px 9px;
}

.infoBox > .message {
    display: block;
    margin-bottom: 4px;
}

.nestedReceipt {
    /* used to position a receipt within a random block in assessments */
    margin: 0 20% 6px 0 !important;
    padding: 6px 30px 12px 12px !important;
    z-index: 1001;
}

.receipt[id*="receipt_nested"] {
    padding-right: 28px
}

/*Notifications settings page bubbles.*/

.columnMsgWrapper {
    margin-left: 60%
}

.columnMsgWrapper .column-2 {
    min-height: 1px
}

.smsIssue,
.t2vIssue {
    margin: 3px 3px 9px;
    position: relative;
}

/*Info bubble stems*/

.bubbleStem-bottom-center {
    width: 0px;
    height: 0px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 12px solid #FFCC33;
    border-bottom: 0;
    position: absolute;
    bottom: -12px;
    left: 50%;
    margin-left: -8px;
}

/* next steps receipt */

.nextStepsReceipt {
    border-top: 1px solid #ccc;
    position: relative;
    padding: 0px;
    line-height: 1.4;
    margin: 10px -30px -20px -30px;
}

.nextStepsText {
    padding: 18px 12px;
    margin: 0 0 0 20px;
}

.nextStepsText h5 {
    text-shadow: 1px 1px 1px #fff;
    display: inline-block;
    line-height: 2em;
    min-width: 6em;
}

.receiptCollapsed {
    font-size: 90%;
    position: relative;
}


/*Data collection step warnings*/

.stepcontent li.fieldError {
    border-bottom: 1px solid #fff;
    padding: 2px 0 0 2px;
}

.stepcontent li.fieldError .fieldErrorText,
span.warningMsg {
    color: red;
    font-weight: bold;
}

span.warningMsg {
    display: inline;
    margin-left: 0px;
}

/* @end MESSAGES*/

/* @group PICKERS */

/* @group CONTENT DISCOVERY PICKER */

.criteriaSummary {
    border-bottom: 1px solid #CCCCCC;
    margin: 0 -28px 0 0;
    padding-bottom: 12px;
    padding-left: 12px;
}

#bb-question-discover h2 {
    font-size: 110%
}

#filterContainer h2,
#filterContainer .columnActions {
    margin-left: 14px
}

.criteriaSummary h3 {
    margin: 6px 0 3px;
    padding: 0;
    font-size: 100%;
}

.criteriaSummary .hidden {
    display: none;
    visibility: hidden;
}

.criteriaSummary ul {
    margin: 0;
    padding: 0;
}

.criteriaSummary ul li {
    float: left;
    margin: 0 1px;
    padding: 3px 0 2px 9px;
    font-size: 90%;
    white-space: nowrap;
    border-radius: 12px;
}

.criteriaSummary ul li:first-child {
    margin-left: 0
}

.criteriaSummary ul li strong {
    display: block;
    float: left;
    font-weight: normal;
    margin: 0;
}

.criteriaSummary ul li strong:before {
    content: "+";
    font-weight: bold;
    font-size: 120%;
    line-height: 1;
    position: relative;
    left: -2px;
}

.criteriaSummary ul li:nth-child(2) strong:before {
    content: none
}

.criteriaSummary ul li span,
.criteriaSummary ul li a {
    display: block;
    float: left;
    padding: 1px 5px;
    margin: 0 3px 0px;
    white-space: nowrap;
    border-radius: 12px;
}

.criteriaSummary ul li span {
    margin-left: 0
}

.criteriaSummary ul li strong + span {
    margin-left: 3px
}

.criteriaSummary ul li a {
    padding-right: 18px;
}

/*Search current results within Discovery picker*/

.search-element {
    border-bottom: 1px solid #CCCCCC;
    padding: 18px 3px 29px 9px;
}

.search-element h2 {
    display: inline-block;
    font-weight: normal;
    font-size: 100%;
    width: 0;
    height: 22px;
    overflow: hidden;
    line-height: 1;
    margin: 0!important;
    vertical-align: Middle;
}

.search-element h2:before {
    content: "F";
    font: 17px/1 "Utilicons";
    position: relative;
    margin: 0 3px 6px 0;
    top: 2px;
    vertical-align: middle;
}

.search-element input[type="text"] {
    width: 60%;
    -moz-appearance: searchfield;
    -webkit-appearance: searchfield;
}

/* @end DISCOVERY PICKER*/

/* calendar date picker styles */

.calPicker {
    z-index: 1500 !important
}

.calPicker .calHead {
    position: relative;
    padding: 3px;
}

.calPicker h3 {
    margin: 0 40px;
    border: none;
    padding: 0;
    background: none;
    text-align: center;
}

.calPicker .previous {
    position: absolute;
    top: 2px;
    left: 2px;
}

.calPicker .next {
    position: absolute;
    top: 2px;
    right: 2px;
}

.calPicker div.calFoot {
    clear: both;
    padding: 6px 3px;
    text-align: center;
}

.calPicker a.contextmenubar,
.calPicker a.contextmenubar:hover {
    display: block;
    padding: 0px 2px 2px 2px;
    text-align: right;
}

.pickerMonth {
    position: relative;
    margin: 6px auto;
    border-collapse: collapse;
    font-size: 95%;
    min-width: 200px;
}

.pickerMonth thead th {
    border: 1px solid #aaa;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #cccc;
    padding: 2px;
    width: 24px;
    font-weight: bold;
    text-align: center;
    vertical-align: top;
}

.pickerMonth tbody td {
    width: 24px;
    background: white;
    border: 1px solid #ccc;
    padding: 2px;
    text-align: right;
    white-space: nowrap;
}

.pickerMonth td a {
    display: block;
    position: relative;
    text-decoration: none;
    width: 100%;
}

.pickerMonth td a img {
    float: left
}

.pickerMonth .offday a {
    display: none;
}

/*Time picker*/

.timediv {
    padding: 2px 0 0 4px
}

.timediv ul {
    width: 8em;
    height: 200px;
    overflow: auto;
}


.timediv ul li a {
    padding: 3px 6px;
    background-image: none;
}

/*Content System Picker*/

.csPicker {
    padding: 0 12px 0 6px;
    min-width: 300px;
    font-size: 95%;
}

.csPicker .actionBar,
.csPicker .localViewToggle {
    font-size: 110%
}

.csPicker .contentPaneWide,
.csPicker .breadcrumbs {
    margin-left: 0;
    margin-right: 0;
}

.csPicker .itemTray {
    z-index: 1000
}

.csPicker .itemTray .taskbuttondiv {
    margin: 0;
    font-size: 105%;
}

.csPicker .itemTray h3 {
    font-size: 115%
}

.csPicker #titleicon + h1 {
    margin-top: 2px
}

.csPicker .itemTray #numberOfElements {
    padding: 0 2px
}

/* @end PICKERS*/

/* @group LIGHTBOX */

.lb-wrapper .contentBox {
    border: none;
    box-shadow: none;
}

.lb-wrapper #dataCollectionContainer {
    margin: 0;
}

.lb-wrapper .contentPaneWide,
.portalPane {
    margin: 0;
}

/*End styles for lightbox.js*/

/*Generic lighbox styles*/

/*lightboxWrapper is positioned absolutely within a browser window.
It allows lighbox hover over other items on the page */

#lightboxWrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
}

/*lightboxWrapper-inner is positioned relatively and it's text alignment is set to center.*/

#lightboxWrapper-inner {
    position: relative;
    top: 0;
    left: 0;
    text-align: center;
    width: 100%;
    z-index: 1002;
}

#lightbox {
    display: block;
    margin: 40px 0 0 0;
    position: relative;
    top: auto;
    left: auto;
    z-index: 1003;
    text-align: left;
}


#lightbox #lightboxContent {
    padding: 1px 0 0 0;
    width: 600px;
    margin: 0 auto;
    position: relative;
    border: 2px solid #333;
}

/* used to wrap around lightbox content (if necessary) */

.lb-container,
.lb-content .container {
    padding: 10px 12px 12px;
    min-height: 0!important;
}

#overlay {
    display: none;
    opacity: .30;
    filter: alpha(opacity=30);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
}

/*Load messages*/

#lightbox.done #lbLoadMessage {
    display: none
}

#lightbox.done #lbContent {
    display: block
}

#lightbox.loading #lbContent {
    display: none
}

#lightbox.loading #lbLoadMessage {
    display: block
}

.avatar {
    margin: auto;
    border: 1px solid #ccc;
    padding: 4px;
}

.myavatar {
    overflow: hidden;
    max-height: 150px;
    margin-bottom: 12px;
}

#lightbox .tallPara {
    padding: 14px 10px;
    margin: 0;
}

#lightbox ul {
    margin: 4px 0 12px
}

#lightbox ul li {
    padding: 3px 0
}

#lightbox ul li a:hover {
    text-decoration: underline
}

div.lbContainer p.taskButtonsContent {
    margin: 12px 0px 6px 0px
}

/* @end LIGHTBOX */

/* @group ITEM STATES */

.unsavedItem,
.unsavedItem td:first-child {
    padding-left: 18px;
}

.unsavedItem td {
    background-image: none
}

a.selectedItem,
a.selectedItem:focus {
    border: 2px solid #9bb4cf;
    border-bottom: none;
    -moz-border-radius: 2px 2px 0 0;
    -webkit-border-radius: 2px 2px 0 0;
    padding: 3px 4px;
    top: 3px;
    position: relative;
    z-index: 10001;
}

tr.inEditMode-row {
    border: 0
}

/* @end ITEM STATES */

/* @group DATA COLLECTION */

.popup #dataCollectionContainer {
    margin: -12px -20px
}

div#dataCollectionContainer div.contentBlock {
    margin: 0pt 0 0em;
    padding: 6px 0;
    border: 0;
}

.inventoryListContainerDiv {
    padding: 0
}

#bb-question-discover .inventoryListContainerDiv,
.picker .inventoryListContainerDiv {
    padding-left: 12px
}

.blogContainer .inventoryListContainerDiv {
    padding: 0
}

div[id*="step"],
.submittitle,
#infoStep,
#taskStatusStep,
#linkedContentStep {
    padding: 0px 24px 34px 12px;
    border-top: 1px solid #ccc;
}

div#step1 {
    margin-top: 34px;
}

.submitStepTop + div#step1,
.taskbuttondiv + div#step1 {
    margin-top: 0;
}

/* Step Title */

.steptitle,
.submittitle {
    font-size: 110%;
    margin: 0 0 18px 0;
    padding: 0;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 1.7px;
    word-spacing: 0px;
    display: inline-block !important;
    top: -15px;
    padding: 0 12px 0 0;
    margin-left: 9px;
    margin-bottom: 24px;
    color: #444;
    margin-left: -14px;
    padding-left: 12px;
}

.submittitle {
    display: none!important;
}

h3.steptitle {
    display: block;
    clear: both;
}

.submittitle {
    padding: 18px 24px 18px 12px;
    margin: 0;
}

/* Span within steptitle to display step number */

.steptitle span,
.submittitle span {
    font-size: 140%;
    line-height: 1;
    text-align: right;
    width: 1.5em;
    display: inline-block;
    width: 0;
    overflow: hidden;
    opacity: 0;
    margin-left: -18px;
}

/* Span within steptitle to display step number */

.steptitle span,
.submittitle span {
    color: #939393;
}

.submittitle span {
    margin-right: 3px
}

#toolSettingsForm .steptitle span {
    display: none
}

#toolSettingsForm .stepcontent {
    padding-left: 20px
}

#toolSettingsForm .steptitle {
    padding-left: 9px
}

#toolSettingsForm .steptitle.submittitle {
    padding-left: 27px
}

/*Step title in case if there's  no step number.*/

h3.noNumber {
    padding: 4px 16px 5px 16px
}

/*Step Content*/

/* Fieldset groups related controls within a step */

.stepcontent {
    padding: 0;
    margin: 0;
    border: none;
}

/* Spacing list elements and giving the bottom border */

.stepcontent li {
    margin-bottom: 6px;
    padding-bottom: 6px;
}

.stepcontent ol li div.label {
    font-weight: normal;
}


.stepcontent li li {
    border: 0!important
}

/*recovering from issue caused by the floated 'columns'*/

.stepcontent li:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/*Help text following step header. */

/*Help text following step header. */

.stepcontent .stepHelp,
.stepHelp {
    margin: 0 0 6px;
    padding: 0 0 4px;
    border-bottom: none;
    font-family: Georgia, serif;
    font-style: italic;
    display: inline-block;
    font-size: 105%;
}

.stepcontent .fieldHelp {
    color: #666666;
    font-size: 100%;
    padding: 2px 0 8px;
    display: block;
}

a.browse + .fieldHelp {
    padding-top: 9px
}

/*Nested lists*/

.stepcontent .nestedList li {
    border: 0;
    padding: 1px 0;
    margin: 0;
}

.nestedListSmall li {
    font-size: 90%
}

.nestedSubList {
    margin: 6px 6px 6px 30px
}

/*Lite step content. Used when step content contains no fieldset element.*/

.stepLite {
    padding: 6px 16px 12px 16px
}

/*Step containing columns*/

.columnStep .column-3 {
    min-height: 200px
}

.columnStep .column-3 table.attachments {
    font-size: 90%
}

.columnStep div h3 {
    margin: 6px
}

.columnStep div div {
    padding: 6px
}

ol.nestedList li div.imgLabel {
    width: auto
}

ol.nestedList li div.imgLabel span.fileName {
    font-weight: bold;
    padding: 0 6px 0 0;
    display: inline;
    color: #000;
}

ol.nestedList li div.imgLabel span.control {
    display: inline
}

#title_color_value {
    padding-top: 6px
}

/*Setting up a two-column layout*/

div.label,
div.gb_gridCell_inner h3.label {
    float: left;
    width: 20%;
    min-width: 6em;
    max-width: 15em;
    margin: 0 0px 3px;
    position: relative;
    word-wrap: break-word;
}

.required div.label label {
    padding-left: 20px;
    display: block;
}

div.label-stack {
    display: block;
    float: none;
    width: auto;
    max-width: none;
}

div.field,
div.noLabelField {
    float: left;
    width: 79%;
    margin: 0 0px 3px;
    word-break: normal;
    word-wrap: break-word;
    overflow: visible;
}

div.noLabelField {
    width: 100%
}

div.label span.contextMenuContainer {
    display: inline
}

span.stepHelp br,
span.fieldHelp br {
    display: block;
}

div.field ol p,
div.noLabelField ul p {
    padding-bottom: 3px
}

div.field em {
    font: italic 100% Georgia, serif;
    margin-top: 5px;
    display: inline-block;
    color: #888;
}

/* Required field indicator legend. */

.reqfield {
    float: left;
    padding: 24px 0 0 32px;
    font: italic 105% Georgia, serif;
    position: relative;
    display: block;
    line-height: 2;
}

/*Required field*/

.reqfield:before,
.required > .label > label:before {
    content: "*";
    position: relative;
    vertical-align: top;
    display: inline-block;
    margin-right: 1px;
    color: #FF8000; /* color needed for mybb pages which do not get theme css applied if_mybb.css does not get to reply lightbox (iframe) in mybb thread reply*/
}

.required > .label > label:before {
    position: absolute;
    left: 0px;
}

.reqfield img,
.required > .label > label img {
    display: none
}

.requiredField {
    padding: 6px 0 6px 16px;
    display: inline-block;
}

div.label img.indicator {
    position: absolute;
    left: -18px;
    top: 0px;
}

/*Used for submittable individual step content elements.*/

/*Making individual step element text larger (Grade Center).*/

.largeText div.label,
.largeText div.field {
    font-size: 130%;
    font-weight: bold;
}

/*Reducing button text size.*/

.largeText a.browse {
    font-size: 75%!important;
    font-weight: normal;
    margin: 0 0 0 3px;
}

.field a.browse {
    font-size: 95%;
    margin: 0 0 0 3px;
}

div.editBlock {
    float: left;
    margin-right: 12px;
    width: 100%;
}

div.editBlock table.mceLayout table.mceToolbar {
    background-color: transparent;
}

.editgrade ol {
    padding: 16px;
}

.gb_gridCell_inner ~ .contentAreaBlock {
    margin-left: 0;
    margin-right: 0;
}

.largeText div.field div.editBlock label {
    font-size: 80%;
    font-weight: normal;
}

.largeText div.field div.exemptdiv label {
    font-size: 65%
}

.largeText textarea {
    font-size: 80%
}

/*list element in edit mode.*/

li.inEditMode {
    border: 2px solid #444!important;
    padding: 3px 9px;
}

/* Email Items UI Customization (LRN-35721) */

/*Flyout Areas */

.e_expandArea {
    margin-top: 21px;
}

#e_groups_menu {
    border: 1px solid #aaa;
    top: 8px;
}

/* Used to indent a nested list - needed for a list of child form elements */

/*Parent-child list*/

.parent-child-listing {
    width: 50%;
}

.parent-child-listing .stepHelp {
    margin-left: 24px;
}

.parent-child-listing ul {
    border-left: 1px dashed #CCCCCC;
    margin: -4px 0 12px 10px;
    padding: 0 0 0 9px;
}

.parent-child-listing li {
    margin: 0;
    padding: 4px 0;
}

/* @group HIERARCHICAL LIST (inside DCP step) */

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

.stepcontent .hierarchy li,
ol.hierarchy li ol li {
    padding: 0px 0 9px 0px;
    margin: 0;
    border: 0;
    border-top: 1px solid #ddd;
}

ol.hierarchy li ol {
    padding: 0px 0 0 0px;
    margin: 8px 0 0 30px;
}

ol.hierarchy li h5 {
    position: relative;
    font-size: 100%;
    margin: 0;
    padding: 8px 11em 3px 3px;
}

ol.hierarchy li h5 span {
    display: inline;
    font-size: 100%;
    border-bottom: none;
}

ol.hierarchy li h5 a {
    position: absolute;
    right: 0;
    top: 9px;
    font-weight: normal;
    font-size: 90%;
}

ol.hierarchy li div {
    font-size: 95%;
    vertical-align: middle;
    padding: 9px 2px 2px 12px;
    text-align: right;
}

ol.hierarchy li div.gbData span {
    display: inline;
    font-size: 100%;
    padding: 2px 0px 2px 9px;
    margin: 0 0 0 9px;
    border-left: 1px dotted #ccc;
}

ol.hierarchy li div.gbData span:first-child {
    border-left: none;
    margin-left: 0;
    padding-left: 0;
}

ol.hierarchy li div input.points,
ol.hierarchy li div input {
    vertical-align: middle;
}

ol.hierarchy li div input.points {
    width: 2em;
}

ol.hierarchy li div input.name {
    width: 16em;
}

li.parent {
    padding-bottom: 0!important;
}

ol.hierarchy li.parent ol li h5 {
    background-image: none;
}

/* @end HIERARCHICAL LIST */

/* @group STEP PANELS */


.stepPanels {
    padding: 6px 0px 12px 0px;
    margin: 0px;
    border: none;
}

.stepPanels li {
    border-bottom: none
}

.panelTitle {
    margin: 4px 0 0 0;
    padding: 3px 5px;
    position: relative;
    cursor: pointer;
}

.panelTitle a {
    display: block;
    width: 100%;
}

.panelTitle .date {
    font-weight: normal;
    font-size: 95%;
    text-decoration: none;
    position: absolute;
    right: 6px;
    top: 2px;
}

.panelTitle a span {
    display: inline;
    padding: 2px 0;
    color: black;
    font-size: 100%;
}

.mdList,
.stepPanel {
    margin: 0 0 9px 0;
    padding: 9px 18px;
}

.mdList h4,
.stepPanel h5 {
    margin: 0;
    padding: 0;
    font-size: 95%;
}

.mdList p,
.stepPanel p {
    margin: 5px 5px 5px 12px;
    padding: 0;
    font-size: 95%;
}

.stepPanelControls {
    font-size: 90%
}

.contentAreaBlock {
    border: 1px solid #ddd;
    margin: 0 24px 24px;
}

.contentAreaBlock #step1 {
    border-top: 0
}

/* @end STEP PANELS*/

/*Submit button step*/

.taskbuttondiv,
.taskButtonsContent,
.okbutton {
    padding: 12px 24px 24px 58px;
    /*LL step redesign*/
    margin: 0;
    text-align: right;
}

/*LL step redesign*/

#bottom_submitButtonRow {
    display: inline-block;
    float: right;
}

.picker .taskbuttondiv {
    padding: 9px 0 9px 58px
}

.container .taskbuttondiv:first-child {
    margin-top: 0
}

/*LL step redesign*/

/* adjusts margin on sequence map "build/canvas" page */

div#dataCollectionContainer .taskbuttondiv:first-child,
div#dataCollectionContainer .reqfield + .taskbuttondiv,
div#containerdiv .mapCanvasForm .taskbuttondiv:first-child {
    padding: 18px 24px 18px 58px;
    margin: 9px 0 0 0;
}

#customizeDataCollection .taskbuttonhelp {
    padding: 12px
}

div#dataCollectionContainer .taskbuttonhelp + .taskbuttondiv {
    padding: 0 24px 18px 58px
}

span.stepTitleRight p.taskbuttondiv,
span.contentListRight p.taskbuttondiv {
    font-weight: bold;
    margin: 0 !important;
    padding: 0 !important;
}

.taskButtonsContent {
    padding: 9px 12px 0 12px;
    margin: 24px -12px 0 -12px;
    border-top: 1px solid #ddd;
}

p.okbutton input {
    font-size: 100%;
    padding: 1px 6px;
}

.taskbuttonhelp {
    padding: 0 0 0px 38px;
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 105%;
    display: inline-block;
    margin-top: 12px;
}

#taskbuttondiv p {
    text-align: left;
    font-size: 90%;
    display: block;
    font-style: italic;
    margin: 6px 0;
    border: 1px solid red;
}

.stepTitleRight {
    left: auto;
    padding: 6px;
    position: absolute;
    right: -2px;
    top: -2px;
}

/*Fieldset legend*/

legend {
    position: absolute;
    top: -10000px;
    line-height: 0;
    height: 0px;
}

/*Tagging*/

fieldset ol li span.tagContainer input,
fieldset ol li span.tagContainer a.browse {
    font-size: 95%
}

fieldset ol li span.tagContainer,
fieldset ol li span.tagContainer span,
fieldset ol li ol li span.tagContainer,
fieldset ol li ol li span.tagContainer span {
    float: none;
    display: inline;
    padding: 2px 2px 2px 0;
    width: auto;
    font-weight: normal;
    font-size: 100%;
}

fieldset ol li span.tagContainer span.hidden,
fieldset ol li ol li span.tagContainer span.hidden {
    display: none
}

fieldset ol li span.hidden,
fieldset ol li ol li span.hidden,
.contentBlock ol li span.hidden {
    display: none
}

/* @group MULTI SELECT
 ----------------------------------------------- */

.selectItems {
    padding: 6px;
    border: 1px solid #ccc;
    display: none;
}

.itemSetRestrictions .u_floatThis-left {
    width: 40%;
}

.selectArrows.u_floatThis-left {
    width: 40px;
    padding-left: 20px;
}

.selectItems select {
    display: block;
    font-size: 100%;
    height: 115px;
    margin: 6px 0 0;
    width: 300px;
    max-width: 300px;
    /* required for IE, to override max-width:100%, which is set in core.css */
}

/* for moving values between adjacent select boxes. used by multiselect.vm and userRoleSelect.vm */

#dataCollectionContainer .noLabelField > .selectItems {
    padding: 15px 30px;
    position: relative;
}

#dataCollectionContainer .noLabelField > .userRoleSelect:before,
#dataCollectionContainer .noLabelField > .selectItems:before {
    content: "";
    position: absolute;
    border-left: 1px dashed #ccc;
    left: 347px;
    top: 0;
    bottom: 0;
}

#dataCollectionContainer .noLabelField > .userRoleSelect.selectItems:before {
    left: 358px
}

.selectItems input[type=button] {
    margin: 6px 0 0;
    max-width: 140px;
    white-space: normal;
    font-size: 90%;
}

.selectItems input[type=text] {
    display: block;
    margin: 6px 0;
    width: 300px;
    font-size: 100%;
}

.searchbar .selectItems .selectArrows,
.selectArrows {
    margin-top: 60px;
    position: relative;
}

.selectArrows a,
.selectArrows button {
    display: block;
    margin: 0 0 3px;
    border: none;
    padding: 0px;
    background-color: transparent;
}

.selectItems h4 {
    margin: 0 0 12px 56px;
    padding: 0;
}

/* extends multiselect widget for selecting user roles: userRoleSelect.vm */

.userRoleSelect {
    width: auto
}

.userSelectedRoles {
    position: relative;
    padding: 3px 0 6px 56px;
}

.userSelectedRoles .selectArrows {
    position: absolute;
    left: 20px;
    top: 28px;
    margin: 0;
}

.userSelectedRoles .selectArrows .disableArrows {
    pointer-events: none;
    cursor: default;
}

.selectItems .available-roles h4 {
    margin-left: 0
}

.selectItems .available-roles select {
    height: 200px
}

/*Multiselect widget*/

.multiSelect {
    padding: 0 0 12px 0
}

.multiSelect > div {
    width: 46%;
    float: left;
    margin: 0;
    padding: 3px;
}

.multiSelect select {
    width: 100%
}

.multiSelect .selectArrows {
    text-align: center;
    width: 5%;
    margin: 40px 0;
}

.widget {
    border: 1px solid #CCCCCC;
    margin: 6px 0;
    padding: 1px 6px;
}

.widgetControls,
table .widgetControls {
    font-size: 90%
}

.widget .spellCheck,
.widget .textBoxItem {
    float: right
}

/* @end MULTI SELECT*/

/* @end DATA COLLECTION*/

/* @group INLINE FORMS */

div.liveArea fieldset.stepcontent ol li {
    border: none;
}

.quickAddPal .stepcontent {
    margin: 0;
    padding: 3px 9px 3px 6px;
}

.quickAddPal .stepcontent li {
    margin: 0 2px;
    padding: 1px 1px 0 1px;
    border: 0;
}

.quickAddPal .stepcontent .label {
    width: 30%;
    padding-right: 2px;
    overflow: visible;
}

.quickAddPal .stepcontent .field {
    width: 65%;
}

/*Field Error text in DTP and QuickAdd palette*/

.quickAddPal li.fieldError .fieldErrorText {
    color: red;
    display: block;
    margin-left: 74px;
    font-weight: normal;
    font-size: 85%;
}

div.quickAddPal div.field input[type=text],
div.quickAddPal div.field select,
div.quickAddPal div.field textarea {
    width: 100%
}

div.quickAddPal li.stepHelp,
div.quickAddPal li div span {
    width: auto
}

div.field span.fileName {
    font-weight: bold;
    padding: 0 6px 0 0;
    display: inline;
}

div.field span.control {
    display: inline
}

div.quickAddPal div.field input.datePickerInput,
div.quickAddPal div.field input.timePickerInput {
    width: 8em
}

.dtpickerEndDiv {
    padding-top: 10px
}

div#texteditor {
    margin: 0;
    padding: 3px;
    float: left;
}

div#texteditor textarea {
    width: 450px;
    display: block;
    margin-left: 0;
}

div#texteditor a.textBoxItem {
    display: block;
    width: 80%;
    text-align: right;
    padding: 2px;
}

select.survey_question {
    max-width: 100%
}

/* @end INLINE FORMS */

/* @group VTBE */

.htmlarea .toolbar div > div {
    float: left;
    padding: 0 1px;
    height: 22px;
}

.htmlarea iframe {
    min-width: 300px!important
}

.htmlarea .toolbar a.wikiButton,
.htmlarea .toolbar a.wikiButton img {
    width: auto!important
}

.vtbe_footer {
    font-size: 90%;
    *font-size: 70%;
    color: #666;
    padding: 2px 6px;
    border: 1px solid #ccc;
    border-top: 0;
}

.vtbe_footer span {
    font-size: 100%;
}

.vtbe_footer input[type=button] {
    font-size: 95%;
}

.vtbe_footer a {
    margin: 0 0 0 3px
}

/*End Vtbe*/

/*VTBE resize handle*/

.resize_handle {
    height: 12px;
    cursor: n-resize;
    text-align: center;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #bbb;
}

.resize_handle img {
    width: 100%;
    height: 8px
}

/* @end VTBE*/

/* @group PREVIEWS */

/* @group THEME PREVIEW */

/*Preview Panel*/

.tabGroupsPreview {
    margin: -11px -12px 24px -12px;
    font-size: 100%;
}

.previewContent {
    position: relative;
    width: auto;
    padding: 14px;
    z-index: 1;
    margin: 0;
}

.previewContent iframe {
    height: 300px;
    width: 100%;
}

.tabGroupsPreview table div {
    display: block
}

.previewOverlay {
    font-size: 300%;
    font-weight: bold;
    height: 89px;
    letter-spacing: 10px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    z-index: 0;
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    /* IE 5-7 */
    filter: alpha(opacity=30);
    /* Netscape */
    -moz-opacity: 0.3;
    /* Safari 1.x */
    -khtml-opacity: 0.3;
    /* Good browsers */
    opacity: 0.3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.tabGroupsPreview .previewOverlay {
    top: 9px;
}

.previewOverlay span {
    background-color: white;
    opacity: .30;
    filter: alpha(opacity=30);
    padding: 6px 12px 6px 24px;
    position: relative;
    top: 27px;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    cursor: default;
}

p.warning {
    padding: 9px 18px;
    margin: 12px 0 24px 0;
    font-size: 100%;
}

div.tabPreview {
    position: relative;
    border: 12px solid #cdcdcd;
    width: auto;
    z-index: 1;
    margin: 0 6px 6px 6px;
}

div.tabPreview div.paneTabs {
    margin-top: 12px;
}

/* @end PREVIEW*/

.buttonLibrary {
    position: relative;
    padding: 6px 0 6px 207px;
}

.buttonLibrary li {
    float: left;
    border: none!important;
}

.buttonLibrary li a {
    display: block;
    padding: 3px 7px 3px 7px;
    text-align: center;
    text-decoration: none;
}

.buttonLibrary li a.selected {
    text-decoration: none;
    font-weight: bold;
}

.buttonLibrary li a:hover {
    text-decoration: underline
}

div.menuStyleStep {
    float: left;
    margin: 9px 40px 0pt 0pt;
    width: 212px;
}

div.menuDefaultStyleStep {
    margin: 9px auto;
    width: 212px;
}

.schemeWrapper {
    float: left;
    margin: 0pt 12px 0px 0px;
}

.buttonLibrary .schemeWrapper {
    float: none;
    margin: 0 9px 0 0;
    padding: 10px;
    margin-right: 9px;
}

.buttonLibrary .selected .schemeWrapper {
    padding: 10px;
}

.schemeWrapper span {
    font-size: 95%;
    text-align: center;
    display: block;
    font: italic 100% Georgia;
    padding: 6px 0;
}

ul.buttonLibrary li.selected {
    position: absolute;
    top: 6px;
    left: 0;
}

ul.buttonLibrary li {
    padding: 0 0 12px;
    margin: 0;
}

.schemePreview {
    width: 160px;
    padding: 12px 0px 0px 16px;
}

.modulePreview {
    width: 140px;
    height: 57px;
    padding: 0!important;
    font-size: 85%;
    margin: 6px 0 0 auto !important;
    position: relative;
    bottom: 0;
    right: 0;
    left: auto;
    border-width: 1px 0 0 1px;
    border-style: solid;
}

.schemePreviewHead {
    padding: 6px 9px !important;
    font-weight: bold;
    font-size: 110%;
}

.modulePreviewHead {
    font-weight: bold;
    padding: 4px 9px!important;
    margin: 0!important;
}

.schemePreviewBody {
    padding: 3px 0px 0px 9px;
    position: relative;
    overflow: hidden;
}

.modulePreviewBody {
    padding: 4px 9px 3px!important
}

/* @end PREVIEWS */

/* MODULES */

/* @group ADD MODULE */

.moduleList {
    border-top: 1px solid #ccc
}

.moduleItem {
    border-bottom: 1px solid #ccc
}

.module {
    overflow: hidden;
    padding: 0 10px;
}

.moduleHeading {
    overflow: hidden;
    padding: 10px 0;
}

.module h3 {
    display: inline;
    font-size: 110%;
    margin: 0;
}

.moduleDescription {
    width: 90%
}

.more {
    display: none
}

.moduleAction {
    margin: 10px 0
}

.moduleCategory {
    padding: 3px
}

.moduleCategory a {
    font-weight: bold
}

.moduleSample {
    display: none;
    padding-left: 10px;
}

.expandedModule .moduleDetails,
.expandedModule .moduleSample {
    width: 47%
}

.expandedModule .more {
    display: inline
}

.expandedModule .moduleSample {
    display: block
}

#moduleList.leftColumn-wide .contentListPlain,
.moduleListActionBar {
    padding-left: 18px
}

#moduleList .contentListPlain > li.expandedModule .moduleSample > div {
    min-height: 50px !important;
    word-wrap: normal;
}

/* @end ADD MODULE*/

/* @group PORTLET (MODULE) */


/* Modified some of the styling rules for retina displays. Modifications should be removed once rendering bug is fixed in Chrome browser. */

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    .portlet {
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

/*@branding -- do not remove*/

#moduleTitle,
.portlet h2 {
    padding: 8px 8px 8px 12px;
    background: transparent;
    margin: 0;
    font-size: 110%;
    position: relative;
    vertical-align: middle;
    overflow: visible;
}

.portlet h2 .moduleTitle {
    word-wrap: break-word
}

.portlet h2.dragHandle {
    padding-left: 20px
}

.portlet h2.dragHandle:hover {
    cursor: move
}

.portlet h2 a {
    color: #fff;
    padding: 0 12px 0 0;
    vertical-align: middle;
}

.portlet h2 a:hover {
    text-decoration: underline
}

.portlet h2 a img {
    vertical-align: middle
}

.portlet h2.noTitle {
    margin: 0;
    padding: 0;
    background: transparent;
    height: 1.4em;
}

.portlet h2.noTitle:hover {
    background: #ededed
}

.portlet a {
    text-decoration: none;
    word-wrap: break-word;
}

.edit_controls {
    padding: 7px 6px 0 0;
    text-align: right;
    float: right;
}

.edit_controls a {
    margin-left: 1px;
    vertical-align: top;
    padding: 0;
    text-decoration: none;
    z-index: 201;
    position: relative;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.portlet .edit_controls a:hover,
.portlet .edit_controls a:focus,
.portlet:hover .edit_controls a {
    text-decoration: none;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}

.edit_controls .moduleToggleLink {
    height: 14px;
    left: -4px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    padding: 3px;
    position: absolute;
    top: 3px;
    width: 14px;
    z-index: 201;
}

.edit_controls a img {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    width: 0;
    height: 0;
}

/* Collapsible area of the portlet. Holds all the content. */

.collapsible {
    overflow: auto;
    padding: 6px 12px 12px;
    border-top: 1px solid #ccc;
    clear: both;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}

.collapsible table {
    border-spacing: 3px 2px;
    border-collapse: separate;
    font-size: 90%;
}

.collapsible .help,
.portlet h1 + p,
.portlet h1 + p + p {
    margin: 0 9px 6px;
    font-size: 100%;

    font-style: italic;
    line-height: 1.45;
}

.imgWrapper {
    overflow: auto;
    margin: 6px auto;
    text-align: center;
}

.imgWrapper {
    overflow: auto;
    margin: 6px auto;
    text-align: center;
}


.portlet h3,
#lightbox h3,
.portlet div.portletBlock h4,
.portlet div.blockContents h4,
.flyout h3,
.labelMenuItem {
    margin: 9px 0px 3px;
    font-size: 100%;
    padding: 2px 0;
    font-weight: normal;
}

.labelMenuItem {
    display: block;
    margin: 0;
}

.flyout-menu .labelMenuItem {
    padding: 18px 6px 0 12px;
    text-transform: uppercase;
}

.portlet h4 {
    margin: 4px 0 0;
    padding: 1px 0 2px 0;
    text-indent: 0;
}

/* Support for various portlet content markup */

/*Module contents inside iframe (RSS)*/

.body-portlet {
    background: transparent;
}

.portletList {
    margin-bottom: 0;
}

.portletList:only-child {
    margin-bottom: 0;
}

.portlet .portletList li {
    padding: 7px 0 0 0;
    margin: 0 0 7px 0;
    border-top: 1px dotted #ccc;
}

.portlet .portletList li:first-child {
    border-top: none
}

.portlet .portletList li img {
    display: none
}

.portlet .courseListing li > a {
    font-weight: bold
}


.portlet .eventList li {
    padding: 0;
    margin: 0 0 2px 0;
}

.portlet .eventList li .event {
    padding: 2px 4px 2px 18px
}

.portlet .eventList li .description,
.portlet .eventDate {
    font-size: 90%
}

.portlet .eventList li .event a {
    font-weight: bold
}

.portlet span.origin {
    color: #999;
    font-size: 90%;
    font-weight: bold;
    border: 1px solid #ccc;
    padding: 0 4px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    margin: 0 0 0 3px;
}

.portlet .portletList-img > li {
    padding: 7px 0 0 0;
    margin: 0 0 7px 0;
    border-top: 1px dotted #ccc;
}

.portlet .portletList-img > li:first-child {
    border-top: none;
    /*     padding-top: 0; */
}

.portlet .portletList-img > li img {
    display: none
}

.portlet .courseInformation {
    text-indent: -16px;
    margin: 4px 0;
    padding: 0 0 0 16px;
}

.portlet .courseDataBlock {
    text-indent: -4px;
    margin: 4px 0;
    padding: 0 0 0 4px;
}

.portlet .courseDataBlock ul {
    margin-top: 5px
}

.portlet .courseDataBlock ul li {
    text-indent: 0
}

.portlet .calculatorModule {
    text-align: center
}

.portlet .calculator {
    width: 10em;
    margin: 0 auto;
    padding: 6px;
}

.portlet .portletPath {
    font-size: 90%;
    margin: 4px;
}

.portlet .portletPath span {
    display: inline-block;
    padding: 1px 3px 1px 6px;
    font-weight: bold;
}

.portlet .courseDataBlock ul li {
    margin: 0 0 1px;
    padding: 0 0 0 14px;
}

/* Formats help text in CS Splash Page portals */

.portletHelp {
    margin: 4px 7px 4px 7px;
    font-size: 95%;
    padding: 1px 0 2px 0;
}

/* styles for workflows module on My Institution page (I put these here b/c workflows uses the caliper styles above) */

div.module_actions {
    margin: 4px 0;
    padding: 2px;
    line-height: 1.8em;
}

div.module_actions a:link {
    border: 1px outset #CCCCCC;
    font-size: 90%;
    font-weight: normal;
    margin-bottom: 5px;
    padding: 0 5px;
    text-decoration: none;
    white-space: nowrap;
}


div.module_actions img {
    vertical-align: middle;
    margin: 0 3px;
}

div.module_actions select {
    vertical-align: middle;
    font-size: 90%;
}

div.module_actions label {
    font-weight: bold
}

/*Submissions in the outcomes palette*/

div.scroll_div {
    overflow: auto;
    max-height: 300px;
}

.portlet div.scroll_div {
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #ddd;
    margin-bottom: 3px;
}

.submission_list {
    margin: 0;
    padding: 3px 12px;
}

.submission_list li {
    padding: 9px 6px;
    border-top: 1px dotted #ccc;
    font-weight: bold;
}

.submission_list li:first-child {
    border-top: none
}

.submission_list li a {
    font-size: 90%;
    font-weight: normal;
    margin-left: 6px;
}

.submission_list li a.label {
    font-size: 100%;
    font-weight: bold;
    margin-left: 0px;
}

.submission_list li div.button {
    margin: 4px 0 0 0;
    float: right;
}

.submission_list li span {
    font-size: 90%;
    margin-left: 6px;
    font-weight: normal;
}

/*EUD Module (styles moved from nautilus.css)*/

.eudModule,
.styledModule-dark {
    margin: 0;
    padding-bottom: 24px;
}

.portlet .noItems {
    text-align: center;
    font-style: italic;
}

.eudModule .eudModule-inner,
.styledModule-dark .module-inner {
    overflow-y: auto;
    max-height: 500px;
    border-bottom: 1px dotted #ccc;
}

.eud-button-wrap {
    padding: 0;
    float: right;
}

img.eud-avatar {
    width: 28px;
    height: 28px;
    padding: 2px;
    background: #fff;
    -moz-transform: rotate(-2deg);
    -webkit-transform: rotate(-2deg);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.actionMenuButton {
    display: block;
    padding: 3px 8px 4px;
    vertical-align: middle;
    -ms-filter: none;
    filter: none;
    background: #eee!important;
    margin: 0 4px 0 0;
    float: right;
}

div[id*="actionMenu_"] {
    margin-top: -4px\9;
    margin-left: -3px\9;
    z-index: 1000;
}

.portlet .portletBlock {
    margin: 0;
    font-size: 100%;
    border-top: 2px groove rgba(255, 255, 255, 0.6);
    padding: 6px 0;
}

.portlet .portletBlock:first-child,
.moduleActions + .portletBlock {
    border-top: 0
}

.blockGroups li:first-child {
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
}

.blockGroups li:last-child {
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}

.portlet .memberList {
    margin: 0 0 5px 0
}

.itemGroups {
    margin: 4px 9px 12px;
    padding: 0;
}

.itemGroups .itemGroups {
    margin-left: 0;
    margin-bottom: 4px;
}

.portlet .blockGroups li {
    font-size: 100%
}

.portlet .itemGroups li {
    padding: 0 0 7px 0;
    line-height: 120%;
    overflow-x: hidden;
}

.portlet .memberList li {
    padding: 0;
    margin-left: 14px!important;
}

.portlet .course,
.portlet ul.memberList,
.portlet span.refresh {
    font-size: 90%;
    display: block;
}

.portlet .course {
    padding: 0 0 0 9px
}

.portlet span.noIndent,
.portlet .whatsNew span.course,
.portlet span.course {
    margin-left: 0!important
}

/*Hierarchical list inside EUD module*/

.portlet ul.hierarchyList {
    margin-left: 22px
}

.portlet ul.hierarchyList li {
    text-indent: -18px;
    overflow-x: visible;
}

.portlet ul.hierarchyList li *,
.portlet ul.hierarchyList li.childless {
    text-indent: 0
}

.portlet ul li ul li span.warning,
.portlet ul li ul li span.due,
.portlet ul li ul li span.newItemCount {
    border: 1px solid #BF1B17;
    white-space: nowrap;
    display: inline;
    padding: 0 4px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin: 0 0 0 3px;
}

.flag {
    font-size: 90%;
    display: inline;
    font-weight: bold;
    border: 1px solid #EFA495;
    padding: 0 4px;
    margin: 0 0 0 3px;
}

.portlet ul.memberList span,
.portlet ul.memberList span.newItemCount {
    font-size: 100%
}

.portletInfoFooter {
    font-size: 90%;
    position: absolute;
    bottom: 5px;
    right: 0;
    padding: 2px 9px;
}

.dateSelector {
    padding: 4px;
    border-bottom: 1px dotted #ccc;
}

.portlet .portletBlock h4 {
    border: 0;
    display: block;
    letter-spacing: 0px;
    margin: 0pt;
    padding: 4px 9px;
    text-decoration: none;
}

.portlet .subCategories li a,
.blockGroups .itemHead {
    border-top: 1px dotted #ccc;
    display: block;
    font-weight: bold;
    margin: 0pt;
    padding: 8px 5px 8px 18px;
    text-decoration: none;
}

.blockGroups li img.spacer {
    height: 0px;
    width: 50px;
}

.viewHeader {
    border: 0pt none;
    display: block;
}

/*More... link*/

.moduleControlWrapper a {
    position: relative;
    margin: 0 2px;
}

.moduleControlWrapper a:after {
    position: relative;
    right: 0px;
}

.moduleBlock {
    margin: 6px
}

.portlet h1 {
    margin: 6px 6px;
    font-size: 120%
}

/* @end PORTLET*/

/* Portlet block items list. */

ul.itemGroups li ul.items {
    padding: 2px 9px;
    display: block;
    margin: 0;
    font-size: 110%;
}

ul.itemGroups li ul.items li a {
    font-weight: normal
}

.blockContents ul li,
ul.memberList li {
    background-image: none;
    padding: 0;
    margin: 0 0 0 0px;
}

/* @end ASSESSMENT PORTLET*/

/* @group LOGIN MODULE */

/*Login Module*/

.portlet #loginBoxFull {
    margin: 0 auto;
    padding: 0px 0 16px;
    position: relative;
    width: 300px;
}

.portlet #loginBoxFull p {
    margin: 0 0 12px;
    font-size: 0.95em;
    padding-left: 0;
}

.portlet #loginBoxFull p.welcome {
    margin: 10px;
    padding: 0;
    font-weight: bold;
    background: none;
    font-size: 1.0em;
}

.portlet #loginBoxFull ul {
    padding: 0
}

.portlet #loginBoxFull li {
    margin: 0;
    padding: 2px 0;
    background-image: none;
    clear: both;
}

.portlet #loginBoxFull li label {
    font-weight: normal;
    font-size: 100%;
}

.portlet #loginBoxFull input[type="text"],
.portlet #loginBoxFull input[type="password"],
.portlet #loginBoxFull button {
    box-sizing: border-box;
    box-shadow: none;
    font-size: 100%;
    margin: 0 0 3px -4px;
    padding: 3px 5px;
    width: 300px;
    border: 2px solid #bbb;
}

.portlet #loginBoxFull a {
    font-size: .9em
}

.portlet #loginBoxFull p a,
.portlet #loginBoxFull p.welcome a {
    font-size: 1.0em
}

.portlet #loginBoxFull form li + li +li {
    /*  float: left; */
    display: inline-block;
    vertical-align: top;
}

.portlet #loginBoxFull form li + li + li + li {
    text-align: right;
    float: right;
    display: inline-block;
    vertical-align: top;
}

.portlet #loginBoxFull li input.submit {
    margin: 0 -3px 0 0
}

.portlet #loginBoxFull #loginRedirectProviders {
    width: 300px;
}

.portlet #loginBoxFull #loginRedirectProviders button:after {
    border-width: 3px;
    border-top-width: 4px;
}

.portlet #loginBoxFull #loginRedirectProviderList {
    box-shadow: none;
    margin-left: -4px;
    width: 300px;
}

.portlet #loginBoxFull #loginRedirectProviderList li {
    padding: 0;
}

.portlet #loginBoxFull #loginRedirectProviderList li img,
.portlet #loginBoxFull #loginRedirectProviderList li .defaultProviderIcon {
    height: 18px;
    margin-right: 5px;
    width: 18px;
}

/* @end LOGIN MODULE*/

/* TOOLS */

/* @group LESSON PLAN */


#body {
    padding-bottom: 60px
}

#loadstatus {
    position: relative;
    height: 180px;
}

.builderItem .item {
    font-size: 100%;
    padding: 12px 9px;
    border: 1px solid transparent;
}

li.builderItem {
    min-height: auto
}

.builderItem .close {
    position: absolute;
    right: 5px;
    top: 5px;
    cursor: pointer;
}

.builderItem iframe {
    width: 100% !important
}

div.subheading {
    font-weight: bold
}

div.required div.inputField {
    margin-left: -1.5em;
    padding-left: 1.5em;
}

.inputOptions {
    border-top: 1px dotted #ccc;
    padding: .5em;
}

/* hovering over the edit link on a component should result in a pointer cursor shape, not a move shape */

.label a:hover,
.label a:focus {
    cursor: pointer
}

/*Lesson Plans*/

#lessonPlanForm #customFormBuilderDiv {
    margin: 0
}

#lessonPlanForm #dataCollectionContainer,
#lessonPlanForm #dataCollectionContainer .contentListPlain {
    margin: 0
}

/* @end LESSON PLAN*/

/* @group LEARNING STANDARDS */

/* Learning Standards*/

.alignPanelLightbox {
    min-height: 250px;
    min-width: 650px;
    padding: 10px 12px;
}

.alignHeader {
    padding: 6px 0 0;
    font-size: 95%;
    font-weight: bold;
    color: #555;
}

.alignPanel table td,
.alignPanel table th {
    font-size: 90%;
}

.alignPanel td.actionCell {
    padding: 4px 0;
    white-space: nowrap;
    width: 1%;
}

.alignPanel table td.descriptionCell {
    word-break: break-word;
    word-wrap: break-word;
    min-width: 120px;
}

.alignPanel table td.descriptionCell div {
    width: 250px\9;
    overflow: hidden\9;
}

.alignPanel table td.infoCell div,
.collapseTabs .alignPanel table td.descriptionCell div {
    width: 123px\9;
}

.collapseTabs .alignPanel table td.infoCell div {
    width: 80px\9;
}

@-moz-document url-prefix() {
    .alignPanel table td.descriptionCell div {
        max-width: 250px;
    }
    .alignPanel table td.infoCell div,
    .collapseTabs .alignPanel table td.descriptionCell div {
        max-width: 123px;
    }
    .collapseTabs .alignPanel table td.infoCell div {
        max-width: 80px;
    }
}

.alignPanel thead th.smallCell {
    padding: 4px 0;
}

.alignPanel thead th {
    white-space: nowrap
}

.alignPanel td.actionCell {
    padding: 4px 0;
    white-space: nowrap;
    width: 1%;
}

.pageBreadcrumb {
    height: 1em;
    padding: 6px;
}

.pageBreadcrumb ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    font-size: 90%;
}

.pageBreadcrumb li {
    float: left;
    font-weight: bold;
    margin-left: 3px;
}

.pageBreadcrumb li a {
    text-decoration: none;
    font-weight: bold;
    margin-right: 3px;
}

.pageBreadcrumb li a.active {
    text-decoration: none;
    font-weight: bold;
}

.sStatus {
    padding: 0px;
    font-size: 90%;
    margin-left: 8px;
    height: 14px;
}

.sStatusI {
    color: #cc0000;
    padding: 0px;
    font-size: 90%;
    margin-left: 8px;
    height: 14px;
}

.panelList {
    padding: 0;
    margin: 2px 0px 3px;
    word-wrap: break-word;
}

/* this is the outermost list that contains all panels */

.panelList > li {
    margin: 0 0 1px
}

.panelNested {
    margin: 4px 0 0;
    padding: 4px;
    overflow: hidden;
}

/* a nested list of child panels */

.panelHead {
    position: relative;
    margin: 0;
    padding: 6px 8px;
    word-wrap: break-word;
}

/* a collapsible list item that contains child panels (.panelNested) */

.panelItem {
    position: relative;
    border-bottom: 1px solid #eee;
    padding: 6px 8px 6px;
}

/* a panel list item that has no children */

.panelItem:last-child {
    border-bottom: none!important
}

.panelList_leftCol {
    position: absolute;
    left: 6px;
    top: 6px;
}

/* each row is split into three columns: checkbox, text and icon */

.panelList_rightCol {
    position: absolute;
    right: 6px;
    top: 6px;
}

.panelList_centerCol {
    padding: 0 18px
}

/* Start: Standard Import Error Log */

ul.logMessages {
    list-style: none;
    margin-left: 0;
    padding-left: 1em;
    text-indent: -1em;
}

li.logError {
    color: red
}

li.logWarning {
    color: blue
}

li.logInfo {}

li.logMessage {
    margin-top: 0.1em
}

.connectionWrapper {
    position: relative;
    margin-top: 1px;
    padding-right: 30px;
}

.connectionWrapper a {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -14px;
}

/* used in the key-valueTable on the Maps Standards page */

.invertItems {
    margin-right: 26px;
    position: relative;
    display: block!important;
}

.invertItems a {
    position: absolute;
    right: -33px;
    top: -14px;
}

.subcategories {
    padding: 6px 11px!important
}

.subcategories h3 {
    margin: 0;
    padding: 0;
    font-size: 100%;
}

/* @end LEARNING STANDARDS*/

/* @group WIKI */

.diffbox-wrapper {
    width: 80%;
    margin: 9px auto;
}

.legendbox-wrapper {
    width: 90%;
    margin: 9px auto;
}

.legendbox-wrapper > div {
    border-left: 1px solid #ddd
}

.legendbox-wrapper > div:first-child {
    border-left: none
}

.diffbox-left,
.diffbox-right,
.diffbox-arrow,
.legendbox {
    float: left
}

.diffbox-left,
.diffbox-right {
    width: 44%
}

.legendbox-3 {
    width: 33%
}

.legendbox-2 {
    width: 48%
}

.diffbox-left > div,
.diffbox-right > div,
.legendbox > div {
    padding: 3px 6px;
}

.legendbox > div {
    padding: 3px 9px;
}

.diffbox-right > div {
    border: 2px solid #ddd
}

.diffbox-left ul li,
.diffbox-right ul li,
.legendbox ul li {
    border-top: 1px dotted #ddd;
    padding: 4px 0 2px 0;
}

.diffbox-left ul li:first-child,
.diffbox-right ul li:first-child,
.legendbox ul li:first-child {
    border-top: 0
}

.diffbox-left .label,
.diffbox-right .label,
.legendbox .label {
    width: 30%;
}

.diffbox-left .field,
.diffbox-right .field {
    width: 59%
}

.legendbox .label {
    width: 45%;
    font-size: 90%;
}

.legendbox .field {
    width: 55%
}

.diffbox-arrow {
    width: 6%;
    text-align: center;
    padding-top: 50px;
}

.diffLegend-sample {
    width: 90px!important;
    height: 17px!important;
    position: static!important;
}

.addedImg-sample,
.removedImg-sample,
.changedImg-sample {
    height: 13px!important
}

.diff-html-added,
.diff-html-removed,
.added-sample,
.removed-sample {
    position: relative;
    display: inline-block;
    font-size: 100%;
    cursor: pointer;
}

.diff-html-added img,
.addedImg-sample {
    border: 2px solid #ccffcc !important
}

.diff-html-removed img,
.removedImg-sample {
    border: 2px solid #fdc6c6 !important
}

.diff-html-changed img,
.changedImg-sample {
    border: 2px dotted #000099 !important
}

div.diff-removed-image,
div.diff-added-image,
.diff-addedImg-sample {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 2px;
    opacity: 0.55;
    filter: alpha(opacity=55);
    -moz-opacity: 0.55;
}

div.blogContainer div.wikiPage h4 {
    font-size: 120%;
    background-image: none;
    padding: 9px 12px 0 30px;
}

div.blogContainer div.entryFooter h4 {
    font-size: 100%;
    padding: 0;
}

div.blogContainer div.entryDate {
    font-size: 95%;
    padding: 6px 0 6px 30px;
}

.editWiki {
    margin: 9px 9px
}

/* @end WIKI*/

/* @group LEGACY MARKUP */

/* @end LEGACY*/

/* @group MISC */

/* @group MICS COMPONENTS */

/* Youtube AX Controls */

.playerControls {
    position: relative;
    padding: 6px !important;
    margin-bottom: 2px;
    margin-top: 0px;
}

/* Building Block List Page */

img.managedPluginStatusIcon {
    margin: 1px 7px 3px 0;
}

/* used in Learning Objects catalog */

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

ul.metaDataList li {
    margin: 0;
    padding: 2px 0;
    clear: both;
}

ul.metaDataList li h3 {
    display: inline;
    margin: 0;
}

/* @end MISC COMPONENTS*/

/* @group CONTENT PLAYER
----------------------------------------------- */

/*
The following are hacks used by the contentplayer
*/

/*
Used by content player view attempt for <td> font sizing.  Can be removed after
plugins-contentplayer/web/grading/viewAttempt.jsp has been re-written without tables
*/

.bb-cpgbtd {
    font-size: 90%;
}

/*
Used by content player view attempt for <th> font sizing.  Can be removed after
plugins-contentplayer/web/grading/viewAttempt.jsp has been re-written without tables
*/

.bb-cpgbth {
    font-size: 90%;
}

/*
Used by content player modify grade for <td> font sizing.  Can be removed after
plugins-contentplayer/web/grading/modifygrade.jsp has been re-written without tables
*/

.bb-cpmgtd {
    color: #000000;
    font-size: 85%;
}

/*Used by content player modify grade for <th> font sizing.  Can be removed after
plugins-contentplayer/web/grading/modifygrade.jsp has been re-written without tables
*/

.bb-cpmgth {
    font-size: 85%;
    font-weight: bold;
}

/* @end CONTENT PLAYER*/

/*Handle used in al horizontmenu pane resizing*/

#resizeHandle {
    position: absolute;
    left: 200px;
    bottom: 0;
    top: 0;
    border: 1px solid #999;
    margin-top: 0;
    width: 3px;
}

#resizeHandle .collapseControl,
#resizeHandle .pullcollapsed {
    margin-top: 200px;
    position: relative;
    width: 11px;
    height: 22px;
    left: -5px;
    font-size: 8px;
    display: block;
    border: 1px solid #999;
}
/* Extra text beside/below main title in a caret list page */

.caretTitleModifier {
    padding: 1px 0 0 3px;
    font-weight: normal;
    font-size: 90%;
}

.landingPageColumn h3.hiddenlink .linkStatus {
    margin: 0;
    font-size: 85%;
    font-weight: normal;
    display: block;
    padding: 0.4em 0 0 0;
}

/* Reverting styles for nested tables. */

table.inventory .vtbegenerated tbody tr td,
table.inventory .vtbegenerated tbody tr th,
table.reorderable .vtbegenerated tbody tr td,
table.reorderable .vtbegenerated tbody tr th,
table.inventory .vtbegenerated tbody tr:hover td,
table.inventory .vtbegenerated tbody tr:hover th,
table.reorderable .vtbegenerated tbody tr:hover td,
table.reorderable .vtbegenerated tbody tr:hover th,
table.reorderable .vtbegenerated tbody tr:hover {
    border: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: transparent;
}
/*Additional Info above CS inventory table*/

.additional {
    padding: 2px 3px 3px 3px;
    margin: 0 0 6px 0;
}

.additional .left {
    float: left
}

.additional .right {
    float: right;
    padding: 2px 3px;
}

.additional .right span.size {
    font-weight: bold;
}

.additional .left span.suboption {
    display: block
}

/* @end MISC*/

/* @group DELETABLES/UNSURE */

/*Label/field modifications for minified layout*/

.smallControls {
    font-size: 90%;
    margin-top: 3px!important;
    min-width: 19em;
}

.smallControls .label {
    width: 29%;
}

.smallControls .field {
    width: 70%;
}

.smallControls .stepHelp {
    font-size: 100%!important;
    padding: 0
}

/*End modifications*/

/* custom form - label used by Edit Lesson Plan. Since 9.1. TB */

.customFormBuilderLabel {
    display: block;
    width: 88%;
    word-wrap: break-word;
}

.textareaWrapper textarea,
.textareaWrapper table {
    width: 100%;
}

/*Old reorderable table. To be redesigned due to classname confusion.*/

.portlet #loginFooter {
    margin: 0;
    padding: 0px 0pt 9px 0;
    background-image: none;
    font-size: 0.9em;
}

.portlet #loginFooter ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.portlet #loginFooter ul li {
    float: left;
    padding: 0 10px;
    border-left: 1px dotted #999;
    background-image: none;
}

.portlet #loginFooter ul li:first-child {
    border-left: none
}

/* @end */

/*Forced webkit scrollbar in Gradebook. Allows horizontal grid scrolling.*/

#table1_viewport + div::-webkit-scrollbar {
    margin-top: 3px;
    height: 12px;
    border-radius: 6px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .1) inset;
    border: 1px solid #bbb;
}

#table1_viewport + div::-webkit-scrollbar-thumb {
    border-radius: 6px;
    height: 12px
}

/*Read/Edit mode*/

.navPalette.tools {
    border-top: 2px groove rgba(255, 255, 255, 0.3);
}

/* @group DESIGN CANVAS */

.designAreaHeader,
.designAreaFooter {
    border: 1px solid #ccc;
    margin: 0;
    padding: 6px 9px 9px;
}

.designAreaHeader h3,
.designAreaFooter h3 {
    margin: 0;
    padding: 0;
}

.designAreaHeader .headertext,
.designAreaFooter .footertext {
    margin: 0;
    padding: 0 0 0.4em 12px;
}

div#emptyText {
    margin: 0.6em 16px
}

/* shown when there are no items in the canvas */

.infoListWrapper {
    position: relative;
    border: 1px solid #EEE;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    margin: 0 0 6px;
    padding: 6px;
}

.infoListWrapper h3 {
    margin: 0;
    padding: 0;
}

.infoListWrapper h3 a {
    display: block;
    padding: 3px 16px;
}

.infoList {
    margin: 6px 12px
}

.infoList > li {
    border-top: 1px dotted #ddd;
    margin: 0 0 3px 0;
    padding: 3px 0 0 0!important;
}

.infoListWrapper .infoList > li {
    border-top: 1px dotted #cdcdcd
}

.infoList li:first-child {
    border-top: none
}

.infoList li div h3 {
    margin: 0;
    padding: 0;
    font-size: 100%;
    font-weight: normal;
}

.details .infoList {
    margin-top: 0!important
}

.infoListFloat {
    margin: 0
}

.infoListFloat li {
    float: left;
    border: none;
    padding: 3px 10px!important;
    font-size: 95%;
}

/* @end DESIGN CANVAS*/

div.contentListRight {
    font-weight: normal;
    position: absolute;
    z-index: 1000;
    right: 9px;
    top: 9px;
    padding: 4px;
    text-align: right;
}

div.contentListRight a {
    font-weight: bold;
    margin-left: 4px;
}

div.contentListRight span:first-child + span,
div.contentListRight span:first-child + span + span {
    font-size: 85%;
}

div.contentListRight span:first-child + span:before,
div.contentListRight span:first-child + span + span:before {
    content: "("
}

div.contentListRight span:first-child + span:after,
div.contentListRight span:first-child + span + span:after {
    content: ")"
}

div.contentListRight span:first-child[style*="none"] + span,
div.contentListRight span:first-child[style*="none"] + span + span {
    display: none
}

div.contentListRight span span {
    display: block;
    padding: 9px 0;
    font-size: 90%;
}

div.contentListRight strong {
    padding: 0pt 0.4em 2px
}

/* @group MULTIPLE GROUP ASSIGNMENT */

/*---MULTIPLE GROUP ASSIGNMENT---*/

div.multiAssign {
    margin: 3px 0 9px 0;
}

div.multiAssign ul {
    list-style: none;
    border: 0;
    padding: 0;
    margin: 0;
}

div.multiAssign ul li,
div.multiAssign ul li.read {
    line-height: 1.3em;
    text-align: center;
    width: 13em;
    clear: none;
    float: left;
    margin: 0 9px 0 0;
    border: 0;
    padding: 1px 6px 6px 6px;
    font-size: 90%;
}

div.multiAssign ul li a,
div.multiAssign ul li a {
    font-weight: bold;
    font-size: 100%;
}

div.multiAssign ul li p {
    padding: 1px 0 2px 0;
}

div.multiAssign ul li.label {
    line-height: 1.1em;
    border: 0;
    font-weight: normal;
    padding: 0;
    width: 12em;
    white-space: normal;
    text-align: left;
}

div.multiAssign a.buttonMicro,
h3 a.buttonMicro {
    padding: 0px 5px;
    font-size: 90%;
    text-decoration: none;
    border: 1px solid #ccc;
    margin: 1px auto 12px auto;
    white-space: nowrap;
}

div.multiAssign a.simpleLink {
    display: block;
}

h3 span.status a.buttonMicro {
    font-size: 90%;
    font-weight: normal;
    margin-left: 6px;
}

h3 span.status,
h3 div.status {
    font-weight: normal;
    font-size: 80%;
    margin-left: 6px;
    padding: 3px 6px;
}

h3 div.status {
    display: inline;
}

/* @end MULTIPLE GROUP ASSIGNMENT*/

/*Admin Panel Announcement*/

.annSliderWrapper {
    margin: 25px 25px -5px 25px;
}


/*img styles for new logo in admin page*/

.colophon img {
    float: left;
    width: 150px;
    position: absolute;
    left: -120px;
    top: -13px;
}

#globalNavPageContentArea #copyright {
    padding: 0px;
}

#globalNavPageContentArea #copyright .newCopyright {
    padding: 0px;
    margin: 0px;
}

#globalNavPageContentArea #copyright .newCopyright img {
    position: relative;
    clear: both;
    left: -12px;
}

#globalNavPageContentArea #copyright .newCopyright .legal {
    position: relative;
    clear: both;
    float: left;
    margin-top: 20px;
    left: 0px;
}

/*Noframes adjustments*/

#globalNavPageContentArea {
    position: relative;
}

/*End noframes*/

.container {
    position: relative;
}

.submitStepBottom p.taskbuttonhelp {
    float: left
}

.submitStepTop {
    height: 75px;
}

.submitStepBottom {
    background: #fff;
    border: 0px;
}

.submitStepFixed {
    background-color: #eee;
    border: 1px solid #cdcdcd;
    box-shadow: 0 -5px 4px -3px rgba(0, 0, 0, 0.13);
    -webkit-box-shadow: 0 -5px 4px -3px rgba(0, 0, 0, 0.13);
    z-index: 100;
    position: fixed;
    bottom: 0;
}

.taskbuttondiv_wrapper {
    height: 75px;
    width: 100%;
}

div.blogContainer div.entryFooter div.addBlogComment {
    display: none;
}

div.blogContainer div.entryFooter a.genericButton {
    display: block;
    float: right;
}

.legend-visible {
    display: block;
    font-size: 100%;
    margin: 0;
    padding: 0;
    height: auto;
    line-height: 1.2;
    position: static;
    top: auto;
    word-wrap: break-word;
}

.legend-visible-header {
    font-weight: bold;
}

.u_controlsWrapper {
    padding: 6px 0;
    *display: inline-block;
}

.u_reverseAlign {
    text-align: right
}

tr.dummyVTBEFooter td {
    padding: 2px;
    text-align: right;
}

div.blogContainer ul.entryComments {
    margin: 0;
    padding: 0;
}

div.blogContainer ul.entryComments li {
    list-style: none;
    margin: 0;
    padding: 6px 0;
}

div.blogContainer ul.entryComments li p {
    margin: 0px 0 4px;
    padding: 12px;
    _height: 1%;
    overflow: hidden;
}

div.blogContainer ul.entryComments li p.commentDate {
    position: relative;
    z-index: 10;
    margin: 2px 0 -1px;
    padding: 0 0 4px;
    text-align: right;
}


/* h5 wrapped around the name of each commentor */

div.blogContainer ul.entryComments li h5 {
    display: inline;
    margin: 0;
    padding: 3px 0 0;
}

.comment-delete {
    background: url(/images/ci/actionbar/clp_item_remove.gif) no-repeat 0 0;
    overflow: hidden;
    display: inline-block;
    height: 17px;
    width: 24px;
}

.comment-delete img {
    opacity: 0;
    filter: alpha(opacity=0);
}


/* div.liveArea styles are since 9.1 - used in Blogs */

div.liveArea fieldset.stepcontent {
    margin: 0;
    padding: 0;
}

div.liveArea fieldset.stepcontent ol li {
    margin: 0;
}

div.liveArea fieldset.stepcontent textarea {
    width: 98%;
    *width: 98%;
    *overflow: auto;
}

div.liveArea fieldset.stepcontent span.inlineHelp {
    display: inline;
}


/* ========= BEGIN HUB AND SPOKE ==============*/


/*SubStep*/

.subStep {
    padding: 0;
    margin: 0 0 10px 0;
    border: none;
}


/*Step Title*/

.collapsibleStepTitle {
    color: #00748B;
    background-color: #eee;
    padding: 0 12px;
    height: 40px;
    line-height: 40px;
    text-decoration: underline;
    cursor: pointer;
    border-bottom: 1px solid transparent;
}

h3.collapsibleStepTitle {
    margin-bottom: 0;
}

.collapsibleStepTitle:focus {
    border-bottom: 1px solid #ccc;
}


/*Step Content*/

.collapsibleStepContent {
    background-color: #eee !important;
}

.collapsibleStepContent > ol {
    margin: 0 15px 30px 15px;
}

.collapsibleStepContent li {
    padding: 10px 0 !important;
}


/* ========= END HUB AND SPOKE ==========*/


/* ================= Global Nav Menu ================= */

#mybb-nav .flyout-menu {
    width: 400px;
}

.mybb-tools li {
    height: 40px;
    width: 40px;
    overflow: hidden;
}

.mybb-tools li:hover {
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    /* IE 5-7 */
    filter: alpha(opacity=100);
    /* Netscape */
    -moz-opacity: 1;
    /* Safari 1.x */
    -khtml-opacity: 1;
    /* Good browsers */
    opacity: 1;
}

.mybb-tools li a {
    height: 39px;
    width: 39px;
    position: relative;
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    /* IE 5-7 */
    filter: alpha(opacity=80);
    /* Netscape */
    -moz-opacity: 0.8;
    /* Safari 1.x */
    -khtml-opacity: 0.8;
    /* Good browsers */
    opacity: 0.8;
}

.mybb-tools li a:focus,
.mybb-tools li a:focus img {
    outline: 1px dotted #CCCCCC;
}

#global-list-tools {
    margin: 4px;
    width: 40px;
}

.mybb-tools li a:focus,
.mybb-tools li a:focus img,
.mybb-tools li a:hover {
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    /* IE 5-7 */
    filter: alpha(opacity=100);
    /* Netscape */
    -moz-opacity: 1;
    /* Safari 1.x */
    -khtml-opacity: 1;
    /* Good browsers */
    opacity: 1;
}


/* TODO: Someone added color without comment here - against the rules for shared.css */

.mybb-tools li span.badge {
    background-color: #B90000;
    position: absolute;
    right: 0;
    top: 2px;
}


/* TODO: Someone added color without comment here - against the rules for shared.css */

.mybb-tools li.home,
.mybb-tools li.logout {
    background-color: #666;
}


/* TODO: Someone added color without comment here - against the rules for shared.css */

.mybb-tools li.home:hover,
.mybb-tools li.logout:hover {
    background-color: #404040;
}


/* BEGIN SMALL TOOL ICONS*/

.mybb-tools a {
    background-image: url('/images/ci/mybb/mybb_nav_sprite_sm.png');
    background-repeat: no-repeat;
    background-color: transparent;
}

.mybb-tools .overview a {
    background-position: 5px 7px
}

.mybb-tools .stream a {
    background-position: -72px 7px
}

.mybb-tools .messages a {
    background-position: -115px 7px
}

.mybb-tools .grades a {
    background-position: -156px 7px
}

.mybb-tools .people a {
    background-position: -202px 7px
}

.mybb-tools .spaces a {
    background-position: -247px 7px
}

.mybb-tools .todo a {
    background-position: -293px 7px
}

.mybb-tools .alerts a {
    background-position: -336px 7px
}

.mybb-tools .more-link a {
    background-position: -417px 7px
}

.mybb-tools .calendar a {
    background-position: -459px 7px
}

.mybb-tools .logout a {
    background-position: -372px 7px
}

.mybb-tools .profile {
    height: auto;
    margin-bottom: 5px;
}

.mybb-tools .profile a {
    padding: 0;
    height: auto;
    background-image: none;
}


/* END SMALL TOOL ICONS*/

#global-nav .profile img {
    width: 30px;
    height: 30px;
    margin: 5px;
    padding: 0;
}


/*flyout- bottom button styels*/


/* TODO: Someone added color without comment here - against the rules for shared.css */

.bottom-buttons {
    width: 210px;
    background-color: white;
    height: 25px;
    line-height: 25px;
    position: absolute;
    bottom: 0;
    right: 0;
}

.bottom-buttons li {
    border-right: 1px solid #EEEEEE;
    float: left;
    font-size: 11px;
    overflow: hidden;
    width: 105px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bottom-buttons li:last-child {
    border: none;
}

.bottom-buttons a {
    text-indent: -9999px;
}


/* hope to un-comment these in the future, so all themes can use the same icons */


/* for now, only the 2012 theme uses these icons. the 2008 themes use icons set on the Customize Brand page */


/*.bottom-buttons-home a {
  background: transparent
              url('/images/ci/mybb/mybb_nav_bottombuttons_sprite.png ') no-repeat
              50% 6px;
}

.bottom-buttons-help a {
  background: transparent
              url('/images/ci/mybb/mybb_nav_bottombuttons_sprite.png ') no-repeat
              50% -13px;
}

.bottom-buttons-logout a {
  background: transparent
              url('/images/ci/mybb/mybb_nav_bottombuttons_sprite.png ') no-repeat
              50% -33px;
}*/


/* TODO: Someone added color without comment here - against the rules for shared.css */

.bottom-buttons a:hover,
.bottom-buttons a:focus {
    color: #000;
    background-color: #ddd !important;
}

.accordion_toggle_active {
    background-color: #ccc !important;
    color: #000;
}

.accordion_content {
    background-color: #eee;
    color: #444444;
    overflow: auto;
    -webkit-box-shadow: 0 5px 10px -7px #000 inset;
    -moz-box-shadow: 0 5px 10px -7px #000 inset;
    box-shadow: 0 5px 10px -7px #000 inset;
}

.accordion_content li {
    margin: 0 12px;
    padding: 4px 0;
}

.accordion_content li:last-child {
    border-bottom: none;
}

.accordion_content li a {
    color: #128FA8;
    padding: 0;
    font-size: 110%;
    line-height: 1.2em;
}

.accordion_content .course-list li a,
.accordion_content .accordion-list li a {
    border-bottom: 1px dotted;
    font-weight: 600;
    display: inline;
}

.accordion_content .course-list li a:hover,
.accordion_content .course-list li a:focus,
.accordion_content .accordion-list li a:hover,
.accordion_content .accordion-list li a:focus {
    border-bottom-style: solid;
}

.accordion-list {
    margin-top: 6px;
}

.accordion_content .noItems {
    margin-top: 12px;
    display: block;
    text-align: center;
    font-size: 110%;
}

.accordion_content li span {
    display: block;
    font-size: 9px;
    line-height: 100%;
}

.accordion_content #menuShortcutText {
    margin-top: 100%;
    font-style: italic;
    font-size: 75%;
}


/*top bar styles--*/

.global-nav-bar-wrap {
    position: absolute;
    top: 0;
    height: 0;
    width: 100%;
    z-index: 1010;
}

.mobile-nav-menu-icon {
    visibility: hidden;
}

.global-nav-bar-wrap-mobile-nav {
    visibility: hidden;
    height: 0px;
    width: 0px;
    overflow: hidden;
}

.global-nav-bar {
    /*
font-size: 11px;
 height: 25px;
 position: fixed;
 top: 0;
 right: 35px;
 z-index: 999;
*/
    font-size: 12px;
    height: 25px;
    z-index: 999;
    float: right;
    margin-left: 3px;
    position: relative;
}

.global-nav-bar.logout {
    /*  right: 0px; */
}

.global-nav-bar .badge,
.side-nav .menu-icon span.badge {
    /*This badge style should be a global class. Once added into mybb.css, remove this declaration.*/
    display: inline-block;
    font-size: 10px;
    font-weight: 800;
    height: 12px;
    /*  width: 20px; */
    background-color: #b90000;
    text-align: center;
    line-height: .9;
    color: #fff;
    margin-left: 5px;
    -webkit-border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border-radius: 2px 2px 2px 2px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    padding: 3px 3px 0;
}

.global-nav-bar a {
    display: block;
}

.nav-link {
    position: relative;
    display: block;
    padding: 0 49px 0 28px;
    background: none;
    background: rgba(0, 0, 0, 0.2);
    -ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#26000000, endColorstr=#26000000);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#26000000, endColorstr=#26000000);
    zoom: 1;
    color: #eee;
    height: 25px;
    line-height: 25px;
    text-decoration: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
}

.nav-link:hover,
.nav-link:focus {
    background: rgba(0, 0, 0, 0.6);
    -ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#62000000, endColorstr=#62000000);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#62000000, endColorstr=#62000000);
}

.global-nav-bar .logout-link {
    width: 32px;
    padding: 0;
    background-image: url('/images/ci/mybb/mybb_nav_logout.png');
    background-repeat: no-repeat;
    background-position: 50% 0;
    text-indent: -10000px;
    overflow: hidden;
}

.global-nav-bar .logout-link:hover,
.global-nav-bar .logout-link:focus {
    background-position: 50% -22px;
}

.nav-link .badge {
    position: absolute;
    right: 22px;
    top: 5px;
}

.global-toggle {
    position: absolute;
    right: 0;
    top: 9px;
}

.flyout-menu {
    -webkit-box-shadow: 0 4px 15px 2px #222;
    -moz-box-shadow: 0 4px 15px 2px #222;
    box-shadow: 0 4px 15px 2px #222;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #444;
    position: absolute;
    top: 25px;
    right: 0;
    width: 260px;
}

.flyout-menu a {
    color: #128FA8;
}

.flyout-menu .list li {
    padding: .5em;
    border-bottom: 1px solid #eee;
}

.flyout-menu .list li:last-child {
    border-bottom: none;
}

.flyout-menu .list li:hover {
    background-color: #eee;
}

.flyout-menu .accordion-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: #ddd;
    width: 211px;
    overflow: hidden;
}

.flyout-menu .accordion_toggle {
    outline: none;
}

.flyout-menu .accordion_toggle span {
    -moz-user-select: none;
    background-color: #DDDDDD;
    border-bottom: 1px solid #CCCCCC;
    color: #555555;
    cursor: pointer;
    display: block;
    font-size: 110%;
    font-weight: bold;
    line-height: 25px;
    margin: 0;
    padding: 0 10px;
    text-shadow: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}

.flyout-menu .accordion_toggle:focus span,
.flyout-menu .accordion_toggle:hover span {
    background-color: #ccc;
}

.flyout-menu .mybb-tools {
    float: left;
    height: 100%;
    background-color: #333;
    position: relative;
}

#global-nav .global-top-avatar {
    position: absolute;
    top: 4px;
    left: 6px;
    height: 16px;
    width: 16px;
}

#global-nav-link span.observing {
    background: transparent url(/images/console/icons/observing.gif) no-repeat scroll 4px -3px;
    display: inline;
    padding: 3px 1px 3px 30px;
    top: -5px;
    *top: -3px;
    *display: inline-block;
    *vertical-align: top;
    *position: relative;
}

#global-nav .more-tools {
    position: absolute;
    right: 100%;
    bottom: 6px;
    background-color: #404040;
    -webkit-box-shadow: 0 0 12px 1px #111111;
    -moz-box-shadow: 0 0 12px 1px #111111;
    box-shadow: 0 0 12px 1px #111111;
}

.more-tools li {
    float: left;
    padding: 4px;
}

.previewContent .global-nav-bar {
    position: relative;
    float: right;
}

.previewContent .nav-link {
    white-space: nowrap;
}

div.section-loading {
    background: url(/images/ci/misc/progress/progress_learningSystem.gif ) no-repeat center center;
    display: block;
}


/* ================= END Global Nav Menu ================= */


/*Styles for lightbox.js*/

div.lb-overlay {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1001;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

div.lb-wrapper {
    position: fixed;
    z-index: 1002;
    -moz-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

div.lb-wrapper div.lb-header {
    padding: 0.6em 3.0em 0.6em 1.0em;
    outline: none;
    background: #e7e7e7;
    webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -o-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

body>div.lb-wrapper div.lb-header {
    margin-bottom: 0 !important;
}

div.lb-wrapper div.lb-header h2 {
    margin: 0;
    padding: 0 15px 0 0;
    min-height: 1.23em;
    overflow: hidden;
    font-weight: normal;
}

div.lb-wrapper div.lb-content {
    overflow: auto;
    padding: 0;
}

.lbAction {
    background-color: #555555;
    border: 2px solid #EEEEEE;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    color: #EEEEEE;
    height: 20px;
    line-height: 17px;
    position: absolute;
    right: -7px;
    top: -7px;
    width: 20px;
    text-align: center;
    z-index: 1010;
}

.lbAction img {
    height: 10px;
    width: 10px;
    height: 10px;
    width: 10px;
    top: 0px;
    position: relative;
}


/* Apply to the parent element of children floated right */

.u_floatThis-right {
    float: right;
    /* TODO everywhere but 2012 core had margin-left: 5px; here
  * - and 2012 even has margin-right; 5px for the reverse of this
  * I think we probably want to just add mergin-left:5px here, -right: 5px in float-left,
  * and then add the reverse margins in shared_rtl.css
  * and then remove all these styles from all other themes.
  */
}


/* Apply to the parent element of children floated left */

.u_floatThis-left {
    float: left;
}


/*Float wrappers*/


/* Floats immediate descendats right */

.u_floatWrapper-right > div,
.u_floatWrapper-right > li {
    float: right;
}


/* Floats immediate descendats left */

.u_floatWrapper-left > div,
.u_floatWrapper-left > li,
.u_floatWrapper-left > label,
.u_floatWrapper-left > input {
    float: left;
}


/* Cleans up after floats */

.u_floatWrapper-left:after,
.u_floatWrapper-right:after,
.u_controlsWrapper:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.u_clearFloatsWrapper > div,
.u_clearFloatsWrapper > li {
    float: none!important;
}


/* clearfix is applied to the parent containing floating children */

.clearfix:after,
.clearfixParent>div:after,
.clearfixParent>li:after {
    content: ".";
    display: block;
    height: 0px;
    clear: both;
    visibility: hidden;
}

.clearfix,
.clearfixParent>div,
.clearfixParent>li {
    display: inline-block;
}


/* Hide from IE Mac \*/

.clearfix,
.clearfixParent>div,
.clearfixParent>li {
    display: block;
}


/* End hide from IE Mac */


/* used in mashupPicker.vm */

.clearfixInlineBlock {
    display: inline-block;
}


/* welcome overlay */

.welcomeOverlay {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.75);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#B0000000, endColorstr=#B0000000);
    bottom: 0;
    font-family: "Helvetica Neue";
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1001;
}


/* Colors */

.welcomeMessage strong,
.whatsNew h2 {
    color: #32D0DB;
    font-weight: bold;
}

.welcomeMessage {
    right: 550px;
    position: absolute;
    top: 75px;
    width: 370px;
    max-width: 450px;
    color: #DDDDDD;
    text-shadow: 2px 0 2px #000000;
    z-index: 1002;
}

.welcomeMessage h2 {
    margin: 18px 0 10px;
    font-size: 64px;
    font-weight: bold;
    line-height: 1;
    word-wrap: break-word;
}

.welcomeMessage h2 .welcomeText {
    float: left;
    line-height: normal;
}

.welcomeMessage p {
    font-size: 22px;
    margin-bottom: 10px;
    line-height: 125%;
}

.whatsNew {
    font-size: 16px;
    position: absolute;
    right: 60px;
    top: 100px;
    width: 380px;
    line-height: 125%;
    color: #DDDDDD;
    text-shadow: 2px 0 2px #000000;
    z-index: 1002;
}

.whatsNew li {
    position: relative;
}

.whatsNew .number {
    background: #15cedb;
    background: -moz-linear-gradient(center top, #15cedb 0%, #0C8F98 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 90%, from(#15cedb), to(#0C8F98));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#15cedb, endColorstr=#0C8F98";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#15cedb, endColorstr=#0C8F98);
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    -webkit-box-shadow: 2px 2px 2px #000;
    -moz-box-radius: 2px 2px 2px #000;
    box-shadow: 2px 2px 2px #000;
    color: #000;
    font-size: 32px;
    font-weight: bold;
    left: -70px;
    line-height: 48px;
    padding: 0px 10px;
    position: absolute;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    top: -10px;
    width: 30px;
}

.whatsNew h2 {
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 26px;
    margin: 15px 0 10px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .7);
    line-height: 120%;
}

.whatsNew li {
    /*  clear: both; */
}

.whatsNew .arrow {
    background: url(overview_global_nav_arrow.png) no-repeat;
    height: 90px;
    position: absolute;
    right: -10px;
    top: -70px;
    width: 40px;
}

.whatsNew ol>li:first-child {
    margin-bottom: 48px;
}

ul.newMenu {
    margin: 10px 0 20px;
}

.newMenu li {
    display: inline-block;
    margin: 0px 10px 10px 0px;
    min-width: 100px;
}

#spacesHelp {
    font-size: 12px;
    line-height: 1.3;
    margin: 6px 0 12px;
}

.social-buttons li {
    float: left;
    width: auto;
    margin: 3px 6px 6px 0;
}

.social-buttons li {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    margin: 12px 14px 12px 0;
}

.social-buttons li a {
    display: block;
}

.social-buttons li a img {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

li.socialConnections,
li.anotherAccount {
    background-color: #d5fdfd;
    background: -moz-linear-gradient(center top, #dedede 0%, #cacaca 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 90%, from(#dedede), to(#cacaca));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#dedede, endColorstr=#cacaca";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#dedede, endColorstr=#cacaca);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000;
    padding: 9px 18px 8px 24px;
    text-shadow: none;
    width: 160px;
}

li.anotherAccount {
    background: none;
    color: #d5fdfd;
    padding-top: 5px;
    font-size: 12px;
}

li.socialConnections img {
    position: absolute;
    left: 20px;
}

li.socialConnections h3 {
    font-size: 13px;
    margin: 0;
    line-height: 1;
}

li.socialConnections p {
    font-size: 12px;
}

li.socialConnections h3 a,
li.socialConnections p a {
    color: #000;
}

li.anotherAccount p a {
    color: #21ACB6;
}

.confirmation {
    /*
 position: absolute;
 bottom: 20px;
 right: 20px;
*/
}

#finishLater {
    background: transparent;
    border: none;
    border-bottom: 1px #21ACB6 dotted;
    color: #21ACB6;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    padding: 2px 0;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .7);
}

#finishLater:hover {
    cursor: pointer;
}

.cmdiv {
    z-index: 9001 !important;
    /*9001 is top z-index value*/
    padding: 0;
}


/*Contextual menu  and mini menu containers. Hidden until called.*/

.cmdiv,
.menumini,
div.quickAddPal,
div.keyboardAccess {
    position: absolute;
    display: none;
    z-index: 2000;
}


/*To fix Context menu not dispalying beside context menu link*/

.cmdiv {
    /*  position: fixed; This breaks too many other context menus such as scrolling down the building blocks page and picking a context menu there*/
}

.cmdiv ul {
    padding: 3px 4px;
}

.cmdiv ul.cmul-hide {
    padding: 0px 4px;
    border-top: 0;
    display: none;
}

.nav .sub ul li a,
.cmdiv a,
.menumini a {
    width: 190px;
    display: block;
    margin: 0;
    padding: 5px 6px 5px 12px;
    zoom: 1;
    overflow-x: hidden;
    overflow-y: visible;
    word-break: normal;
    word-wrap: break-word;
}

.cmdiv a {
    width: auto !important;
}

.cmdiv a.cmitem-hide {
    display: none;
}

a.cmimg {
    zoom: 1;
    *position: static;
}

a.cmimg:hover,
a.cmimg:focus {
    opacity: 1;
    filter: alpha(opacity=100);
}

a.cmimg img {
    width: 16px;
    height: 14px;
    padding: 0;
    margin: 0;
    opacity: 0;
    filter: alpha(opacity=0);
}

a.cmimg.cmimg-hide {
    display: none;
}

.breadcrumbs a.cmimg.cmimg-hide {
  /* do not hide context menu links in the breadcrumbs even if it would open an empty context menu since
     a proper display of the indicators in the breadcrumb depends on the presence of the context menu links */
  display: inline-block;
}

.cmdiv li.contextmenubar_top,
.menumini li.contextmenubar {
    position: absolute;
    text-align: right;
    display: block;
    width: 190px;
    right: -1px;
    top: -20px;
    padding: 0;
}

.cmdiv li.cmli-hide,
.cmdiv li.cmitem-hide {
    display: none;
}

.providerList {
    list-style-type: disc;
    list-style-position: inside;
    margin: 1.5em 2em;
}

.providerList li {
    margin: 0;
}


/*-------- BEGIN DEFAULT TOOLTIP STYLES --------*/

.tooltip {
    color: #ffffff;
    cursor: normal;
    display: -moz-inline-stack;
    display: none;
    font-size: 12px;
    font-family: arial;
    padding: .5em 1em;
    position: absolute;
    width: 170px;
    z-index: 99;
    text-align: center;
    text-shadow: 0 -1px 1px #111111;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -khtml-border-top-left-radius: 4px;
    -khtml-border-top-right-radius: 4px;
    -khtml-border-bottom-right-radius: 4px;
    -khtml-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    -o-box-shadow: 0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
    -moz-box-shadow: 0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
    -khtml-box-shadow: 0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
    -webkit-box-shadow: 0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
    box-shadow: 0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
    background-color: #3b3b3b;
    background-image: -moz-linear-gradient(top, #555555, #222222);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #555555), color-stop(1, #222222));
    filter: progid: DXImageTransform.Microsoft.gradient(startColorStr=#555555, EndColorStr=#222222);
    -ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorStr=#555555, EndColorStr=#222222);
    overflow: hidden;
    text-overflow: ellipsis;
}

.tooltipContainer,
.tooltipContainer-bot,
.tooltipContainer-right,
.tooltipContainer-left {
    position: relative;
    display: inline-block;
}

.tooltipContainer .tooltip {
    /* Top Specific*/
    margin: 0 0 10px -85px;
    left: 50%;
    bottom: 100%;
}

.tooltipContainer-bot .tooltip {
    /* Bottom Specific */
    margin: 10px 0 0 -85px;
    left: 50%;
    top: 100%;
}

.tooltipContainer-left .tooltip {
    /*Left Specific */
    top: 0;
    right: 100%;
    margin: 0 10px 0 0;
}

.tooltipContainer-right .tooltip {
    /*Right Specific */
    top: 0;
    left: 100%;
    margin: 0 0 0 10px;
}


/*Display Tooltip On Hover*/

.tooltipContainer:hover .tooltip,
.tooltipContainer-bot:hover .tooltip,
.tooltipContainer-right:hover .tooltip,
.tooltipContainer-left:hover .tooltip,
.tooltipContainer:focus .tooltip,
.tooltipContainer-bot:focus .tooltip,
.tooltipContainer-right:focus .tooltip,
.tooltipContainer-left:focus .tooltip {
    display: block !important;
}


/*Tooltip Arrow*/

.tooltip:after,
.tooltipContainer .tooltip:after,
.tooltipContainer-right .tooltip:after,
.tooltipContainer-bot .tooltip:after,
.tooltipContainer-left .tooltip:after {
    content: "\25B8";
    display: block;
    font-size: 2em;
    height: 0;
    line-height: 0;
    position: absolute;
}


/*Top ToolTip*/

.tooltipContainer .tooltip:after {
    color: #2a2a2a;
    bottom: 0;
    left: 50%;
    margin-left: -0.3em;
    text-align: center;
    text-shadow: 1px 0 2px #000000;
    -o-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -khtml-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}


/*Bottom ToolTip*/

.tooltipContainer-bot .tooltip:after {
    bottom: auto;
    color: #4f4f4f;
    left: 50%;
    margin-left: -0.3em;
    top: 0;
    text-align: center;
    text-shadow: none;
    -o-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -khtml-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}


/*Right ToolTip*/

.tooltipContainer-left .tooltip:after {
    color: #222222;
    right: -0.375em;
    top: 10px;
    margin-top: -.05em;
    text-shadow: 0 1px 2px #000000;
    -o-transform: rotate(0);
    -moz-transform: rotate(0);
    -khtml-transform: rotate(0);
    -webkit-transform: rotate(0);
}


/*Left ToolTip*/

.tooltipContainer-right .tooltip:after {
    color: #222222;
    left: -0.375em;
    top: 10px;
    margin-top: .1em;
    text-shadow: 0 -1px 2px #000000;
    -o-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -khtml-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}


/*-------- END DEFAULT TOOLTIP STYLES ---------*/


/*-------- TOOLTIP OVERRIDES/CUSTOMIZATION -----------*/


/*Item Analysis Tooltip Overrides*/

.data-summary tr:hover .tooltipContainer-bot .tooltip,
.data-summary-vert tr:hover .tooltipContainer-bot .tooltip {
    display: block;
}

.data-summary .tooltipContainer-bot {
    position: absolute;
    bottom: 3px;
    left: 50%;
    margin-left: -8px;
}


/* // ITEM ANALYSIS // */


/* Item Analysis Data Summary Reports */

.reportSummary .data-summary-container {
    float: left;
    clear: none;
}

.reportSummary .data-summary,
.reportSummary .data-summary-vert {
    float: left;
    position: relative;
    margin: 0 12px 0 0;
}

.reportSummary h3 {
    font-weight: normal;
    margin: 9px 0;
}

.reportSummary .data-summary tr {
    float: left;
    border: 1px solid;
    margin: 1px 0 0 -1px;
}

.reportSummary .data-summary th {
    font-weight: normal;
    font-size: 120%;
    padding: 16px 0;
    float: left;
    display: block;
    width: 100%;
    text-align: center;
}

.reportSummary .data-summary td {
    border-top: 1px dotted;
    display: block;
    float: left;
    font-size: 80%;
    height: 30px;
    padding: 5px 0 18px;
    position: relative;
    text-align: center;
    width: 100%;
}


/*changes to item analysis summary boxes*/

.data-summary table {
    min-height: 98px;
    min-width: 120px;
    border: none;
}

.data-summary-vert table {
    min-height: 102px;
    min-width: 120px;
    display: block;
    border: 1px solid;
    padding: 2px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.data-summary-vert th {
    padding: 3px;
    min-width: 1.5em;
    text-align: center;
    padding: 3px 1px 1px;
    font-size: 120%;
    vertical-align: baseline;
}

.data-summary-vert td {
    text-align: left;
    padding: 3px 3px 1px;
    font-size: 80%;
    vertical-align: baseline;
}

.data-summary table tr:hover,
.data-summary-vert table tr:hover {
    cursor: help;
}


/* end Item Analysis Data Summary Reports */

.runReportContainer {
    margin: 0 0 20px;
    padding: 10px 11px;
    position: relative;
    top: -12px;
}

.previousReports ul {
    margin: 5px 24px;
}

.previousReports li {
    margin: 4px 0;
}

.previousReports .previousReports linear {
    border-bottom: 1px dotted;
    padding: 5px 0;
    display: block;
    margin-right: 10px;
}

.reportTitle {
    border-bottom: 1px solid;
    padding-bottom: 10px;
}

.questionDetails .searchResultList-sortOptions {
    display: none;
}

.questionDetails .reportTitle {
    margin: 10px 0;
}

.reportTitle h2 {
    margin: 10px 0 5px;
}

.reportTitle .actions {
    float: right;
    margin-top: -30px;
}

.reportSummary {
    position: relative;
    border-bottom: none;
    width: 100%;
    margin-bottom: 10px;
}

.questionDetails .reportSummary {
    padding: 0;
}

.reportSummary.answerOptions {
    margin-top: 20px;
}

.answerOptions h4 {
    margin: 20px 0;
}

.answerOptions table {
    margin: 20px 0;
    border-collapse: collapse;
    min-width: 400px;
    max-width: 800px;
}

.answerOptions table td {
    padding: 5px;
    border: 1px solid;
}

.interrogativesTable td:first-child,
.phraseTable td:first-child,
.calculatedNumeric td:first-child {
    width: 150px;
}

.questionDetails .reportTable table {
    min-width: 400px;
    height: auto;
    margin: 10px 0;
    border: 1px solid;
}

.reportTable table {
    border: 1px solid;
}

.questionDetails .reportTable th,
.questionDetails .reportTable td,
.matching th,
.matching td {
    padding: 5px 10px;
    vertical-align: top;
    border: 1px solid;
    padding: 15px 10px;
}

.matchingNumber {
    display: inline-block;
    vertical-align: top;
}

.orderCanvasWide {
    width: 100%;
}

.questionDetails .reportTable th,
.matching th {
    padding: 10px 15px;
    vertical-align: middle;
    border: 1px solid;
}

.matching .lastOption td {
    border-bottom: 4px solid;
}

.reportKey {
    display: inline-block;
    border: 1px solid;
    margin: 20px 0;
    padding: 10px 8px;
}

.reportKey h3 {
    margin: 0;
}

.reportKey div {
    font-weight: bold;
    margin: 4px 0 0 16px;
}

.ordering table td img {
    margin: 0 5px;
}

.calculated {
    margin-top: 20px;
    clear: both;
    float: left;
}

ul.key {
    margin: 20px 0;
    width: 100%;
}

ul.key li {
    float: left;
    margin-right: 10px;
    padding-left: 17px;
    width: auto;
}

.smallCell ul {
    width: 50px;
}

li.recommended,
li.changed,
li.notallgraded {
    display: block;
    float: left;
    margin: 0;
    height: 16px;
}

.smallCell li.recommended,
.smallCell li.changed,
.smallCell li.notallgraded,
.questionTextId li.recommended,
.questionTextId li.changed,
.questionTextId li.notallgraded {
    width: 16px;
}

.smallCell li.recommended,
.smallCell li.changed,
.smallCell li.notallgraded {
    float: right;
}

li.recommended {
    background: url('/images/ci/icons/item_analysis_recommended.png') no-repeat;
}

li.changed {
    background: url('/images/ci/icons/item_analysis_changed.png') no-repeat;
}

li.notallgraded {
    background: url('/images/ci/icons/item_analysis_allgraded.png') no-repeat;
}

.previousReports a:hover {
    text-decoration: underline;
}

.reportKey h4 {
    margin: 0px;
    padding: 10px 0 0px 25px;
}


/*Item Analysis Fiter layout/design */

.questionFilter div div {
    float: left;
    margin-right: 20px;
    padding-right: 20px;
    border-right: 1px solid;
}

.questionFilter div div:last-child {
    padding-top: 10px;
    border: none;
}

.answerBlock {
    width: 100%;
    margin-bottom: 20px;
}

.answerBlock span {
    white-space: nowrap;
    /*LRN-60904*/
}

.answerValueStyle {
    width: 400px;
    height: 45px;
    padding: 4px;
    overflow: auto;
    vertical-align: top;
}

.pickerMonth .today a {
    outline: 0;
}


/* // FILE PICKER STYLES // */


/* Remove Learn background and padding around container */

body.filePickerWidget {
    background: url(none);
}

.filePickerWidget .locationPane {
    margin-top: 0px;
    padding-bottom: 60px;
}

.filePickerWidget .contentPaneWide {
    margin: 0px;
    background: url(none);
}

.filePickerWidget .contentBox,
.filePickerWidget #content {
    border: 0px;
    box-shadow: none;
    border-radius: 0px;
}


/*** Breadcrumbs Re-styling to Demonstrate File System Navigation ***/

.pathFolder {
    background-image: url("/images/ci/icons/tiny-folder.png");
    background-position: left top;
    background-repeat: no-repeat;
    padding-left: 20px !important;
    display: inline-block;
}

.pathSlash {
    padding-left: 5px !important;
    padding-right: 5px !important;
    display: inline-block;
}

.pathFolder a {
    color: #0C80AC;
    text-decoration: underline;
}

.pathfolder:before {
    content: "after";
    margin: 0 4px;
}


/*** Tab Navigation Structure for Picker ***/

#tabsBar {}

.tabsBar {
    min-height: 47px;
    background: #D1EAEF;
    -webkit-border-top-left-radius: 2px;
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topleft: 2px;
    -moz-border-radius-topright: 2px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom: 1px solid #BBBBBB;
}

.tabsBar a {
    text-decoration: none;
}

.tabsBar #tabs {
    float: left;
    height: 47px;
    display: inline;
}

.tabsBar .tabs {
    height: 47px;
}

.tabsBar .localViewToggle {
    -webkit-border-top-right-radius: 2px;
    -moz-border-radius-topright: 2px;
    border-top-right-radius: 2px;
    float: right;
}


/*** Navigate Top-level Content Zones ***/

img.zoneIcon {
    margin: 0 5px;
}


/*** Quick Search for All Content ***/

#contentSearch {
    background: transparent;
    padding: 5px;
    white-space: nowrap;
}

.contentInput,
.locationInput {
    -webkit-box-shadow: inset 0px 0px 2px 0px #666;
    -moz-box-shadow: inset 0px 0px 2px 0px #666;
    box-shadow: inset 0px 0px 2px 0px #666;
    border: 1px solid #ccc;
    background: #f7f7f7;
    padding: 3px 1px;
    outline: none;
    display: inline;
    margin: 0;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

#contentSearch .contentInput input[type="text"],
.locationInput input[type="text"] {
    border: 0;
    background: transparent;
    padding: 0;
    outline: none;
    height: 22px;
    line-height: 22px;
}

#contentSearch .contentInput,
.locationInput {
    margin-right: 4px;
    margin-left: 10px;
}


/*
.locationInput input[type="text"] {
  width: 90px;
}
*/


/*** This Section Will Contain Several Content Navigation and Viewing Functions ***/

#contentActions {
    margin: 0 0 10px 0;
    display: block;
}


/*** Navigate to Parent Folder ***/

#levelUp {
    margin: 2px 0;
}

#levelUp button {
    padding: 5px 7px 5px 5px;
    cursor: pointer;
}

#levelUp button::-moz-focus-inner {
    padding: 0;
    border: 0
}


/*** Jump to... ***/

#editablePath,
#quickPath {
    display: inline-block;
    background: #e7e7e7;
    background-image: -moz-linear-gradient(100% 100% 90deg, #ffffff, #dddddd);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(#dddddd), to(#ffffff));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#dddddd, endColorstr=#ffffff";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#dddddd, endColorstr=#ffffff);
    -webkit-box-shadow: inset 0px 2px 0px 0px #ccc;
    -moz-box-shadow: inset 0px 2px 0px 0px #ccc;
    box-shadow: inset 0px 2px 0px 0px #ccc;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border: 0;
    overflow: hidden;
}

#quickPath {
    padding: 0 0 0 5px;
}

.linkables {
    display: table;
    width: 100%;
    border-spacing: 5px;
}

.linkables .link {
    display: table-cell;
    vertical-align: top;
    white-space: inherit;
}

.linkables .folder-nav-up {
    width: 1%;
}

#quickPath ol li {
    display: inline-block;
    margin: 4px 0;
}

#quickPath ol li.folderIncluder,
#quickPath ol li.folderCreator {
    margin: 0;
}

.checkmark-btn {
    width: 22px;
    height: 20px;
    padding: 0 !important;
    margin-left: 10px;
    vertical-align: top;
}

.checkmark-btn.mark-inactive {
    background: #fff url(../../../images/cs/icons/include-folder-sprite.png) 3px -29px no-repeat !important;
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false) !important;
}

.checkmark-btn.mark-active {
    background: #fff url(../../../images/cs/icons/include-folder-sprite.png) 3px 3px no-repeat !important;
    filter: progid: DXImageTransform.Microsoft.gradient(enabled=false) !important;
    -webkit-box-shadow: inset 0px 0px 2px 1px #999;
    -moz-box-shadow: inset 0px 0px 2px 1px #999;
    box-shadow: inset 0px 0px 2px 1px #999;
}


/*** Add a New Button Style for Include Folder Toggle ***/

.linkables .button-5 {
    padding: 3px 8px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: #333;
    font-size: 95%;
    text-shadow: 0 1px 0 #eee;
    background: -moz-linear-gradient(100% 100% 90deg, #f9f9f9, #e7e7e7);
    background: -webkit-gradient(linear, left top, left bottom, color-stop ( 0%, #f9f9f9), color-stop(100%, #e7e7e7));
    background-position: -10px -10px\9;
    background-image: none\9;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#f9f9f9, endColorstr=#e7e7e7);
    border: 1px solid #ccc;
    display: inline-block;
    box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;
    outline: none;
    cursor: pointer;
}

.linkables .button-5::-moz-focus-inner {
    padding: 0;
    border: none;
}

.pressed {
    background: #fff url(../../../images/ci/icons/diag-thick-bg.png) top left repeat !important;
    -webkit-box-shadow: inset 0px 0px 3px 1px #999;
    -moz-box-shadow: inset 0px 0px 2px 1px #ccc;
    box-shadow: inset 0px 0px 3px 1px #999;
}


/*** Storage Quota Guage ***/

#storageQuota {
    font-size: 95%;
    color: #666;
    padding-left: 110px;
    position: relative;
    margin-top: 8px;
}

#storageQuota strong {
    color: #333;
}

.quotaGauge {
    width: 100px;
    height: 7px;
    line-height: 7px;
    font-size: 7px;
    border: 1px solid #333;
    background-color: #e7e7e7;
    position: absolute;
    top: 3px;
    left: 0px;
}

.quotaGauge div {
    height: 7px;
    line-height: 7px;
    background-image: -moz-linear-gradient(100% 100% 90deg, #00ADD0, #0189A4);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(#00ADD0), to(#0189A4));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ADD0, endColorstr=#0189A4";
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#00ADD0, endColorstr=#0189A4);
}


/*
  LEVEL ONE
*/

ul.dropdown {
    position: relative;
    height: 47px;
    -webkit-border-top-left-radius: 2px;
    -moz-border-radius-topleft: 2px;
    border-top-left-radius: 2px;
}

ul.dropdown li {
    font-weight: bold;
    float: left;
    zoom: 1;
    background: transparent;
    height: 47px;
}

ul.dropdown>li {
    border-right: 1px solid #BBBBBB;
    box-shadow: -1px 0px 0px #EEEEEE inset;
}

ul.dropdown>li:first-child {
    border-left: none;
}

ul.dropdown>li:first-child,
ul.dropdown>li:first-child>a {
    -webkit-border-top-left-radius: 2px;
    -moz-border-radius-topleft: 2px;
    border-top-left-radius: 2px;
}

ul.dropdown a:hover {
    color: #000;
}

ul.dropdown a:active {
    color: #ffa500;
}

ul.dropdown li a {
    display: block;
    color: #01869E;
    height: 47px;
    line-height: 46px;
    font-weight: normal;
}

ul.dropdown > li > a {
    padding: 0 32px;
}

ul.dropdown li:hover ul li a {
    padding: 0 12px 0px 4px;
}

ul.dropdown li.active {
    background: #ffffff;
    border-bottom: 1px solid #FFFFFF;
}

ul.dropdown li.active a {
    font-weight: bold;
    color: #000000;
}

ul.dropdown li#zoneChooser > a {
    padding: 0px 12px 0px 4px;
}

ul.dropdown li#uploadType > a {
    padding: 0px 12px 0px 20px;
}

ul.dropdown li#zoneChooser > a:after,
ul.dropdown li#uploadType > a:after {
    content: "";
    background-image: url('../../../images/ci/icons/tab-expand-chevron.png');
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 9px;
    margin-left: 8px;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
    background: #F6F6F6;
    color: #000000;
    position: relative;
}

ul.dropdown>li.hover,
ul.dropdown>li:hover {
    z-index: 99;
}

ul.dropdown li.hover a {
    color: black;
    z-index: 999;
}

ul.dropdown li.active:hover {
    background: #ffffff;
}

/*
  LEVEL TWO
*/

ul.dropdown ul {
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: -1px;
    z-index: 100;
    border: 1px solid #ccc;
    border-bottom: 0;
    min-width: 200px;
}

ul.dropdown>li:hover>ul,
ul.dropdown>li:focus>ul {
    z-index: 100;
    top: 46px;
}

ul.dropdown ul li {
    font-weight: normal;
    background: #f6f6f6;
    color: #000;
    border-bottom: 1px solid #ccc;
    float: none;
    padding: 0;
    white-space: nowrap;
    display: block;
}

ul.dropdown ul li a {
    background: none;
}

ul.dropdown li#uploadType ul li a {
    padding: 0px 12px 0px 20px;
}

ul.dropdown ul li > a.hover,
ul.dropdown ul li > a:hover {
    background: #ffffff;
    padding: 0;
}

#uploadEngine {
    border: 0;
}

#uploadEngine #dataCollectionContainer {
    margin: 0 -10px;
    padding: 0;
}

#legalAgreement {
    border: 1px solid #CCCCCC;
    height: 80%;
    margin: 15px;
    overflow: auto;
    padding: 8px;
}

#legalButtons {
    margin-right: 15px;
    margin-left: 15px;
}

/* Adjustments to splashTable container for Cloud Settings */

#cloudSettingsForm .stepcontent .label {
    width: 34%;
    min-width: 0px;
    max-width: none;
}

#cloudSettingsForm .stepcontent .field {
    width: auto;
}

#socialProfileSettings .splashTable tr>td:first-child,
#cloudSettingsForm .splashTable tr>td:first-child {
    width: 33%;
}

/* // NEWLY-INTEGRATED UTILITY CLASSES // */

.u_nopad {
    padding: 0 !important;
}

.u_nowrap {
    white-space: nowrap !important;
}

.insideContainer {
    padding: 20px;
}

.profileCardAvatarThumb a {}

.profileCardAvatarThumb img {
    height: 18px;
    width: 18px;
    border: 1px solid #ddd;
    display: inline-block;
    padding: 1px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
    background: #fff;
    background: rgba(255, 255, 255, .8);
}

.avatar {
    max-height: 140px;
    width: auto;
}

/*Skip Link top nav*/

.hideoff.skipLink {
    opacity: 0;
    background: rgba(0, 0, 0, .1);
}

#topNavSkipLink {
    color: #fff;
    font-size: 11px;
    top: -4px;
    left: 9px;
    padding: 9px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size: 10px\0/;
    /*IE*/
}

.skipLink {
    color: #fff;
    position: absolute;
    width: 140px!important;
    padding: 9px;
    background: #333;
    background: rgba(0, 0, 0, .7);
    text-align: center;
    font: normal 11px/1.4 Georgia, serif;
    text-transform: uppercase;
    -moz-border-radius: 5px;
    border-radius: 5px;
    top: 9px;
    left: 9px;
    opacity: 1;
    -moz-transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    z-index: 1000;
    font-size: 10px\0/;
    /*IE*/
}

.skipLink:focus {
    outline: 0;
}

div.skipLink {
    background: transparent;
    padding: 0;
    height: 0;
    width: 0;
    overflow: visible;
    z-index: 10000;
}

.abutton {
    text-decoration: none;
    background-color: transparent;
    padding: 0;
    border: none;
}

/* Note: The case I was fixing just needed .abutton for this, but all these other buttons do not switch the mouse pointer properly either.
If we have a consistent rule that 'everything clickable should have the cursor:pointer style' then please add these classes to this style:
   .genericButton:hover,.button-1:hover,.button-2:hover,.button-3:hover,.button-4:hover,
*/

.abutton:hover {
    cursor: pointer;
}

/* // BEGIN AX Quick Links // */

#quick_links_wrap {
    position: absolute;
    z-index: 1111;
    right: 100%;
    margin-right: -20px;
    font-size: 0.8em;
    border-left: 0;
    border-bottom: 0;
    -moz-border-radius: 0 4px 0 0;
    -webkit-border-radius: 0 4px 0 0;
    border-radius: 0 4px 0 0;
    width: auto;
    white-space: nowrap;
    height: 21px;
    line-height: 20px;
    background: rgba(0, 0, 0, 0.2);
    -ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#26000000, endColorstr=#26000000);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#26000000, endColorstr=#26000000);
    display: inline-block;
}

#quick_links_wrap:hover,
#quick_links_wrap.quick_link_wrap_focus {
    margin-right: auto;
    right: auto;
    left: -5px;
    background: #333;
    -ms-filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#62000000, endColorstr=#62000000);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#62000000, endColorstr=#62000000);
}

#quick_links_wrap a {
    display: block;
    height: 21px;
    line-height: 21px;
    background-image: url(/images/console/icons/ax-links.png);
    background-repeat: no-repeat;
    background-position: right 3px;
    padding: 0 21px 0 7px;
    color: #FAF9F6;
}

.ax-content {
    display: table;
    width: 100%;
}

.content-lite {
    display: table-cell;
    width: 70%;
    padding: 20px;
    border-right: 1px solid #ccc;
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    background: #fff;
}

.content-lite h2 {
    font-size: 1.2em;
    font-weight: normal;
    margin-bottom: 10px;
    display: block;
    background: #e7e7e7;
    padding: 4px 8px;
}

.content-lite h4 {}

.content-lite ul.shortcut-list {
    list-style: none;
    margin-left: 10px;
    margin-bottom: 20px;
}

.content-lite ul.shortcut-list li {
    margin-bottom: 6px;
}

.content-lite ul.shortcut-list a {
    text-decoration: underline;
}

.shortcut-list {}

#quick_links_headings_list>ul {
    clear: both;
    margin-top: 10px;
    margin-left: 12px;
}

#quick_links_headings_list ul {
    margin-left: 20px !important;
    margin-top: 5px !important;
}

.quick_links_header_h1 {}

.quick_links_header_h2 {
    margin-left: 3%;
}

.quick_links_header_h3 {
    margin-left: 6%;
}

.quick_links_header_h4 {
    margin-left: 9%;
}

.quick_links_header_h5 {
    margin-left: 12%;
}

.quick_links_header_h6 {
    margin-left: 15%;
}

.legend {
    display: table-cell;
    width: 30%;
    padding: 20px;
}

.legend h2 {
    font-size: 1.2em;
    font-weight: normal;
    margin-bottom: 10px;
    display: block;
}

.legend ul {
    list-style: none;
    margin-left: 0;
}

.legend ul li {
    margin-bottom: 12px;
    padding: 9px;
    border: 1px solid #ccc;
    background: white;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
}

.legend .keycombo {
    display: table;
    width: 100%;
    vertical-align: middle;
}

.legend span.presskey {
    display: inline-block;
    margin: 0 0 3px;
    width: 36px;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-align: center;
    border: 1px solid #333;
    background: #666;
    color: white;
    text-transform: uppercase;
    font-size: 80%;
    font-weight: normal;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    vertical-align: middle;
}

.legend span.presskey.alpha {
    font-weight: bold;
}

/* // END AX Quick Links // */

.blockReceipt {
    display: block !important;
}

.hideoff {
    position: absolute;
    overflow: hidden;
    left: -10000px;
    top: -1000px;
    /*width: 1px;
 height: 1px;*/
    width: 0;
    /*0 to avoid FF outline*/
    height: 0;
    /*0 to avoid FF outline*/
}

.hideoff[tabindex="0"] {
    top: auto;
}

/*Input type="file" */

/* Styles cannot be applied to input type="file" to make it blend  in with the rest of the ui.
 * Setting its opacity to 0 and laying it over the conventional looking button.
 */

.fileInputWrapper {
    float: left;
    position: relative;
    overflow: hidden;
    padding: 0 3px 0 0;
    margin-right: 9px;
    *top: -5px;
}

.fileInputWrapper input.hiddenInput {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    padding: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    text-align: right;
    font-size: 210%;
}

.fileInputWrapper input[type="file"] {
    filter: alpha(opacity=0)!important
}

.fileInputWrapper input.visibleInput {
    position: relative;
    right: 0;
    top: 0;
    z-index: 1;
}

.hideme {
    display: none !important;
}

.hidden {
    display: none;
}

.clearfloats {
    clear: both;
}

/*** Container Tabs ***/

.containerTabs li a {
    cursor: pointer;
}

.containerTabs li.active a {
    cursor: default;
}

.inlineContextMenu a.browse {
    font-weight: normal;
    word-break: normal;
    box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3) inset;
    border: 1px solid #ccc;
    border-color: #888;
    display: inline-block;
}

.inlineContextMenu.inlineContextMenu-hide {
    display: none;
}

.contentList .details .contextItemDetailsHeaders {
    background: transparent;
    font-size: inherit;
    padding: 2px 0 2px 6px;
    font-weight: normal;
    word-break: normal;
    color: #555;
}

.contextItemDetailsHeaders > .detailsValue {
    display: inline-block;
    margin: 0 0 0 10px;
}

.minWidthLabel {
    min-width: 65px;
}

/** these styles put some separation between the buttons in the review step */

span.reviewButtons {
    display: inline;
}

span.reviewButtons a {
    margin-right: 5px
}

.inventoryListCardView li {
    display: inline;
    float: left;
    padding: 3px;
}

.inventoryListCardView div.block {
    display: block;
    padding: 10px;
    border: 1px solid #E1E1E1;
    background-color: #FAFAFA;
    width: 200px;
    height: 130px;
    overflow: hidden;
    margin: 3px;
    border-radius: 3px;
}

.inventoryListCardView div.block div {
    display: block;
}

.noImgRumble.rumble_top,
.noImgRumble.rumble {
    background: none;
}

.inventoryListCardView div.smallCell input[type="checkbox"] {
    /* If we want to hide checkboxes by default, this can be display:none */
    display: block;
}

.inventoryListCardView div.smallCell input[type="checkbox"]:checked,
.inventoryListCardView div.block:hover div.smallCell input[type="checkbox"] {
    display: block;
}

.inventoryListCardView div.block div.smallCell {
    float: left;
    padding: 6px 0 0 0;
    width: 20px;
}

.inventoryListCardView div.block div.inlineMenuItems {}

.inventoryListCardView div.block div.inlineMenuItems ul.inlineMenuItems li {
    padding: 0 5px 0 0;
}

.inventoryCardViewToggle {
    float: right;
    margin: 0 0 0 8px;
}

.inventoryCardViewToggle a.cardView,
.inventoryCardViewToggle a.tableView {
    padding: 1px 3px;
    color: #999999;
}

.inventoryCardViewToggle a.cardView.active,
.inventoryCardViewToggle a.tableView.active {
    color: #000000;
}

.inventoryCardViewSorting {
    margin: 0 10px 0 0;
    float: right;
}

.inventoryCardViewSorting .cardSortTitle,
.inventoryCardViewSorting .cardSortOrder,
.inventoryCardViewSorting .cardSortLabel {
    float: left;
}

.inventoryCardViewSorting .cardSortLabel {
    padding: 2px 6px;
}

.inventoryCardViewSorting a.sortColumnMenu {
    border-radius: 2px 0 0 2px;
}

.inventoryCardViewSorting a.sortOrderMenu {
    border-radius: 0 2px 2px 0;
    border-width: 1px 1px 1px 0;
}

.inventoryCardViewSorting a.sortColumnMenu:after,
.inventoryCardViewSorting a.sortOrderMenu:after {
    height: 4px;
    vertical-align: middle;
    content: "";
    display: inline-block;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #000000;
    margin-top: 4px;
    opacity: 0.3;
}

.inventoryCardViewSorting a.sortColumnMenu:hover:after,
.inventoryCardViewSorting a.sortOrderMenu:hover:after {
    opacity: 1;
}

.inventoryListSortColumns li,
.inventoryListSortOrder li {}

.inventoryListSortColumns li:hover,
.inventoryListSortOrder li:hover {}

.inventoryListCardView .inventoryListCardHoverText {
    /* The hover-text cell is hidden and copied into the title of the card's span in inventoryList.CardController*/
    display: none !important;
}

.inventoryListCardView ul.inlineMenuItems {
    border-top: 1px solid #E1E1E1;
    margin: 0px -10px;
}

.inventoryListCardView ul.inlineMenuItems li {
    min-height: 30px;
    padding: 0;
    width: 33.3%
}

/* For inline menus with only 1 or 2 items, make the menu items wider instead of assuming 3 items (33% width)*/

.inventoryListCardView ul.inlineMenuItems_1_0 li {
    width: 100%
}

.inventoryListCardView ul.inlineMenuItems_2_0 li {
    width: 50%
}

.inventoryListCardView ul.inlineMenuItems li a {
    padding: 6px 0 12px;
    display: block;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    height: auto!important;
}

.inventoryListCardView ul.inlineMenuItems li a.cmimg,
.inventoryListCardView ul.inlineMenuItems li a.cmimg img {
    height: 0;
    width: auto;
}

.inventoryListCardView .cardPiece20 {
    height: 20px;
    max-height: 20px;
    overflow: hidden;
    padding: 0 0 0 18px;
}

.inventoryListCardView .cardPiece30 {
    height: 30px;
    max-height: 30px;
    overflow: hidden;
    padding: 0 0 0 18px;
}

.inventoryListCardView .cardPiece40 {
    height: 40px;
    max-height: 40px;
    overflow: hidden;
    padding: 0 0 0 18px;
}

.inventoryListCardView .cardPiece50 {
    height: 50px;
    max-height: 50px;
    overflow: hidden;
    padding: 0 0 0 18px;
}

.inventoryListCardView .cardPiece60 {
    height: 60px;
    max-height: 60px;
    overflow: hidden;
    padding: 6px 0 0 0;
}

.inventoryListCardView .cardPiece70 {
    height: 70px;
    max-height: 70px;
    overflow: hidden;
    padding: 6px 0 0 0;
}

.inventoryListCardView .cardPiece80 {
    height: 80px;
    max-height: 80px;
    overflow: hidden;
    padding: 6px 0 0 0;
}

.inventoryListSortOrder,
.inventoryListSortColumns {
    background: #e1e1e1;
    display: inline-table;
    position: relative;
    border: 1px solid #aaaaaa;
}

.inventoryListSortOrder li a,
.inventoryListSortColumns li a {
    width: 100%;
    display: block;
}

/* styling for "empty list" message */

.noItems.container-empty {
    padding-top: 90px;
    text-align: center;
    position: relative;
}

.noItems.container-empty .arrow-left,
.noItems.container-empty .arrow-right {
    position: absolute;
    width: 25%;
    height: 150px;
    top: 0;
    opacity: .3;
    filter: alpha(opacity=30);
}

.noItems.container-empty .arrow-left {
    background: transparent url("/images/ci/misc/overlay_arrow_left.png") right center no-repeat;
    background-size: 90% 70%;
    left: 0;
    background-position: left center \0/;
}

.noItems.container-empty .arrow-right {
    background: transparent url("/images/ci/misc/overlay_arrow_right.png") left center no-repeat;
    background-size: 90% 70%;
    right: 0;
    background-position: right center \0/;
}

.noItems.container-empty .main-message {
    text-align: center;
    width: 45%;
    margin: 0 auto 12px;
}

.noItems.container-empty .secondary-message {
    text-align: center;
    width: 45%;
    margin: 0 auto;
}

/* drag and drop file for file picker */

#globalNavPageContentArea .dropzone, li.dropzone {
    margin: 10px;
    font-weight: bold;
    line-height: 1.3em;
    border: 4px dashed;
    border-radius: 10px;
    padding: 20px;
}

#globalNavPageContentArea #dropzone.in, li#dropzone.in {
    line-height: 200px;
    font-size: larger;
}

#globalNavPageContentArea .dropzone.hover, li.dropzone.hover {
    color: #fff;
    background: #c56fd5;
    border: 4px dashed #c56fd5;
}

#globalNavPageContentArea .dropzone.fade, li.dropzone.fade {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    opacity: 1;
}

/* @end drag and drop file for file picker */

/*there are 2 elements that share a dropzone class.  Drap and drop marker in TOC, and the drag and drop file upload (above).  This style fixes the TOC dropzone*/

body > .dropzone[style*="position: absolute;"] {
    height: 0px;
    padding: 0px;
    margin: 0px;
}

#treeTableBody img[src*="rempty"] {
    opacity: 0;
    width: 0px;
}

/* Jquery UI bbDialog styles */

.bb-dialog.ui-dialog {
    width: 50% !important; /* needed to override inline styles given by juquery-ui */
    left: 25% !important; /* needed to override inline styles given by juquery-ui */
    text-align: center;

}

.bb-dialog.ui-dialog .ui-dialog-title {
    float: none;
}

.bb-dialog.ui-dialog .ui-dialog-content.ui-widget-content {
    padding: 10px 30px 30px 30px;
    font-size:22px;
    font-weight: lighter;
}

.bb-dialog.ui-dialog .ui-button-text-only {
    position:relative;
    margin: 10px;
}

.bb-dialog.ui-dialog .ui-dialog-buttonset {
    float: none;
    text-align: center;
    width: 100%;
}

.bb-dialog.ui-dialog ul {
    list-style: none !important; /*overriding inline-style given by jquery-ui */
}

@media only screen and (min-width:668px) {
    span.mobile-table-label {
        display: none;
    }
}
/* LTI launch */

.bltiLaunchForm img {
    display: block;
    padding-top: 10px;
    margin: auto;
    margin-bottom: -36px;
}

#bltiLaunchForm .submitStepBottom {
    width: auto !important;
    display: table;
    margin: auto;
    position: relative !important;
}

#lti-launch-iframe #containerdiv {
    padding: 12px;
}

#bltiLaunchForm div.field {
    overflow-x: auto;
}

.bltiLaunchForm h3.steptitle {
    text-align: center !important;
    height: 14px;
    margin: 0 auto !important;
}

.bltiLaunchForm #dataCollectionContainer #step1 {
    border: none !important;
    padding: 0;
    height: 85px;
    text-align: center;
}

.bltiLaunchForm #dataCollectionContainer #step1 #stepcontent1 {
    border: none !important;
    text-align: center;
    padding: 0;
    height: inherit;
}

.bltiLaunchForm #dataCollectionContainer #step1 #stepcontent1 p {
    text-align: center;
    display: block;
    margin: auto;
}

.bltiLaunchForm #dataCollectionContainer {
    margin: auto;
    padding-top: 25px;
}

.bltiLaunchForm div.field {
    width: 100%;
}

.bltiLaunchForm div#dataCollectionContainer .taskbuttondiv:first-child {
    padding: 18px 24px 18px 24px;
}

@media only and (max-width: 736px) and (min-width: 0) {
    .bltiLaunchForm #dataCollectionContainer {
        height: 230px;
        width: 93% !important;
    }

    .bltiLaunchForm #dataCollectionContainer {
         width: 92%;
         padding: 10px;
    }

    .bltiLaunchForm .submitStepBottom {
        width: 100% !important;
        left: 0px;
        position: relative;
    }

    .bltiLaunchForm div#dataCollectionContainer .taskbuttondiv:first-child {
        padding: 5px 20px 5px 20px;
    }

    .bltiLaunchForm #dataCollectionContainer #step1 {
        margin: 0 0 20px 24px;
    }
}

/* fluid iframe - http://www.bymichaellancaster.com/blog/fluid-iframe-and-images-without-javascript-plugins */
.fluidWrapper {
  /* margin: -20px -30px; */
  margin: auto;
  max-width: 100%;
}

.fluidFrame {
  position: relative;
  padding-bottom: 56.25%; /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
  padding-top: 0;
  height: 0;
  overflow: hidden;
}

.fluidFrame iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
