html {
    /*position: relative;*/
    min-height: 100%;
    font-size: 1em;
}

body, h1, h2, h3, h4, h5, h6 {
    /*font-family: "Raleway", sans-serif;*/
}

/* Adding padding to prevent overlap by footer */
section {
    /*padding-bottom: 200px;*/
    /*margin-bottom: 400px;*/
    /*min-height: 100vh;*/
    min-height: calc(100vh - 200px);
    /* was - 224 before*/
}

/* Footer Styling */
footer {
    /*position: absolute;*/
    bottom: 0;
    padding-bottom: 0;
    margin: 0;
    /*height: 200px;*/
    width: 100%;
    /*background-color: black;*/
    /*text-align: center;*/
    /*color: white;*/
}

/* Homepage styling */
.bg-black {
    background-color: black;
}

.homepage-background {
    background-image: url("/static/images/background.74255a08bb8b.jpeg");
    background-position: center;
    background-size: cover;
    height: 100vh;
    margin-top: -56px;
    background-repeat: no-repeat;
    color: white;
}

.cyber-background {
    background-image: url("/static/images/anonymous.ac7654f34db9.jpg");
    background-position: center;
    background-size: cover;
    height: 100vh;
    margin-top: -56px;
    background-repeat: no-repeat;
    color: white;
}

.homepage-grey {
    background-color: lightgray;
}

#homepage-photo {
    float: left;
    max-height: 250px;
    padding-right: 25px;
    padding-bottom: 10px;
}

.services {
    padding-bottom: 80px;
}

.tagline {
    font-size: 1.5rem;
}

a:link {
    text-decoration: none;
}

.fa-homepage {
    color: black;
    font-size: 5em;
}

/* Markdown pages */
.markdown * {
    /* font-family: "Roboto","Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif ;*/
}

/* Exercises */

.table-exercise {
    margin: 1em 2em;
    width: calc(100% - 4em);
!important; /* as wide as code blocks */
}

blockquote {
    border-left: 5px solid #eee; /* for exercises in course topics*/
    padding: 1em 1em 0.01em; /* fix for border */
}

code {
    color: black;
    border-radius: 5px;
    font-size: 95%;
    background: #f0f0f0;
}

pre {
    font-size: 95%;
}


/* Quiz */
.form-quiz {
    max-width: 1000px !important;
}

.solution_mark {
    position: absolute;
    margin-left: -3em;
}

/* Table styling Courses */
td.quiz {
    width: 25px;
    padding: 0.75rem;
    text-align: center;
}


/* Thank you message after event registration */
.thanks {
    left: 0;
    line-height: 200px;
    margin-top: -100px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
}


/* Table styling Events - past ones are greyed out */
tr.old {
    opacity: 0.4;
    filter: Alpha(opacity=50); /* IE8 and earlier */
}

/* Table styling Learning Path */
table.learning-path {
    max-width: 1000px;
}

td.completed {
    width: 25px;
    padding: 4px;
    text-align: right;
}

td.item {
    min-width: 200px;
    /*white-space: nowrap;*/
}

td.description {
    width: 10%;
}

/* Align the likes at the learning-materials page*/
.likes {
    text-align: right;
}

/* Learning Path Font Awesome check-marks styling */
.fa-check, .fa-external-link, .fa-times, .fa-lightbulb-o {
    font-size: 1.5em;
}

.lighter {
    opacity: .25;
}

/* Learning Path button styling (removing the blue border after clicking on it) */
.toggle_completed {
    outline: none !important;
    box-shadow: none;
    background-color: transparent;
}

/* Learning Path Steps*/
.learning-path-step {
    padding-left: 10px;
    border-radius: 10px;
    color: white;
    background-color: #4B8BBE;
}


/* Form Styling */
form {
    max-width: 600px;
}


.widget {
    border: 0;
    width: 100%;
    background-color: white;
    text-align: center;
    padding-top: 100px;
    padding-bottom: 20px;
}

/* YouTube video (on learning-path */
.youtube {
    align-content: center;
    text-align: center;
}

/* Jupyter Notebook Tutorials Styling */
iframe {
    padding: 0;
    margin: 0;
    border: none;
}

table#topics {
    max-width: 600px;
}

.topic_counter {
    width: 20px;
    padding-right: 0;
}

.techcheckform {
    max-width: 600px;
    max-height: 650px;
    height: -webkit-calc(100vh - 200px); /* google, safari */
    height: calc(100vh - 200px); /* firefox */
    /*margin-top: 59px;*/
    margin-right: auto;
    margin-left: auto;
}

.icon-services {
    padding-top: 20px;
    padding-bottom: 20px;
    height: 60%;
    width: 60%;
}

.icon-services:hover {
    transform: scale(1.08); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.icon-quiz {
    display: block;
    padding: 100px 0 100px 0;
    margin-left: auto;
    margin-right: auto;
    width: 60%;
}

.icon-contact {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 60%;
}


.icon-404 {
    display: block;
    padding: 100px 0 100px 0;
    margin-left: auto;
    margin-right: auto;
    width: 60%;
    opacity: 0.5;
}


/* YouTube videos */
.h_iframe iframe {
    width: 100%;
    height: 100%;
}

.h_iframe {
    height: 100%;
    width: 100%;
}

/* Course pictures */

.course-fade {
    opacity: 0.7;
}

.course-fade:hover {
    opacity: 1.0;
}


.btn-link {
    white-space: normal;
!important;
    text-align: left;
}

.logo {
    max-height: 100px;
    max-width: 200px;
    padding: 20px;
    filter: grayscale(0.4);
}
