html, body, div, h1, h2, h3, h4, h5, h6, p, button, input, ol, ul, li {margin:0;padding:0;}
html {font-size:16px;}

h1, h2, h3, h4, h5, h6 {font-weight:normal;} 

li {list-style:none;}

.d-flex {display:flex;}


.logo-box, .title-login, .form-row {margin-bottom:1.5rem;}


/** ===== body ===== **/
html {background-image:url(/temp/bookshelf.jpg);background-position:50% 100%;background-repeat:no-repeat;background-size:auto 100%;}
body {background:#fff;background:rgba(255,255,255,0.96);min-height:100vh;}


/** ===== ===== page-login ===== ===== **/
p.icp {bottom:1.5rem;display:flex;justify-content:center;position:fixed;width:100%;z-index:999;}
p.icp a {color:#989898;text-decoration:none;font-size:0.875rem;}

/** ===== login-main ===== **/
.login-main {min-height:84vh;padding-left:1.5rem;padding-right:1.5rem;padding-top:16vh;width:calc( 100% - 3rem );}


/** ===== logo+title ===== **/
.logo-box img {display:block;height:6rem;margin:auto;width:6rem;}

.title-login, .subtitle-login {line-height:1;text-align:center;}
.title-login, .title-login * {font-size:2rem;}
.title-login {color:#787878;}
.title-login b {color:#f02b3c;font-weight:400;}
.subtitle-login {color:#989898;font-size:1.125rem;margin-bottom:3rem;}


/** ===== form-login ===== **/
.form-login {width:100%;}

.form-control, .btn {/*border-radius:0.375rem;*/border-style:solid;border-width:0.0625rem;font-size:1.125rem;height:3.5rem;outline:none;}
.form-control {padding-left:1.5rem;padding-right:1.5rem;}
.form-control {background:#fff;border-color:#ccc;width:calc( 100% - 3.125rem );}
.form-control:focus {background:#fff;border-color:#f02b3c;color:#f02b3c;}

.btn {text-align:center;}
.btn-primary {background:#f02b3c;border-color:#f02b3c;color:#fff;display:block;width:100%;}


.login-note, .login-note * {font-size:1rem;line-height:1;}
.login-note {color:#989898;padding-top:1.5rem;text-align:center;}
.login-note a {border-bottom:0.0625rem solid #f02b3c;color:#f02b3c;text-decoration:none;}


/** ===== ===== page-main ===== ===== **/


/** ===== home-top ===== **/
.home-top {background-color:#fff;background-image:url(/assets/img/shape.png);background-position:50% 0;background-repeat:no-repeat;background-size:100% auto;/*border-radius:0 0 1.5rem 0;*/box-shadow:0 0 0.25rem rgba(0,0,0,0.15);padding:0.75rem 0.75rem 0 0.75rem;width:calc( 100% - 1.5rem );}


/** ===== home-slick ===== **/
.slick-holder, .home-slick, .slick-item, .slick-item *, .user-info {width:100%;}
.slick-holder {/*border-radius:0.75rem;*/border-radius:1rem 0 1rem 0;overflow:hidden;}
.home-slick, .slick-list {position:relative;z-index:0;}
.slick-item * {display:block;}

.home-slick .slick-dots {bottom:0.75rem;display:flex;justify-content:center;pointer-events:none;position:absolute;width:100%;z-index:5;}
.home-slick .slick-dots li {background:rgba(0,0,0,0.4);border-radius:1rem;height:0.5rem;width:0.5rem;}
.home-slick .slick-dots li:not(:first-child) {margin-left:0.5rem;}
.home-slick .slick-dots .slick-active {background:#ee2d3e;width:1rem;}

.home-slick .slick-dots li * {display:none;}


/** ===== user-info ===== **/
.user-info {padding:0.875rem 0;}
.user-info * {font-weight:400;line-height:1;}
.user-info h3 {color:#2c2a29;font-size:1.125rem;}
.user-info p, .user-info p * {font-size:0.875rem;}
.user-info p {color:#989898;margin-top:0.75rem;}
.user-info p b {color:#666;}


/** ===== list-files ===== **/
.list-holder {margin-top:1.5rem;width:100%;}

.list-files, .list-files li {width:100%;}
.list-files {background:#fff;box-shadow:0 0 0.25rem rgba(0,0,0,0.15);/*border-radius:0 1.5rem 1.5rem 0;*/overflow:hidden;}
.list-files li {width:100%;}
.list-files li:not(:first-child) {border-top:0.0625rem solid #eee;}

.list-files li * {font-weight:400;}
.list-files li a {display:block;padding:1rem 0.75rem;text-decoration:none;width:calc( 100%  - 1.5rem );}
.list-files li h3 {color:#2c2a29;font-size:1.125rem;line-height:1.5rem;max-height:3rem;width:100%;}
.list-files li p, .list-files li p * {height:1rem;line-height:1rem;}
.list-files li p {display:flex;margin-top:1rem;}
.list-files li p {color:#989898;font-size:1rem;}
.list-files li i {margin-right:0.25rem;opacity:0.38;width:1rem;}
.list-files li i {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z' fill='%23000' /%3E%3C/svg%3E");background-size:cover;}


/** ===== catalog-holder ===== **/
.catalog-holder, .catalog {width:100%;}
.catalog-holder {background-color:#fff;bottom:0;box-shadow:0 0 0.25rem rgba(0,0,0,0.15);left:0;position:fixed;z-index:100;}
.catalog {display:flex;}

.catalog li {color:#5a5a5a;font-size:1rem;height:2.5rem;line-height:1.25rem;padding:0.5rem 0.75rem;text-align:center;}
.catalog li:nth-child(1) {width:calc( 50% - 1.5rem );}
.catalog li:nth-child(2) {width:calc( 50% - 1.5rem );}

.catalog li.active {background:#f02b3c;color:#fff;}

.pd-btm {height:5rem;width:100%;}


/** ===== ===== ellipsis ===== ===== **/
.ellipsis, .list-files li h3 {display:-webkit-box;display:box;overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical;box-orient:vertical;}
.ellipsis {-webkit-line-clamp:1;line-clamp:1;}
.ellipsis.row2, .list-files li h3 {-webkit-line-clamp:2;line-clamp:2;}
.ellipsis.row3 {-webkit-line-clamp:3;line-clamp:3;}



article {padding:3rem 1.5rem;}
article h1 {color:#2c2a29;font-size:1.5rem;line-height:1;margin-bottom:1.5rem;}
article p {color:#666;font-size:1.125rem;line-height:1.5;margin-bottom:1rem;}
article p a {border-bottom:0.0625rem solid #f02b3c;color:#f02b3c;text-decoration:none;font-weight:400;}