@charset "utf-8";
/*------------------------------------*\
	General
\*------------------------------------*/
/* -- typography -- */
body{font-family:'Varela Round',sans-serif;font-size:16px;line-height:1.6;overflow-x:hidden;color:#868F9B;}
h1,h2,h3,h4,h5,h6{font-family:'Montserrat',sans-serif;font-weight:700;margin-top:0px;margin-bottom:20px;color:#10161A;}
h1,.h1{font-size:54px;}
h2,.h2{font-size:36px;}
h3,.h3{font-size:21px;}
h4,.h4{font-size:18px;}
h5,.h5{font-size:16px;}
a{color:#1a73e8;text-decoration:none;-webkit-transition:0.2s opacity;transition:0.2s opacity;}
a:hover,a:focus{text-decoration:none;outline:none;opacity:0.8;color:#1a73e8;}
.main-color{color:#1a73e8;}
.d-none{display:none!important;}
.text-light,.text-white{color:#FFF;}
::-moz-selection{background-color:#1a73e8;color:#FFF;}
::selection{background-color:#1a73e8;color:#FFF;}
ul,ol{margin:0;padding:0;list-style:none}
/* -- section -- */
.section{position:relative;}
.mx-1{margin:auto 5px;}
.me-1{margin-right:5px;}
.my-1{margin-top:5px;margin-bottom:5px;}
.mt-1{margin-top:5px!important;}
.mt-2{margin-top:10px!important;}
.mt-3{margin-top:50px!important;}
.mb-1{margin-bottom:5px;}
.mb-0{margin-bottom:0px;}
.py-5,.md-padding{padding-top:80px;padding-bottom:80px;}
.py-4,.sm-padding{padding-top:60px;padding-bottom:60px;}
.py-3{padding-top:50px;padding-bottom:50px;}
/* -- background section -- */
.bg-grey{background-color:#FAFAFA;border-top:1px solid #EEE;border-bottom:1px solid #EEE;}
.bg-dark{background-color:#1C1D21;}
/* -- background image section -- */
.bg-img{position:absolute;left:0;top:0;right:0;bottom:0;z-index:-1;background-position:center;background-size:cover;background-attachment:fixed;}
.bg-img .overlay{position:absolute;left:0;top:0;right:0;bottom:0;opacity:.8;background:#1C1D21;}
#home .bg-img{background-image:url('../imgs/background1.jpg');}
#team .bg-img{background-image:url('../imgs/background2.jpg');}
/* -- section header  -- */
.section-header{position:relative;margin-bottom:50px;}
.section-header .title{text-transform:capitalize;}
.title:after{content:"";display:block;height:4px;width:40px;background-color:#1a73e8;margin-top:20px;}
.text-center .title:after{margin:20px auto 0px;}
/* -- Input -- */
input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="url"],input[type="tel"],textarea{height:40px;width:100%;border:none;background:#F4F4F4;border-bottom:2px solid #EEE;color:#354052;padding:0px 10px;opacity:0.5;-webkit-transition:0.2s border-color,0.2s opacity;transition:0.2s border-color,0.2s opacity;}
textarea{padding:10px 10px;min-height:80px;resize:vertical;}
input[type="text"]:focus,input[type="email"]:focus,input[type="password"]:focus,input[type="number"]:focus,input[type="date"]:focus,input[type="url"]:focus,input[type="tel"]:focus,textarea:focus{border-color:#1a73e8;opacity:1;}
/* -- Buttons -- */
.main-btn,.white-btn,.outline-btn{display:inline-block;padding:10px 35px;margin:3px;border:2px solid transparent;border-radius:3px;-webkit-transition:0.2s opacity;transition:0.2s opacity;}
.main-btn{background:#1a73e8;color:#FFF;}
.white-btn{background:#FFF;color:#10161A!important;}
.outline-btn{background:transparent;color:#1a73e8!important;border-color:#1a73e8;}
.main-btn:hover,.white-btn:hover,.outline-btn:hover{opacity:0.8;}
/* -- Logo -- */
.navbar-brand{padding:0;}
.navbar-brand .logo,.navbar-brand .logo-alt{max-height:50px;display:block;}
#nav:not(.nav-transparent):not(.fixed-nav) .navbar-brand .logo-alt{display:none;}
#nav.nav-transparent:not(.fixed-nav) .navbar-brand .logo{display:none;}
#nav.fixed-nav .navbar-brand .logo-alt,.screen-reader-text{display:none;}
@media only screen and (max-width:767px){#nav.nav-transparent .navbar-brand .logo-alt{display:none!important;}
#nav.nav-transparent .navbar-brand .logo{display:block!important;}
.media-left img{height:40px!important;width:40px!important;margin:0!important;}
.media-body p,.media-body .reply{display:none;}
}
/* -- Nav -- */
#nav{padding:10px 0px;background:#FFF;-webkit-transition:0.2s padding;transition:0.2s padding;z-index:999;}
#nav.navbar{border:none;border-radius:0;margin-bottom:0px;}
#nav.fixed-nav{position:fixed;left:0;right:0;padding:0px 0px;background-color:#FFF!important;border-bottom:1px solid #EEE;}
#nav.nav-transparent{background:transparent;}
/* -- default nav -- */
@media only screen and (min-width:768px){.main-nav li{padding:0px 15px;}
.main-nav li a{font-size:14px;-webkit-transition:0.2s color;transition:0.2s color;}
.main-nav>li>a{color:#10161A;padding:15px 0px;}
#nav.nav-transparent:not(.fixed-nav) .main-nav>li>a{color:#fff;}
.main-nav>li>a:hover,.main-nav>li>a:focus,.main-nav>li.active>a{background:transparent;color:#1a73e8;}
.main-nav>li>a:after{content:"";display:block;background-color:#1a73e8;height:2px;width:0%;-webkit-transition:0.2s width;transition:0.2s width;}
.main-nav>li>a:hover:after,.main-nav>li.active>a:after{width:100%;}
/* -- dropdown -- */
.has-dropdown{position:relative;}
.has-dropdown>a:before{font-family:'bootstrap-icons';content:"\f285";font-size:6px;margin-left:6px;float:right;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);-webkit-transition:0.2s transform;transition:0.2s transform;}
.dropdown{position:absolute;right:-50%;top:0;background-color:#1a73e8;/*width:200px;*/width:100px;-webkit-box-shadow:0px 5px 5px -5px rgba(53,64,82,0.2);box-shadow:0px 5px 5px -5px rgba(53,64,82,0.2);-webkit-transform:translateY(15px) translateX(50%);-ms-transform:translateY(15px) translateX(50%);transform:translateY(15px) translateX(50%);opacity:0;visibility:hidden;-webkit-transition:0.2s all;transition:0.2s all;}
.main-nav>.has-dropdown>.dropdown{top:100%;right:50%;}
.main-nav>.has-dropdown>.dropdown .dropdown.dropdown-left{right:150%;}
.dropdown li a{display:block;color:#FFF;border-top:1px solid rgba(250,250,250,0.1);padding:10px 0px;}
.dropdown li:nth-child(1) a{border-top:none;}
.has-dropdown:hover>.dropdown{opacity:1;visibility:visible;-webkit-transform:translateY(0px) translateX(50%);-ms-transform:translateY(0px) translateX(50%);transform:translateY(0px) translateX(50%);}
.has-dropdown:hover>a:before{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
.nav-collapse{display:none;}
}
/* -- mobile nav -- */
@media only screen and (max-width:767px){#nav{padding:0px 0px;}
#nav.nav-transparent{background:#FFF;}
.main-nav{position:fixed;right:0;height:calc(100vh - 80px);-webkit-box-shadow:0px 80px 0px 0px #1C1D21;box-shadow:0px 80px 0px 0px #1C1D21;/*max-width:250px;*/
max-width:150px;width:0%;-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);margin:0;overflow-y:auto;background:#1C1D21;-webkit-transition:0.2s all;transition:0.2s all;}
#nav.open .main-nav{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%);width:100%;}
.main-nav li{border-top:1px solid rgba(250,250,250,0.1);}
.main-nav li a{display:block;color:#FFF;-webkit-transition:0.2s all;transition:0.2s all;}
.main-nav>li.active{border-left:6px solid #1a73e8!important;}
.main-nav li a:hover,.main-nav li a:focus{background-color:#1a73e8;color:#FFF;opacity:1;}
.has-dropdown>a:after{font-family:'bootstrap-icons';content:"\f285";float:right;-webkit-transition:0.2s -webkit-transform;transition:0.2s -webkit-transform;transition:0.2s transform;transition:0.2s transform,0.2s -webkit-transform;}
.dropdown{opacity:0;visibility:hidden;height:0;background:rgba(250,250,250,0.1);}
.dropdown li a{padding:6px 10px;}
.has-dropdown.open-drop>a:after{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}
.has-dropdown.open-drop>.dropdown{opacity:1;visibility:visible;height:auto;-webkit-transition:0.2s all;transition:0.2s all;}
}
/* -- nav btn collapse -- */
.nav-collapse{position:relative;float:right;width:40px;height:40px;margin-top:5px;margin-right:5px;cursor:pointer;z-index:99999;}
.nav-collapse span{display:block;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:absolute;top:50%;left:50%;width:25px;}
.nav-collapse span:before,.nav-collapse span:after{content:"";display:block;}
.nav-collapse span,.nav-collapse span:before,.nav-collapse span:after{height:4px;background:#10161A;-webkit-transition:0.2s all;transition:0.2s all;}
.nav-collapse span:before{-webkit-transform:translate(0%,10px);-ms-transform:translate(0%,10px);transform:translate(0%,10px);}
.nav-collapse span:after{-webkit-transform:translate(0%,-14px);-ms-transform:translate(0%,-14px);transform:translate(0%,-14px);}
#nav.open .nav-collapse span{background:transparent;}
#nav.open .nav-collapse span:before{-webkit-transform:translateY(0px) rotate(-135deg);-ms-transform:translateY(0px) rotate(-135deg);transform:translateY(0px) rotate(-135deg);}
#nav.open .nav-collapse span:after{-webkit-transform:translateY(-4px) rotate(135deg);-ms-transform:translateY(-4px) rotate(135deg);transform:translateY(-4px) rotate(135deg);}
/* -- header -- */
header{position:relative;}
#home{height:100vh;}
#home .home-wrapper{position:absolute;left:0px;right:0px;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);text-align:center;}
.home-content h1{text-transform:uppercase;}
.home-content button{margin-top:20px;}
.header-wrapper {
  border-top: #eee 1px solid;
  position: relative;
  background: url('../imgs/banner.jpg') center center;
  background:
    linear-gradient(-45deg, rgba(16, 22, 26, 0.9), rgba(255, 255, 255, 0.15), rgba(16, 22, 26, 0.9), rgba(255, 255, 255, 0.15)),
    url('../imgs/banner.jpg') center center;
  background-size: 400% 400%, cover;
  animation: gradientBG 8s ease infinite; /
}
.header-wrapper h2{display:inline-block;margin-bottom:0px;}
.header-wrapper .breadcrumb{float:right;background:transparent;margin-bottom:0px;}
.header-wrapper .breadcrumb .breadcrumb-item.active{color:#868F9B;}
.breadcrumb>li+li:before{color:#868F9B;}
/* =========================================
   定义渐变背景的运动关键帧动画
   ========================================= */
@keyframes gradientBG {
  0% { background-position: 0% 50%, center center; }
  50% { background-position: 100% 50%, center center; }
  100% { background-position: 0% 50%, center center; }
}
/*------------------------------------*\
	Home
\*------------------------------------*/
/* -- About -- */
.feature{margin:15px 0px;}
.feature i{float:left;padding:0 5px;border-radius:50%;color:#1a73e8;border:1px solid #1a73e8;margin-right:5px;}
/* -- Photos -- */
.pic{position:relative;padding:20px;}
.pic>img{width:100%;}
.pic .overlay{background:#1C1D21;position:absolute;top:0px;left:0px;right:0px;bottom:0px;opacity:0;-webkit-transition:0.2s opacity;transition:0.2s opacity;-webkit-transition-delay:0.2s;transition-delay:0.2s;}
.pic:hover .overlay{-webkit-transition-delay:0s;transition-delay:0s;opacity:0.8;}
.pic .pic-content{position:absolute;left:25px;right:25px;top:50%;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.pic .pic-content h3{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;color:#FFF;margin-bottom:10px;-webkit-transition:0.2s all;transition:0.2s all;-webkit-transition-delay:0.1s;transition-delay:0.1s;}
.pic:hover .pic-content h3{-webkit-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%);opacity:1;-webkit-transition-delay:0.1s;transition-delay:0.1s;}
.pic .pic-content span{display:block;text-transform:uppercase;-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;color:#1a73e8;margin-bottom:5px;-webkit-transition:0.2s all;transition:0.2s all;-webkit-transition-delay:0.2s;transition-delay:0.2s;}
.pic:hover .pic-content span{-webkit-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%);opacity:1;-webkit-transition-delay:0s;transition-delay:0s;}
.pic .pic-link{text-align:center;margin-top:20px;opacity:0;-webkit-transition:0.2s opacity;transition:0.2s opacity;}
.pic .pic-link a{display:inline-block;width:50px;height:50px;background-color:#1a73e8;color:#FFF;line-height:50px;text-align:center;}
.pic:hover .pic-link{-webkit-transition-delay:0.2s;transition-delay:0.2s;opacity:1;}
/* -- Results -- */
.result{position:relative;padding:40px 20px 40px 70px;margin:15px 0px;border:1px solid #EEE;}
.result i{position:absolute;left:20px;text-align:center;font-size:32px;color:#1a73e8;border-radius:50%;}
.result:after{content:"";background-color:#1C1D21;position:absolute;left:0;top:0;bottom:0;width:0%;z-index:-1;-webkit-transition:0.2s width;transition:0.2s width;}
.result:hover:after{width:100%;}
.result h3{-webkit-transition:0.2s color;transition:0.2s color;}
.result:hover h3{color:#fff;}
/* -- Course -- */
.course{position:relative;text-align:center;border:1px solid #EEE;background-color:#FFF;z-index:11;margin:15px 0px;}
.course::after{content:"";background-color:#1C1D21;position:absolute;left:0;right:0;top:0;height:0%;z-index:-1;-webkit-transition:0.2s height;transition:0.2s height;}
.course:hover:after{height:100%;}
.course .price-head{position:relative;margin-bottom:20px;}
.course .price-title{display:block;padding:40px 0px 20px;text-transform:uppercase;-webkit-transition:0.2s color;transition:0.2s color;}
.course:hover .price-title{color:#1a73e8;}
.course .price{position:relative;width:140px;height:140px;line-height:140px;text-align:center;margin:auto;border-radius:50%;border:2px solid #1a73e8;}
.course .price h3{font-size:42px;margin:0px;-webkit-transition:0.2s color;transition:0.2s color;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);top:50%;position:absolute;left:0;right:0;}
.course:hover .price h3{color:#fff;}
.course .duration{display:block;font-size:14px;text-transform:uppercase;color:#10161A;-webkit-transition:0.2s color;transition:0.2s color;}
.course:hover .duration{color:#fff;}
.course .price-btn{padding-top:20px;padding-bottom:40px;}
/* -- Team -- */
.team{margin:15px 0px;}
.team-meta{position:relative;padding-left:90px;height:70px;margin-bottom:20px;padding-top:10px;}
.team img{position:absolute;left:0;top:0;width:70px!important;height:70px!important;border-radius:50%;}
.team h3{margin-bottom:5px;}
.team span{font-size:14px;color:#1a73e8;text-transform:uppercase;}
/* =========================================
   Bootstrap 原生轮播圆点 (全局美化)
   ========================================= */
.carousel-indicators li {
    background-color: #EEE; /* 还原原本未选中的灰色 */
    border: none; /* 去除 Bootstrap 默认的白边 */
    width: 10px;
    height: 10px;
    margin: 1px 5px;
    border-radius: 50%;
    transition: 0.2s all; /* 还原原本平滑的变长动画 */
}

/* 选中状态的长条形圆点特效 */
.carousel-indicators .active {
    background-color: #1a73e8 !important; /* 还原原本选中的蓝色 */
    width: 20px !important; /* 宽度拉长 */
    border-radius: 10px !important;
    border: none !important;
    margin: 1px 5px !important;
}

/* =========================================
   仅针对老师轮播 (#team-slider) 单独向下偏移
   ========================================= */
#team-slider {
    padding-bottom: 40px; /* 在轮播区块底部腾出 40px 的安全空间 */
}

#team-slider .carousel-indicators {
    bottom: -10px; /* 将圆点向下推到文字外边 */
}
/* =========================================
   自定义原生图片放大弹窗 (替代 Magnific Popup)
   ========================================= */
.custom-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85); /* 黑色半透明背景 */
    z-index: 999999; /* 保证在页面最上层 */
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: zoom-out; /* 提示用户点击可以缩小/关闭 */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* 激活状态 */
.custom-lightbox-overlay.show {
    opacity: 1;
    visibility: visible;
}

/* 弹窗内的图片约束与绝对居中 */
.custom-lightbox-overlay img {
    position: absolute;
    top: 50%;
    left: 50%;
    /* 使用 translate 将图片自身尺寸的一半向左上平移，实现完美居中，同时保持0.9的初始缩放 */
    transform: translate(-50%, -50%) scale(0.9);
    max-width: 90%;
    max-height: 90vh;
    box-shadow: 0 5px 25px rgba(0,0,0,0.5);
    border-radius: 4px;
    transition: transform 0.3s ease;
}

/* 图片弹出的缩放动画 (依然保持居中) */
.custom-lightbox-overlay.show img {
    transform: translate(-50%, -50%) scale(1);
}
/*------------------------------------*\
	Blog List
\*------------------------------------*/
.page-header{border-bottom: 0;margin: 0;padding: 0;}
.page-title{font-size:30px;}
/* -- Blog list -- */
.blog-list{margin:20px 0px;background-color:#FFF;}
.blog-list .media{padding:20px;border:1px solid #EEE;border-bottom:0px;margin-top:0px;}
.blog-list .media:first-child{border-bottom:0px;}
.blog-list .media:last-child{border-bottom:1px solid #EEE;}
.blog-list .media .media-left{padding-right:20px;}
.blog-list .media .media-body .media-heading{text-transform:uppercase;margin-bottom:10px;}
.blog-list .media .media-body .media-heading .time{font-size:12px;margin-left:20px;font-weight:400;color:#868F9B;}
.blog-list .media .media-body .media-heading .reply{float:right;margin:0;font-size:12px;text-transform:uppercase;font-weight:400;}
.blog-list .media.author{background-color:#F4F4F4;border-color:#1a73e8;border-bottom:1px solid #1a73e8;}
.blog-list .media.author>.media-body>.media-heading{color:#1a73e8;}
.blog-list .media.author + .media{border-top:0px;}

/*------------------------------------*\
	Blog Post
\*------------------------------------*/
.blog{margin:0 0 15px 0;background-color:#FFF;}
.blog-title{font-size:30px;}
.blog-meta{margin-bottom:20px;}
.blog-meta li{display:inline-block;font-size:14px;color:#10161A;margin-right:10px;}
.blog-meta li i{color:#1a73e8;margin-right:5px;}
.blog-content {padding: 10px 0px 0px;}
.blog-content p{text-indent:2em;}
.blog-content img{max-width:100%;height:auto;display:block;margin:0 auto!important;}
/* -- Blog tags -- */
.blog-tags{margin:40px 0px;}
.blog-tags h5{margin-bottom:0;display:inline-block;}
.blog-tags a{display:inline-block;padding:6px 13px;font-size:14px;margin:2px 0px;background:#F4F4F4;color:#10161A;}
.blog-tags a:hover{color:#FFF;background-color:#1a73e8;}
.blog-tags a i{margin-right:3px;color:#1a73e8;}
.blog-tags a:hover i{color:#FFF;}

/* -- blog author -- */

.blog-author {
    margin: 40px 0px;
}

.blog-author .media .media-left {
    padding-right: 20px;
}

.blog-author .media {
    padding: 20px;
    border: 1px solid #EEE;
}

.blog-author .media .media-heading {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #EEE;
}

.blog-author .media .media-heading h3 {
    display: inline-block;
    margin: 0;
    text-transform: uppercase;
}

.blog-author .media .media-heading .author-social {
  float: right;
}

.blog-author .author-social a {
    display: inline-block;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 3px;
    margin-left: 5px;
    color: #FFF;
    background-color: #6195FF;
}
/* 自定义圆形头像容器 */
.avatar-circle {
    width: 46px;              /* 根据你的需求调整尺寸 */
    height: 46px;
    line-height: 46px;        /* 与高度一致，实现简单垂直居中 */
    border-radius: 50%;       /* 强制圆形 */
    overflow: hidden;         /* 确保内部图片不溢出 */
    display: flex;            /* 使用 Flexbox 实现完美的水平垂直居中 */
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;              /* 默认文字颜色 */
    font-size: 16px;          /* 默认文字大小 */
    font-weight: bold;
    flex-shrink: 0;           /* 防止在 media object 中被挤压 */
}

/* 确保内部图片填满容器 */
.avatar-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* -- Comments -- */
.blog-comments {margin: 40px 0px;}
.blog-comments .media {padding: 20px;background-color: #FFF;border-top: 1px solid #EEE;border-bottom: 0px;border-right: 1px solid #EEE;border-left: 1px solid #EEE;margin-top: 0px;}
.blog-comments .media:first-child {border-bottom: 0px;}
.blog-comments .media:last-child {border-bottom: 1px solid #EEE;}
.blog-comments .media .media-left {padding-right: 20px;}
.blog-comments .media .media-body .media-heading {text-transform: uppercase;margin-bottom:10px;}
.blog-comments .media .media-body .media-heading .time {font-size: 12px;margin-left: 20px;font-weight: 400;color: #868F9B;}
.blog-comments .media .media-body .media-heading .reply {float: right;margin: 0;font-size: 12px;text-transform: uppercase;font-weight: 400;}
.blog-comments .media.author {background-color: #F4F4F4;border-color: #6195FF;border-bottom: 1px solid #6195FF;}
.blog-comments .media.author>.media-body>.media-heading {color: #6195FF;}
.blog-comments .media.author + .media {border-top: 0px;}
/* post reply form */
.reply-form {margin: 40px 0px;}
.reply-form form .input, .reply-form form .input , .reply-form form textarea {margin-bottom:20px;}
.reply-form form .input, .reply-form form .input {width: calc(50% - 10px);display: inline-block;}
.reply-form form .input:nth-child(2) {margin-left: 15px;}
/* -- Tags -- */
.tag-cloud-wrap {
  background: #fff; border: 1px solid #e4ede9;
  border-radius: 32px; padding: 2.5rem;
  box-shadow: 0 2px 20px rgba(10,102,64,.08),  0 1px 4px rgba(10,102,64,.04);
}
.cloud-tag {
  display: inline-flex; align-items: center; gap: .35rem;
  margin: 4px;
  border-radius: 99px; border: 1px solid;
  font-weight: 600; cursor: pointer;
  transition: all .28s cubic-bezier(.4,0,.2,1); line-height: 1;
  text-decoration: none;
}
.cloud-tag:hover {
  filter: brightness(0.9);
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 4px 15px rgba(0,0,0,.1);
}

/* -- Blog sidebar -- */

aside .widget{margin-bottom:40px;}
.widget h3{text-transform:uppercase;}
/* -- search sidebar -- */
aside .widget-search{position:relative;}
aside .widget-search .search-input{padding-right:50px;}
aside .widget-search .search-btn{position:absolute;right:0px;bottom:0px;width:40px;height:40px;border:none;line-height:40px;background-color:transparent;color:#6195FF;}
/* -- category sidebar -- */
.widget-category a{display:block;font-size:14px;color:#354052;border-bottom:1px solid #EEE;padding:5px;}
.widget-category a:nth-child(1){border-top:1px solid #EEE;}
.widget-category a span{float:right;color:#1a73e8;}
.widget-category a:hover{color:#1a73e8;}
/* -- tags sidebar -- */
.widget-tags a{display:inline-block;padding:6px 13px;font-size:14px;margin:2px 0px;background:#F4F4F4;color:#10161A;}
.widget-tags a:hover{color:#FFF;background-color:#1a73e8;}
/* -- posts sidebar -- */
.widget-post{min-height:70px;margin-bottom:25px;}
.widget-post img{display:block;float:left;margin-right:10px;margin-top:5px;}
.widget-post a{display:block;color:#10161A;}
.widget-post a:hover{color:#1a73e8;}
.widget-post .blog-meta{display:inline-block;}
.widget-post .blog-meta li{display:inline-block;margin-right:5px;color:#1a73e8;font-size:12px;}
.widget-post li i{color:#1a73e8;margin-right:5px;}
/* -- Contact -- */
.contact{margin:15px 0px;text-align:center;}
.contact i{font-size:36px;color:#1a73e8;margin-bottom:20px;}
/**
* Footer
*/
#footer{position:relative;}
#footer a{color:#868f9b;}
.footer-link{text-align:center;margin-bottom:20px;}
.footer-link li{display:inline-block;margin-right:10px;margin-bottom:8px;font-size:13px;font-style:normal;}
.footer-link li a{text-align:center;}
.footer-copyright p{text-align:center;font-size:14px;text-transform:uppercase;margin:0;}
/* -- Back to top -- */
#back-to-top{display:none;position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:50px;text-align:center;background:#1a73e8;border-radius:3px;color:#FFF;z-index:9999;-webkit-transition:0.2s opacity;transition:0.2s opacity;cursor:pointer;}
#back-to-top:after{font-family:'bootstrap-icons';content:"\f286";}
#back-to-top:hover{opacity:0.8;}
/* -- Responsive -- */
@media only screen and (max-width:991px){}
@media only screen and (max-width:767px){.section-header h2.title{font-size:31.5px;}
.main-btn,.default-btn,.outline-btn,.white-btn{padding:8px 22px;font-size:14px;}
.home-content h1{font-size:36px;}
.header-wrapper h2{margin-bottom:20px;text-align:center;display:block;}
.header-wrapper .breadcrumb{float:right;}
}
@media only screen and (max-width:480px){#photo [class*='col-xs']{width:100%;}
.blog-list .media .media{margin:0px -15px;}
}

/*------------------------------------*\
	Chat Support
\*------------------------------------*/
.cs-wrap { position: fixed; right: 10px; top: 20%; z-index: 1050; }
/* 侧边窄按钮 */
#cs-mini-btn {width: 34px; padding: 12px 4px; color: #fff; background: #337ab7;font-size:14px;cursor: pointer; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.2);}
/* 仿IM窗口面板 */
#cs-main-panel {width: 150px; display: none; margin-bottom: 0;box-shadow: 0 5px 20px rgba(0,0,0,0.15); border: none;}
/* Panel头部美化 */
#cs-main-panel .panel-heading { padding: 8px 10px; background: #337ab7; color: #fff; border: none; }
#cs-main-panel .panel-title { font-size: 14px; display: flex; justify-content: space-between; align-items: center; }
/* 列表项微调 */
#cs-main-panel .list-group-item {padding: 8px 12px; font-size: 13px; border-left: none; border-right: none; transition: 0.2s;}
#cs-main-panel .list-group-item:hover { background: #f5f5f5; color: #d9534f; }
/* 分组标题（类似IM分组） */
.cs-group-label { background: #f8f8f8 !important; font-size: 13px !important; color: #888; border: none !important; }