/* GLOBAL STYLES ICL-NETWORK */

/* Mini menu for academic years etc */

/* IMPERIAL MINI MENU SECONDARY  */
ul.imperial-mini-menu-secondary li a {
  color:#fff;
  background: #003E74;
  padding:10px 20px;
  font-size:.75rem;
  text-decoration:none;
  letter-spacing: 1px;
  text-transform:uppercase;
  margin-right: 5px;
}

ul.imperial-mini-menu-secondary li a:hover {
  border:none;
  background: #0091D4;
  color:#fff;

}

ul.imperial-mini-menu-secondary li a,
ul.imperial-mini-menu-secondary li a:after,
ul.imperial-mini-menu-secondary li a:before {
  transition: all .5s;
}

ul.imperial-mini-menu, ul.imperial-mini-menu-secondary
{
    list-style:none;
    padding-left:0;
    margin:10px 0px;
}

ul.imperial-mini-menu li, ul.imperial-mini-menu-secondary li
{
    display:inline-block;
    margin: 10px 0px;
}


ul.imperial-mini-menu-secondary li a.mini-menu-active
{
    font-weight:700;
    color:#fff;
    background: #0091D4;
}


/* IMPERIAL MINI MENU */


ul.imperial-mini-menu li a {

    padding: 10px 25px 10px 25px;
    margin-right: 5px;
    border: 1px solid #D4EFFC;
    border-radius: 10px;
}


ul.imperial-mini-menu li a:hover
{
     background: #D4EFFC;
     color: #003E74;
     padding: 10px 25px 10px 25px;
}


ul.imperial-mini-menu li a.mini-menu-active
{
   background: #D4EFFC;
   color: #003E74;
   padding: 10px 25px 10px 25px;

}


/* Secondary Mini menu for single lists e.g. yos */
ul.imperial-mini-menu-secondary
{
    font-size: 1rem;
    margin: 10px 0px;
}

.module-image img{
    object-fit: cover;
    width: 128px;
    height: 128px;
  }



/* Stats boxes - shows a TITLE and a STAT */

/* Stats Box */
a .stats-box-wrap
{
    color:#666;
}
.stats-box-wrap {
    border: 1px solid #ccc;
    border-radius:5px;
    width: 140px;
    margin-right:20px;
    display: flex;
    flex-direction: column;
}

.stats-box-wrap .stats-box-stats
{
    padding:10px;
    text-align: center;
    font-weight: 500;
    font-size:30px;
    font-weight: 300;
    flex:1;
    height: 100px;
    line-height: 40px;

}
.stats-box-wrap .stats-box-title
{
    padding:10px;
    color:#fff;
    text-align: center;
    font-weight: 300;
    font-size:14px;
}

.stats-box-wrap  .small
{
    font-size:22px;
}

.stats-box-wrap  .medium
{
    font-size:30px;
}

.stats-box-wrap  .large
{
    font-size:45px;
}


.stats-box-wrap  .orange
{
    background:var(--orange-back);
}

.stats-box-wrap  .blue
{
    background:var(--blue-back);
}

.stats-box-wrap .green
{
    background:var(--green-back);
}

.stats-box-wrap .red
{
    background:var(--red-back);
}

.stats-box-wrap .grey
{
    background:var(--grey-back);
}
 /* End of stats boxes */

 .imperial-grey-text,  .imperial-grey
 {
     color:var(--grey);
 }

 /* Empty lists */
.empty-list
{
    color:#ccc;
    margin:10px 0px;
}


/* Hidden and shown */
.imperial-hide
{
    display:none;
}

.imperial-show
{
    display:block;
}

/* has toggle event  - add the pointer if you can can click it */
.has-toggle-event
{
    cursor:pointer;
}

.has-pointer
{
    cursor:pointer;
}

.has-radius
{
    border-radius: 10px;
}
.has-radius-left
{
    border-radius: 10px 0px 0px 10px;
}
.has-radius-right
{
    border-radius: 0px 10px 10px 0px;
}

.has-border-bottom
{
    border-bottom:1px solid #ccc;
}

.has-border
{
    border:1px solid #ccc;
}

.has-dashed-border
{
    border:3px dashed #ccc;
}

.has-line-through
{
    text-decoration: line-through;
}

/* Alignment */
.aC
{
    text-align:center;
}
.aR
{
    text-align:right;
}
.aL
{
    text-align:left;
}


/* two column lists */
.paired-data
{
    display: flex;
}
.paired-data > div
{
    padding-bottom:5px;
}
.paired-data > div:first-child
{
    font-weight:bold;
    width:120px;
    text-align:right;
    padding-right:10px;
}
.paired-data > div:second-child
{
     flex: 1;
}



/* Hide the wordpress user and search elements */
#wp-admin-bar-top-secondary
{
    display:none;
}



a .no-link
{
    color: var(--bulma-text-on-scheme);

}

/* File types */
/* Icon Types */
.file-type-link
{
	background-repeat: no-repeat;
	background-size: 45px;
	line-height:45px;
	padding-left: 48px;  /* width of the image plus a little extra padding */
	display: block;  /* may not need this, but I've found I do */
	padding-bottom:10px;

}

.pdf-download
{
	background-image: url('../assets/icons/files/pdf.png');
}

.doc-download
{
	background-image: url('../assets/icons/files/doc.png');
}

.ppt-download
{
	background-image: url('../assets/icons/files/ppt.png');
}

.xls-download
{
	background-image: url('../assets/icons/files/xls.png');
}

.img-download
{
	background-image: url('../assets/icons/files/img.png');
}

.txt-download
{
	background-image: url('../assets/icons/files/txt.png');
}


.mp3-download
{
	background-image: url('../assets/icons/mp3.png');
}

/* Avatars */
img.is-rounded {
    object-fit: cover;
}

img.avatar-small
{
    height:40px !important;
    width:40px !important;

}

img.avatar-medium
{
    height:65px !important;
    width:65px !important;
    min-width: 65px;
}


img.avatar-large
{
    height:164px !important;
    width:164px !important;
    min-width: 164px;
}


.icl-dot
{
    height: 12px;
    width: 12px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    margin-right:5px;
}

/* groups search stuff
*/
.group_search_results_wrap
{
    position:relative;
}


.group_search_results_wrap .group_search_results
{
    position:absolute;
    top:20;
    left:0;
    z-index:50;
    max-height:250px;
    overflow-x: hidden;
    overflow-y: auto;
    min-width:400px;
}

.imperial-hidden
{
    display:none;
}


/* CSS for the ajax whirly circle */
/* Use in JS file as follows */
/*         jQuery(feedback_div).html(draw_ajax_loading("Please Wait"));
*/
.imperial-loader-wrap
{
    display:flex;
    align-items:   center;
}

.imperial-loader img
{
    height:30px;
    padding-top:5px;
}

/* Allow content boxes to be 100% height */
.full-height, .is-full-height
{
    min-height:100%;
}


/** Element with fbackground image covering  */
.background-box-image
{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    min-height:280px;

}



/* Break words if in s small box */
.word-break
{
    word-break: break-word;
}



.drag-handle
{
    cursor:move;
}


.table th.rotated
{
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
}

.bulma-box-background
{
    background: var(--bulma-box-background-color);
}


/* Anything needs to be printed either PDF service or other has max width so prevent wrap */
.print-wrapper
{
    width:800px;
    margin:0px;
    padding:0px;
    min-height:1000px;
    background: var(--bulma-box-background);
    position:relative;
}

.print-paper
{
    padding:30px 60px;
}

.centered, table.centered
{
    margin:auto;
}

/* Align item to bottom of cell column */
.mt-auto
{
    margin-top:auto;
}

/* Align items centered vertically in dev */
.is-v-centered
{
    margin-top:auto;
    margin-bottom:auto;
}



/* Red and Green borders on textarea forms */
.form-success
{
    border :2px solid var(--success) !important;
}

.form-error
{
    border :2px solid var(--fail) !important;
}


/* Display the not allowed cursor */
.not-allowed
{
    cursor:not-allowed !important;
}

.tab-icon
{
    margin-right:5px;
}


/** Comments */
.icl-comment
{
    margin-bottom: 20px;
}
.icl-comment-header
{
    align-items: center;
    display:flex;
}
.icl-comment-user
{
    font-weight:700;
}
.icl-comment-date
{
    font-size:0.9rem;
}

/* List item iamges */
.list-item-image-placeholder
{
    width:64px;
    height:64px;
}
.list-item-image img
{
    width:64px;
    height:64px;
    border: 1px solid #ccc;
}


hr{
    margin:35px 0px;
    height:3px;
}

/* Avoid splitting content */
@media .avoid-print-break {
    break-inside: avoid;
}


/* Table of contents */
#ez-toc-container
{
    border:0px;
    background:#faf3e6;
    padding:1.5rem;

}
.ez-toc-title-toggle
{
    display:none;
}
#ez-toc-container a
{
    color:var(--link-color);
}

.icl-dark-mode .control.has-icons-left .icon, .control.has-icons-right .icon
{
    color:#ccc;
}



/* FOOTER */
.theme-footer
{
    font-size:12px;
    padding:10px;
    background: var(--bulma-background);
    width:100%;
    border:1px solid #ccc;    
    text-align:right;
    z-index: 999;
}

.theme-footer span
{
    margin-right:20px;
}

.fixed-footer{
    position: fixed;
    bottom:0;
}