.f16 {font-size:16px !important; line-height:160%; color: #333333;}
.f14 {font-size:14px; line-height:120%; color: #333333;}
.f20 {font-size:20px; line-height:140%;}
.f20n {font-size:20px; line-height:140%;}
.f20inland {font-size:20px; line-height:140%;}
.f12 {font-size:12px; line-height:140%; color: #333333;}
.f21 {font-size:21px; line-height:150%;}
.f23 {font-size:23px; line-height:150%;}
.f24 {font-size:24px; line-height:150%;}
.f25 {font-size:25px; line-height:130%;}
.f26 {font-size:26px; line-height:140%;}
.f28 {font-size:28px; line-height:130%;}
.f18 {font-size:18px; line-height:150%;}
.f30 {font-size:30px; line-height:130%;}
.f32 {font-size:32px; line-height:150%;}
.f35 {font-size:35px; line-height:150%;}
.td-5 {width: 5%;}
.td-15 {width: 15%;}
.td-10 {width: 10%;}
.td-50 {width: 50%;}
.td-20 {width: 20%;}
.td-25 {width: 25%;}
.td-28 {width: 28%;}
.td-30 {width: 30%;}
.td-40 {width: 45%;}
.td-55 {width: 55%;}

.top10 {margin-top: 10px;}
.top20 {margin-top: 20px;}
.top30 {margin-top: 30px;}
.top40 {margin-top: 40px;}
.blue {color: #0167b0;}
.orange {color: #e67408;}
.intro {margin-bottom: 30px; text-align: justify;}
.btn1 {background: #006bcf;
background: linear-gradient(0deg, rgba(0, 107, 207, 1) 0%, rgba(0, 60, 112, 1) 100%); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding: 3px; display: inline-block;  min-width: 250px; text-align: center;  transition: transform .2s; /* Animation */}
.btn1ins {background: #0090EB;
background: linear-gradient(180deg, rgba(0, 144, 235, 1) 0%, rgba(0, 74, 143, 1) 100%); -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; padding: 10px; color: #ffffff; font-weight: bold;}
.btn1:hover { transform: scale(1.1);}
.btn1ins img {width: 28px; margin-top: -3px; margin-left: 5px;}
.btn-area {text-align: center;}

.outbox {background: #004A8F;
background: linear-gradient(90deg, rgba(0, 74, 143, 1) 0%, rgba(0, 144, 235, 1) 100%); border-top-left-radius: 30px; border-bottom-right-radius: 30px; padding: 8px; margin-top: 60px;}
.boxhead img {width: 500px; margin-left: 10px;}
.boxhead {padding: 20px 0px;}
.house {float: right;}
.house img {width: 230px; margin-top: -70px; margin-right: -20px; animation: zoom-in-zoom-out 3s ease infinite;}
.wbox {border-top-left-radius: 22px; border-bottom-right-radius: 22px; background-color: #ffffff; padding: 20px;}

.aTable {border: none; margin: 0 auto; width: 100%; text-align: center;}
.aTable th {background-color: #fff;  border-top: 1px solid #fff; border-right: 1px solid #fff; border-left: 1px solid #fff;}
.aTable td {background-color: #fff;  border-right: 1px solid #fff; border-left: 1px solid #fff; font-weight: bold; vertical-align: middle; padding: 5px;}
.aTable tr { border-bottom: 1px solid #d9d9d9;}
.aTable .bottom { border-bottom: 2px solid #0167b0; }
.hibor img {height:70px;}

@keyframes zoom-in-zoom-out {
  0% {
    scale: 100%;
  }
  50% {
    scale: 110%;
  }
  100% {
    scale: 100%;
  }
}

.bbox {border-radius: 30px; background-color: #e6fbff; padding: 20px; margin-top: 120px;}
.headline {text-align: center; margin-top: -80px;}
.headline img {width: 500px;}
.dec {text-align: center;}

.hTable {border: none; margin: 0 auto; width: 100%; text-align: center; margin-top: 20px;}
.hTable th {background-color: #fff; padding: 10px 5px; color: #ffffff; border-top: 0px solid #b8f7ff;}
.hTable th:first-child { border-right: 0px solid #b8f7ff; border-left: 0px solid #b8f7ff;}
.hTable th:last-child { border-right: 0px solid #b8f7ff; border-left: 0px solid #b8f7ff;}
.hTable td {background-color: #fff; vertical-align: middle; padding: 5px; border-top: 1px solid #b8f7ff; border-right: 1px solid #b8f7ff; border-left: 1px solid #b8f7ff; border-bottom: 1px solid #b8f7ff;}
.hTable td:first-child {border-left: 0px solid #b8f7ff;}
.hTable td:last-child { border-right: 0px solid #b8f7ff;}
.hTable .bbg {background-color: #e6fbff; }
.hTable .bbgg1 {background: #002E8F;
background: linear-gradient(0deg, rgba(0, 46, 143, 1) 0%, rgba(0, 140, 255, 1) 100%); border-top-left-radius: 30px; }
.hTable .bbgg2 {background: #002E8F;
background: linear-gradient(0deg, rgba(0, 46, 143, 1) 0%, rgba(0, 140, 255, 1) 100%); border-top-right-radius: 30px;}
.hTable .borderright {border-right: 1px solid #b8f7ff;}
.hTable .bordertop {border-top: 0px solid #b8f7ff;}

.harea {margin-top: 80px; position: relative;}

.h-area:after{display:table; clear:both; content:"";}
.head {color: #ffffff; font-weight: bold; background: #004A8F;
background: linear-gradient(0deg, rgba(0, 74, 143, 1) 0%, rgba(0, 144, 235, 1) 100%); height: 80px; border-radius: 40px; text-align: center; padding-top: 5px; width: 480px;  z-index: 8px; position: absolute; top: -30px; left: 50%; transform: translateX(-50%);}
.save1 {float: left; width: 50%; padding-right: 10px; }
.save2 {float: left; width: 50%; padding-left: 10px;}
.wbox1:after{display:table; clear:both; content:"";}
.wbox1 {background-color: #ffffff; border-radius: 20px; padding: 20px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); }
.hword {text-align: center; margin-top: 10px;}

.orangebox {width: 290px; background: rgba(255, 216, 0, 1);
background: radial-gradient(circle at 50% -20%, rgba(255, 216, 0, 1) 0%, rgba(255, 175, 0, 1) 20%, rgba(255, 74, 0, 1) 100%); text-align: center; border-radius: 20px; box-shadow:3px 6px 15px rgba(0, 0, 0, 0.7); padding: 15px 15px; margin: 0 auto; margin-top: -60px;}
.orangebox img {width: 260px;}

.tnc {margin-top: 30px; margin-bottom: 10px;}
.tr {width: 13px; float: left;}
.tl {width: 100%; padding-left: 13px;}

.lineright {border-right: 1px solid #757475;}
.pbottom {padding-bottom: 60px;}


.desktop1 {display: block;}
.mobile1 {display: none;}

@media screen and (max-width: 1023px) {
.desktop1 {display: none;}
.mobile1 {display: block;}
.boxhead img {width: 300px; margin-left: 10px;}	
.house img {width: 230px; margin-top: -20px; margin-right: -20px; animation: zoom-in-zoom-out 3s ease infinite;}	
}

.desktop {display: block;}
.mobile {display: none;}
@media screen and (max-width: 768px) {
.desktop {display: none;}
.mobile {display: block;}
.table-wrapper {
        overflow-x: auto; /* Enables horizontal scrolling when content overflows */
        width: 100%; /* Optional: Ensures the wrapper takes full available width */
    }	
.f20 {font-size:18px; line-height:140%;}
.f20n {font-size:16px; line-height:140%;}	
}

.housenone {display: block;}

@media screen and (max-width: 690px) {
.boxhead img {width: 230px; margin-left: 10px;}	
.housenone {display: none;}
.f25 {font-size:18px; line-height:130%;}
.f30 {font-size:18px; line-height:130%;}
.hibor img {height:38px;}
.wbox {padding: 10px}
.headline {text-align: center; margin-top: -70px;}	
.headline img {width: 300px;}
.head {width: 300px; height: 80px;}
.orangebox {width: 150px; padding: 10px 0px;}
.orangebox img {width: 100%;}
.save1 {float: left; width: 50%; padding-right: 5px; }
.save2 {float: left; width: 50%; padding-left: 5px;}	
}




