.section.main-sub-menus{

    position: relative;

    height: 180px;

    background: #fff;

    -webkit-box-shadow: 0px 8px 15px -10px rgba(150,150,150,0.25);

    -moz-box-shadow: 0px 8px 15px -10px rgba(150,150,150,0.25);

    box-shadow: 0px 8px 15px -10px rgba(150,150,150,0.25);

    z-index: 1;

}

.section.main-sub-menus .sub-menus-box {

    text-align: center;

    padding: 10px 0;

    position: relative;

    top: 25px;

    float: left;

    margin: 0 auto;

    width: 100%;

}

.section.main-sub-menus .sub-menus-box img{

    max-width: 80px;

    max-height: 80px;

    margin-bottom: 5px;

}

.section.main-sub-menus .sub-menus-box p,

.section.main-sub-menus .sub-menus-box p a{

    font-size: 18px;

    text-transform: uppercase;

    color: var(--color-blue);

    font-weight: 300;

    margin-bottom: 0;

    padding-bottom: 15px;

}

.section.main-sub-menus .sub-menus-box p,

.section.main-sub-menus .sub-menus-box p a{

    font-size: 16px

}

@media (max-width: 1500px){

    .section.main-sub-menus .sub-menus-box p:lang(km),

    .section.main-sub-menus .sub-menus-box p a:lang(km){

        font-size: 15px

    }

    .section.main-sub-menus .sub-menus-box p a::after{

        background-position: 5px 4px;

    }

}



.section.main-sub-menus .sub-menus-box p a::after {

    position: absolute;

    content: '';

    width: 20px;

    height: 22px;

    padding-left: 26px;

    background: url("../images/icons/arrow-down-blue.png") no-repeat 5px 6px / 16px auto;

}

.section.main-sub-menus .sub-menus-box p:hover a::after{

    background: url("../images/icons/arrow-down-gold.png") no-repeat 5px center / 16px auto;

    -moz-transform: rotate(-180deg);

    -o-transform: rotate(-180deg);

    -webkit-transform: rotate(-180deg);

    -ms-transform: rotate(-180deg);

    transform: rotate(-180deg)

}

.section.main-sub-menus .sub-menus-box a:hover,

.section.main-sub-menus .sub-menus-box p:hover a{text-decoration:none!important}

.section.main-sub-menus .sub-menus-box p:hover a,

.section.main-sub-menus .sub-menus-box ul.sub-menus li:hover a {color:var(--color-gold)}

.section.main-sub-menus .sub-menus-box ul.sub-menus:hover,

.section.main-sub-menus .sub-menus-box p:hover + ul.sub-menus{

    top: 130px;

    opacity: 1;

    visibility: visible

}

.section.main-sub-menus .sub-menus-box ul.sub-menus{

    min-width: 200px;

    border-top: 2px solid var(--color-gold);

    position: absolute;

    z-index: 2;

    top: 160px;

    float: left;

    opacity: 0;

    margin: 0 auto;

    visibility: hidden;

    background: #fff;

    -webkit-box-shadow: 0px 8px 15px 0 rgba(150,150,150,0.25);

    -moz-box-shadow: 0px 8px 15px 0 rgba(150,150,150,0.25);

    box-shadow: 0px 8px 15px 0 rgba(150,150,150,0.25);

    left: 0;

    right: -15px;

    max-height: 235px;

    overflow: auto;

}

.section.main-sub-menus div.container > div.row > div:last-child .sub-menus-box ul.sub-menus{

    right: 0;

    left: inherit;

}

.section.main-sub-menus .sub-menus-box ul.sub-menus li {
    width: 100%;
    text-align: left;
    border-bottom: 1px solid var(--color-gray);
}

.section.main-sub-menus .sub-menus-box ul.sub-menus li a{
    width: 100%;
    float: left;
    color: #333;
    padding: 12px 16px;
    text-transform: uppercase;
    font-size: 14px;
}

.section.main-sub-menus .sub-menus-box p a::after,

.section.main-sub-menus .sub-menus-box p:hover a::after,

.section.main-sub-menus .sub-menus-box p:hover + ul.sub-menus,

.section.main-sub-menus .sub-menus-box p + ul.sub-menus {

    -webkit-transition: all .25s ease-out;

    -moz-transition: all .25s ease-out;

    -ms-transition: all .25s ease-out;

    -o-transition: all .25s ease-out;

    transition: all .25s ease-out

}

@media (max-width: 1200px){

    .section.main-sub-menus .sub-menus-box p,

    .section.main-sub-menus .sub-menus-box p a{font-size:15px}

    .section.main-sub-menus .sub-menus-box p a::after{

        background-size:15px auto;

        background-position:5px 3px

    }

}

@media (min-width: 600px) and (max-width: 991px){

    .section.main-sub-menus{

        height:auto!important;

        padding-bottom:50px!important

    }

    .section.main-sub-menus div.container > div.row > div:nth-child(3n+3) .sub-menus-box ul.sub-menus{

        left: inherit;

        right: 0;

    }

}

/*

* Hot-Products

*/

.section.hot-products h3:lang(km){

    line-height: 50px;

}

.section.hot-products .box-left,

.section.hot-products .box-right{

    width: 100%;

    float: left;

    max-height: 300px;

    border-radius: 4px;

    /*overflow: hidden;*/

}

.section.hot-products .box-left .current-exchange{

    display: block;

    /*float: left;*/

    font-size: 14px;

    margin-top: 8px;

}

.section.hot-products .box-left .hot-products-top{

    width: 100%;

    text-align: center;

    background: var(--color-gray);

    padding: 18px 0 18px;

    float: left;

}

.section.hot-products .box-left .hot-products-top img{

    max-width: 80px;

    max-height: 80px;

    margin-bottom: 5px

}

.section.hot-products .box-left .hot-products-top p{
    margin: 0 auto;
    font-size: 22px;
    font-weight: 300;
}
.section.hot-products .box-left .hot-products-top p > span{
    font-size: 16px;
}
.section.hot-products .box-left .hot-products-bottom table{
    width: 100%;
    float: left;
}

.section.hot-products .box-left .hot-products-bottom table tr{ background: var(--color-gray) }
.section.hot-products .box-left .hot-products-bottom table tr td{
    width: 30%;
    padding: 20px 25px 20px 50px;
    text-transform: uppercase;
    font-size: 22px;
    color: #333
}

.section.hot-products .box-left .hot-products-top p:lang(km),
.section.hot-products .box-left .hot-products-bottom table tr td:lang(km){
    line-height: inherit !important;
    font-size: 22px!important
}
.section.hot-products .box-left .hot-products-bottom table tr:first-child{
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}
.section.hot-products .box-left .hot-products-bottom table tr td:last-child{
    padding: 20px 50px 20px 0;
    width: 70%;
}

.section.hot-products #popular-slider .slick-dots {
    margin-bottom: 0;
    position: absolute;
    left: 30px;
    bottom: 20px;
}
.section.hot-products #popular-slider .slick-dots li {
    padding: 0 5px;
    height: 10px;
    width: 20px;
}
.section.hot-products #popular-slider .slick-dots li button {
    border: none;
    border-radius: 10px;
    background-color: var(--color-gray);
    color: rgba(0, 0, 0, 0);
    height: 10px;
    width: 10px;
}
.section.hot-products #popular-slider .slick-dots li button:focus {
    outline: none;
}
.section.hot-products #popular-slider .slick-dots li.slick-active button {
    background-color: var(--color-gold);
}

.section.hot-products .box-right{
    position: relative;
    min-height: 1px;
    height: 300px
}
.section.hot-products .box-right::before {
    width: 260px;
    height: 300px;
    content: '';
    position: absolute;
    background: var(--color-blue);
    /*z-index: 1;*/
}

.section.hot-products .box-right::after {

    width: calc(280px - -250px) ;

    content: '';

    position: absolute;

    background: url("../images/icons/FTB-Bank-001.png") no-repeat right center / auto 300px;

    height: 300px;

}

.section.hot-products .box-right img{

    display: block;

    margin: 0 auto;

    position: absolute;

    right: 0;

}

.section.hot-products .box-right .box-right-text{

    position: absolute;

    left: 30px;

    max-width: 274px;

    z-index: 1;

    top: 50%;

    transform: translateY(-50%);

    color: var(--color-gray);

}

.section.hot-products .box-right .box-right-text h3{

    font-size:26px;

    line-height: 32px;

}

.section.hot-products .box-right .box-right-text h3:lang(km){

    font-size: 24px;

    line-height: 36px;

}

@media (max-width: 1500px){

    .section.hot-products .box-right .box-right-text{

        max-width: 274px;

    }

}

@media (max-width: 1150px){

    .section.hot-products .box-left .hot-products-bottom table tr td{

        padding: 20px 25px 20px 25px;

    }

    .section.hot-products .box-left .hot-products-bottom table tr td:last-child{

        padding: 20px 25px 20px 0;

    }

}

@media (max-width: 991px){

    .section.hot-products .box-left .hot-products-top,

    .section.hot-products .box-left .hot-products-bottom{

        width: 50%;

        float: left;

        min-height: 169px;

    }

    .section.hot-products .box-left .hot-products-bottom table tr{

        height: 80px;

        background: var(--color-blue);

    }

    .section.hot-products .box-left .hot-products-bottom table tr:last-child{border-top:1px solid var(--color-gray)}

    .section.hot-products .box-left .hot-products-bottom table tr td{

        color:#fff;

        padding: 26px 0 25px 30px;

        width: 50%;

    }

    .section.hot-products .box-left .hot-products-bottom table tr td:last-child{

        width: 50%;

        padding:26px 30px 25px 0

    }

    .section.hot-products .box-left{ margin-bottom: 30px}

    /*.section.hot-products .box-right::before{width: 220px}*/

    /*.section.hot-products .box-right::after{width:calc(280px - -200px)}*/



}

/*

* Mobile App

*/

.content .section.mobile-app{

    position: relative;

    padding: 120px 0 0 0 !important;

}

.section.mobile-app > .app-info{

    background:var(--color-gray);

    padding:50px 0

}

.section.mobile-app > .app-info .app-info-text{

    color:#333;

    padding-left:20px;

    min-height:112px

}

.section.mobile-app > .app-info:first-child .app-info-img {

    position: absolute;

    left: 15px;

    /*width: 100%;*/

    float: left;

    top: -153px;

}

.section.mobile-app > .app-info .app-info-text table tr:first-child td img{max-height:120px}

.section.mobile-app > .app-info .app-info-text table tr:last-child td img,

.section.mobile-app > .app-info .app-info-text table tr td:nth-child(3) img{max-height:60px}

.section.mobile-app > .app-info .app-info-text h3{color:var(--color-blue)}

.section.mobile-app > .app-info:last-child .app-info-text{color:#fff}

.section.mobile-app > .app-info:last-child{

    padding: 40px 0;

    background: url("../images/icons/FTB-Bank-003.png") no-repeat center / auto 100%;

}

.section.mobile-app > .app-info:last-child .app-info-text p{margin-bottom:30px}

.section.mobile-app > .app-info:last-child .app-info-text table tr:first-child td:nth-child(2){padding:0 50px}

@media (max-width: 991px){

    .content .section.mobile-app{padding:60px 0 0 0!important}

    .section.mobile-app > .app-info .app-info-text{padding-left:20px}

    .section.mobile-app > .app-info .app-info-text table tr:first-child td img{max-height:80px}

    .section.mobile-app > .app-info .app-info-text table tr:last-child td img,

    .section.mobile-app > .app-info .app-info-text table tr td:nth-child(3) img{max-height:40px}

    .section.mobile-app > .app-info:first-child .app-info-img {top: -115px;}

    .section.mobile-app > .app-info,

    .section.mobile-app > .app-info:last-child{padding:25px 0}

    .section.mobile-app > .app-info:last-child{height:auto}

    .section.mobile-app > .app-info:last-child .app-info-text p{margin-bottom:20px}

}

@media (max-width: 768px){

    .section.mobile-app > .app-info:first-child .app-info-img{top:-72px !important}

    .section.mobile-app > .app-info,

    .section.mobile-app > .app-info:last-child{padding:40px 0}

    /*.section.mobile-app > .app-info .app-info-text table{margin:0 auto}*/

    .section.hot-products .box-left .hot-products-bottom table tr td{

        width: 30%;

    }

    .section.hot-products .box-left .hot-products-bottom table tr td:last-child{

        width: 70%;

    }

    

}