/*
=========================================================
EVENT CALENDAR CSS
=========================================================
 * Innehåller styling för evenemangskalendern
 * 
 * Copyright (C) 2015 Limepark AB
=========================================================*/


/*
---------------------------------------------------------
EVENEMANGSKALENDER
--------------------------------------------------------- */

/*--- Allmänt ---*/

.lp-webapp-event-calendar ul li a {
  color: #0474b0;
  display: block;
  font-size: 22px;
  line-height: 1.3;
  margin-bottom: 15px;
  text-decoration: none;
}

.lp-webapp-event-calendar ul li a:hover {
  text-decoration: underline;
}

.lp-webapp-event-calendar ul li span.lp-event-place {
  display: block;
  margin-bottom: 10px;
  padding-left: 26px;
  position: relative;
}

.lp-webapp-event-calendar ul li .lp-event-place-title {
  font-weight: 600;
}

.lp-webapp-event-calendar ul li span.lp-event-date {
  display: block;
  margin-bottom: 10px;
  padding-left: 26px;
  position: relative;
}

.lp-webapp-event-calendar ul li span.lp-event-time {
  display: block;
  padding-left: 26px;
  position: relative;
}

.lp-webapp-event-calendar ul li span.lp-event-place:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M12%201a6%206%200%200%200-6%206c0%203.323%203.607%208.106%205.227%2010.088a.996.996%200%200%200%201.544%200C14.392%2015.106%2018%2010.323%2018%207a6%206%200%200%200-6-6zm0%203.857a2.142%202.142%200%201%201%200%204.286%202.142%202.142%200%201%201%200-4.286zM6.994%2015.564a.996.996%200%200%200-.234.03C3.905%2016.299%202%2017.56%202%2019c0%202.209%204.477%204%2010%204s10-1.791%2010-4c0-1.44-1.905-2.7-4.76-3.404a1.007%201.007%200%200%200-1.24.978c0%20.454.302.86.742.969%201.805.448%202.902%201.069%203.207%201.455-.515.655-3.255%202-7.949%202s-7.434-1.345-7.95-2c.305-.387%201.403-1.007%203.208-1.455A.992.992%200%200%200%208%2016.574c0-.568-.468-1.011-1.006-1.01z%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  content: '';
  display: inline-block;
  height: 18px;
  left: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18px;
}

.lp-webapp-event-calendar ul li span.lp-event-date:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M6.984%201.986A1%201%200%200%200%206%203v1H5c-1.093%200-2%20.907-2%202v14c0%201.093.907%202%202%202h14c1.093%200%202-.907%202-2V6c0-1.093-.907-2-2-2h-1V3a1%201%200%200%200-1.016-1.014A1%201%200%200%200%2016%203v1H8V3a1%201%200%200%200-1.016-1.014zM5%209h14v11H5V9zm8%204a1%201%200%200%200-1%201v3a1%201%200%200%200%201%201h3a1%201%200%200%200%201-1v-3a1%201%200%200%200-1-1h-3z%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  content: '';
  display: inline-block;
  height: 18px;
  left: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18px;
}

.lp-webapp-event-calendar ul li span.lp-event-time:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M12%202C6.477%202%202%206.477%202%2012s4.477%2010%2010%2010%2010-4.477%2010-10S17.523%202%2012%202zm2.586%2014l-3.293-3.293A1%201%200%200%201%2011%2012V7a1%201%200%200%201%202%200v4.586l3%203A1%201%200%200%201%2014.586%2016z%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  content: '';
  display: inline-block;
  height: 18px;
  left: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 18px;
}

.lp-webapp-event-calendar ul li .lp-event-text p {
  margin: 10px 0;
}

a.lp-event-fetch-more {
  border: 3px solid #0474b0;
  border-radius: 25px;
  display: inline-block;
  font-size: 18px;
  padding: 10px 20px;
  text-decoration: none;
}

a.lp-event-fetch-more:hover,
a.lp-event-fetch-more:focus {
  background-color: #0474b0;
  color: #fff;
}

/*--- Puffvy ---*/

.lp-webapp-event-calendar .lp-webapp-event-grid ul {
  display: -webkit-box;
  display: flex;
  padding-top: 20px;

  flex-wrap: wrap;
}

.lp-webapp-event-calendar .lp-webapp-event-grid ul li {
  border: 1px solid #dee6f0;
  box-sizing: border-box;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  margin-bottom: 20px;
  margin-right: 20px;
  width: calc(25% - 15px);
}

.lp-webapp-event-calendar .lp-webapp-event-grid ul li:nth-child(4n) {
  margin-right: 0;
}

.lp-webapp-event-calendar .lp-webapp-event-grid ul li .lp-event-info {
  box-sizing: border-box;
  padding: 20px;
}

.lp-webapp-event-calendar .lp-webapp-event-grid ul li .lp-event-image {
  -webkit-box-align: center;
  align-items: center;
  display: -webkit-box;
  display: flex;
  max-height: 130px;
  overflow: hidden;
}

.lp-webapp-event-calendar .lp-webapp-event-grid ul li img {
  width: 100%;
}


/*--- Listvy ---*/

.lp-webapp-event-calendar .lp-webapp-event-list ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;

  flex-wrap: wrap;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li {
  border-bottom: 1px solid #dee6f0;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  flex-direction: row-reverse;
  padding: 40px 0;
  width: 100%;

  -webkit-box-pack: end;
  justify-content: flex-end;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li:last-child {
  margin-bottom: 40px;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-info {
  box-sizing: border-box;
  margin: auto 0;
  width: 60%;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li:first-child .lp-event-info {
  padding: 0 40px 40px 0;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-image {
  box-sizing: border-box;
  line-height: 0.8;
  margin: auto 0;
  max-height: 200px;
  overflow: hidden;
  width: 40%;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li img {
  width: 100%;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-time {
  margin-bottom: 10px;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-category-title {
  display: inline-block;
  font-weight: 600;
  margin-bottom: 10px;
  margin-right: 2px;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-category {
  background: #0474b0;
  color: #fff;
  display: inline-block;
  margin-bottom: 7px;
  margin-right: 5px;
  padding: 3px 8px;
}

.lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-categories {
  padding-left: 24px;
  position: relative;
}

.lp-webapp-event-calendar ul li .lp-event-categories:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2050%2050\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M47.145%2022.902l-9.208-10.504-.078-.078A4.98%204.98%200%200%200%2034.477%2011H5c-1.652%200-3%201.348-3%203v22c0%201.652%201.348%203%203%203h29.477a4.99%204.99%200%200%200%203.386-1.32l9.258-10.559c.566-.566.879-1.32.879-2.121a2.99%202.99%200%200%200-.855-2.098zM37%2028a3%203%200%201%201%20.002-6.002A3%203%200%200%201%2037%2028z%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  content: '';
  display: inline-block;
  height: 16px;
  left: 2px;
  position: absolute;
  top: 3px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  width: 16px;
}

/*--- Filtrering ---*/

.lp-webapp-event-calendar .lp-webapp-event-filter-form {
  background: #e7f0fb;
  box-sizing: border-box;
  margin-bottom: 40px;
  padding: 20px;
  width: 100%;
}

.lp-webapp-event-calendar .lp-webapp-event-filter-form input {
  font-family: 'montserrat',helvetica,sans-serif;
  width: 100%;
}

.lp-webapp-event-calendar .lp-webapp-event-filter-form .env-form {
  display: -webkit-box;
  display: flex;

  -webkit-box-pack: justify;
  flex-wrap: wrap;
  justify-content: space-between;
}

.lp-webapp-event-calendar .lp-webapp-event-filter-form .env-form-element {
  box-sizing: border-box;
  display: inline-block;
  width: 49%;
}

.lp-webapp-event-calendar .lp-webapp-event-filter-form .env-form-element:first-child {
  width: 100%;
}

.lp-webapp-event-calendar .lp-eventlist-form .env-form-element__label {
  font-family: 'montserrat',helvetica,sans-serif;
}

.lp-webapp-event-calendar .lp-eventlist-form button[type=submit] {
  background-color: #eee;
  border: 1px solid #ccc;
  border-radius: 0;
  color: #3c3f40;
  font-family: 'montserrat',helvetica,sans-serif;
  font-size: 15px;
  line-height: 150%;
  padding: 8px 20px;
}

.lp-webapp-event-calendar .lp-eventlist-form button[type=submit]:hover {
  background-color: #ccc;
  border: 1px solid #999;
}

/*--- Enskilda event ---*/

.lp-webapp-single-event .lp-event-caption {
  font-weight: 600;
}

.lp-webapp-single-event .lp-event-caption-text {
  margin-right: 10px;
}

.lp-webapp-single-event .lp-event-meta-wrapper,
.lp-webapp-single-event .lp-event-navigation {
  margin-bottom: 20px;
}

.lp-webapp-single-event .lp-event-navigation {
  border-bottom: 1px solid #c1cede;
}

.lp-webapp-single-event .lp-event-navigation .changeview {
  background: #e7f0fb;
  border-color: #c1cede;
  border-style: solid;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-width: 1px;
  color: #0073a7;
  display: inline-block;
  font-size: 18px;
  margin-bottom: -1px;
  padding: 10px 20px;
  text-decoration: none;
}

.lp-webapp-single-event .lp-event-navigation .changeview:hover {
  text-decoration: underline;
}

.lp-webapp-single-event .lp-event-navigation .changeview.lp-changeview-active:hover {
  text-decoration: none;
}

.lp-webapp-single-event .lp-event-navigation .changeview.lp-changeview-active {
  background: #fff;
  border-bottom-color: #fff;
  color: #000;
}

.lp-webapp-single-event .lp-map-element.lp-map-element--event {
  height: 300px;
  width: 100%;
}

.lp-webapp-single-event .lp-view-column-wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  flex-direction: row;

  flex-wrap: wrap;
}

.lp-webapp-single-event .lp-view-column-wrapper .lp-view-column-main {
  box-sizing: border-box;
  padding-right: 30px;
  width: 65%;
}

.lp-webapp-single-event .lp-view-column-wrapper .lp-view-column-right {
  width: 35%;
}

.lp-webapp-single-event .lp-event-more-info-wrapper > div:nth-child(2n + 1) {
  background: #eef4fc;
}

.lp-webapp-single-event .lp-event-more-info-wrapper > div {
  padding: 15px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper span {
  font-size: 16px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .lp-event-caption {
  margin-right: 10px;
}


.lp-webapp-single-event .lp-event-more-info-wrapper h2 {
  -webkit-box-align: center;
  align-items: center;
  display: -webkit-box;
  display: flex;
  margin-top: 40px;
  padding-left: 38px;
  position: relative;
  white-space: nowrap;

  -webkit-box-pack: justify;
  justify-content: space-between;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .lp-event-heading-contact:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2026%2026\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M22.387%2018.027c-1.547-1.324-3.121-2.129-4.649-.804l-.914.797c-.668.582-1.91%203.293-6.71-2.235C5.311%2010.27%208.167%209.41%208.84%208.835l.918-.8c1.52-1.324.945-2.992-.153-4.71l-.66-1.04C7.844.575%206.641-.55%205.117.77l-.824.722c-.676.488-2.559%202.086-3.016%205.117-.55%203.637%201.188%207.805%205.16%2012.375%203.97%204.575%207.86%206.871%2011.54%206.832%203.058-.035%204.91-1.675%205.488-2.273l.824-.723c1.523-1.32.578-2.668-.973-3.992z%22%2F%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
  display: inline-block;
  height: 22px;
  left: 0;
  position: absolute;
  width: 33px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .lp-event-heading-date:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M7%201a1%201%200%200%200-1%201v1H5c-1.1%200-2%20.9-2%202v14c0%201.1.9%202%202%202h14c1.1%200%202-.9%202-2V5c0-1.1-.9-2-2-2h-1V2a1%201%200%200%200-2%200v1H8V2a1%201%200%200%200-1-1zM5%208h14v10a1%201%200%200%201-1%201H6a1%201%200%200%201-1-1V8z%22%2F%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
  display: inline-block;
  height: 25px;
  left: 0;
  position: absolute;
  width: 25px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .lp-event-heading-location:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M12%200C8.102%200%205%203.102%205%207c0%206%207%2017%207%2017s7-11.102%207-17c0-3.898-3.102-7-7-7zm0%209c-1.102%200-2-.898-2-2%200-1.102.898-2%202-2%201.102%200%202%20.898%202%202%200%201.102-.898%202-2%202z%22%2F%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
  display: inline-block;
  height: 25px;
  left: 0;
  position: absolute;
  width: 25px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .lp-event-heading-terms:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2050%2050\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%230474b0\'%3E%3Cpath%20%20d%3D%22M25%202C12.297%202%202%2012.297%202%2025s10.297%2023%2023%2023%2023-10.297%2023-23S37.703%202%2025%202zm0%209a3%203%200%201%201%200%206%203%203%200%200%201%200-6zm4%2027h-8v-2h2V23h-2v-2h6v15h2v2z%22%2F%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: '';
  display: inline-block;
  height: 25px;
  left: 0;
  position: absolute;
  width: 33px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper h2:after {
  background: #0474b0;
  border-radius: 2px;
  content: '';
  display: block;
  height: 5px;
  margin-left: 15px;
  right: 0;
  width: 100%;
}

.lp-webapp-single-event .lp-event-more-info-wrapper h3 {
  font-weight: 600;
  margin-bottom: 0;
  padding: 15px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper table {
  border-spacing: 0;
  font-size: 16px;
  width: 100%;
}

.lp-webapp-single-event .lp-event-more-info-wrapper table th {
  padding: 15px 5px 15px 5px;
  text-align: left;
}

.lp-webapp-single-event .lp-event-more-info-wrapper table th:first-child,
.lp-webapp-single-event .lp-event-more-info-wrapper table td:first-child {
  padding-left: 15px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper table td {
  padding: 15px 5px 15px 5px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper table tbody tr:nth-child(2n + 1) {
  background: #eef4fc;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .event-cal-date {
  border: 1px solid #c1cede;
  border-radius: 4px 4px 0 0;
  display: flex;
  flex-direction: column;
  margin-right: 15px;
  max-width: 55px;
  text-align: center;
  text-transform: uppercase;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .event-cal-date .event-cal-month {
  background-color: #0474b0;
  color: #fff;
  font-size: 15px;
  padding: 2px 4px;
}

.lp-webapp-single-event .lp-event-more-info-wrapper .event-cal-date .event-cal-day {
  background: #fff;
  border-radius: 4px 4px 0 0;
  font-size: 15px;
}

/*
---------------------------------------------------------
TABLET
--------------------------------------------------------- */

@media (max-width:1024px) {
  .lp-webapp-event-calendar .lp-webapp-event-grid ul li {
    width: calc(50% - 10px);
  }

  .lp-webapp-event-calendar .lp-webapp-event-grid ul li:nth-child(2n) {
    margin-right: 0;
  }

  .lp-webapp-event-calendar .lp-webapp-event-list ul li {
    padding: 20px 0;
  }
}

/*
---------------------------------------------------------
MOBIL
--------------------------------------------------------- */

@media(max-width:800px) {
  .lp-webapp-event-calendar .lp-webapp-event-grid ul li {
    width: calc(50% - 10px);
  }

  .lp-webapp-event-calendar .lp-webapp-event-grid ul li:nth-child(2n) {
    margin-right: 0;
  }

  .lp-webapp-event-calendar .lp-webapp-event-grid ul li .lp-event-info {
    padding: 20px 10px;
  }

  .lp-webapp-event-calendar ul li a {
    font-size: 17px;
  }


  /*--- Listvy ----*/

  .lp-webapp-event-calendar .lp-webapp-event-filter-form .env-form-element {
    width: 100%;
  }

  .lp-webapp-event-calendar .lp-webapp-event-list ul li {
    flex-direction: column;
    padding: 40px 0;
  }

  .lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-image {
    max-height: 250px;
    width: 100%;
  }


  .lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-info {
    width: 100%;
  }

  .lp-webapp-event-calendar .lp-webapp-event-list ul li:first-child .lp-event-info,
  .lp-webapp-event-calendar .lp-webapp-event-list ul li .lp-event-info {
    padding: 20px 0 0 0;
  }

  /*--- Enskilda event ----*/

  .lp-webapp-single-event .lp-event-more-info-wrapper span,
  .lp-webapp-single-event .lp-event-more-info-wrapper td {
    font-size: 15px;
  }

  .lp-webapp-single-event .lp-event-more-info-wrapper .event-cal-date {
    margin-right: 5px;
  }

  .lp-webapp-single-event .lp-view-column-wrapper {
    flex-direction: column;
  }

  .lp-webapp-single-event .lp-view-column-wrapper .lp-view-column-main {
    width: 100%;
  }

  .lp-webapp-single-event .lp-view-column-wrapper .lp-view-column-right {
    width: 100%;
  }
}
/*
  ---------------------------------------------------------
  MOBIL - Mindre än 380px
  --------------------------------------------------------- */

@media (max-width:380px) {
  .lp-webapp-event-calendar .lp-webapp-event-grid ul li {
    margin-right: 0;
    width: 100%;
  }
}
