.minicolors-theme-default .minicolors-input {
  height:30px !important; /* This is a workaround for a bug in the minicolors library */
}

/**
 * JS utility classes used by toggle_trigger.inc ctools content type. 
 */
html.js *.toggle-target-collapsed {
  display:none; 
}

html.js *.toggle-target-expanded {
  display:block;
}

html.js [class^="grid-"].toggle-target-expanded,
html.js [class*=" grid-"].toggle-target-expanded,
html.js span.toggle-target-expanded,
html.js a.toggle-target-expanded {
  display: inline;
}


/* Fade image in after load */
.lazyload,
.lazyloading {
  opacity:0;
}
.lazyloaded {
  opacity: 1;
  transition: opacity 200ms;
}

/**
 * Various initial sizes to block out space while image is loading
 * .pre-size is added if theme_image doesn't have a width attribute
 */
.lazyload.fragment-image,
.lazyloading.fragment-image {
  display:none; /* If JS disabled then hide the lazyload markup */  
}
html.js .lazyload.fragment-image,
html.js .lazyloading.fragment-image {
  display: block;
  height: 400px;
  width: 400px;
}
html.js .inline-formula .lazyload.highwire-embed
html.js .inline-formula .lazyloading.highwire-embed {
  width: 1em;
  height: 1em;
}
html.js .disp-formula .lazyload.highwire-embed,
html.js .disp-formula .lazyloading.highwire-embed {
  height: 50px;
  width: 100px;
}


/**
 * Spinning loader style (optional)
 * @TODO: evaluate impact on perceived speed.
 */

/*
.lazyload.fragment-image,
.lazyloading.fragment-image {
  width:200px;
  height:200px;
  margin:100px;
  display:inline-block;
  border-width:5px;
  border-style:solid;
  border-color:#FFF;
  border-top:solid 5px #BBB;
  border-radius:50%;
  animation: spin 1s infinite linear;
  opacity:.1;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
*/