@import url('bootstrap.css');
@import url('fontawesome.css');

/* ==========================================================================
 * Global
========================================================================== */

html { height: 100%; scroll-behavior: smooth; }
body {
    font-size: 23px;
    line-height: 26px;
    font-weight: 500;
    background: #7cadd4;
    font-family: Arial, Helvetica, sans-serif;
    color: #002c64;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
}

a { color: #464646; text-decoration: none }

h1 { text-transform: uppercase; font-weight: 800; font-size: 30px; }
h2 {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 52px;
    margin-bottom: 30px;
}
ul { line-height: 26px; font-size: 17px; }

.wrap { padding: 110px 0 30px; }
.small { font-size: 16px; }
.label { font-size: 13px; }

/* ==========================================================================
 * Header
========================================================================== */

.header { background: #fff; padding: 15px; z-index: 9999; position: fixed; width: 100%; }
.clock { float: right; font-size: 35px; font-weight: 700; margin: 12px 0 0; }

/* ==========================================================================
 * Main
========================================================================== */

#par { overflow: hidden; }
article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }

#slideshow { 
  margin: 50px auto; 
  position: relative; 
  width: 240px; 
  height: 240px; 
  padding: 10px; 
  box-shadow: 0 0 20px rgba(0,0,0,0.4); 
}

#slideshow > div { 
  position: absolute; 
  top: 10px; 
  left: 10px; 
  right: 10px; 
  bottom: 10px; 
}

/* ==========================================================================
 * Blocks
========================================================================== */

.item { background: #fff; border-radius: 15px; margin-bottom: 25px; }

.item-content { padding: 20px; }
.item img {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    width: 100%;
    height: 220px;
    object-fit: contain;
    background: #002c64;
}

.name { color: #7cadd4; }
.status {
    background: #002c64;
    color: #fff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    text-align: center;
    width: 100%;
    padding: 5px;
    font-size: 13px;
    font-weight: 700;
}
.agenda { background: #fff; padding: 20px; border-radius: 15px; }
.deadline { font-size: 18px; }

.ics-calendar-list-wrapper .ics-calendar-label, .ics-calendar .event .descloc div { display: none; }
.ics-calendar-list-wrapper .ics-calendar-date { font-size: 15px; color: #7cadd4; margin: 0 0 5px;}
.ics-calendar dl.events dt.time, .ics-calendar dl.events dt.all-day-indicator { float: left; padding-top: 0; margin-right: 15px; }
.ics-calendar dl.events { font-size: 17px; }
.ics-calendar-list-wrapper .event { clear: none; }
.end_time { display: none !important; }

.form {
    background: #fff;
    padding: 15px;
    border-radius: 15px;
}
.form button { width: 100% !important; background: #39be18 !important; border-color: #39be18 !important; }

/* ==========================================================================
 * Footer
========================================================================== */

footer, footer a { color: #c8e0f3; font-size: 15px; }


.d-sm-none { display: block !important; }

@media screen and (max-width: 720px) {
    .item-image { float: left; width: 20% !important; margin-right: 15px; }
    .item { margin-bottom: 15px; }
    .item img { border-top-right-radius: 0; border-top-left-radius: 15px; border-bottom-left-radius: 15px; height: 108px; }
    .item-content { padding: 15px; font-size: 15px; }
    .small, .deadline { font-size: 14px; }
    .d-sm-none { display: none !important; }
}