@font-face {
  font-family: 'Optima';
  src: url('../fonts/OptimaNovaLTPro-Bold.woff2') format('woff2'),
       url('../fonts/OptimaNovaLTPro-Bold.woff') format('woff'),
       url('../fonts/OptimaNovaLTPro-Bold.ttf') format('truetype'),
       url('../fonts/OptimaNovaLTPro-Bold.eot') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body{ font-family:verdana, helvetica, arial !important; background:#fff; color:#393939;}
.page-container{width:100%;}
.header{ background:#050505; height:80px;}
.logo{ padding:20px 0px 10px;}
.logo h1{ padding:0; margin:0; font-size:20px; color:#fff;}

.title-bar .title{  padding:0; margin:0; font-size:36px; color:#fff; padding:20px 10px; text-align:center; font-family: 'Open Sans'; font-weight:300; text-transform:uppercase;}
.content-container{ padding:20px 0px;}
.content-pane{background:#ededed; padding:0px; min-height:500px;}
.content-inner{ padding:0px 20px 20px;}
.rightside-bar{background:#ededed; padding:0px; min-height:500px;}
.rightside-bar-inner{ padding:0px 20px 20px;}
.rightside-bar-inner .media-body{ width:100%;}
.rightside-bar-inner h6{ line-height:20px; }
.rightside-bar-inner .total h3{ color:#557b24; padding:6px;}
div.radio:empty {
   display: none;
}
.form-horizontal .radio, .form-horizontal .checkbox{
	min-height:24px!important;
}
.form-horizontal .radio, .form-horizontal .checkbox, .form-horizontal .radio-inline, .form-horizontal .checkbox-inline{
	padding-top:0px !important;
}
.form-horizontal .control-label{
	padding-top:0px !important;
}
.content-container small{  font-size:12px;}
.content-container .block{ 
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #393939 -moz-use-text-color -moz-use-text-color;
    border-image: none;
    border-style: solid none none;
    border-width: 1px 0 0;
    margin-bottom: 20px;
    margin-top: 20px;
}
.help-block{
	display:inline;
	color:#F00;
}
.content-container .block h4{ padding:20px 0px; margin:0; }
.content-container .block p{ padding:0px 0px 10px 0px; margin:0; line-height:20px; font-size:12px; }
.content-container .title{padding:20px 20px; margin:0px 0px 20px 0px; font-size:20px; color:#fff; background:#86be3d; font-family: 'Open Sans'; font-weight:400;}
.content-container .btn-success{ background:#86be3d; border:0; border-radius:0; font-size:18px; padding: 20px 0;}
.content-container .btn-success:hover{background:#71a231; border:0;}

/* Form Styles*/
.content-container  .form-horizontal .control-label{ font-weight:600; font-size: 12px;}
.content-container  .form-group .radio label, 
.content-container  .form-group .checkbox label{font-size: 12px; }

.content-container  .form-group input,
.content-container  .form-group select, 
.content-container  .form-group textarea {  border:0; border-radius:0;font-size: 12px; color:#86be3d;}
.content-container  .form-group select{-moz-appearance: none !important; -webkit-appearance:none !important;}

.content-container  .form-group select.custom {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20fill%3D%22%23555555%22%20%0A%09%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%22-261%20145.2%2024%2024%22%20style%3D%22enable-background%3Anew%20-261%20145.2%2024%2024%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M-245.3%2C156.1l-3.6-6.5l-3.7%2C6.5%20M-252.7%2C159l3.7%2C6.5l3.6-6.5%22%2F%3E%0A%3C%2Fsvg%3E");
  padding-right: 25px;
  background-repeat: no-repeat;
  background-position: right center;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}


@media screen and (max-width: 767px) {
	.rightside-bar{ margin-top:20px;}
	
}

@media screen and (min-width: 768px) and (max-width: 980px){
	.rightside-bar-inner .media-body{ display:inline-block; margin-top:10px;}
	.content-container .form-horizontal .control-label {padding-bottom: 5px;}
}

/* NEW STYLES */

@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
  
body {
    background: #f4f4f4;
}

@media (min-width: 1200px) {
    .container {
        max-width: 1296px;
    }
}

.content-container {
    padding: 0 0 75px;
    margin-top: -250px;
}

.title-bar {
    position: relative;
    overflow: hidden;
}

.title-bar::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('../images/bkg.png') center center no-repeat;
  background-size: cover;
  background-position: center;
  transform: scaleX(-1);
  z-index: -1;
}

.title-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.404778) 21.18%, rgba(0, 0, 0, 0.643925) 41.64%, rgba(0, 0, 0, 0.7) 100%);
  z-index: -1;
}

.title-bar .title {
    padding: 178px 16px 303px;
    max-width: 690px;
    margin: 0 auto;
    margin-top: -80px;
}

.title-bar .title h1 {
  font-family: "Optima", Sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: -2px;
  color: #FFFFFF;
  text-transform: none;
  margin: 0;
  margin-bottom: 8px;
}

@media (max-width: 767px) {
    .title-bar .title h1 {
      font-size: 36px;
      line-height: 40px;
      margin-bottom: 18px;
    }
}

.title-bar .title p {
    font-family: "Archivo", sans-serif;
    font-weight: 300;
    font-size: 17px;
    line-height: 26px;
    letter-spacing: 0px;
    text-align: center;
    text-transform: none;
}

.form-horizontal {
    background: #fff;
    padding: 32px 24px 42px;
    box-shadow: 0px 4px 32px 0px #0000000F;
    border-top: 1px solid #E5E5E580;
    border-radius: 8px;
    display: flex;
    gap: 16px;
}

.form-horizontal fieldset {
    display: flex;
    gap: 16px;
    width: 100%;
    flex-direction: column;
}

.form-horizontal>fieldset {
    flex-direction: row;
}

[class*="col-"] {
    padding: 0;
}

.content-pane {
    display: flex;
    flex-direction: column;
}

.content-pane, .rightside-bar {
    background: #fff;
    border: 1px solid #E5E5E580;
    border-radius: 8px;
    overflow: hidden;
}

.rightside-bar-inner {
    padding: 0; 
}

.content-container .title {
    background: #364153;
    padding: 18px 20px;
    margin: 0;
}

.content-container .block {
    margin: 0;
    border: none;
    padding: 0 20px;
}

.content-container .block:not(:last-of-type) {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 20px;
    border-bottom: 1px solid rgb(57 57 57 / 50%);
}

.content-container .block:first-child .ng-scope {
    display: flex;
    align-items: center;
    gap: 16px;
}

.content-container .block:first-child .ng-scope img {
    width: 68px;
    height: 68px;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0px 4px 6px -4px rgb(0 0 0 / 90%);
}

.content-container .block h4 {
    padding: 0;
    font-size: 16px;
    line-height: 24px; 
    margin-bottom: 12px;
}

.content-container .block p {
    padding: 0;
    color: #364153;
    font-size: 14px;
}

.content-container .block p:first-child {
    color: #666666;
    font-weight: 400;
} 

.content-container .block.total {
    padding: 20px;
    padding-bottom: 0;
    border: none;
}

.content-container .block.total > span {
    display: block;
    width: 100%;
    text-align: center;
    font-weight: 400;
    color: #666666;
}

.rightside-bar-inner .total h3 {
    height: 40px;
    padding: 0 16px;
    display: flex;
    justify-content: space-between; 
    align-items: center;
    border: none;
    border-radius: 8px;
    background: #f5f5f5;
    box-shadow: none;
    margin: 0;
    margin-bottom: 12px;
}

h3 span.titles,
h3 span.price {
    font-size: 16px;
    line-height: 24px;
}

.content-container .btn-success {
    margin: 20px;
    margin-top: 20px;
    border-radius: 8px;
    font-size: 16px;
    width: -webkit-fill-available;
    line-height: 56px;
    padding: 0;
}

.content-container small {
    font-size: 14px;
    line-height: 20px;
    color: #666666;
}

.form-group {
    margin: 0;
    margin-top: 24px;
    display: flex;
    gap: 24px;
}

.form-horizontal .radio,
.form-horizontal .checkbox {
    min-height: unset !important;
    margin-bottom: 8px;
}

.radio label::before {
    width: 18px;
    height: 18px;
    border: 2px solid #cccccc;
}

.radio label::after {
    width: 10px;
    height: 10px;
    left: 4px;
    top: 4px;
}

.radio-success input[type="radio"]:checked + label::after {
    background-color: #86BE3D;
}

.radio-success input[type="radio"]:checked + label::before {
    border-color: #86BE3D;
}

.content-container .form-group div:not(.col-md-5) input, 
.content-container .form-group div:not(.col-md-5) .form-group select, 
.content-container .form-group div:not(.col-md-5) .form-group textarea {
    width: 18px;
    height: 18px;
    margin-top: 0px;
}

.content-container .form-horizontal .control-label {
    font-weight: 500;
    font-size: 14px;
    color: #364153;
    margin-top: -2px;
    text-align: left;
}

.iconq svg { display: none; }

.iconq {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
}

.iconq::before {
    background-color: #86BE3D;
    color: #86BE3D;
    content: '';
    display: inline-block;
    mask-position: 50% 50%;
    mask-repeat: no-repeat;
    mask-size: 20px;
    text-align: center;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6"><path stroke-linecap="round" stroke-linejoin="round" d="m11.25 11.25.041-.02a.75.75 0 0 1 1.063.852l-.708 2.836a.75.75 0 0 0 1.063.853l.041-.021M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9-3.75h.008v.008H12V8.25Z" /></svg>');
    margin-top: -12px;
}

.modal-header {
    border-bottom: 0;
    background: #364153;
    padding: 0 24px;
    min-height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row-reverse;
}

.modal-title {
    color: #fff; 
    margin-right: auto;
}

.modal-content {
    border-radius: 10px;
    overflow: hidden;
}

.close {
    box-shadow: none;
    opacity: 1;
    color: #fff;
}

.close:hover {
    opacity: .6;
    color: #fff;
}

.modal-body {
    padding: 24px;
}
    
@media (max-width: 992px) {
    .content-container .block .ng-scope {
        display: flex;
        flex-direction: column;
        align-items: flex-start;            
    }
    
    .content-container .block:first-child .ng-scope {
        align-items: flex-start;
    }
    
    .rightside-bar-inner .total h3 {
        padding: 10px;
        display: flex;
        flex-direction: column;
        height: auto;
        align-items: flex-start;
    }
    
    .rightside-bar-inner .total h3 span {
        width: 100%;
        text-align: left;
    }
    
    .form-group .col-md-4 {
        flex: 27% 0 1;
        text-align: right;
        display: flex;
        justify-content: flex-end;
        gap: 4px;
    }
    
    .form-group .col-md-8 {
        flex: 1;
    }
    
    .content-pane > fieldset .content-inner .form-group {
        width: calc(100% - 20px) !important;
    }
    
    .content-pane > fieldset .content-inner .form-group .col-md-4 {
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .title-bar .title {
        padding: 120px 16px 155px;
    }
    
    .content-container {
        margin-top: -120px;
    }
    
    .form-horizontal {
        padding: 24px 16px;
        margin: 0 24px;
    }
    
    .form-horizontal fieldset {
        flex-direction: column;
    }
    
    .form-horizontal fieldset > .col-sm-8,
    .form-horizontal fieldset > .col-sm-4 {
        width: 100%;
    }
    
    .form-horizontal {
        flex-direction: column;   
    }
}

.content-pane > fieldset .content-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-right: 0;
}

.content-pane > fieldset .content-inner .form-group {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;        
    gap: 0;
    margin: 0;
    width: calc(50% - 20px);
    justify-content: flex-start;
    margin-bottom: 20px;
    margin-right: 20px;
}

.content-pane > fieldset .content-inner .form-group:nth-child(1) {
    width: calc(100% - 20px);
}

.content-pane > fieldset .content-inner .form-group:nth-child(6),
  .content-pane > fieldset .content-inner .form-group:nth-child(7),
  .content-pane > fieldset .content-inner .form-group:nth-child(8) {
      width: calc(33.33% - 20px);
}

.content-pane > fieldset .content-inner .form-group > div,
.content-pane > fieldset .content-inner .form-group > label{
    width: 100% !important;
}

.content-pane > fieldset .content-inner .form-group:nth-child(5) {
    margin-top: auto;
}

.content-container .form-horizontal .control-label {
    font-size: 13px;
    line-height: 20px;
    font-weight: 500;
    color: #27272A;
    margin-bottom: 8px;
}

.help-block {
    font-size: 13px;
    line-height: 20px;
    margin: 0;
}

.content-container .form-group div.col-md-5 input, 
.content-container .form-group div.col-md-5 .form-group select, 
.content-container .form-group div.col-md-5 .form-group textarea,
.content-container .form-group select.custom{
    border: 1px solid #E5E5E5;
    border-radius: 10px;
    height: 52px;
    background: #F3F3F5;
    box-shadow: none;
    font-size: 16px;
    font-weight: 400;
    color: #717182;
    font-family: "Inter", sans-serif;
}

.paylogo {
    margin: 0;
    display: flex;
    flex-direction: column-reverse;
    gap: 8px;
    align-items: flex-start;
}