*{font-family:'Roboto-Regular', Verdana, Arial, Helvetica, sans-serif}
body {margin: 0px;padding:0px;font-family:'Roboto-Regular', Verdana, Arial, Helvetica, sans-serif;font-size:12pt;color:#333}

a {color: #0477bd; text-decoration: none;font-size:14pt}
a:hover {text-decoration:none;color:#000}

h1{color:#063f84;font-size:24pt;font-weight:normal;margin:0px;padding-bottom:20px}
h2{color:#055da7;font-size:18pt;font-weight:normal;margin:0px;padding-bottom:20px}

#mainpage {display:block; width: 100%;padding-bottom:30px;}
.topfix {
    display: block;
    width: 100%;
    position: fixed;
    z-index: 999999999999999;
    top: 0;
    height: 45px;
    background: #0c214d;
    line-height: 45px;
    overflow: hidden;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.5);
}
.bogoho-text {
    background: linear-gradient( 90deg, #d142c8 0%, /* tím hồng */
    #f47e32 40%, /* cam đậm */
    #fbd436 70%, /* vàng sáng */
    #fff176 100% /* vàng nhạt gần trắng */
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.topfix .boxtop{width:1140px;margin:0 auto;}
.topfix .boxtop .left{float:left;width:40%;font-family:'Roboto-Bold';font-size:14pt;color:#fff}
.topfix .boxtop .right{float:right;text-align:right;width:60%;font-family:'Roboto-Bold';font-size:14pt;color:#fff}
.topfix span{font-family:'Roboto-Bold';font-size:14pt;color:#ff0107}
@media (max-width: 320px) {
.topfix .boxtop{width:100%;overflow:hidden}
.topfix .boxtop .left{display:none}
.topfix .boxtop .right{float:left;text-align:center;width:100%;font-size:9pt}
.topfix span{font-size:9pt;}
}
@media (min-width: 321px) and (max-width: 1169px) {
.topfix .boxtop{width:100%;overflow:hidden}
.topfix .boxtop .left{display:none}
.topfix .boxtop .right{float:left;text-align:center;width:100%;font-size:10pt}
.topfix span{font-size:11pt;}
}

.banertop {
    width: 100%;
    margin-top: 45px;
    text-align: center;
    background-image: url(/MicrositeBogoho/images/banner/banner-top.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; /* Thay 'contain' bằng 'cover' để phủ toàn bộ khung */
    height: 50vw; /* Chiều cao theo tỉ lệ màn hình, giúp responsive */
    max-height: 820px; /* Giới hạn chiều cao tối đa */
    min-height: 400px; /* Đảm bảo không quá thấp ở màn hình nhỏ */
}
@media (max-width: 1920px) {
    .banertop {
        height: 600px;
    }
}

@media (max-width: 768px) {
    .banertop {
        height: 300px;
        background-size: contain;
    }
}
.contentpage {display:block; width: 1140px;margin:0 auto;}
.title1{font-size:48pt;color:#0477bd;font-family:'Roboto-Light'}
.title2{font-size:48pt;color:#0477bd;font-family:'Roboto-Black'}
.title3{font-size:24pt;color:#333;font-family:'Roboto-Medium'}
.introduce{padding-left:12%;padding-right:12%;text-align:center;line-height:150%}
@media (max-width: 1169px)
{
.contentpage {display:block; width: 90%;padding-left:5%;padding-right:5%}
}
@media (max-width: 800px)
{
.introduce{padding-left:5%;padding-right:5%;text-align:center;line-height:150%}
.banertop img{width:100%;height:auto}

.title1{font-size:38pt;color:#0477bd;font-family:'Roboto-Light'}
.title2{font-size:38pt;color:#0477bd;font-family:'Roboto-Black'}
.title3{font-size:14pt;color:#333;font-family:'Roboto-Medium'}
}

.bgSanve{background:url(/MicrositeBogoho/images/banner/bg01.jpg) no-repeat;height:700px;color:#fff;overflow:hidden}
.bgKHchaua{background:url(/MicrositeBogoho/images/banner/bg02.jpg) no-repeat;height:700px;overflow:hidden}
.bgVivuDNA{background:url(/MicrositeBogoho/images/banner/bg03.jpg) no-repeat;height:700px;overflow:hidden}
.bgChristmas{background:url(/MicrositeBogoho/images/banner/bg04.jpg) no-repeat;height:700px;overflow:hidden}
.bgDulichSanhdieu{background:url(/MicrositeBogoho/images/banner/bg05.jpg) no-repeat;height:700px;overflow:hidden}
.bgHaotaoDauxuan{background:url(/MicrositeBogoho/images/banner/bg06.jpg) no-repeat;height:700px;overflow:hidden}
.bgbox{background:#0162ae;width:60%;padding:30px;-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;}
.parallax{background-position:50% 0;background-repeat:no-repeat;background-size:auto auto;}
.section{padding-top:100px;width:1080px;margin:0 auto;}
.boxdiemdenWhite{float:left;background:none;border:1px solid #fff;padding:5px;margin-right:5px;font-size:10pt}
.boxdiemdenBlue{float:left;background:none;border:1px solid #0477bd;color:#0477bd;padding:5px;margin-right:5px;font-size:10pt}
.colorddtb{color:#0477bd}

/*box tour*/
.line-show{height:8px;background:#f8274f;width:100%;position:relative;margin:0 auto}
.iconshow{width:650px;position:relative;margin:0 auto;}
.iconshow:before{content: '';position:absolute;width: 0;height: 0; border: 12px solid transparent;border-top-color: #f8274f;top:0px;}
.boxtour {display:block;width:840px;margin:0 auto;padding:30px;}
.boxtour .titleleft{float:left;width:100%}
.boxtour .pax{float:left;width:0%}
.boxinfo {display:block;width:840px;margin:0 auto;padding:30px;height:600px;overflow:auto}

.titlehaitrinh{width:45%;background:#ececec;height:50px;line-height:50px;padding-left:3%;font-size:12pt;text-align:left;border-bottom:none}
.titleDKH{width:10%;background:#ffd500;height:50px;line-height:50px;font-size:12pt;text-align:center;border-bottom:none}
.titleCruise{width:30%;background:#333;height:50px;line-height:50px;font-size:12pt;text-align:center;color:#fff;border-bottom:none}
.titleFree{width:30%;background:#ff6600;height:50px;line-height:50px;font-size:12pt;text-align:center;color:#fff;border-bottom:none}
.titleFull{width:30%;background:#0066ff;height:50px;line-height:50px;font-size:12pt;text-align:center;color:#fff;border-bottom:none}

.versionMobile{display:none}
@media (max-width: 767px) {
    .titlehaitrinh,.titleDKH,.titleCruise,.titleFree,.titleFull{padding:10px;height:auto;line-height:20px}
}

.tentour {
    width: 45%;
    padding: 10px 0px 10px 0px;
    font-size: 11pt;
    padding-left: 3%;
    text-align: left;
    vertical-align: top;
}
.giatour{width:52%;}
    .giatour .dkh {
        width: 10%;
        height: 40px;
        line-height: 40px;
        font-size: 11pt;
        text-align: center;
        border-left: none;
        border-top: none;
        font-family: Arial
    }
.giatour .boxgiatour{width:30%;height:40px;line-height:40px;font-size:11pt;text-align:center;border-right:none;border-top:none;font-family:Arial}

.colorGiaPackage{color:#0066ff}
.colorGiaFree{color:#ff6600}
.colorGiaCruise{color:#333}
.boxgiatour a{
    font-size: 11.5pt;
}
 .boxgiatourMobile a {
    font-size: 11pt;
}
table.grid {
    border-collapse: collapse;
}
table.grid td, th{border:1px solid #d7d7d7;}
tr th {background-color:#e9e9e9;height:35px;color:#333333}

.noneborder{border:none}
.help{font-size:8pt;color:#999;line-height:20px;font-family:Arial}
.boxtour h1,.boxinfo h1{margin:0;padding:0;color:#fa264f;font-size:20pt;font-family:'Roboto-Black'}

/*Mobile*/
@media (max-width: 599px) {
.versionMobile{display:block}
.VersionDesktop{display:none}
.titlehaitrinhMobile{width:100%;background:#ececec;height:50px;line-height:50px;font-size:12pt;text-align:center;border-bottom:none}
.tentourMobile{width:90%; padding:30px 5% 10px 5%;font-size:12pt;text-align:left;vertical-align:top;}

.titleDKHMobile{width:13%;background:#ffd500;height:50px;line-height:50px;font-size:10pt;text-align:center;border-bottom:none}
.titleCruiseMobile{width:29%;background:#333;height:50px;line-height:50px;font-size:10pt;text-align:center;color:#fff;border-bottom:none}
.titleFreeMobile{width:29%;background:#ff6600;height:50px;line-height:50px;font-size:10pt;text-align:center;color:#fff;border-bottom:none}
.titleFullMobile{width:29%;background:#0066ff;height:50px;line-height:50px;font-size:10pt;text-align:center;color:#fff;border-bottom:none}

.giatourMobile{width:100%;font-size:10pt}
.giatourMobile .dkhMobile{width:13%;height:40px;line-height:40px;font-size:10pt;text-align:center;border-left:none;border-top:none;font-family:Arial}
.giatourMobile .boxgiatourMobile{width:29%;height:40px;line-height:40px;font-size:10pt;text-align:center;border-right:none;border-top:none;font-family:Arial}
}

/*End box tour*/
@media (max-width: 1169px) {
.parallax{background-position:30% 0;background-repeat:no-repeat;background-size:auto auto;}
.section{padding:50px 5% 50px 5%;width:90%;margin:0 auto}
}
.subtitle1{font-size:44pt;font-family:'Roboto-Black'}
.subtitle2{font-size:44pt;font-family:'Roboto-Light'}
.subtitle3{font-size:26pt;font-family:'Roboto-Regular'}
.subtitle4{font-size:32pt;font-family:'Roboto-Regular'}
@media (max-width: 320px) {
    .banertop {
        background-image: url(/MicrositeBogoho/images/banner/banner-top-mobile.webp);
        margin-left: 0%;
        background-size: cover;
        height: auto;
        min-height: 288px;
        background-repeat: no-repeat;
        background-position: center;
    }
.subtitle1{font-size:18pt;font-family:'Roboto-Black'}
.subtitle2{font-size:18pt;font-family:'Roboto-Light'}
.subtitle3{font-size:12pt;font-family:'Roboto-Regular'}
.subtitle4{font-size:16pt;font-family:'Roboto-Regular'}
}
@media (min-width: 321px) and (max-width: 480px) {
    .banertop {
        background-image: url(/MicrositeBogoho/images/banner/banner-top-mobile.webp);
        margin-left: 0%;
        background-size: cover;
        height: auto;
        min-height: 288px;
        background-repeat: no-repeat;
        background-position: center;
    }
}
@media (min-width: 481px) and (max-width: 599px) {
    .banertop {
        background-image: url(/MicrositeBogoho/images/banner/banner-top-mobile.webp);
        margin-left: 0%;
        background-size: cover;
        height: auto;
        min-height: 288px;
        background-repeat: no-repeat;
        background-position: center;
    }
}
@media (min-width: 600px) and (max-width: 767px) {
    .banertop {
        background-image: url(/MicrositeBogoho/images/banner/banner-top-mobile.webp);
        margin-left: 0%;
        background-size: cover;
        height: auto;
        min-height: 288px;
        background-repeat: no-repeat;
        background-position: center;
    }
}
@media (min-width: 768px) and (max-width: 800px) {
    .banertop {
        background-image: url(/MicrositeBogoho/images/banner/banner-top-mobile.webp);
        margin-left: 0%;
        background-size: cover;
        height: auto;
        min-height: 288px;
        background-repeat: no-repeat;
        background-position: center;
    }
}
@media (min-width: 321px) and (max-width: 600px) {
.subtitle1{font-size:22pt;font-family:'Roboto-Black'}
.subtitle2{font-size:22pt;font-family:'Roboto-Light'}
.subtitle3{font-size:14pt;font-family:'Roboto-Regular'}
.subtitle4{font-size:18pt;font-family:'Roboto-Regular'}
}
@media (max-width: 800px) {
    .bgbox {
        background: #0162ae;
        width: 90%;
        padding: 5%;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }
}
.colorBlue{color:#09acdf}
.colorWhite{color:#fff}
.colorYello{color:#ffe63b}
.colorDarkBlue{color:#0477bd}
.color666{color:#666}
.width50Percent{width:50%}
.bgtour{width:25%;text-align:center;padding:10px 0px 10px 0px;background:#fadb0c;-moz-border-radius: 50px;-webkit-border-radius: 50px;border-radius: 50px;cursor:pointer}
.bgtour a{font-size:16pt;color:#000;font-family:'Roboto-Bold'}
.bgtour:hover{background:#e7ca06}
.bgtour1{width:25%;text-align:center;padding:10px 0px 10px 0px;background:#fc691b;-moz-border-radius: 50px;-webkit-border-radius: 50px;border-radius: 50px;cursor:pointer}
.bgtour1 a{font-size:16pt;color:#fff;font-family:'Roboto-Bold'}
.bgtour1:hover{background:#ed5504}
.bgtour2{width:25%;text-align:center;padding:10px 0px 10px 0px;background:#fff1c7;-moz-border-radius: 50px;-webkit-border-radius: 50px;border-radius: 50px;cursor:pointer}
.bgtour2 a{font-size:16pt;color:#132f71;font-family:'Roboto-Bold'}
.bgtour2:hover{background:#eaddb5}
.bgcall{width:50%;text-align:center;padding:15px 0px 15px 0px;background:#0479be;color:#fff;font-size:18pt;font-family:'Roboto-Light';-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;margin:0 auto}
.bgcall span{font-family:'Roboto-Bold';font-size:24pt}
.divdes{width:25%;text-align:center;color:#fff;font-size:10pt}
.divdes1{width:25%;text-align:center;color:#000;font-size:10pt}
@media (max-width: 600px) {
.bgtour{width:100%}
.bgtour1{width:100%;}
.bgtour2{width:100%;}
.width50Percent{width:100%}
.bgcall{width:100%;}
.divdes{width:100%;}
.divdes1{width:100%;}
}
@media (min-width: 601px) and (max-width: 1024px) {
.bgtour{width:70%}
.bgtour1{width:70%;}
.bgtour2{width:70%;}
.width50Percent{width:70%}
.divdes{width:70%;}
.divdes1{width:70%;}
}
@media (max-width: 390px) {
.bgwhite1{float:left;margin-left:-15px;padding-left:5px;width:85%;background:#fff;height:auto;position:relative}
}

.font10pt{font-size:10pt}
.clear{clear:both}
.hr{margin-top:0;color:#ccc;border-left-style:none;border-right-style:none;border-top-style:none;border-bottom-style:dotted}
.lineheight{line-height:150%}
.center{text-align:center}
.numbertongdai{color:#ffd500;font-size:24pt;font-weight:bold;font-family:sans-serif}
.line{border-bottom:1px solid #ccc;padding-top:15px}
.top5px{padding-top:5px}
.top10px{padding-top:10px}
.top15px{padding-top:15px}
.top20px{padding-top:20px}
.top30px{padding-top:30px}
.top40px{padding-top:40px}
.top50px{padding-top:50px}
.top70px{padding-top:70px}
.bottom80px{padding-bottom:80px}

/* Footer */
.footer{width:100%;clear:both;background:#fff;padding-top:30px;padding-bottom:20px}
.menuFooter{width:1140px;margin:0 auto}
.menuFooter .logo{float:left;width:17%}
.menuFooter .menu{float:left;width:83%}
.menuFooter .menu a{float:left;padding-right:30px;white-space:nowrap;color:#0477bd;line-height:35px;font-family:Roboto-Medium;font-size:10pt}
.menuFooter .menu a:hover{color:#212654;text-decoration:underline}
.menuFooter .mxh{float:left;width:17%;padding-top:15px}
.menuFooter .office{float:left;width:100%;padding-top:15px}
    .menuFooter .office .column {
        float: left;
        width: 25%;
        font-size: 10.2pt;
        padding: 0 15px;
    }
    .menuFooter .office .column1 {
        float: left;
        width: 15%;
        font-size: 10pt;
    }
.infoContact{width:100%;padding-bottom:15px}
.infoContact .column{float:left;width:25%;font-size:10pt}

@media (max-width: 1169px)
{
.menuFooter{width:90%;padding-left:5%;padding-right:5%}
.line-show{height:8px;background:#f8274f;width:100%;position:relative;margin:0 auto}
.iconshow{width:70%;position:relative;padding-left:30%}
.iconshow:before{content: '';position:absolute;width: 0;height: 0; border: 12px solid transparent;border-top-color: #f8274f;top:0px;}
.boxtour {display:block;padding:30px 4% 30px 4%;width:92%}
}
@media (max-width: 480px) {
.menuFooter .logo{float:left;width:100%;text-align:center}
.menuFooter .menu{float:left;width:100%;text-align:center;padding-top:15px}
.menuFooter .menu a{float:left;padding-right:30px;white-space:nowrap;color:#0477bd;line-height:35px;font-family:Roboto-Medium;font-size:8pt}
.menuFooter .menu a:hover{color:#212654;text-decoration:underline}
.menuFooter .office{width:100%;padding-left:0%;padding-top:15px}
.menuFooter .office .column{float:left;width:100%;font-size:10pt;padding-top:15px}
.infoContact .column{float:left;width:100%;font-size:10pt}

.boxinfo {display:block;padding:30px 4% 30px 4%;width:92%;height:350px;overflow:auto}
}
@media (min-width: 481px) and (max-width: 800px)
{
.menuFooter .logo{float:left;width:100%;text-align:center}
.menuFooter .menu{float:left;width:100%;text-align:center;padding-top:15px}
.menuFooter .menu a{float:left;padding-right:15px;white-space:nowrap;color:#0477bd;line-height:35px;font-family:Roboto-Medium;font-size:10pt}
.menuFooter .office{width:100%;padding-left:0%;padding-top:15px}
.menuFooter .office .column{float:left;width:50%;font-size:10pt;padding-top:15px}
.infoContact .column{float:left;width:50%;font-size:10pt}
.boxinfo {display:block;padding:30px 4% 30px 4%;width:92%;height:500px;overflow:auto}
}
@media (min-width: 768px) and (max-width: 999px) {
.menuFooter .logo{float:left;width:25%}
.menuFooter .menu{float:left;width:75%;padding-top:0px}
}

/*Font*/
@font-face 
{
    font-family: 'Roboto-Light';
    src: local(Roboto-Light), url('/fonts/Roboto-Light.ttf') format('opentype');
}
@font-face 
{
    font-family: 'Roboto-Thin';
    src: local(Roboto-Thin), url('/fonts/Roboto-Thin.ttf') format('opentype');
}
@font-face 
{
    font-family: 'Roboto-Regular';
    src:url('/fonts/Roboto-Regular.ttf') format('truetype');
}
@font-face 
{
    font-family: 'Roboto-Black';
    src: local(Roboto-Black), url('/fonts/Roboto-Black.ttf') format('opentype');
}
@font-face 
{
    font-family: 'Roboto-Medium';
    src: local(Roboto-Medium), url('/fonts/Roboto-Medium.ttf') format('opentype');
}
@font-face 
{
    font-family: 'Roboto-Bold';
    src: local(Roboto-Bold), url('/fonts/Roboto-Bold.ttf') format('opentype');
}
.font-medium{font-family:'Roboto-Medium'}
.arial{font-family:Arial}
.banertop img{

}
.top-hotline{

}
.top-hotline span{

}
    .top-hotline span a{
    }
.bgtour_thele {
}
    .bgtour_thele:hover {
        background: linear-gradient( 90deg, #d142c8 0%, /* tím hồng */
        #f47e32 40%, /* cam đậm */
        #fbd436 70%, /* vàng sáng */
        #fff176 100% /* vàng nhạt gần trắng */
        );
        color: #0c214d;
    }
.bgtour_thele {
    background: #f9c700 !important;
    color: rgb(0, 0, 102);
    font-weight: 600;
    text-transform: none;
    padding: 10px 10px;
    font-size: 17px;
}
.top10px_cus{

}
.top15px {
    padding-top: 15px;
}
.top10px_cus {
    display: block;
    width: 100%;
    float: left;
}
.line-through {
    text-decoration: line-through;
}
.contact-lh {
    color: gray;
    display:none;
}
.link-detail-tour {
    color: #18234c;
    font-weight: bold;
    display: block;
}