/* A recipe on covering spinner from http://www.menucool.com/9499/CSS-loading-spinner-with-a-semi-transparent-background */

/* We use sticky navigation bar, this is needed to offset page content for it */
body {
  min-height: 75rem;
  padding-top: 4rem;
}

/* an attempt to make a tour tooltip wider */
.introjs-tooltip {
    width: 500px;
}

#loadingSpinner {
    position:fixed;
    width:100%;
    left:0;right:0;top:0;bottom:0;
    background-color: rgba(255,255,255,0.7);
    z-index:9999;
    display:none;
}

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

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

#loadingSpinner::after {
    content:'';
    display:block;
    position:absolute;
    left:48%;top:40%;
    width:40px;height:40px;
    border-style:solid;
    border-color:black;
    border-top-color:transparent;
    border-width: 4px;
    border-radius:50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}

/* end of "covering spinner" */

.width400 {
    width: 400px
}