@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;1,200;1,300;1,400&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap'); */
*{
    /* font-family: 'Lato', sans-serif; */
    font-family: 'Nunito Sans', sans-serif;
    /* font-family: 'Cairo', sans-serif; */
    /* font-family: 'Raleway', sans-serif; */
}
._menu-item_ a:hover{
    color: #ed1f31 !important;
}

/* Notices  */

.notice-red{
    border-left: 10px solid #d9534f;
    background: #fdf7f7;
    padding-left: 5px;
}

/*  */
#Top{
    /*padding: 10% 0px;*/
    height: 700px;
    background-position: cover;
    /* background-size: 100% auto; */
    /*width: 100%;*/
    width: 100%;
    /*height: auto*/
    padding-top: 150px;

}
/* **** For Merchant -> Become-Merchant */
#Become-Merchant{
    height: 500px;
}
/* ********************* */
#Hotline ._column-3-4-and-1-4_ > div:nth-child(1){
    text-align: right;
    margin-bottom: 10px;
}

/**/
#pl_pay > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > h5:nth-child(4){
    display:none;
}
/**/
._custom-heading-border_::after{
    display: block;
    width: 200px;
    height: 5px;
    background-color: #ed1f31;
    content: " ";
    position: relative;
    z-index: 1;
    left: 0px;
    bottom: -10px;
}
/*Top-Home*/
#Top_main{
    height: 600px;
    /* background-size: 100% auto; */
    padding-top: 150px;
}
/*For Personal*/
#Money-Transfer,
#pl_pay,#Top-Up,
#Bill-Payment,
#Currency-Exchange,
#Cash-In-Out{
    height: 700px;
}
#Cash-In-Out > div:nth-child(1){
    padding-top: 80px;
    padding-bottom: 40px;
}
#Cash-In-Out > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > h6:nth-child(1){
    font-size: 35px;
}
#Currency-Exchange > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > h6:nth-child(1){
    font-size: 35px;
}


/*Media Properties*/
/*@media screen and (max-width: 600px) {*/
/*    #Top{*/
    /*padding: 10% 0px;*/
    /*background-position: cover;*/
/*    background-size: cover;*/
    /*width: 100%;*/
/*    }*/
/*  #Money-Transfer,#pl_pay,#Top-Up,#Cash-In-Out,#Bill-Payment,#Currency-Exchange{*/
/*    background-position: cover;*/
/*    }*/
/*    #Top_main{*/
/*        background-image: url(images/slide-image-mobile-1.jpg);*/
/*    }*/
/*}*/
@media screen and (max-width: 400px) {
  #Top{
    padding: 15% 0px;
    background-size: cover;
    background-position: -460px 4px;
    }
}
/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
    #Top-main > div > figure > img {
        display: none !important;
    }
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
  
    /*#Top_main{*/
    /*    background-size: 1650px 600px;*/
    /*    background-position-y: -1px;*/
    /*    background-position-x: inherit;*/
    /*}*/
    #Top-main > div{
        display: none !important;
    }
    #Top_main > div > header > figure {
        display: none !important;
    }
        
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
/* 
*/
@media screen and (width: 768px){
    #Download,
    #Top > div > header > figure > img,
    #Top_main > div > header > figure > img{
        display: none !important;
    }
}
/* 
 */
@media (min-width: 768px) and (max-width: 1024px) {
  
    /* #Top{*/
    /*    background-size: cover;*/
    /*}*/
    
    #Top_main{
        height: 600px;
        /* background-position: 70% center; */
        padding-top: 150px;
        /* background: none !important; */
    }
    /* #Top_main > div{
        position: absolute;
        padding-left: 0px;
        padding-right: 0px;
        top: 25px; */
    #About,#Cash-In-Out,#Money-Transfer,#pl_pay,#Bill-Payment,#Top-Up,#Currency-Exchange{
        /* background-image: none !important; */
        height: max-content;
    }
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    
}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 768px) {
    #Cash-In-Out,#Money-Transfer,#pl_pay,#Bill-Payment,#Top-Up,#Currency-Exchange{
        background-image: none !important;
        height: max-content;
    }
}
/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
    
    .padding-top-20{
        padding-top: 20px;
    }
    /* #Top{
        background-image: none !important;
        padding-top: 150px;
    }
    #Top_main{
        background-position: 70% center;
        background-size: cover;
        padding-top: 150px;
    } */
    #Top_main{
        height: 500px;
        /* background-position: 70% center; */
        padding-top: 150px;
        background: none !important;
    }
    #Top_main > div{
        position: absolute;
        padding-left: 0px;
        padding-right: 0px;
        top: 25px;
    }
    #Top{
        height: 500px;
        /* background-position: 70% center; */
        padding-top: 150px;
        background: none !important;
    }
    #Top > div{
        position: absolute;
        padding-left: 0px;
        padding-right: 0px;
        top: 25px;
    }
    #Top > div > header > h3 {
        margin-top: 25px;
    }
    #Top_main > div > header > h3 {
        margin-top: 25px;
    }
    /* Corousel mobile shaking */
    #Dragonfly-Wallet{
        height: 1050px;
    }
    /* ************************ */
    #About,#Cash-In-Out,#Money-Transfer,#pl_pay,#Bill-Payment,#Top-Up,#Currency-Exchange{
        background: none !important;
        height: max-content;
    }
    #Policy > div > div > div > div > h2,
    #Security > div > div > div >div > h2{
        margin-top: 25px;
    }
    #Policy > div > div > div > div > p,
    #Security > div > div > div >div > p{
        text-align: justify !important;
        word-spacing: 3px;
        text-justify: distribute;
        padding: 3px;
        /* text-justify: ; */
    }
    
}