/*
 * ---------------------------------------- *
 * Name:    IISS Events page Styles         *
 * Type:    CSS                             *
 * Version: Not Versioned                   *
 * Author:  Thomas Dale                     *
 * ---------------------------------------- *
 */

/* ============================
   global
   ============================ */

.enriched-headline {
    width: 100%;
}

.lt-ie9 .page .main,
.lt-ie9 .page .header-container .header,
.lt-ie9 .page .footer-container .footer,
.lt-ie9 .page .subbrand-navigation-container .subbrand-navigation { max-width: none; width: 960px; }

/* colours
   ---------------------------- */
.colour-darkgrey { background-color: #deded5; }

/* ============================
   modules
   ============================ */

/* event carousel
   ---------------------------- */
.event .slide h2 { padding: 8px 0; padding: 0.5rem 0; }
.event .abstract { padding-bottom: 8px; padding-bottom: 0.5rem; }

.spot-rotator .slides .slide .info h3,
.spot-rotator .slides .slide .info p a { color: #e32b2a; }
.spot.colour-darkgrey .spot-content > h2 { border-bottom: 1px solid #c3bfb5; padding-bottom: 5px; padding-bottom: 0.3rem; }
.spot .spot-content h3 { margin-bottom: 0; }

h2 > a.right.link { color: #e32b2a; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, sans-serif; font-size: 10px; font-size: 0.8rem; text-transform: uppercase; }
h2 > a.right.link:after { content: "R"; }

/* three column events */
.three-column { width: 100%; max-height: 350px; max-height: 35rem; overflow: hidden; display: table; }
.three-column .col { border-left: 2px solid #ffffff; width: 33.333333333%; position: relative; display: table-cell; vertical-align: top; }
.three-column .col .container { height: 100%; overflow: auto; }
.three-column .col h2 { font-family: Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; line-height: 1.2em; padding: 2px 0 8px; padding: 0.2rem 0 0.8rem; }
.three-column .col h2 > a { color: #000000; }
.three-column .col h4 { color: #C34431; font-size: 1.2em; font-weight: bold; text-transform: uppercase; }
.three-column .col .article { padding: 10px; padding: 1rem; }
.three-column .col .article p { margin: 0; }
.three-column .col .article p.read-more { margin-top: 8px; margin-top: 0.8rem; }
.three-column .col .article p.read-more > a { color: #C34431; }
.three-column .col span.event-date.lrg { left: 10px; left: 1rem; top: 10px; top: 1rem; }

/* featured events
   ---------------------------- */
#events article { position: relative; }
#events .featured-event { width: 48%; padding-left: 52px; padding-left: 3.25rem; padding-top: 0.2em; }
#events .right { width: 48%; }
#events .item:first-child { background-position: 0 0; border: none; margin: 0; padding-top: 0; }
#events .item { border-top: 1px solid #c3bfb5; margin-top: 2em; padding-left: 3.5em; padding-top: 2.5em; }
#events .item h2 { font-size: 1.8em; }

.events-page span.event-date { background: url("/Assets/images/CONTENT_IMAGES/icons/date-bg.png") no-repeat 0 0 transparent; color: #ffffff; display: block; font-family: Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; font-size: 0.8em; font-weight: bold; height: 32px; left: 0; line-height: 1.2em; position: absolute; text-align: center; text-transform: uppercase; top: 0; width: 26px; }
.events-page span.event-date > span { display: block; font-size: 1.6em; padding: 0.7em 0 0.25em 0; }
#events .item span.event-date { top: 2.4em; }
#events .item:first-child span.event-date { top: 0; }
.events-page span.event-date.lrg { background-image: url("/Assets/images/CONTENT_IMAGES/icons/date-bg-lrg.png"); font-size: 1.1em; height: 54px; left: 0; line-height: 1.7em; top: 0; width: 44px; }
.events-page span.event-date.lrg > span { font-size: 2.8em; padding: 0.6em 0 0;  }

.events-page .spot.spot-email-campaign { height: 100%; }

/* sidebar
   ---------------------------- */
.spot ul.event-location { padding-top: 2em; }
.spot ul.event-location li:first-child { border-top: 1px solid #c3bfb5; }
.spot ul.event-location li { border-bottom: 1px solid #c3bfb5; color: #4b4b4b; font-size: 1.15em; font-weight: bold; padding: 0.8em 0; text-transform: uppercase; }
.spot ul.event-location li > a.link { color: #4b4b4b; }
.spot ul.event-speakers { padding-top: 1em; }
.spot ul.event-speakers li { color: #4b4b4b; font-size: 1.1em; font-weight: bold; padding-top: 0.2em; }

/* events page
   ---------------------------- */
.events-page .content-top .enriched-headline .text-content { width: 100%; }
.spot-event-info { padding: 1em 1em 2em; height: 100%; position: relative; }
.spot-event-info .date-time { color: #c34431; padding-left: 52px; padding-left: 3.25rem; padding-top: 3em; }
.spot-event-info .date-time span.event-date { font-size: 1.1em; left: 1em; line-height: 1.7em; top: 1em; }
.spot-event-info .date-time span.event-date > span { font-size: 2.8em; }
.spot-event-info p { font-size: 1.1em; line-height: 1.2em; }

/* search events */
.content-top .topic-search-box { overflow: hidden; padding-left: 2px; padding-right: 2px; padding-bottom: 2em; }
.content-top .topic-search-box .input-wrap input[type="submit"] { float: left; color: #ffffff; background: #e32b2a; width: 2.2em; height: 1.15em; border: none; margin: 2px 0 0 0; padding: 0; font-family: Icons; cursor: pointer; font-size: 1.9em; line-height: 1em; position: static; top: 1px; left: 9em; text-decoration: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; text-align: center; }
.content-top .topic-search-box .input-wrap { float: left; }
.content-top .topic-search-box .input-wrap input[type="text"] { color: #b7b7b7; float: left; width: 20em; margin: 0 .5em 0 0; padding: 0.4em 0.8em; }
.content-top .topic-search-box .input-wrap input[type="text"]:focus { color: #11336a; }
.content-top .advanced-search { float: left; padding-left: 1.4em; padding-top: 0.5em; }
.content-top .advanced-search > a { text-decoration: none; color: #11336a; margin-left: 1.2em; }

/* recent events */
.spot.recent-events .spot-content h2 > a { float: right; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, sans-serif; font-size: 0.4em; font-weight: normal; text-transform: uppercase; }
.spot.recent-events .spot-content h2 > a:after { content: "R"; margin-top: -0.8em; top: 50%; }
.spot.recent-events .spot-content ul.menuList > li { padding: 0.5em 1em 0.5em 3em; position: relative; }
.spot.recent-events .spot-content ul.menuList li:after { margin-top: -0.8em; top: 50%; }
.spot.recent-events .spot-content span.event-date { margin-top: -2.1em; top: 50%; }

/* events list */
.content .article { margin: 1px 2px 0 0; }
.events-page .article.spot { margin: 0; }
.article .events-page ul.events-list { border: 0; border-left: 2px solid #ffffff; list-style: none; margin: 0; padding: 0; }
.article .events-page ul.events-list > li:first-child { border-top: none; }
.article .events-page ul.events-list > li { background-color: #f3f3f3; border-top: 2px solid #ffffff; min-height: 155px; overflow: hidden; padding-left: 14em; }
.article .events-page ul.events-list > li .img { left: 0; max-height: 155px; max-width: 110px; overflow: hidden; position: absolute; top: 0; }
.article .events-page ul.events-list > li .img > img { margin: 0; }
.article .events-page ul.events-list > li .event-date { font-size: 0.6em; left: 17em; top: 2em; }
.article .events-page ul.events-list > li h3 { margin: 0; padding: 4px 0 2px; padding: 0.4rem 0 0.2rem; }
.article .events-page ul.events-list > li a { color: #000000; }
.article .events-page ul.events-list > li p.location { display: block; line-height: 11px; line-height: 1.1rem; font-size: 1em; font-weight: bold; max-width: 50%; padding-top: 2px; padding-top: 0.2rem; }
.article .events-page ul.events-list > li p.location .area { clear: both; display: block; font-size: 0.9em; margin: 0; }
.article .events-page ul.events-list > li p.location .type { font-size: 0.9em; text-transform: uppercase; }
.article .events-page ul.events-list > li p.time { font-weight: bold; position: absolute; right: 2em; top: 1.5em; }
.article .events-page ul.events-list > li p { font-size: 0.9em; margin: 0; }
.article .events-page ul.events-list > li p.read-more { margin-top: 3px; margin-top: 0.3rem; }
body .page .main .content .article .default-item-list li:before { display: none; }

/* ============================
   detail page
   ============================ */

.event-detail .event { padding-left: 60px; padding-left: 3.75rem; position: relative; }
.event-detail .event h3 { margin: 0; padding: 0; }
.event-detail .event h3 span.type { text-transform: uppercase; }
.event-detail .event h3 span.date-time { font-weight: normal; padding-left: 20px; padding-left: 1.3rem; }
.event-detail .event h1 { line-height: 1.1em; margin-top: 0; }
.event-detail .past-event span.event-date { background-image: url("../images/CONTENT_IMAGES/icons/date-expired-bg-lrg.png"); }
.event-detail a.back-button { color: #11336a; display: block; font-size: 1.4em; font-weight: bold; margin-bottom: 30px; margin-bottom: 2rem; text-decoration: none; text-transform: uppercase; }
.event-detail a.back-button.icon-arrow-left:before { color: #1b336b; position: static; font-size: 1em; top: 0; left: 0; font-family: "Icons"; text-transform: none; }

.main .content-top .article { margin-right: 0; }

/* download button
---------------------------- */
.event-detail .download-link { background: url("../images/CONTENT_IMAGES/icons/download-btn-bg.png") no-repeat 0 0 transparent; color: #ffffff; display: block; float: left; font-size: 1.2em; height: 41px; line-height: 1.2em; margin: -10px 10px 0 0; margin: -0.6rem 0.6rem 0 0; padding-top: 5px; padding-top: 0.4em; text-align: center; text-decoration: none; width: 65px; }

/* event image
---------------------------- */
.event-detail .article img { margin-top: 0; }

/* event profiles
---------------------------- */
.event-detail .event-profiles { overflow: hidden; padding: 20px 0 0; padding: 1.25rem 0 0; }
.event-detail .event-profiles h3 { border-bottom: 1px solid #bdbdbd; margin-bottom: 20px; margin-bottom: 2rem; padding-bottom: 5px; padding-bottom: 0.5rem; }
.event-detail .event-profiles .profile .img { float: left; margin: 0 10px 20px 0; margin: 0 1rem 0.2rem 0; }
.event-detail .event-profiles .profile .img img { margin: 0; }
.event-detail .event-profiles .profile p { margin: 0; padding: 0; }
.event-detail .event-profiles .profile p span { display: block; font-weight: bold; }
.event-detail .invitation h2 { border-bottom: 1px solid #c5c5c5; padding: 0 0 10px; }
.event-detail .spot.invitation #login-button { display: inline-block; }
.event-detail .spot.invitation input.button { background: #c64231 url('/Assets/images/icons/btn-arrow.png') right 11px center no-repeat; padding: 5px 21px 5px 13px; color: #ffffff; font-size: 12px; font-weight: 400; text-decoration: none; text-transform: uppercase; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: none; }
.event-detail .spot.invitation .invitation-status .status { font-weight: bold; }

/* attend button */
.event-detail .attend-button > a { color: #ffffff; display: block; font-size: 1.5em; font-weight: bold; padding: 20px; text-align: center; text-transform: uppercase; }

/* location */
.event-detail .location h2 { border-bottom: 1px solid #c5c5c5; padding: 0 0 10px; padding: 0 0 0.65rem; }
.event-detail .location p { line-height: 1.3em; margin: 0; padding: 0; }
.event-detail .location .info { font-style: normal; padding-bottom: 10px; padding-bottom: 0.65rem; }

/* back button */
.event-detail .article-navigation { margin: 30px 0; margin: 2rem 0; }

/* ============================
   helper classes
   ============================ */

.left { float: left; }
.right { float: right; }
.clear { clear: both; }

/* ============================
   responsive
   ============================ */

@media screen and (max-width: 768px) {
    .item-double .spot { height: auto; overflow: hidden; }
    body .page .main .aside .spot.recent-events { clear: both; width: 100%; }

    /* search events
    ---------------------------- */
    .content-top .topic-search-box .input-wrap input[type="text"] { width: 15em; }
    .content-top .advanced-search { clear: both; padding-left: 0; }
    .content-top .advanced-search > a { margin-left: 0; padding-left: 0; }
    .content-top .advanced-search > span { display: none; }

    /* event listing
    ---------------------------- */
    body .page .main .content .article .events-list > li .img,
    .event-detail .event-profiles .profile .img { display: none; }
    .article .events-page ul.events-list > li .event-date { font-size: 0.6em; left: 2em; top: 2em; }
    .article .events-page ul.events-list > li p.time { padding-left: 3.4em; padding-top: 2px; padding-top: 0.2rem; position: relative; right: auto; top: auto; }
    .event-detail .event-profiles .profile { padding-bottom: 20px; padding-bottom: 1.3rem; }
    .article .events-page ul.events-list > li p.location { margin-left: 3.1em; }
    .events-page .item-hero.event,
    .events-page #featured-events,
    .events-page .item.item-sidekick { display: none; }
    .events-page .article ul.events-list { border-left: none; }
    .article .events-page ul.events-list > li { padding-left: 20px; }

    /* three column events
    ---------------------------- */
    .three-column { max-height: none; }
    .three-column .col { border-left: none; border-top: 2px solid #ffffff; max-width: 100%; }
    body .page .main .content-top .three-column .col .article { padding-left: 10px; padding-left: 1rem; }

    /* event detail
    ---------------------------- */
    .event-detail .event { padding-left: 0; padding-top: 10px; padding-top: 0.4rem; }
    .event-detail .event h3,
    .event-detail .event h1 { padding-left: 60px; }
    body .page .event-detail .content-top h1 { margin: 35px 0 30px; margin: 2.15rem 0 1.92rem; }
    body .page .event-detail .aside .attend-button,
    body .page .event-detail .aside .location { width: 100%; }
    body .page .event-detail .content { padding: 0 3%; }
    .event-detail .article-navigation { margin: 16px 0; margin: 1rem 0; }
    .events-page .article ul.events-list > li .event-date,
    .events-page span.event-date { -moz-background-size: 26px auto; -webkit-background-size: 26px auto; background-image: url("../images/CONTENT_IMAGES/mobile-icons/date-bg-lrg.png"); background-size: 26px auto; }
    .events-page span.event-date.lrg { -moz-background-size: 44px auto; -webkit-background-size: 44px auto; background-image: url("../images/CONTENT_IMAGES/mobile-icons/date-bg-lrg.png"); background-size: 44px auto; }
    .event-detail #past-event span.event-date { -moz-background-size: 44px auto; -webkit-background-size: 44px auto; background-image: url("../images/CONTENT_IMAGES/mobile-icons/date-expired-bg-lrg.png"); background-size: 44px auto; }
    .event-detail .download-link { -moz-background-size: 65px auto; -webkit-background-size: 65px auto; background-image: url("../images/CONTENT_IMAGES/mobile-icons/download-btn-bg.png"); background-size: 65px auto; }
}
@media screen and (max-width: 480px) {

 /* featured events
    ---------------------------- */
 #events .featured-event,
 #events .right { width: 100%; }
 #events .item:first-child { background-position: 0 25px; border-top: 1px solid #c3bfb5; margin-top: 2em; padding-top: 2.5em; }
 #events .item:first-child span.event-date { top: 3.3em; }

 /* search events
    ---------------------------- */
 .content-top .topic-search-box { margin: 0 auto; max-width: 90%; }

 /* event listing
    ---------------------------- */
 body .page .main .content .article .default-item-list li { margin-bottom: 1px; }
 body .page .main .content .article .events-list.default-item-list li { margin-bottom: 1px; padding-left: 0.8em; }
 body .page .main .content .article .events-list > li .img,
 .event-detail .event-profiles .profile .img { display: none; }
 .article .events-page ul.events-list > li .event-date { font-size: 0.6em; left: 2em; top: 2em; }
 .article .events-page ul.events-list > li p.location { margin-left: 3em; }
 .article .events-page ul.events-list > li p.time { padding-left: 3.4em; padding-top: 2px; padding-top: 0.2rem; position: relative; right: auto; top: auto; }
 .event-detail .event-profiles .profile { padding-bottom: 20px; padding-bottom: 1.3rem; }

 /* event detail
    --------------------------- */
 .event-detail .event { margin: 0 3%; }
 .event-detail .event h3 span.date-time { display: block; padding-left: 0; }

 /* article meta */
 .event-detail .download-link { float: none; margin: -10px auto 10px; margin: -0.6rem auto 0.6rem; }
 .event-detail .article .meta .topics { clear: both; overflow: hidden; padding: 3% 5%; }

 /* helper classes
    ---------------------------- */
 .left,
 .right { float: none; }
}