.container .navbar-brand{
    text-decoration: none;
}

#card_header{
    text-decoration: none;
}


.hide_header{
    display:none;
}

p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.extend{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 200;
    -webkit-box-orient: vertical;
}


.other_col{
    font: 400 1rem/1.625rem "Open Sans", sans-serif;
}

.center{
    align-items: center;
    margin:auto;
}

.right_side{
    align-items: right;
}

.circle_label{
    border-radius: 50%;
    background-color: #5f4dee;
	color: #fff;
}

.stars{
    margin-right:2px;
    color:#ffc800;
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 2px solid rgba(0, 0, 0, 0.1);
}

a{
    text-decoration: none;
}

.bluer{
    color:blue;
}

.bluer:hover{
    color:#5f4dee;
}

.text{
    font-size: 2rem;
    font-weight: bold;
}

.text_hide{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #5f4dee;
}

.text_cursor{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: transparent;
    border-left: 3px solid #fcba03;
}

.btn-outlinez {
	display: inline-block;
	padding:  1.25rem 1rem 1.25rem 1rem;
    margin: 0rem 0.5rem;
	border: 0.125rem solid #fff;
	border-radius: 2rem;
	background-color: transparent;
	color: #fff;
	font: 700 0.875rem/0 "Open Sans", sans-serif;
	text-decoration: none;
	transition: all 0.2s;
}

.btn-outlinez:hover {
	background-color: #fff;
	color: #5f4dee;
	text-decoration: none;
}

#msform {
    text-align: center;
    position: relative;
    margin-top: 20px
}

#msform fieldset {
    background: white;
    border: 0 none;
    border-radius: 0.5rem;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding-bottom: 20px;
    position: relative
}

.form-card {
    text-align: left
}

#msform fieldset:not(:first-of-type) {
    display: none
}

#msform input,
#msform textarea {
    padding: 8px 15px 8px 15px;
    border: 1px solid #ccc;
    border-radius: 0px;
    margin-bottom: 25px;
    margin-top: 2px;
    width: 100%;
    box-sizing: border-box;
    font-family: montserrat;
    color: #2C3E50;
    background-color: #ECEFF1;
    font-size: 16px;
    letter-spacing: 1px
}

#msform input:focus,
#msform textarea:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid #673AB7;
    outline-width: 0
}

#msform .action-button {
    width: 100px;
    background: #673AB7;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 0px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 0px 10px 5px;
    float: right
}

#msform .action-button:hover,
#msform .action-button:focus {
    background-color: #311B92
}

#msform .action-button-previous {
    width: 100px;
    background: #616161;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 0px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px 10px 0px;
    float: right
}

#msform .action-button-previous:hover,
#msform .action-button-previous:focus {
    background-color: #000000
}


.fs-title {
    font-size: 25px;
    color: #673AB7;
    margin-bottom: 15px;
    font-weight: normal;
    text-align: left
}

.purple-text {
    color: #673AB7;
    font-weight: normal
}

.steps {
    font-size: 25px;
    color: gray;
    margin-bottom: 10px;
    font-weight: normal;
    text-align: right
}

.fieldlabels {
    color: gray;
    text-align: left
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: lightgrey
}

#progressbar .active {
    color: #673AB7
}

#progressbar li {
    list-style-type: none;
    font-size: 15px;
    width: 25%;
    float: left;
    position: relative;
    font-weight: 400
}

#progressbar #account:before {
    font-family: FontAwesome;
    content: "\f13e"
}

#progressbar #personal:before {
    font-family: FontAwesome;
    content: "\f007"
}

#progressbar #payment:before {
    font-family: FontAwesome;
    content: "\f030"
}

#progressbar #confirm:before {
    font-family: FontAwesome;
    content: "\f00c"
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 20px;
    color: #ffffff;
    background: lightgray;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px
}

#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: lightgray;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1
}

#progressbar li.active:before,
#progressbar li.active:after {
    background: #673AB7
}

.progress {
    height: 20px
}

.progress-bar {
    background-color: #673AB7
}

.fit-image {
    width: 100%;
    object-fit: cover
}

.pad-qoute{
    border:none;
}


  
  .radio-tile-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
    .input-container {
      position: relative;
      height:  auto;
      width:  auto;
      margin: 0.5rem;
    }
      
      .radio-button {
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        margin: 0;
        cursor: pointer;
      }
  
      .radio-tile {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        border: 2px solid #673AB7;
        border-radius: 5px;
        padding: 1rem;
        transition: transform 300ms ease;
      }
      .icon svg {
        fill: #673AB7;
        width: 3rem;
        height: 3rem;
      }
      .radio-tile-label {
        text-align: center;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: #673AB7;
      }
  
      .radio-button:checked + .radio-tile {
        background-color: #c7b6e4;
        border: 2px solid #673AB7;
        color: white;
        transform: scale(1.1, 1.1);
      }
      
      .fontz{
        font-family: Verdana, sans-serif;
      }

      .intl-tel-input {
        display: table-cell;
      }
      .intl-tel-input .selected-flag {
        z-index: 4;
      }
      .intl-tel-input .country-list {
        z-index: 5;
      }
      .input-group .intl-tel-input .form-control {
        border-top-left-radius: 4px;
        border-top-right-radius: 0;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 0;
      }

      .container2{
        max-width: 90rem;
        padding:auto;
        align-items:center;
      }

      .card2{
          border-top:0px;
          border-bottom:1px solid #bdbdbd;
          border-left:0px;
          border-right:0px;
          background: #fff;
      }
      .card2-header{
        border-top:0px;
        border-bottom:0px;
        border-left:0px;
        border-right:0px;
        background: #fff;
      }
      .card-body2{
          padding:0.5rem 0.5rem 1rem 2rem;
      }

      .come-in {
        transform: translateY(150px);
        animation: come-in 0.5s ease forwards;
      }
      .come-in:nth-child(odd) {
        animation-duration: 0.5s; /* So they look staggered */
      }
      
      @keyframes come-in {
        to { transform: translateY(0); }
      }

      .modal-content{
        background-color: #fff; /* For browsers that do not support gradients */
        background-image: linear-gradient(0deg, #fff,#fff,#fff,#fff, #fff,#fff, #fff, #5f4dee);
      }

      .change-mob {
        padding-left:11rem;
      }

      .change-mob2 {
        padding-left:3rem;
      }
     
      .backg-blue{
        background-color: #c3f5dd;
        padding:1rem 2rem 1rem 2rem;
        color:#6b6b6b;
      }

      .centered{
        width:10rem;
      }

      @media only screen and (max-width: 800px) {
        .change-mob {
            padding:1rem 1rem 1rem 1rem; 
        }
      }

      @media only screen and (max-width: 1400px) {
        .change-mob {
            padding:1rem 1rem 1rem 1rem; 
        }
      }

      @media only screen and (max-width: 1500px) {
        .change-mob {
            padding:1rem 1rem 1rem 1rem; 
        }
      }
