/* ========================
BASE
======================== */

html {scroll-behavior: smooth}
body, html {font-family: "Montserrat", sans-serif; height: 100vh}
h1,h2,h3,h4,h5,h6 {font-family: "Montserrat", sans-serif}

/* Links */
a, .btn.btn-link {color: #0069AA; text-decoration: none;}
a:hover {color: #0069AA; text-decoration: underline;}
a.btn:hover {text-decoration:none;}
.btn.btn-link:hover {color: #0069AA; text-decoration: none;}

/* Form */
form input[type='text'], form input[type='tel'], form .form-control, form .form-select {
  outline: none; background-color: #ffffff; width: 100%; padding: .7em 1.5em; border: 2px solid rgba(220, 220, 220, 1); border-radius: 5px;
}
form input[type='file'] {
  outline: none; background-color: #ffffff; width: 100%; padding: .7em 1.5em; border: 2px solid rgba(220, 220, 220, 1); border-radius: 5px;
}
form textarea {
  outline: none; background-color: #ffffff; width: 100%; margin: 15px 0; padding: .7em 1.5em; border: 2px solid rgba(220, 220, 220, 1); border-radius: 5px;
}
.input-group-text {border-top: 2px solid rgba(220, 220, 220, 1);border-bottom: 2px solid rgba(220, 220, 220, 1);border-left: 2px solid rgba(220, 220, 220, 1); background-color: #f3f3f3}
.input-group .form-control {border-bottom-right-radius: 5px; border-top-right-radius: 5px}

/* Form > Checks and Radios */
.form-check-input {border-color: #aaaaaa; border-width: 2px}
.form-check-input:checked {background-color:#1C99D0 ; border-color: #1C99D0}

/* Form > Radios and Checks - Save For ref
.form-check-input:checked[type=radio] {background-image: url(/colors-155896_640.png);background-color: aquamarine;border-color: aquamarine;}
.form-check-input:focus[type=radio] {box-shadow: 0 0 4px 4px aquamarine}
.form-check-input:checked[type=checkbox]{background-image: url(/bootstrap.jpeg);}
.form-check-input:focus[type=checkbox] {box-shadow: 0 0 4px 4px violet;}
.form-check-input:focus {box-shadow: 0 0 4px 4px #efefef}
*/

/* Form > File Upload */
input[type="file"]::file-selector-button {border-radius: 5px; padding: 0 1em; height: 40px; cursor: pointer; background-color: #FBFCFC; border: 2px solid rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.05); margin-right: 1em; transition: background-color 200ms; font-weight: 500}
input[type="file"]::file-selector-button:hover {background-color: #f3f4f6;}
input[type="file"]::file-selector-button:active {background-color: #e5e7eb;}

/* Validation - Label */
.req {color:#CC0000; font-weight: 700}
label {display:block}
label.error {margin:3px 0 0 0; padding:0;width:auto;display:block;color:#CC0000;font-weight:400;font-size:.8em}
div.error {display: none;}
input.error, select.error, textarea.error {border: 1px solid #CC0000 !important; background-color:#FFECEC;}

/* Buttons */
.btn {border-radius:5px; padding: .65em 1.25em; border: none; outline: none; font-weight: 700}
.btn.btn-blue[disabled], .btn.btn-lightblue[disabled] {background-color: #eeeeee; color: #777777;}
.btn-blue {background: #13384F; color:#ffffff; border: none; outline: none}
.btn-blue:hover,.btn-blue:focus,.btn-blue:active {background: #199CD8 !important; color:#ffffff !important;}
.btn-lightblue {background: #199CD8; color:#ffffff}
.btn-lightblue:hover,.btn-lightblue:focus,.btn-lightblue:active {background: #13384F !important; color:#ffffff !important;}
.btn-outline-danger {border: 1px solid; outline: none}

/* Modals */
.modal .modal-header {background-color: #ffffff; padding: .75em 1em; border-color:transparent}
.modal .modal-header h2 {font-weight: 400; font-size: 1.75rem; margin-bottom: 0}

/* ========================
NAVBAR > MAIN
======================== */

.navbar {padding: 1.5rem .5em; background-color:#ffffff; transition: all 0.2s; box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.15);}
.navbar .navbar-toggler, #navbar-main .navbar-toggler-icon,
.navbar .navbar-toggler:focus,
.navbar .navbar-toggler:active,
.navbar .navbar-toggler-icon:focus {outline: none !important; box-shadow: none !important; border: none !important;}
.navbar .navbar-toggler-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}

.navbar .navbar-brand img {max-width: 250px;}
.navbar .nav-item {margin-right: 1.75em}
.navbar .nav-item:nth-child(3) {margin-right:0em}
.navbar .nav-link {font-size: 1.25rem; color: #13384F; font-weight: 600; text-decoration: none}

.offcanvas-header img {max-width: 150px;}
  
/* Application Only */
.navbar.navbar-app {padding: 1.5rem .5em; background-color:#ffffff; box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.15); transition: all 0.2s;}
.navbar.navbar-app .navbar-brand img {max-width: 250px;}
.navbar.navbar-app h1 {font-size: 2rem; color: #13384F; font-weight: 400; margin-bottom: 0;}

/* Underline */
.navbar .nav-item a {display: inline-block; position: relative; border-bottom: 0px;}
/* .navbar .nav-item:hover a:after {content: ''; position: absolute; left: 0; display: inline-block; height: 1.7em; width: 100%; border-bottom: 4px solid #1799CE;  margin-top: 10px; transition: border-bottom 2s ease} */

#navbar-main .navbar-nav .nav-item {position: relative;}
#navbar-main .navbar-nav .nav-item:after {content: '';position: absolute;top: 100%;left: 0;width: 100%;height: 3px;background: #7BA640;opacity: 0;-webkit-transform: translateY(-10px);-ms-transform: translateY(-10px);transform: translateY(-10px);-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;transition: height 0.3s, opacity 0.3s, transform 0.3s;}
#navbar-main .navbar-nav .nav-item:hover:after,
#navbar-main .navbar-nav .nav-item:focus:after,
#navbar-main .navbar-nav .nav-item.active:after {height: 3px;opacity: 1;-webkit-transform: translateY(0px);-ms-transform: translateY(0px);transform: translateY(0px);-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;transition: height 0.3s, opacity 0.3s, transform 0.3s;}

@media screen and (max-width:768px) {
  .navbar .navbar-brand img {max-width: 250px;}
  .navbar.navbar-app h1 {font-size: 1.25rem;}
}
@media screen and (max-width:576px) {
  .navbar .navbar-brand img {max-width: 150px;}
  .navbar.navbar-app .navbar-brand img {max-width: 150px;}
}
@media screen and (max-width:420px) {
  .navbar.navbar-app .navbar-brand {width: 100%; text-align: center; margin-bottom: .5em}
  .navbar.navbar-app .navbar-brand img {max-width: 150px;}
  .navbar.navbar-app h1 {width:100%; font-size: 1.1rem; font-weight: 600; text-align:center}
}

/* ========================
PAGE HEADER
======================== */

.page-header {padding-top: 10em; padding-bottom: 10em; background-size: cover; text-align: center; background: linear-gradient(rgba(47,144,197,0.80), rgba(0,0,0,0.50)), url("../img/header-bg.jpg") center center no-repeat;}
.page-header h1 {font-size: 5rem; font-weight: 700; color: #ffffff; line-height: 1;}
.page-header h3 {margin-bottom: 46px;color: #ffffff;}
.page-header .text-container {margin-bottom: 7rem;}

@media (max-width: 576px) {
  .page-header {padding-top: 4em; padding-bottom: 4em; background-size: cover}
  .page-header h1 {font-size: 1.75rem;}
}

/* ========================
CONTENT
======================== */

#main-content {background:#ffffff;}
#main-content-container {padding-top: 2em; padding-bottom: 2em;}

/* Application */
#main-content-application {background:#efefef;}
#main-content-application-container {padding-top: 4em; padding-bottom: 3em;}

@media (max-width: 576px) {
  #main-content-container {padding-top: 2em; padding-bottom: 2em;}
  #main-content-application-container {padding-top: 2em; padding-bottom: 2em;}
}
  
/* ========================================
HOME > HERO
===========================================*/

#home-hero {display: flex; min-height:550px; background: linear-gradient(rgba(47,144,197,0.80), rgba(0,0,0,0.50)), url("../img/hero-bg.jpg");background-position: center; background-size:cover;}
#home-hero .container {margin: auto}
#home-hero h1 {font-size: 3rem; color: #ffffff; font-weight: 400; line-height: 1.2; text-align: center; max-width: 1100px; margin-left: auto; margin-right: auto;}

@media screen and (max-width:576px) {
  #home-hero {min-height:10px; height: auto; padding: 4em 1em 4em 1em;}
  #home-hero h1 {font-size: 1.75rem; text-align: center;}
  /* #home-hero h2 {font-size: 1.25rem; color: #ffffff; text-align: center;} */
}
  
/* ========================================
SERVICES
===========================================*/
  
#home-process {padding:4em .5em; background: linear-gradient(to bottom, #ffffff, #ffffff); box-shadow: 0 0 #b1b1b1, 0 0 #a5a5a5, 0 10px 9px -3px rgb(159 159 159 / 38%), 0 4px 6px -2px rgba(0, 0, 0, .05);}
#home-process h2 {color: #13384F; font-size: 2.5rem; font-weight: 700; margin-bottom: .75em; text-align: center}
#home-process h3 {color: #13384F; font-size: 1.35em; font-weight: 700; display: flex; min-height: 46px; justify-content: center; align-items: center; margin-bottom: 1em;}
#home-process .card {border: 0;background-color: transparent; margin-bottom: 3.5em}
#home-process .card-body {padding: 0; text-align: center;}
#home-process .card-body .icon {margin-bottom:.2em; color: #548CC9; font-size: 6rem;}
#home-process .card-body .icon img {max-width: 175px; height: auto}
#home-process .card-text {color: #13384F; font-size: 1.25rem}
  
@media (max-width: 576px) {
  #home-process {padding:2em 1em 1em 1em}
  #home-process h2 {font-size: 2rem}
  #home-process h3 {font-size: 1.25em;}
  #home-process .card-text {color: #13384F; font-size: 1rem}
  #home-process .card-body .icon {margin-bottom:0}
  #home-process .card-body .icon img {max-width: 100px; height: auto}
}
  
/* ========================================
ABOUT
===========================================*/

#home-about {padding:6em .5em; border-bottom: 0px solid #114B89; border-top: 0px solid #114B89; background: linear-gradient(rgba(221,235,243,.97), rgba(221,235,243,.97)), url("../img/aboutus-bg.jpg") center no-repeat fixed; background-size: cover; text-align: center}
#home-about h2 {text-align: center; font-weight: 700; font-size: 2.5rem; line-height: 1.5; color: #13384F; margin-bottom:1.75em}
#home-about p {text-align: center; font-weight: 400; font-size: 1.25rem; line-height: 1.6; color: #13384F; max-width: 900px; margin: auto}
  
@media (max-width: 992px) {
  #home-about {margin-top:0}
}

@media (max-width: 576px) {
  #home-about {padding:4em .5em;background: linear-gradient(rgba(221,235,243,1), rgba(221,235,243,1)), url("../img/aboutus-bg.jpg") center no-repeat fixed;}
  #home-about h2 {font-size: 2rem}
  #home-about p {font-size: 1rem}
}
  
    /* ========================================
SERVICES
===========================================*/

#home-services {padding:4em .5em; background: #ffffff; border-bottom: 1px solid #efefef}
#home-services h2 {text-align: center; font-weight: 700; font-size: 2.5rem; margin-bottom: 0; line-height: 1.5;color: #13384F;}
  
#home-services .service-box {padding: 2em; box-shadow: 0 0 30px rgba(31, 45, 61, 0.125); background-color: #ffffff; margin: 3em 0 1em 0; position: relative; z-index: 1; border-radius: 10px; overflow: hidden; top: 0; height: auto; transition: ease all 0.35s;}
#home-services .service-box * {transition: ease all 0.35s;}
#home-services .service-box.card {border:none;}
#home-services .service-box.card .card-body {min-height: 660px}
#home-services .service-box.card .card-footer {background: none; border: none}
#home-services .service-box .icon {background: #fff; color: #ffffff; text-align: center; margin: 0 auto .75em auto}
#home-services .service-box .icon img {max-width: 125px; height: auto}
#home-services .service-box h4 {color: #003946; font-weight: 700; font-size: 1.35rem; text-align: center; margin-bottom: 1em}
#home-services .service-box h4 .price {display: block; font-weight: 700; color: #7BA300; margin-top: .25em}
#home-services .service-box h4 .price span {color: #13384F; font-size: .9rem !important}

#home-services .service-box p {margin: 0; color: #13384F;}
#home-services .service-box ul {color: #13384F;}
#home-services .service-box:hover {top: -5px;}
#home-services .service-box:hover:after {width: 100%; height: 100%; border-radius: 10px; left: 0; right: auto;}
#home-services .service-box .service-content ul {height: auto;}

@media (max-width: 1400px) {
  #home-services .service-box.card .card-body {min-height: 600px}  
}
@media (max-width: 1200px) {
  #home-services .service-box.card .card-body {min-height: 650px}  
}
@media (max-width: 992px) {
  #home-services .service-box {height: auto; padding: 1em}
  #home-services .service-box.card .card-body {min-height: inherit}
  #home-services .service-box .icon img {max-width: 100px; height: auto}
}
@media (max-width: 576px) {
  #home-services h2 {font-size: 2rem; line-height: 1.2}
  #home-services .service-box .icon img {max-width: 75px; height: auto}
}
  
/* ========================================
START NOW
===========================================*/

#home-start {padding:6em .5em; border-bottom: 1px solid #efefef; background: linear-gradient(rgba(24,102,144,0.90), rgba(0,0,0,0.70)), url("../img/start-bg.jpg") center no-repeat fixed;  background-size: cover; text-align: center}
#home-start p {text-align: center; font-weight: 400; font-size: 1.4rem; line-height: 1.5; color: #ffffff; margin-bottom:1.75em}
#home-start .btn {font-size: 1.25rem}
  
@media (max-width: 576px) {
  #home-start p {font-size: 1rem}
}
  
/* ========================================
FAQS
===========================================*/

#home-faq {padding:5em .5em; background: #ffffff; border-bottom: 1px solid #efefef}
#home-faq h2 {text-align: center; color: #13384F; font-weight: 700; font-size: 2.5rem; margin-bottom: 1em; line-height: 1}

@media (max-width: 576px) {
  #home-faq h2 {font-size: 2rem}
}

/* ========================================
FAQS > ACCORDION
===========================================*/

#accordion-faq {border: none}
#accordion-faq .accordion-item {margin-bottom: 1px; transition: box-shadow .3s ease-in-out; border: none}
#accordion-faq .accordion-item:last-of-type {margin-bottom: 0em;}
#accordion-faq .accordion-item .accordion-button {font-weight: 500; font-size: 1.25rem; border-bottom: 1px solid #ccc; background: #ffffff; color: #13384F;}
#accordion-faq .accordion-item:last-of-type .accordion-button {border-bottom: 0px}
#accordion-faq .accordion-item .accordion-button:not(.collapsed) {background: #fefefe; color: #0069AA; font-weight: 700; border-bottom: 0px solid #ccc;}
#accordion-faq .accordion-item .accordion-button:focus {box-shadow:none}
#accordion-faq .accordion-item .accordion-button:after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
#accordion-faq .accordion-item .accordion-button:not(.collapsed):after{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='green'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

#accordion-faq .accordion-item .accordion-body {background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 100%); background: rgba(255,255,255,1.00)}
#accordion-faq .accordion-item .accordion-body ul {margin-left: 1.6rem; margin-bottom: 0}

@media screen and (max-width:576px) {
  #accordion-faq .accordion-item .accordion-button {font-weight: 400; font-size: 1.15rem}
}

/* ========================================
CONTACT
===========================================*/

#contact-us {padding:1em .5em; background: #ffffff}
#contact-us h2 {margin-bottom: .5em}
  
/* Contact Info */
#contact-us .contact-info {background: linear-gradient(to bottom right, #ffffff, #ffffff); padding: 1.5em 3em; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 10px; color: #000; box-shadow: 0 0 20px rgba(31, 45, 61, 0.08);}
#contact-us .contact-form .form-label {font-weight: 700}
#contact-us .contact-info h3 {font-weight:500; margin-bottom: .75em; font-size: 1.75rem}
#contact-us .contact-info h4 {font-weight:500; margin-bottom: .75em; font-size: 1.25rem}
#contact-us .contact-info a {text-decoration: none; color: #000;}
#contact-us .contact-info a:hover {text-decoration: underline; color: #000;}

@media (max-width: 576px) {
  #contact-us .contact-info {padding: 1.25em 1.25em}
  #contact-us h2 {font-size: 2rem}
  #contact-us .contact-info h3 {font-size: 1.5rem}
  #contact-us .contact-info h4 {font-size: 1rem}
}

/* ========================
APPLICATION > STEPS}
======================== */
#app-steps {margin: 0em 1em 1.75em 1em}
#app-steps .container {max-width: 950px; padding: 0; margin: 0}
#app-steps .number {display: inline-block; border-radius: 50px; background:#ccc; padding: 3px 0px 3px 3px; color: #fff; width: 45px; height: 45px; font-size: 1.25rem; border: 3px solid #fff; box-shadow: 2px 2px 5px 1px rgba(0,0,0,.2); margin-right:1em;font-weight: 400; line-height: 1; align-content: center}
#app-steps .text {display: inline-block; font-size: 1.2rem; color: #999; line-height: 1}
#app-steps .active .number {background:#269ED8; color: #fff; font-weight: 700}
#app-steps .active .text {color: #000000; font-weight: 700}

@media screen and (max-width:576px) {
  #app-steps {margin: 0em 0 1.75em 0}
  #app-steps .number {display: block; border-radius: 50px; background:#999; padding: 3px 0px 3px 3px; color: #fff; width: 35px; height: 35px; font-size: 1rem; 
  font-weight: 700; margin: 0 auto .5em auto; line-height: 1}
  #app-steps .text {display: inline-block; font-size: .9rem; color: #999; line-height: 1} 
}

/* ========================
APPLICATION > FORM
======================== */

#application {border: 1px solid #999; border-radius: 10px; background: #ffffff; padding: 2em; box-shadow: 2px 2px 5px 1px rgba(0,0,0,.2);}

#application .card {border: 0px solid #999; margin-bottom: 1.25em; box-shadow: 2px 2px 5px 1px rgba(0,0,0,0);}
#application .card-header {font-weight: 400; font-size: 1rem; background-color: #ffffff; padding: 0; border-color: #004C7C;}
#application .card-header h2.header-text {display: inline-block; min-width: 250px; padding: .25em 1em; font-weight: 600; font-size: 1.05rem; border-top-left-radius:5px; border-top-right-radius: 5px; background: #000; background: #004C7C; color:#ffffff; color:#fff; text-align: center; margin-bottom: 0}

/* Section Titles */
#application .section-heading {padding: .5em .25em; margin: .25em 0 .25em 0; background-color: #fff; color: #555555; font-weight: 400; border-radius: 5px; font-size: 1.25rem}

/* Labels and Buttons */
#application form label {font-weight: 700}
#application form .form-check-label {font-weight: 400 !important;}
#application form button.removeButton {display: block; margin-left: auto; margin-right: auto; margin-bottom: 1em}

/* Terms */
#application .terms {height: 150px; font-size: .9em; line-height: 1.2; border-radius: 8px; text-align: justify; overflow:auto}

/* Owner > Note */
#application .note-owner {line-height: 1.5; border-left: 4px solid #ff7600; padding-left: 1em; margin-bottom: 1.5em}
#application .note-owner strong {font-size: .85em;font-weight: 700;color: #ff7600}
#application .note-owner .txt {font-size: .85em;font-weight: 500;color: #000;text-align: justify;}

/* Owner Info */
#application .owner-info {border: 2px solid rgba(220, 220, 220, 1); background: #fbfbfb; padding: 1em; border-radius: 5px; margin-bottom: 1.5em}

/* Essential > Reg Agent */
#application #RegAgentAddress_Add {display:none}

@media screen and (max-width:576px) {
  #application {padding: 1em;}
}

/* ========================
APPLICATION > PAYMENT > ICONS
======================== */
  
#application #payment-form .cc-icons {text-align: center; margin-top: 1em ; margin-bottom: 1.5em}
#application #payment-form .cc-icons img {max-width: 300px;}
  
@media screen and (max-width:576px) {
  #application #payment-form .cc-icons img {max-width: 200px;}
}
  
/* ========================
APPLICATION > ORDER SUMMARY
======================== */
  
#application #order-summary .card {border: 1px solid #dddddd; margin-bottom: 1.25em; box-shadow: 2px 2px 5px 1px rgba(0,0,0,.1);}
#application #order-summary .card-header {background-color: #fafafa; padding: .75em 1em; border-color:transparent}
#application #order-summary .card-header h2 {font-weight: 600; font-size: 1.25rem; margin-bottom: 0; color: #13384F}
#application #order-summary .card-body {padding: 1em 2em 2em 2em}
#application #order-summary .service {display: flex; justify-content: space-between; margin-bottom: 0em; border-bottom: 0px dotted #aaa; padding-top: .5em; padding-bottom: .5em;}
#application #order-summary .service .name {font-size: 1rem;font-weight: 400;color: #13384F;}
#application #order-summary .service .amount {font-size: 1rem;font-weight: 500; color: #13384F;}
#application #order-summary .service-total {margin-top: .5em; margin-bottom: 1em; border-bottom: 0px dotted #aaa;}
#application #order-summary .service-total .total, 
#application #order-summary .service-total .total-amount {color: #13384F; font-weight: 700; font-size: 1.2rem}

#application #order-summary .service-sub-item {display: flex; justify-content: space-between; padding-top: .5em; padding-bottom: .5em;}
#application #order-summary .service-sub-item .name {margin: auto 1em; font-size: .8rem;font-weight: 400;color: #13384F;}
#application #order-summary .service-sub-item .amount {margin: auto 1em; font-size: .8rem;font-weight: 400; color: #13384F;}

#application #order-summary .item-div-line {width: 100%;height: 2px;border-bottom: 1px dotted #aaaaaa; margin: .25em auto}

@media screen and (max-width:576px) {
  #application #order-summary .service .name {font-size: .85rem}
  #application #order-summary .service .amount {font-size: .85rem}
  #application #order-summary .service-total .total-amount {font-size: 1.2rem}
}

/* ========================
APPLICATION > PAYMENT SUCCESS
======================== */

#payment-confirm-content {max-width: 700px; margin: auto; padding: 1em .5em;}
#payment-confirm-content .icon {margin-bottom: .5em;}
#payment-confirm-content .icon i {font-size: 4rem;color: #199CD8;}
#payment-confirm-content .title {font-size: 1.75rem; font-weight: 700; color: #13384F;}
#payment-confirm-content .txt {font-size: 1em; margin-bottom: .25em;font-weight: 400;color: #13384F;}

/* Payment > Amount Paid */
#payment-confirm-content .amount-paid .amount-total {font-size: 2.25rem; font-weight: 700; color: #199CD8; text-align: center; margin: .5em 0 .01em 0}
#payment-confirm-content .amount-paid .amount-title {font-size: .9em; font-weight: 700; color: #13384F;text-align: center; margin-bottom: 1.25em}

/* Payment > Details */
#payment-confirm-content .payment-details-title {font-size: 1rem; font-weight: 700; color: #13384F; margin-bottom: 1em;}
#payment-confirm-content .payment-details .item {font-size: 1rem; color: #000000; font-weight: 400; margin-bottom: .75em; display: flex; justify-content: space-between;}
#payment-confirm-content .payment-details .item.item-border {border-top: 1px solid #ced4da; border-bottom: 1px solid #ced4da; padding: .75em 0;}
#payment-confirm-content .payment-details .item .value {color: #13384F; font-weight: 700;}
  
@media screen and (max-width:576px) {
  #payment-confirm-content {max-width: 800px; margin: auto; padding: 1em .5em;}
  #payment-confirm-content .title {font-size: 1.25rem}
  #payment-confirm-content .amount-paid .amount-total {font-size: 2.0rem}
  #payment-confirm-content .amount-paid .amount-title {font-size: .8em}
  #payment-confirm-content .payment-details .item {font-size: .9rem}
}

/* ======================== 
SCROLL TO TOP
======================== */

#toTopBtn {display: none;  position: fixed; bottom: 20px; right: 20px; z-index: 99; border: none; outline: none; background-color: rgba(124,167,65,.90); color: white; cursor: pointer; padding: .5em .75em; border-radius: 50%; font-size: 1.5em; transition: all .2s ease;}
#toTopBtn:hover {background-color: #005574}

/* ========================
FOOTER
======================== */

/* Content */
#footer-content {background-color: #efefef; color: #13384F; padding: 6em 1em; position: relative; border-top:1px solid #13384F}  
#footer-content a {color:#13384F;text-decoration: none}
#footer-content a:hover {color:#13384F;text-decoration: underline}
#footer-content .heading {font-size:1.5rem; font-weight:600; color:#13384F; text-shadow:2px 1px 0 rgba(255,255,255,0); margin-bottom: 1em}
#footer-content .footer-logo img {max-width: 200px; height: auto; margin-bottom: 1.5em}
#footer-content .footer-quicklinks {font-size: 1rem}
#footer-content .footer-quicklinks i {color: #13384F}
#footer-content .footer-quicklinks ul li {transition: .3s; margin-bottom: .75em}
#footer-content .btn-top {font-size: 1.5rem;font-weight: 700;color: #fff;background: #ff6600;border: none;border-radius: 50%;width: 70px;height: 70px;position: absolute;top: 0px;left: 50%;right: 50%;margin: auto;transform: translate(-50%, -50%)}

/* Disclaimers */
#footer-disclaimers {background-color: #13384F; color: #fff; padding: 2em 1em; text-align: center; font-size: .9rem}
#footer-disclaimers a {color: #fff}
#footer-disclaimers .footer-logo-disclaimer {text-align: center; margin-bottom: 1.5em}
#footer-disclaimers .footer-logo-disclaimer img {max-width: 180px; height: auto}

@media screen and (max-width:576px) {
  #footer-content {padding: 3em 1em 3em 1em}
  #footer-content .footer-logo {margin-bottom: 2em}
  #footer-disclaimers .footer-logo-disclaimer img {max-width: 150px}
}
