.mail-inbox{display:flex}.mail-inbox .mail-left{width:280px;padding:15px;border-right:1px solid #eaeaea;display:block}.mail-inbox .mail-left .mail-side .nav{flex-direction:column}.mail-inbox .mail-left .mail-side .nav li{padding:0 10px;margin-bottom:5px;line-height:40px}.mail-inbox .mail-left .mail-side .nav li a{color:#666666;display:flex;align-items:center}.mail-inbox .mail-left .mail-side .nav li a i{font-size:17px;width:35px;-webkit-transition:font-size 0.2s;-moz-transition:font-size 0.2s;transition:font-size 0.2s}.mail-inbox .mail-left .mail-side .nav li a .badge{margin-left:auto;margin-right:0}.mail-inbox .mail-left .mail-side .nav li:hover{background-color:#f4f7f6}.mail-inbox .mail-left .mail-side .nav li:hover a i{font-size:20px}.mail-inbox .mail-left .mail-side .nav li.active{background-color:#f4f7f6}.mail-inbox .mail-left .mail-side .nav li.active a{color:#17191c}.mail-inbox .mail-left .mail-side h3{font-size:15px;font-weight:500;margin-bottom:15px;margin-top:30px;line-height:20px}.mail-inbox .mail-right{width:calc(100% - 280px);position:relative}.mail-inbox .mail-right .header{padding:15px}.mail-inbox .mail-right h2{line-height:35px}.mail-inbox .mail-right .mail-action{padding:15px}@media only screen and (max-width: 360px){.mail-inbox .mail-right .mail-action{display:none}}.mail-inbox .mail-right .mail-action .fancy-checkbox label{margin-bottom:0}.mail-inbox .mail-right .mail-action .fancy-checkbox input[type="checkbox"]+span:before{bottom:0}.mail-inbox .mail-right .mail-action .btn{border-color:#cccccc;padding:5px 15px}.mail-inbox .mail-right .mail-action .pagination-email p{line-height:30px;margin-bottom:0}.mail-inbox .mail-right .mail-list{padding:15px 0}.mail-inbox .mail-right .mail-list ul li{padding:17px 15px 15px;border-top:1px solid #eaeaea;width:100%;position:relative}.mail-inbox .mail-right .mail-list ul li:last-child{border-bottom:1px solid #eaeaea}.mail-inbox .mail-right .mail-list ul li .hover-action{position:absolute;opacity:0;top:0;right:0;padding:23px 16px 23px;background:#ffffff;transition:all 0.5s ease-in-out}.mail-inbox .mail-right .mail-list ul li:hover .hover-action{opacity:1}.mail-inbox .mail-right .mail-list ul li:hover .mail-detail-expand{color:#007bff}.mail-inbox .mail-right .mail-list ul li.unread{background-color:#f1f1f1}.mail-inbox .mail-right .mail-list ul li.unread .hover-action{background-color:#f1f1f1}.mail-inbox .mail-right .mail-list ul li .mail-detail-left,.mail-inbox .mail-right .mail-list ul li .mail-detail-right{float:left}.mail-inbox .mail-right .mail-list ul li .mail-detail-left{max-width:60px;min-width:60px;width:60px;position:relative}.mail-inbox .mail-right .mail-list ul li .mail-detail-left .mail-star{position:absolute;right:13px;top:0;color:#6c757d}.mail-inbox .mail-right .mail-list ul li .mail-detail-left .mail-star.active{color:#ffc107}.mail-inbox .mail-right .mail-list ul li .mail-detail-right{position:relative;padding-right:70px;width:calc(100% - 70px)}.mail-inbox .mail-right .mail-list ul li .mail-detail-right span.time{position:absolute;top:0;right:0}.mail-inbox .mail-right .mail-list ul li .mail-detail-right h6,.mail-inbox .mail-right .mail-list ul li .mail-detail-right p{width:100%;display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.mail-inbox .mail-right .mail-list ul li .mail-detail-right h6 a{color:#5a5a5a}.mail-inbox .mail-right .mail-list ul li .mail-detail-right p{margin-bottom:0}.mail-inbox .mail-right .mail-detail-full{position:absolute;width:100%;height:100%;top:0;left:0;background:#ffffff}.mail-inbox .mail-right .mail-detail-full .mail-action{padding:15px}.mail-inbox .mail-right .mail-detail-full .detail-header{padding:20px 15px 0;border-top:1px solid #eaeaea;border-bottom:1px solid #eaeaea}.mail-inbox .mail-right .mail-detail-full .detail-header .float-left img{max-width:63px;border-radius:5px}.mail-inbox .mail-right .mail-detail-full .media-body p a{color:#6c757d}.mail-inbox .mail-right .mail-detail-full .mail-cnt{padding:20px 15px}.mobile-left{display:none}@media screen and (max-width: 991px){.mail-inbox .mail-left{width:230px}.mail-inbox .mail-right{width:calc(100% - 230px)}.mail-inbox .mail-right .mail-action .btn{padding-left:10px;padding-right:10px}.mail-inbox .mail-right .mail-action .pagination-email p{display:none}}@media screen and (max-width: 767px){.mobile-left{display:block;padding:15px 15px 0;position:absolute;z-index:9999;right:0}.mail-inbox .mail-left{position:fixed;left:0;top:64px;background-color:#ffffff;z-index:99}.mail-inbox .mail-left.collapse:not(.show){display:none}.mail-inbox .mail-left.collapse:not(.show)+.mail-right{width:100%}.mail-inbox .mail-right{width:100%}.mail-inbox .mail-right .header{flex-direction:column}.mail-inbox .mail-right .header .ml-auto{margin-left:0 !important;margin-top:15px}.btn-group{margin-bottom:5px}.mail-detail-full a.mail-back{top:-60px}.media-body p span,.media-body p small{display:none}}