/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */



.wcmlms-modal img{
  float: left;
  width: 48px;
  margin-top: 8px;
}

.wcmlms-modal .wcmlms-col{
  width: 100%;
  height: auto;
  display: flex;
  justify-content: start;
  margin-top: 5px;
  margin-bottom: 5px;
  cursor: pointer;
}
.wcmlms-modal .wcmlms-col:hover h3{
  font-weight: 400;
}



.wcmlms-modal .wcmlms-content{
  padding: 5px 15px;
  width: 100%;
}

.wcmlms-modal .wcmlms-content span{
  float: right;
  background-color: #000000;
  color: #ffffff;
  padding: 2px 4px;
  font-weight: bold;
  font-size: 12px;
  border-radius: 3px;
}

.wcmlms-modal .wcmlms-content h3{
  font-size: 21px;
}
.wcmlms-modal .wcmlms-content h3,
.wcmlms-modal .wcmlms-content  p{
  margin: 0px;
  padding: 0px;
  line-height: 24px;
  /* display: inline-block; */
}

.wcmlms-modal .wcmlms-content h3{
  display: inline-block;
}


.wcmlms-mt-10{
  margin-top: 10px;
}
.wcmlms-mt-15{
  margin-top: 15px;
}
.wcmlms-mt-20{
  margin-top: 15px;
}

.wcmlms_location{
  padding: 5px;
  margin: 0px 20px;
  border: 1px solid #c1c1c1;
  border-radius: 5px;
  background: transparent;
}
.wcmlms_location:focus-visible{
  outline: #c1c1c1;
}

.wcmlms-modal .wcmlms_location{
  width: 80%;
}

.wcmlms-modal h1{
  margin:80px 0
}
.wcmlms-btn {
  background: #428bca;
  border: #357ebd solid 0px;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  padding: 8px 15px;
  text-decoration: none;
  text-align: center;
  min-width: 60px;
  position: relative;
  transition: color .1s ease;
}
.wcmlms-btn:hover {
  background: #357ebd;
}
.wcmlms-btn-outline{
  background: transparent;
  border: 1px solid #6d6d6d;
  padding: 5px 8px;
  display: inline-block;
  border-radius: 3px;
  color: #6d6d6d;
  font-weight: 500;
}
.wcmlms-btn-outline:hover{
  border-color:  #5c5c5c;
  border-radius: 0px;
}
.wcmlms-btn-outline:focus-visible,
.wcmlms-btn-outline:focus{
  outline: none;
}

.wcmlms-btn-big {
  font-size: 18px;
  padding: 15px 20px;
  min-width: 100px;
}

.wcmlms-modal .btn-close {
  color: #aaaaaa;
  font-size: 20px;
  text-decoration: none;
  padding:10px;
  position: absolute;
  right: 7px;
  top: 0;
}
.wcmlms-modal .btn-close:hover {
  color: #919191;
}
.wcmlms-modal:before {
  content: "";
  display: none;
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
}
.opened:before {
  display: block;
}

.wcmlms-modal-dialog {
  width: 360px;
  background: #fefefe;
  border: #333333 solid 0px;
  border-radius: 5px;
  display: none;
  margin-left: -200px;
  text-align:center;
  position: absolute;
  top: 20%;
  left: 50%;
  z-index: 999999999;
  box-shadow:0 5px 10px rgba(0,0,0,0.3);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
}
.opened .wcmlms-modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  display: block;
}

.wcmlms-modal-body {
  padding: 20px;
}
.wcmlms-modal-body input{
  width:200px;
  padding:8px;
  border:1px solid #ddd;
  color:#888;
  outline:0;
  font-size:14px;
  font-weight:bold
}
.wcmlms-modal-header,
.wcmlms-modal-footer {
  padding: 10px 20px;
}
.wcmlms-modal-header {
  border-bottom: #eeeeee solid 1px;
}
.wcmlms-modal-header h2 {
  font-size: 20px;
}
.wcmlms_location_switcher p{
  text-align: center !important;
  font-size: 16px !important;
  margin: 0px !important;
}

#wcmlms-location-modal-switcher-btn{
  display: flex;
  flex-direction: row;
  border: 1px solid #ccc;
  padding: 5px;
  cursor: pointer;
  font-weight: normal !important;
}

#wcmlms-location-modal-switcher-btn svg{
  width: 24px;
}

#wcmlms-location-modal-switcher-btn p{
  text-align: left;
  padding: 5px;
}





/* START wcmlms-tooltip STYLES */
[wcmlms-tooltip] {
  position: relative;
  z-index: 999999;
}

/* Applies to all wcmlms-tooltips */
[wcmlms-tooltip]::before,
[wcmlms-tooltip]::after {
  text-transform: none; 
  font-size: .9em;
  line-height: 1;
  user-select: none;
  pointer-events: none;
  position: absolute;
  display: none;
  opacity: 0;
}
[wcmlms-tooltip]::before {
  content: '';
  border: 5px solid transparent; 
  z-index: 1001;
}
[wcmlms-tooltip]::after {
  content: attr(wcmlms-tooltip); 
  
  /* most of the rest of this is opinion */
  font-family: Helvetica, sans-serif;
  text-align: center;
  
  /* 
    Let the content set the size of the wcmlms-tooltips 
    but this will also keep them from being obnoxious
    */
  min-width: 3em;
  max-width: 21em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 1ch 1.5ch;
  border-radius: .3ch;
  box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
  background: #333;
  color: #fff;
  z-index: 1000;
}

/* Make the wcmlms-tooltips respond to hover */
[wcmlms-tooltip]:hover::before,
[wcmlms-tooltip]:hover::after {
  display: block;
}

/* don't show empty wcmlms-tooltips */
[wcmlms-tooltip='']::before,
[wcmlms-tooltip='']::after {
  display: none !important;
}

/* FLOW: UP */
[wcmlms-tooltip]:not([flow])::before,
[wcmlms-tooltip][flow^="up"]::before {
  bottom: 100%;
  border-bottom-width: 0;
  border-top-color: #333;
}
[wcmlms-tooltip]:not([flow])::after,
[wcmlms-tooltip][flow^="up"]::after {
  bottom: calc(100% + 5px);
}
[wcmlms-tooltip]:not([flow])::before,
[wcmlms-tooltip]:not([flow])::after,
[wcmlms-tooltip][flow^="up"]::before,
[wcmlms-tooltip][flow^="up"]::after {
  left: 50%;
  transform: translate(-50%, -.5em);
}

/* FLOW: DOWN */
[wcmlms-tooltip][flow^="down"]::before {
  top: 100%;
  border-top-width: 0;
  border-bottom-color: #333;
}
[wcmlms-tooltip][flow^="down"]::after {
  top: calc(100% + 5px);
}
[wcmlms-tooltip][flow^="down"]::before,
[wcmlms-tooltip][flow^="down"]::after {
  left: 50%;
  transform: translate(-50%, .5em);
}

/* FLOW: LEFT */
[wcmlms-tooltip][flow^="left"]::before {
  top: 50%;
  border-right-width: 0;
  border-left-color: #333;
  left: calc(0em - 5px);
  transform: translate(-.5em, -50%);
}
[wcmlms-tooltip][flow^="left"]::after {
  top: 50%;
  right: calc(100% + 5px);
  transform: translate(-.5em, -50%);
}

/* FLOW: RIGHT */
[wcmlms-tooltip][flow^="right"]::before {
  top: 50%;
  border-left-width: 0;
  border-right-color: #333;
  right: calc(0em - 5px);
  transform: translate(.5em, -50%);
}
[wcmlms-tooltip][flow^="right"]::after {
  top: 50%;
  left: calc(100% + 5px);
  transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@keyframes wcmlms-tooltips-vert {
  to {
    opacity: .9;
    transform: translate(-50%, 0);
  }
}

@keyframes wcmlms-tooltips-horz {
  to {
    opacity: .9;
    transform: translate(0, -50%);
  }
}

[wcmlms-tooltip]:not([flow]):hover::before,
[wcmlms-tooltip]:not([flow]):hover::after,
[wcmlms-tooltip][flow^="up"]:hover::before,
[wcmlms-tooltip][flow^="up"]:hover::after,
[wcmlms-tooltip][flow^="down"]:hover::before,
[wcmlms-tooltip][flow^="down"]:hover::after {
  animation: wcmlms-tooltips-vert 300ms ease-out forwards;
}

[wcmlms-tooltip][flow^="left"]:hover::before,
[wcmlms-tooltip][flow^="left"]:hover::after,
[wcmlms-tooltip][flow^="right"]:hover::before,
[wcmlms-tooltip][flow^="right"]:hover::after {
  animation: wcmlms-tooltips-horz 300ms ease-out forwards;
}

#wcmlms-location-icon{
  font-size: 22px;
  margin-right: 3px;
}

#wcmlms-location-icon svg{
  width: 22px;
}




/* [Object] Modal
 * =============================== */
 .wcmlms-modal .modal {
  opacity: 0;
  z-index: 99999999999;
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: left;
  background: rgba(0,0,0, .9);
  transition: opacity .25s ease;
}

.wcmlms-modal .modal__bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
}

.wcmlms-modal .modal-state {
  display: none;
}

.wcmlms-modal .modal-state:checked + .modal {
  opacity: 1;
  visibility: visible;
}

.wcmlms-modal .modal-state:checked + .modal .modal__inner {
  top: 0;
}

.wcmlms-modal .modal__inner {
  transition: top .25s ease;
  position: absolute;
  top: -20%;
  right: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  margin: auto;
  overflow: auto;
  background: #fff;
  border-radius: 5px;
  padding: 1em 2em;
  height: 60%;
}

.wcmlms-modal .modal__close {
  position: absolute;
  right: 1em;
  top: 1em;
  width: 1.1em;
  height: 1.1em;
  cursor: pointer;
}

.wcmlms-modal .modal__close:after,
.wcmlms-modal .modal__close:before {
  content: '';
  position: absolute;
  width: 2px;
  height: 1.5em;
  background: #ccc;
  display: block;
  transform: rotate(45deg);
  left: 50%;
  margin: -3px 0 0 -1px;
  top: 0;
}

.wcmlms-modal .modal__close:hover:after,
.wcmlms-modal .modal__close:hover:before {
  background: #aaa;
}

.wcmlms-modal .modal__close:before {
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
	
  .wcmlms-modal .modal__inner {
    width: 90%;
    height: 90%;
    box-sizing: border-box;
  }
}




.wcmlms-mobile-switcher{
  display: none;
}

@media screen and ( max-width: 767px){
  .wcmlms-mobile-switcher{
    display: block;
  }
}


.wcmlms-modal .btn {
  cursor: pointer;
  background: #27ae60;
  display: inline-block;
  padding: .5em 1em;
  color: #fff;
  border-radius: 3px;
}

.wcmlms-modal .btn:hover,
.wcmlms-modal .btn:focus {
  background: #2ecc71;
}

.wcmlms-modal .btn:active {
  background: #27ae60;
  box-shadow: 0 1px 2px rgba(0,0,0, .2) inset;
}

.wcmlms-modal .btn--blue {
  background: #2980b9;
}

.wcmlms-modal .btn--blue:hover,
.wcmlms-modal .btn--blue:focus {
  background: #3498db;
}

.wcmlms-modal .btn--blue:active {
  background: #2980b9;
}

.wcmlms-modal p img {
  max-width: 200px;
  height: auto;
  float: left;
  margin: 0 1em 1em 0;
}