/*
Theme Name : Creative
Author: root@chuangtu.com
Author URI: https://wndwp.com
Description: ChuangTu.com WordPress business Theme Based On Wnd-Frontend
Version: 0.1.10
*/

html{height: 100%;}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Microsoft YaHei', sans-serif;
/*font-family: sans-serif,"Helvetica Neue",Helvetica,Arial,sans-serif;*/
/*font-family: Arial, Helvetica, sans-serif;*/
background: #EFEFEF; color: #333; font-size: 15px; word-wrap: break-word; word-break: break-all;
overflow-x: hidden;
}
#site-title a {
    font-weight: bold; color: #333;
}

img {image-rendering: pixelated; image-rendering: -moz-crisp-edges;}
img.thumbnail,img.avatar,.thumbnail img,.avatar img{border-radius: 10px;}
.avatar, .post-list .thumbnail,#banner .thumbnail,.company-list-simple .thumbnail,.people-list-simple .thumbnail{
    /*box-shadow: 0 0 8px 0 rgba(0,0,0,.1);*/
    /*border:1px solid #E5E5E5;*/
    /*padding: 10px;*/
    /*background: #FFF;*/
    padding:0;
}

#top{
/*box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);*/
border-bottom: 0px solid #333 ;
background: #FFF;
box-shadow: 0 0 8px 0 rgba(0,0,0,.3);
}
#top-bar{padding: 0.5rem 0;border-bottom: 1px solid #EEE;}
/*#top .post-type-tabs {font-weight: 600;}*/
#top .tabs li:not(:last-child){margin-right: 2rem;}
#top .tabs ul{border: none;padding-bottom:1px;}
#top .tabs .icon {margin: 0;}
#top .tabs ul li a{border-bottom: #FFF 2px solid;padding: 0.5rem 0.5rem;}
#top .tabs li.is-active a,#top .tabs li a:hover {border-bottom: #FDAB0E 2px solid;}

#banner{
    /*box-shadow: 0 0px 8px 0px rgba(0, 0, 0, 0.3);*/
    /*margin-bottom: 1rem;*/
    border-bottom: 1px solid #EEE;
    margin-top: 1px;
    background: #FFF;
    /*url('static/images/banner.jpg') */
    /*no-repeat top center;*/
    /*background-size: cover;*/
    /*url('https://img1.wsimg.com/Sitecore/3/D/marq-photo-godaddy-hosting-products-mrq-440-r6-7-8.jpg') no-repeat top center;*/
    /*url('http://127.0.0.1/wordpress/wp-content/uploads/2019/10/file5daeb6081f066.jpg') no-repeat top center;*/
    /*height: 400px;*/
}
.wnd-message .message-body{border:none;}

.home #banner{
    margin-top: 0px;
    background: #F9F9F9
    url('static/images/banner-2.jpg')
    no-repeat center center;
    background-size: cover;
    /*url('https://img1.wsimg.com/Sitecore/3/D/marq-photo-godaddy-hosting-products-mrq-440-r6-7-8.jpg') no-repeat top center;*/
    /*url('http://127.0.0.1/wordpress/wp-content/uploads/2019/10/file5daeb6081f066.jpg') no-repeat top center;*/
    height: 500px;
}

#banner .columns{height:100%;}

/*#searchform input{border: 2px solid #FDAB0E;}*/
#searchform input:focus{outline: none;}

#wrap {flex: 1;width: 100%;}
/*#wrap>.columns{}*/
.home #wrap{max-width: 100%;padding: 0;}
body{display: flex;flex-direction: column;min-height: 100%;}
.breadcrumb-wrap.columns{margin: 0 -.75rem 0;}

body.single main.box, .comments.box, footer.box{padding: 50px 10%;}
body.page main.box{padding: 50px}

 .sidebar { min-width: 250px;} 
/*.sidebar a { color: #333 }*/
/* .sidebar .columns{margin: 0;} */
/*#right-sidebar{margin-left: 1rem;}*/
/*#left-sidebar{margin-right: 1rem;}*/

/*侧边栏*/
#sidebar-menu {
    max-width: 100%;
    width: 380px;
    position: fixed;
    top: 0;
    left: -380px;
    background: #FFF;
    height: 100%;
    overflow: auto;
    z-index: 32;
    padding-bottom: 2rem;
}
#sidebar-menu .menu{font-size: 15px;padding: 10px;}
#sidebar-menu .menu-list li ul{
    display: flex; 
    flex-wrap: wrap;
}
#sidebar-menu .menu-list li ul li{
    width: 50%;
}
#modal-background{z-index: 31}

.menu-box.box {
  box-shadow: 0 .5em 1em -.125em #eee;
  padding: 1rem;
}

#footer {
    margin-top: 30px;
    color: #999;
    padding: 2rem 0 0.5rem;
    font-size: 0.9rem;
    border-top: 1px solid #EEE;
    line-height: 1.6rem;
    background: transparent;
}
#footer .content ul{list-style: none;}
#footer a{color: #777;}
#footer .bookmarks .column{padding-top: 0}

/*限制最大宽度*/
.narrow-container { max-width: 1000px; margin: 0 auto }
.narrow-form { max-width: 500px; margin: 0 auto; }

.home .container.box{color:#999;padding: 2rem;}
.home .content li{list-style: none;}
.home .content ul{list-style: none;}
.home .post-list .excerpt{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.single-people #banner .box{padding-top: 100px;margin-top: -100px;}

/*图标*/
/*.icon { margin: 0 3px; }*/
/*#top .icon,.address .icon,.message .icon,{ color: #FDAB0E }*/
.icon{color: #FDAB0E;}
.button .icon{all: unset; }
.menu-list .is-active .icon{color: #FFF;}

/*表单及弹出对话框*/
.ajax-message { text-align: center; }
.ajax-message .message { text-align: center; margin-bottom: 1rem; }
.alert-message { text-align: center; color: #FFF; }
.modal-entry { transition: all 0.1s; }
.is-active .modal-content { border-radius: 5px; }
.is-grouped-centered .button { min-width: 160px;margin-bottom: 10px;}
form li { white-space: nowrap; }
.required { font-weight: bold; color: #F00 }
/*.tag-editor { border-bottom: 1px solid #DDD; }*/

/* 登录注册表单宽度控制 */
.user-form,.min-modal { max-width: 400px; margin: 0 auto; }

/* .box-shadow{box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);} */

/*
********************************************************
demand
 */

/**
*
********************************************覆盖bulma框架样式
*/

/*禁止flex容器被元素撑破*/
/*.column{  flex: 1; overflow: hidden;}*/

/*table a{color: #0AA2E0;}*/
a{ color: #333; }
.single .content a:not(.button){color: #FDAB0E;}
.breadcrumb a,form a { color: #333; }
a:focus {outline:none;}
a::-moz-focus-inner {border:0;}
a:hover, .breadcrumb a:hover {color:#FDAB0E;text-decoration: none; }

.box:not(.box .box) {
box-shadow:none;border-radius:0;
}

.navbar-burger {display: block;height: auto;}
.navbar-burger:hover {background: transparent;}
.navbar-burger span {
    height: 2px;
    width: 20px;
    left: calc(50% - 10px);
}
.navbar-item img {
  max-height: 100%;
}
#top i, #footer i{
    color: #FDAB0E;
}

.container { padding:0 10px;margin:0 auto;}
.single-app .container,#top .container{width:100%;max-width:100% !important;}
.select:not(.is-multiple):not(.is-loading)::after { border-color: #333; }

.navbar.is-transparent {
    background: none;
}
/*.navbar-dropdown{z-index: 99;}*/
.navbar-link:not(.is-arrowless)::after { border-color: #333; }
a.navbar-item:hover,.navbar-item a.navbar-link:hover{background: transparent !important;color: #FDAB0E;}
a.navbar-item.is-active{color: #FDAB0E; border-bottom: 0px #FDAB0E solid;}
/* .container .navbar .navbar-brand,.container .navbar .navbar-menu{margin:0;} */

.tabs ul{flex-wrap: wrap;border-bottom-color: #EEE;}
.tabs li.is-active a {color: #FDAB0E; border-color:#FDAB0E;}
/*.tabs:not(.is-boxed .is-toggle) ul:first-child a {padding-left:0; }*/
.tabs.is-boxed li.is-active .icon{color: #FFF;}

.menu-list a.is-active { background-color: #FDAB0E; color: #fff; }
/* .box { box-shadow: none; border-radius: 0;} */
.content { line-height: 1.8em; }
/*.content .box { padding: 50px; }*/

/*标题*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    /*overflow: hidden;*/
    /*text-overflow: ellipsis;*/
    /*white-space: nowrap;*/
}
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6{
	font-weight: 500;
}
.label { font-weight: 500; }
/*.content h3{font-size: 1.1rem;}*/

/* 导航 */
/*悬停下拉导航菜单*/
.navbar-item.is-mega {
    position: static;
}
/* .navbar-start .navbar-dropdown { min-width: 300px; } */
/* .navbar-start .navbar-dropdown a { display: inline-block; width: 49%; } */

/*表单图标、占位文字颜色*/
.control.has-icons-left .icon, .control.has-icons-right .icon { color: #999; }
.input::placeholder, .textarea::placeholder { color: #999; }

/*按钮*/
.button.is-warning.is-outlined {
    background-color: transparent;
    border-color: #FDAB0E;
    color: #FDAB0E;
}
.button.is-warning.is-outlined[disabled], fieldset[disabled] .button.is-warning.is-outlined {
    background-color: transparent;
    border-color: #FDAB0E;
    box-shadow: none;
    color: #FDAB0E;
}
button:disabled{
    color: #333;
}
button:disabled:hover{
    color: #333;
    background: #EEE;
}

/*分页导航*/
.pagination {
    text-align: center;
    clear: both;
    width: 100%;
    margin: 20px auto;
  }
.pagination-link, .pagination-next, .pagination-previous {
	background:#FFF;
}

.field-body {
    flex-grow: 8;
}
/* ################### filter ###################*/
.wnd-filter-tabs { background: #FFF;}
.wnd-filter-tabs .tabs:not(.is-boxed) ul { border: none;}
.wnd-filter-tabs .tabs:not(.is-boxed) ul a { border: none; padding:0.1em 0.5em; margin: 0.3em 0;font-size: 0.95rem;}
.wnd-filter-tabs .tabs:not(.is-boxed) li.is-active a { background: #FDAB0E; color: #FFF; border-radius: 3px;}
.wnd-filter-tabs .column { padding: 0.5em 0.3em; }
.wnd-filter-tabs .column.is-narrow { color: #777; }
.wnd-filter-tabs .columns:not(:last-child) { border-bottom: 1px solid #EEE; }
.wnd-filter-tabs .tag{border:1px solid #333;color: #333;background: #FFF;}
.archive .wnd-filter-tabs {
    /*background: #F5F5F5;*/
    margin-bottom: 20px;
    padding: 1.25rem;
    /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);*/
    border: 1px solid #EEE;
    font-size: 0.95rem;
}
/*#user-main .wnd-filter-tabs{padding: 0;margin:0;box-shadow: none;}*/
/*########################################*/

/* tags */
.tags a {
    line-height: 1.6em; color: #FDAB0E; border-radius: 3px; border: 0px solid #333;
    margin: 0 5px 0 0;
}
.single-people .tags{display: inline-block;}

/* post list */
.post-list.columns,.post-list.column{
    padding: 10px;
}
/*.post-list h3 a:visited{color:#999;}*/
/*.post-list a{color:#000;}*/
.post-list a:hover{text-decoration: underline; }
.post-list h3 {font-size: 1.1rem;line-height: 1.8em;}
.post-list .icon{width: auto;}
/*.post-list .address{margin:0 0 1rem}*/
.post-list,.company-list-simple{
    color: #777;
    padding: 1rem;
    /*border: 1px solid #FFF;*/
    /*border-bottom:1px #CCC dotted;*/
    /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);*/
    /*margin-bottom: 10rem;*/
    font-size: 0.9rem;
}
/*.post-list:first-child{padding-top: 0;}*/
/*.post-list{
    border-bottom: 1px solid #CCC;
}*/
/*.post-list .excerpt{
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}*/
.post-list:hover {box-shadow: 0 0px 10px 0 #DDD;}
/*.post-list .column{padding: 7px;}*/

/* 正文 */
article.entry{
  border-top:1px solid #EEE;
  padding: 1rem 0;
}

/* 分类复选框 */
label.checkbox{margin: 0 1rem 0 0.2rem;}

/* ------------------------------
    comment list
------------------------------ */
#comments{overflow:hidden;clear:both;}
.comment.depth-1{opacity:0.95;}
.comment-respond{clear:both;background:#FFF;padding:1.25rem;margin-top:20px;opacity:0.9;}
#comments a{color:#F14668;}
ol.commentList li{clear:both;margin:0 0 20px 0;list-style-type:none;}
.commentList li .avatar{float:left;width:auto;border:1px solid #CCC;padding:3px;margin:5px 5px 0 0;}
.comment-body p{margin:5px 0 5px;}
#comments input#author,#comments input#email,#comments input#url{padding:0 5px;border:none;border-bottom:1px #F14668 solid;background:transparent;}
#comments .comment-submit{clear:both;}
#comments .comment-submit button{min-width:200px;}
#comments textarea{width:100%;min-height:150px;padding:10px;border:1px #CCC solid;margin: 1rem auto;}
#commentform label{display:block;float:left;text-align:right;}

/*隐私*/
.comment-form-cookies-consent{height:2em;clear:both;line-height:2em;display:flex;align-items:center;font-size:0.9em;}
#wp-comment-cookies-consent{float:left;margin-right:10px;}
#comments li.even{background:#FFF;}
#comments li.odd{background:#FFF;}
#comments ol>li{margin:20px 0;}
#comments li{border-radius:3px;padding:1.25rem}
p.input{margin:10px 0;}
#comments .avatar{float:left;margin-right:10px;}
.bypostauthor > div .fn:after{content:"管理员";background-color:#F14668;color:#FFF;padding:1px 5px;border-radius:3px;font-size:13px;margin:0 3px;}
.single-topic .bypostauthor > div .fn:after{content:"楼主";}
cite.fn{color:#600;margin-right:5px;color:#F14668;font-weight:bold;}

/*评论插件定义CSS文件部分*/

/*回复*/
.children{border-left:2px solid #F14668;border-bottom:1px solid #EEE;margin:10px 0;padding:10px;background-color:#FFF;}
#comments ol>li>ol>li{margin:0;}
#newcomment{border:1px dashed #555;width:99%;}
.comments-header{position:relative;text-align:center;overflow:hidden;margin:1rem auto;}
.comments-heading{position:relative;display:inline-block;}
.comments-heading:before{content:'';width:40px;height:2px;background-color:#e0e0e0;position:absolute;top:50%;margin-right:2rem;right:100%;margin-top:-1px;}
.comments-heading:after{content:'';width:40px;height:2px;background-color:#e0e0e0;position:absolute;top:50%;left:100%;margin-left:2rem;margin-top:-1px;}

/* ##Comment Form
---------------------------------*/
.comment-respond .comment-reply-title{text-align:center;}
.comment-form .comment-notes,.comment-form .logged-in-as{color:#999;text-align:center;}
.comment-form-author,.comment-form-email,.comment-form-url{float:left;width:50%;margin-bottom:1.25rem;}
.comment-form-url input{border:0;}
.comment-form-comment textarea{margin-bottom:1.25rem;}
.comment-form-submit{text-align:right;}

/*ajax 评论样式*/
.ajax-comment-message{
    background:#F14668;
    border-radius:4px;
    box-shadow:0 1px 1px rgba(0,0,0,0.25),0 0 1px rgba(0,0,0,0.35);
    display:inline-block;
    font-size:14px;
    margin-bottom:0;padding:12px 25px;color:#FFF;
}

/*submit*/
#comments .submit{display:block;cursor:pointer;background:#F14668;color:#FFF;border:none;margin:10px auto;padding:10px 20px;box-shadow:0 1px 2px 0 #999;border-radius:3px;min-width:200px;}

/******************end comments*/

/*上传*/

/*翻页*/
.pagination { text-align: center; clear: both; }
.pagination ul li { display: inline-block; margin: 0 10px; }

/* 上标提示 */
[data-badge] {
    position: relative;
}
[data-badge]::after {
    display: inline-block;
    position: absolute;
    min-width: 1rem;
    min-height: 1rem;
    font-size: .75rem;
    top: 0;
    right: 0;
    bottom: auto;
    left: auto;
    -webkit-transform: translate(50%,-50%);
    transform: translate(50%,-50%);
    margin: 0;
    padding: .1rem .25rem;
    text-align: center;
    white-space: nowrap;
    line-height: 1;
    background: #333;
    background-clip: padding-box;
    border-radius: 5px;
    box-shadow: 0 0 0 1px #fff;
    color: #fff;
    content: attr(data-badge);
    z-index: 9;
    background: #ff3860;
    color: #fff;
}

/* 移动 */
@media screen and (max-width:1023px) {
    .sidebar { max-width: 100%; }
    .home #wrap{margin-top: 1rem;}
    .content .box { padding: 20px; }
    .navbar { min-height: 3rem; }
    body.single main.box, body.page main.box, footer.box{padding: 20px;}

    /* Tabs */
    .list-posts .tabs ul { flex-wrap: nowrap; flex-shrink: 1; }
    
    /*thumbnail*/
    .post-list .post-thumbnail img{max-width: 50px;}
}

/* 宽屏 */
@media screen and (min-width:1344px) {
    .single-app #wrap.container{padding: 0 50px;}
}

/*富媒体编辑器*/
.editor-text{min-height: calc(100vh - 300px);font-size: 1.1rem;height: 1px;}

/* Application ################################################### 图像处理 */
#app img,#app canvas {
    max-width: 100%;
    max-height: 2160px;
}
#app a{ color: #FDAB0E; }
#processed-box {
    background: #FAFAFA url("static/application/images/canvas_32x32.png");
    min-height: 200px;
    border:2px dashed #EEE;
}
#processed-box p {
    line-height: 200px;
    color: #999;
    border-radius: 10px;
    background-color: #FFF;
}
#processed-box.dragover {
    border-color:#E00;
}
#app .input.is-small {
    width: 90px;
}
#app .input.is-small[type="text"] {
    width: 300px;
}
#toolbar .column {
    padding: 0;
}
#toolbar-options .column{
    flex: none;
    width: unset;
}
#toolbar-options .help{font-size: 0.9em;margin-top: 0;}
/* 04.17 */
#thumbnail-box {
    box-shadow: 0px 0px 20px 0px #CCC;
    overflow-x: auto;
    /* max-height: 214px; */
    min-height: 0;
    padding: 10px;
    display: flex;
    scrollbar-width: none;
}
#expanded-bar {
    position: fixed;
    bottom: 120px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    z-index: 100;
    /* 使按钮位于最前面 */
}
#thumbnail-box.hidden {
    padding: 0px;
    height: auto;
    /* box-shadow: none; */
}
#thumbnail-box.hidden #expanded-bar {
    bottom: 5px;
}
#app .scroll-btn {
    position: fixed;
    bottom: -20px;
    transform: translateY(-50%);
    width: 18px;
    height: 80px;
    font-size: 20px;
    line-height: 4em;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    text-align: center;
    cursor: pointer;
}
#thumbnail-box.hidden .scroll-btn {
    display: none;
}
#app .scroll-btn-left {
    left: 0;
}
#app .scroll-btn-right {
    right: 0;
}
#thumbnail-box .box {
    flex: 0 0 auto;
    position: relative;
    text-align: center;
    width: 100px;
    height: 100px;
    display: inline-block;
    padding: 5px;
    border-radius: 6px;
    box-shadow: 0 .5em 1em -.125em rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .02);
    cursor: pointer;
}
#thumbnail-box .box.selected {
    background-color: lightblue;
}
#thumbnail-box.hidden .box {
    display: none;
}
#thumbnail-box img:hover {
    cursor: pointer;
    opacity: 0.8;
}
#thumbnail-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#processed-box .column {
    position: relative;
}
#thumbnail-box .box .delete,#processed-box .column .delete {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: red;
    display: none;
}
#thumbnail-box .box:hover .delete, #processed-box .column:hover .delete{
    display: block;
}
/* 上传 loading */
.loading {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}
.loading span {
    animation: blink 1.5s infinite;
    display: inline-block;
    background-color: #f14668;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    opacity: 0;
}
.loading span:nth-child(1) {
    animation-delay: 0s;
    margin-right: 10px;
}
.loading span:nth-child(2) {
    animation-delay: 0.5s;
    margin-right: 10px;
}
.loading span:nth-child(3) {
    animation-delay: 1s;
}
@keyframes blink {
    0%,100% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
}

.image-app .processed-image{border:2px dashed #999}
.image-app .processed-image:hover{border-color:#E00;cursor:pointer;}

/* 移动 */
@media screen and (max-width:720px) {
    #toolbar{margin: 1rem auto;}
    #app .input.is-small {
        width: 60px;
    }
    #app .input.is-small[type="text"] {
        width: 100%;
    }
    #app .input.is-small[type="color"] {
        width: 35px;
    }
    #app-wrap.box{padding: 0.5rem;}
}