@font-face {
    font-family: 'Helvetica Neue';
    src: url('../fonts/HelveticaNeue/helveticaneueltstdroman.eot');
    src: url('../fonts/HelveticaNeue/helveticaneueltstdroman.eot?#iefix') format('embedded-opentype'),
        url('../fonts/HelveticaNeue/helveticaneueltstdroman.svg#helveticaneueltstdroman') format('svg'),
        url('../fonts/HelveticaNeue/helveticaneueltstdroman.ttf') format('truetype'),
        url('../fonts/HelveticaNeue/helveticaneueltstdroman.woff') format('woff'),
        url('../fonts/HelveticaNeue/helveticaneueltstdroman.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Helvetica Neue Ex';
    src: url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.eot');
    src: url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.eot?#iefix') format('embedded-opentype'),
        url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.svg#HelveticaNeueLTStd-Ex') format('svg'),
        url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.ttf') format('truetype'),
        url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.woff') format('woff'),
        url('../fonts/HelveticaNeue/HelveticaNeueLTStd-Ex.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'MyriadPro-Regular';
    src: url('../fonts/MyriadPro/myriadproregular.eot');
    src: url('../fonts/MyriadPro/myriadproregular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadproregular.woff') format('woff'),
         url('../fonts/MyriadPro/myriadproregular.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadproregular.svg#myriadproregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro-Bold';
    src: url('../fonts/MyriadPro/myriadprobold.eot');
    src: url('../fonts/MyriadPro/myriadprobold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadprobold.woff') format('woff'),
         url('../fonts/MyriadPro/myriadprobold.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadprobold.svg#myriadprobold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro-BoldCond';
    src: url('../fonts/MyriadPro/myriadproboldcond.eot');
    src: url('../fonts/MyriadPro/myriadproboldcond.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadproboldcond.woff') format('woff'),
         url('../fonts/MyriadPro/myriadproboldcond.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadproboldcond.svg#myriadproboldcond') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro-Cond';
    src: url('../fonts/MyriadPro/myriadprocond.eot');
    src: url('../fonts/MyriadPro/myriadprocond.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadprocond.woff') format('woff'),
         url('../fonts/MyriadPro/myriadprocond.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadprocond.svg#myriadprocond') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro-SemiboldCond';
    src: url('../fonts/MyriadPro/myriadprosemiboldcond.eot');
    src: url('../fonts/MyriadPro/myriadprosemiboldcond.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.woff') format('woff'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.svg#myriadprosemiboldcond') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'MyriadPro-SemiboldCond';
    src: url('../fonts/MyriadPro/myriadprosemiboldcond.eot');
    src: url('../fonts/MyriadPro/myriadprosemiboldcond.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.woff') format('woff'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.ttf') format('truetype'),
         url('../fonts/MyriadPro/myriadprosemiboldcond.svg#myriadprosemiboldcond') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
   font-size: 1rem;
   color: #636363;
   font-family: 'MyriadPro-Regular';
}

h1,h2,h3 {
   font-family: 'Helvetica Neue Ex';
   color: #824489;
}

h3.main-title {
    font-size: 2.0rem;
}

#header, #content {
    max-width: 1200px;
    margin: 0px auto;
}

#content {
    position: relative;
    background: url("../img/wrapper.jpg");
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;

}

#content .readable {
    position: relative;
    z-index: 2;
    min-height: 300px;
}

#footer {
    z-index: 0;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0.05) 20%, rgba(255,255,255,0) 100%);
    min-height: 300px;
    background-repeat: repeat-x;
}

#footer-navigation {
    width: 100%;
    z-index: 1;
    position: relative;
    padding-top: 0px;
}

#footer-navigation ul {
    margin: 0px;
    padding: 20px 0px 20px 0px;
    text-align: center;
}

#footer-navigation ul li {
 display: inline-block;
 width: auto;
}

#footer-navigation ul li a {
  text-decoration: none;
  color: #824489;
  padding: 15px 10px 15px 10px;
}

.home-block {
    padding: 0px 5rem 0px 5rem;
}

.lecturer {
   display: flex;
}

.lecturers img {
    max-height: 50px;
    padding-right: 10px;
}
.lecturers h4 {
    color: #824489;
    line-height: 50px;
}

.details {
   color: #824489;
   font-size: 1.3rem;
}

.details p {
    line-height: 1.6rem;
}

.details p.stylized {   
     font-family: 'Helvetica Neue Ex';
}

@media (max-width: 1199.98px) { 
    h3.main-title { font-size: 2.0rem; }
    .home-block { padding: 0px 2rem 0px 2rem; }
}

@media (max-width: 991.98px) { 
    h3.main-title { font-size: 1.8rem; }
    .home-block { padding: 0px 1rem 0px 1rem; }
}

@media (max-width: 767.98px) {
    h3.main-title { font-size: 1.4rem; }
    .home-block { padding: 0px 0.5rem 0px 0.5rem; }
    .details { font-size: 1.2rem; }
    .details p { line-height: 1.3rem; }
    .lecturer h4 { line-height: 30px; }
    .lecturer img { max-height: 30px; }

    #footer-navigation { padding-top: 0px; }
    #footer-navigation ul li { width: 100%; display: inline-block; padding: 10px 0px;}
}

@media (max-width: 575.98px) {
    h3.main-title { font-size: 1.8rem; }
    .details { font-size: 1.2rem; }
    .details p { line-height: 1.3rem; }
}

@media (max-width: 380px) {
    h3.main-title { font-size: 1.4rem; }
    .details { font-size: 1rem; }
    .details p { line-height: 1rem; }
}

/* -------------------------------------------------------------------------*/
/* X-Small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px)       { }
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px)       { }
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px)       { }
/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px)      { }
/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px)      { } 
/* -------------------------------------------------------------------------*/
/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px)    { }
/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px)    { }
/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px)    { }
/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px)   { }
/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px)   { }
/* XX-Large devices (larger desktops) */
/* No media query since the xxl breakpoint has no upper bound on its width */
/* -------------------------------------------------------------------------*/