.lawn-card {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.6);
  transition: 0.3s;
  width: 40%;
  border-radius: 10px;
    background-color:#FFF;
}

.lawn-card:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.6);
}

.lawn-input {
    background-color:#F00;
}

.lawn-inner-container {
  position: relative;
  padding: 2px 40px;
}

.lawn-outer-container {
  padding: 25px 16px;
}

.lawn-badge {
  position: absolute;
  background-color:#FFF;
display:inline-block;
margin-top:-12px;
margin-left:-10px;
padding-left:8px;
padding-right:8px;
padding-top:3px;
padding-bottom:1px;
font-family: MyTestFont-Bold;
font-size: 12px;
color: #13193C;
letter-spacing: 0;
text-align:center
box-shadow: 0 10px 20px 0;
 rgba(0,0,0,0.30);
border-radius:50%;
 }


.lawn-image-container {
  position: relative;
  text-align: center;
  background-color: white;
}

.lawn-centered-text {
    font-family: MyTestFont-Bold;
    font-size: 25px;
    letter-spacing: 1px;
    color: #FFFFFF;
    line-height: 33px;

}

.lawn-centered-sub-text {
    font-family: MyTestFont-Regular;
    font-size: 14px;
    color: #FFFFFF;
    line-height: 24px;
}

.lawn-centered-image {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.lawn-round-large{
                  background: #EFF1F7;
                  border-radius: 0px 10px 10px 10px;
                  }



.lawn-form-btn,.lawn-form-button{
    border:none;
    display:inline-block;
    padding:16px 50px;
    vertical-align:middle;
    overflow:hidden;
    text-decoration:none;
    font-family: MyTestFont-Bold;
    font-size: 12px;
    color: #13193C;
    letter-spacing: 1px;
    text-align: center;
    line-height: 14px;
    color:inherit;
    background-color:inherit;
    cursor:pointer;
    white-space:nowrap
}

.main-page-btn{
    border:none;
    display:inline-block;
    padding:16px 50px;
    vertical-align:middle;
    overflow:hidden;

    text-decoration:none;
    font-family: MyTestFont-Bold;
    font-size: 12px;
    color: #13193C;
    letter-spacing: 1px;
    text-align: center;
    line-height: 14px;
    color:inherit;
    background-color:inherit;
    cursor:pointer;
    white-space:nowrap
    width:75%;margin:10px;font-weight: bold;
}


.lawn-form-btn:hover{
    box-shadow:0 16px 50px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)
}
.lawn-form-disabled,.lawn-form-btn:disabled,.lawn-form-button:disabled{
    cursor:not-allowed;
    opacity:0.3
}
.lawn-form-disabled *,:disabled *{
    pointer-events:none
}
.lawn-form-btn.lawn-form-disabled:hover,.lawn-form-btn:disabled:hover{
    box-shadow:none
}





.lawn-radio {
  display: block;
  position: relative;
  padding-left: 45px;
  margin-bottom: 15px;
  cursor: pointer;
  font-size: 15px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.lawn-radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}


/* Create a custom radio button */
.lawn-radio-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 35px;
  width: 35px;
background-color: var(--radioOuterElementColor);
border-radius: 0 30px 30px 30px;
}

/* On mouse-over, add a grey background color */
.lawn-radio:hover input ~ .lawn-radio-checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.lawn-radio input:checked ~ .lawn-radio-checkmark {
  background-color: var(--radioOuterElementColor);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.lawn-radio-checkmark:after {
  content: "";
  position: absolute;
  display: block;
	background: var(--radioOuterElementColor);
    box-shadow: 0 0 0 6px var(--radioUnselOuterColor);

}

/* Show the indicator (dot/circle) when checked */
.lawn-radio input:checked ~ .lawn-radio-checkmark:after {
  display: block;
	background: var(--radioSelInnerColor);
    box-shadow: 0 0 0 6px var(--radioSelOuterColor);

}

/* Style the indicator (dot/circle) */
.lawn-radio .lawn-radio-checkmark:after {
 	top: 13px;
	left: 13px;
	width: 7px;
	height: 7px;
	border-radius: 50%;

}

.lawn-check-container {
  display: block;
  position: relative;
  padding-left: 45px;
  margin-bottom: 11px;
  margin-top 20px;
  cursor: pointer;
  font-size: 15px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.lawn-check-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.lawn-check-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 34px;
  width: 34px;
  background-color: #fff;
  border: 10px solid var(--radioOuterElementColor);;
  border-radius: 0% 35% 35% 15%;
}

/* On mouse-over, add a grey background color */
.lawn-check-container:hover input ~ .lawn-check-checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.lawn-check-container input:checked ~ .lawn-check-checkmark {
  background-color: var(--radioSelOuterColor);
}

/* Create the checkmark/indicator (hidden when not checked) */
.lawn-check-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.lawn-check-container input:checked ~ .lawn-check-checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.lawn-check-container .lawn-check-checkmark:after {
  left: 4px;
  top: 2px;
  width: 5px;
  height: 8px;
  border: solid var(--radioSelInnerColor);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.lawn-icon-border{
    border:8px solid #fff!important;
  border-radius: 0% 50% 50% 50%;
    background:#fff;
background-clip:content-box;
}

.lawn_ul {
  padding-left:16px;
}

.conf_dark_text {
    font-family: MyTestFont-Medium;
    font-size: 14px;
    color: #13193C;
    letter-spacing: 0;
    line-height: 20px;
}

.conf_light_text {
    font-family: MyTestFont-Regular;
    font-size: 14px;
    color: #707590;
    letter-spacing: 0;
    line-height: 20px;
}

.conf_dark_text_li {
    font-family: MyTestFont-Medium;
    font-size: 14px;
    color: #13193C;
    letter-spacing: 0;
    line-height: 20px;
    padding-left: 12px;
}

.conf_container {
    padding: 0px 0px 10px 16px;
}

.msg_body_light_text {
    font-family: MyTestFont-Medium;
    font-size: 14px;
    color: #9FA2B2;
    letter-spacing: 0;
    line-height: 20px;
}

.msg_date_light_text {
    font-family: MyTestFont-Medium;
    font-size: 10px;
    color: #9FA2B2;
    letter-spacing: 0;
    line-height: 10px;
}

.button_text_dark {
    font-family: MyTestFont-Bold;
    font-size: 12px;
    color: #13193C;
    letter-spacing: 1px;
    text-align: center;
    line-height: 14px;
}

/*the container must be positioned relative:*/
.custom-select {
  position: relative;
  font-family: MyTestFont-Medium;
}

.custom-select select {
  display: none; /*hide original SELECT element:*/
}

.select-selected {
  background-color: #fff;
}

/*style the arrow inside the select element:*/
.select-selected:after {
  position: absolute;
  content: "";
  top: 22px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #000 transparent transparent transparent;
}

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/*style the items (options), including the selected item:*/
.select-items div,.select-selected {
  color: #13193C;
  border: 1px solid transparent;
  border-color: #E0E2ED;
  cursor: pointer;
  padding: 13px;
  user-select: none;
  margin-bottom:5px;
}

/*style items (options):*/
.select-items {
  position: absolute;
  background-color: #fff;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}