@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,300;0,500;0,600;0,700;1,300;1,500&display=swap";:root {
    --main-bg-color: #e7be71;
}

@font-face {
    font-family: Be;
    src: url(../fonts/font_all/BeVietnam-Regular.ttf)
}

@font-face {
    font-family: Be-bold;
    src: url(../fonts/font_all/BeVietnam-Bold.ttf)
}

@font-face {
    font-family: Oswald;
    src: url(../fonts/font_all/Oswald-Regular.ttf)
}

@font-face {
    font-family: font_Cafeta;
    src: url(../fonts/font_all/UTMCafeta.ttf)
}

@font-face {
    font-family: HelveticaVn-LtCn;
    src: url(../fonts/font_all/HelveticaVn-LtCn.ttf)
}

@font-face {
    font-family: HelveticaVn-BlkCn;
    src: url(../fonts/font_all/HelveticaVn-BlkCn.ttf)
}

@font-face {
    font-family: Open-Sans;
    src: url(../fonts/font_all/kid/OpenSans-Regular.ttf)
}

@font-face {
    font-family: FuturaBk-Bold;
    src: url(../fonts/font_all/FuturaBk-Bold.TTF)
}

@font-face {
    font-family: URW-DIN-Arabic;
    src: url(../fonts/font_all/URW-DIN-Arabic.ttf)
}

/*Start font URW-DIn-Arbic*/
    @font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Medium.eot');
    src: local('URW DIN SemiCond Medium'), local('URWDINSemiCond-Medium'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Medium.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Medium.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-MediumItalic.eot');
    src: local('URW DIN Medium Italic'), local('URWDIN-MediumItalic'),
        url('../fonts/font_URWDIN/URWDIN-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-MediumItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-MediumItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Regular.eot');
    src: local('URW DIN SemiCond Regular'), local('URWDINSemiCond-Regular'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Regular.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Regular.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-LightItalic.eot');
    src: local('URW DIN SemiCond Light Italic'), local('URWDINSemiCond-LightItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-LightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-LightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-MediumItalic.eot');
    src: local('URW DIN Cond Medium Italic'), local('URWDINCond-MediumItalic'),
        url('../fonts/font_URWDIN/URWDINCond-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-MediumItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-MediumItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-XLight.eot');
    src: local('URW DIN XLight'), local('URWDIN-XLight'),
        url('../fonts/font_URWDIN/URWDIN-XLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-XLight.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-XLight.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-XLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-XLightItalic.eot');
    src: local('URW DIN Cond XLight Italic'), local('URWDINCond-XLightItalic'),
        url('../fonts/font_URWDIN/URWDINCond-XLightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-XLightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-XLightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-XLightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Italic.eot');
    src: local('URW DIN Italic'), local('URWDIN-Italic'),
        url('../fonts/font_URWDIN/URWDIN-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Italic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Italic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-LightItalic.eot');
    src: local('URW DIN Light Italic'), local('URWDIN-LightItalic'),
        url('../fonts/font_URWDIN/URWDIN-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-LightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-LightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-LightItalic.eot');
    src: local('URW DIN Cond Light Italic'), local('URWDINCond-LightItalic'),
        url('../fonts/font_URWDIN/URWDINCond-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-LightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-LightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-ThinItalic.eot');
    src: local('URW DIN Cond Thin Italic'), local('URWDINCond-ThinItalic'),
        url('../fonts/font_URWDIN/URWDINCond-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-ThinItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-ThinItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Thin.eot');
    src: local('URW DIN Thin'), local('URWDIN-Thin'),
        url('../fonts/font_URWDIN/URWDIN-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Thin.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Thin.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-BlackItalic.eot');
    src: local('URW DIN Cond Black Italic'), local('URWDINCond-BlackItalic'),
        url('../fonts/font_URWDIN/URWDINCond-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-BlackItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-BlackItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-BlackItalic.eot');
    src: local('URW DIN SemiCond Black Italic'), local('URWDINSemiCond-BlackItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BlackItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BlackItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Black.eot');
    src: local('URW DIN SemiCond Black'), local('URWDINSemiCond-Black'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Black.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Black.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Black.eot');
    src: local('URW DIN Cond Black'), local('URWDINCond-Black'),
        url('../fonts/font_URWDIN/URWDINCond-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Black.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Black.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Regular.eot');
    src: local('URW DIN Regular'), local('URWDIN-Regular'),
        url('../fonts/font_URWDIN/URWDIN-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Regular.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Regular.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Bold.eot');
    src: local('URW DIN Cond Bold'), local('URWDINCond-Bold'),
        url('../fonts/font_URWDIN/URWDINCond-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Bold.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Bold.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Bold.eot');
    src: local('URW DIN Bold'), local('URWDIN-Bold'),
        url('../fonts/font_URWDIN/URWDIN-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Bold.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Bold.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-ThinItalic.eot');
    src: local('URW DIN Thin Italic'), local('URWDIN-ThinItalic'),
        url('../fonts/font_URWDIN/URWDIN-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-ThinItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-ThinItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Thin.eot');
    src: local('URW DIN SemiCond Thin'), local('URWDINSemiCond-Thin'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Thin.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Thin.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-BoldItalic.eot');
    src: local('URW DIN Bold Italic'), local('URWDIN-BoldItalic'),
        url('../fonts/font_URWDIN/URWDIN-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-BoldItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-BoldItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Regular.eot');
    src: local('URW DIN Cond Regular'), local('URWDINCond-Regular'),
        url('../fonts/font_URWDIN/URWDINCond-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Regular.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Regular.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-DemiItalic.eot');
    src: local('URW DIN SemiCond Demi Italic'), local('URWDINSemiCond-DemiItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-DemiItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-DemiItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-DemiItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-DemiItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-XLightItalic.eot');
    src: local('URW DIN SemiCond XLight Italic'), local('URWDINSemiCond-XLightItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Demi.eot');
    src: local('URW DIN Demi'), local('URWDIN-Demi'),
        url('../fonts/font_URWDIN/URWDIN-Demi.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Demi.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Demi.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Demi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Bold.eot');
    src: local('URW DIN SemiCond Bold'), local('URWDINSemiCond-Bold'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Bold.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Bold.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-XLight.eot');
    src: local('URW DIN Cond XLight'), local('URWDINCond-XLight'),
        url('../fonts/font_URWDIN/URWDINCond-XLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-XLight.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-XLight.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-XLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Black.eot');
    src: local('URW DIN Black'), local('URWDIN-Black'),
        url('../fonts/font_URWDIN/URWDIN-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Black.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Black.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Medium.eot');
    src: local('URW DIN Medium'), local('URWDIN-Medium'),
        url('../fonts/font_URWDIN/URWDIN-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Medium.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Medium.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Italic.eot');
    src: local('URW DIN SemiCond Italic'), local('URWDINSemiCond-Italic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Italic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Italic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-Light.eot');
    src: local('URW DIN Light'), local('URWDIN-Light'),
        url('../fonts/font_URWDIN/URWDIN-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-Light.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-Light.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-XLightItalic.eot');
    src: local('URW DIN XLight Italic'), local('URWDIN-XLightItalic'),
        url('../fonts/font_URWDIN/URWDIN-XLightItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-XLightItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-XLightItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-XLightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Thin.eot');
    src: local('URW DIN Cond Thin'), local('URWDINCond-Thin'),
        url('../fonts/font_URWDIN/URWDINCond-Thin.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Thin.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Thin.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-BoldItalic.eot');
    src: local('URW DIN Cond Bold Italic'), local('URWDINCond-BoldItalic'),
        url('../fonts/font_URWDIN/URWDINCond-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-BoldItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-BoldItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Demi.eot');
    src: local('URW DIN SemiCond Demi'), local('URWDINSemiCond-Demi'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Demi.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Demi.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Demi.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Demi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-BlackItalic.eot');
    src: local('URW DIN Black Italic'), local('URWDIN-BlackItalic'),
        url('../fonts/font_URWDIN/URWDIN-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-BlackItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-BlackItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-Light.eot');
    src: local('URW DIN SemiCond Light'), local('URWDINSemiCond-Light'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Light.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Light.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-XLight.eot');
    src: local('URW DIN SemiCond XLight'), local('URWDINSemiCond-XLight'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLight.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLight.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLight.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-XLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-ThinItalic.eot');
    src: local('URW DIN SemiCond Thin Italic'), local('URWDINSemiCond-ThinItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-ThinItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-ThinItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-ThinItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Demi.eot');
    src: local('URW DIN Cond Demi'), local('URWDINCond-Demi'),
        url('../fonts/font_URWDIN/URWDINCond-Demi.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Demi.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Demi.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Demi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-MediumItalic.eot');
    src: local('URW DIN SemiCond Medium Italic'), local('URWDINSemiCond-MediumItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-MediumItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-MediumItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN SemiCond';
    src: url('../fonts/font_URWDIN/URWDINSemiCond-BoldItalic.eot');
    src: local('URW DIN SemiCond Bold Italic'), local('URWDINSemiCond-BoldItalic'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BoldItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BoldItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINSemiCond-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Medium.eot');
    src: local('URW DIN Cond Medium'), local('URWDINCond-Medium'),
        url('../fonts/font_URWDIN/URWDINCond-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Medium.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Medium.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Light.eot');
    src: local('URW DIN Cond Light'), local('URWDINCond-Light'),
        url('../fonts/font_URWDIN/URWDINCond-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Light.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Light.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url('../fonts/font_URWDIN/URWDIN-DemiItalic.eot');
    src: local('URW DIN Demi Italic'), local('URWDIN-DemiItalic'),
        url('../fonts/font_URWDIN/URWDIN-DemiItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDIN-DemiItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDIN-DemiItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDIN-DemiItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-Italic.eot');
    src: local('URW DIN Cond Italic'), local('URWDINCond-Italic'),
        url('../fonts/font_URWDIN/URWDINCond-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-Italic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-Italic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'URW DIN Cond';
    src: url('../fonts/font_URWDIN/URWDINCond-DemiItalic.eot');
    src: local('URW DIN Cond Demi Italic'), local('URWDINCond-DemiItalic'),
        url('../fonts/font_URWDIN/URWDINCond-DemiItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/font_URWDIN/URWDINCond-DemiItalic.woff2') format('woff2'),
        url('../fonts/font_URWDIN/URWDINCond-DemiItalic.woff') format('woff'),
        url('../fonts/font_URWDIN/URWDINCond-DemiItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
/*End font URW-DIn-Arbic*/

/*@font-face {
    font-family: VNF-Futura-Regular;
    src: url(./ResourceWeb/data/data/fonts/VNF-Futura-20Regular.ttf)
}*/

/*@font-face {
    font-family: iCielAltusSerif;
    src: url(./ResourceWeb/data/data/fonts/iCielAltusSerif.otf)
}*/

.font-content {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.App {
    /* font-family: font_Cafeta,Helvetica,Arial; */
    background-color: #fff;
    font-size: 18px;
    color: #111;
    font-weight: 300;
    min-width: 300px;
    font-family: 'Mulish', sans-serif;
    font-family: 'Be Vietnam Pro';
}

.App .back-drop {
    display: none
}

.App .back-drop.open {
    display: block
}

.App .btn-group {
    position: relative;
    display: inline-flex;
    vertical-align: middle
}

.App .dropdown-menu.show {
    display: block
}

.App .nav-link {
    display: block;
    padding: .5rem 1rem
}

.App .nav-link img {
    width: 100%
}

.ant-message {
    top: 9px
}

.ant-message .ant-message-notice {
    padding: 0
}

.ant-message .ant-message-notice .ant-message-notice-content {
    border-radius: 0;
    border: 1px solid #ccc;
    background-color: #f3afb3;
    width: 100%;
    max-width: 500px;
    text-align: left
}

.ant-message .ant-message-notice .ant-message-notice-content .ant-message-custom-content {
    font-size: 20px;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    color: #1b1b1b
}

.ant-message .ant-message-notice .ant-message-notice-content .ant-message-custom-content i {
    width: 15px;
    font-size: 20px;
    top: 0;
    width: 20px
}

.dropdown-custom {
    width: 100%;
    position: relative
}

.dropdown-custom .btn-custom {
    text-transform: uppercase;
    width: 100%;
    border: none;
    font-size: 22px;
    font-family: font_Cafeta;
    border-radius: 0;
    background: #fc3;
    box-shadow: none;
    padding: 8px 5px;
    text-align: center;
    cursor: pointer
}

.dropdown-custom .btn-custom:after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: 0;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
    font-size: 45px
}

.dropdown-custom ul {
    width: 100%;
    padding: 0
}

.dropdown-custom ul li {
    font-size: 25px;
    font-family: font_Cafeta;
    border-bottom: 1px solid #ccc;
    text-transform: uppercase;
    cursor: pointer
}

.dropdown-custom ul li:hover {
    background-color: #3f3f3f;
    color: #fff
}

.dropdown-menu {
    max-height: 400px;
    overflow-y: auto;
    top: 100%;
    left: 0;
    will-change: transform;
    position: absolute;
    z-index: 1000;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #1b1b1b;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15)
}

.dropdown-menu .dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0
}

@media screen and (min-width: 767px) {
    .ant-notification {
        margin-left:50%!important;
        transform: translateX(-50%)
    }
}

.ant-notification {
    width: 100%!important;
    max-width: 500px!important;
    left: 0;
    top: 0!important
}

.ant-notification .ant-notification-notice {
    border-radius: 0;
    padding: 12px;
    width: auto
}

.ant-notification .ant-notification-notice .ant-notification-notice-content {
    color: #000;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-message {
    font-weight: 600
}

.ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-description,.ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-message {
    font-size: 18px;
    margin-left: 40px
}

.ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-close {
    right: 15px
}

.ant-notification .error {
    background: #f3afb3
}

.ant-notification .success {
    background: rgba(166,239,184,.9)
}

.ant-notification .ant-notification-hook-holder,.ant-notification .ant-notification-notice {
    max-width: 100%
}

.ant-notification .error-location {
    background-color: #fdf4b6
}

.ant-notification .error-location.ant-notification-notice .ant-notification-notice-content {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    color: #222
}

.ant-notification .error-location.ant-notification-notice .ant-notification-notice-description {
    margin-left: 0;
    padding: 0 15px;
    font-size: 14px;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .ant-notification .error-location.ant-notification-notice .ant-notification-notice-description {
        font-size:16px
    }
}

.ant-notification .error-location .ant-notification-notice-close {
    right: 10px;
    top: 5px
}

.ant-notification .error-location__icon img {
    width: 16px;
    height: 16px
}

.ant-modal-title {
    font-family: Oswald;
    font-size: 22px
}

.background-spin {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: rgba(0,0,0,.45)
}

.background-spin .ant-spin .ant-spin-dot-item {
    background: #fc3
}

.background-spin .ant-spin-text {
    color: #fc3
}

.background-spin .center-middle {
    top: 45%;
    border-radius: 50%
}

.loading {
    width: 55px;
    height: 55px;
    background: #fff
}

.fixed {
    position: fixed
}

.flex {
    display: flex
}

.relative {
    position: relative
}

.absolute {
    position: absolute
}

.space-between {
    justify-content: space-between
}

.item-center {
    align-items: center
}

.item-baseline {
    align-items: baseline
}

.content-center-middle {
    display: flex;
    justify-content: center;
    align-items: center
}

.center-middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

.ant-tabs-nav {
    margin-bottom: 0!important
}

@media screen and (max-width: 768px) {
    .dropdown-custom .btn-custom {
        font-size:6.1vw
    }

    .ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-description,.ant-notification .ant-notification-notice .ant-notification-notice-content .ant-notification-notice-message {
        font-size: 4.5vw
    }
    .layout__banner .banner__wrapper{
        min-height: 3em;
        /* background: linear-gradient(to bottom, rgba(1, 1, 1, 1) 0%, rgba(1, 1, 1, 1) 80%); */
        bottom: 0px !important;
        background: rgba(1, 1, 1, 0.6);
        padding: 1% 0 1% 0 !important;
    }
    .mobile_hidden{
        display: none;
    }
    .footer-bottom {
    display: inline-block;
    margin-bottom: 35px;
    width: 100%;
    }
    .nav-bar .menu-item-text{
        font-family: Oswald !important;
    }
}

.ant-modal-content {
    border-radius: 0!important
}

.ant-modal-content .ant-modal-header {
    padding: 10px 24px;
    background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
    background: initial;
    font-family: Oswald
}

.ant-modal-content .ant-modal-body {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    color: #111;
    font-size: 16px
}

.ant-modal-content .ant-modal-close-x {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center
}

.ant-modal-content .ant-modal-close-x img {
    margin: auto
}

.see-all {
    font-size: 14px;
    font-family: HelveticaVn-LtCn;
    font-weight: 700;
    cursor: pointer;
    color: #111
}

.btn-color-1 {
    background-color: #00113d !important;
    /* background: linear-gradient(-45deg, #014258, #014258, #014258, #014258); */
    color: #e7be71!important;
}

.btn-color-1,.btn-color-1:active {
    border-color: #500400 !important;
    border-color: var(--main-bg-color)!important;
}

.btn-color-1:active {
    background-color: #ccc!important
}

.btn-color-1:focus {
    background-color: #fc3!important;
    background-color: var(--main-bg-color)!important
}

.btn-color-1:focus,.btn-color-1:hover {
    border-color: #fc3!important;
    border-color: var(--main-bg-color)!important
}

.btn-color-1:hover {
    background-color: #000;
    color: #000!important
}

.shadown {
    box-shadow: 0 1px 6px 0 rgba(32,33,36,.28)
}

.bg-30s {
    background-color: #fc3
}

.cl-30s {
    color: #fc3
}

.cl-white {
    color: #fff
}

.cl-ccc {
    color: #ccc
}

.bg-e8 {
    background-color: #e8e8e8
}

.bg-ccc {
    background-color: #ccc
}

.br-2 {
    border-radius: 2px
}

.br-4 {
    border-radius: 4px
}

.w-100 {
    width: 100%
}

.placehoder {
    background-color: #e3e3e3
}

.mg-10 {
    margin: 10px
}

.mg-top-20 {
    margin-top: 20px
}

.mg-top-10 {
    margin-top: 10px
}

.mg-top-15 {
    margin-top: 15px
}

.mg-left-15 {
    margin-left: 15px
}

.mg-right-15 {
    margin-right: 15px
}

.mb-30 {
    margin-bottom: 30px
}

.padding-5 {
    padding: 5px
}

.padding-10 {
    padding: 10px
}

.padding-8 {
    padding: 8px
}

.h1 {
    font-size: 20px;
    font-family: Oswald
}

.h2 {
    font-size: 18px
}

.h3 {
    font-size: 16px
}

.h4 {
    font-size: 14px
}

.bold {
    font-weight: 700
}

.btn {
    font-family: Oswald
}

.btn,.pointer {
    cursor: pointer
}

.f-be {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.f-oswald {
    font-family: Oswald
}

.fb_dialog {
    z-index: 90!important
}

#fb-root {
    height: 0;
    overflow: hidden
}

.bot-message {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    background: #ebf7ef;
    border: 1px solid #c1e4ca;
    box-sizing: border-box;
    border-radius: 8px;
    width: calc(100% + 40px);
    z-index: 1;
    margin-left: -30px;
    padding: 8px
}

.bot-message__normal {
    width: 100%;
    margin-left: 0
}

.bot-message__reception {
    flex-direction: row-reverse
}

.bot-message__reception img {
    margin-right: 0!important;
    border-radius: 18px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    margin-left: 5px
}

.bot-message__reception .avatar {
    width: 55px;
    display: flex
}

.bot-message__reception .avatar .reception-avatar {
    display: inline-block;
    background-color: #f7f7f7;
    width: 55px;
    height: 55px;
    background-size: cover;
    background-position: top;
    border-radius: 18px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15)
}

.bot-message__reception .content {
    width: auto
}

.bot-message .content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start
}

.bot-message .content__header {
    text-align: left
}

.bot-message .content__header .label {
    font-weight: 700;
    color: #3d3d3d;
    font-size: 14px
}

.bot-message .content__header .name {
    font-size: 14px
}

.bot-message .content p,.bot-message .content span {
    text-align: left
}

.bot-message img {
    width: 55px;
    height: 100%;
    margin-right: 10px;
    border-radius: 18px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15)
}

.bot-message p,.bot-message span {
    padding: 0 5px;
    font-weight: 300;
    font-size: 12px;
    margin: 0
}

.bot-message p,.bot-message span,.f-be-pro {
    font-family: URW-DIN-Arabic,sans-serif
}

.bg-f7f7f7 {
    background-color: #f7f7f7
}

.border-f7f7f7 {
    border-color: #f7f7f7
}

.color-a3a3a3 {
    color: #a3a3a3
}

.color-111111 {
    color: #111
}

.color-red-f46969 {
    color: #f46969
}

.border-red-f46969 {
    border-color: #f46969
}

.bg-red-ea1601 {
    background-color: #ea1601
}

.ping-fast {
    animation: ping .5s cubic-bezier(0,0,.2,1) infinite
}

.bg-green-eaf6ee {
    background-color: #eaf6ee
}

.border-gray-bababa {
    border-color: #bababa
}

.bg-red-fd8b7c {
    background-color: #fd8b7c
}

.bg-green-11b14b {
    background-color: #11b14b
}

.color-green-11b14b {
    color: #11b14b
}

.border-gray-e8 {
    border-color: #e8e8e8
}

.bg-gray-e8 {
    background-color: #e8e8e8
}

.border-gray-d1 {
    border-color: #d1d1d1
}

.border-gray-a3 {
    border-color: #a3a3a3
}

.bg-FFF4B6 {
    background-color: #fff4b6
}

img {
    display: inline
}

.layout {
    /* font-family: 'URW-DIN-Arabic',sans-serif; */
    font-weight: 300;
    background-color: #fff;
    margin: 40px 0 30px;
    /* font-family: 'Mulish', sans-serif; */
    font-family: be vietnam pro,sans-serif;
}

.layout__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 15px;
}

.layout__head .head__title {
    font-family: Oswald;
    font-weight: 500;
    font-size: 24px;
    margin-bottom: 8px;
    /* text-transform: uppercase; */
    /* color: #DA0530; */
    /* font-family: 'URW-DIN-Arabic'; */
    /* font-family: 'Mulish', sans-serif; */
    color: #00113d;
}

.head__title {}

.layout__head .head__sub-title {
    font-size: 15px;
    color: #a6a6a6;
    text-transform: none;
    /* font-family: URW-DIN-Arabic,sans-serif; */
    font-weight: 300;
    /* font-family: URW DIN; */
    font-family: be vietnam pro,sans-serif;
}

.layout__head .head__text-view-all {
    align-self: center;
    color: #A8232E;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    cursor: pointer;
    display: flex;
    align-items: baseline
}

.layout__head .head__text-view-all span {
    display: none
}

.layout__head .head__text-view-all img {
    margin-left: 12px;
    height: 12px
}

.layout__head .head__text-view-all:hover {
    text-decoration: underline
}

.layout__banner {
    margin-bottom: 10px;
    position: relative;
    text-align: center
}

.layout__banner .banner__media {
    border-radius: 4px;
    overflow: hidden
}

.layout__banner .banner__wrapper {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    color: #fff;
    z-index: 3;
    padding: 0 5px
}

.layout__banner .banner__title {
    /* font-family: Oswald; */
    font-weight: 500;
    font-size: 18px;
}

.layout__banner .banner__text {
    font-size: 14px
}

.layout__banner .banner__button {
    background: #fc3;
    color: #000;
    border-radius: 4px;
    padding: 6px 30px;
    display: inline-block;
    margin-top: 20px;
    font-size: 12px;
    cursor: pointer;
    font-weight: 600;
    transition: all .3s
}

.layout__list .list__item {
    padding: 12px 0px 12px 20px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    position: relative
}

.list__item_not_left_not_right {
    margin-left: -15px !important;
    margin-right: -15px !important;
}

.list__padding_format {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.layout__list .list__item:before {
    content: "";
    background-image: url(../images/chevronRightV3.aee16f24.svg);
    background-size: contain;
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 5px
}

.layout__list .list__item .item__media {
    margin-right: 15px;
    flex: 0 0 80px;
    height: 100%;
    border-radius: 4px;
    position: relative;
    overflow: hidden
}

.layout__list .list__item .item__media img {
    width: 100%
}

.layout__list .list__item .item__media:before {
    transition: all .3s ease-in;
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 40
}

.layout__list .list__item .item__title {
    /* color: #DA0530; */
    font-weight: 600;
    font-size: 18px;
    color: #00113d;
}

.layout__list .list__item .item__subTitle,.layout__list .list__item .item__title {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.layout__list .list__item .item__subTitle {
    color: #686868;
    font-weight: 300;
}

.layout__list .list__item .item__content {
    display: flex;
    align-self: center;
    flex-flow: column
}

.layout__blog {
    position: relative
}

.layout__blog .blog__media {
    /* border-radius: 5px; */
    overflow: hidden;
}

.layout__blog .blog__media img {
    transition: all .2s ease-in-out;
    width: 100%;
    /* max-height: 400px; */
    border-radius: 10px;
}

.layout__blog .blog__title {
    color: #014258;
    font-weight: 500;
    font-size: 16px;
    padding-top: 1em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: be vietnam pro,sans-serif;
}

.layout__blog .blog__subTitle {
    color: #686868;
    font-size: 14px;
}

.layout .swiper_button {
    display: none;
}
.layout .swiper_button:after{
    font-size: 12px;
        display: flex
}

.layout .border-none {
    border: none
}

.layout .container {
    max-width: 1200px;
    padding: 0 15px;
    margin: auto;
    width: 100%
}

@media(min-width: 768px) {
    .layout {
        margin:40px 0
    }

    .layout__head {
        padding: 0 0 20px
    }

    .layout__head .head__title {
        font-size: 28px;
    }

    .layout__head .head__sub-title {
        font-size: 18px;
        color: #500400;
        margin-bottom: 15px;
    }

    .layout__head .head__text-view-all span {
        display: block
    }

    .layout__banner {
        margin-bottom: 20px
    }

    .layout__banner .banner__media {
        border-radius: 8px
    }

    .layout__banner .banner__media img {
        transition: all .2s ease-in-out
    }

    .layout__banner .banner__wrapper {
        bottom: 0%;
        width: 100%;
        padding: 1% 0% 1% 0%;
        /* background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(1, 1, 1, 1) 80%); */
        background: rgba(1, 1, 1, 0.6);
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .layout__banner .banner__title {
        font-size: 30px;
    }

    .layout__banner .banner__text {
        font-size: 16px;
    }

    .layout__banner .banner__button {
        padding: 12px 30px;
        font-size: 16px;
        border-radius: 8px
    }

    .layout__banner .banner__button:hover {
        background-color: #f7d778
    }

    .layout__banner.hover .banner__media:hover img {
        transform: scale(1.04)
    }

    .layout__list .list__item {
        border-top: 0;
        padding-right: 0
    }

    .layout__list .list__item:hover img {
        transform: scale(1.1)
    }

    .layout__list .list__item:before {
        content: none
    }

    .layout__list .list__item .item__media {
        flex: 0 0 100px;
        border-radius: 8px
    }

    .layout__list .list__item .item__media img {
        transition: all .2s ease-in-out
    }

    .layout__list .list__item .item__title span {
        display: block
    }

    .layout__blog .blog:hover img {
        transform: scale(1.05)
    }

    .layout__blog .blog__media {
        border-radius: 5px;
    }

    .layout__blog .blog__title {
        color: #00113d;
        font-size: 18px;
        /* font-weight: bold; */
        margin-bottom: 0px;
        line-height: 23px;
        text-transform: uppercase;
    }

    .layout__blog .blog__subTitle {
        font-size: 14px;
        font-weight: 300;
    }

    .layout .swiper_button {
        position: absolute;
        z-index: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: rgba(95,95,95,.7);
        color: #fff;
        cursor: pointer;
        border-color: transparent
    }
    .layout .swiper_button .swiper-button-next:after, .swiper-button-prev:after{
        font-size: 12px;
        display: flex
    }

    .layout .swiper_button .swiper_button_icon {
        font-size: 12px;
        display: flex
    }

    .layout .swiper_button.button_prev {
        top: calc(50% - 20px);
        left: -20px
    }

    .layout .swiper_button.button_next {
        top: calc(50% - 20px);
        right: -20px
    }

    .layout .swiper_button_disable {
        background-color: #d1d1d1;
        color: #5f5f5f;
        cursor: not-allowed
    }

    .layout .swiper_button_disable:hover {
        color: #5f5f5f;
        border-color: transparent
    }
}

.top-product-v2 .swiper-pagination-progressbar {
    background-color: #3d3d3d
}

.top-product-v2 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background-color: #fc3
}

.top-product-v2 .top_product_v2_wrap {
    position: relative;
    margin-top: 24px;
    background: #fff;
    color: #000
}

.top-product-v2 .top_product_v2_wrap .top_product_content {
    padding-top: 8px
}

.top-product-v2 .top_product_v2_wrap .top_product_content:hover .top_product_button_sell {
    opacity: .8
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_image {
    position: relative;
    padding-top: 100%;
    height: auto
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_image img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    object-fit: cover
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des {
    padding: 16px
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_title {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    height: 52px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_price_sale {
    font-family: Oswald;
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 0
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_price {
    font-family: Oswald;
    font-size: 14px;
    color: #767676;
    margin-bottom: 0;
    margin-left: 8px;
    -webkit-text-decoration-line: line-through;
    text-decoration-line: line-through
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_button_sell {
    color: #000;
    background-color: #fc3;
    padding: 8px 24px;
    cursor: pointer
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_button_sell:hover {
    opacity: .8
}

.top-product-v2 .top_product_v2_wrap .top_product_content .top_product_button_sell .top_product_button_sell_text {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 0;
    text-transform: uppercase
}

@media screen and (max-width: 1200px) {
    .top-product-v2 .top_product_v2_wrap {
        margin-top:24px
    }

    .top-product-v2 .top_product_v2_wrap:after {
        padding-bottom: 0
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content {
        position: relative
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des {
        padding: 12px
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_title {
        font-size: 14px;
        line-height: 22px;
        height: 44px;
        margin-bottom: 5px
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_price_sale {
        font-size: 18px
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_des .top_product_des_price {
        font-size: 12px
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_button_sell {
        padding: 8px 12px
    }

    .top-product-v2 .top_product_v2_wrap .top_product_content .top_product_button_sell .top_product_button_sell_text {
        font-size: 14px
    }
}

.home_store_v2 {
    background-color: #fff;
    margin: 40px 0
}

.home_store_v2 .home_store_container {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    padding: 0 15px
}

.home_store_v2 .home_store_container .home_store_title {
    margin-bottom: 30px;
    align-items: center;
    cursor: pointer
}

.home_store_v2 .home_store_container .home_store_title .title {
    font-family: Oswald;
    font-weight: 700;
    font-size: 24px;
    line-height: 36px;
    display: block;
    text-transform: uppercase
}

.home_store_v2 .home_store_container .home_store_title .title__description {
    font-size: 16px;
    color: #a6a6a6;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.home_store_v2 .home_store_container .home_store_title .pointer {
    margin-bottom: 0;
    font-weight: 700
}

.home_store_v2 .home_store_container .button-more {
    display: flex;
    align-items: center;
    cursor: pointer
}

.home_store_v2 .home_store_container .button-more span {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 18px;
    font-style: italic;
    text-decoration: underline
}

.home_store_v2 .home_store_container .button-more img {
    width: 28px;
    height: 28px
}

.home_store_v2 .home_store_container .home_store_banner>img {
    width: 100%
}

.home_store_v2 .home_store_container .home_store_banner__service {
    display: flex;
    align-items: center;
    justify-content: center
}

.home_store_v2 .home_store_container .home_store_banner__service .service-item {
    margin-top: 15px;
    display: flex;
    align-items: center
}

.home_store_v2 .home_store_container .home_store_banner__service .service-item:not(:last-child) {
    margin-right: 50px
}

.home_store_v2 .home_store_container .home_store_banner__service .service-item img {
    width: 24px;
    height: 24px;
    margin-right: 3px
}

.home_store_v2 .home_store_container .home_store_banner__service .service-item span {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 16px
}

.home_store_v2 .home_store_container .home_store_top_content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    margin-bottom: 8px;
    position: relative
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_title {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 0
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button {
    width: 40px;
    height: 40px;
    background: #000;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button:first-child {
    margin-right: 8px
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button:hover {
    color: #40a9ff
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button .store_icon_button {
    font-size: 12px;
    display: flex
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_left_button {
    left: -20px
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_right_button {
    right: -20px
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button_disable {
    background: #f5f5f5;
    color: #5f5f5f;
    cursor: not-allowed;
    border: none
}

.home_store_v2 .home_store_container .home_store_top_content .home_store_top_button_disable:hover {
    color: #5f5f5f;
    border-color: transparent
}

.home_store_v2 .home_store_container .home_store_button {
    background-color: #fc3;
    border-radius: 4px;
    padding: 10px;
    max-width: 570px;
    margin: 24px auto auto;
    text-align: center
}

.home_store_v2 .home_store_container .home_store_button a {
    font-family: Oswald;
    font-weight: 600;
    font-size: 18px;
    text-transform: uppercase;
    color: #000
}

.home_store_v2 .home_store_container .home_store_button:hover {
    cursor: pointer;
    opacity: .7
}

.item-end {
    align-items: flex-end
}

@media screen and (max-width: 768px) {
    .home_store_v2 {
        margin:30px 0
    }

    .home_store_v2 .home_store_container .home_store_title {
        padding: 0 15px
    }

    .home_store_v2 .home_store_container .home_store_top_content .home_store_top_title {
        font-weight: 700
    }

    .home_store_v2 .home_store_container .home_store_button {
        margin-top: 40px
    }

    .home_store_v2 .home_store_container .button-more span {
        display: none
    }
}

@media screen and (max-width: 1024px) {
    .home_store_v2 .home_store_container .home_store_title {
        padding:0 15px
    }

    .home_store_v2 .home_store_container .home_store_top_content .home_store_top_title {
        font-weight: 700
    }

    .home_store_v2 .home_store_container .home_store_button {
        margin-top: 40px
    }
}

@media screen and (max-width: 480px) {
    .home_store_v2 .home_store_container .home_store_top_content .home_store_top_button {
        display:none
    }

    .home_store_v2 .home_store_container .home_store_banner__service .service-item {
        margin-top: 5px
    }

    .home_store_v2 .home_store_container .home_store_banner__service .service-item:not(:last-child) {
        margin-right: 15px
    }

    .home_store_v2 .home_store_container .home_store_banner__service .service-item img {
        width: 15px;
        height: 15px
    }

    .home_store_v2 .home_store_container .home_store_banner__service .service-item span {
        font-size: 10px
    }
}

.media {
    padding-bottom: 30px
}

.media__head {
    padding: 15px 0
}

.media img {
    width: 100%
}

.media__modal.overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 92;
    background: rgba(0,0,0,.5)
}

.media__full {
    display: none
}

.media__full.block {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 60%;
    height: 500px
}

.media__wrapper .wrapper__img {
    position: relative;
    padding-top: 150%;
    border-radius: 4px;
    overflow: hidden
}

.media__wrapper .wrapper__img img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.media__modal .ant-modal-body {
    position: relative
}

.media__modal .ant-modal-content {
    background-color: transparent;
    box-shadow: none
}

.media__modal .swiper-slide .wrapper__img img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.media__modal .ant-modal-close {
    top: -10px
}

.media__modal .ant-modal-close .ant-modal-close-x span {
    color: #fff
}

.media__modal .swiper_button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(95,95,95,.5);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: none;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center
}

.media__modal .swiper_button .anticon {
    color: #fff
}

.media__modal .swiper_button .anticon svg {
    width: 12px;
    height: 12px
}

.media__modal .swiper_button_disable {
    display: none
}

.media__modal .swiper_button.button_prev {
    left: 0
}

.media__modal .swiper_button.button_next {
    right: 0
}

@media screen and (min-width: 769px) {
    .media {
        padding-bottom:40px
    }

    .media__head {
        padding: 0 0 30px
    }

    .media__modal .swiper_button {
        width: 40px;
        height: 40px
    }

    .media__modal .swiper_button .anticon svg {
        width: 16px;
        height: 16px
    }

    .media__wrapper .wrapper__img {
        border-radius: 8px
    }

    .media__wrapper .wrapper__img img {
        transition: all .2s ease-in-out
    }

    .media__wrapper .wrapper__img:hover img {
        transform: scale(1.04)
    }
}

.banner-embed-youtube .ant-modal-content {
    background-color: transparent
}

.banner-embed-youtube .ant-modal-content .ant-modal-body {
    padding: 0
}

.banner-embed-youtube .ant-modal-content .ant-modal-close-x {
    color: #fff;
    background-color: rgba(0,0,0,.7);
    height: 30px;
    width: 30px;
    line-height: 30px
}

.banner-embed-youtube .ant-modal-content .player {
    display: flex;
    text-align: center;
    justify-content: center;
    position: relative;
    padding-bottom: 56.25%;
    height: 0
}

.banner-embed-youtube .ant-modal-content .player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.home .home__slide {
    position: relative;
}

.home .home__slide .swiper-button-next,.home .home__slide .swiper-button-prev {
    background-image: none
}

.home .home__slide .swiper-pagination-bullet-active {
    background: #1b1b1b
}

.home .home__slide .swiper-slide img {
    width: 100%
}

.home .home__slide .swiper-container {
    position: relative;
    border-radius: 5px 5px 0 0;
    margin-top: -5px;
    /* min-height: 12em; */
}

.home .home__slide .swiper-container .ic-next,.home .home__slide .swiper-container .ic-prev {
    position: absolute;
    top: 50%;
    z-index: 1;
    cursor: pointer
}

.home .home__slide .swiper-container .ic-next {
    right: 20px
}

.home .home__slide .swiper-container .ic-prev {
    left: 20px
}

.home .home__slide .swiper-button-custom {
    background: rgba(95,95,95,.25);
    width: 40px;
    height: 40px;
    border-radius: 50%
}

.home .home__slide .swiper-button-custom:after {
    font-size: 10px;
    color: #fff;
    font-weight: 700
}

.home .phone-null {
    width: 100%;
    animation-name: setBorder;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards
}

.home .phone-null::-webkit-input-placeholder {
    color: #3d0505
}

.home .phone-null:-ms-input-placeholder {
    color: #3d0505
}

.home .phone-null::-ms-input-placeholder {
    color: #3d0505
}

.home .phone-null::placeholder {
    color: #3d0505
}

.home .btn-action {
    border-radius: 6px;
    padding: 0 5px;
    font-size: 18px;
    cursor: pointer;
    font-family: 'Oswald';
}

.home__form-input {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    /* background: linear-gradient(-30deg, #e3deb7, #e7be71, #e3deb7, #e7be71); */
    max-width: 545px;
    border-radius: 8px;
    padding: 10px 15px;
    position: relative;
    z-index: 91;
    bottom: 0;
    margin: -30px auto 0;
    /* background: linear-gradient(-45deg, #e0effe, #e3ecfa, #d5d8e2, #e0effe); */
    /* box-shadow: 0px 0px 4px 0px #ddd; */
    /* border: solid 1px #e0effe; */
    backdrop-filter: blur(5px);
    background-color: rgb(255 255 255 / 70%);
}

.home__form-input .form-input__slogan {
    color: #00113d;
    padding-bottom: 5px
}

.home__form-input .form-input__slogan .slogan__title {
    text-transform: uppercase;
    font-family: Oswald;
    font-size: 20px;
    /* font-family: 'URW DIN'; */
}

.home__form-input .form-input__slogan .slogan__text {
    font-size: 14px
}

.home__form-input .form-input__form .form__input {
    flex: auto;
    margin-right: 10px
}

.home__form-input .form-input__form .form__input input {
    height: 100%;
    border-radius: 6px;
    width: 100%;
    padding-left: 10px;
    font-size: 15px;
    /* border: 1px solid transparent; */
    height: 42px;
    /* font-family: URW-DIN-Arabic,sans-serif; */
    font-family: 'Be Vietnam Pro';
    font-weight: 600
}

.home__form-input .form-input__form .form__input input:active,.home__form-input .form-input__form .form__input input:focus,.home__form-input .form-input__form .form__input input:hover {
    outline-style: none;
    box-shadow: none
}

.home .banner-slogan {
    background: #000;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 14px;
    text-align: center;
    color: #fff;
    padding: 8px 0 13px
}

@media(min-width: 768px) {
    .home .home__slide .swiper-container {
        border-radius:0;
        margin-top: 0
    }

    .home .home__slide .swiper-button-custom {
        width: 45px;
        height: 45px
    }

    .home .home__slide .swiper-button-custom:after {
        font-size: 15px
    }

    .home .btn-action {
        padding: 0 12px;
        font-size: 22px;
    }

    .home__form-input {
        position: absolute;
        bottom: 25px;
        left: 0;
        right: 0;
        margin: 0 auto;
        padding: 15px 20px
    }

    .home__form-input .form-input__slogan {
        padding-bottom: 15px
    }

    .home__form-input .form-input__slogan .slogan__title {
        font-size: 24px
    }

    .home__form-input .form-input__slogan .slogan__text {
        font-size: 18px;
        /* color: #014258; */
    }

    .home__form-input .form-input__form .form__input input {
        padding-left: 15px;
        height: 54px;
        font-size: 20px
    }
}

@media only screen and (max-width: 1200px) and (min-width:768px) {
    .home .home__slide {
        margin-bottom:112px
    }

    .home__form-input {
        bottom: -82px
    }
}

@media only screen and (max-width: 545px) {
    .home__form-input {
        margin-left:5px;
        margin-right: 5px
    }
}

@keyframes setBorder {
    0% {
        border: 1px solid transparent
    }

    to {
        border: 1px solid red
    }
}

.modal-confirm {
    font-family: Be
}

.modal-confirm .ant-modal-content {
    text-align: center;
    color: #2e2d2d;
    border-radius: 2px
}

.modal-confirm .ant-modal-content .ant-modal-header {
    border: none
}

.modal-confirm .ant-modal-content .ant-modal-header .ant-modal-title {
    font-size: 25px;
    font-family: Oswald;
    font-weight: 700;
    margin-top: 15px
}

.modal-confirm .ant-modal-content .ant-modal-body {
    padding: 12px 24px
}

.modal-confirm .ant-modal-content .ant-modal-body .right {
    padding: 5px 20px;
    background: #fc3;
    cursor: pointer;
    margin-top: 20px;
    margin-bottom: 10px
}

.modal-confirm .ant-modal-content .ant-modal-body .left {
    padding: 5px 20px;
    cursor: pointer
}

.modal-confirm .ant-modal-content .ant-modal-body .h2 {
    font-family: Oswald
}

@media screen and (max-width: 767px) {
    .modal-confirm .ant-modal-content .ant-modal-header .ant-modal-title {
        font-size:22px
    }

    .modal-confirm .ant-modal-content .ant-modal-body {
        font-size: 16px
    }

    .modal-confirm .ant-modal-content .ant-modal-footer button {
        font-size: 25px
    }
}

.list-booking-infomation .container {
    max-width: 1200px;
    padding: 0 15px;
    margin: auto;
    width: 100%
}

.list-booking-infomation .title {
    padding-top: 30px;
    padding-bottom: 30px;
    font-family: Oswald;
    font-weight: 700;
    font-size: 28px;
    margin-bottom: 0
}

.list-booking-infomation .booking-info {
    background: #fff;
    color: #fff;
    font-family: Be;
    font-size: 16px
}

.list-booking-infomation .booking-info .content {
    background: rgba(0,0,0,.8);
    border-radius: 10px;
    padding: 20px
}

.list-booking-infomation .booking-info .content .time-to {
    margin-bottom: 16px
}

.list-booking-infomation .booking-info .content .item {
    display: flex;
    align-items: center
}

.list-booking-infomation .booking-info .content .item:not(:last-child) {
    margin-bottom: 6px
}

.list-booking-infomation .booking-info .content .item span {
    min-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1
}

.list-booking-infomation .booking-info .content img {
    width: 22px;
    margin-right: 16px
}

.list-booking-infomation .booking-info .action {
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 15px
}

.list-booking-infomation .booking-info .action .button {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 8px;
    color: #000;
    font-family: Be;
    font-weight: 600;
    font-size: 16px;
    text-align: center;
    padding: 5px 20px;
    cursor: pointer;
    transition: all .3s;
    border: 1px solid rgba(0,0,0,.13)
}

.list-booking-infomation .booking-info .action .button:hover {
    background: #fc3;
    border-color: #fc3
}

.list-booking-infomation .booking-info .action .button:not(:last-child) {
    margin-right: 18px
}

.list-booking-infomation .booking-info .action .button-disable {
    background-color: red;
    cursor: not-allowed
}

.list-booking-infomation .booking-info .action .button-disable:hover {
    background-color: red
}

.list-booking-infomation .swiper_button {
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #000;
    color: #fff;
    cursor: pointer;
    border-color: transparent;
    top: 50%;
    transform: translateY(calc(50% - 47px))
}

.list-booking-infomation .swiper_button .swiper_button_icon {
    font-size: 12px;
    display: flex
}

.list-booking-infomation .swiper_button.button_prev {
    left: -25px
}

.list-booking-infomation .swiper_button.button_next {
    right: -25px
}

.list-booking-infomation .swiper_button_disable {
    background-color: #d1d1d1;
    color: #5f5f5f;
    cursor: not-allowed
}

.list-booking-infomation .swiper_button_disable:hover {
    color: #5f5f5f;
    border-color: transparent
}

.list-booking-infomation .swiper-pagination {
    display: inline-table;
    top: 5px;
    left: inherit;
    right: 5px;
    color: #fff;
    width: auto;
    background: #767676;
    border-radius: 4px;
    padding: 5px;
    font-family: be;
    font-size: 10px
}

.list-booking-infomation .booking-canceled {
    opacity: .7;
    cursor: not-allowed
}

@media screen and (max-width: 768px) {
    .list-booking-infomation .title {
        padding-top:15px;
        padding-bottom: 15px;
        font-size: 24px
    }

    .list-booking-infomation .booking-info {
        background: #fff;
        flex-direction: column;
        padding: 0;
        border-radius: 0;
        font-size: 14px
    }

    .list-booking-infomation .booking-info .content {
        padding: 28px 14px
    }

    .list-booking-infomation .booking-info .content .time-to {
        margin-bottom: 14px
    }

    .list-booking-infomation .booking-info .content .item {
        display: flex;
        align-items: center
    }

    .list-booking-infomation .booking-info .content .item:not(:last-child) {
        margin-bottom: 6px
    }

    .list-booking-infomation .booking-info .content img {
        width: 20px;
        margin-right: 12px
    }

    .list-booking-infomation .booking-info .action {
        display: flex;
        margin-top: 10px
    }

    .list-booking-infomation .booking-info .action .button {
        font-size: 12px;
        flex: 1 1;
        padding: 6px
    }

    .list-booking-infomation .booking-info .action .button:not(:last-child) {
        margin-bottom: 0;
        margin-right: 8px
    }

    .list-booking-infomation .swiper_button {
        display: none
    }
}

.modal-redirect-to-booking {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 14px
}

.modal-redirect-to-booking .content {
    text-align: center
}

.modal-redirect-to-booking .content .title {
    font-weight: 500;
    font-size: 18px
}

.modal-redirect-to-booking .content>div {
    padding-bottom: 10px
}

.modal-redirect-to-booking .btn {
    text-align: center;
    text-transform: uppercase;
    margin-top: 5px
}

.modal-redirect-to-booking .btn a {
    padding: 5px 15px;
    border-radius: 4px;
    font-size: 20px
}

@media screen and (min-width: 768px) {
    .list-booking-infomation .booking-info .content .item span {
        min-height:26px
    }
}

.skeleton-loading {
    margin: 40px 0
}

.skeleton-loading .loading__banner {
    margin: 15px 0;
    display: block
}

.skeleton-loading .loading__banner .ant-skeleton-avatar {
    width: 100%;
    min-height: 200px
}

.skeleton-loading .loading__media .ant-skeleton-avatar {
    width: 70px;
    height: 70px;
    margin-right: 15px
}

.skeleton-loading .mobile-hide {
    display: none
}

@media screen and (min-width: 768px) {
    .skeleton-loading {
        margin:40px 0
    }

    .skeleton-loading .loading__banner {
        margin: 15px 0 30px
    }

    .skeleton-loading .loading__banner .ant-skeleton-avatar {
        min-height: 300px
    }

    .skeleton-loading .loading__media .ant-skeleton-avatar {
        width: 100px;
        height: 100px
    }

    .skeleton-loading .mobile-hide {
        display: block
    }
}

.home {
    background-color: #fff;
    /* padding: 5px 0px 0px; */
    width: 100%;
}

.home .container {
    max-width: 1200px;
    padding: 0 15px;
    margin: auto;
    width: 100%
}

.popup-banner-home {
    padding: 0
}

.popup-banner-home .ant-modal-content {
    margin: 0 15px;
    border-radius: 5px!important;
    overflow: hidden
}

.popup-banner-home .ant-modal-content .ant-modal-body {
    padding: 0
}

.popup-banner-home .ant-modal-content .ant-modal-close {
    top: 7px;
    right: 7px
}

.popup-banner-home .ant-modal-content .ant-modal-close .ant-modal-close-x {
    width: 30px;
    height: 30px;
    background-color: hsla(0,0%,93.3%,.8);
    border-radius: 50%
}

.popup-banner-home .ant-modal-footer {
    display: none
}

.footer-v3 {
    background: linear-gradient(-45deg, #e0effe, #e3ecfa, #d5d8e2, #e0effe);
    /* font-family: 'URW-DIN-Arabic'; */
    position: relative;
    width: auto;
}

.footer-v3:before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0;
    /* background: rgb(255,255,255); */
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
    height: 1px;
    z-index: 1;
    right: 0;
    /* clip-path: ellipse(50% 20% at 50% 50%); */
    box-shadow: 0px 0px 0px 0px;
    background: #eee;
}

.footer-v3__container {
    padding: 0;
    margin-bottom: 1em;
    max-width: 1200px;
    width: auto;
    margin: auto;
}

.footer-v3 .float-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    position: fixed;
    bottom: 90px;
    right: 25px;
    background: linear-gradient(-45deg, #fabd03, #fabd03, #fabd03, #fabd03);
    box-shadow: 0 4px 12px 0 rgba(0,0,0,.15);
    border-radius: 30px;
    z-index: 90;
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
    /* background: linear-gradient(-45deg, #ddd, #fff, #ddd, #fff); */
}

.footer-v3 .float-button .icon {
    font-size: 24px;
    color: #fff;
}

.footer-top__column-service {
    padding: 15px;
    display: none
}

.footer-top__column-service .service-time__label {
    display: block;
    font-size: 24px;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 8px;
    font-family: Oswald;
    /* font-family: URW DIN; */
    /* font-family: 'Mulish', sans-serif; */
    /* color: #fff; */
}

.footer-top__column-service .service-time__detail {
    font-size: 16px;
    font-family: be vietnam pro,sans-serif;
}

.footer-top__column-service .hotline-service__label {
    display: block;
    margin: 20px 0;
    font-size: 16px;
    font-weight: 600;
    color: #fabd05;
    text-transform: uppercase
}

.footer-top__column-app {
    display: none;
    color: #222!important;
    padding: 15px
}
.app-info__label {
    display: block;
    font-size: 24px;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 8px;
    font-family: 'Oswald';
    /*font-family: 'URW DIN';*/
    /* font-family: 'Mulish', sans-serif; */
    color: #ff;
    color: #00113d;
}

.app-info__detail {
    font-size: 16px;
    font-family: be vietnam pro,sans-serif;
    font-weight: 300;
}

.app-badge {
    display: flex;
    margin-top: 30px;
    flex-direction: row
}

.app-badge .badge-item {
    margin-right: 15px;
}

.app-badge .badge-item img {
    max-height: 40px;
}

.social-info,.social-info .app-badge {
    margin-top: 15px;
    /* color: #fff; */
    font-family: 'Be Vietnam Pro';
    justify-content: flex-start;
}

.social-info .app-badge .img_backgroud {
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
    border-radius: 5px;
    display: flex;
    padding: 5px;
    font-size: 1.8em;
    justify-content: space-between;
    border: 1px solid #00113d;
    background: linear-gradient(-45deg, #e0effe, #e3ecfa, #d5d8e2, #e0effe);
}

.social-info .app-badge .img_backgroud i {
    color: #00113d;
    max-width: 35px;
    max-height: 35px;
}

.footer-top__column-info {
    padding: 15px;
    /* color: #fff !important; */
}

.footer-top .footer__info {
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 3px
}

.footer-top .footer__info-item {
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 10px;
    /* font-family: 'Mulish', sans-serif; */
    /* font-family: 'Oswald'; */
    font-family: be vietnam pro,sans-serif;
    margin-top: 10px;
}

.footer-top .footer__info-item .info-item__text {
    color: #222 !important;
    font-weight: 300;
    font-size: 16px;
    display: inline-grid;
    /* font-family: 'Mulish', sans-serif; */
    line-height: 1.8em;
    font-family: be vietnam pro,sans-serif;
}

.footer-top .footer__info-item .title {
    font-weight: 500;
    font-size: 16px;
    /* font-family: URW DIN; */
    /* font-family: 'Mulish', sans-serif; */
    font-family: be vietnam pro,sans-serif;
    /* font-family: 'Oswald'; */
    /* color: #222; */
}

.footer-top .footer__logo {
    width: 30%;
    margin-bottom: 12px
}

.footer-top .footer__ca {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-top: 15px;
    height: auto;
}

.footer-top .footer__ca .moit-icon {
    max-height: 60px;
    margin-right: 10px
}

.footer-top .footer__ca .dmca-icon {
    height: 40px
}

.footer-bottom {
    /* background: linear-gradient(-45deg, #e8a001, #f9d893, #f7c455, #e8a001); */
    padding: 15px;
    background: #00113d;
}

.footer-bottom .copyright {
    display: none
}

.footer-bottom .footer-nav {
    color: #333;
    font-size: 16px;
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 10px
}

.footer-bottom .footer-nav__item {
    margin-bottom: 10px
}

.footer-bottom .footer-nav__item a {
    color: #690203;
}

.footer-bottom .footer-nav-social {
    display: block
}

.footer-bottom__app-badge {
    display: flex
}

.footer-bottom__app-badge .badge-item img {
    height: 40px
}

.footer-bottom__app-badge .badge-item:last-child {
    margin-left: 15px
}

.footer-bottom .list-cate{
    color: #690203;
}
.footer-bottom .list-cate a{
    color: #690203;
}



.app-cash {
    display: none;
    margin-top: 15px
}

.app-cash .app-cash__label {
    color: #00113d !important;
}

.app-cash .app-cash__list {
    display: flex;
    flex-direction: row;
    align-items: center
}

.app-cash .app-cash__list .app-cash__item {
    margin-right: 20px
}

.footer-hotline {
    padding: 10px 15px
}

.footer-copyright {
    padding: 15px
}

.copyright {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 14px
}

.social-list {
    padding-left: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row
}

.social-list .social-item {
    margin-top: 15px;
    margin-right: 10px
}

.button-hotline {
    border: 1px solid #00113d!important;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    padding: 12px;
    background: #00113d;
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
}

.button-hotline span {
    color: #e7be71 !important;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
    margin-left: 10px;
    font-family: Oswald;
    /* font-family: 'Mulish', sans-serif; */
}

@media only screen and (min-width: 769px) {
    .app-cash {
        display:block
    }

    .footer-copyright,.footer__logo {
        display: none
    }

    .footer-top {
        display: flex;
        flex-direction: row
    }

    .footer-top__column-app,.footer-top__column-info {
        width: 33%;
        padding: 35px 15px 15px
    }

    .footer-top__column-app {
        display: inline-block;
    }

    .footer-top__column-app .social-info {
        margin-top: 45px
    }

    .footer-top__column-service {
        width: 33%;
        padding: 35px 15px 15px;
        display: inline-block
    }

    .footer-top__column-service .button-hotline {
        padding: 6px;
        margin-top: 30px;
    }

    .footer-top__column-service .button-hotline span {
        font-size: 22px;
    }

    .footer-hotline {
        display: none
    }

    .footer-bottom {
        margin-top: 2rem;
        border-top: 1px solid #fff;
        display: flex;
        /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
        justify-content: space-between
    }

    .footer-bottom .copyright {
        display: inline-block;
        width: 30%
    }

    .footer-bottom__app-badge {
        display: none
    }

    .footer-bottom .footer-nav {
        width: 70%;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center
    }

    .footer-bottom .footer-nav__item>a {
        margin-right: 30px
    }

    .footer-bottom .footer-nav-social {
        display: none
    }

    .social-list .social-item {
        margin-top: 0
    }

    .footer-v3 .float-button {
        bottom: 95px
    }

    .zalo-chat-custom {
        bottom: 165px!important
    }
}

.zalo-chat-custom {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    position: fixed;
    bottom: 65px;
    right: 25px;
    border-radius: 50%;
    box-shadow: 0 1px 1px 0 rgba(0,0,0,.15);
    z-index: 90;
    cursor: pointer;
    background-color: #fabd03;
    font-size: 24px
}

.zalo-chat-custom img {
    width: 40px;
    height: 40px
}

.zalo-chat-custom .icon-close {
    transform: scale(1)
}

.show-btn-wrapper {
    width: 0;
    height: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 90
}

.show-btn-wrapper.toggle {
    z-index: 92
}

.show-btn-wrapper .zalo-chat-custom2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 55px;
    position: fixed;
    bottom: 115px;
    right: 15px;
    border-radius: 30px;
    z-index: 89;
    cursor: pointer
}

.show-btn-wrapper .zalo-chat-custom2 div {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    color: #fff;
    margin-right: 10px;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 700;
    font-size: 14px;
    font-style: normal;
    line-height: 26px
}

.show-btn-wrapper .zalo-chat-custom2 img {
    width: 48px;
    height: auto
}

.show-btn-wrapper .float-button2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 55px;
    position: fixed;
    bottom: 57px;
    right: 71px;
    border-radius: 30px;
    z-index: 90
}

.show-btn-wrapper .float-button2 a {
    flex: 0 0 48px
}

.show-btn-wrapper .float-button2 div {
    width: 100%;
    text-align: right;
    color: #fff;
    margin-right: 10px;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 700;
    font-size: 14px;
    font-style: normal;
    line-height: 26px
}

.show-btn-wrapper .float-button2 .icon {
    font-size: 18px;
    color: #000
}

.show-btn-wrapper .float-button2 img {
    width: 48px;
    height: 48px
}

.show-btn-wrapper .float-button3 {
    display: flex;
    position: fixed;
    bottom: -15px;
    right: 110px;
    z-index: 90;
    width: 100%;
    height: 55px;
    justify-content: flex-end
}

.show-btn-wrapper .float-button3 div {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    color: #fff;
    margin-right: 10px;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 700;
    font-size: 14px;
    font-style: normal;
    line-height: 26px
}

.show-btn-wrapper .float-button3 .icon {
    font-size: 18px;
    color: #000
}

.show-btn-wrapper .float-button3 .btn-main {
    background: #fc3;
    width: 48px;
    height: 48px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center
}

.zalo-chat-custom-no-active {
    transform: scale(0);
    transform-origin: bottom right
}

.zalo-chat-custom-active,.zalo-chat-custom-no-active {
    width: 100%;
    height: 100%;
    position: absolute;
    transition: all .3s ease;
    bottom: 70px;
    right: 40px
}

.zalo-chat-custom-active {
    transform: scale(1);
    transform-origin: bottom right
}

.modal-checkbooking {
    color: #000
}

.modal-checkbooking .notfound-booking {
    text-align: center;
    margin-top: 20px
}

.modal-checkbooking .notfound-booking .alert {
    color: #e54d3e
}

.modal-checkbooking .notfound-booking .booking {
    padding: 8px 0;
    cursor: pointer
}

.modal-checkbooking .notfound-booking .booking div {
    color: #000;
    font-weight: 700;
    margin-right: 10px;
    text-decoration: underline;
    display: inline
}

.modal-checkbooking .ant-modal-content {
    box-shadow: 0 4px 8px hsla(0,0%,77.6%,.25);
    border-radius: 4px!important
}

.modal-checkbooking .ant-modal-body {
    padding: 32px
}

.modal-checkbooking .title {
    font-family: Oswald;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    text-align: center;
    text-transform: uppercase
}

.modal-checkbooking .sub-title {
    margin-top: 24px;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 500;
    font-size: 18px;
    text-align: center
}

@media only screen and (max-width: 768px) {
    .modal-checkbooking .ant-modal-body {
        padding:12px 24px
    }

    .modal-checkbooking .title {
        font-size: 20px
    }

    .modal-checkbooking .sub-title {
        margin-top: 12px;
        font-size: 16px;
        text-align: left
    }
}

.modal-checkbooking .ant-modal-title {
    font-size: 20px;
    font-family: Oswald
}

.modal-checkbooking .text {
    margin: 10px 0;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 18px;
    text-align: center;
    color: #1b1b1b;
    line-height: 30px
}

.modal-checkbooking .text .link-booking {
    padding: 4px;
    background: #fc3;
    color: #1b1b1b;
    font-weight: 600;
    border-radius: 5px
}

.modal-checkbooking .text .default {
    font-size: 18px;
    font-weight: 300
}

.modal-checkbooking .text .cus_phone {
    font-weight: 400;
    text-transform: capitalize
}

.modal-checkbooking .text .name {
    text-transform: capitalize
}

.modal-checkbooking .box {
    display: flex;
    justify-content: space-between;
    font-size: 20px
}

.modal-checkbooking .box input {
    width: 70%;
    font-size: 18px
}

.modal-checkbooking .box .action-check {
    font-family: Oswald;
    width: 28%;
    background: #fc3;
    color: #fff;
    margin-left: 2%;
    padding: 5px;
    text-align: center;
    cursor: pointer;
    height: 40px;
    color: #111;
    border-radius: 5px
}

.modal-checkbooking .images {
    display: flex;
    justify-content: center
}

.modal-checkbooking .images img {
    cursor: pointer
}

.modal-checkbooking .action {
    padding: 5px;
    display: flex;
    justify-content: center
}

.modal-checkbooking .action a,.modal-checkbooking .action div {
    color: #1b1b1b;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 2px 12px;
    cursor: pointer
}

.modal-checkbooking .action div {
    margin-left: 10px
}

.modal-checkbooking .loading {
    position: absolute;
    left: 40px;
    bottom: 32px;
    background-color: transparent;
    height: 48px;
    display: flex;
    align-self: center;
    align-items: center
}

@media screen and (max-width: 767px) {
    .modal-checkbooking .text {
        font-size:16px
    }

    .modal-checkbooking .text .default {
        font-size: 4vw
    }

    .modal-checkbooking .box input {
        font-size: 16px
    }

    .modal-checkbooking .loading {
        bottom: 12px
    }
}

.input_phone {
    margin-top: 24px;
    width: 100%;
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    padding: 10px 12px
}

.input_phone .ant-input-prefix:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 49px;
    display: block;
    border-left: 1px solid #d9d9d9;
    transition: all .3s;
    content: ""
}

.input_phone .ant-input-prefix {
    margin-right: 12px
}

.input_phone .icon_phone {
    width: 49px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: -12px;
    margin-top: -10px;
    margin-bottom: -10px;
    height: 48px
}

.input_phone .icon_phone img {
    width: 20px;
    height: 20px
}

.input_phone .ant-input {
    font-family: Oswald;
    font-style: normal;
    font-weight: 400;
    font-size: 18px
}

.content_input_phone {
    margin-bottom: 0
}

.content_input_phone .ant-form-item-explain {
    min-height: 0
}

.error_input {
    border: 1px solid red
}

.error_input:focus,.error_input:hover {
    border-color: red!important
}

.error_input.ant-input-affix-wrapper-focused,.error_input:focus {
    box-shadow: 0 0 0 2px rgba(255,77,79,.2)!important
}

@media only screen and (max-width: 768px) {
    .input_phone {
        margin-top:12px
    }
}

.button_booking {
    position: relative;
    margin-top: 16px;
    cursor: pointer
}

.button_booking:hover {
    opacity: .7
}

.button_booking .button {
    font-family: Oswald;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    background: #fc3;
    border-radius: 4px;
    text-align: center;
    text-transform: uppercase;
    border: none;
    padding: 10px
}

.button_booking .button .button_text {
    text-transform: none;
    font-family: be;
    font-weight: 400;
    font-size: 16px
}

.button_booking .icon_next {
    position: absolute;
    top: 12px;
    right: 16px
}

@media only screen and (max-width: 768px) {
    .button_booking {
        margin-top:12px
    }

    .button_booking .button .button_text {
        font-size: 12px
    }
    .nav-bar__menu {
        position: fixed;
        top: 0;
        bottom: 0;
        background-color: #fff;
        width: 100%;
        padding: 1rem;
        right: -100%;
        z-index: 99;
        overflow: auto
    }

    .nav-bar__menu.active {
        right: 0;
        transition: all .3s
    }

    .nav-bar__close {
        display: inline-block;
        background-color: #f7f7f7;
        border-radius: 4px;
        margin: auto;
        position: absolute;
        top: 1.5rem;
        right: 25px
    }
}

.new-header {
    background: linear-gradient(-45deg, #e8a001, #f9d893, #f7c455, #e8a001);
    box-shadow: 0 2px 8px hsla(0,0%,77.6%,.25);
    /* border-bottom: 1px solid #eee; */
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    position: relative;
    background: #00113d;
}
.new-header:after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 0;
    /* background: #DA0530; */
    /* background: radial-gradient(circle, #DA0530 0%, rgba(255,255,255,1) 100%); */
    height: 14px;
    z-index: 1;
    right: 0;
    clip-path: ellipse(50% 15% at 50% 50%);
}
.new-header__container {
    padding: 0;
    margin: auto;
    max-width: 1200px;
}

.nav-bar {
    padding: 5px 16px;
    height: 72px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.nav-bar__menu {
    position: fixed;
    top: 0;
    bottom: 0;
    /* background-color: #014258; */
    /* width: 100%; */
    padding: 1rem;
    right: -100%;
    z-index: 99;
    overflow: auto
}

.nav-bar__menu.active {
    right: 0;
    transition: all .3s
}

.nav-bar__close {
    display: inline-block;
    /* background-color: #f7f7f7; */
    border-radius: 4px;
    margin: auto;
    position: absolute;
    top: 1.5rem;
    right: 25px;
    background: #e7be71;
}

.nav-bar__close img {
    padding: 10px
}

.nav-bar__logo {
    display: inline-block;
    margin: 2.5rem 10px;
}

.nav-bar__logo img {
    max-width: 100%;
}

.nav-bar__logo-main img {
    height: 50px;
    /* max-width: 130px; */
    /* max-width: 100%; */
}

.nav-bar__action {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    /* height: 100%; */
    width: auto;
}

.nav-bar__action .service-time {
    
text-align: left;
    
height: auto;
    
display: flex;
    
justify-content: space-between;
    
align-items: center;
    
font-family: 'URW DIN';
}

.nav-bar__action .service-time__label {
    /* display: block; */
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #333;
}

.nav-bar__action .service-time__detail {
    font-size: 13px;
    color: #333;
    font-weight: bold;
}

.nav-bar .menu {
    padding-left: 0
}

.nav-bar .menu-item {
    list-style: none;
    box-shadow: 0 0px 1px #e7be71;
    border-radius: 4px;
    padding-top: 0;
    display: flex;
    align-items: center;
    position: relative;
    line-height: 50px;
    margin: 0 10px 20px;
}

.nav-bar .menu-item-text {
    font-family: Oswald;
    font-weight: 500;
    /* text-transform: uppercase; */
    font-size: 1em;
    color: #e7be71;
    /* font-feature-settings: "ss01" on; */
    /* font-family: URW DIN; */
    font-family: 'Mulish', sans-serif;
}

.nav-bar .menu-item .icon--mb {
    margin-right: 12px;
    width: 24px;
    height: 24px
}

.nav-bar .menu-item.booking {
    display: block
}

.nav-bar .menu a {
    display: flex;
    align-items: center;
    padding: 0px 10px;
    width: 100%;
    position: relative;
}

.nav-bar .menu a:after {
    content: "";
    position: absolute;
    right: 9px;
    top: 50%;
    transform: translateY(-50%);
    background-image: url(../images/chevronRight.5746f99f.svg);
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px
}

.nav-bar .menu-action {
    padding: 0 10px
}

.nav-bar .menu-action__button {
    display: inline-block;
    background-color: #fc3;
    border-radius: 4px;
    color: #000;
    text-transform: uppercase;
    font-size: 1.1rem;
    font-weight: 600;
    text-align: center;
    font-family: Oswald;
    padding: .6rem;
    width: 100%
}

.menu-button {
    margin-left: 10px;
    font-size: 1.3em;
    color: #DA0530;
}

.booking-button {
    /*font-family: Oswald;*/
    border: 1px solid #000;
    border-radius: 5px;
    flex-direction: row;
    justify-content: center;
    padding: 2px 12px;
    display: none;
    font-family: URW-DIN-Arabic,sans-serif;
}

.booking-button span {
    white-space: nowrap;
    text-transform: uppercase;
    margin-left: 8px;
    font-size: 16px;
    color: #000
}

.login-button {
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 2px 12px;
    margin-left: 15px;
    cursor: pointer
}

.login-button span {
    font-weight: 700;
    white-space: nowrap;
    text-transform: uppercase;
    margin-left: 8px;
    font-size: 14px;
    color: #270100;
}

.login-button img {
    width: 16px
}

.nav-bar__hotine {

margin: -5px -15px;
}

.hotline-button {
    display: flex;
    align-items: center;
    background: #fff;
    padding: 0px 7px;
    border-radius: 15px;
    cursor: pointer;
    border: 1px solid #ddd;
    margin-left: 5px;
}

.hotline-button span {
    /* font-weight: 700; */
    white-space: nowrap;
    text-transform: uppercase;
    margin-left: 0px;
    font-size: 12px;
    color: #a8232d;
    font-family: 'URW DIN';
}

.hotline-button img {
    width: auto;
}

.booknow-button {
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
    /* border: 1px solid #e80003; */
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 2px 16px;
    cursor: pointer;
    border: solid 1px #e7be71;
}

.booknow-button span {
    font-weight: 800;
    white-space: nowrap;
    text-transform: initial;
    margin-left: 0px;
    font-size: 16px;
    /* color: #e80003; */
    /* font-family: 'URW-DIN-Arabic'; */
    font-family: 'Mulish', sans-serif;
    color: #e7be71;
}

.booknow-button img {
    width: 16px
}

.menu-topup {
    font-family: URW-DIN-Arabic,sans-serif;
    color: #111
}

.menu-topup,.menu-topup .ant-dropdown-menu-item,.menu-topup .ant-dropdown-menu-submenu-title {
    font-weight: 300
}

@media only screen and (min-width: 1025px) {
    .login-button {
        background-color: gold;
        font-family: Oswald;
        border-color: transparent
    }

    .login-button span {
        font-size: 16px
    }

    .login-button img {
        width: 22px
    }

    .booking-button {
        display: flex
    }

    .nav-bar__logo-main {
        width: auto;
        padding-right: 10px;
    }

    .nav-bar__menu {
        /* width: auto; */
        position: relative;
        transition: none;
        right: 0;
        margin-left: 0px;
    }

    .nav-bar .menu {
        display: flex;
        flex-direction: row;
        justify-content: left;
        align-items: center;
        padding: 0;
        margin: 0;
        list-style-type: none
    }

    .nav-bar .menu .menu-item {
        box-shadow: none;
        margin: 0;
        padding: 0px 5px;
    }

    .nav-bar .menu .menu-item .icon--mb {
        display: none
    }

    .nav-bar .menu .menu-item a {
        font-size: 16px;
        padding: 0px 10px;
    }

    .nav-bar .menu .menu-item a:after {
        content: none
    }

    .menu-action,.menu-button,.nav-bar .menu .lucky-wheel,.nav-bar .menu .menu-item.booking,.nav-bar__close,.nav-bar__logo {
        display: none
    }
}

.modal-form-login {
    color: #000
}

.modal-form-login .ant-modal-header {
    text-align: center;
    border: none;
    padding: 0
}

.modal-form-login .ant-modal-header .ant-modal-title {
    font-size: 24px;
    padding-top: 24px
}

.modal-form-login .ant-modal-header .ant-modal-title span {
    display: block;
    padding-top: 10px
}

.modal-form-login .ant-input-affix-wrapper:focus {
    box-shadow: none
}

.modal-form-login .ant-input-affix-wrapper:hover {
    border-right-width: 2px!important
}

.modal-form-login .ant-input-affix-wrapper-focused {
    box-shadow: none;
    border-right-width: 2px!important
}

.modal-form-login .ant-input-affix-wrapper-focused:hover {
    border-right-width: 2px!important
}

.modal-form-login .ant-modal-content {
    border-radius: 4px!important
}

.modal-form-login .form-login {
    color: #111;
    max-width: 400px;
    margin: auto;
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.modal-form-login .form-login .header-form {
    font-size: 16px;
    margin-bottom: 25px;
    text-align: center
}

.modal-form-login .form-login .btn-back button {
    margin-top: 20px;
    height: 32px;
    font-size: 15px
}

.modal-form-login .form-login input {
    font-size: 15px;
    height: 48px;
    border-radius: 4px;
    border: 2px solid #a3a3a3;
    color: #222
}

.modal-form-login .form-login input:focus {
    box-shadow: none;
    border-right-width: 2px!important
}

.modal-form-login .form-login input:hover {
    border-right-width: 2px!important
}

.modal-form-login .form-login .ant-input-password {
    border-radius: 4px;
    border: 2px solid #a3a3a3;
    padding: 0
}

.modal-form-login .form-login .ant-input-password input {
    padding: 0 11px;
    height: 44px;
    border: none
}

.modal-form-login .form-login .ant-input-password input:focus {
    box-shadow: none
}

.modal-form-login .form-login .ant-input-password .ant-input-suffix {
    padding-right: 11px;
    color: #5f5f5f
}

.modal-form-login .form-login .forgot-password {
    font-size: 14px;
    margin-bottom: 20px;
    text-align: right;
    text-decoration: underline
}

.modal-form-login .form-login .forgot-password span {
    cursor: pointer
}

.modal-form-login .form-login .content-otp {
    text-align: center
}

.modal-form-login .form-login .content-otp .error__message {
    margin: -15px 0 0;
    padding: 0
}

.modal-form-login .form-login .text {
    font-size: 16px;
    text-align: center;
    margin: 0 20px 20px
}

.modal-form-login .form-login .text .text__phone {
    margin-bottom: 15px;
    font-weight: 600
}

.modal-form-login .form-login .login-form-button {
    width: 100%;
    border-radius: 4px;
    height: 48px;
    font-family: Oswald;
    font-size: 18px;
    margin-top: 5px
}

.modal-form-login .form-login .button-register {
    text-align: center;
    font-size: 14px;
    margin-top: 15px
}

.modal-form-login .form-login .button-register button {
    background-color: transparent;
    color: #000;
    border: none;
    box-shadow: none
}

.modal-form-login .form-login .button-register button span {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
    font-weight: 600
}

.modal-form-login .form-login .input-otp>div {
    justify-content: space-between
}

.modal-form-login .form-login .input-otp input {
    width: 48px!important;
    height: 48px;
    border: 2px solid #a3a3a3;
    border-radius: 4px;
    color: #222;
    font-size: 16px;
    margin-bottom: 16px
}

.modal-form-login .form-login .sendOTP {
    margin-bottom: 25px;
    font-size: 14px
}

.modal-form-login .form-login .sendOTP__count {
    color: #e54d3e
}

.modal-form-login .form-login .sendOTP__resend {
    margin-left: auto;
    text-decoration: underline;
    cursor: pointer
}

.modal-form-login .form-login .error__message {
    color: #ff4d4f;
    font-size: 12px;
    margin: -20px 0 0;
    padding-left: 5px
}

.modal-form-login .form-login .input__birthDay {
    box-shadow: none;
    width: 100%;
    border-radius: 4px;
    border: 2px solid #a3a3a3;
    color: #222;
    border-right-width: 2px!important;
    padding: 4px 11px;
    height: 48px
}

.modal-form-login .form-login .input__birthDay input {
    border: none
}

.modal-form-login .form-login .button__back {
    background-color: transparent;
    border: none;
    box-shadow: none;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    height: auto
}

.modal-form-login .form-login .form__validate .ant-form-item-explain {
    font-size: 12px;
    padding-left: 5px;
    display: flex;
    align-items: center
}

.modal-form-login .form-login .form__validate .ant-form-item:last-child {
    margin-bottom: 0
}

.modal-form-login .form-login .form__validate .ant-form-item-has-error .ant-input-password,.modal-form-login .form-login .form__validate .ant-form-item-has-error .input__birthDay,.modal-form-login .form-login .form__validate .ant-form-item-has-error input {
    border-color: #ff4d4f
}

.form-login-V2 .form__text {
    text-align: center;
    margin-bottom: 30px
}

.form-login-V2 .form__getPassword {
    font-size: 14px;
    margin-bottom: 25px;
    padding: 0;
    text-align: right
}

.form-login-V2 .form__getPassword span {
    cursor: pointer;
    text-decoration: underline
}

.form-login-V2 .form__input {
    margin-bottom: 25px
}

.form-login-V2 .form__input-pin {
    margin-bottom: 0
}

.form-login-V2 .form__input-pin>div {
    justify-content: space-between
}

.form-login-V2 .form__input-pin input {
    width: 48px!important;
    margin-bottom: 25px
}

.form-login-V2 .form__button {
    width: 100%;
    border-radius: 4px;
    height: 48px;
    font-family: Oswald;
    font-size: 18px
}

.form-login-V2 .form__message {
    color: #e54d3e;
    font-size: 12px;
    margin-top: -20px;
    padding: 0 5px 5px
}

.form-login-V2 .sendOTP {
    margin-bottom: 25px;
    font-size: 14px
}

.form-login-V2 .sendOTP__count {
    color: #e54d3e
}

.form-login-V2 .sendOTP__resend {
    text-decoration: underline;
    cursor: pointer
}

.form-login-V2 .sendOTP__resend.hide {
    cursor: default;
    text-decoration: none;
    padding-right: 5px;
    color: #a3a3a3
}

.form-login-V2 input {
    height: 48px;
    border-radius: 4px;
    border: 2px solid #a3a3a3;
    color: #222
}

.form-login-V2 input::-webkit-input-placeholder {
    color: #a3a3a3
}

.form-login-V2 input:-ms-input-placeholder {
    color: #a3a3a3
}

.form-login-V2 input::-ms-input-placeholder {
    color: #a3a3a3
}

.form-login-V2 input::placeholder {
    color: #a3a3a3
}

.form-login-V2 input:focus {
    box-shadow: none
}

.form-login-V2 input:focus,.form-login-V2 input:hover {
    border-right-width: 2px!important;
    border-color: #a3a3a3
}

.form-login-V2 .btn-back {
    position: absolute;
    top: 20px;
    width: 32px;
    height: 32px;
    background: #e5e5e5;
    display: flex;
    justify-content: center;
    border-radius: 50%
}

.form-login-V2 .btn-color-skip {
    border: 2px solid #000;
    border-radius: 4px;
    margin-right: 18px;
    background: #fff;
    color: #222
}

.ShineMember2020v3 {
    background-color: #fff
}

.ShineMember2020v3 .sm-v3__header {
    background-color: #fffdeb;
    box-shadow: 0 4px 8px hsla(0,0%,77.6%,.25);
    position: relative
}

.ShineMember2020v3 .sm-v3__header .button-back {
    z-index: 1;
    position: absolute;
    top: 15px;
    left: 15px;
    cursor: pointer
}

.ShineMember2020v3 .sm-v3__header .button-back img {
    width: 40px;
    height: 40px
}

.ShineMember2020v3 .sm-v3__content {
    padding: 15px
}

.ShineMember2020v3 .sm-v3__title {
    font-family: Oswald;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase
}

.ShineMember2020v3 .sm-v3__desc {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 16px;
    margin-top: 10px
}

.ShineMember2020v3 .sm-v3__media {
    width: 100%;
    margin-top: 40px;
    padding: 15px
}

.ShineMember2020v3 .sm-v3__tabs {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 30px
}

.ShineMember2020v3 .sm-v3__tabs .tab__item {
    flex: 1 1;
    padding: 15px;
    cursor: pointer
}

.ShineMember2020v3 .sm-v3__tabs .tab__item.active {
    border-bottom: 4px solid #000
}

.ShineMember2020v3 .sm-v3__tabs .tab__item.active .tab-item__icon {
    background-color: #000;
    transition: all .3s
}

.ShineMember2020v3 .sm-v3__tabs .tab__item.active .tab-item__title {
    color: #000;
    transition: all .3s
}

.ShineMember2020v3 .sm-v3__tabs .tab__item .tab-item__icon {
    display: inline-block;
    padding: 10px;
    background-color: #f0b000;
    width: 40px;
    height: 40px;
    border-radius: 20px
}

.ShineMember2020v3 .sm-v3__tabs .tab__item .tab-item__title {
    font-family: Oswald;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin-left: 10px;
    color: #a3a3a3
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action {
    background-color: #000;
    margin: 15px;
    border-radius: 4px;
    padding: 15px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .action {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 15px 0
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .action__desc {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    color: #fff;
    font-size: 12px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .action__price {
    font-family: Oswald;
    color: #fc3
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn {
    background-color: #fc3;
    text-align: center;
    font-family: Oswald;
    font-size: 18px;
    text-transform: uppercase;
    color: #000;
    font-weight: 700;
    padding: 8px 0;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn img {
    margin-right: 10px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn .anticon {
    margin-right: 5px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn:before {
    position: absolute;
    inset: -1px;
    z-index: 1;
    display: none;
    background: #fff;
    border-radius: inherit;
    opacity: .35;
    transition: opacity .2s;
    content: "";
    pointer-events: none
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn.button-loading {
    pointer-events: none
}

.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn.button-loading:before {
    display: block
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo {
    padding: 0 15px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__title {
    font-family: Oswald;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__list {
    padding: 15px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item {
    width: 100%;
    display: block;
    border-radius: 4px;
    padding-bottom: 20px;
    display: flex
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .icon {
    width: 15%;
    text-align: center;
    padding: 12px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .icon-bg {
    display: inline-block;
    background-color: #f5f5f5;
    padding: 10px;
    width: 50px;
    height: 50px;
    border-radius: 25px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content {
    width: 85%;
    padding: 8px 15px;
    margin: 0
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content__header {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 600;
    color: #000;
    font-size: 14px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content__detail {
    margin-top: 8px
}

.ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content__detail p {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300;
    font-size: 12px;
    color: #5f5f5f
}

.confirm-buy-shine-member {
    max-width: 100%
}

.confirm-buy-shine-member .ant-modal-body {
    padding: 16px
}

.confirm-buy-shine-member .ant-modal-content {
    margin: 0 15px;
    border-radius: 6px!important
}

.confirm-buy-shine-member .ant-modal-confirm-content {
    text-align: center
}

.confirm-buy-shine-member .ant-modal-confirm-body>.anticon+.ant-modal-confirm-title+.ant-modal-confirm-content {
    margin-left: 0
}

.confirm-buy-shine-member .ant-modal-confirm-body .ant-modal-confirm-title {
    text-align: center
}

.confirm-buy-shine-member .ant-modal-confirm-btns .ant-btn-primary {
    background-color: #fc3;
    border-color: #fc3;
    color: #000
}

.confirm-buy-shine-member .ant-modal-confirm-btns {
    text-align: center;
    float: inherit
}

.confirm-buy-shine-member .ant-modal-confirm-btns .ant-btn {
    border-radius: 4px;
    min-width: 80px;
    text-transform: uppercase;
    font-family: oswald;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0 2px 4px 0 rgba(99,99,99,.2)
}

.confirm-buy-shine-member .ant-modal-confirm-btns .ant-btn:hover {
    color: #000;
    opacity: .8
}

.confirm-buy-shine-member .icon {
    background-color: #fc3;
    margin: 0 auto 10px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center
}

.confirm-buy-shine-member .anticon.anticon-notification {
    color: #fc3;
    display: block;
    float: inherit;
    margin-bottom: 5px
}

@media screen and (min-width: 768px) {
    .ShineMember2020v3 .sm-v3__header .content {
        max-width:1200px;
        margin: auto
    }

    .ShineMember2020v3 .sm-v3__tabs {
        max-width: 500px;
        margin-top: -50px
    }

    .ShineMember2020v3 .sm-v3__content {
        max-width: 424px
    }

    .ShineMember2020v3 .sm-v3__media {
        padding: 30px
    }

    .ShineMember2020v3 .sm-v3__shine .content {
        max-width: 1200px;
        margin: auto
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn,.ShineMember2020v3 .sm-v3__shine .content .shine__action .shine-btn:before {
        max-width: 300px
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__action .action__desc {
        font-size: 16px
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__action .action__price {
        font-size: 20px
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__list {
        justify-content: flex-start
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item {
        width: 33.33%
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content__header {
        font-size: 16px
    }

    .ShineMember2020v3 .sm-v3__shine .content .shine__promo .promo__item .content__detail p {
        font-size: 14px
    }
}
@media screen and (max-width: 768px) {

    .nav-bar__logo-main img {
        max-height: 45px;
        max-width: 100%;
    }
    .booknow-button {
        background: linear-gradient(-45deg, #e8a001, #f9d893, #f7c455, #e8a001);
        border: 1px solid #f7c455;
        border-radius: 5px;
        display: flex;
        /* flex-direction: row; */
        justify-content: center;
        padding: 2px 10px;
        cursor: pointer;
        color: #DA0530;
    }
    .booknow-button span {
        font-weight: 800;
        white-space: normal;
        text-transform: math-auto;
        margin-left: 0px;
        font-size: 14px;
        color: #014258;
        /* font-family: 'URW-DIN-Arabic'; */
        /* font-family: 'Mulish', sans-serif; */
        display: inherit;
        font-family: be vietnam pro,sans-serif;
    }

    .footer-bottom__icon-app{
        /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
        display: flex !important;
        justify-content: space-around;
        padding: 15px 0 0;
        position: fixed;
        bottom: 0px;
        width: 100% !important;
        z-index: 20;
        box-shadow: 4.76712px -1.19178px 5.9589px rgba(250,150,94,.15);
        background: rgb(255, 255, 255, 0.95);
        /* border-top: 1px solid #DA0530; */
        border-radius: 30px;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        top: unset !important;
        right: unset !important;
    }
    .footer-bottom__icon-app .icon_detail{
        /* background: linear-gradient(-45deg, #ddd, #fff, #ddd, #fff); */
        color: #e80003;
        display: block;
        text-align: center;
        align-content: center;
        line-height: 1.5;
        font-size: 18px;
        color: #222;
        margin-bottom: 5px;
        padding: 0 10px 5px;
    }
    .footer-bottom__icon-app .icon_detail span{
        width: auto;
        display: block !important;
        font-size: 0.6em;
        margin-top: 5px;
    }

}
.footer-bottom__icon-app{
    display: grid;
    /* background: linear-gradient(-45deg, #e8a001, #f9d893, #f7c455, #e8a001); */
    padding: 0;
    z-index: 999;
    cursor: pointer;
    padding: 15px 0 0;
    position: fixed;
    right: 5px;
    box-shadow: 4.76712px -1.19178px 5.9589px rgba(250,150,94,.15);
    border-radius: 30px;
    margin: auto;
    top: 45%;
    backdrop-filter: blur(10px);
    background-color: rgb(255 255 255 / 30%);
}
.footer-bottom__icon-app .icon_detail{
    /* background: linear-gradient(-45deg, #ddd, #fff, #ddd, #fff); */
    color: #e80003;
    display: block;
    align-content: center;
    line-height: 1.5;
    font-size: 18px;
    color: #222;
    margin-bottom: 5px;
    padding: 0 10px 5px;
    text-align: center;
    align-items: center;
}
.footer-bottom__icon-app .icon_detail span{
    width: auto;
    display: none;
    font-size: 0.6em;
    margin-top: 5px;
}
.footer-bottom__icon-app .icon_detail img{
    width: 39px;
    height: 39px;
    margin: auto;
}
.container {
    max-width: 1200px;
    margin: 0 auto
}

.shinemember {
    font-family: URW-DIN-Arabic,sans-serif;
    font-weight: 300
}

.shinemember__button {
    text-align: center;
    color: #98750a;
    font-weight: 700;
    width: 100%;
    border: 1px solid #b5b5b5;
    border-radius: 5px;
    cursor: pointer
}

.shinemember__button:hover {
    background-color: #98750a;
    color: #fff
}

.shinemember .text-silver {
    background: linear-gradient(90deg,#4a4a4a,#b5b5b5 42.19%,#cdcdcd 57.81%,#4a4a4a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.shinemember .text-gold {
    background: linear-gradient(90deg,#816000,#d9b342 42.19%,#fc3 57.81%,#816000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.bg-FFFDEB {
    background-color: #fffdeb
}
/*location core*/

.location_core{

}
.location_core .blog{
    position: relative;
}
.location_core .blog .blog__title{
    width: 100%;
    position: absolute;
    bottom: 0px;
    /* background: linear-gradient(-45deg, #A8232E, #DA0530, #DA0530, #a8232d); */
    color: #00113d;
    padding: 0.5em;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background: linear-gradient(-30deg, #e3deb7, #e7be71, #e3deb7, #e7be71);
    font-size: 16px;
    line-height: 1.6;
    backdrop-filter: blur(20px);
    background-color: rgb(255 255 255 / 60%);
}
/*partnert*/

.partner {
    display: flex;
    padding: 0;
    flex-direction: column;
}
.partner .swiper-slide{
    width: auto;
}
.partner .blog{
    display: flex;
    width: calc(100%/7);
    border: 1px solid #EDF2F7;
    cursor: pointer;
    height: 120px;
    /* margin: 5px; */
    display: flex;
    padding: 5px;
    width: 157px;
    align-items: center;
    /* border-radius: 5px; */
    justify-content: center;
    /* flex-wrap: wrap; */
}

.partner .blog .blog__media{
    cursor: pointer;
    margin: 8px;
    display: flex;
    padding: 10px;
    align-items: center;
}
.partner .blog .blog__media img{
    width: auto;
    height: auto;
    position: relative;
}
/*layout service*/
/*.layout-service{
    padding: 40px 0px;
    margin: 0px;
}
.layout-service .layout__head .head__title{
    padding: 40px 0px;
    margin: 0px;
}
.layout-service{
    padding: 40px 0px;
    margin: 0px;
}
.layout-service{
    padding: 40px 0px;
    margin: 0px;
}*/
.nav-bar-top{
    padding: 5px 15px;
    height: 25px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.nav-bar__hotine_top{
    display: flex;
    /* flex-direction: row; */
    justify-content: center;
    /* align-items: center; */
    padding: 0;
    margin: 0px 10px 0px 0px;
    list-style-type: none;
    font-weight: bold;
}
.nav-bar__top_menu{
    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: flex-start;
    /* padding: 0; */
    /* margin: 0; */
    /* list-style-type: none; */
    width: 100%;
}
.hotline_text{
    color: #333;
    font-size: 15px;
}
.background_top_header{
    background: radial-gradient(circle, #e1b93f 0%, #fae5bf 100%);
}

.content__description{
    line-height: 1.55;
    margin-bottom: 15px;
    justify-content: space-between;
    text-align: justify;
    font-size: 16px;
}
.moreless-button{
    color: #333;
    display: inline-block;
    margin-bottom: 15px !important;
}

.footer-bottom__icon-app .icon_detail .arcu-item-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -20px;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #0084ff;
    margin-right: 10px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
}
.border-yellow-error {
    border: 1px solid #ddd;
    border-radius: 5px;
}