/*----------------------------------------------------------------------------- 
[client] Screen Stylesheet 

version:   1.0 
date:      16/11/2020 
author:    Kario-Paul Brown
email:     kariobrown@securesig.com
website:   securesig.com 
version history:  sitepkg/layout/style.css*/


/* FONT METRICS */

@import url("/webfonts/fonts.css");

@font-face {
  font-family: 'password';
  font-style: normal;
  font-weight: 400;
  src: url(/sitepkg/layout/password.ttf);
}


.encrypt_keys {
  font-family: 'password' !important;
}

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


body {
  font-family: 'Merriweather', Helvetica, sans-serif;
  font-weight: 600;
  font-size: 18px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

p {
  font-size: 15px;
  font-weight: 400;
  font-family: 'Merriweather', Helvetica, sans-serif;
  color: #000000;
  line-height: 1.4;
  margin-bottom: 10px;
}

em, li, li a {
  font-size: 15px;
  font-weight: 300;
  font-family: 'Merriweather', Helvetica, sans-serif;
  color:  #000000;
}

a {
  outline: 0;
  color: #2a737e;
  text-decoration: none;
  background-color: transparent;
}

button {
  color: #515769;
}

a:focus, a:hover, a:active {
  outline: 0;
  text-decoration: none;
}

a:hover {
color: #43adbb;
}

.blue-link {
  color: #2a737e;
  cursor: pointer;
}
.blue-link:hover {
  color: #43adbb;
}


.hover-underline-animation {
  display: inline-block;
  position: relative;
  color: #43adbb;
}

.hover-underline-animation:after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #43adbb;
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
}

.hover-underline-animation:hover:after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

.into_near_message {
  cursor: pointer;
}


b {
  font-weight: 900;
}


span {
  font-size: 14px;
  font-weight: 400;
  font-family: 'Merriweather', Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 900;
  font-family: 'Merriweather Black', Helvetica, sans-serif;
  color: #515769 !important;
  line-height: 1.4;
  margin: 10px 0 10px;
}

h1>a, h2>a, h3>a, h4>a, h5>a, h6>a {
  color: #515769;
}

h1>a:hover, h2>a:hover, h3>a:hover, h4>a:hover, h5>a:hover, h6>a:hover {
  color: #999caa;
  text-decoration: none;
}

h1>a:focus, h2>a:focus, h3>a:focus, h4>a:focus, h5>a:focus, h6>a:focus {
  text-decoration: none;
}
.nowrap {
  white-space: nowrap;
  overflow-x: scroll;
}
.navbar-brand {
  color: #000000 !important;
}

label {
  margin-bottom: 0.5rem;
  margin-top: 0.5rem;
}

.mb-10 {
  margin-bottom: 10px;
}


/* dynamic extend button */

.dynamic_extend {
  border-radius: 4px;
  background-color: #078494;
  border: none;
  color: #fff;
  text-align: center;
  font-size: 14px;
  padding: 7px 15px;
  transition: all 0.5s;
  cursor: pointer;
  font-weight: bold;
  display: block;
  max-width: 200px;
}

.dynamic_extend span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
  color: #fff;
}

.dynamic_extend span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: -4px;
  right: -15px;
  transition: 0.5s;
  font-size: 18px;
}

.dynamic_extend:hover span {
  padding-right: 20px;
}

.dynamic_extend:hover span:after {
  opacity: 1;
  right: 0;
}

@media only screen and (max-width: 767px) {
  .dynamic_extend {
   margin: auto;
  }
}

/* END */

.table td {
  color: #000000;
  font-size: 15px;
  vertical-align: middle !important;
}

h1 {
  font-size: 28px;
}

h2 {
  font-size: 26px;
}

h3 {
  font-size: 20px;
}

h4 {
  font-size: 18px;
}

.main_lead_text {
  font-size: 60px;
}

.heading-title {
  font-size: 25px;
}


/* LIST STYLING */

ul.unordered-list > li::before {
  content: "\25A0";
  color: black;
  font-weight: bold;
  display: inline-block;
  width: 1em; 
  margin-left: -1em;
  font-size: 1.2em;
  }

  .unordered-list {
  margin-bottom: 15px;
  }

  .unordered-list > li {
   padding: 4px 30px !important;
  }

  ol.article-ol-list {
  list-style-type: none !important;
  /* list-style-position: outside; */
  counter-reset: item;
  }

  ol.article-ol-list > li {
  counter-increment: item;
  margin-bottom: 5px !important;
  padding: 4px 30px !important;
  }
  ol.article-ol-list > li:before {
  margin-right: 10px !important;
  content: counter(item);
  background: black !important;
  border-radius: 100% !important;
  color: white !important;
  width: 1.2em !important;
  text-align: center !important;
  display: inline-block !important;
  margin-left: -1em;
  }

  .text_link {
  border-bottom: 2px dashed #ffa500;
  color: #a66c00;
  display: inline-block;
  line-height: 100%;
  text-decoration: none;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  -webkit-transition: all .5s;
  transition: all .5s;
  }

  .text_link:hover {
  border-bottom-color: #a66c00;
  color: #ffa500;
  }

  .dotted {
      border-bottom-style: dotted;
  }


/* BOOTSTRAP ADDENDUM */

.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #078494;
}
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  white-space: nowrap;
  background: 0 0;
  border: 0;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 0.25rem;
}


textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.form-control:focus,
.uneditable-input:focus {   
  border-color: rgba(126, 239, 104, 0.8);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);
  outline: 0 none;

  /* border-color: #28a745; */
  /* box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25); */
}

 
.custom-add-on:disabled + .input-group-addon:not(:first-child) {
  border: none !important;
  background: none !important;
}


@media screen and (max-width: 400px) {
  .display-3 {
    font-size: 3.6rem !important;
  }
}



@media screen and (max-width: 500px) {
  .display-3 {
    font-size: 3.6rem !important;
  }
}



.navbar.transparent.navbar-inverse .navbar-inner,
.navbar.transparent .navbar-inner {
  border-width: 0px;
  -webkit-box-shadow: 0px 0px;
  box-shadow: 0px 0px;
  background-color: rgba(0,0,0,0.0);
  background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop( 0% , rgba(0,0,0,0.00)),color-stop( 100% , rgba(0,0,0,0.00)));
  background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.00) 100%);
  background-image: linear-gradient(180deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.00) 100%);
}




/* GENERIC STYLING */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

.big_text {
  font-size: 19px !important;
}

.medium_text {
  font-size: 15px !important;
  font-weight: 400;
  font-family: 'Merriweather', Helvetica, sans-serif;
}

.small_text {
  font-size: 12.5px !important;
}

.wght-700 {
font-weight: 700;
}


p.tip {
  font-style: italic;
  margin: -5px auto 5px;
  padding: 5px 0 5px 30px;
  font-size: 11px;
  background: url(/sitepkg/img/tip.svg) left center no-repeat;
}

p.tip.white_color {
  font-style: italic;
  margin: -5px auto 5px;
  padding: 5px 0 5px 30px;
  font-size: 11px;
  background: url(/sitepkg/img/tip-white.svg) left center no-repeat;
}

p.warning {
  font-style: italic;
  margin: -5px auto 5px;
  padding: 5px 0 5px 40px;
  font-size: 11px;
  background: url(/sitepkg/img/warning-sign-svgrepo-com.svg) left center no-repeat;
}

.progress-bar {
  background-color: #FF5E45 !important;
}

.navbar-toggle.advanced .icon-bar{
  background-color:#000000 !important;
}


@media (max-width: 998px) { 
  .navbar-collapse-at-will-1000 {
      display: none;
  }
}

@media (max-width: 850px) { 
  .navbar-collapse-at-will {
      display: none;
  }
}


.noscroll,
.noscroll body {
    /* overflow: hidden !important; */
    touch-action: none;
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
  -webkit-overflow-scrolling: touch;
}

.center-xy {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.center-x {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.center-y {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.align-center-v {
  display: flex;
  /* justify-content: center; */
  /* align-self: center; */
  align-items: center;
}

.align-center-h {
  display: flex;
  /* justify-content: center; */
  align-self: center;
}

.justify-center {
   justify-content: center;
}

.joined-btn {
  width: calc(50% - 5px);
}
.right-space {
  margin-right: 5px;
}
.left-space {
  margin-left: 5px;
}

.distribute-content-v {
  display: flex;
  flex-flow: column;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

.size-to-content-v {
  flex: 0 1 auto;
}

.size-to-space-v {
  flex: 1 1 auto;
}

.fixed-height {
  flex: 0 1 auto;
}

.pricing-header {
  max-width: 750px;
}

.card-deck .card {
  min-width: 220px;
}

.border-top { border-top: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }

.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }

.btn {
  cursor: pointer;
}

.link-btn,
.link-btn:active{
  color: #078494;
  border: 1px solid #078494;
  background-color: #ffffff;
}

.link-btn:hover {
  color: #ffffff;
  background-color: #078494;
}

.link-btn-filled,
.link-btn-filled:active {
  color: #ffffff;
  background-color: #078494;
  border: 1px solid #078494;
}

.link-btn-filled:hover {
  background-color: #108fa0;
  border: 1px solid #078494;
  color: #ffffff;
}


.dropdown-menu-limit {         
  max-height: 300px;
  overflow-y: auto;
}

.active-plan,
.active-plan:hover {
  color: #ffffff !important;
  background: #FF5E45 !important;
  border: 1px solid #FF5E45 !important;
}

.price-border-pasha {
  border: 1px solid #078494 !important;
}


textarea {
  /* border: none !important; */
  overflow: auto ;
  outline: none ;
  -webkit-box-shadow: none ;
  -moz-box-shadow: none ;
  box-shadow: none ;
  resize: none ;
}

.placeholder:empty:before {
  content:attr(data-placeholder) !important;
  color:gray;
  font-style: italic;
  font-size: 20px;
  white-space: pre-wrap;
}


@media (max-width: 900px) and (min-width: 768px)  {
  .container {
    max-width: 750px !important;
}
}

@media (max-width: 1010px) and (min-width: 900px)  {
  .container {
    max-width: 850px !important;
}
}


/* STYLING THE THROBBER  */
.throbber {
  width: 100%;
  background-color: grey;
  margin: 5px 3px;
  visibility: hidden;
}

.throbber .progress-bar {
  width: 0%;
  height: 5px;
  background-color: green;
}

/* ========== */

.svg-doc-icon {
    display: inline-block;
    padding: 5px;
    position: relative !important;
    width: 100%;
    height:100%;
}

.svg-doc-icon img {
    display: block;
    margin: auto;
    padding: 0px;
    width: 70%;
    height: auto;
    min-width: 250px;
}

.account-data {
    min-width: 300px;
    width: 70%;
    display: block;
    margin: auto;
    padding: 20px 0px;
}

.setup_main {
  min-height: 900px;
  margin-bottom: 120px;
}


@media only screen and (max-width: 992px) {
  .account-data {
    width: 80%;
  }
}

.custom-control {
    width: 100%;
    margin-bottom: 1.2em;
}



/* CUSTOM FORM ELEMENTS */
.custom-control .checkbox {
    display: inline-flex;
    cursor: pointer;
    position: relative;
}

.custom-control .checkbox > span {
    color: #34495E;
    padding: 0rem 0.6rem;
    font-size: 1rem;
    max-width: 85%;
}

.custom-control .checkbox > input {
    height: 30px;
    width: 30px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    border: 1px solid #34495E;
    border-radius: 4px;
    outline: none;
    transition-duration: 0.3s;
    background-color: #41B883;
    cursor: pointer;
  }

.custom-control .checkbox > input:checked {
    border: 1px solid #41B883;
    background-color: #34495E;
}

.custom-control .checkbox > input:checked + span::before {
    content: '\2713';
    display: block;
    text-align: center;
    color: #41B883;
    position: absolute;
    left: 0.7rem;
    top: 0.2rem;
}

.custom-control .checkbox > input:active {
    border: 2px solid #34495E;
}



.no_capitalise {
  text-transform: none !important;
}


/* STYLING SIGNATURE PANE */

.add_signature_layout {
    min-width: 300px;
    width: auto;
    display: block;
    margin: auto;
    padding: 60px 0px;
    position: relative;
    min-height: 678px;
}

.add_signature {
  min-width: 220px;
}


.signature_main {
  width: 100%;
  margin-bottom: 120px;
}




/* GENERAL LOADER FOR ALL PAGES */

.loading_cover {
  position: fixed;
  top:0px;
  left:0px;
  bottom:0px;
  right:0px;
  width: 100%;
  height: 100vh;
  z-index: 1200;
  background-color: #ffffff !important;
  opacity: 1;
  visibility: visible;
  transition: visibility 0s linear 0s, opacity 0.25s 0s;
}

.hide-loading {
  opacity: 0;
  visibility: hidden;
  transition: visibility 0s linear 0.25s, opacity 0.25s 0s;
}

.spinner {
  /* margin: 100px auto 0; */
  width: 70px;
  text-align: center;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #333333;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}




 /* STYLING LOADER DIV */

 .lds-ellipsis {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
}
.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background-color: #333;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}


.loading_cover_transparent {
  position: fixed;
  top:0px;
  left:0px;
  bottom:0px;
  right:0px;
  width: 100%;
  height: 100vh;
  z-index: 2000;
  background-color: transparent;
  opacity: 1;
  visibility: visible;
  transition: visibility 0s linear 0s, opacity 0.25s 0s;
}



/* error container */

.error_container {
  min-width: 280px;
  max-width: 350px;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;

  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.error_container .positive,
.error_container .negative {
  width: 100%;
  margin-bottom: 20px;
  position:relative;
  overflow: hidden;
  height: 100%;
  min-height:90px;

  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  -webkit-transition: all 0.6s ease;
     -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
       -o-transition: all 0.6s ease;
          transition: all 0.6s ease;
}

.error_container .negative {
  background-color: #f4f5f9;
  -webkit-box-shadow: 5px 5px 15px #ff7473;
     -moz-box-shadow: 5px 5px 15px #ff7473;
          box-shadow: 5px 5px 15px #ff7473;
}

.error_container .positive {
  background-color: #f4f5f9;
  -webkit-box-shadow: 5px 5px 15px #8FBC8F;
     -moz-box-shadow: 5px 5px 15px #8FBC8F;
          box-shadow: 5px 5px 15px #8FBC8F;
}



.error_container .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90px;
  font-size: 50px;
  text-align: center;
  text-shadow: 1px 1px rgba(0,0,0,0.12);
  color: #fff;
  position: absolute;
  margin-right: 4px;
  top:0;
  bottom:0;
  left:0;
}

.error_container .message_container {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}


.error_container .negative > .icon {
  background-color: #f1404b;
  border: 1px solid #f1404b;
  background-image: -webkit-radial-gradient(ellipse farthest-corner at center bottom, #ff7473 0%, #f1404b 50%);
  background-image: radial-gradient(ellipse farthest-corner at center bottom, #ff7473 0%, #f1404b 50%);
}

.error_container .positive > .icon {
  background-color: #3ac569;
  border: 1px solid #3ac569;
  background-image: -webkit-radial-gradient(ellipse farthest-corner at center bottom, #88dba3 0%, #3ac569 50%);
  background-image: radial-gradient(ellipse farthest-corner at center bottom, #88dba3 0%, #3ac569 50%);
}

.error_container .message {
  font-size: 15px;
  position: relative;
  padding: 3px;
  margin-left: 90px;
  overflow: hidden;
}

.error_container .sub_message {
  font-size: 13px;
  padding:3px;
  margin: 2px;
  margin-left: 90px;
}



.error_container .button {
  font-size: 15px;
  line-height: 28px;
  padding: 0 8px;
  float: left;
  margin: 5px 10px;

  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.12);
     -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.12);
          box-shadow: 1px 1px 3px rgba(0,0,0,0.12);
  z-index: 100;
  margin-left: 100px;
}


.error_container .message > span {
  font-weight: 800;
}

.error_container .negative .message,
.error_container .negative .sub_message {
  color: #000000;
}

.error_container .positive .message,
.error_container .positive .sub_message {
  color: #000000;
}


.error_container .no {
  color: #f1404b;
  border: 1px solid #f1404b;
}

.error_container .no:hover {
  color: #fff;
  background-color: #f1404b;
  border: 1px solid #f1404b;
}


.error_container .ok {
  color: #3ac569;
  border: 1px solid #3ac569;
}

.error_container .ok:hover {
  color: #fff;
  background-color: #3ac569;
  border: 1px solid #3ac569;
}


/* footer */

.footer_layout ul:not(.main-pg-social-icons) li {
  padding: 4px 5px;
}

.main-pg-social-icons {
  padding:0px 0px 15px 0px;
  float: right;
}
.main-pg-social-icons, .main-pg-social-icons li {
  display: inline-block;

}
.main-pg-social-icons li {
  padding-right: 30px;
  float:right;
}
.main-pg-social-label {
  padding-right: 30px;
}

/* END OF LOADER */


/* SET UP PRICING ELEMENT ON: PRICING PAGE & HOME PAGE */


.frequency_switch {
  padding: 40px 10px;
}

.plan_switch_label {
  padding: 0px 5px;
  font-weight: 800;
  color: #CDCDCD;
}

.plan_switch_label.switchedOn {
  color: rgb(238, 84, 13);
}

.frequency_switch .slider {
  background-color: #CDCDCD;
}

.frequency_switch input:checked + .slider {
background-color:#CDCDCD;
}

.frequency_switch input:focus + .slider {
box-shadow: 0 0 1px #CDCDCD;
}

.frequency_switch .slider::before {
  background-color: rgb(238, 84, 13);
}

.product_features li {
  padding: 5px 3px;
  text-align: left;
  position: relative;
  display: flex;
  align-items: center;
}

.product_features li .features_info  {
  padding-left: 10px;
}

 
.product_features .icon,
.plan_features .icon {
  background-color:  #005f69;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  border-radius: 50%;
  width: 20px;
  height: 20px;
}
.product_features .icon svg,
.plan_features .icon svg {
  width: 15px !important;
  height: 15px !important;
}
.features_info {
    display: inline-block;
    max-width: 300px;
}


.pricing-card-title span,
.pricing-card-title small {
  color: #078494 !important;
}

.pricing-card-title span {
  font-size: 40px;
  font-weight: 800 !important;
}

small[data-description] {
  width:100%;
  height: 150px;
  font-size: 13px;
  font-style: italic;
}

[data-plan-group] {
  transition: all .3s;
}


[data-plan-group]:hover {
  transform: scale(1.01);
}


[data-plan-group] .card-header {
  padding: .75rem 1.25rem;
  margin-bottom: 0;
  background: none !important;
  border-bottom: none !important;
}


.contact_help {
  font-size: 15px !important;
}




.info-blocks div,
.info-blocks span,
.info-blocks h3,
.info-blocks p{
 color: #ffffff !important;
}

.Privacy_security {
  min-height: 400px;
}

.additional_info_pricing,
.additional_info_pricing > span {
  font-size: 14px;
}

.primary_display_msg {
  color: #ff4400;
  font-weight: 800;
  font-size: 20px;
}


.slider::before {
  background-color: rgb(238, 84, 13);
}

.card-body [data-description] {
  width:100%;
  height: 150px;
  font-size: 13px;
  font-style: italic;
}


.info-blocks {
  margin-top: 15px;
  margin-bottom: 15px;
}

.jumbotron {
  min-height: 530px;
  padding:10px !important;
}

.notable-benefits {
 width:100%; 
 background-color: #000000;
}

.notable-benefits > div,
.notable-benefits > div > div {
  height:100%;
}


.cloud_integration .container {
  padding: 60px 20px;
}

.cloud_integration img {
  display:block;
  width: 100%;
  max-width: 500px;
  margin: auto;
  padding:0px;
}


.mobile_ready img{
  display:block;
  width: 100%;
  max-width: 200px;
  margin: auto;
  padding:0px;
}

.mobile_ready {
  padding: 40px 5px;
}

.mobile_ready .container {
  padding: 10px 8px;
}

.mobile_ready .feature-item img,
.value_add  .feature-item img {
  width: 30px;
  height: auto;
}

.value_add_img {
  display:block;
  width: 100%;
  max-width: 450px;
  margin: auto;
  padding:0px;
}

.feature-item .right-content {
  display: inline-block;
  padding-left: 20px;
}

.feature-item {
  display: inline-block;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.global_standards .feature-item img {
  width: 60px;
  height: auto;
}











/* FAQ STYLING */


.faq-heading {
font-weight: 700;
font-size: 18px;
padding-left: 12px;
width: 100%;
padding-right: 15px;
display: inline-block !important;
}

.faq {
width: 100%;
margin: 0 auto;
background: white;
border-radius: 4px;
position: relative;
display: block;
}

.faq label {
display: block;
position: relative;
overflow: hidden;
cursor: pointer;
padding-top:1px;
background-color: #FAFAFA;
margin-bottom: 15px;
}

.faq input[type="checkbox"] {
display: none;
}

.faq .faq-arrow {
width: 10px;
height: 10px;
transition: -webkit-transform 0.8s;
transition: transform 0.8s;
transition: transform 0.8s, -webkit-transform 0.8s;
-webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
      transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
border-top: 5px solid rgba(0, 0, 0, 0.33);
border-right: 5px solid rgba(0, 0, 0, 0.33);

position: absolute;
top: 10px;
right: 10px;
-webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.faq input[type="checkbox"]:checked + label > .faq-arrow {
  transition: -webkit-transform 0.8s;
  transition: transform 0.8s;
  transition: transform 0.8s, -webkit-transform 0.8s;
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
        transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
  }
  

.faq-text {
  width:100%;
  padding-left:20px;
  font-size: 13px;
  display: block;
  opacity: 0;
  max-height: 0px;
  padding-top:10px;
  }
  

  /* color: #4f7351; */

.faq input[type="checkbox"]:checked + label > .faq-text {
  opacity: 1;
  background: rgba(255,255,255,255);
  transition: opacity 0.8s, max-height 0.8s;
  max-height: 200px;
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
        transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.faq input[type='checkbox']:not(:checked) + label > .faq-text {
  opacity: 0;
  transition: opacity 0.8s, max-height 0.8s;
  max-height: 0px;
  -webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
        transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}


/* ----------EMAIL CALL TO ACTION -------- */

.email__crosslink {
  padding: 60px 15px;
  width:100%;
  border-radius: 8px;
  background-color: #E5E4E2;
}

.email__crosslink > .heading {
  width:100%; 
  margin-bottom:30px; 
  text-transform: uppercase;
  text-align: left;
  color: black;
  font-size: 18px;
}

.email__crosslink > .cab-info {
  text-align: left;
  font-size: 16px;
  color: black;
}

.button--action {
  margin-top:20px;
  text-transform: uppercase;
}

.email__crosslink_submit input[type=text] {
  padding:5px; 
  border:2px solid #ccc; 
  -webkit-border-radius: 5px;
  border-radius: 5px;
  height: 36px;
  width: 250px;
  box-sizing: border-box;

}
.email__crosslink input[type=text]:focus {
  border-color:#333; 
}

.email__crosslink_submit button[type=button] {
  padding:5px 15px; 
  background:#ccc; border:0 none;
  cursor:pointer;
  -webkit-border-radius: 5px;
  border-radius: 5px; 
}

.green-tint {
  background-color: #fff !important;
  border: 1px solid rgba(82, 122, 79, 0.88);
  color: rgba(82, 122, 79, 0.88);
}

.green-tint:hover {
  background-color: rgba(82, 122, 79, 0.88) !important;
  color: #fff !important;
}


.v-line {
  background: black;
  width: 1px;
  height: 100%;
}

.item_group {
  display: inline-block;
}



@media screen and (max-width: 767px) {
  .email__crosslink > .cab-info {
      border-radius: 10px;
  }
  .email__crosslink {
      background-image: none;
  }
  .button--action {
    width: 100%;
  }

  .email__crosslink input[type=text] {
    width: 100%;
   }

   .v-line {
      /* transform: rotate(90deg); */
    height: 1px;
    width: 100%;
    margin: 8px 0px;
  }

}



/* ----- END OF EMAIL CALL TO ACTION STYLING ----- */





/* SET UP CATEGORY MARKER*/
.category_marker {
  padding: 25px;
  border: 1px solid #B2D0B4;
  border-radius: 8px;
  margin: 30px 5px;
  position: relative;
}

.category_marker .instruction {
  background-color: #ffff;
  padding: 2px 8px;
  display: inline-block;
  margin: 0 auto;
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  color: #525f7f;
}

/* SIDE NAVIGATION  */

.sidenav .user-wrapper,
.off-side-nav .user-wrapper {
  display: -webkit-flex;
  display: flex;
  margin-bottom: 30px; }
.sidenav .user-wrapper .profile-image,
.off-side-nav .user-wrapper .profile-image {
  width: 40px;
  height: 40px !important;
  position: relative;
}
.sidenav .user-wrapper .profile-image img,
.off-side-nav .user-wrapper .profile-image img {
  border-radius: 100%;
  width: 100%;
  height: 100%; }
.sidenav .user-wrapper .text-wrapper,
.off-side-nav .user-wrapper .text-wrapper {
  margin-left: 15px; }
.rtl .sidenav .user-wrapper .text-wrapper,
.rtl .off-side-nav .user-wrapper .text-wrapper {
  margin-left: 0;
  margin-right: 15px; }
.sidenav .user-wrapper .text-wrapper .profile-name,
.off-side-nav .user-wrapper .text-wrapper .profile-name {
  font-weight: 500;
  margin-bottom: 8px; }
.sidenav .user-wrapper .text-wrapper .designation,
.off-side-nav .user-wrapper .text-wrapper .designation {
  margin-right: 3px; }

  
.status-indicator {
border-width: 2px;
border-style: solid;
border-color: #ffaf00;
border-radius: 100%;
display: inline-block;
height: 8px;
width: 8px; }
.status-indicator.online {
  border-color: #00ce68; }
.status-indicator.offline {
  border-color: #308ee0; }
.status-indicator.away {
  border-color: #ffaf00; }

.bg-transparent {
background: transparent !important; }

.bg-inverse-primary {
background: rgba(48, 142, 224, 0.2); }

.bg-inverse-secondary {
background: rgba(229, 229, 229, 0.2); }

.bg-inverse-success {
background: rgba(0, 206, 104, 0.2); }

.bg-inverse-info {
background: rgba(136, 98, 224, 0.2); }

.bg-inverse-warning {
background: rgba(255, 175, 0, 0.2); }

.bg-inverse-danger {
background: rgba(230, 82, 81, 0.2); }

.bg-inverse-light {
background: rgba(243, 245, 246, 0.2); }

.bg-inverse-dark {
background: rgba(66, 73, 100, 0.2); }


/* TAB PANES  */

.tab-pane {
  padding: 10px;
}

.nav-tabs {
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  border: none;
}
.nav-tabs .nav-link{
  border: none;
  border-radius: 0;
  transition: color .2s ease-out;
}
.tabs-dark .nav-link {
  color: #fff;
}
.tabs-light .nav-link {
  color: rgba(0,0,0,.5);
}
.tabs-dark .nav-link:not(.active):hover {
  color: #aeb0b3;
}
.tabs-light .nav-link:not(.active):hover {
  color: #495057;
}

.nav-pills .nav-link{
  border-radius: 2px;
  color: #495057;
  transition: color .2s ease-out, box-shadow .2s;
}
.nav-pills .nav-link:hover{
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  
}
.nav-pills .nav-item {
  margin: 0 5px;
}
.nav-pills.pills-dark .nav-link.active {
  background-color: #343a40!important;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}
.nav-pills.pills-dark .nav-link:not(.active):hover {
  color: #1d1e22;
}
.tabs-marker .nav-link {
  position: relative;
}
.tabs-marker .nav-link.active .marker {
  height: 30px;
  width: 30px;
  left: 50%;
  bottom: -30px;
  transform: translatex(-50%);
  position: absolute;
  overflow: hidden;
}
.tabs-marker .nav-link.active .marker:after {
  content: "";
  height: 15px;
  width: 15px;
  top: -8px;
  left: 50%;
  transform: rotate(45deg) translatex(-50%);
  transform-origin: left;
  background-color: #fff;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  position: absolute;
}


/* STYLING PAGE WRAPPERS */

.wrapper-shadow {
  padding: 20px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  background-color: #ffffff;
}

.wrapper-shadow div[class^="col-"] {
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 0px;
  margin-bottom: 0px; 
}

.wrapper-shadow .heading-title {
  font-size: 25px;
  padding-bottom:15px;
}

.wrapper-shadow .edit-btn {
  float:right !important;
}

.wrapper-shadow .editsave {
  width: 68px;
}

.wrapper-shadow .password-edit-btn {
  padding-right: 10px;
  padding-top: 5px;
  text-decoration: underline;
}

.wrapper-shadow .edit-btn:hover {
  cursor: pointer !important;
}


@media only screen and (max-width: 600px) {
  .wrapper-shadow .edit-btn {
      clear:right;}
  .wrapper-shadow .password-edit-btn {
      padding-right: 0px;}
}

.wrapper-shadow .forced-orange {
background-color: #f0ad4e !important;
color: #fff !important;
}

/* -----PICTURE UPLOAD----- */
.picture_upload_style {
  margin-top: 15px;
  margin-bottom: 15px;
  display: block;
}

.picture_upload_style button {
  margin-right: 20px;
}

.picture_upload_style img {
  max-width: 100px;
  height:auto;
}

.picture_upload_style button,
.picture_upload_style img {
  margin-top: 20px;
}

.light_gray_background {
  background-color: #fafafa;
}




/* SIDE MENU DROPDOWN */

ul.side_nav_list li a {
  -webkit-transition: 0.2s linear;
  -moz-transition: 0.2s linear;
  -ms-transition: 0.2s linear;
  -o-transition: 0.2s linear;
  transition: 0.2s linear;
}

ul.side_nav_list li ul {
  overflow: hidden;
  visibility: hidden;
  max-height: 0px;
  /* -webkit-transition: max-height 0.3s ease-in;
  -moz-transition: max-height 0.3s ease-in;
  -o-transition: max-height 0.3s ease-in;
  -ms-transition: max-height 0.3s ease-in;
  transition: max-height 0.3s ease-in; */
}

ul.side_nav_list li ul.engaged {
  visibility: visible;
  /* max-height: 120px; */
}



ul.side_nav_list li a i,
ul.side_nav_list ul li a i {
  width: 16px;
  height: auto;
  text-align: center;
  margin-right: 5px;
  float:right;
}

ul.side_nav_list li a,
ul.side_nav_list ul li a {
  color: #000000;
  display: block;
}

ul.side_nav_list li,
ul.side_nav_list ul li {
  border-left: 4px solid transparent;
  padding: 4px 5px !important;
  color: #000000;
  width:100% !important;
}

ul.side_nav_list li a:hover,
ul.side_nav_list li.active a {
  color: #005f69 !important;
  background: #b1c7ca !important;
  border-left: 4px solid #005f69 !important;
}




/* TEAM PAGE STYLING */

.table_overflow {
  overflow-y: auto;
  height: 600px;
}

.table_no_overflow {
  min-height: 500px;
}

.table_no_overflow_md {
  min-height: 300px;
}


.team_players {
  position: relative;
  width: 100%;
  overflow-x: auto;
  min-height: 250px;
}

.team_players .mdi  {
  font-size: 19px !important;
  cursor: pointer;
}

.team_players .default_text {
  color: #E0E0E0;
}


.team_apart_of {
  height: 350px; 
  overflow-y: auto; 
  position: relative; 
  padding:5px;
} 

.signer_page_details {
  min-height: 600px; 
  position: relative; 
}

.team_members {
  max-height: 250px;
  overflow-y: auto;
}


/* ------STYLING FILTER BOX ---------- */

.teams_control_pannel,
.endorse_doc_pannel {
  position:relative;
  display: block;
}

#search-form  {
  display: inline-block;
  margin-left: auto;
  max-width: 500px;
  width: 100%;
  height: 38px;
}

#search-form input:-moz-placeholder {
  color: #999;
}

#search-form input::-webkit-input-placeholder {
  color: #999;
}

#search-form input {
  outline: none;
}

#search-form input::-webkit-search-decoration,
#search-form input::-webkit-search-cancel-button {
  display: none;
}

#search-form input[type=search] {
  display: inline-block;
  background: #ededed url(/sitepkg/img/search-2.png) no-repeat 7px center;
  border: solid 1px #ccc;
  padding: 6px 10px 6px 32px;
  width: 60px;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s;
  -webkit-appearance: textfield;
  appearance: textfield;
  box-sizing: content-box;
  font-family: inherit;
  font-size: 100%;
  cursor: pointer;
}

.border_radius_search {
  -webkit-border-radius: 10em;
  -moz-border-radius: 10em;
  border-radius: 10em;
}

#search-form input[type=search]:hover {
  background-color: #fff;
}

.search-focus {
  width: 90% !important;
  background-color: #fff !important;
  border-color: rgba(82, 122, 79, 0.88) !important;
  -webkit-box-shadow: 0 0 5px rgba(109, 207, 246, .5) !important;
  -moz-box-shadow: 0 0 5px rgba(109, 207, 246, .5) !important;
  box-shadow: 0 0 5px rgba(109, 207, 246, .5) !important;
  color: #000 !important;
  cursor: auto !important;
}

select[name=MemberRole] {
  width: 300px;
}
  


/* ----CUSTOM BOOTSTRAP STYLE DROPDOWN---- */

.secure-sig-dropdown {
  display: inline-block;
  position:relative;
  cursor: pointer;
}
.secure-sig-dropdown .dropdown-content {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
  box-shadow: 0 6px 12px rgba(0,0,0,.175);
  background-clip: padding-box;
}

.secure-sig-dropdown .dropdown-content > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
  text-decoration: none;
  background: 0 0;
}
.secure-sig-dropdown .dropdown-content a:hover {background-color: #F5F5F5;}
.secure-sig-dropdown.active .dropdown-content {display: block;}
.secure-sig-dropdown .dropdown-content i {margin-right: 10px;}


/* BLOG STYLE */

.blog-style {
  position: relative;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); }
.blog-style .post-thumbnail {
  position: relative;}
.blog-style .post-thumbnail img {
  width: 100%; }
.blog-style .post-thumbnail .post-cta {
  position: absolute;
  top: 15px;
  left: 30px;
  z-index: 10; }
.blog-style .post-thumbnail .post-cta a {
  padding: 0 10px;
  display: inline-block;
  height: 20px;
  background-color: #ffffff;
  text-transform: uppercase;
  font-size: 10px;
  color: #0000ff;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0.75px; }
.blog-style .post-thumbnail .post-cta a:hover, 
.blog-style .post-thumbnail .post-cta a:focus {
  background-color: #0000ff;
  color: #ffffff; }
.blog-style .post-content {
  padding: 20px 30px; 
  width: 100%;
}
.blog-style .post-content .headline h5 {
  font-size: 20px;
  margin-bottom: 10px; }
.blog-style .post-content p {
  margin-bottom: 20px; }
.blog-style .post-content .post-meta p {
  margin-bottom: 0;
  font-size: 12px; }
.blog-style .post-content .post-meta p a {
  font-size: 12px; }
.blog-style button {
  font-size: 13px !important;}

.blog-style.post-style-2 {
  margin-bottom: 30px; }
.blog-style.post-style-2 .post-thumbnail {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 97px;
  flex: 0 0 97px;
  min-width: 97px;
  margin-right: 15px; }
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-style.post-style-2 .post-thumbnail {
    margin-right: 5px; } }
.blog-style.post-style-2 .post-content {
  padding: 5px 30px 5px 5px; }
.blog-style.post-style-2 .post-content .headline h5 {
  font-size: 15px;
  margin-bottom: 10px; }
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-style.post-style-2 .post-content .headline h5 {
    font-size: 14px; } }
@media only screen and (max-width: 767px) {
  .blog-style.post-style-2 .post-content .headline h5 {
    font-size: 14px; } }
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-style.post-style-2 .post-content {
    padding: 10px; } }
.blog-style.post-style-2:last-of-type {
  margin-bottom: 0; }
.blog-style.post-style-2.widget-post .post-thumbnail {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 70px;
  flex: 0 0 70px;
  min-width: 70px;
  margin-right: 15px; }


  /* button group */
  .btn-group-blog {
    align-items: center;
    flex-wrap: wrap;
    display: flex;
  }

  .btn-group-blog .btng {
    align-items: center;
    display: inline-flex;
    font-weight: 500;
    justify-content: center;
    line-height: 1.2;
    padding: 8px 10px;
    position: relative;
    margin-top: 20px;
  }



a.expandable-btn {
  border-radius: 5px;
  background: #04555f;
  border: none;
  color: #fff !important;
  text-align: center;
  font-size: 14px !important;
  cursor: pointer;
  font-weight: bold;
-webkit-transition: all .1s ease-out;
  transition: all .1s ease-out;
  position: relative;
  display: block;
  margin: auto;
}

a.expandable-btn.expandable-danger {
   background: #dc3545 !important;
}

a.expandable-btn span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
  color: #fff;
}

a.expandable-btn span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -4px;
  transition: 0.5s;
}

a.expandable-btn:hover span {
  padding-right: 10px;
}

a.expandable-btn:hover span:after {
  opacity: 1;
  right: 0;
}
    

/* GENERAL FORM STYLE */

/* Style the input elements and the submit button */
.general-form input[type=text], 
.general-form input[type=password], 
.general-form input[type=email],
.general-form input[type=tel] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-radius: 0;
  -webkit-appearance: none;
  appearance: none;
  }
  
  /* Style the submit button */
.general-form input[type=submit],
.general-form button[type=submit]{
  background-color: #078494;
  color: white;
  border: none;
  border-radius: 0;
  width:100%;
  -webkit-appearance: none;
  appearance: none;
  padding: 12px 20px;
  margin: 8px 0;
  }
  
.general-form input[type=submit]:hover,
.general-form button[type=submit]:hover {
  opacity: 0.8;
  cursor: pointer;
}



.termsandconditions {
  border-bottom: 1px solid black !important;
  color: #078494;
  text-decoration: none !important;
}


/* edit team styles */

.team_name_holder {
  position: relative;
  display: block;
}
.team_name_holder input {
  display: inline-block;
  max-width: 70%;
  min-width: 200px;
  margin: 10px 5px;
}
textarea#team_description {
  max-width: 80%;
}
.team_name_holder .edit_team_name {
  font-size: 30px;
  margin-left: 15px;
  cursor: pointer;
}

#invitation {
  width: 250px;
}


.custom_team_name {
display: inline-block;
padding: .375rem .75rem;
font-size: 1.8rem;
line-height: 1.5;
max-width: 350px;
min-width: 220px !important;
color: #495057;
background-color: #fff;
background-image: none;
background-clip: padding-box;
border: 1px solid #ced4da;
border-radius: .25rem;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
font-weight: bold;
}  

.custom_team_name:disabled {
  border: 1px solid transparent !important;
}

.main_container_default {
  width: 100%;
  height: 70vh;
  position: relative;
}

@media only screen and (max-width: 600px) {
  textarea#team_description {
    max-width: 100%;
  }
}



/* ENDORSE DOCUMENT STYLING */

.pure-button {
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16);
}

.pure-button-accent {
  color: white;
  background: #FF5E45;
  border: 1px solid #FF5E45;
}

.display_user_info_summary [contentEditable="true"] {
  background-color: #b1c7ca;
  color: #ffffff !important;
  padding:2px; 
}

.card-body .left_pane {
    width: 10%;
}
.card-body .left_pane img {
    width: 100%;
    height: auto;
}
.card-body .right_pane {
    width: 85%;
}

.basic-card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: 300px;
  margin: auto;
  text-align: center;
  padding: 8px;
}

.basic-card .edit_info {
    width:100%;
}
.basic-card .edit_btn_profile {
    display: block;
    width: 40px;
    margin-left: auto;
    cursor: pointer;
    text-transform: uppercase;
}

.basic-card .title {
  color: grey;
  font-size: 18px;
}

.basic-card a {
  text-decoration: none;
  font-size: 22px;
  color: black;
}
.basic-card p {
    margin: 5px 0px;
}

.img_container {
    width:50%; 
    display:block; 
    margin: 10px auto;
    position: relative;
}
.img_container img {
    width: 100%;
    height: auto;
}

.signature_holder .signature_overlay,
.img_container .img_overlay,
.profile-image .img_overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .3s ease;
    background: rgba(0, 0, 0, 0.5);
}

.profile-image .img_overlay {
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.profile-image .img_overlay .fa-camera {
  color: #ffffff;
}

.signature_holder:hover .signature_overlay,
.img_container:hover .img_overlay,
.profile-image:hover .img_overlay {
  opacity: 1;
  cursor: pointer;
}

.signature_overlay .icon,
.img_container .icon {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.signature_holder .fa-pen:hover,
.img_container .fa-camera:hover {
  color: #eee;
}

.selected_sig {
    font-size: 16px;
}

.signature_holder {
    width: 100%;
    height: 120px;
    background-color: beige;
    padding: 10px;
    position: relative;
}

.signature_holder img {
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    width: auto;
}

.signature_holder .signature_text {
    width: 100% !important;
    height: 100%;
    font-size: 1.2em !important;
    background-color: #fff;
    line-height: 100px !important;
    word-wrap: normal;
    text-align: center;
}
.name_holder {
    width: 100%;
}
.name_holder h4 {
    display: inline-block;
    max-width: 60%;
}

.name_holder h4:nth-child(1) {
    text-align: right;
    padding-right: 4px;
}
.name_holder h4:nth-child(2) {
    text-align: left;
}

.card-statistics-special a {
    cursor: pointer;
}

.card-statistics-special:hover {
    background-color: #669298;
}

.card-statistics-special:hover h5 {
  color: #ffffff !important;
}


.btn-watch-video {
  line-height: 32px;
  height: 40px;
  border-radius: 22px;
  display: inline-block;
  background: rgba(0, 0, 0, 0.4);
  color: white;
  text-decoration: none;
  padding: 4px 46px 5px 20px;
  position: relative;
  box-sizing: border-box;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 1px;
  transition: all 200ms ease-in;
  cursor: pointer;
}
.btn-watch-video .fa {
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border-radius: 50%;
  border: solid 1px white;
  position: absolute;
  top: 3px;
  right: 4px;
  text-indent: 4px;
}
.btn-watch-video:hover {
  padding-right: 50px;
  padding-left: 24px;
  color: white;
}

/* GET SIGNATURE  */


.upload_icon_for_document {
  display: block;
  width: 55px;
  height: auto;
  margin: 4px auto;
  padding: 5px;
}

.upload_icon_for_document svg {
  width: 55px;
  height: auto;
}

.dropdown-toggle::after {
  /* -ms-transform: rotate(-90deg); */
  /* -webkit-transform: rotate(-90deg); */
  /* transform: rotate(-90deg); */
  float:right;
  margin-left: .3em;
  vertical-align: middle;
  margin-top: 11px;
}

.hold_documents {
  height: 255px;
  width: 100%;
  padding: 5px;
  overflow-y: auto;
}

.hold_files,
.hold_attachments {
  height: 240px;
  width: 100%;
  padding: 5px;
  overflow-y: auto;
  margin: 0px 5px;
}

.no_doc_selected {
  font-size: 15px;
}

.regular_background {
  background: none !important;
  margin: 5px;
  margin-right: 10px;
}


.GreenText {
   color: Green !important;
}

.RedText {
   color: Red !important;
}

.green-bdr {
  background-color: #fff !important;
  border: 1px solid rgba(82, 122, 79, 0.88);
  color: rgba(82, 122, 79, 0.88);
}

.green-bdr:hover {
  background-color: rgba(82, 122, 79, 0.88) !important;
  color: #fff;
}

.green-tint {
  color: rgba(82, 122, 79, 0.88) !important;
}

[name=IsRecipientPasswordProtected]:checked + .add_password {
  color: #000000 !important;
  background-color: #ffffff !important;
}


.add_password,
.add_attachment {
  margin: 5px;
}



/* ::::::::::load attachment */

.chips .chipies {
  display: inline-block;
  max-height: 80px;
  padding: 0 12px;
  margin-right: 1rem;
  margin-bottom: 1rem;
  font-size: 15px;
  font-weight: 500;
  color: rgba(0,0,0,0.6);
  cursor: pointer;
  background-color: #eceff1;
  border-radius: 16px;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
  width: 100%;
}

.chips {
  min-height: 60px;
  padding-bottom: 0.7rem;
  border: 0;
  border: none;
  border-bottom: 1px solid #ced4da;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transition: all .3s;
  transition: all .3s;
  display: block;
  font-size: 16px;
  width:100%;
}


.chips-holder-items {
  max-height: 325px;
  overflow-y: scroll;
}


.chips i {
  font-style: italic;
}



.chips .chipies .close {
  float: right;
  padding-left: 8px;
  font-size: 16px;
  line-height: 50px;
  cursor: pointer;
  -webkit-transition: all .1s linear;
  transition: all .1s linear;
}

.chips .close {
  float: right;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}



.chips .input {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  display: inline-block;
  height: 50px;
  padding: 0 !important;
  margin-right: 20px;
  font-size: 16px;
  font-weight: 500;
  line-height: 50px;
  color: rgba(0,0,0,0.6);
  background: 0;
  border: 0;
  outline: 0;
  overflow: visible;
  box-sizing: border-box;
  width: 100%;
}

.chips input:focus {
  border: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none;
}

.chips:hover {
  cursor: text;
}

.chips.focus {
  border: 0;
  border-bottom: 1px solid #4285f4;
  /* -webkit-box-shadow: 0 1px 0 0 #4285f4; */
  /* box-shadow: 0 1px 0 0 #4285f4; */
}


.styled-checkbox {
position: relative;
opacity: 0;
margin: 0;
display: none;
}
.styled-checkbox + label {
position: relative;
cursor: pointer;
padding: 0;
margin: 0;

}
.styled-checkbox + label:before {
content: "";
margin-right: 5px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
background: white;
}
.styled-checkbox:hover + label:before {
background: #f35429;
}

.styled-checkbox:focus + label:before {
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}
.styled-checkbox:checked + label:before {
background: #f35429;
}
.styled-checkbox:disabled + label {
color: #b8b8b8;
cursor: auto;
}
.styled-checkbox:disabled + label:before {
box-shadow: none;
background: #ddd;
}
.styled-checkbox:checked + label:after {
content: "";
position: absolute;
left: 5px;
top: 9px;
background: white;
width: 2px;
height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg);
}

.chips .box-flex {
display: flex;
justify-content: center;
align-items: center;
}

.chips .chip_title {
  padding: 0.5rem 1rem;
  width:auto;
  margin-right: auto;
}




/* popup styles */

.modal-message { 
  box-sizing: border-box;
  display: inline-block;
  border: none;
}

@media (max-width: 780px) {
  .modal-message {
    width: 80%;
  }
}
/* end of popup styles */


/* ------ SHOW DOCUMENT LIST------ */


.document_viewer {
  min-height: 100vh;
  padding: 10px;
}


.document_viewer h4,
.document_viewer h5,
.document_viewer h6 {
  color: inherit;

}

.document_viewer .signature_holder_data,
.document_viewer .initials_holder_data {
  height: 50px;
  width: 100%;
  padding: 4px;
  margin: 4px;
  background-color: #ffffff;
  position: relative;
}

.document_viewer .signature_holder_data .text_display,
.document_viewer .initials_holder_data .text_display {
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  width: 100% !important;
  height: 100% !important;
  color: #000000;
}


/*  */

.request_signature_viewer .signature_holder_data,
.request_signature_viewer .initials_holder_data {
  height: 50px;
  /* width: 100%; */
  flex: 1;
  padding: 4px;
  margin: 4px;
  background-color: #ffffff;
  position: relative;
}

.request_signature_viewer .signature_holder_data .text_display,
.request_signature_viewer .initials_holder_data .text_display {
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  width: 100% !important;
  height: 100% !important;
  color: #000000;
}

.request_signature_viewer {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.request_viewer {
  padding: 8px 0px;
  width: 100%;
  max-width: 300px;
}

.request_viewer .download_view {
  margin-left: 5px;
  padding: 5px;
  outline: none;
  border: none;
  display: inline-block;
  border-radius: 4px;
}


/*  */


.margin-top-30 {
  margin-top: 30px;
}

.open_doc,
.upload_attachment {
  cursor: pointer;
}

.the_documents {
  width: 100%; 
  height:auto; 
  padding:15px; 
  margin:15px 0px; 
  background-color: #ffffff; 
  color: #000000;
} 


/* bradning style */
.rg_padd {
  padding: 10px;
}
.user_contact_chip {
  display: inline-block;
  padding: 0 25px;
  height: 50px;
  font-size: 15px;
  border-radius: 25px;
  background-color: #f1f1f1;
  color:#000000;
}
.user_contact_chip img {
  float: left;
  margin: 0 10px 0 -25px;
  height: 50px;
  width: 50px;
  border-radius: 50%;
}

.chip_name {
  display: inline-block;
  position: relative;
  line-height: 1;
  padding-top: 5px;
  height: 100%;
} 

.chip_name > span {
  font-size: 13px;
}


@media (min-width: 1281px) {
  .chip_name > span {
    font-size: 13px;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .chip_name > span {
    font-size: 13px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .chip_name > span {
    font-size: 11px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .chip_name > span {
    font-size: 11px;
  }
}
@media (min-width: 481px) and (max-width: 767px) {
  .user_contact_chip {
    line-height: 25px;
  }
  .chip_name > span {
    font-size: 10px;
  }
}
@media (min-width: 320px) and (max-width: 480px) {
  .user_contact_chip {
    line-height: 25px;
  }
  .chip_name > span {
    font-size: 10px;
  }
}



.branding_container img {
  width: 100%;
  display: block;
  margin: auto;
  height: auto;
}

.branding_container {
  width:50px;
  height: auto;
  display: inline-block;
  padding: 5px;
  border-radius: 4px;
  background-color: #ffffff;
}
 
/* template adjustment */
.load_template {
  height: 300px;
}


/* DOCUMENT PAGE STYLES  */


.full_width {
  width: 100%;
}

.file_list {
  position: relative;
  width: 100%;
  overflow-x: auto;
  min-height: 350px;
}


.file_list .mdi  {
  font-size: 19px !important;
  cursor: pointer;
}


.pagination_02 {
display: inline-block;
}

.pagination_02 a {
color: black;
float: left;
padding: 8px 16px;
text-decoration: none;
transition: background-color .3s;
}

.pagination_02 .page_number {
  float: left;
}

.pagination_02 a.active {
background-color: #000000;
color: white;
border-radius: 5px;
}

.pagination_02 a:hover:not(.active) {
background-color: #ddd;
border-radius: 5px;
}

.opacity {
opacity: 0.5;
}

.pagination_02.withcorner a:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.pagination_02.withcorner a:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.pagination_02.bordered a {
border: 1px solid #ddd;
}
.pagination_02.space_between a {
margin: 0 4px;
}
.center {
text-align: center;
}

.table_width_100 {
  max-width: 100% !important;
}

/* document dropdown info */
.patim_rel_popup {
  width: 300px; background-color:#F5F5F5; padding: 5px 0;
  margin: 2px 0 0;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 4px;
  }

  .patim_rel_popup .patim_row {
      padding: 7px 5px;
  }

  .patim_rel_popup .title {
      font-size: 15px; 
      text-transform: uppercase; 
      color: #a9a9a9;
  }

  .patim_rel_popup .sub_title {
      font-size:11px; 
      font-weight: 900;
  }

  .patim_rel_popup .cert_text {
    font-size: 16px; color:#2554C7;
  }

  .patim_rel_popup .cert_icon {
    font-size: 18px; color:red;
  }



  /*  PURCHASE PAGE  STYLES */

  .account_type_selection {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #000000;
    /* border: 1px solid #000000; */
    padding: 10px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);                
}


.discover_block {
    position: relative;
    height: 80vh;
    margin-bottom:80px;
}

.billing_information {
    width: 85%;
    max-width: 1024px;
    margin: 0 auto;
    padding: 100px 0px;
    margin-bottom: 200px;
}

.payment_shawdow {
    padding: 10px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}

.security_gaurantee .mdi-security {
    color:#008000;
    font-size: 20px;
}
.security_gaurantee {
    font-size: 15px;
    font-weight: 500;
}

.security_gaurantee {
    padding: 8px 5px;
    text-align: right;
}

.accordion-payment img {
    margin-left: 10px;
    width: 50px;
}
.accordion-payment.paypal img {
    width: 70px;
}

.card_container {
  display: inline-block;
}

@media only screen and (max-width: 600px) {
  .billing_information {
    width: 100%;
  }
  .payment_shawdow {
    padding: 10px 0px;
  }
  .card_container {
    display: block;
    margin-top: 8px;
  }
}



/* payment update container */
.payment-update-container {
  position: fixed;
  border: 1px solid lightblue;
  border-radius: 5px;
  top: 10px;
  left: 10px;
  bottom: 10px;
  right: 10px;
  width: calc(100% -20px);
  height: calc(100% -20px);
  overflow: hidden;
  background-color: #fff;
  z-index: 800;
  /* background: transparent; */
  visibility: hidden;
  opacity: 0;
  transition: all 0.35s ease-in;
}

.payment-update-container.is-visible {
  visibility: visible;
  opacity: 1;
}

.payment-update-container .close {
  color: #aaa;
  font-weight: bold;
  padding: 8px 10px 8px 10px;
  float:right;
}

.payment-update-container .close:hover,
.payment-update-container .close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.payment-update-container iframe {
  border: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}



/* SCROLL NAVIGATION MENU */
 
.scroll_nav ul li a {
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	-ms-transition: 0.2s linear;
	-o-transition: 0.2s linear;
	transition: 0.2s linear;
}

.scroll_nav ul {
    padding-left: 20px;
}

.scroll_nav ul li a {
	border-left: 4px solid transparent;
    padding: 4px 5px;
    margin: 3px 1px;
    border-bottom: 1px solid #ebebeb;
}
.scroll_nav ul li a:hover,
.scroll_nav ul li a.active {
    background: #ebebeb !important;
	border-left: 4px solid #3498db !important;
}   


ul.scroll-nav li a.active {
  color:#008cdd !important;
}

.base_section_style {
    position: relative;
}

.backToTop {
  /* display: none; Hidden by default */
  position: relative; /* Fixed/sticky position */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #9b9e87; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 5px 8px; /* Some padding */
  border-radius: 5px; /* Rounded corners */
  font-size: 15px; /* Increase font size */
  margin: 5px;
}

.backToTop:hover {
  background-color: #555;
}


/* table styling */
.table .thead-dark th {
  background-color: #005f69 !important;
  color: #ffffff;
  border-color: #005f69 !important;
}

table.table_width_100:not(.original_width) td:first-child {
  width: 16em;
  min-width: 16em;
  max-width: 16em;
}



/* DocEndorse Button */

.drop_down_color {
  cursor: pointer;
  text-transform: none;
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.37rem 0.7rem;
  font-size: 0.967rem;
  line-height: 1.5;
  border-radius: 0.25rem;
  transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  background-color: #005f69 !important;
  color: #ffffff;
  border-color: #005f69;
}

.drop_down_color:hover {
  background-color: #0a7b87 !important;
  border-color: #0a7b87 !important;
  color: #ffffff;
}



.drop_down_color_red {
  background-color: #ca2222 !important;
  color: #ffffff;
  border-color: #ca2222;
}
.drop_down_color_red:hover {
  border-color: #ca2222;
  color: #ffffff;
}


.orange_btn_color {
  background-color: #000000 !important;
  color: #ffffff;
  border-color: #000000;
}

.orange_btn_color:hover {
  border-color: #000000 !important;
  color: #ffffff;
}


[data-secure=dropbtn] {
  color: #000000 !important;
}

.selected_dropdown {
  color:  #000000 !important;
  background-color: #ffffff !important;
}


/* signature email invite */

.invite_attachments {
  display: block;
   border: 1px solid #DCDCDC;
   background-color: #ffffff;
   border-radius: 5px;
   padding: 8px;
   margin: 20px 0px;
}

.invite_attachment_holder {
   border-bottom: 1px solid #DCDCDC;
   padding: 10px;
   display: block;
   min-height: 150px;
   margin-bottom: 20px;
}

label.choose_for_attachment,
label.search_for_attachment {
  background-color: #005f69;
  color: white;
  padding: 0.3rem 0.8rem;
  border-radius: 0.3rem;
  cursor: pointer;
  margin-right: 1rem;
  font-size: 14px;
}

#file-chosen {
   margin-left: 0.3rem;
}

.choose_for_attachment svg,
.search_for_attachment svg {
 fill: #ffffff;
 display: inline-block;
 margin-right: 5px;
}

.choose_label {
 height: 100%;
 display: flex;
 align-items: center;
 margin: 0px;
}



/* Request Reminder */

.notification__container {
  display: block;
}

.notification__settings {
  width: 100%;
  border-bottom: 1px solid #F8F8F8;
  padding: 8px;
}

.notification__switch,
.notification__pannel {
  display: flex;
  align-items: center;
}

.notification__switch_heading {
  height: 34px;
  margin-bottom: 0.5rem;
  margin-right: 1rem;
}
.notification__switch_heading span {
  font-size: 14px;
  font-style: normal;
  font-weight: bold;
}

.notification__switch .switch,
.notification__pannel select,
.notification__pannel .reminder_panel:nth-of-type(2) {
  margin-left:auto;
}

.notification__text {
  margin-bottom: 10px;
  margin-top: 10px;
  display: block;
}

.nbordered {
  border: 1px dotted lightgray;
}


[name=IsAlertScheduleSet]:checked + .schedule_time {
  color: #000000 !important;
  background-color: #ffffff !important;
}


/* general error response labeling */

.element-errors {
  display: inline-flex;
  height: 20px;
  margin: 15px auto 0;
  padding-left: 20px;
  color: #e25950;
  opacity: 0;
  transform: translateY(10px);
  transition-property: opacity, transform;
  transition-duration: 0.35s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  background: url(/sitepkg/img/error.svg) center left no-repeat;
  background-size: 15px 15px;
}

.element-errors.visible {
  opacity: 1;
  transform: none;
}

.element-errors.tel_errors {
  margin: 10px auto 0 !important;
  background-size: 10px 10px;
}



/* COPY BOX FOR DATA PRESENTATION */
.copybox {
  display: flex;
  align-items: center;
  width: 100%;
  height: 40px;
  margin: 5px auto;
  border: 2px solid #EFEFEF;
  padding: 0 10px;
  border-radius: 4px;
  position: relative;
}

.copybox button {
  padding: 0;
  background-color: transparent;
  border: none;
  cursor: pointer;
  margin-left: auto;
}

.copybox button:focus {
  outline: none;
}

.copybox button svg {
  width: 25px;
  opacity: 0.5;
}

.copybox button svg:hover {
  opacity: 1;
}

.copybox .text {
  margin: 0px;
  overflow-x: scroll;
  font-size: 15px;
  white-space: nowrap;
  line-height: 30px;
  font-weight: 400;
  max-width: 500px;
}

.copybox .label {
    display: inline-block;
    margin: 0px 5px;
    text-decoration: underline;
    cursor: pointer;
}

.text.invisible {
  visibility: hidden;
}


/* INLINE CHIPS */

.chips_inline {
  min-height: 45px;
  margin-bottom: 30px;
  border: 0;
  border-bottom: 1px solid #ced4da;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transition: all .3s;
  transition: all .3s;
}


.chips_inline .chip {
  display: inline-block;
  height: 32px;
  padding: 0 12px;
  margin-right: 1rem;
  margin-bottom: 1rem;
  font-size: 13px;
  font-weight: 500;
  line-height: 32px;
  color: rgba(0,0,0,0.6);
  cursor: pointer;
  background-color: #eceff1;
  border-radius: 16px;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}


.chips_inline .input {
  display: inline-block;
  width: 120px !important;
  height: 32px;
  padding: 0 !important;
  margin-right: 20px;
  font-size: 13px !important;
  font-weight: 500;
  line-height: 32px;
  color: rgba(0,0,0,0.6);
  background: 0;
  border: 0;
  outline: 0;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  overflow: visible;
  box-sizing: border-box;
}

.chips_inline input:focus {
  border: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none;
}

.chips_inline:hover {
  cursor: text;
}

.chips_inline.focus {
  border-bottom: 1px solid #4285f4;
  -webkit-box-shadow: 0 1px 0 0 #4285f4;
  box-shadow: 0 1px 0 0 #4285f4;
}

.chips_inline .close {
  float: right;
  padding-left: 8px;
  font-size: 16px;
  line-height: 32px;
  cursor: pointer;
  -webkit-transition: all .1s linear;
  transition: all .1s linear;
}

.chips_inline .close {
  float: right;
  font-weight: 700;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}

.chips_inline i {
  font-style: italic;
  font-weight: 900;
}

.fa-times:before {
  content: "\f00d";
}

.viewContainer {
  max-height: 485px !important;
  overflow-y: auto;
}


.request_resend,
.recipient_email_btn {
  display:inline-block;
  vertical-align:top;
  min-width:100px;
  margin-right: 20px;
  margin-top: 20px;
}


  
.template_link_display {
  height: 35px;
  width: 100%;
  padding: 4px;
  margin: 4px;
  background-color: #ffffff;
  position: relative;
  border: 1px solid rgba(0,0,0,.1);
  overflow-x: auto;
  border-radius: 8px;
}

.template_link_display.placeholder:empty:before {
  font-size: 16px;
}


.template_link_display .text_display {
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  width: 100% !important;
  height: 100% !important;
  color: #000000;
}

.wrap_text {
  overflow-wrap: break-word;
  word-wrap: break-word;
  hyphens: auto;
}


.overflowX_scroll {
  overflow-x: scroll;
  display: block;
}


/* STYLING ARTICLE COMPOSE AREA */
.card-body-param {
  height: 350px;
  max-height: 400px;
  overflow-y: scroll;
  overflow-x: scroll;
}

.edit_article {
  background:none;
  border:none;
  cursor:pointer;
}

.card-body-param td:nth-child(2) {
  width: 16em;
  min-width: 16em;
  max-width: 16em;
}

/* STYLING STATUS */
    
.statusCircle {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    padding: 3px;
    background: #fff;
    display:inline-block;
}

.completed,
.online,
.request_completed {
    border: 3px solid #008000;
}
.expired,
.request_expired {
    border: 3px solid #FF0000;
}

.out-for-signature,
.waiting,
.request_created,
.request_sent {
    border: 3px solid rgb(17, 17, 128);
}
.cancelled,
.incomplete,
.assigned,
.request_canceled {
    border: 3px solid rgb(211, 179, 0);
}
.offline {
  border: 3px solid gray;
}



.progress-bar {
  font-size: 11px;
}

.progress-bar[aria-valuenow="1"],
.progress-bar[aria-valuenow="2"],
.progress-bar[aria-valuenow="3"],
.progress-bar[aria-valuenow="4"],
.progress-bar[aria-valuenow="5"],
.progress-bar[aria-valuenow="6"] {
  min-width: 6%;
}

.progress-bar[aria-valuenow="0"] {
  color: #000000;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

/* CONTACT FROM  */

.contact-left,
.contact-right {
    padding: 15px;
    padding-top: 20px;
     /* box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); */
}

.contact-right {
    background-color: #F8F8F8;
}


.input-row-item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

.input-row-item .input-group-item {
    flex-basis: 45%;
}

.input-group-item input {
    width:100%;
    border: none;
    border-bottom: 1px solid #ccc;
    outline: none;
    padding-bottom: 5px;
}

.input-group-item label {
    display: block;
    margin-bottom: 6px;
    color: #009999;
}

.contact-left textarea {
    width:100%;
    border: 1px solid #ccc;
    outline: none;
    padding: 10px;
    box-sizing: border-box;
}

.contact-left button {
    background: #009999;
    width: 100px;
    border: none;
    outline: none;
    color: #ffffff;
    height: 35px;
    border-radius: 30px;
    margin-top: 30px;
    /* box-shadow: 0px 5px 15px 0px #3df7f7/; */
}

.contact-left h3,
.contact-right h3 {
    color: #009999;
    font-weight: 600;
    margin-bottom: 30px;
}

.contact-right tr td:first-child {
    padding-right: 20px;
    
}
 
.contact-right tr td {
    padding-top: 20px;
    
}

.contact-right table {
    margin-bottom: 40px;
}

.contact-left,
.contact-right {
    font-size: 15px;
    border-radius: 4px;
}

.color-coded-text {
    color:#009999 !important;
}


 
.message_label {
    color: #515769; 
}

.ow {
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens:auto;
}


.btn_tel {
    background: #005f69;
    font-family: Arial;
    color: #ffffff;
    font-size: 20px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    line-height: 300%;
}

.btn_tel:hover {
    background: #005f69;
    text-decoration: none;
    color: #ffffff;
}

a.btn_tel[href^="tel:"]:before {
    content: "\260e";
    margin-right: 0.5em;
}


a[href^=tel].styl2 {
  background-color: #f5f5f5;
  background-image: linear-gradient(to bottom,#ffffff,#e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) 
                rgba(0, 0, 0, 0.1) 
                rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 
                    0 1px 2px rgba(0, 0, 0, 0.05);
  color: #333;
  display: inline-block;
  font-size: 100%;
  font-style: normal;
  line-height: 20px;
  margin: 20px 0 0;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  font-weight: 500;
}

a[href^=tel].styl2:before {
  content: 'Call: ';
  font-weight: bold;
}


.btn_watch {
  background: #ff4400;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 2px 20px 2px 5px;
  text-decoration: none;
  display: inline-flex;
  vertical-align: middle;
  text-align: center;
  align-items: center;
  border: 1px solid #ff4400;
  border-radius: 0.3rem; 
}

.home_sign_up {
  margin-right: 20px;
}

.btn_watch i {
  font-size: 30px;
  padding-right: 15px;
}

.btn_watch:hover {
  background: #ff4400;
  text-decoration: none;
  color: #ffffff;
}

.glightbox-button-hidden {
  display: none !important;
}


/* SPOTLIGHT FEATURE */
.spotlight-feature {
  padding: 1.75rem 0;
  display: flex;
  align-items: center; 
}

.spotlight-icon {
  text-align: center;
  margin-left: 10px;
  font-size: 1.0rem;
  padding:2px;
  border: 1px solid #000000;
  width:24px;
  height: 24px;
  cursor: pointer;
}

.spotlight-text {
  width: 269px;
}



/* STYLING FEATURES PAGE */

.signature_pannel_img {
  display: block;
  margin: 10px auto;
  width: 400px;
  max-width: 90%;
  height:auto;
}

.signature_pannel_img_2 {
  display: block;
  margin: 10px auto;
  width: 550px;
  max-width: 90%;
  height:auto;
}




.available_plans {
  width: 100%;
  height: 50px;
  background-color:#ededed;
  text-align: left;
  display: flex;
  align-items: center;
  margin-top:40px;
  padding-left: 20px;
}

.available_plans  h4 {
  flex: 1;
  margin: 0px;
}

.plan_features {
  margin: 45px 0px;
  margin-bottom: 200px;
}

.add_info {
  font-size: 13px;
  width: 300px;
  height: auto;
  display: inline-block;
  margin-top: 8px;
}



.responsive-table {
width: 100%;
margin-bottom: 1.5em;
}
.responsive-table thead {
position: absolute;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
}
.responsive-table thead th {
background-color: transparent;
border: none;
font-weight: normal;
text-align: center;
color: #000000;
height: 120px;
font-weight: 800;
}

.responsive-table thead th a {
font-size: 14px;
font-weight: 500;
text-decoration: underline;
font-style: italic;
}



.responsive-table tbody {
font-size: 16px;
}
.responsive-table tbody,
.responsive-table tr,
.responsive-table th,
.responsive-table td {
display: block;
padding: 0;
text-align: center;
white-space: normal;
}

.responsive-table thead th:first-of-type {
text-align: left;
}
.responsive-table th,
.responsive-table td {
padding: .5em;
vertical-align: middle;
}
.responsive-table caption {
margin-bottom: 1em;
font-size: 1em;
font-weight: bold;
text-align: center;
}
.responsive-table tfoot {
font-size: .6em;
font-style: italic;
}

.responsive-table tfoot td {
text-align: left;
}

.responsive-table tbody tr {
margin-bottom: 1em;
}
.responsive-table tbody tr:last-of-type {
margin-bottom: 0;
}
.responsive-table tbody th[scope="row"] {
border-bottom: 1px solid #1d96b2;
min-height: 90px;
}
.responsive-table tbody td[data-type=currency] {
text-align: center;
}
.responsive-table tbody td[data-title]:before {
content: attr(data-title);
float: left;
font-size: .8em;
color: rgba(94, 93, 82, 0.75);
width: 100px;
}
.responsive-table tbody td:not(.category_heading) {
text-align: center;
border-bottom: 1px solid #1d96b2;
min-height: 90px;
}


@media (min-width: 52em) {
.responsive-table {
font-size: .9em;
}
.responsive-table thead {
position: relative;
clip: auto;
height: auto;
width: auto;
overflow: auto;
}
.responsive-table tr {
display: table-row;
}
.responsive-table th,
.responsive-table td {
display: table-cell;
padding: .5em;
}

.responsive-table caption {
font-size: 1.5em;
}
.responsive-table tbody {
display: table-row-group;
}
.responsive-table tbody tr {
display: table-row;
border-width: 1px;
background-color: none;
}
.responsive-table tbody tr:nth-of-type(even) {
background-color: none;
}
.responsive-table tbody th[scope="row"] {
background-color: transparent;
color: #5e5d52;
text-align: left;
}
.responsive-table tbody td {
text-align: right;
}
.responsive-table tbody td[data-title]:before {
content: none;
}
}
@media (min-width: 62em) {
.responsive-table {
font-size: 1em;
}
.responsive-table th,
.responsive-table td {
padding: .75em .5em;
}
.responsive-table tfoot {
font-size: .9em;
}
}

@media (min-width: 75em) {
.responsive-table th,
.responsive-table td {
padding: .75em;
}
}

.category_heading {
text-align: left !important;
border:none !important;
background-color: #ededed;
}

.empty_space {
border: none !important;
background-color: transparent;
}

tr.no_border td,
tr.no_border th {
border-bottom: none !important;
}


/* ==========SEARCH CONTAINER STYLYING ============*/

.search-container {
  width: 100%;
  position: relative;
  display: inline-block;
}

.search-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  width:100%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.search-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.search-content a:hover {background-color: #f1f1f1}


#mySearchInput {
  background-image: url('/sitepkg/img/search-2.png');
  background-position: 10px 12px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
}

#mySearchInput:focus {
  border: 1px solid #17d4b5;
}



/* ===================== */




/* SEARCH DESIGNS END */




.help_list li {
  padding: 10px 5px;
}

.bottom_padding {
  padding-bottom: 120px;
}

.bottom_padding_half {
  padding-bottom: 60px;
}

.search_margin {
  margin: 3px 10px;
}


/* purchase pop up */


.account_type_selection {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000000;
  /* border: 1px solid #000000; */
  padding: 10px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  width: 70%;
  
}



.download-button-in-purchase {
background: rgba(228, 228, 228, 0.2);
color: #b1b1b1;
border: 2px solid #cbcbcb; 
margin-right: 20px;
font-weight: 500;
color: #ffffff;
border-radius: 5px; 
font-size: 20px;
}


.purchace-popup {
  background-color: #d209fa;
  zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1, startColorstr='#FFD209FA', endColorstr='#FF4F81D4');
  background-image: -owg-linear-gradient(left, #d209fa 1%, #4f81d4 100%);
  background-image: -webkit-linear-gradient(left, #d209fa 1%, #4f81d4 100%);
  background-image: -moz-linear-gradient(left, #d209fa 1%, #4f81d4 100%);
  background-image: -o-linear-gradient(left, #d209fa 1%, #4f81d4 100%);
  background-image: linear-gradient(left, #d209fa 1%, #4f81d4 100%);
  color: #ffffff !important;
  border: none;
  vertical-align: middle; 
}

.purchace-popup h5,
.purchace-popup p {
  color: #ffffff !important;
}

.purchace-popup .left_pane {
  background-color: #ffffff;
  padding: 1px;
  border-radius:8px;
}

.purchace-popup .add_on_note {
  font-style: italic;
}


.btn-link-dark:hover {
color: #ffffff !important;
}


.data-landing-page {
font-size: 18px;
line-height: 1.5 !important;
text-align: left;
}


/* STRIPE CARD UPDATE */

 
.card_update {
  border-radius: 4px;
  margin-bottom: 10px;
}

.card_update .last_4 {
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
}

label.spc_label, #pouet {
  position: relative;
  color: #8898AA;
  font-weight: 300;
  height: 40px;
  line-height: 40px;
  margin-left: 20px;
  display: flex;
  flex-direction: row;
}

 label.spc_label {
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.spc_label input[type="radio"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.card_update .checkmark_radio {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

.spc_label:hover input ~ .checkmark_radio {
  background-color: #ccc;
}

.spc_label input:checked ~ .checkmark_radio {
  background-color: #078494;
}

.checkmark_radio:after {
  content: "";
  position: absolute;
  display: none;
}

.spc_label input:checked ~ .checkmark_radio:after {
  display: block;
}

.spc_label .checkmark_radio:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white !important;
}

.card_update label:not(:last-child) {
  border-bottom: 1px solid #F0F5FA;
}

.card_update label > span, .card_update #pouet > span {
  width: 30px;
  text-align: right;
  margin-right: 30px;
}

.stripe_field {
  background: transparent;
  font-weight: 300;
  border: 0;
  color: #31325F;
  outline: none;
  flex: 1;
  padding-right: 10px;
  padding-left: 10px;
  cursor: text;
}

.stripe_field::-webkit-input-placeholder { color: #CFD7E0; }
.stripe_field::-moz-placeholder { color: #CFD7E0; }

.card_update_button {
  float: left;
  display: block;
  background: #078494;
  color: white;
  border-radius: 4px;
  border: 0;
  margin-top: 20px;
  font-size: 15px;
  font-weight: 400;
  width: 100%;
  height: 40px;
  line-height: 38px;
  outline: none;
  cursor: pointer;
}

.card_update_button:focus {
  background: #078494;
}

.card_update_button:active {
  background: #078494;
}

[name=CardUpdate] .outcome {
  float: left;
  width: 100%;
  padding-top: 8px;
  min-height: 24px;
  text-align: center;
}

[name=CardUpdate] .success-new-card, [name=CardUpdate] .error {
  display: none;
  font-size: 13px;
}

[name=CardUpdate] .success-new-card.visible, [name=CardUpdate] .error.visible {
  display: inline;
}

[name=CardUpdate] .error {
  color: #E4584C;
}

[name=CardUpdate] .success-new-card {
  color: #078494;
}



/* other  */

.data_container {
  border-radius: 4px;
}
.data_container .title {
  font-size: 16px;
  text-decoration: underline;
}


.indent-1 {
  text-indent: 50px;
}

.indent-2 {
  text-indent: 100px;
}

.indent-3 {
  text-indent: 150px;
}



/* LIST-GROUP TYPE */

.list-group-numbered, .list-group-numbered > li { list-style: decimal inside; }
.list-group-alpha, .list-group-alpha > li  { list-style: lower-alpha outside; }
.list-group-roman, .list-group-roman > li { list-style: lower-roman inside !important;}
.list-group-alpha > li, 
.list-group-numbered > li,
.list-group-roman > li { 
    display: list-item !important;
    padding: 5px; 

}

.list-group-alpha > li span,
.list-group-roman > li span {
    margin-left: 10px;
    overflow: hidden;
}


.item_display_header {
  color: #ffffff;
   background-color: rgb(238, 84, 13);
  padding: 8px 5px;
  display: inline-block;
  font-size: 16px;
  margin: 5px;
}


.buttonDownload {
	display: inline-block;
	position: relative;
	padding: 10px 25px;
  
	background-color: #005f69;
	color: white;
  
	font-family: sans-serif;
	text-decoration: none;
	font-size: 0.9em;
	text-align: center;
	text-indent: 15px;
}

.buttonDownload:hover {
	background-color: #116872;
	color: white;
}
.buttonDownload:active {
    color: white;
}

.buttonDownload:before, .buttonDownload:after {
	content: ' ';
	display: block;
	position: absolute;
	left: 15px;
	top: 52%;
}

/* Download box shape  */
.buttonDownload:before {
	width: 13px;
	height: 2px;
	border-style: solid;
	border-width: 0 2px 2px;
}

/* Download arrow shape */
.buttonDownload:after {
	width: 0;
	height: 0;
	margin-left: 3px;
	margin-top: -7px;
	border-style: solid;
	border-width: 4px 4px 0 4px;
	border-color: transparent;
	border-top-color: #ffffff;
	animation: downloadArrow 2s linear infinite;
    animation-play-state: paused;
    
}

.buttonDownload:hover:before {
	border-color: #005f69;
  border-color: #ffffff;
}

.buttonDownload:hover:after {
	border-top-color: #005f69;
  border-top-color: #ffffff;
	animation-play-state: running;
}

/* keyframes for the download icon anim */
@keyframes downloadArrow {
	/* 0% and 0.001% keyframes used as a hackish way of having the button frozen on a nice looking frame by default */
	0% {
		margin-top: -7px;
		opacity: 1;
	}
	
	0.001% {
		margin-top: -15px;
		opacity: 0;
	}
	
	50% {
		opacity: 1;
	}
	
	100% {
		margin-top: 0;
		opacity: 0;
	}
}

.download_btn {
  padding: 8px 16px;
  color: #ffffff;
  border-radius: 4px;
  background-color: #2f4ad0;
  transition: all 0.4s ease;
}

.download_btn:hover {
    background-color: #5d74e7 !important;
    color: #ffffff !important;
}

.download_btn .dwn_text {
  margin-left: 10px;
}


a[href^=tel].styl2 {
  background-color: #f5f5f5;
  background-image: linear-gradient(to bottom,#ffffff,#e6e6e6);
  background-repeat: repeat-x;
  border: 1px solid #cccccc;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) 
                rgba(0, 0, 0, 0.1) 
                rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 
                    0 1px 2px rgba(0, 0, 0, 0.05);
  color: #333;
  display: inline-block;
  font-size: 100%;
  font-style: normal;
  line-height: 20px;
  margin: 20px 0 0;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  font-weight: 500;
}

a[href^=tel].styl2:before {
  content: 'Call: ';
  font-weight: bold;
}



/* TABLE POP-UP */

td {
  position: relative !important;
}

.details {
  position: absolute;
  top: 100%;
  left:0;
  transform: scale(0);
  transition: transform 0.1s ease-in;
  transform-origin: left;
  display: inline;
  background: white;
  z-index: 20;
  min-width: 100%;
  padding: 1rem;
  border: 1px solid lightgray;

}

td:hover span.details {
  transform: scale(1);
}

.details:empty {
  display: none;
}



/* HERO MEDIA ON FRONT PAGE */


.hero_video_section {
  margin-bottom: 100px;
  margin-top: 50px;
}


  
.hero-media__cover {
  position: relative;
  width: 100%;
  max-width: 680px;
  border: none;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  display: flex;
  align-self: center;
  outline: none;
}


.hero-media__video {
  pointer-events: none;
  border:none;
}
.image-block, 
.image-block img {
  display: block;
  width: 100%;
  height: auto;
}

.hero-media__cover-aspect video {
  aspect-ratio: auto 680 / 400;
  border: none;
  outline: none;
  position: relative; /* could be absolute if needed */
  left: -1px;
}

.hero-media__cover-aspect {
  overflow: hidden;
}

.placeholder_image {
  width: 100%;
  height: auto;
  top:0px;
  left: 0px;
  /* display:none; */
  position: absolute;
}

@media (min-width: 960px) {
  .hero-media__cover, 
  .hero-media__cover--video {
      max-width: 680px;
  }
  .hero-media__cover {
      position: relative;
      flex-basis: auto;
  }
  .hero-media__video {
      max-width: 680px;
  }
}

@media (min-width: 768px) {
  .hero-media__cover--video {
      display: block;
  }
}

@media (max-width: 600px) {
  .hero-media__cover, 
  .hero-media__cover--video {
      max-width: 550px;
  }
  .hero-media__cover {
      position: relative;
      flex-basis: auto;
  }
  .hero-media__video {
      max-width: 550px;
  }
}

@media (max-width: 400px) {
  .hero-media__video {
      display: none;
  }
  .placeholder_image {
      display: block;
  }
}



/* CARD fORM DEMO */


.book_demo_form {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px auto;
}

.book_demo_form_info {
    margin: 40px auto;
}


.card-form {
  width: 500px;
  border-radius: 10px;
  background: white;
  box-shadow: 0 4px 10px 4px #f5f5f5;
}
.card-form .form-title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  font-size: 20px;
  font-weight: bold;
  background-color: #078494;
  border-radius: 10px 10px 0 0;
  color:#ffffff;
}
.card-form .form-body {
  padding: 10px;
}
.card-form .form-body .row {
  display: flex;
  justify-content: space-around;
  padding: 10px 25px;
}
.card-form .form-body .row input[type=text]:not(.telephone_input) {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100%;
  margin: 5px 0px !important;
  height: 35px;
  padding: 5px 15px;
  border-radius: 5px;
  outline: none;
  border: none;
  background: #e8ebed;
  color: #576366;
  font-size: 14px;
  box-sizing: border-box;
}


.card-form .form-body .row .telephone-input_container {
  width: 100%;
  margin: 5px 0px !important;
  height: 35px;
  padding: 5px 15px;
  border-radius: 5px;
  outline: none;
  border: none;
  background: #e8ebed;
  color: #576366;
  font-size: 14px;
  box-sizing: border-box;
}


.card-form .form-body .row input[type=text]::placeholder {
    color: #576366 !important;
}


.card-form .form-body .row textarea {
  margin: 5px 0px !important;
  padding: 5px 15px;
  border-radius: 5px;
  box-sizing: border-box;
  outline: none;
  border: none;
  background: #e8ebed;
  color: #576366;
  font-size: 14px;
  resize: none;
  width: 100%;
}

.card-form .form-body .row textarea::placeholder {
  color: #576366 !important;
}


.card-form .rule {
  height: 2px;
  background: #e8ebed;
  margin: 0px 35px;
}
.card-form .form-footer {
  margin: 0 25px 15px 25px;
  padding: 15px 10px;
}
.card-form .form-footer a {
  display: inline-block;
  height: 40px;
  line-height: 40px !important;
  border: none;
  border-radius: 5px;
  padding: 0px 15px;
  background-color: #078494;
  width: 100%;
  margin-right: 10px;
  font-size: 14px;
  color:#ffffff;
  text-align: center;
  cursor: pointer;
  transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.card-form .form-footer a:hover {
    color: #ffffff;
    background-color: #2f8c99;
}
.card-form .form-footer span {
  margin-left: 8px;
}

.demo_footer {
    font-size: 13px;
    margin-top: 40px;
}


/* select style */

.select-style {
     /* border: 1px solid #ccc; */
    padding: 0;
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    background-color: #e8ebed;
    margin: 5px 0px;
    background: #e8ebed url(/sitepkg/img/dropdown_black.svg) no-repeat 95% 50%;
}

.select-style select {
    box-sizing: border-box;
    width: 100%;
    border: none;
    box-shadow: none;
    background-image: none;
    background: transparent;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    
  height: 35px;
  padding: 5px 15px;
  border-radius: 5px;
  color: #576366;
  font-size: 14px;
}

.select-style select:focus {
    outline: none;
}

.was-validated input:valid,
.was-validated select:valid {
  border-color: #28a745;
}

.was-validated input:invalid,
.was-validated select:invalid  {
  border-color: #dc3545;
}


.copy_input,
.expose_secret,
.generate_signature {
  cursor: pointer;
}


.payment_option_img {
  max-width: 600px;
  width: 100%;
  height: auto;
  margin:auto;
  display: block;
}

.add_m_top {
  margin-top: 120px;
}


/* New layout for landing pages */

.block-6 {
  margin-bottom: 30px;
  }
  
  .media_local {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
  }
  
  
  .column-icon span {
  margin-right: 0;
  margin-bottom: 1rem !important;
  font-size: 50px;
  color: rgb(119, 131, 246);
  }
  
  .media_local-body {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  }
  
  .gpsoDr {
  color: rgb(12, 17, 66);
  margin-bottom: 0px;
  padding-bottom: 0px;
  }
  
  .kgvRXU {
  font-style: normal;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #36454F;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 16px;
  }
  
  .eyebrow-underline {
  width: 100%;
  height: 6px;
  margin-top: -9px;
  background-color: rgb(213, 246, 248);
  }
  
  .small_heading {
      width: 80px;
      margin-bottom: 40px;
  }
  
  .section_info_img {
    display: block;
    margin: 10px auto;
    width: 250px;
    max-width: 90%;
    height:auto;
  }
  
  .larger_item {
  width: 300px;
  }
 
  
  .payment_option_style img {
      max-width: 190px;
  }

  @media (max-width: 600px) {
      .payment_option_style img  {
          margin: auto; 
          display: block;
      }
  }
  
  .payment_option_style {
      padding: 10px;
  }
  .styles--container--1E_RO {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
  }
  @media (min-width: 768px) {
      .index--Container--page--1Wfbe {
          padding: 0 5px;
      }
  }
  .index--Container--page--1Wfbe {
      width: 100%;
  }
  .index--Container--okDBL {
      margin-left: auto;
      margin-right: auto;
      padding: 0;
  }
  
  .styles--item--3VGw4 {
  /* padding: 10px 8px; */
  text-align: center;
  /* max-width: 250px; */
   padding: 10px 40px;
  }
  
  
  @media (min-width: 1024px) {
      .styles--item--3VGw4 {
          width: 25%;
      }
  }
  @media (min-width: 768px) {
     .styles--item--3VGw4 {
          width: 50%;
      }
  }

  @media (max-width: 767px) {
    .styles--item--3VGw4 {
         width: 100%;
     }
 }
  
  .styles--image--cqxbO {
  height: 72px;
  width: 72px;
  }
  .styles--image--cqxbO {
  align-items: center;
  background: lightblue;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  margin: auto;
  overflow: hidden;
  padding: 2px;
  }
  .styles--subtitle--2rice {
      text-align: center;
  }
  
  .lozad {
      width: 35px;
      height: auto;
  }
 



  blockquote.type2 {
    position: relative;
    padding: 0.5em 1em 0.5em 2em;
    border-right: 4px solid gray;
    border-left: 0px;
    text-align: left;
    font-style: italic;
    background-color: #f6ebc1;
    margin: 0px;
  }
    
  blockquote.type2:before {
    font-size: 4rem;
    position: absolute;
    line-height: 1;
    top: 0;
    left: 0;
    content: "\201C";
  }
    
    
  blockquote.type2 cite {
    padding: 0 2em 0 0;
    text-align: right;
  }



  /* -----SELECT ACCOUNT------- */

  .account_options_disclaimer {
    padding-top: 80px;
    max-width: 600px;
    display: block;
    margin: auto;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}


.color-mode-label {
    font-size: 13px;
    color: #424242;
    font-weight: 500;
    cursor: pointer;
}

.btn-color-mode-switch{
    display: inline-block;
    margin: 0px;
    position: relative;
}

.btn-color-mode-switch > label.btn-color-mode-switch-inner{
    margin: 0px;
    width: 180px;
    height: 30px;
    background: #E0E0E0;
    border-radius: 26px;
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease;
    display: block;
}

.btn-color-mode-switch > label.btn-color-mode-switch-inner:before{
    content: attr(data-on);
    position: absolute;
    font-size: 12px;
    font-weight: 500;
    top: 7px;
    right: 20px;

}

.btn-color-mode-switch > label.btn-color-mode-switch-inner:after{
    content: attr(data-off);
    width: 90px;
    height: 16px;
    height: 26px;
    background: #fff;
    border-radius: 26px;
    position: absolute;
    left: 2px;
    top: 2px;
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0px 0px 6px -2px #111;
    padding: 5px 0px;
}

.btn-color-mode-switch input[type="checkbox"]{
    cursor: pointer;
    width: 50px;
    height: 25px;
    opacity: 0;
    position: absolute;
    top: 0;
    z-index: 1;
    margin: 0px;
}


.btn-color-mode-switch input[type="checkbox"]:checked + label.btn-color-mode-switch-inner:after{
    content: attr(data-on);
    left: 88px;
}

.btn-color-mode-switch input[type="checkbox"]:checked + label.btn-color-mode-switch-inner:before{
    content: attr(data-off);
    right: auto;
    left: 20px;
}

.switch_prices {
    margin-top: 80px;
}


/* PRICING TABLES */

.pricing-detail-content {
    margin: 0px 10px;
}

.pricing-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 380px;
    margin: auto;
    background: #F6F8F9;
    border-radius: 20px;
    overflow: hidden;
}

.pricing-tab-item {
    flex: 1;
    text-align: center;
    padding: 8px 10px;
    cursor: pointer;
    transition: all .3s;
    text-transform: uppercase;
}

.pricing-tab-item:hover, .tab-active {
    background: #326BD6;
    color: #fff;
}

.pricing-content-items {
    display: flex;
    padding: 50px 0px;
}

.pricing-item {
    display: flex;
    flex-direction: column;
    padding: 15px;
    transition: all .3s;
}

.pricing-item-box {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 35px 25px;
    transition: all .6s;
    border: 2px solid #eee;
    border-radius: 10px;
    cursor: pointer;
    position: relative;
}

.plan-name {
    font-size: 22px;
    font-weight: 600;
}

.plan-text {
    margin: 10px 0px;
    font-size: 15px;
}

.plan-price-content {
    margin: 10px 0px;
    color: #078494;
}

.plan-price {
    font-size: 26px;
    font-weight: 600;
    /* color: #078494; */
}

.plan-price-text {
    color: #707070;
    margin-top: 2px;
}

.month-text {
    font-size: 13px;
    font-weight: 500;
    opacity: .6;
}

.plan-features {
    flex: 1;
}

.plan-feature-item {
    color: #707070;
    margin: 10px 0;
    font-size: 14px;
    display: flex;
    align-items: center;
}

.pricing-title {
    background: #22B122;
    text-align: center;
    color: #fff;
    padding: 6px;
    font-size: 14px;
    margin-top: -31px;
}

.plan-button a {
    flex: 1;
    display: flex;
    justify-content: center;
    border: 1px solid #078494;
    padding: 10px;
    border-radius: 3px;
    text-decoration: none;
    color: #078494;;
    transition: all .3s;
}

.plan-button {
    display: flex;
    margin-top: 20px;
}
/* 
.pricing-item:hover {
    transform: scale(1.01);
} */

.plan-button-blue {
    background: #078494;
    color: #fff !important;
}
.plan-button a:hover {
    background: #078494;
    color: #fff;
}

.pricing-item:hover .pricing-item-box {
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    border-color: transparent;
    transform: translateY(-10px);
}

.compare-button {
    text-align: center;
}

.compare-button a {padding: 10px 20px;border: 1px solid #707070;color: #707070;text-transform: uppercase;text-decoration: none;border-radius: 3px;transition: all .3s;}

.compare-button a:hover {
    background: #2e6ad4;
    color: #fff;
    border-color: #2e6ad4;
}

.plan-feature-item:before {
    content: ""; width: 14px; height: 14px;
    min-width: 14px;
    background: url(/sitepkg/img/cricle_tick.svg) left center no-repeat;
    margin-right: 7px;
    margin-bottom: 2px;
}

.ribbon:before, .ribbon:after {
    content: "";
    display: block;
    position: absolute;
    height: 0px;
    bottom: -8px;
    border: 13px solid #22B122;
}
.ribbon {
    position: absolute;
    right: 36px;
    top: 17px;
}
.ribbon:before {
    border-bottom-color: transparent;
    bottom: -26px;
}

.pricing-content-items-tabs{
    display: flex;
    flex-direction: column;
    padding: 20px 0px;
}

.pricing-yearly {
    display: none;
    margin-bottom: 50px;
    /* flex-direction: row; */
    flex-wrap: wrap;
}

.pricing-monthly{
    display: none;
    margin-bottom: 50px;
    /* flex-direction: row; */
    flex-wrap: wrap;
}

.pricing-yearly .pricing-item,
.pricing-monthly .pricing-item {
    flex: 33.33%;
}

.pricing-monthly.active-tab-content,
.pricing-yearly.active-tab-content {
    display: flex;
}

.text-bold {
    font-weight: 800 !important;
}
.text-captial {
    text-transform: capitalize;
}

@media (max-width: 850px) {
    .pricing-yearly .pricing-item,
    .pricing-monthly .pricing-item {
        flex: 50%;
    }
}

@media (max-width: 400px) {
    .pricing-yearly,
    .pricing-monthly {
        flex-direction: column;
    }
}

.plan-description {
    margin: 15px 0px;
    font-size: 12px;

}


.account-data label {
  margin-top: 0px;
  margin-bottom: 0px;
}


/* CAROSOUEL ON MAIN PAGE */

.doc_carousel {
  position: relative;
  width: 100%;
  height: auto;
  overflow-x: hidden;
  min-height: 300px;
}

.doc_carousel .doc_carousel-item {
  position: absolute;
  width: 100%;
  top: 0;
  left: 100%;
  height: auto;
}

.doc_carousel .doc_carousel-item.active {
  left: 0;
  transition: all 0.3s ease-out;
}


.doc_carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 10px;
  left: 0;
  z-index: 15;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-left: 0;
  margin-right: 15%;
  margin-left: 15%;
  list-style: none;
}

.doc_carousel-indicators li {
  position: relative;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  width: 30px;
  height: 3px;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  background-color: rgba(255,255,255,.5);
  cursor: pointer;
}

.doc_carousel-indicators li::after {
  position: absolute;
  bottom: -10px;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 10px;
  content: "";
}

.doc_carousel-indicators li::before {
  position: absolute;
  top: -10px;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 10px;
  content: "";
}

.doc_carousel-indicators .active {
  background-color: #fff;
}



/* BLOG STYLES */

/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn { 
  float: left;
  width: 75%;
}

/* Right column */
.rightcolumn {
  float: left;
  width: 25%;
  padding-left: 20px;
}

/* Fake image */
.blogimg {
  width: 100%;
  height: auto;
}

.blogimg_wrapper {
  margin: 20px 0px;
}

[data-article="type1"] .blogimg {
  min-height:200px;
}

[data-article="type2"] .blogimg {
  min-height:100px;
}

[data-article="type3"] .blogimg {
  max-height:100px;
}

[data-article="type3"] img {
  width: 100%;
  height: auto;
}

[data-article="type4"] h2 {
  font-size: 19px !important;
}

[data-article="type5"] h2 {
  font-size: 19px !important;
}


[data-article="type2"] h2 {
  font-size: 17px !important;
}

.blog_card h5 {
  font-size: 15px;
}

/* Add a card effect for articles */
.blog_card {
  background-color: white;
  padding: 20px;
  margin-top: 20px;
}

/* Clear floats after the columns */
.blog_row:after {
  content: "";
  display: table;
  clear: both;
}

.flex-container {
  display: flex;
  flex-direction: row;
}

.flex-container-2 {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}


.flex-child {
  flex: 1;
} 

.flex-child-2 {
  flex: 2;
}


.flex-child:first-child {
  margin-right: 20px;
} 
.other_ainfo {
  margin-top: 10px;
  font-size: 14px;
}

.small_title {
  margin-top: 10px;
  font-size: 15px;
  color: #515769 !important;
  line-height: 1;
  font-weight: 800;
}


[data-article="type5"].flex-child {
  margin-right: 10px;
}

[data-article="type5"] {
  min-width: 290px;
}

.other_articles {
  margin: 50px 0px;
}

/* Responsive layout - when the screen is less than 800px wide, 
make the two columns stack on top of each other instead of next to each other */

@media screen and (max-width: 800px) {
  .leftcolumn, .rightcolumn { 
    width: 100%;
    padding: 0;
  }
  .flex-container {
    flex-direction: column;
  }
}



/* REVIEW STYLES */
.spr-review {
  width: 90%;
  margin: 0 1% !important;
  min-height: 250px;
  /* display: inline-block; */
  float: left;
  padding: 20px 25px !important;
  /*background: #fff;*/
  margin-bottom: 25px !important;
  border-radius: 12px;
  
  border:none;
  }

  .spr-review.standalone {
    border: 1px solid rgba(0,0,0,.125);
    width: 50%;
  }

  .spr-review.standalone_full {
    border: 1px solid rgba(0,0,0,.125);
    width: 100%;
  } 

  .spr-review-header-title {
  display: block;
  clear: both;
  float: none;
  }
  @media (max-width: 800px) {
  .spr-review,
  .standalone_full,
  .spr-review.standalone {
      float: none;
      width: 100%;
      min-height: auto;
      margin: 0 !important;
      margin-bottom: 25px !important;
  }
  }



  /* ratings */

  .rating-container {
      margin-top: 7px;
      margin-bottom: 7px;
      display: inline-block;
      background-color: #fff;
      border-radius: 10px;
      padding: 5px;
      background-color: beige;
  }

  .star{
  color: goldenrod;
  font-size: 1.0rem !important;
  padding: 0 0.3rem !important; /* space out the stars */
  }

  .star::before{
  content: '\2606';    /* star outline */
  cursor: pointer;
  }


  .stars{
      position: relative;
      font-size: 1.1rem !important;
      font-weight: 900;
      display: inline-block;
      text-align: center;
      min-width: 180px;
  }


  [data-rating="1"] .stars span:nth-child(-n+1)::before {
      content: '\2605';  /* filled star */
  }

  [data-rating="2"] .stars span:nth-child(-n+2)::before {
      content: '\2605';  /* filled star */
  }

  [data-rating="3"] .stars span:nth-child(-n+3)::before {
      content: '\2605';  /* filled star */
  }

  [data-rating="4"] .stars span:nth-child(-n+4)::before {
      content: '\2605';  /* filled star */
  }

  [data-rating="5"] .stars span:nth-child(-n+5)::before {
      content: '\2605';  /* filled star */
  }

  [data-rating="1"] .rating-count::before {
      content: '1/5';
  }

  [data-rating="2"] .rating-count::before {
      content: '2/5';
  }

  [data-rating="3"] .rating-count::before {
      content: '3/5';
  }

  [data-rating="4"] .rating-count::before {
      content: '4/5';
  }

  [data-rating="5"] .rating-count::before {
      content: '5/5';
  }


  /* rating data */
  blockquote.type6 {
    font-size: 1em;
    line-height: 1.3em;
    font-weight: 700;
    margin-top: .3em;
    font-weight: 400;
    font-family: 'Merriweather', Helvetica, sans-serif;
    color: #000000;
    margin-bottom: 10px;
    font-style: italic;
    }

    blockquote.type6:before {
    content: "\201C";
    }


    blockquote.type6:before {
    display: inline-block;
    vertical-align: bottom;
    color: goldenrod;
    font-size: 3em;
    top: .2em;
    position: relative;
    }



    /* ADDON PAGE */

  
.cards-container-holder {
  position: relative;
  width: 300px;
  height: auto;
}


.cards-container-holder .card {
position: relative;
height: 45vh;
width: 100%;
border-radius: 20px;
overflow: hidden;
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.1);
transition: opacity 0.2s ease, box-shadow 0.2s ease;
opacity: 1;
margin-bottom: 40px;
}

.cards-container-holder .card.open {
  border-radius: 0;
}

.cards-container-holder .card.hover,
.cards-container-holder .card:hover {
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}

.cards-container-holder .card-content {
position: relative;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0);
overflow: hidden;
transition: border-radius 0.15s ease;
border-radius: 20px;
cursor: pointer;
}

.cards-container-holder .card.open .card-content {
  background: #fff;
  border-radius: 0px;
  cursor: default;
}

.cards-container-holder .banner-holder {
position: absolute;
width: 100%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}

.cards-container-holder .banner {
position: relative;
height: 20vh;
width: 100%;
padding: 15px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
background-color: transparent;
overflow: hidden;
z-index: 1;
}

.cards-container-holder .card.open .banner {
height: 45vh;
border-radius: 0;
}

.cards-container-holder .content-holder {
max-width: 800px;
padding: 0;
z-index: 1;
height: 100%;
background-color: transparent;
overflow: hidden;
position: relative;
}

.cards-container-holder .card.open .content-holder {
overflow: auto;
}

.cards-container-holder .inner-content {
top: 20vh;
padding: 20px;
position: relative;
background-color: #fff;
}

.cards-container-holder .card.open .inner-content {
top: 40vh;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}



.cards-container-holder .like-wrapper {
position: relative;
cursor: pointer;
padding-left: 40px;
}

.cards-container-holder .like-wrapper .fa,
.cards-container-holder .bookmark-wrapper .fa {
opacity: 0.3;
}

.cards-container-holder .like-wrapper.btn-liked .fa {
opacity: 1;
color: red;
}

.cards-container-holder .like-wrapper span {
position: absolute;
top: 0;
left: 0;
text-align: right;
opacity: 0.3;
width: 35px;
line-height: 24px;
font-size: 12px;
}

.cards-container-holder .bookmark-wrapper {
margin-left: 8px;
width: 24px;
text-align: right;
cursor: pointer;
}

.cards-container-holder .title {
position: relative;
margin: 10px 0 20px 0;
font-weight: bold;
}

.cards-container-holder .description {
font-size: 16px;
line-height: 1.5;
}

.cards-container-holder .card:not(.open) .description {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-box-orient: vertical;
height: 4.2em;
}

.cards-container-holder .close-btn {
position: absolute;
right: 15px;
top: 15px;
height: 28px;
width: 28px;
line-height: 27px;
background: rgba(255, 255, 255, 0.5);
border-radius: 50%;
color: #333;
text-align: center;
cursor: pointer;
opacity: 0;
visibility: hidden;
transition: all 0.15s ease-in-out;
}

.cards-container-holder .card.open .close-btn {
  z-index: 600;
  opacity: 0.9;
  visibility: visible;
}

/* increment button */
.increment-btn {
  outline: none;
  box-shadow: none;
  box-sizing: content-box;
  border: none;
  margin: 5px;
  cursor: pointer;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  color: #ffffff;
}


.increment_container input::-moz-placeholder,
.increment_container input:-ms-input-placeholder,
.increment_container input::placeholder {
  color: #a0aec0;
  font-size: '16px';
  display: none;
}

.increment_container  input[type='number']::-webkit-inner-spin-button,
.increment_container  input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.increment_container input {
  margin: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 0;
  outline: none;
  font-size: 1rem;
  box-shadow: none;
  transition: all 0.3s;
  line-height: normal;
  text-align: center;
  margin:5px;
  border-radius: 0.5rem;
}

.increment_container {
  display: inline-flex;
  justify-content: center;
}

.cards-container-holder .info-holder {
  display: block;
  margin:10px 0px;
}


.cards-container-holder .date-category {
  text-transform: uppercase;
  font-size: 15px;
  opacity: 0.5;
  margin-bottom: 0;
  margin: 0 1.4rem 0 0;
  display: block;
  width: 100%;
}



.materialize-docen-input {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  border-radius: 0;
  outline: none;
  height: 3rem;
  width: 100%;
  font-size: 1rem;
  margin: 0 0 20px 0;
  padding: 0;
  box-shadow: none;
  box-sizing: content-box;
  transition: all 0.3s;
  line-height: normal;
  color: inherit;
  font: inherit;
  margin: 0;
  
}

.materialize-docen-input:focus:not([readonly]) {
  border-bottom: 1px solid #26a69a;
  box-shadow: 0 1px 0 0 #26a69a;
}


.materialize-docen-btn {
  position: relative;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  vertical-align: middle;
  z-index: 1;
  will-change: opacity, transform;
  transition: .3s ease-out;
  border: none;
  text-decoration: none;
  color: #ffffff !important;
  background-color: #26a69a;
  text-align: center;
  outline: 0;

  letter-spacing: .5px;
  border-radius: 2px;
  padding: 0 2rem;
  height: 36px;
  line-height: 36px;
  text-transform: uppercase;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 
              0 1px 5px 0 rgba(0, 0, 0, 0.12), 
              0 3px 1px -2px rgba(0, 0, 0, 0.2);

}

.materialize-docen-btn:hover {
  background-color: #2bbbad;    
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
  outline: 0;
}

.materialize-docen-btn:focus {
  background-color: #1d7d74;
}


/* CHIPS */

.materialize-docen-chips_v1 {
  border: none;
  box-shadow: none;
  margin: 0 0 20px 0;
  min-height: 45px;
  outline: none;
  transition: all .3s;
  display: inline-block;
}

.materialize-docen-chips_v1:hover {
  cursor: text; 
}

.materialize-docen-chips:hover {
  cursor: text; 
}
.materialize-docen-chips.focus {
  border-bottom: 1px solid #26a69a;
  box-shadow: 0 1px 0 0 #26a69a;
}
.materialize-docen-chips {
  border: none;
  border-bottom: 1px solid #9e9e9e;
  box-shadow: none;
  margin: 0 0 20px 0;
  min-height: 45px;
  outline: none;
  transition: all .3s;
}

.materialize-docen-chip {
  display: inline-block;
  height: 32px;
  font-size: 13px;
  font-weight: 500;
  color: #ffffff;
  line-height: 32px;
  padding: 0 12px;
  border-radius: 16px;
  /* background-color: #e4e4e4; */
  background-color: #555;
  margin-bottom: 5px;
  margin-right: 5px;
}


.materialize-docen-chip .close {
  cursor: pointer;
  float: right;
  font-size: 16px;
  line-height: 32px;
  padding-left: 8px;
  color: #ffffff !important;

}


.materialize-docen-chip-container {
width: 100%;
/* background: #f0f0f0; */
border: 2px solid #EFEFEF;
padding: 15px 15px 10px 15px;
/* border-radius: 15px; */
}
.materialize-docen-chip-container h1 {
font-size: 18px;
margin-top: 0px;
margin-bottom: 20px;
}
.materialize-docen-chip-container .chips,
.container .chips_v1 {
margin: 0px;
padding: 0px;
display: inline-block;
}

.materialize-docen-chip-container input {
  border: 0px;
background: none;
margin-bottom: 5px;
display: inline-block;  
}
.materialize-docen-chip-container .materialize-docen-btn {
/* border: 0px; */
margin-bottom: 5px;
display: inline-block;
}

.materialize-docen-chip-container .chip {
  background: #555;
color: white;

}


.materialize-docen-chips_v1:empty {
display: none;
}





/* CONNECTED APPS */




.addon_list_not_subscribed,
.addon_list_subscribed {
    min-height: 310px;
    width: 100%;
    max-height: 620px;
    overflow-y: scroll;
}


.connected_app_card {
  overflow: hidden;
  position: relative;
  text-align: left;
  border-radius: 0.5rem;
  background-color: #ffffff;
  border: 1px solid #D1D5DB;
  box-shadow: none;
}

.connected_app_card .dismiss {
  position: absolute;
  right: 10px;
  top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  background-color: #fff;
  color: black;
  border: 2px solid #D1D5DB;
  font-size: 1rem;
  font-weight: 300;
  width: 30px;
  height: 30px;
  border-radius: 7px;
  transition: .3s ease;
}

.connected_app_card .dismiss:hover {
  background-color: #ee0d0d;
  border: 2px solid #ee0d0d;
  color: #fff;
}

.connected_app_card_header {
  padding: 1.25rem 1rem 1rem 1rem;
}

.connected_app_card_image {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  background-color: #e2feee;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  transition: .6s ease;
}

.connected_app_card_image_animate {
    animation: animate_con_app_image .6s linear alternate-reverse infinite;
}

.connected_app_card_image svg {
  color: #0afa2a;
  width: 2rem;
  height: 2rem;
}

.connected_app_card_image img {
  display: block;
  width: 2rem;
  height: 2rem;
  margin: 0 auto;
}

.connected_app_card_content {
  margin-top: 0.75rem;
  text-align: center;
}

.connected_app_card_title {
  color: #066e29;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5rem;
}

.connected_app_card_message {
  margin-top: 0.5rem;
  color: #595b5f;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.connected_app_card .actions {
  margin: 0.75rem 1rem;
}
.d-none {
    display: none !important;
}
.connected_app_card .history {
  display: inline-flex;
  padding: 0.5rem 1rem;
  background-color: #1aa06d;
  color: #ffffff;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  justify-content: center;
  width: 100%;
  border-radius: 0.375rem;
  border: none;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  border: 1px solid #1aa06d;
}

.connected_app_card .history_uninstall {
  display: inline-flex;
  padding: 0.5rem 1rem;
  background-color: #fff;
  color: #242525;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  justify-content: center;
  width: 100%;
  border-radius: 0.375rem;
  border: none;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  border: 1px solid #D1D5DB;
}

.connected_app_card .btn_disabled {
  display: inline-flex;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  justify-content: center;
  width: 100%;
  border-radius: 0.375rem;

  background-color: #cccccc;
  color: #666666;    
  box-shadow: none;         
  opacity: 0.7;
  border: 1px solid #cccccc;
}





.connected_app_card .track {
  display: inline-flex;
  margin-top: 0.75rem;
  padding: 0.5rem 1rem;
  color: #242525;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  justify-content: center;
  width: 100%;
  border-radius: 0.375rem;
  border: 1px solid #D1D5DB;
  background-color: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

@keyframes animate_con_app_image {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(1.09);
  }
}

.connected_app_card .history:disabled,
.connected_app_card .track:disabled {
    pointer-events: none;
}




/* MAIN DISPLAY FOR CONTACT DETAILS */

a.form-control {
  background-color: #ffffff !important;
}

.display-panel input:disabled,
.display-panel select:disabled,
.display-panel textarea:disabled,
.display-panel button.menu-btn:disabled,

.presentation-display input:disabled,
.presentation-display select:disabled,
.presentation-display textarea:disabled,
.presentation-display button.menu-btn:disabled,

a.form-control[contenteditable=false] {
background: #ffffff;
border-color: #ffffff;
border-color: transparent;
}
.custom-select-editorv:disabled {
  background: none !important;
}

.display-panel select:disabled::after,
.display-panel button.menu-btn:disabled::after

.presentation-display select:disabled::after,
.presentation-display button.menu-btn:disabled::after


.display-panel .titally,
.presentation-display .titally {
 font-weight:500;
 display: flex;
 align-items: center;
}


.display-panel {
  position: fixed;
  border-radius: 10px;
  top: 10px;
  left: 10px;
  bottom: 10px;
  right: 10px;
  overflow: hidden;
  overflow-y: scroll;
  background-color: #fff;
  z-index: 800;
  box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.1);
  /* transition: opacity 0.2s ease, box-shadow 0.2s ease; */
border: 1px solid #078494 !important;
  visibility: hidden;
  opacity: 0;
  transition: all 0.35s ease-in;
}

.display-panel .row,
.presentation-display .row {
 margin-bottom: 5px;
}

.display-panel .row div,
.display-panel .row a,
.presentation-display .row div,
.presentation-display .row a {
  white-space: normal;
  margin: 4px 0px; 
}

.display-panel .close-display {
color: #ffffff;
font-weight: bold;
}

.display-panel .close-display:hover,
.display-panel .close-display:focus {
color: #ffffff;
text-decoration: none;
cursor: pointer;
}


.display-panel { 
font-size: 15px; 
font-weight:500;
}

.display-panel.is-visible {
  visibility: visible;
  opacity: 1;
}


.display-panel .profile-img {
  cursor: pointer;
  width: 100px;
  height: auto;
  border:2px solid #03b1ce ;
  display: block;
}

.display-panel .menu_btn {
 position: absolute;
 right: 10px;
 top: 10px;
 z-index: 20;
}

.display-panel .placeholder:empty:before {
font-size: 15px; 
font-weight:500;
}

.display-panel .col-form-label {
  font-weight: 800;
}

.historical_transactions {
width: 100%;
max-height: 250px;
padding: 8px;
overflow-y: scroll;
}

.profile_picture_container {
 position: relative;
}

.container_input {
 position: absolute;
 top: 8px;
 left: 5px;
 width: 100%;
}

.container_input .close_btn {
position: absolute;
right: 5px;
top: 2px;
width: 32px;
height: 32px;
opacity: 0.3;
cursor: pointer;
background-color: #FFFDF8;
}
.container_input .close_btn:hover {
opacity: 1;
}
.container_input .close_btn:before, 
.container_input .close_btn:after {
position: absolute;
left: 15px;
content: ' ';
height: 33px;
width: 2px;
background-color: #333;
}
.container_input .close_btn:before {
transform: rotate(45deg);
}
.container_input .close_btn:after {
transform: rotate(-45deg);
}


[data-animation]  {
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.51, 0.92, 0.24, 1.15);
}

[data-animation].is-visible  {
  opacity: 1;
  transition-delay: 0.2s;
}

[data-animation="slideInOutDown"]  {
  transform: translateY(100%);
}

[data-animation="slideInOutTop"]  {
  transform: translateY(-100%);
}

[data-animation="slideInOutLeft"]  {
  transform: translateX(-100%);
}

[data-animation="slideInOutRight"]  {
  transform: translateX(100%);
}

[data-animation="zoomInOut"]  {
  transform: scale(0.2);
}

[data-animation="rotateInOutDown"]  {
  transform-origin: top left;
  transform: rotate(-1turn);
}

[data-animation="mixInAnimations"].is-visible  {
  animation: mixInAnimations 2s 0.2s linear forwards;
}

[data-animation="slideInOutDown"].is-visible,
[data-animation="slideInOutTop"].is-visible,
[data-animation="slideInOutLeft"].is-visible,
[data-animation="slideInOutRight"].is-visible,
[data-animation="zoomInOut"].is-visible,
[data-animation="rotateInOutDown"].is-visible {
  transform: none;
}

@keyframes mixInAnimations {
  0% {
    transform: translateX(-100%);
  }

  10% {
    transform: translateX(0);
  }

  20% {
    transform: rotate(20deg);
  }

  30% {
    transform: rotate(-20deg);
  }

  40% {
    transform: rotate(15deg);
  }

  50% {
    transform: rotate(-15deg);
  }

  60% {
    transform: rotate(10deg);
  }

  70% {
    transform: rotate(-10deg);
  }

  80% {
    transform: rotate(5deg);
  }

  90% {
    transform: rotate(-5deg);
  }

  100% {
    transform: rotate(0deg);
  }
}




/* RECIPIENT INCL EWITNESS */
.convert_to_template {
  /* width: 80%; */
  height: auto;
  border-radius: 10px;
  /* display: inline-block; */
  display: block;
  padding: 10px;
}

.recipient_data {
  background-color: #fafafa;
  padding-top: 20px; 
  padding-bottom: 20px;
}

     
.connector_horizontal::after {
content: '';
width: 10px;
height: 10px;
text-align: center;
line-height: 10px;
border-radius: 5px;
background: orange;
margin: 0;
display: inline-block;
position: absolute;
top: -4px;
}

.connector_horizontal::before {
left: -5px;
}

.connector_horizontal::after {
right: -5px;
}

.connector_horizontal {
width: 90%;
height: 2px;
background: darkGray;
position: absolute;
bottom: 0px;
left: 0px;
}

.elbow_column {
  position: relative;
  width: 50px;
  height: 140px;
  margin: 0px;
  padding: 0px;
}

.connector_vertical {
  width: 2px;
  height: 100%;
  left: 0px;
  bottom:0px;
  background: darkGray;
  position: absolute;
}

.connector_vertical::before {
content: '';
width: 10px;
height: 10px;
text-align: center;
line-height: 10px;
border-radius: 5px;
background: orange;
margin: 0;
display: inline-block;
position: absolute;
top: -4px;
left: -4px;
}

.flex-grow {
  flex: 1 0 auto;
}

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

.connector_horizontal {
  display: none;
}

.connector_vertical::after {
  content: '';
  width: 10px;
  height: 10px;
  text-align: center;
  line-height: 10px;
  border-radius: 5px;
  background: orange;
  margin: 0;
  display: inline-block;
  position: absolute;
  top: 100%;
  left: -4px;
}

.elbow_column {
  width: 100%;
  display: block;
  margin: auto;
  height: 100px;
  
}

.connector_vertical {
  left: 50%;
}

.flex-grow {
  flex-basis: 100%;
}

}

.document_list_container {
  min-height: 200px;
}


/* COOKIE NOTIFICATIONS */

.cookie-notification-container {
  position: fixed;
  left: 5px;
  /* right: 0; */
  bottom: 0;
  text-align: center;
  display: none;
  z-index: 1100;
}
@media (min-width:420px) {
  .cookie-notification-container {
      bottom: 10px;
  }
}
.cookie-notification-container.shown {
  display: block;
}
.cookie-notification-container.dismissed, .cookie-notification-container.shown.dismissed {
  display: none;
}
.cookie-notification {
  background: rgba(246, 249, 252, .9);
  box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
  font-size: 15px;
  color: #424770;
  margin: 0 auto;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-align: center;
  align-items: center;
}
@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))) {
  .cookie-notification {
      background: rgba(246, 249, 252, .75);
      -webkit-backdrop-filter: blur(20px);
      backdrop-filter: blur(20px);
  }
}
@media (min-width:420px) {
  .cookie-notification {
      border-radius: 4px;
  }
}
.cookie-notification .cookie-notification-copy {
  padding: 8px 5px 8px 15px;
  color: black !important;
  font-size: 14px !important;
}
.cookie-notification .dismiss-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  outline: none;
  overflow: hidden;
  text-indent: -9999px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  width: 40px;
  height: 40px;
  color: #8898aa;
  transition: color .15s;
  cursor: pointer
}
.cookie-notification .dismiss-button:after, .cookie-notification .dismiss-button:before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 40%;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transform: translate(-50%, -50%) rotate(45deg)
}
.cookie-notification .dismiss-button:after {
  transform: translate(-50%, -50%) rotate(-45deg)
}
.cookie-notification .dismiss-button:hover {
  color: #32325d;
}




.border-button {
position:relative;
display:inline-block;
width:150px;
height:30px;
background-color:#d9f0e6;
line-height:29px;
color:#35495e;
font-family:'arial';
text-align:center;
text-decoration:none;
cursor: pointer;
border-radius: 4px;
overflow:hidden;
margin-right:20px;
}
.border-button:after {
position:absolute;
display:block;
content:"";
width:100%;
height:1px;
background-color:#42b883;
transform:scale3d(0,1,1);
transform-origin:left;
transition:transform .3s;
}
.border-button:hover:after {
transform:scale3d(1,1,1);
}
.border-button:hover,
.border-button:hover span{
color: black;
}


.sign_documents {
  max-width: 100%;
}

/* COPY INPUT BUTTON */
.copy-button__button {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: auto;
  display: flex;
  align-items: center;
  background-image: none;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  font-size: inherit;
  color: inherit;
  cursor: pointer;
  padding-top: 5px;
  border-radius: 4px;
  
}

svg.bi.bi-copy,
svg.checkbox__icon,
svg.bi.bi-x-lg {
  width: 16px;
  height: 16px;
  fill: currentcolor;
}

.transitioning {
  opacity: 1;
  transition: 0.1s opacity;
}

.hide_copy_icon {
  visibility: hidden;
  opacity: 0;
  display: none;
}

svg.checkbox__icon {
  fill: green;
  stroke: green;
  color: green;
}

svg.bi.bi-x-lg {
  fill: red;
  stroke: red;
  color: red;
}


/* BOOTSTRAP GAPS */
.input-group-addon,
.input-group-btn,
.input-group .form-control {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
}

.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
  border-radius: 0;
}

.input-group-addon,
.input-group-btn {
  white-space: nowrap;
}

.input-group-addon {
  padding: 0.375rem 0.75rem;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  text-align: center;
  background-color: #e9ecef;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.input-group-addon.form-control-sm,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .input-group-addon.btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.2rem;
}

.input-group-addon.form-control-lg,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .input-group-addon.btn {
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  border-radius: 0.3rem;
}

.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
  margin-top: 0;
}

.input-group .form-control:not(:last-child),
.input-group-addon:not(:last-child),
.input-group-btn:not(:last-child) > .btn,
.input-group-btn:not(:last-child) > .btn-group > .btn,
.input-group-btn:not(:last-child) > .dropdown-toggle,
.input-group-btn:not(:first-child) > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group-addon:not(:last-child) {
  border-right: 0;
}

.input-group .form-control:not(:first-child),
.input-group-addon:not(:first-child),
.input-group-btn:not(:first-child) > .btn,
.input-group-btn:not(:first-child) > .btn-group > .btn,
.input-group-btn:not(:first-child) > .dropdown-toggle,
.input-group-btn:not(:last-child) > .btn:not(:first-child),
.input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.form-control + .input-group-addon:not(:first-child) {
  border-left: 0;
}