body {
    margin-left: 15px;
    margin-right: 15px;
}

body.darktheme {
    background-color: #1E1E1E;
    color: #C8C8C8;
}

div.content {
    margin-top: 70px; /* Account for the fixed header*/
}

.description {
    margin-bottom: 10px;
    font-size: 16px;
}

ol {
    margin-top: 5px;
}

.glyphicon:hover {
    cursor: pointer;
}

.task-item-container {
    margin-top: 10px;
    margin-bottom: 10px;
}

.task-item-container pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
}

.incomplete-check, .complete-check, .glyphicon-print, .glyphicon-tint {
    margin-right: 8px;
}

.help {
	float: right;
	margin-top: -28px;
	margin-right: 4px;
}

@media print {
	.help {
		display: none !important;
	}
}

/* Loading overlay with animation (picked up from http://tobiasahlin.com/spinkit/) */
.loaded-content {
    display: none;
}

.loading-overlay {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: #000;
    opacity: 0.25;
}

.loading-animation {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    width: 80px;
    height: 80px;
    background-color: #333;
    -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
    animation: sk-rotateplane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
    0% {
        -webkit-transform: perspective(120px);
    }

    50% {
        -webkit-transform: perspective(120px) rotateY(180deg);
    }

    100% {
        -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);
    }
}

@keyframes sk-rotateplane {
    0% {
        transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    }

    50% {
        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    }

    100% {
        transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    }
}
/* End of loading overlay */

/* Overrides to bootstrap styles */
.progress {
    height: 5px;
    margin-bottom: 0px;
    border-radius: unset;
}

.alert {
	padding: 5px;
    margin-bottom: 10px;
}

.preview {
	padding: 15px;
	padding-right: 35px;
	margin-bottom: 30px;
}

.task-alert {
    margin-bottom: 5px;
    padding: 3px;
    border: none;
    box-shadow: none;
}