/* Typography */

/* temp fix list style indentations for Canvas themed content-block divs */
.content-block ol li, .content-block ul li {
    margin-left: 20px;
}


.g-recaptcha {
  display: inline-block;
}

.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 9999;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;

}
.loading-overlay .hidden {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;
}
.loading-overlay .spinner-border {
  position: absolute;
  top: 50%;
  left: 50%;
  /*transform: translate(-50%, -50%);*/
}

.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}


.policy h4 {
font-size: 1.2rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.policy h5 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.policy h6 {
  font-size: 0.9rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.policy li, .policy p {
  font-size: 0.8rem;
  line-height: 1.15rem;
  margin-bottom: 1rem;
}



/*  ---------------------------
    DRAFTAIL CUSTOM STYLES
 ------------------------------ */

.txt-color.cm-pink {
  color: #e5007f;
}
.txt-color.cm-orange {
  color: #ff9619;
}
.txt-color.cm-blue {
  color: #00b8ed;
}
.txt-color.cm-green {
  color: #00d6aa;
}


/*  ---------------------------
    BLOCK STYLES
 ------------------------------ */


/*.column-box, .column-box.auto-columns {*/
/*  column-count: auto;*/
/*  column-fill: auto;*/
/*  !*display: flex;*!*/
/*!*  box-sizing: border-box;*!*/
/*}*/
.column-box.two-columns {
  columns: 2 220px;
}
.column-box.three-columns {
  columns: 3 180px;
}
.column-box.four-columns {
  columns: 4 160px;
}
.column-box.column-rule {
  column-rule: 1px #ddd dotted;
  column-gap: 4em;
}
.column-box h3 .span {
  -webkit-column-span: all;
          column-span: all;
}

.slider-caption {
  text-shadow: #888888;
}
.hidden {
  display: none;
}
.hoverhide:hover {
  opacity: 0;
  transition: opacity 0.5s;
}
.hoverhide-icon:hover i {
  opacity: 0;
  transition: opacity 0.5s;
}
.hovershow {
  opacity: 0;
  transition: opacity 0.5s;
}
.hovershow:hover {
  opacity: 1;
  transition: opacity 0.5s;
}


/*  ---------------------------
    SIDEBAR PAGE
 ------------------------------ */

.sidebar-wrapper {
  clear: both;
}

.sidebar-container {
  width: 300px;
  margin-left: 0;
  margin-right: -300px;
  float: left;

}
.sidebar-container.right {
  float: right;
  margin-right: 0;
  margin-left: -300px;
}

.sidebar-content {
  float: right;
  margin-right: 50px;
  margin-left: 300px;
  padding-left: 20px;
}
.sidebar-content.right {
  float: left;
  margin-left: 50px;
  margin-right: 300px;
  padding-right: 20px;
}

.sidebar-container .sidebar-widgets-wrap {
  width: 260px;
  padding: 20px;
}

@media screen and (max-width: 991px) {

  .sidebar-container {
    display: block;
    width: 200px;
    margin-right: -200px;
  }
  .sidebar-container.right {
    margin-left: -200px;
  }

  .sidebar-content {
    margin-right: 0;
    margin-left: 200px;
    padding-left: 10px;
  }

  .sidebar-content.right {
    margin-left: 0;
    margin-right: 200px;
    padding-right: 10px;
  }

  .sidebar-container .sidebar-widgets-wrap {
    width: 200px;


  }
  .sidebar-container .sidebar-widgets-wrap .widget {
    width: 200px;
  }
}

@media screen and (max-width: 768px) {

  .sidebar-container {
    display: none;
  }
  .sidebar-content {
    margin-left: 50px;
    margin-right: 50px;
    padding: 0 10px;

  }
}




/*  ---------------------------
    PARALLAX
 ------------------------------ */

.parallax-container {
  /*  this is where the magic happens:  */
  /* SET THE BACKGROUND IMAGE ON THIS DIV*/
  background-attachment: local;
  background-position: center center;
  /*top: -50%;*/
  background-size: cover;
  background-repeat: no-repeat;
  /* dimensions are important, ensure it is tall enough to scroll */
  min-height: 400px;

  /* you are free to lay out the container items with flexbox or whatever means you wish */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-device-width: 1366px) {
  .parallax-container {
    background-attachment: scroll;
  }
}



/*  ------------------------------
    BACKGROUND OPACITY & PATTERNS
 --------------------------------- */


.background-opacity {
      position: relative;
    }
.background-opacity:before {
  content: "";
  position: absolute;
  opacity: 0.4;
  display: inline-block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}