.mail-inbox{display:flex;background:#fff}.mail-inbox .mail-left{width:280px;padding:15px;display:block;height:calc(100vh - 66px);background:#fff;transition:all 0.3s ease-in-out}.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:#5A5A5A;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:#444}.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;margin-top:15px;border-left:1px solid #eaeaea}.mail-inbox .mail-right .header{padding:15px}.mail-inbox .mail-right h2{line-height:35px}.mail-inbox .mail-right .mail-action{padding:15px}.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 .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:#fff;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:#eaeaea}.mail-inbox .mail-right .mail-list ul li.unread .hover-action{background-color:#eaeaea}.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:#5A5A5A}.mail-inbox .mail-right .mail-list ul li .mail-detail-left .mail-star.active{color:#f3ad06}.mail-inbox .mail-right .mail-list ul li .mail-detail-right{position:relative;padding-right:60px;width:calc(100% - 60px)}.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}.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:#5A5A5A}.mail-inbox .mail-right .mail-detail-full .mail-cnt{padding:20px 15px}.mail-inbox .mail-compose{padding:20px}.mobile-left{display:none}@media screen and (max-width: 991px){.mail-inbox .mail-left{width:230px;height:calc(100vh - 52px)}.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;position:fixed;z-index:9999;right:15px;bottom:15px}.mail-inbox .mail-left{left:-240px;position:fixed;background-color:#fff;z-index:7;height:calc(100vh - 52px);overflow-y:scroll}.mail-inbox .mail-left.open{left:0}.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}.mail-inbox .mail-right .mail-detail-right .badge{display:none}.mail-detail-full a.mail-back{top:-60px}.media-body p span,.media-body p small{display:none}}