html {
    scroll-behavior: smooth;
}

body {

    max-width: 600px;
    margin: auto;
    list-style-type: none;
    background: rgba(245, 249, 255, 1);
font-size: min(max(14px, 1.5vw), 16px) !important; 
   padding-bottom: 2rem;
}
/* tab */
.greyTab{
    position: relative;
   color: rgba(132, 132, 132, 1);
   border:none;
    background: #fff;
    text-align: center;

}
.greyTab::after{
 content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-bottom: 2px solid rgba(234, 234, 234, 1);
  border-radius: 50px;
  z-index: 0;
  width: 100%; 
  background: red;
}

.tabButton {
    position: relative;
    font-size: 16px;
    text-align: center;
    font-weight: 900;
   border:none;
    background: #fff;
    width: 100%;
padding:9px 2px;


font-weight: 900;
}
.redTab{
    position: relative;
    color: rgba(188, 21, 44, 1);
    background:#fff;
    text-align: center;

}
.redTab::after{
 content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-bottom: 2px solid rgba(188, 21, 44, 1);
  border-radius: 50px;
  z-index: 0;
  width: 100%; 
}
.orangeTab{
    position: relative;
   color: rgba(231, 123, 28, 1) !important;
    background:#fff;
 
    text-align: center;

}
.orangeTab::after{
 content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  border-bottom: 2px solid rgba(231, 123, 28, 1) ;
  border-radius: 50px;
  z-index: 0;
  width: 100%; 
}
.relative{
    position: relative;
}
.container{
    position: absolute;
    z-index: 999;
       background: rgba(245, 249, 255, 1);
    margin: -24px 24px;
}
#banner{
position: relative;
z-index: 1;
}

[v-cloak]{
    display: none;

}
.overflow {
    height: 373px !important;
    padding-bottom: 20px;
}
.overflow {
    overflow-y: auto;
    white-space: wrap;
    scrollbar-width: none;
    height: 520px;

}
.line2 {
    background-color: #E9E9E9;
    height: 0.5px;
    width: 100%;
    margin: 12px 0;
}
.blurBg {
    position: fixed;
    max-width: 600px;
    width: 100%;
    height: 101px;
    color: #FFF;
    z-index: 90;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: auto;
    /*background-color: red;*/
	background: rgba(255, 255, 255, 0.6);
	backdrop-filter: blur(2.5px);
	-webkit-backdrop-filter: blur(7.5px) ;
	/*overflow: auto;*/
	padding: 15px 0;


    z-index: 999 !important;
}
.fixedBtn{
    position: fixed;
    max-width: 500px;
    width: 90%;
    border-radius: 9px;
    border: 1px solid #FFF;
 background: linear-gradient(179.96deg, #E81313 3.37%, #C31313 99.97%);;

    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(21.5px);
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
    color: #3E1F04;
    bottom: 40px;
    padding: 15px;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 15px;
    font-weight: 500;
    opacity: 1;
    color: #fff;
    z-index: 998;
}
.hide{
    display: none;
}
@keyframes popOut {
  0% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
  50% {
    transform: scale(1.1) translateY(-10px);
    opacity: 0.7;
  }
  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

.popOutElement {
  position: relative;
  animation-name: popOut;
  animation-duration: 0.2s;
  animation-timing-function: ease-out;
  animation-fill-mode: both;
}
#app {
  
    /*overflow: auto;*/
    /*width: 100vw;
    height: 100vh;
    overflow: scroll;
    scroll-behavior: smooth;*/

}
.navArea{
    position: relative;
}
#nav-2{
    position: absolute;
    /*background: red;*/
    z-index: 666;
    width: 20px;
    height: 20px;
    margin-top: -20px;

}
#nav-3{
    position: absolute;
    /*background: red;*/
    z-index: 666;
    width: 20px;
    height: 20px;
    margin-top: -80px;

}
#nav-4{
    position: absolute;
    background: red;
    z-index: 666;
    width: 20px;
    height: 20px;
    margin-top: -80px;

}
#nav-5{
    position: absolute;
    background: red;
    z-index: 666;
    width: 20px;
    height: 20px;
    margin-top: -80px;

}
#nav-6{
    position: absolute;
    background: red;
    z-index: 666;
    width: 20px;
    height: 20px;
    margin-top: -80px;

}
.btnPop{
    background: rgba(188, 21, 44, 1);
    border-radius: 20px;
    padding: 14px;
    color:#fff; 
    text-align: center;
 
}
/* pop */

.modalPop {
 
    z-index: 9998;
    left: 0;
    top: 0;
    right: 0;
    
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: #00000040;
    height: 100vh;
    overflow-y: hidden;
    backdrop-filter: blur(1.5px);
    -webkit-backdrop-filter: blur(1.5px);
    margin: auto;
}

.modal-content {
    position: fixed;
    background-color: #fff;
    padding: 20px;
    width: 100%;
    bottom: 20px;
    z-index: 9999;
    display: block;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 20px 20px 0 0;
    max-width: 600px;
    min-height: 480px;
    bottom: 0;
    max-height: 490px;
}


p.popHeading {
    font-size: 16px;
}

p.popContent {
    /*font-size: 12px;*/
}

input[type="checkbox"] {
    position: relative;
    box-sizing: border-box;
    width: 18.44px !important;
    height: 15px !important;
    border-radius: 1px solid;
    background-color: #fff;
    padding: 0px;
    margin: 0 10px 0 0;
    z-index: 5;
}

.checkbox {
    position: relative;
    width: 15px !important;
    height: 15px !important;
    margin: 0 10px 0 0;
}

.checkbox::before {
    content: "";
    position: absolute;
    /*border: 2px solid #000;*/
    width: 15px !important;
    height: 15px !important;
    border-radius: 2px;
}

.checkbox::after {
    content: "";
    position: absolute;
    width: 30px !important;
    height: 30px !important;
    border-radius: 2px;
    top: -5px;

}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    80%,
    100% {
        opacity: 0;
    }

}

@keyframes popDown {
    0% {
        transform: translate(0, 0%);
    }

    100% {
        transform: translate(0, 200%);
    }
}

input:checked~.checkmark {
    background-color: #2196F3;
}

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

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

/* Style the checkmark/indicator */
.checkmark:after {
    left: 4.6px;
    top: 2.1px;
    width: 2px;
    height: 7px;
    border: 1px solid #EF8403;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}



label {
    display: inline-block;
    cursor: pointer;
}

.Popdown {
    animation: 1.5s popDown;
}

.popLink {
    color: rgb(239, 132, 2);
    text-decoration: underline;
}



.whiteBg {
    background: #fff;
}



section {
    margin: 23px 20px;
}


img{
    width: 100%;
    height: auto;
   
}
.bg::after {
    content: "";
    position: absolute;
    background: #D1E5F0;
    height: 100px;
    width: 100%;
    z-index: -1;
}

.notActive {
    background: #DBDBDB;
    pointer-events: none;
    border-radius: 2px;
    padding: 2px 4px;
    width: 32px;
    font-size: 8px;
}

.isActive {
    background: #C8D4EB;
    pointer-events: none;
    border-radius: 2px;
    padding: 2px 4px;
    font-size: 8px;
    color: #062B89;

}

.titleBox {
    position: relative;
    background-image: url(../img/bar.png);
    height: 100%;
    width: 100%;
    background-size: 100% 100%;
    left: 0px;
    right: 0;
    padding: 9px;
    display: block;
    margin: auto;
    color:#fff;
    font-weight: 900;
    text-align: center;
 font-size: 16px; 
    max-width: 95%;
    z-index: 1;
   word-break: keep-all;
}
.titleBoxEn {
    position: relative;
    background-image: url(../img/bar.png);
    height: 100%;
    width: 100%;
    background-size: 100% 100%;
    left: 0px;
    right: 0;
    padding: 9px;
    display: block;
    margin: auto;
    color:#fff;
    font-weight: 900;
    text-align: center;
    font-size: 13px;
    max-width: 297px;
   
    z-index: 1;
}

.typeBox {
    position: absolute;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 71.76px;
    right: 16px;
    top: 48px
}
.fundTitle{
font-size: min(max(13px, 1.5vw), 16px) !important; 
}
.fundIcon {
    height: 18px;
    width: auto;
    margin-right: 10px;
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.flex {
    display: flex;
  
}

.flexEnd{
display: flex;
justify-content: flex-end;

}
.transformCenter{
    top:50%;
    transform: translate(0,-50%);
}
.flexAlignC{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}
.flexBtw {
    display: flex;
   justify-content: space-between;
   flex-direction: column;
}
.flexAround {
    display: flex;
   justify-content:space-around;
   flex-direction: column;
}



.click {
    position: absolute;
    /*background: red;*/
    width: 20px;
    height: 20px;
    top: -14%;
    z-index: 999;
}

.click2 {
    position: absolute;
    /*background: red;*/
    width: 20px;
    height: 20px;
    top: -16%;
    z-index: 999;
}
.numsContainer {
position: relative;
background: linear-gradient(90deg, #BC152C 0%, #BC152C 58.3%, rgba(188, 21, 44, 0.5) 100%);
width: 100%;
min-height: 39.259639739990234px;
z-index: 55;
display: flex;
padding:4px

}
.numTitle{
    font-size: 20px;
    color:#fff;
    padding: 0 46px;
    top:0;
    bottom: 0;
    margin: auto 0;
}


.fingerImg {
    width: 37.84px;
    height: auto;
    float: left;
    margin-right: 11px;
}

.modal {
    position: relative;
    background: #fff;
    border-radius: 8px;
    width: 100%;
    /* border-radius: 0 0 8px 8px; */
    padding:  16px 16px 25px;
    box-shadow: 2px 1px 11px 0px rgba(0, 0, 0, 0.11);
    
}
.innerModal{
background: rgba(255, 255, 255, 1);
box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.11);
border-radius: 16px;
padding: 20px;

}
.QBox{
        position: relative;
        padding: 4px 18px;
        border-radius: 20px;
        background: rgba(254, 246, 246, 1);
        width: 75%;
        max-width: f;
        display: flex;
        align-items: end;
        min-width: 50%;
        z-index: 555;
       
    }
    .QBox::before{
    content:"";
    position: absolute;
    background-image: url(../img/Q.svg);
    /*background-color: red;*/
    background-repeat: no-repeat;
    background-size: 100%;
    height: 30px;
    width: 30px;
    right:11px;
    bottom:-10px;
    z-index: -1;
    }
    .ABox{
        position: relative;
        padding: 8px 18px;
        border-radius: 20px;
        background: rgba(255, 149, 0, 1);
        width: fit-content;
        z-index: 666;
        margin-top: 22px;
        color:#FFF;
        font-size: 14px;
        z-index: 555;
    }
    .ABox::before{
    content:"";
    position: absolute;
    background-image: url(../img/A.svg);
    /*background-color: red;*/
    background-repeat: no-repeat;
    background-size: 100%;
    height: 30px;
    width: 30px;
    left:11px;
    bottom:-10px;
    z-index: -1;
    }
    
    .hand{
        position: absolute;
        width: 72px;
        height: 50px;
        margin:0 0 0 49px;
        animation:show 0.5s ease-in-out alternate;
        left: -12px;
        z-index: 666;
        margin-top: -12px;
        }
        @keyframes show{
            0%{
                opacity: 0;
                transform: scale(0.90);
            }
            50%{
                opacity: 0.3;
            }
            100%{
                opacity: 1;
                transform: scale(1);
              
        
            }
        }
        @-webkit-keyframes show{
            0%{
                opacity: 0;
                transform: scale(0, 0);
            }
            50%{
                opacity: 0.3;
            }
            100%{
                opacity: 1;
                transform: scale(1);    }
        }
        @-o-keyframes show{
            0%{
                opacity: 0;
                transform: scale(0, 0);
            }
            50%{
                opacity: 0.3;
            }
            100%{
                opacity: 1;
                transform: scale(1);
            }
        }
        @-moz-keyframes show{
            0%{
                opacity: 0;
                transform: scale(0, 0);
            }
            50%{
                opacity: 0.3;
            }
            100%{
                opacity: 1;
                transform: scale(1);
            }}
    .A{
    padding:8px 11px;
    
    }
    .arrowBox{
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
        left: 30px;

    
    
    }
    .arrow.rotate {
        transform: rotateX(180deg);
      }
    .arrow{
        position: relative;
        width:10px;
        height: 7px;
        /*transition: transform 0.2s ease-in-out;*/
    }
    .arrowBox::before{
        content: "";
        position: absolute;
        background-color: #D7D7D7;
        height: 21px;
        width: 21px;
        border-radius: 50%;
        display: block;
    }
b{
    font-weight: 900 !important; 
}
.pinkBg{
   background: linear-gradient(180deg, #FFFCFC 0%, #FFF4F4 49.8%, #FDE9E9 72.7%, #FDE5E5 100%) !important;
   box-shadow: 0.5px 2.52px 2.52px 0px rgba(109, 109, 109, 0.549);
    border-radius: 0px !important
}
.white-gradient{
    background: linear-gradient(180deg, #FFFFFF 73.19%, rgba(255, 255, 255, 0) 100%) !important;
    padding-bottom: 20px;

}
.shadow1 {
    /*box-shadow: 0.5px 2.52px 2.52px 0px #6D6D6D8C;*/
    filter: drop-shadow(0.5px 2.52px 2.52px #6D6D6D8C)
}

.bg2 {
    background: linear-gradient(180deg, #FCFDFF 0%, #F4F6FF 49.8%, #E9ECFD 72.7%, #E5E7FD 100%);
    width: 100%;
    padding: 0;
    width: 100%;
}

.w80 {

    width: 80%;

}

.fund {
    background: linear-gradient(180deg, #FFFDFC 2.4%, #FFFAF4 84.48%, #FDF3E5 96.1%);
    padding: 0px 7px 23px 7px;
    width: 97.5%;
    margin: auto 0 auto auto;

}

.fundTitle {

    padding-right: 15px;
}

.fundName,
.desc {
    font-size: 10px;
}

.fundTopTitle {
    color: #B24811;
    font-size: 16px;
    margin: 24px 0;
    padding: 0 16px;
    font-weight: 700;
}

.fundBtn {
    position: absolute;
    background: linear-gradient(90deg, #EDBC65 0%, #FFE1A3 49.8%, #FFEBBE 72.7%, #FAE0A6 83.9%, #F5D288 100%);
    padding: 4px 13px;
    border-radius: 32px;
    right: 16px;
    height: 21.35px;
    width: fit-content;
    color: #B24811 !important;
    top: 16px;
    bottom: 0;
    margin: 0 0 0 auto;
    box-shadow: 1px 1px 0 0px #773800
}

.fundType {
    color: #000000;
    border-radius: 2px;
    margin-right: 5px;
    font-size: 8px;
    padding: 2px 2.5px;
    font-weight: bolder;
}

.pt24 {
    position: relative;
    top: 44px;

}

.btn {
    color: #B24811;
    font-size: 9.45px;
    padding: 0 4px 0;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;


}

.fundBlock {
    position: relative;
    background-color: #F1F1F2;
    margin-top: 8px;
    padding: 16px;
    border-radius: 10px;

}
#price0 >  div:last-child{
color: rgba(54, 43, 174, 1);
}
#price1 > div:nth-child(1){
color: rgba(228, 98, 38, 1);
}
#price1 > div:last-child{
color: rgba(43, 148, 174, 1);
}
#price1{
margin-top: 4px;

}
.slash{
    margin:0 4px;
    padding:0 4px
}
.slash2{
width: 0.5px;
height: 100%;
background: rgba(203, 203, 203, 1);

}
.hiven {
    margin: 0 16px 0 10px;
}

.item-a {
    grid-area: first;
}

.item-b {
    grid-area: second;
}
.etfHeading{
color:rgba(188, 57, 21, 1);
font-weight: 900; 
font-size: min(max(16px, 1.5vw), 20px) !important; 
margin-top: 10px;
}
.modal-fourNav {
position: relative;
}

.fourNav {
  overflow: hidden;
  display: grid;
    grid-template-columns: repeat(4, 1fr);
  grid-auto-flow: column; /* This makes the grid flow in a single column */
grid-auto-rows: max-content; /* Each row will take the maximum width of its content */
  grid-auto-flow:dense; /* Fill the gaps with smaller items */
    grid-gap: 4px;
    text-align: center;
    gap: 4px;
    padding: 8px 12px;
    background: #FFFFFF;


}


.twoNav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 4px;
    text-align: center;
    gap: 4px;
    padding: 8px 4px;
    background: #FFFFFF;
    border-radius: 8px;
    position: -webkit-sticky;
    position: sticky;
    top: 52px;
    z-index: 554;
    font-size: 12px;
}

.fourNav>div {
    background: #BC152C;
    padding: 8px 3px;
    color: #fff;
    position: -webkit-sticky;
    position: sticky;
    top:0;
    cursor: pointer;
    font-weight: 900;
}
.twoNav>div {
    background: rgba(188, 57, 21, 1);
    padding: 8px 2px;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 900;
    /*font-size: 12px;*/
}

.fourNav>div>a {
    color: #fff;
}
footer{
    text-align: j;
    margin-top: 32px;
    font-weight: 900;
}
footer div{
    margin-top: 12px;
}
div#footer-4{
    margin-top: -12px !important;

}
ul.decimal > li {
    list-style-type: decimal;
    margin-left: 20px;
    margin-top: 24px;
}
.greyBox{
background: rgba(241, 241, 242, 1);
border-radius:4px ; 
margin-top: 8px;
padding:16px;
font-size: 12px;
}
.eftWord{
font-size: 14px;
color: rgba(1, 0, 118, 1);
margin: 24px 0;
padding:24px 14px ;
border-bottom:  1px solid rgba(1, 0, 118, 1) ;
border-top:  1px solid rgba(1, 0, 118, 1) ;
text-align: center;
}
.grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 8px;
    padding: 8px 20px;

}
.gridFive {
    display: grid;
    grid-template-columns: auto 12px auto 12px auto;
    grid-gap: 5px;
    padding-right: 15px;

}
.TitleNDesc{

}
.descHeading{
    margin-top: 8px;
font-size: min(max(10px, 1.5vw), 14px) !important; 
    /*border-right: 1px solid
    rgba(203, 203, 203, 1);*/
}
.descHeading2{
text-align: center;
/*background: red;*/
font-size: 10px;
}


.grid2 {
    display: grid;
    grid-template-columns: 50px auto;
    grid-gap: 4px;
    align-items: center;

}

.gridFund{
    display: grid;
    grid-template-columns:  1fr 60px;
    grid-gap: 4px;
 
}

/*.grid2{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    justify-items: center;
    align-content: space-between;
    justify-content: space-between;
    text-align: center;
    padding: 6px;
    z-index: 555;
    column-gap: 4px;
}*/
.nav {

    background-color: #FFEFDC;
    border-radius: 8px;
    color: #B24811;
    font-size: 13px;
    width: 100%;
    padding: 4px;
    margin: 2px;
    z-index: 555;
}

.NavMain {
    position: relative;
    background-color: rgba(255, 228, 249, 1);
    color: #FFFFFF;
    font-size: 13px;
    width: 100%;
    padding: 12px 5px;
    z-index: 555;
    border-radius: 4px;
    text-align: center;
    color:rgba(182, 17, 136, 1);
    /*grid-column: span 2;*/
}

.NavMain:nth-child(4),
.NavMain:nth-child(5) {
    grid-column: span 3;
}

.stickyBox {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 555;
}

.stickyBox2 {
    position: -webkit-sticky;
    position: sticky;
    top: 44px;
    z-index: 555;
}

.iconBox{
    background: rgba(255, 239, 220, 0.389);
    padding:20px;
    border-radius: 8px;
    text-align: center;
}

.icon {
  
    min-height: 42px;
    min-width: 42px;
    height: 100%;
    width: 100%;
}

.line {
    background-color: rgba(234, 234, 234, 1);
    height: 0.5px;
    width: 100%;
    margin: 24px 0;
}
.line2 {
    background-color: #E9E9E9;
    height: 0.5px;
    width: 100%;
    margin: 12px 0;
}
.swiperTitle{
color: rgba(252, 29, 29, 1);  
font-weight: 900;  
}
.swiperSubTitle{
color: rgba(136, 136, 136, 1);   
font-size: 12px;
}
.textC{
    text-align: center;
}

/* padding */
.padding20200 {
    padding: 20px 20px 0;
}

.padding02020 {
    padding: 0 20px 20px;
}

.padding2719 {
    padding: 27px 0 21px 0;
}
/* animation */
@keyframes gradientGreen {
  0% {
    background: radial-gradient(circle at center, rgba(0, 255, 0, 0) 0%, #fff 0%, #fff 100%); /* Green transparent to white */
  }
  25% {
    background: radial-gradient(circle at center, rgba(12, 140, 19, 0.3) 24%, #fff 25%, #fff 100%);
  }
  50% {
    background: radial-gradient(circle at center, rgba(12, 140, 19, 0.5) 49%, #fff 50%, #fff 100%);
  }
  75% {
    background: radial-gradient(circle at center, rgba(12, 140, 19, 0.8) 74%, #fff 75%, #fff 100%);
  }
  100% {
    background: rgba(12, 140, 19, 1); /* Final green color */
  }
}
@keyframes gradientRed {
  0% {
    background: radial-gradient(circle at center, rgba(0, 255, 0, 0) 0%, #fff 0%, #fff 100%); /* Green transparent to white */
  }
  25% {
    background: radial-gradient(circle at center, rgba(188, 21, 44, 0.3) 24%, #fff 25%, #fff 100%);
  }
  50% {
    background: radial-gradient(circle at center, rgba(188, 21, 44, 0.5) 49%, #fff 50%, #fff 100%);
  }
  75% {
    background: radial-gradient(circle at center, rgba(188, 21, 44, 0.8) 74%, #fff 75%, #fff 100%);
  }
  100% {
    background: rgba(188, 21, 44, 1); /* Final green color */
  }
}

.bounceInDown {
  animation-name: bounceInDown;
  animation-duration: 0.4s;
  animation-fill-mode: both;
}

@keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }
  0% {
    transform: translate3d(0, -20px, 0);
    opacity: 0;
  }
  60% {
    transform: translate3d(0, 25px, 0);
    opacity: 1;
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  100% {
    transform: none;
  }
}/* font style */
.font10{
    font-size: 10px;

}
.font12{
    font-size: 12px;

}
.font20{
    font-size: 20px;

}
.bold {
    font-weight: 900;
}
.greyColor{
    color:rgba(96, 96, 96, 1);
}
.orange{
color: rgba(231, 123, 28, 1) !important;
}

/* margin */
.mt4 {
    margin-top: 4px;
}

.mt8 {
    margin-top: 8px;
}

.mt10 {
    margin-top: 10px;
}

.mt12 {
    margin-top: 12px;
}

.mt14 {
    margin-top: 14px;
}
.mtn12{
    margin-top: -12px;
}
.mtn20{
    margin-top: -20px;
}
.mtn24{
    margin-top: -24px;
}
.mt24 {
    margin-top: 24px;
}

.mt26 {
    margin-top: 26px;
}
.mt28{
margin-top: 28px;
}

.mt48 {
    margin-top: 48px;
}

footer {
    /*font-size: 12px;*/
    margin: 24px 22px;
}

/* fontsz */
.fz10 {
    font-size: 10px;
}
.padding9220{
    padding: 9px 22px 0
}
@media only screen and (min-width: 1081px) and (max-width:1920px) {
    html{font-size:41.4px !important;}
    .gridFund {
    grid-template-columns: 1fr 90px !important;
            }
    section{
        margin: 20px 40px;
    }
    
.twoNav {
font-size: min(max(14px, 1.5vw), 16px) !important; 
}
.swiperImg {
max-height: 659px; 
}
  }
  
  
  @media only screen and (min-width: 820px) and (max-width: 1180px)  {
       html{font-size:41.4px !important;}
       .gridFund {
    grid-template-columns: 1fr 90px !important;
            }
     section{
        margin: 20px 40px;
    }
    .twoNav {
font-size: min(max(14px, 1.5vw), 16px) !important; 
}
.swiperImg {
max-height: 659px; 
}
  }

  @media only screen and (min-width: 768px) and (max-width: 1024px)  {
       html{font-size:41.4px !important;}
    .gridFund {
    grid-template-columns: 1fr 90px !important;
            }
     section{
        margin: 20px 40px;
    }
    .twoNav {
font-size: min(max(14px, 1.5vw), 16px) !important; 
}
.swiperImg {
max-height: 659px; 
}
  }
  @media only screen and (min-width: 540px) and (max-width: 720px)  {
       html{font-size:41.4px !important;}

  }

  @media only screen  and (max-width: 320px)  {
       html{font-size:41.4px !important;}
.swiperImg {
max-height: 659px; 
}

  }