/* --- END ASSIGN MODAL STYLES --- */ /* --- END ROOM DETAIL MODAL STYLES --- */ /* --- END ROOM STATUS DASHBOARD STYLES --- */ /* @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic); */ /* @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Prata&display=swap'); */ @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Prata&display=swap'); @import url('bootstrap.min.css'); @import url('bootstrap-reset.css'); @import url('jquery-ui-1.10.3.css'); @import url('../fonts/css/font-awesome.min.css'); body { background-color: #fff; font-family: "Inter", sans-serif; color: #2f2f2f; line-height: 20px; overflow-x: hidden; font-size: 14px; letter-spacing: 0.2px !important;} body#index-body { background: url(../images/body-bg.jpg) repeat scroll center top #ffffff !important; } input, select, textarea { font-family: "Inter", sans-serif; color: #767676; } a { color: #ed6f7e; } a:focus, a:active, a:hover { outline: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; color: #444444; } h1, h2, h3, h4, h5 { font-family: "Prata", serif; font-weight: 400; font-style: normal;color:#2f2f2f; } .mtop10 { margin-top: 10px; } hr { border-color: #ddd; } b, strong{font-weight: 500;} /*------------------------------- LOGIN STYLES -------------------------------*/ .modal-backdrop{z-index:900 !important;} .login-body { /*background: #ed6f7e url("../images/login-bg.jpg") no-repeat fixed;*/ background-size: cover; width: 100%; height: 100%; } .form-signin { max-width: 450px; margin: 170px auto;background-color:#fff; background:#fff; border-radius: 5px; -webkit-border-radius: 5px; } .form-signin .form-signin-heading { margin: 0;padding: 25px 15px 0px 10px;text-align: center; color: #fff; position: relative; } .sign-title { font-size: 24px; color: #666; position: absolute; top: -60px; left: 0; text-align: center; width: 100%; text-transform: uppercase; } .form-signin .checkbox { margin-bottom: 14px; font-size: 13px; } .form-signin .checkbox { font-weight: normal; color: #fff; font-weight: normal; font-family: "Inter", sans-serif; width: 100%; left:-15; } .form-signin .checkbox a { color: #007bb7; text-decoration: none; } .form-signin .checkbox a:hover { color: #666; text-decoration: underline; } .form-signin .form-control { position: relative; font-size: 16px; height: auto; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .form-signin .form-control:focus { z-index: 2; } .form-signin .input-text {width: 100% !important;font-size: 16px !important;transition: all .4s ease !important;background: transparent !important;font-family: var(--primaryfont) !important;outline: none !important;border: 1px solid #e0e0e0 !important;padding: 5px 14px !important;color: var(--textgrey) !important;border-radius: 6px !important; height: 42px !important;} .form-signin .input-text:focus {border-color: #EA4E87 !important;box-shadow: none !important;border-radius: 6px !important;} .form-signin input[type="text"], .form-signin input[type="password"] { margin-bottom: 15px; border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #ccc; background: #f5f5f5; box-shadow: none; font-size: 12px; } .form-signin .btn-login { background: #ed6f7e; color: #fff; text-transform: uppercase; font-weight: normal; font-family: "Inter", sans-serif; margin: 20px 0 5px; padding: 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; font-size: 30px; } .form-signin .btn-login:hover { background: #23608f; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .form-signin p { text-align: left; color: #b6b6b6; font-size: 16px; font-weight: normal; } .form-signin a, .form-signin a:hover { color: #ed6f7e; } .form-signin a:hover { text-decoration: underline; } .login-wrap { padding: 20px; position: relative; } .registration { color: #c7c7c7; text-align: center; margin-top: 15px; } .input-text {width: 100% !important;font-size: 16px !important;transition: all .4s ease !important;background: transparent !important;font-family: var(--primaryfont) !important;outline: none !important;border: 1px solid #e0e0e0 !important;padding: 5px 14px !important;color: var(--textgrey) !important;border-radius: 6px !important; height: 42px !important;} .danger-box{background-color: #FFE8E8;border-radius: 5px;color: #DF4343;font-size: 13px;max-width: -webkit-fill-available;max-width: -moz-available;line-height: 20px;padding: 7px 6px;font-weight: 500;border-left: 3px solid #DF4343;letter-spacing: 0.2px;} .success-box{background-color: #DBF9D9;border-radius: 5px;color: #40A439;font-size: 13px;max-width: -webkit-fill-available; max-width: -moz-available;line-height: 20px;padding: 7px 6px;font-weight: 500;border-left: 3px solid #40A439;letter-spacing: 0.2px;} /*--------------------------------- LEFT SIDE ----------------------------------*/ .left-side { width: 240px; position: absolute; top: 0; left: 0; } .sticky-left-side { position: fixed; height: 100%; overflow-y: auto; z-index: 100;} .sticky-left-side .custom-nav { margin-top: 70px; } .sticky-left-side .custom-nav .menu-icon{background-color: #ffeeeb;height: 30px;width: 30px;border-radius: 50px;display: flex;justify-content: center;align-items: center;min-width: 30px;} .left-side-collapsed .sticky-left-side { overflow-y: visible; } /* .logo { padding-top: 5px; height: 55px; } */ .logo a {text-decoration: none; display: inline-flex; align-items: center; height: 100%; } .logo img { max-height: 45px; width: auto; vertical-align: middle; } .logo-icon .logo-icon-img { max-height: 32px; width: auto; vertical-align: middle; } .logo-icon { display: none; } .left-side-collapsed .logo-icon { background-color: #fff; display: flex !important; align-items: center; justify-content: center; height: 55px; margin-top: -55px; padding: 0 7px; width: 60px; box-sizing: border-box; } .left-side-inner { padding: 0px; margin-bottom: 50px; } .left-side .searchform { display: none; } .left-side .searchform::after { content: ''; display: block; clear: both; } .left-side .searchform input { padding: 10px; width: 90%; margin: 0 0 20px 12px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: none; } .left-side .logged-user { padding: 0 0 15px 12px; margin: 0 0 15px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); display: none; } .left-side .logged-user .media-object { width: 45px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; float: left; } .left-side .logged-user .media-body { margin-left: 60px; color: #d7d7d7; } .left-side .logged-user .media-body h4 { font-size: 15px; margin: 5px 0 0 0; } .left-side .logged-user .media-body h4 a { color: #fff; } .left-side .logged-user .media-body span { font-style: italic; font-size: 11px; opacity: 0.5; } .custom-nav { margin: 15px; } .custom-nav > li > a { color: #2f2f2f; font-family: "Inter", sans-serif; letter-spacing: 0.5px; font-weight: 500; padding: 12px 15px;display: flex;align-items: center;gap: 10px;} .custom-nav > li > a:hover, .custom-nav > li > a:active { background-color: #c14b59;color: #fff;border-radius: 22px; } .custom-nav > li > a:hover img{filter: brightness(0) invert(1);} .custom-nav > li > a img{transition: all 0.3s;} .custom-nav > li.menu-list > a { background: transparent url(../images/plus-white.png) no-repeat 93% center; } .custom-nav > li.menu-list > a:hover { background-color: #c14b59;color: #fff; background-image: url(../images/plus.png); } .custom-nav > li.nav-active > a {background-color: #ffdfe3; color: #c14b59; border-radius: 22px; background-image: url(../images/minus.png);} .custom-nav > li.nav-active > ul { display: block; } .custom-nav > li.nav-active > a:hover { background-image: url(../images/minus.png); } .custom-nav > li.active > a, .custom-nav > li.active > a:focus { background-color: #ffdfe3; color: #c14b59; border-radius: 22px;} .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { background-color: #ffdfe3; color: #c14b59;} .custom-nav > li.menu-list.active > a { background-image: url(../images/plus.png); } .custom-nav > li.nav-active.active > a { background-image: url(../images/minus.png); } .custom-nav > li.nav-active.active > a:hover { background-image: url(../images/minus.png);background-color: #c14b59; color: #fff; border-radius: 8px; } .custom-nav li .fa { font-size: 16px; vertical-align: middle; margin-right: 10px; width: 16px; text-align: center; } .custom-nav .sub-menu-list { list-style: none; display: none; margin: 0; padding: 0; background-color: #F8F6F6;overflow: hidden;border: 1px solid #E8DEDF;margin: 10px 0;color: #fff;border-radius: 8px; } .custom-nav .sub-menu-list > li > a { color: #2f2f2f; font-size: 13px; display: flex;gap: 10px; padding: 10px 5px 10px 20px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .custom-nav .sub-menu-list > li > a:hover, .custom-nav .sub-menu-list > li > a:active, .custom-nav .sub-menu-list > li > a:focus { text-decoration: none; color: #fff; background: #c14b59; } .custom-nav .sub-menu-list > li > a img{transition: all 0.3s;} .custom-nav .sub-menu-list > li > a:hover img, .custom-nav .sub-menu-list > li > a:active img, .custom-nav .sub-menu-list > li > a:focus img{filter: brightness(0) invert(1);} .custom-nav .sub-menu-list > li .fa { font-size: 17px;margin-right: 5px;text-align: left;width: auto;vertical-align: baseline; color: #fff; } .custom-nav .sub-menu-list > li.active > a { color: #fff; background-color: #c14b59;} .custom-nav .sub-menu-list > li.active > a img{filter: brightness(0) invert(1);} .custom-nav .sub-menu-list ul { margin-left: 12px; border: 0; } .custom-nav .menu-list.active ul { display: block; } .nav > li > a:hover{background-color: #c14b59; color: #fff;} .nav > li > a:focus{background-color: #ffdfe3;} /*------------------------------------------ LEFT SIDE COLLAPSE -------------------------------------------*/ .pr-0 { padding-right: 0 !important; } .pl-0 { padding-left: 0 !important; } .mr-0 { margin-right: 0 !important; } .ml-0 { margin-left: 0 !important; } .mb0px { margin-bottom: 0 !important; } .mb5px { margin-bottom: 5px; } .mb10px { margin-bottom: 10px; } .mb15px { margin-bottom: 15px; } .mb20px { margin-bottom: 20px; } .mb25px { margin-bottom: 25px; } .mb30px { margin-bottom: 30px; } .mt0px { margin-top: 0; } .mt5px { margin-top: 5px; } .mt7px { margin-top: 7px; } .mt10px { margin-top: 10px; } .mt15px { margin-top: 15px; } .mt20px { margin-top: 20px; } .mt25px { margin-top: 25px; } .mt30px { margin-top: 30px; } .mt76px { margin-top: 76px; } .pb0px { padding-bottom: 0 !important; } .pb5px { padding-bottom: 5px; } .pb10px { padding-bottom: 10px; } .pb15px { padding-bottom: 15px; } .pb20px { padding-bottom: 20px; } .pb25px { padding-bottom: 25px; } .pb30px { padding-bottom: 30px; } .pt0px { padding-top: 0; } .pt5px { padding-top: 5px; } .pt7px { padding-top: 7px; } .pt10px { padding-top: 10px; } .pt15px { padding-top: 15px; } .pt20px { padding-top: 20px; } .pt25px { padding-top: 25px; } .pt30px { padding-top: 30px; } .pt76px { padding-top: 76px; } .left-side-collapsed .logo { display: none; } .left-side-collapsed .header-section { margin-left: 0px; } .left-side-collapsed .left-side { width: 60px; top: 55px; } .left-side-collapsed .left-side-inner { padding: 0; } h5.left-nav-title { margin-left: 10px; color: #fff; } .left-side-collapsed .custom-nav { margin: 0px 0px 20px 0px; } .left-side-collapsed .custom-nav li a { text-align: center; padding: 10px 10px; position: relative; } .left-side-collapsed .custom-nav .menu-style .menu-width {width: 38px;margin: 0 10px;} .left-side-collapsed .custom-nav > li.menu-list > a { background-image: none; } .left-side-collapsed .custom-nav li a span { position: absolute; background: #c14b59; padding: 10px; left: 52px; top: 0; min-width: 190px; text-align: left; z-index: 100; display: none; } .left-side-collapsed .custom-nav li a span:after { right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(0, 0, 0, 0); border-right-color: #c14b59; border-width: 6px; margin-top: -6px; } .left-side-collapsed .custom-nav li.active a span { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } .left-side-collapsed .custom-nav ul, .left-side-collapsed .custom-nav .menu-list.nav-active ul { display: none; } .left-side-collapsed .custom-nav .menu-list.nav-hover ul { display: block; } .left-side-collapsed .custom-nav > li.nav-hover > a, .left-side-collapsed .custom-nav > li.nav-hover.active > a { background: #c14b59; border-radius: 50px;} .left-side-collapsed .custom-nav > li.nav-hover > a img, .left-side-collapsed .custom-nav > li.nav-hover.active > a img{filter: brightness(0) invert(1);} .left-side-collapsed .custom-nav li.nav-hover a span { display: block; color: #fff; } .left-side-collapsed .custom-nav li.nav-hover.active a span { background: #c14b59; color: #fff; } .left-side-collapsed .custom-nav li.nav-hover ul {display: block;position: absolute;top: 40px;left: 62px;margin: 0;min-width: 190px;z-index: 100; background-color: #F8F6F6;border: 1px solid #E8DEDF;border-bottom-left-radius: 8px;box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.08);border-bottom-right-radius: 8px;border-top-left-radius: 0px; border-top-right-radius: 0px;} .left-side-collapsed .custom-nav ul a { text-align: left; padding: 8px 10px; padding-left: 10px; } .left-side-collapsed .custom-nav ul a:hover { background: #c14b59; } .left-side-collapsed .custom-nav li a i { margin-right: 0; } .left-side-collapsed .main-content { margin-left: 60px; } .left-side-collapsed .left-side { overflow: visible !important; } /* Collapsed sidebar: smooth expand on hover (full rail, no flyout popups) */ .left-side-collapsed .left-side, .left-side-collapsed .main-content, .sticky-header.left-side-collapsed .header-section, .sticky-header.left-side-collapsed .menu-right { transition: width 0.28s ease, margin-left 0.28s ease, left 0.28s ease, margin-right 0.28s ease; } .left-side-collapsed.sidebar-hover-expand .sticky-left-side { overflow-y: auto; } .left-side-collapsed.sidebar-hover-expand .left-side { width: 240px; overflow-y: auto !important; } .left-side-collapsed.sidebar-hover-expand .main-content { margin-left: 240px; } .left-side-collapsed.sidebar-hover-expand .logo { display: block; } .left-side-collapsed.sidebar-hover-expand .logo-icon { display: none !important; } .sticky-header.left-side-collapsed.sidebar-hover-expand .header-section { left: 240px; } .sticky-header.left-side-collapsed.sidebar-hover-expand .menu-right { margin-right: 270px; } /* Inline labels + submenus (same as expanded sidebar), not popups */ .left-side-collapsed.sidebar-hover-expand .custom-nav li a { text-align: left; justify-content: flex-start; } .left-side-collapsed.sidebar-hover-expand .custom-nav .menu-style .menu-width { width: auto; max-width: none; margin: 0; } .left-side-collapsed.sidebar-hover-expand .custom-nav li a span { position: static; display: inline !important; background: transparent; padding: 0; min-width: 0; /* color: inherit; */ } .left-side-collapsed.sidebar-hover-expand .custom-nav li a span:after { display: none; } .left-side-collapsed.sidebar-hover-expand .custom-nav > li.menu-list > a { background-image: url(../images/plus-white.png); background-repeat: no-repeat; background-position: 93% center; } .left-side-collapsed.sidebar-hover-expand .custom-nav > li.nav-active > a { background-image: url(../images/minus.png); } .left-side-collapsed.sidebar-hover-expand .custom-nav ul, .left-side-collapsed.sidebar-hover-expand .custom-nav .menu-list.nav-active ul { position: static; top: auto; left: auto; margin: 10px 0; min-width: 0; box-shadow: none; border-radius: 8px; z-index: auto; } .left-side-collapsed.sidebar-hover-expand .custom-nav > li.nav-active > ul { display: block; } .left-side-collapsed.sidebar-hover-expand .custom-nav > li:not(.nav-active) > ul { display: none; } .left-side-collapsed.sidebar-hover-expand .custom-nav .menu-list.nav-hover ul { display: none; } .left-side-collapsed.sidebar-hover-expand .custom-nav > li.nav-active.nav-hover > ul { display: block; } .left-side-collapsed.sidebar-hover-expand .custom-nav ul a { padding: 10px 5px 10px 20px; } .left-side-collapsed.sidebar-hover-expand .custom-nav li a i { margin-right: 10px; } /* No flyout labels/submenus when collapsed (rail expands on hover instead) */ .left-side-collapsed:not(.sidebar-hover-expand) .custom-nav li a span, .left-side-collapsed:not(.sidebar-hover-expand) .custom-nav li.nav-hover a span { display: none !important; } .left-side-collapsed:not(.sidebar-hover-expand) .custom-nav ul, .left-side-collapsed:not(.sidebar-hover-expand) .custom-nav .menu-list.nav-hover ul, .left-side-collapsed:not(.sidebar-hover-expand) .custom-nav .menu-list.nav-active ul { display: none !important; } /*---------------------------- HEADER SECTION -----------------------------*/ /* .header-section { background: #ed6f7e; border-bottom: 1px solid #ed6f7e; } */ .header-section::after { clear: both; display: block; content: ''; } .toggle-btn {width: 40px;height: 40px;cursor: pointer;float: left;-moz-transition: all 0.2s ease-out 0s;-webkit-transition: all 0.2s ease-out 0s;transition: all 0.2s ease-out 0s;background-color: #fce7e9;display: flex;justify-content: center;align-items: center;border-radius: 50px;margin: 6px 0 0;} .toggle-btn img{transition: all 0.2s ease-out 0s;} .toggle-btn:hover { background: #c14b59;} .toggle-btn:hover img{filter: brightness(0) invert(1);} .searchform input { box-shadow: none; float: left; font-size: 14px; height: 35px; margin: 7px 0 0 10px; padding: 10px; width: 220px; } .searchform input:focus { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-color: #ddd; } .menu-right { float: right; margin-right: 15px; } .notification-menu { list-style: none; float: left;list-style: none;display: flex;justify-content: end;margin: 0;padding: 4px 0; } .notification-menu .notification-count{position: absolute;padding: 3px 6px;border-radius: 50px;background-color: #dc3545;font-size: 10px;color: #fff;line-height: 12px;top: 0px;left: -4px;} .notification-menu > li {display: flex;align-items: center;padding: 0;position: relative;} .notification-menu li .top-icon{padding: 7px;border-radius: 6px;height: 35px;width: 35px;margin: 6px 0 0;display: flex;justify-content: center;align-items: center;margin-right: 10px;cursor: pointer;} .notification-menu li .top-icon:hover{background-color: #ffdfe3;} .notification-menu > li > a > i { margin-top: 2px; } .notification-menu .dropdown-toggle { padding: 12px 10px; border-color: #fff; background: #fff; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; border: none; overflow:hidden; } .notification-menu .dropdown-toggle:hover, .notification-menu .dropdown-toggle:focus, .notification-menu .dropdown-toggle:active, .notification-menu .dropdown-toggle.active, .notification-menu .open .dropdown-toggle.dropdown-toggle { background: #fff; color: #ed6f7e;border: none;outline: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .notification-menu .dropdown-toggle img { vertical-align: middle; margin-right: 5px; /*width: 26px; */ -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } .notification-menu .dropdown-toggle .caret { margin-left: 5px; } .notification-menu .dropdown-menu { border: 0; margin-top: 0px; -moz-border-radius: 2px 0 2px 2px; -webkit-border-radius: 2px 0 2px 2px; border-radius: 2px 0 2px 2px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; padding: 5px; } /* .notification-menu .dropdown-menu:after { border-bottom: 6px solid #1694d5; border-left: 6px solid transparent; border-right: 6px solid transparent; content: ""; display: inline-block; right: 10px; position: absolute; top: -6px; } */ .notification-menu .dropdown-menu:after {display: none;} .notification-menu .dropdown-menu li { display: block; margin-bottom: 5px; float: none; background: none;padding: 0;border-radius: 4px;} .notification-menu .dropdown-menu li.new{background: #fce7e9;} .notification-menu .dropdown-menu .view-all-btn{padding: 10px;border-top: 1px solid #eee;text-align: center;margin-bottom: 0;} .notification-menu .dropdown-menu .view-all-btn a{padding: 0;color: #2f2f2f;font-weight: 500;font-size: 14px;text-decoration: none;transition: color .2s;} .notification-menu .dropdown-menu-usermenu li { padding: 0; text-align:left; position: relative;margin-bottom: 0;} .notification-menu .dropdown-menu-usermenu li .user-info-icon{top: 9px;width: 12px;position: absolute;left: 8px;transition: all 0.2s ease-out 0s;} .notification-menu .dropdown-menu-usermenu li a:hover .user-info-icon{filter: brightness(0) invert(1);} .notification-menu .dropdown-menu li a { color: #2f2f2f; font-size: 13px; padding: 7px 10px; padding-left: 30px;-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .notification-menu .dropdown-menu li a:hover { background: #c14b59; color: #fff; border-radius: 4px;} .notification-menu .dropdown-menu li i { font-size: 13px;top: 0;float: right;position: relative;cursor: pointer;right: 0;} .notification-menu .dropdown-menu-head {padding: 0;min-width: 400px;max-width: 400px;border-radius: 10px;box-shadow: 0 4px 24px #2c3e501a;background: #fff;font-family: "Inter", sans-serif;} .notification-menu .title{font-size: 15px !important;color: #2f2f2f !important;font-weight: 500;margin-bottom: 0 !important;text-transform: capitalize !important;font-family: "Inter", sans-serif;background-color: transparent !important; padding: 12px !important;border-bottom: 1px solid #E2E8F6;} .notification-menu .dropdown-menu-head .notification-text{font-size: 13px;color: #1f1f1f;font-weight: 300;margin-bottom: 0;} .notification-menu .info-number { padding: 12px 15px; height: 50px; font-size: 16px; background: #fff; color: #333; border-color: #fff; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .notification-menu .dropdown-menu-usermenu { background: #ffffff; min-width: 200px; box-shadow: 0 3px 10px #44474a12;border-radius: 6px;} .notification-menu .dropdown-menu-head ul {border-top: 0; padding: 10px;scrollbar-width: thin; } .notification-menu .dropdown-menu-head li a {color: #2f2f2f;padding: 8px;opacity: 1;display: block;} .notification-menu .dropdown-menu-head li a:hover { background: none; color: #ed6f7e !important; text-decoration: none; } .notification-menu .btn-group { margin-bottom: 0; } .dropdown-list li { padding: 15px; overflow: hidden; border-bottom: 1px solid #eee; } .dropdown-list li:last-child { border-bottom: 0; } .dropdown-list .thumb { width: 36px; float: left; } .dropdown-list .thumb img { width: 100%; display: block; vertical-align: middle; } .dropdown-list .desc { margin-left: 45px; display: block; } .dropdown-list .desc h5 { font-size: 13px; margin-top: 7px; } .dropdown-list li:last-child { padding: 10px 15px; } .dropdown-list li .badge { float: right; } .user-list { width: 300px; } .user-list .progress { margin-bottom: 0; } .normal-list li a .label i { margin-right: 0; } .normal-list li a span.label { float: left; margin-right: 10px; padding: 5px; width: 20px; } .normal-list li a:hover { color: #ed6f7e !important; text-decoration: none; } .normal-list li .name { font-size: 13px; font-family: 'Arial' Helvetica, sans-serif; line-height: 21px; } .normal-list li .msg { font-size: 12px; line-height: normal; color: #999; display: block; } .info-number .badge { background: #FF6C60; border-radius: 2px; -webkit-border-radius: 2px; font-size: 10px; font-weight: normal; line-height: 13px; padding: 2px 5px; position: absolute; right: 4px; top: 10px; } /* ------------------------------ STICKY HEADER ---------------------------------*/ .sticky-header .logo { position: fixed; top: 0; left: 0; width: 240px; z-index: 101; background: #fff; height: 55px; box-sizing: border-box; padding: 0 16px; display: flex; align-items: center; } .sticky-header .logo img { max-height: 40px; width: auto; } .sticky-header .left-side { /*top: 50px;*/ } .sticky-header .header-section { position: fixed; top: 0; left: 240px; width: 100%; z-index: 100; height: 55px; background-color: #fff; box-sizing: border-box; } .sticky-header .main-content { margin-top: 55px; } .sticky-header .menu-right { margin-right: 270px; } .sticky-header.left-side-collapsed .header-section { left: 60px; } .sticky-header.left-side-collapsed .menu-right { margin-right: 85px; } /* First nav row sits below fixed 55px logo bar (logo is position:fixed, out of flow) */ /* .sticky-header .sticky-left-side .custom-nav { margin-top: 55px; } */ .header-icons{list-style: none;display: flex;justify-content: end;margin: 0;padding: 10px 0;} .header-icons li{display: flex;align-items: center;padding: 0;} .header-icons li .top-icon{padding: 7px;border-radius: 6px;height: 35px;width: 35px;display: flex;justify-content: center;align-items: center;margin-right: 6px;cursor: pointer;} .header-icons li .top-icon:hover{background-color: #ffdfe3;} /* ----------------------- DROPDOWN --------------------------*/ .dropdown-menu-head { background: #fff } .dropdown-menu-head .title { background: #fff; color: #ed6f7e; padding: 15px; text-transform: uppercase; font-size: 12px; margin: 0;text-align: left; } /*----------------------------- MAIN CONTENT ------------------------------*/ .main-content { margin-left: 240px; background: #F8F6F6; min-height: 1000px;border: 1px solid #E8DEDF;border-radius: 16px; } .page-heading { padding: 5px 0px; position: relative; } .heading-top-area{display: flex;justify-content: space-between;align-items: center;border-bottom: 1px dotted #ccc; padding: 5px 10px 10px;margin-bottom: 15px;} .heading-top-area h3{padding: 0px !important;} .page-heading h3 {font-size: 20px;padding: 9px 13px;margin-top: 0px; margin-bottom: 0px; /*IE 5.5-7*/ } .page-heading .breadcrumb {margin: 0; background: none;} .page-heading .breadcrumb a { color: #999999; } .page-heading .breadcrumb li.active { color: #ed6f7e; } .wrapper { padding:15px 15px; } .wrapper::after { clear: both; display: block; content: ''; margin-bottom: 30px; } .total-box {background-color: #fbe6e9;border-radius: 4px;max-width: fit-content;padding: 4px 10px;color: #c14b59;} .panel{border-radius: 16px;box-shadow: 0 2px 4px rgba(0,0,0,.1);border: 1px solid #E8DEDF;margin-bottom: 20px;background-color: #fff;} .panel-body { padding: 15px; } /*------------------------- BOXED VIEW -------------------------*/ .boxed-view { background: #b6b7ba; } .boxed-view .container { position: relative; background: #fff; padding: 0; } /*----------------------------------- HORIZONTAL PAGE VIEW -------------------------------------*/ .horizontal-menu-page { background: #EFF0F4; } .horizontal-menu-page .navbar { margin-bottom: 0; } .horizontal-menu-page .navbar-brand { padding: 5px 15px; min-height: 50px; } .horizontal-menu-page .navbar-default { background: #424F63; border: none; border-radius: 0; } .horizontal-menu-page .navbar-default .navbar-nav > .active > a, .horizontal-menu-page .navbar-default .navbar-nav > .active > a:hover, .horizontal-menu-page .navbar-default .navbar-nav > .active > a:focus, .horizontal-menu-page .navbar-default .navbar-nav > .open > a, .horizontal-menu-page .navbar-default .navbar-nav > .open > a:hover, .horizontal-menu-page .navbar-default .navbar-nav > .open > a:focus, .horizontal-menu-page .navbar-default .navbar-nav > li > a:hover, .horizontal-menu-page .navbar-default .navbar-nav > li > a:focus { background-color: #444444; color: #FFFFFF; } .horizontal-menu-page .navbar-default .navbar-nav > li > a { color: #FFFFFF; font-size: 13px; } .horizontal-menu-page .form-control { box-shadow: none; float: left; } .horizontal-menu-page .dropdown-menu { background-color: #444444; color: #fff; box-shadow: none; border: none; } .horizontal-menu-page .dropdown-menu > li > a { color: #fff; padding: 10px 20px; font-size: 12px; } .horizontal-menu-page .dropdown-menu > li > a:hover, .horizontal-menu-page .dropdown-menu > li > a:focus, .horizontal-menu-page .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover { background-color: #000; color: #ed6f7e; text-decoration: none; } .horizontal-menu-page .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #fff; } .horizontal-menu-page .navbar-default .navbar-toggle { border-color: #000; } .horizontal-menu-page .navbar-default .navbar-toggle .icon-bar { background-color: #000; } .horizontal-menu-page .navbar-default .navbar-toggle:hover, .horizontal-menu-page .navbar-default .navbar-toggle:focus { background-color: #FFFFFF; border-color: #FFFFFF !important; } .horizontal-menu-page .navbar-default .navbar-collapse, .horizontal-menu-page .navbar-default .navbar-form { border-color: #000; } .horizontal-menu-page .dropdown-toggle img { border-radius: 2px; -webkit-border-radius: 2px; margin-right: 5px; vertical-align: middle; width: 18px; } /*------------------- TOOLS --------------------*/ .tools { margin: -7px -5px; } .tools a { background: #E3E4E8; border-radius: 3px; -webkit-border-radius: 3px; color: #858582; float: left; margin-left: 3px; padding: 10px; text-decoration: none; } .tools a:hover { background: #ed6f7e; color: #fff; } /*-------------------------------- FOOTER CONTENT STYLES ---------------------------------*/ footer { background: #fff; padding: 15px; color: #7A7676; font-size: 12px; position: static; bottom: 0; width: 100%; border-top: 1px solid #eff0f4; } footer.sticky-footer { position: fixed; bottom: 0; width: 100%; z-index: 99; } .container footer { width: 79.5%; position: absolute; bottom: 0; } /*----------------------------------- HEADER STATISTICS STYLES -------------------------------------*/ .state-info { position: absolute; right: 15px; top: 20px; } .state-info .panel { float: right; margin-left: 15px; } .state-info .panel .summary { float: left; margin-right: 20px; } .state-info .panel .summary span { color: #49586e; font-size: 13px; font-weight: normal; text-transform: uppercase; } .state-info .panel .summary h3 { font-size: 20px; font-weight: bold; line-height: 20px; margin: 0; } .state-info .panel .summary h3.green-txt { color: #032539; } .state-info .panel .summary h3.red-txt { color: #fc8675; } .chart-bar { float: right; margin-top: 5px; } /*----------------------------------- GENERAL STATISTICS STYLES -------------------------------------*/ .state-overview { color: #fff; } .state-overview .panel { padding: 23px 20px; } .state-overview .purple { background: #2d5dab; box-shadow: 0 5px 0 #264e8f; } .state-overview .red { background: #ed5843; box-shadow: 0 5px 0 #cd4734; } .state-overview .blue { background: #089ee4; box-shadow: 0 5px 0 #0c7fb5; } .state-overview .green { background: #4acacb; box-shadow: 0 5px 0 #42b5b6; } .state-overview .dark-blue { background: #328acd; box-shadow: 0 5px 0 #2a79b5; } .state-overview .yellow{ background: #eba24c; box-shadow: 0 5px 0 #d79240; } .state-overview .dark-red { background: #e23e3e; box-shadow: 0 5px 0 #d02e2e; } .state-overview .green { background: #49a70b; box-shadow: 0 5px 0 #3b8b06; } .state-overview .light-blue { background: #0cbdae; box-shadow: 0 5px 0 #0aada0; } .state-overview .dark-purple { background: #c8399e; box-shadow: 0 5px 0 #ae2886; } .title a{color:#fff !important; text-decoration: none;} .value a{color:#fff !important; text-decoration: none;} .title a:hover{color:#f5f5f5; text-decoration:underline;} .value a:hover{color:#f5f5f5; text-decoration:underline;} .state-overview .symbol, .state-overview .state-value { display: inline-block; } .state-overview .symbol { width: 35%; } .state-overview .symbol i { font-size: 40px; } .state-overview .state-value { width: 100%; } .state-overview .state-value .value { font-size: 17px; font-weight: bold; margin-bottom: 5px; } .state-overview .state-value .title { font-size: 17px; margin-bottom: 20px; } /*----------------------------------- MORE STATISTICS BOX -------------------------------------*/ .panel.deep-purple-box { background: #49586e; box-shadow: 0 5px 0 #424f63; color: #fff; } ul.bar-legend { list-style-type: none; margin-top: 55px; padding-left: 0px; } ul.bar-legend li { display: block; margin-bottom: 10px; } ul.bar-legend li span { float: left; margin-right: 10px; width: 20px; height: 20px; border-radius: 3px; -webkit-border-radius: 3px; } ul.bar-legend li span.blue { background: #5ab6df; } ul.bar-legend li span.green { background: #4bcacc; } ul.bar-legend li span.purple { background: #6a8bbe; } ul.bar-legend li span.red { background: #fb8575; } /*----------------------------------- REVENUE STATES STYLES -------------------------------------*/ .revenue-states h4 { font-size: 14px; font-weight: bold; text-transform: uppercase; color: #49586e; } .revenue-states .icheck .single-row { float: left; width: auto; } .revenue-states .icheck .checkbox { padding-left: 0; margin-top: 0; } .revenue-states .icheck .checkbox label { font-size: 12px; } ul.revenue-nav { list-style-type: none; float: right; margin-top: 20px; padding: 0; } ul.revenue-nav li { display: inline-block; margin-left: 5px; } ul.revenue-nav li a { background: #4a596f; color: #fff; padding: 5px 10px; text-decoration: none; border-radius: 3px; text-transform: uppercase; font-size: 12px; } ul.revenue-nav li a:hover, ul.revenue-nav li a:focus, ul.revenue-nav li.active a { background: #ed6f7e; color: #fff; } .revenue-chart { width: 100%; height: 300px; text-align: center; margin: 12px auto; } ul.revenue-short-info { list-style-type: none; padding: 0; } ul.revenue-short-info li { float: left; width: 25%; } ul.revenue-short-info li h1 { font-size: 18px; font-weight: lighter; margin-bottom: 0; } ul.revenue-short-info li p { font-size: 12px; color: #bdbdbd; } ul.revenue-short-info .red { color: #fb8575; } ul.revenue-short-info .blue { color: #3bcddd; } ul.revenue-short-info .green { color: #ed6f7e; } ul.revenue-short-info .purple { color: #7ea8e1; } /*----------------------------------- GOAL PROGRESS STYLES -------------------------------------*/ ul.goal-progress { list-style-type: none; padding: 0; } ul.goal-progress li { display: inline-block; width: 100%; border-bottom: 1px dashed #e8dedf; margin-bottom: 15px; padding-bottom: 15px; } ul.goal-progress li .prog-avatar { width: 40px; height: 40px; float: left; margin-right: 25px; } ul.goal-progress li .prog-avatar img { width: 100%; border-radius: 50%; -webkit-border-radius: 50%; } ul.goal-progress li .details { } ul.goal-progress li .title { margin-bottom: 10px; } ul.goal-progress li .title a { color: #6a8abe; } ul.goal-progress li .title a:hover { color: #ed6f7e; } ul.goal-progress li .progress { margin-bottom: 0px; } /*----------------------------------- PROSPECTIVE LEADS - CHARTS -------------------------------------*/ .pros-title { font-size: 14px; color: #535351; text-transform: uppercase; font-weight: bold; margin: 0 0 20px 0; } .pros-title span { color: #dddddd; } ul.pros-chart { list-style-type: none; padding: 0; display: inline-block; width: 100%; margin-top: 15px; } ul.pros-chart li { float: left; margin-right: 14%; } ul.pros-chart li:last-child { margin-right: 0; } .p-chart-title { font-size: 12px; margin: 5px 0 0 0; } .v-title { font-size: 12px; } .v-value { font-size: 18px; color: #343434; margin-bottom: 5px; } .v-info { font-size: 12px; margin-top: 5px; } /*------------------------------------------- GREEN BOX [EASY PIE CHART] STYLES -------------------------------------------*/ .green-box { background: none repeat scroll 0 0 #ed6f7e; box-shadow: 0 5px 0 #5bb996; color: #fff; } .knob { text-align: center; } .percent { color: rgba(255, 255, 255, 0.7); display: inline-block; font-size: 25px; z-index: 2; position: absolute; width: 90px; padding-top: 35px; } .percent .sm { font-size: 11px; display: block; padding-top: 32px; } .extra-pad { padding: 25px 15px; } /*------------------------------------ BLUE BOX [TWITTER FEED] STYLES -------------------------------------*/ .panel.blue-box { background: none repeat scroll 0 0 #5ab5de; box-shadow: 0 5px 0 #51a3c7; color: #fff; } .twt-info h3 { font-size: 16px; font-weight: bold; margin: 10px 0 30px 0; text-align: center; } .twt-info p { font-size: 18px; line-height: 25px; font-style: italic; margin: 0 0 20px 0; text-align: center; } .twt-info p a { color: #98fdf4; } .custom-trq-footer { background: none repeat scroll 0 0 #4eb6b7; box-shadow: 0 5px 0 #46a3a4; color: #fff; border-top: none; } ul.user-states { list-style-type: none; padding: 20px 0; } ul.user-states li { text-align: center; float: left; width: 33%; font-size: 18px; } .usr-info .thumb { width: 80px; height: 80px; border-radius: 50%; -webkit-border-radius: 50%; } .media.usr-info > .pull-left { margin-right: 20px; margin-top: 10px; } .usr-info h4 { color: #658585; margin-bottom: 0; } .usr-info .media-body span { color: #ea755c; font-size: 12px; margin-bottom: 20px; display: inline-block; } .usr-info .media-body p { color: #b6bcbc; } /*------------------------------ TODOLIST STYLES ------------------------------*/ .todo-title { margin-right: 25px; padding-top: 5px; } .to-do-list { padding-left: 0; margin-top: -10px; font-size: 12px; } .to-do-list li { padding: 17px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position: relative; cursor: move; list-style: none; font-size: 12px; background: #fff; border-bottom: 1px dotted rgba(0, 0, 0, 0.2); } .to-do-list li p { margin-bottom: 0px; } .todo-actionlist { position: absolute; right: -5px; top: 22px; } .todo-actionlist a { height: 24px; width: 24px; display: inline-block; float: left; } .todo-actionlist a i { height: 24px; width: 24px; display: inline-block; text-align: center; line-height: 24px; color: #ccc; } .todo-actionlist a:hover i { color: #666; } .todo-done i { font-size: 14px; } .todo-remove i { font-size: 10px; } .line-through { text-decoration: line-through; } .todo-action-bar { margin-top: 20px; } .drag-marker { height: 17px; display: block; float: left; width: 7px; position: relative; top: 6px; } .drag-marker i { height: 2px; width: 2px; display: block; background: #ccc; box-shadow: 5px 0 0 0px #ccc, 0px 5px 0 0px #ccc, 5px 5px 0 0px #ccc, 0px 10px 0 0px #ccc, 5px 10px 0 0px #ccc, 0px 15px 0 0px #ccc, 5px 15px 0 0px #ccc; -webkit-box-shadow: 5px 0 0 0px #ccc, 0px 5px 0 0px #ccc, 5px 5px 0 0px #ccc, 0px 10px 0 0px #ccc, 5px 10px 0 0px #ccc, 0px 15px 0 0px #ccc, 5px 15px 0 0px #ccc; -moz-box-shadow: 5px 0 0 0px #ccc, 0px 5px 0 0px #ccc, 5px 5px 0 0px #ccc, 0px 10px 0 0px #ccc, 5px 10px 0 0px #ccc, 0px 15px 0 0px #ccc, 5px 15px 0 0px #ccc; } /* To-Do Check*/ .to-do-list li .todo-check input[type=checkbox] { visibility: hidden; } .todo-check { width: 20px; position: relative; margin-right: 10px; margin-left: 10px; margin-top: 5px; } .todo-check label { cursor: pointer; position: absolute; width: 20px; height: 20px; top: 0; left: 0px; -webkit-border-radius: 2px; border-radius: 2px; border: #ccc 1px solid; } .todo-check label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; content: ''; position: absolute; width: 13px; height: 8px; background: transparent; top: 3px; left: 3px; border: 3px solid #cfcfcf; border-top: none; border-right: none; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .todo-checklabel:hover::after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); opacity: 0.3; } .todo-check input[type=checkbox]:checked+label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } .todo-entry { float: left; width: 85%; } /*------------------- BADGE STYLES --------------------*/ /* .badge.badge-primary { background: #8075c4; } .badge.badge-success { background: #a9d86e; } .badge.badge-warning { background: #FCB322; } .badge.badge-important { background: #ff6c60; } .badge.badge-info { background: #41cac0; } */ .badge.badge-inverse { background: #2A3542; } /* .badge-light { display: inline-block; font-size: 13px; font-weight: 600; padding: 2px 4px; border: 1px solid transparent; min-width: 10px; line-height: 1; font-family: 'Inter'; text-align: center; white-space: nowrap; vertical-align: middle; border-radius: 4px; margin-right:5px; } */ /* .badge-light.badge-light-primary { background-color: #fbe6e9; color: #ed6f7e; } */ .guest-panel { border: 1px solid #ddd; border-radius: 8px; padding: 10px; margin-bottom: 10px; } .guest-panel .title { margin-top: 0; font-size: 14px; font-weight: 400; color: #2f2f2f; margin-bottom: 10px; } .guest-panel .number { font-size: 21px; font-weight: 600; color: #2f2f2f; } .guest-panel .number a { text-decoration: none; color: #2f2f2f; } .badge { display: inline-block; font-size: 11px; font-weight: 400; padding: 4px 6px; border: 1px solid transparent; min-width: 10px; line-height: 1; font-family: 'Inter'; color: #fff; text-align: center; white-space: nowrap; vertical-align: middle; border-radius: 4px; margin-right:5px; } .badge-send{background-color: #fce7e9;color: #ed6f7e;font-weight: 500;border-left: 2px solid #ed6f7e;border-radius: 2px;font-weight: 500;} .badge.badge-default { background-color: #B0BEC5 } .badge.badge-primary { background-color: #ed6f7e } .badge.badge-secondary { background-color: #323a45 } .badge.badge-success { background-color: #19943C } .badge.badge-warning { background-color: #E29B12 } .badge.badge-info { background-color: #29B6F6 } .badge.badge-danger { background-color: #E20F0F } .badge.badge-important { background-color: #E20F0F } /*-------------------------------- CAROUSEL STYLES ---------------------------------*/ .carousel-indicators li { background: rgba(0, 0, 0, 0.2); border: none; transition: background-color 0.25s ease 0s; -moz-transition: background-color 0.25s ease 0s; -webkit-transition: background-color 0.25s ease 0s; } .carousel-indicators .active { background: #333; height: 10px; margin: 1px; width: 10px; } .carousel-indicators.out { bottom: -5px; } .carousel-indicators.out { bottom: -5px; } .carousel-control { color: #999999; text-shadow: none; width: 45px; } .carousel-control i { display: inline-block; height: 25px; left: 50%; margin-left: -10px; margin-top: -10px; position: absolute; top: 50%; width: 20px; z-index: 5; } .carousel-control.left, .carousel-control.right { background: none; filter: none; } .carousel-control:hover, .carousel-control:focus { color: #CCCCCC; opacity: 0.9; text-decoration: none; } .carousel-inner h3 { font-weight: 300; font-size: 16px; margin: 0; } .carousel-inner { margin-bottom: 15px; } /* -------------------------------- CODE HIGHLIGHT STYLE -----------------------------------*/ .highlight pre code { color: #333333; font-size: inherit; } .nt { color: #2F6F9F; } .na { color: #4F9FCF; } .s { color: #D44950; } .c { color: #999999; } /*------------------------- BUTTON STYLES ---------------------------*/ .btn-block { padding: 6px 12px; } .btn-gap .btn { float: left; margin-right: 5px; } .btn-small { padding: 5px 10px !important; font-size: 12px !important; line-height: 1.5 !important; border-radius: 3px !important; } /*---------------------- STAR RATINGS STYLES -----------------------*/ .rating { unicode-bidi: bidi-override; direction: rtl; font-size: 30px; } .rating span.star, .rating span.star { font-family: FontAwesome; font-weight: normal; font-style: normal; display: inline-block; } .rating span.star:hover, .rating span.star:hover { cursor: pointer; } .rating span.star:before, .rating span.star:before { content: "\f006"; padding-right: 5px; color: #BEC3C7; } .rating span.star:hover:before, .rating span.star:hover:before, .rating span.star:hover ~ span.star:before, .rating span.star:hover ~ span.star:before { content: "\f005"; color: #ed6f7e; } /*---------------------------- SLIDER STYLE ----------------------------*/ .slider-table tr td { padding: 30px 0 !important; border: none !important; } /*---------------------------------- TABS & ACCORDIONS STYLE -------------------------------------*/ .panel-heading .nav { border: medium none; font-size: 13px; margin: -7px -15px -7px; } .panel-heading.custom-tab { padding: 8px 15px; margin-bottom:15px; } .custom-tab ul > li > a { display: block; padding: 10px 15px !important; } .custom-tab { background: #ed6f7e !important; border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; border-bottom: none; } .custom-tab.dark-tab { background: #424F63 !important; } .custom-tab.turquoise-tab { background: #ed6f7e !important; } .custom-tab.blue-tab { background: #5BC0DE !important; } .custom-tab.yellow-tab { background: #F0AD4E !important; } .custom-tab.dark-tab li a, .custom-tab.turquoise-tab li a, .custom-tab.blue-tab li a, .custom-tab.yellow-tab li a { color: #fff !important; } .custom-tab.dark-tab li.active a, .custom-tab.dark-tab li a:hover { color: #424F63 !important; } .custom-tab.turquoise-tab li a:hover, .custom-tab.turquoise-tab li.active a { color: #ed6f7e !important; } .custom-tab.blue-tab li a:hover, .custom-tab.blue-tab li.active a { color: #5BC0DE !important; } .custom-tab.yellow-tab li a:hover, .custom-tab.yellow-tab li.active a { color: #F0AD4E !important; } .custom-tab li a:hover, .custom-tab li.active a { border-radius: 0 !important; background: #f8097b !important; color: #fff !important; } .panel-heading .nav > li > a, .panel-heading .nav > li.active > a, .panel-heading .nav > li.active > a:hover, .panel-heading .nav > li.active > a:focus { border-width: 0; border-radius: 0; } .panel-heading .nav > li > a { color: #fff; } .panel-heading .nav > li.active > a, .panel-heading .nav > li > a:hover { color: #ed6f7e; background: #fff; } .panel-heading .nav > li:first-child.active > a, .panel-heading .nav > li:first-child > a:hover { border-radius: 4px 0 0 0 !important; -webkit-border-radius: 4px 0 0 0 !important; } .tab-right { height: 45px; } .panel-heading.tab-right .nav > li:first-child.active > a, .tab-right.panel-heading .nav > li:first-child > a:hover { border-radius: 0 !important; -webkit-border-radius: 0 !important; } .panel-heading.tab-right .nav > li:last-child.active > a, .tab-right.panel-heading .nav > li:last-child > a:hover { border-radius: 0 4px 0 0 !important; -webkit-border-radius: 0 4px 0 0 !important; } .panel-heading.tab-right .nav-tabs > li > a { margin-left: 1px; margin-right: 0px; } .panel-heading.dark { background: #444444; color: #fff; } .panel-heading.dark a:hover, .panel-heading.dark a:focus { color: #fff; } /*------------------------------ CALENDAR STYLES -------------------------------*/ .has-toolbar.fc { margin-top: 50px; } .fc-header-title { display: inline-block; margin-top: -45px; vertical-align: top; } .fc-header-center { text-align: left; } .fc-header-left { text-align: left; width: 18%; } .fc-view { margin-top: -50px; overflow: hidden; width: 100%; } .fc-state-default, .fc-state-default .fc-button-inner { background: #fff !important; border-color: #DDDDDD; border-style: none solid; color: #646464; } .fc-state-active, .fc-state-active .fc-button-inner, .fc-state-active, .fc-button-today .fc-button-inner, .fc-state-hover, .fc-state-hover .fc-button-inner { background: #ed6f7e !important; color: #fff !important; } .fc-event-skin { background-color: #5d708c !important; border-color: #5d708c !important; color: #FFFFFF !important; } .fc-grid th { height: 45px; line-height: 45px; text-align: center; background: #ed6f7e !important; color: #fff; text-transform: uppercase; } .fc-widget-header { border-color: #62c6a0; } .fc-widget-content { border-color: #ebebeb; background: #fff; } .fc-header-title h2 { font-size: 18px !important; color: #474752; font-weight: 300; padding: 0 10px; } .external-event { cursor: move; display: inline-block !important; margin-bottom: 6px !important; margin-right: 6px !important; padding: 8px; } #external-events p input[type="checkbox"] { margin: 0; } #external-events .external-event { font-size: 11px; font-family: 'Arial'; font-weight: normal; } .drg-event-title { font-weight: 300; margin-top: 0; margin-bottom: 15px; border-bottom: 1px solid #ddd; padding-bottom: 10px; } .fc-content .fc-event { border-radius: 4px; webkit-border-radius: 4px; padding: 4px 6px; } .drp-rmv { padding-top: 10px; margin-top: 10px; } /*--------------------------- FONTAWESOME STYLES ----------------------------*/ .fontawesome-icon-list { margin-top: -20px; } .fontawesome-icon-list, .fontawesome-icon-list a { color: #7a7676; } .fontawesome-icon-list a:hover { color: #49586E; } .fontawesome-icon-list a { margin-bottom: 10px; display: block; } .fontawesome-icon-list a i { padding-right: 10px; } .fontawesome-icon-list .page-header { margin: 15px 0 20px 0; font-size: 22px; color: #49586E; } /*---------------------------- BASIC TABLE STYLE -----------------------------*/ .general-table a { color: #49586E; } /*-------------------------------- DYNAMIC TABLE STYLE ----------------------------------*/ .table-advance tr td { vertical-align: middle !important; } .no-border { border-bottom: none; } .dataTables_length, .dataTables_filter { padding: 15px 0; } .dataTables_info { padding: 15px 0 0 !important; } .dataTables_filter { float: right; } .dataTables_length select { width: 65px; padding: 5px 8px; } .dataTables_length label, .dataTables_filter label { font-weight: 300; } .dataTables_filter label { width: 100%; } .dataTables_filter label input { width: 78%; } .border-top { border-top: 1px solid #ddd; } .dataTables_paginate.paging_bootstrap.pagination li { float: left; margin: 0 1px; border: 1px solid #ddd; list-style: none; } .dataTables_paginate.paging_bootstrap.pagination li.disabled a { color: #c7c7c7; } .dataTables_paginate.paging_bootstrap.pagination li a { color: #797979; padding: 5px 10px; display: inline-block; } .dataTables_paginate.paging_bootstrap.pagination li:hover a, .dataTables_paginate.paging_bootstrap.pagination li.active a { color: #fff; background: #ed6f7e; text-decoration: none; } .dataTables_paginate.paging_bootstrap.pagination li:hover, .dataTables_paginate.paging_bootstrap.pagination li.active { border-color: #032539; } .dataTables_paginate.paging_bootstrap.pagination li.disabled:hover, .dataTables_paginate.paging_bootstrap.pagination li.disabled:hover a { color: #C7C7C7; background: #fff; border-color: #DDDDDD; cursor: no-drop; } .dataTables_paginate.paging_bootstrap.pagination { float: right; margin-bottom: 15px; } .dataTable tr:last-child { border-bottom: 1px solid #ddd; } .general-table .progress { margin-bottom: 0; } .table-bordered {border: none;} .table-bordered thead tr th:first-child{border-radius: 0px 0px 0px 0px;} .table-bordered thead tr th:last-child{border-radius: 0px 0px 0px 0px;} .adv-table table.display thead th a{color: #c14b59;} .adv-table table tr td { padding: 5px 10px; border: 1px solid #E8DEDF;letter-spacing: 0.2px;line-height: 28px; white-space: nowrap;} .adv-table table tr td a{color: #2f2f2f; font-weight: 500;} .adv-table table tr td .form-control{height: 28px;} .adv-table table.display thead th { border-bottom: none; padding: 8px 20px 8px 10px; font-weight: 500; white-space: nowrap; background-color: #FCE7E9; color: #c14b59;border: none;} .adv-table table.display tfoot th{font-weight: 500;} .dataTable tr.odd.gradeA td.sorting_1, .dataTable tr.odd td.sorting_1, .dataTable tr.even.gradeA td.sorting_1 { background: none; } .dataTable td.details { background-color: #424F63; color: #fff; } .dataTable td.details table tr td, .dataTable tr:last-child { border: none; } .adv-table table.display tr.odd.gradeA { background-color: #F9F9F9; } .adv-table table.display tr.even.gradeA { background-color: #FFFFFF; } .adv-table .dataTables_filter label input { float: right; /*margin-left: 10px;*/ width: 78%; padding: 10px; border: solid 1px gainsboro; border-radius:0px; -webkit-transition: box-shadow 0.3s, border 0.3s; -moz-transition: box-shadow 0.3s, border 0.3s; -o-transition: box-shadow 0.3s, border 0.3s; transition: box-shadow 0.3s, border 0.3s; } .adv-table .dataTables_filter label input:focus { float: right; /*margin-left: 10px;*/ width: 78%; padding: 10px; border: solid 1px #707070; border-radius:0px; -webkit-box-shadow: 0 0 5px 1px #ffc7cd; -moz-box-shadow: 0 0 5px 1px #ffc7cd; box-shadow: 0 0 5px 1px #ffc7cd;} .adv-table .dataTables_filter label { line-height: 33px; width: 100%; } .adv-table .dataTables_length select { display: inline-block; border-radius:0px; margin: 0 10px 0 0; padding: 5px 8px; width: 65px; border: solid 1px gainsboro; border-radius:0px; -webkit-transition: box-shadow 0.3s, border 0.3s; -moz-transition: box-shadow 0.3s, border 0.3s; -o-transition: box-shadow 0.3s, border 0.3s; transition: box-shadow 0.3s, border 0.3s; } .adv-table .dataTables_length select:focus{ border: solid 1px #707070; border-radius:0px; -webkit-box-shadow: 0 0 5px 1px #ffc7cd; -moz-box-shadow: 0 0 5px 1px #ffc7cd; box-shadow: 0 0 5px 1px #ffc7cd;} table.display tr.gradeA{background-color: #fff;} .adv-table .dataTables_info, .dataTables_paginate { padding: 15px 0; } .adv-table .dataTables_length, .adv-table .dataTables_filter { padding: 15px 0; width:auto; } .cke_chrome { border: none !important; } .editable-table .dataTables_filter { width: 80%; } .dataTable tr.odd.gradeX td.sorting_1, .dataTable tr.even.gradeX td.sorting_1, table.display tr.even.gradeX, table.display tr.gradeX, tr.even.gradeU td.sorting_1, tr.even td.sorting_1, table.display tr.even.gradeC, table.display tr.gradeC, tr.odd.gradeC td.sorting_1, table.display tr.even.gradeU, table.display tr.gradeU, tr.odd.gradeU td.sorting_1 { background: none !important; } .puckup-drop-box{ display: flex; align-items: center; justify-content: start; min-width: 287px; gap: 10px; padding: 5px 10px; background-color: #f8f6f6; border: 1px solid #ccc; border-radius: 16px; height: 40px;margin-left: 10px; } .assigned-box{ display: flex; align-items: center; justify-content: start; min-width: 150px; gap: 10px; padding: 5px 10px; background-color: #f8f6f6; border: 1px solid #ccc; border-radius: 16px; margin-left: 10px; height: 40px; } /*---------------------------- EDITABLE TABLE STYLE -----------------------------*/ .editable-table table input { width: 95% !important; } .editable-table table td a { color: #49586E; } .editable-table table td a:hover { color: #ed6f7e; } /*-------------------------- Media Gallery ----------------------------*/ .media-filter { float: left; margin: 10px 0; padding-left: 0; } .media-filter li { float: left; margin-right: 2px; list-style: none; } .media-filter li a { background: #ed6f7e; border-color: #ed6f7e; color: #fff; padding: 5px 10px; border-radius: 2px; -webkit-border-radius: 2px; text-decoration: none; font-size: 12px; } .media-filter li a:hover, .media-filter li a:focus { background: #4c9b7e; border-color: #4c9b7e; color: #fff; } .media-gal { float: left; width: 100%; margin-top: 20px; } .media-gal .item { float: left; } .media-gal .item { margin-bottom: 1%; margin-right: 1%; width: 233px; background: #EFF0F4; color: #7A7676; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .media-gal .item:hover { background: #ed6f7e; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; color: #fff; } .media-gal .item:hover img { opacity: .3; } .media-gal .item p { margin-bottom: 10px; margin-top: 10px; text-align: center; } .media-gal .item img { height: 200px; width: 100%; } .img-modal img { width: 100%; margin-bottom: 10px; } /*----------------------------------- Start: Recommended Isotope styles -------------------------------------*/ /* Isotope Filtering */ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /*Isotope CSS3 transitions */ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } /*disabling Isotope CSS3 transitions */ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* End: Recommended Isotope styles */ /* disable CSS transitions for containers with infinite scrolling*/ .isotope.infinite-scrolling { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /*------------------------------------*/ /*FORM STYLES*/ /*------------------------------------*/ .sm-input { width: 170px !important; } .form-horizontal.adminex-form .form-group { border-bottom: 1px solid #E8DEDF; padding-bottom: 15px; margin-bottom: 15px; } .form-horizontal.adminex-form .form-group strong{ color:#ed6f7e; } /* .form-horizontal.adminex-form .form-group:last-child { padding-bottom: 8px; margin-bottom: 8px; } */ .form-horizontal.adminex-form .form-group:last-child strong{ color:#ed6f7e; } .form-horizontal.adminex-form .form-group .help-block { margin-bottom: 0; } .invitation-card-form .form-group{ border-bottom: none !important; padding-bottom: 0 !important; margin-bottom: 0 !important; } .invitation-card-form .border-bottom-style{ border-bottom: 1px solid #E8DEDF; padding-bottom: 15px; margin-bottom: 15px; } .round-input { border-radius: 500px; -webkit-border-radius: 500px; } .m-bot15 { margin-bottom: 15px; } .form-horizontal.adminex-form .checkbox-inline > input { margin-top: 1px; border: none; } .iconic-input { position: relative; } .iconic-input i { color: #CCCCCC; display: block; font-size: 16px; height: 16px; margin: 8px 5px 8px 10px; position: absolute; text-align: center; width: 16px; } .iconic-input input { padding-left: 30px !important; } .iconic-input.right input { padding-left: 10px !important; padding-right: 30px !important; } .iconic-input.right i { float: right; right: 5px; } input.spinner[type="text"], input.spinner[type="password"], input.spinner[type="datetime"], input.spinner[type="datetime-local"], input.spinner[type="date"], input.spinner[type="month"], input.spinner[type="time"], input.spinner[type="week"], input.spinner[type="number"], input.spinner[type="email"], input.spinner[type="url"], input.spinner[type="search"], input.spinner[type="tel"], input.spinner[type="color"] { background: url("../images/input-spinner.gif") right no-repeat !important; } /*-------------------- CK EDITORS ---------------------*/ .cke_chrome { box-shadow: 0 0 1px #c5c6ca !important; } .cke_top, .cke_bottom { background: #EFF0F4 !important; box-shadow: none !important; border-top: none !important; border-bottom: none !important; } /*-------------------------- FORM VALIDATION ---------------------------*/ .cmxform .form-group label.error { display: inline; margin: 5px 0; color: #FF6C60; font-weight: 400; } input:focus:invalid:focus, textarea:focus:invalid:focus, select:focus:invalid:focus, .cmxform .form-group input.error, .cmxform .form-group textarea.error { border-color: #FF6C60 !important; } #signupForm label.error { display: inline; margin: 5px 0px; width: auto; color: #FF6C60; } .checkbox, .checkbox:hover, .checkbox:focus { border: none; } /*-------------------------- FORM WIZARD STYLES ---------------------------*/ .widget-container .stepy-tab ul, .block-tabby ul.stepy-titles { border-bottom: none; padding: 0; } .fw-title { color: #424F63; margin-bottom: 30px; } .block-tabby ul.stepy-titles { margin-bottom: 10px; } .widget-container .stepy-tab ul li.current-step, .block-tabby ul li.current-step { border: none; background: #ed6f7e!important; color: #fff; } .widget-container .stepy-titles li, .stepy-titles li { background: #fff; margin-right: 15px; margin-bottom: 15px; border-radius: 5px; -webkit-border-radius: 5px; } .widget-container .stepy-titles li span { font-size: 12px; } .widget-container .step { margin-bottom: 50px; border-bottom: 1px solid #ddd; padding-bottom: 50px; } .widget-container .step legend { color: #ed6f7e; font-size: 16px; border-bottom: 1px dotted #ddd; padding-bottom: 10px; } .widget-container input.form-control { padding: 0 10px; } .stepy-error { position: absolute; bottom: 105px; } .stepy-error label.error { font-size: 12px; font-weight: normal; } .step input, .step textarea, .step select, .widget-content label.checkbox, .widget-content label.radio { margin-left: 0 !important; padding-left: 0; } .widget-content label.checkbox input, .widget-content label.radio input { margin-right: 10px; } /*---------------------------------------------- CUSTOM CHECKBOX & RADIO BUTTONS STYLES ----------------------------------------------*/ .icheck div, .icheck .disabled { float: left; } .icheck div { margin-right: 10px; } .icheck label { font-weight: normal; } .icheck .checkbox, .icheck .radio { margin-bottom: 10px; } .icheck .single-row { display: inline-block; width: 100%; } /*------------------------- MULTI SELECT STYLE --------------------------*/ .ms-container .ms-selectable li.ms-hover, .ms-container .ms-selection li.ms-hover { background-color: #ed6f7e; color: #FFFFFF; cursor: pointer; text-decoration: none; } .ms-container .ms-list, .ms-container .ms-list.ms-focus { box-shadow: none !important; } .ms-container .ms-list.ms-focus { border: 1px solid #ed6f7e; } .ms-selectable .search-input, .ms-selection .search-input { margin-bottom: 10px; } /*--------------------------------- SPINNER STYLE ----------------------------------*/ .spinner-buttons.input-group-btn { width: 20%; } .spinner-buttons.input-group-btn .btn-xs { line-height: 1.16; } .spinner-buttons.btn-group-vertical > .btn:last-child:not(:first-child) { border-radius: 0 0 4px 0; -webkit-border-radius: 0 0 4px 0; } .spinner-buttons.btn-group-vertical > .btn:first-child:not(:last-child) { border-radius: 0 4px 0 0; -webkit-border-radius: 0 4px 0 0; } /*---------------------------- FILE UPLOAD STYLES ----------------------------*/ .fileupload .btn { margin-left: 0; } /*---------------------------- TAGS INPUT STYLE -----------------------------*/ div.tagsinput span.tag { background: #ed6f7e !important; border-color: #ed6f7e; color: #fff; border-radius: 15px; -webkit-border-radius: 15px; padding: 2px 10px; } div.tagsinput span.tag a { color: #43886e; } /*--------------------------- SLIDE TOGGLE STYLES ----------------------------*/ .slide-toggle div { float: left; margin-right: 20px; } /*-------------------------- PICKERS STYLES ---------------------------*/ .add-on { float: right; margin-top: -47px; padding: 3px; text-align: center; } .add-on .btn { padding: 14px 12px; } .colorpicker.dropdown-menu { min-width: 130px; padding: 5px; } .datepicker.dropdown-menu { z-index: 1060; padding: 5px; margin-top: 50px;} .custom-date-range .input-group-addon { border-left: 1px solid #EEEEEE; border-right: 1px solid #EEEEEE; } /*------------------------------------- GOOGLE MAPS & VECTOR MAPS STYLE -------------------------------------*/ .gmaps { height: 350px; width: 100%; } .vmaps { width: 100%; height: 400px; } /*-------------------------- LOCK SCREEN STYLE --------------------------*/ .lock-screen { background: url(../images/body-bg.jpg) no-repeat fixed; background-size: cover; width: 100%; height: 100%; } .lock-wrapper { margin: 18% auto; max-width: 400px; } .lock-box { padding: 20px; position: relative; width: 100%; display: inline-block; } .lock-wrapper img { position: absolute; left: 36%; top: -80px; border-radius: 50%; -webkit-border-radius: 50%; border: 6px solid #fff; } .lock-wrapper h1 { text-align: center; color: #ed6f7e; font-size: 18px; text-transform: uppercase; padding: 10px 0 10px; } .lock-wrapper .locked { position: absolute; width: 50px; height: 50px; line-height: 36px; border-radius: 50%; -webkit-border-radius: 50%; display: inline-block; color: #fff; text-align: center; background: #ed6f7e; top: -25px; right: 125px; border: 4px solid #fff; font-size: 22px; } .lock-wrapper input, .lock-wrapper input:focus { background: #eaeaec; border-color: #eaeaec; width: 85% !important; height: 40px; float: left; } .btn-lock { background: #ed6f7e; color: #fff; height: 40px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .btn-lock:hover { background: #23608f; color: #fff; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } /*-------------------------------- PRICING TABLE ---------------------------------*/ .price-head { padding: 10px 0 50px; } .price-head h1 { font-size: 32px; font-weight: normal; color: #49586e; } .pricing-table { background: #fff; text-align: center; padding: 0 0 25px 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 0 5px 0 #e5e5e5; width: 110%; margin-left: -10px; } .pricing-table.most-popular { position: relative; } .most-popular { background: #ed6f7e; color: #fff; box-shadow: 0 5px 0 #60b193; } .most-popular .pricing-head { position: relative; height: 170px; } .most-popular .pricing-head h1 { color: #fff; } .most-popular .pricing-quote, .most-popular ul li i { color: #ed6f7e; } .most-popular ul li { } .most-popular .price-actions .btn { background: #60b193 !important; cursor: pointer; color: #fff !important; } .most-popular .pricing-quote { background: #fff; } .pricing-table .price-actions .btn { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #eff0f4; color: #a4a4a4; border: none; box-shadow: none; text-shadow: none; padding: 10px 20px; cursor: pointer; text-transform: uppercase; } .pricing-table .price-actions .btn:hover, .most-popular.pricing-table .price-actions .btn:hover { background: #49586e !important; color: #fff; } .pricing-head { position: relative; height: 170px; color: #000; } .pricing-head h1 { font-size: 24px; font-weight: 300; padding-top: 30px; color: #000; text-transform: uppercase; } .pricing-quote { background: #eff0f4; padding: 50px 0; color: #49586e; font-size: 45px; font-weight: bold; width: 150px; height: 150px; border-radius: 50%; -webkit-border-radius: 50%; margin: -85px auto; position: relative; } .pricing-table ul { margin: 120px 0 50px; padding: 0; } .pricing-table ul li { margin: 0 2em; padding: 1em 0; text-align: center; font-weight: 300; } .pricing-quote span.note { display: inline; font-size: 18px; line-height: 0.8em; position: relative; top: -18px; } .pricing-quote p { font-size: 12px; text-transform: uppercase; color: #a4a4a4; padding-top: 10px; font-weight: normal; } .pricing-quotation, .team-info { background: #EEEEEE; padding: 20px 20px 35px 20px; margin-bottom: 100px; display: inline-block; width: 100%; text-align: center; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .pricing-quotation h3, .team-info h3 { font-weight: 300; } .pricing-quotation p, .team-info p { margin-bottom: 0px; } .pricing-plan, .team-info-wrap { position: relative; } /*------------------------------- INVOICE STYLE --------------------------------*/ .invoice-title { color: #ed6f7e; font-size: 48px; text-transform: uppercase; margin-top: 30px; } .invoice { color: #666; } .inv-logo { margin-bottom: 10px; } .invoice-address { background: #f7f7f9; padding: 20px; margin-top: 10px; margin-left: -15px; margin-right: -15px; } .inv-col { margin-bottom: 5px; } .inv-col span { color: #ed6f7e; } .t-due, .inv-label { font-size: 22px; color: #ed6f7e; } .inv-label { font-style: italic; } .amnt-value { color: #a4a4a4; font-size: 24px; margin-top: 10px; font-weight: bold; } .inv-to { text-transform: uppercase; font-size: 14px; } .corporate-id { font-weight: bold; font-size: 16px; color: #000; margin-top: 5px; text-transform: uppercase; } .table-invoice { border-top: none !important; } .table-invoice thead { background: #000; color: #fff; } .table-invoice th { border-bottom: none !important; padding: 10px 10px !important; border-color: #fff !important; } .table-invoice th:first-child, .table-invoice td:first-child { text-align: left; } .table-invoice td { vertical-align: middle !important; } .table-invoice h4 { color: #000; font-size: 14px; font-weight: bold; margin: 0 0 5px 0; } .table-invoice strong { color: #000; } .payment-method p { margin-bottom: 0; } .print-body { background: #eff0f4; } /*--------------------------- ERROR PAGE STYLES ----------------------------*/ .error-page { background: #ed6f7e; } .error-wrapper { margin-top: 15%; } .error-wrapper h2 { font-size: 64px; color: #fff; text-transform: uppercase; font-weight: bold; } .error-wrapper h3 { font-size: 32px; color: #474747; text-transform: uppercase; font-weight: bold; line-height: 30px; margin-top: 0; } .error-wrapper .nrml-txt { font-size: 18px; color: #474747; font-weight: normal; line-height: 30px; } .error-wrapper .nrml-txt a { color: #a7ffdf; } .error-wrapper .back-btn { color: #fff; border: 1px solid #fff; padding: 15px 30px; border-radius: 5px; -webkit-border-radius: 5px; text-decoration: none; display: inline-block; margin-bottom: 20px; margin-top: 50px; } .error-wrapper .back-btn:hover { background: #fff; color: #ed6f7e; border-color: #fff; } /*--------------------------------- TIMELINE STYELS ----------------------------------*/ .timeline { border-collapse: collapse; border-spacing: 0; display: table; position: relative; table-layout: fixed; width: 100%; margin-bottom: 50px; } .timeline .time-show { margin-right: -75px; margin-top: 30px; position: relative; margin-bottom: 30px; } .time-show .btn { width: 150px; } .timeline .time-show a { color: #fff; } .timeline:before { background-color: #d8d9df; bottom: 0px; content: ""; left: 50%; position: absolute; top: 30px; width: 1px; z-index: 0; } h3.timeline-title { margin: 0; color: #C8CCD7; font-size: 20px; font-weight: 400; margin: 0 0 5px; text-transform: uppercase; } .t-info { color: #C8CCD7; } .timeline-item:before, .timeline-item.alt:after { content: ""; display: block; width: 50%; } .timeline-item { display: table-row; } .timeline-desk { display: table-cell; vertical-align: top; width: 50%; } .timeline-desk h1 { font-size: 16px; font-weight: 300; margin: 0 0 5px; } .timeline-desk .panel { display: block; margin-left: 45px; position: relative; text-align: left; background: #fff; } .timeline-item .timeline-desk .arrow { border-bottom: 8px solid transparent; border-top: 8px solid transparent; display: block; height: 0; left: -7px; position: absolute; top: 50%; margin-top: -10px; width: 0; } .timeline-item .timeline-desk .arrow { border-right: 8px solid #fff !important; } .timeline-item.alt .timeline-desk .arrow-alt { border-bottom: 8px solid transparent; border-top: 8px solid transparent; display: block; height: 0; right: -7px; position: absolute; top: 50%; margin-top: -10px; width: 0; left: auto; } .timeline-item.alt .timeline-desk .arrow-alt { border-left: 8px solid #fff !important; } .timeline .timeline-icon { left: -54px; position: absolute; top: 50%; margin-top: -10px; } .timeline .timeline-icon { background: #fff; border: 1px solid #D8D9DF } .timeline-desk span a { text-transform: uppercase; } .timeline-desk h1.red, .timeline-desk span a.red { color: #EF6F66; } .timeline-desk h1.green, .timeline-desk span a.green { color: #39B6AE; } .timeline-desk h1.blue, .timeline-desk span a.blue { color: #56C9F5; } .timeline-desk h1.purple, .timeline-desk span a.purple { color: #8074C6; } .timeline-desk h1.light-green, .timeline-desk span a.light-green { color: #A8D76F; } .timeline-desk h1.yellow, .timeline-desk span a.yellow { color: #fed65a; } .timeline .timeline-icon { border-radius: 50%; -webkit-border-radius: 50%; display: block; height: 20px; width: 20px; text-align: center; color: #fff; } .timeline .timeline-icon i { margin-top: 9px; } .timeline-item.alt .timeline-icon { left: auto; right: -56px; } .timeline .time-icon:before { font-size: 16px; margin-top: 5px; } .timeline .timeline-date { left: -245px; position: absolute; text-align: right; top: 12px; width: 150px; display: none; } .timeline-item.alt .timeline-date { left: auto; right: -245px; text-align: left; display: none; } .timeline-desk h5 span { color: #999999; display: block; font-size: 12px; margin-bottom: 4px; } .timeline-item.alt:before { display: none; } .timeline-item:before, .timeline-item.alt:after { content: ""; display: block; width: 50%; } .timeline-desk p { font-size: 14px; margin-bottom: 0; color: #999; } .timeline-desk a { color: #1fb5ad; } .timeline-desk .panel { margin-bottom: 5px; } .timeline-desk .album { margin-top: 20px; } .timeline-item.alt .timeline-desk .album { margin-top: 20px; float: right; } .timeline-desk .album a { margin-right: 5px; float: left; } .timeline-item.alt .timeline-desk .album a { margin-left: 5px; float: right; } .timeline-desk .notification { background: none repeat scroll 0 0 #FFFFFF; margin-top: 20px; padding: 8px; } .timeline-item.alt .panel { margin-left: 0; margin-right: 45px; } .mbot30 { margin-bottom: 30px; } .timeline-item.alt h1, .timeline-item.alt p { text-align: right; } /*-------------------------------- PROFILE STYLE ---------------------------------*/ .profile-pic img { border: 5px solid #F1F2F7; border-radius: 50%; -webkit-border-radius: 50%; height: 150px; margin: 10px 0; width: 150px; } .profile-desk h1 { color: #49586e; font-size: 24px; font-weight: bold; margin: 0 0 5px 0; text-transform: uppercase; } .profile-desk .designation { color: #49586e; font-size: 14px; text-transform: uppercase; margin-bottom: 30px; display: inline-block; } .profile-desk p { line-height: 25px; margin-bottom: 40px; } .p-follow-btn { background: #eff0f4; color: #a4a4a4 } .p-follow-btn:hover, .btn-post { background: #ed6f7e; color: #fff } .btn-post:hover { background: #000; color: #fff } ul.p-social-link { list-style-type: none; } ul.p-social-link li { display: inline-block; } ul.p-social-link li a { background: #eff0f4; color: #bfbfc1; width: 30px; height: 30px; line-height: 30px; border-radius: 50%; -webkit-border-radius: 50%; display: inline-block; text-align: center; } ul.p-social-link li a:hover, ul.p-social-link li.active a { color: #ed6f7e; } .p-text-area, .p-text-area:focus { border: medium none; box-shadow: none; color: #C3C3C3; font-size: 16px; font-weight: 300; } .p-option li a { color: #adadad; font-size: 15px; } .p-option li a:hover { background: #ed6f7e; color: #fff; } ul.p-info { list-style-type: none; padding: 0; margin-bottom: 0; } ul.p-info li { display: inline-block; width: 100%; margin-bottom: 10px; } ul.p-info li:last-child { margin-bottom: 0; } ul.p-info .title, ul.p-info .desk { float: left; } ul.p-info .title { width: 40%; } ul.p-info .desk { width: 60%; color: #ed6f7e; } .p-states h4 { color: #535351; font-size: 14px; font-weight: bold; text-transform: uppercase; margin: 0; } .p-states h4 span { color: #bfbfbf; } .p-states h3 { color: #000; font-size: 25px; margin: 10px 0 0 0; } .p-states .chart-bar { margin-top: 20px; } .p-states.green-box { background: #ed6f7e; color: #fff; border-radius: 4px; -webkit-border-radius: 4px; } .p-states.green-box h4, .p-states.green-box h4 span, .p-states.green-box h3 { color: #fff; } ul.activity-list { list-style-type: none; padding: 0; } ul.activity-list li { display: inline-block; width: 100%; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid #eff0f4; } ul.activity-list .avatar img { float: left; width: 50px; height: 50px; border-radius: 50%; -webkit-border-radius: 50%; } ul.activity-list .activity-desk { margin-left: 70px; } ul.activity-list .activity-desk h5 { color: #000; } ul.activity-list .activity-desk h5 a { font-weight: bold; } .activity-desk .album a { float: left; margin-right: 10px; width: 170px; height: 110px; overflow: hidden; margin-bottom: 10px; } .activity-desk .album a img { width: 100%; } #map-canvas { height: 200px; width: 100%; } .revenue-graph { height: 220px; } /*-------------------------------------------- Dashboard Event Calendar, charts --------------------------------------------*/ .event-calendar { background: #1fb5ac; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; min-height: 474px; } .calendar-block { float: right !important; -webkit-border-radius: 0 5px 5px 0px; -moz-border-radius: 0 5px 5px 0px; border-radius: 0 5px 5px 0px; background: #fff; z-index: 1000; } .event-list-block { -webkit-border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px; border-radius: 5px 0px 0px 5px; } .calendar-block .day-contents { width: 30px; margin: auto; } .today .day-contents { width: 30px; background: #1fb0ab; cursor: pointer; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .calendar-block .day-contents:hover { width: 30px; background: #1fb0ab; cursor: pointer; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .cal1 .clndr .clndr-controls { -webkit-border-radius: 5px 5px 0px 0px; -moz-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; display: block !important; position: relative; margin-bottom: 10px; text-align: center; background: #51d4cc; margin-left: -15px; margin-right: -15px; margin-top: -15px; padding: 56px 20px; width: auto !important; color: #fff; } .cal1 .clndr .clndr-controls .month span { display: block; font-size: 30px; padding: 0px 10px; margin-bottom: 10px; } .cal1 .clndr .clndr-controls .month { color: #fff; } .cal1 .clndr .clndr-controls .clndr-control-button .clndr-next-button, .cal1 .clndr .clndr-controls .clndr-control-button .clndr-previous-button { color: #fff; } .cal1 .clndr .clndr-controls .clndr-control-button .clndr-next-button:hover, .cal1 .clndr .clndr-controls .clndr-control-button .clndr-previous-button:hover { background: #f4f4f4; padding: 5px 10px; color: #1fb0ab; } .clndr-previous-button { position: relative; top: -30px; } .clndr-next-button { position: relative; top: -30px; } #flotTip { background: rgba(000,000,000,.7); padding: 5px 10px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #main-chart-legend { padding: 2px 0px; } #main-chart-legend td { padding-right: 10px; } .main-chart { width: 100%; height: 300px; text-align: center; margin: 0 auto; } /*------------------------- MAIL INBOX --------------------------*/ .mail-box { border-spacing: 0; display: table; table-layout: fixed; width: 100%; height: 100%; } .mail-box > aside, .mail-box > section { display: table-cell; float: none; height: 100%; vertical-align: top; } .mail-nav { display: table-cell; float: none; height: 100%; vertical-align: top; width: 240px; } .mail-nav-bg-color { background: #d1d5e1; } .mail-box-info { background: #fff; padding: 15px; } .mail-nav h4 { margin: 0; padding: 15px; background: #5c6e8a; color: #fff; } .mail-nav-body { padding: 15px; } .mail-nav footer { background: #b8bbc5; border-top: none; margin-top: 20px; } .mail-nav footer .btn { border: none; } a.btn-compose { background: #ed6f7e; color: #fff; width: 100%; margin: 10px 0; } a:hover.btn-compose { background: #52a888; color: #fff; } .mail-navigation { margin-top: 15px; } .mail-navigation li a i { padding-right: 10px; } .mail-navigation li a { color: #5c6e8a; } .mail-navigation li a:hover { color: #fff; } .mail-navigation > li.active > a, .mail-navigation > li.active > a:hover, .mail-navigation > li.active > a:focus { background: #5c6e8a; color: #fff; } ul.labels-info li h5 { color: #fff; background: #839dc5; font-size: 15px; margin: 10px -15px; padding: 15px; text-transform: uppercase; } ul.labels-info li a { border-radius: 0; color: #707278; padding-left: 0; padding-right: 0; } ul.labels-info li a i { padding-right: 10px; } .nav.nav-pills.nav-stacked.labels-info p { color: #85888f; font-size: 11px; margin-bottom: 0; padding: 0 22px; } ul.labels-info li a:hover, ul.labels-info li a:focus { background: rgba(0, 0, 0, 0); color: #5c6e8a; } .mail-box-info { position: relative; } .mail-box-info .header { background: #D1D5E1; margin: -15px; padding: 10px 15px; color: #fff; } .mail-box-info .mail-list { margin-top: 30px; } .mail-box-info .mail-list li a { font-size: 13px; color: #535351; text-decoration: none; } .mail-box-info .mail-list li a:hover { color: #1b2128; } .mail-box-info .mail-list li a.thumb { width: 22px; margin-right: 10px; border-radius: 50%; -webkit-border-radius: 50%; } .mail-box-info .mail-list li a.thumb img { height: auto; max-width: 100%; } .mail-box-info .mail-list li .chk { margin-right: 15px; } .mail-list { overflow-x: hidden; overflow-y: auto; height: 657px; } .mail-list .list-group-item { border-radius: 0; -webkit-border-radius: 0; } .mail-box-info header h4 { margin: 5px 0; color: #5C6E8A; } .compose-mail { width: 100%; display: inline-block; position: relative; } .compose-mail .compose-options { color: #979797; cursor: pointer; display: inline-block; font-size: 14px; position: absolute; right: 10px; top: 7px; } .compose-options a { color: #5C6E8A; } .compose-mail input, .compose-mail input:focus { border: none; padding: 0; width: 80%; float: left; } .compose-mail .form-group { border: 1px solid #eaebee; display: inline-block; width: 100%; margin-bottom: 0; } .compose-mail .form-group label { line-height: 34px; width: 10%; float: left; padding-left: 10px; margin-bottom: 0; background: #eaebee; margin-right: 10px; } .compose-editor input { margin-top: 15px; } .compose-editor { margin-top: 35px; margin-bottom: 15px; display: inline-block; width: 100%; } .compose-btn { float: left; } .compose-editor textarea { border-color: #eaebee; } .mail-sender, .attachment-mail { width: 100%; display: inline-block; margin: 0 0 20px 0; border-bottom: 1px solid #E8DEDF; padding: 10px 0; } .attachment-mail ul li .links a { font-size: 11px; } .mail-sender img { width: 30px; border-radius: 3px; -webkit-border-radius: 3px; } .mail-sender .date { line-height: 30px; margin-bottom: 0; text-align: right; } .view-mail a, .attachment-mail a:hover { color: #ed6f7e; } .attachment-mail a { color: #5C6E8A; } .attachment-mail ul li { float: left; width: 100px; margin-right: 15px; margin-top: 15px; list-style: none; } .attachment-mail ul li a.atch-thumb img { width: 100px; height: auto; margin-bottom: 10px; } .attachment-mail ul li a.name span { float: right; color: #5C6E8A; font-size: 11px; } /*------------------------------------ Blog styles -------------------------------------*/ .blog h1 { font-size: 18px; text-transform: uppercase; color: #424242; font-weight: 400; margin: 0px 0 10px 0; line-height: 30px; } .blog h1 a { color: #424242; } .blog h1 a:hover, .blog h1 a:focus, .auth-row a:hover, .auth-row a:hover { color: #ed6f7e; } .blog .auth-row { color: #c8c8c8; font-weight: 300; padding-bottom: 20px; font-size: 14px; } .auth-row a { color: #C8C8C8; } .blog .blog-img-wide img { width: 100%; height: 350px; padding-bottom: 25px; } .blog-img-sm img { width: 100%; padding-bottom: 0; } .blog p { padding-bottom: 15px; font-size: 14px; } .blog a.more { margin-bottom: 10px; display: inline-block; } .blog .fa-quote-left { font-size: 20px; padding: 40px 0; color: #d3d3d3; } .blog-search, .blog-search:focus { float: left; margin-right: 10px; background: #f1f1f1; border: none; height: 35px; box-shadow: none; } .btn-search, .btn-search:hover, .btn-search:focus { background: #ed6f7e; color: #fff; } .blog-post h3 { font-size: 16px; text-transform: uppercase; color: #424242; font-weight: bold; padding-top: 0px; margin-top: 0; } .blog-post h5 a { color: #424242; text-transform: uppercase; } .blog-post h5 a:hover, .blog-post h5 a:focus, .blog-post ul li a:hover, .blog-post ul li a:focus { color: #ed6f7e; } .blog-post p { padding-bottom: 0; } .blog-post ul { padding-left: 0; margin-bottom: 0; list-style-type: none; } .blog-post ul li { line-height: 35px; color: #837f7e; } .blog-post ul li a { line-height: 35px; color: #837f7e; } .blog-post ul li i { padding-right: 10px; } .carousel-indicators li { /*background: rgba(255, 255, 255, 0.5);*/ border: none; } .carousel-indicators { margin-bottom: 10px; } blockquote { margin-left: 50px; color: #a1a1a1; font-style: italic; } blockquote p { line-height: 30px; padding-bottom: 0 !important; } .blog-tags { border-top: 1px solid #f1f1f1; margin: 30px 0 0 0; padding-top: 30px; display: inline-block; width: 100%; } .blog-tags a { background: #f1f1f1; color: #808086; padding: 5px 10px; margin-left: 8px; border-radius: 3px; -webkit-border-radius: 3px; } .tag-social ul { background: #f1f1f1; height: 35px; padding-left: 0; margin-top: -5px; border-radius: 3px; position: relative; padding: 0 10px; list-style-type: none; } .tag-social ul:after { left: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(241, 241, 241, 0); border-left-color: #f1f1f1; border-width: 5px; margin-top: -5px; } .tag-social ul li { float: left; } .tag-social ul li a { margin-top: 3px; display: inline-block; margin-left: 0; } .tag-social ul li a:hover, .blog-cmnt .media-heading a:hover, .blog-tags a:hover { color: #ed6f7e; } .blog-tags a.btn-share { background: #ed6f7e; margin-top: -10px; padding: 10px; color: #fff; text-transform: uppercase; } ol.comment-list { list-style: none; padding-left: 0; } .blog-cmnt.media > .pull-left { margin-right: 30px; } .blog-cmnt .media-heading, .blog-cmnt .media-heading a { color: #414147; font-size: 14px; text-transform: uppercase; } .blog-cmnt .media-object { width: 105px; height: 102px; border-radius: 3px; -webkit-border-radius: 3px; } .blog-cmnt .media-object-child { width: 76px; height: 72px; border-radius: 3px; -webkit-border-radius: 3px; } .blog .blog-cmnt p { font-size: 15px; line-height: 25px; padding-top: 5px; } .mp-less { margin-bottom: 0 !important; padding-bottom: 0 !important; } .blog-cmnt .media-body span { color: #808086; padding-bottom: 20px; display: inline-block; } .bl-status { float: left; width: 100%; } .bl-status .reply { background: #f1f1f1; color: #808086; padding: 5px 10px; border-radius: 4px; -webkit-border-radius: 4px; margin-top: -5px; } .bl-status .reply:hover { background: #ed6f7e; color: #fff; } .media, .media .media { margin-top: 25px; } .cmnt-head { font-size: 24px !important; } .fade-txt { color: #adadad; font-size: 14px; } .leave-cmnt { width: 70%; margin: 20px auto; } .leave-cmnt input, .leave-cmnt textarea, .leave-cmnt input:focus, .leave-cmnt textarea:focus { background: #f2f2f2; border: none; box-shadow: none; } .btn-post-cmnt { background: #ed6f7e; color: #fff; text-transform: uppercase; font-size: 12px; padding: 12px 25px; } .btn-post-cmnt:hover { background: #414147; color: #fff; } .blog-pagination li a { background: #fff; } .blog .carousel-indicators.out { bottom: 15px; } /*panel*/ .panel-title-m { margin-top: 0px; } /*-------------------------------- Directory Styles --------------------------------*/ .directory-list, .directory-info-row .social-links { list-style-type: none; padding: 0; margin: 0; } .directory-list li { border-left: 1px solid #EFF0F4; display: table-cell; width: 1%; } .directory-list li a { display: block; padding: 8px 0; text-align: center; text-transform: uppercase; background: #fff; color: #7A7676; -moz-transition: all 0.2s ease-out 0s; -webkit-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; text-decoration: none; } .directory-list li a:hover, .directory-info-row .social-links li a:hover { background: #ed6f7e; color: #fff; } .directory-info-row { display: inline-block; width: 100%; margin-top: 20px; } .directory-info-row .social-links { display: inline-block; margin-top: 10px; } .directory-info-row .social-links li { display: inline-block; } .directory-info-row .social-links li a { background: #EFF0F4; width: 30px; height: 30px; line-height: 30px; text-align: center; display: inline-block; border-radius: 50%; -webkit-border-radius: 50%; color: #7A7676; } .directory-info-row h4, .directory-info-row a { color: #424F63; } .directory-info-row .thumb { border-radius: 50%; -webkit-border-radius: 50%; margin-right: 20px; } /*------------------------------- chat styles -------------------------------*/ .chats { margin: 0; padding: 0; margin-top: -15px; margin-right: 10px; } .chats li { list-style: none; padding: 8px 0 5px; margin: 7px auto; font-size: 12px; } .chats li img.avatar { height: 45px; width: 45px; -webkit-border-radius: 50% !important; -moz-border-radius: 50% !important; border-radius: 50% !important; } .chats li.in img.avatar { float: left; margin-right: 10px; margin-top: 0px; } .chats li .name { font-size: 13px; font-weight: 400; } .chats li .datetime { color: #adadad; font-size: 13px; font-weight: 400; } .chats li.out img.avatar { float: right; margin-left: 10px; margin-top: 0px; } .chats li .message { display: block; padding: 5px; position: relative; } .chats li.in .message { text-align: left; margin-left: 65px;background-color: #f9e5ec; } .chats li.in .message .arrow { display: block; position: absolute; top: 15px; left: -8px; width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; } .chats li.out .message .arrow { display: block; position: absolute; top: 15px; right: -8px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 8px solid #EFF0F4; } .chats li.out .message { border-right: 2px solid #EFF0F4; margin-right: 65px; text-align: left;background-color: #ed6f7e; } .chats li.out .message .name{color: #fff;} .chats li.out .message .body{color: #fff;;} .chats li.out .name, .chats li.out .datetime { text-align: right; } .chats li .message .body { display: block; font-size: 18px;} .chat-form { margin-top: 15px; padding: 10px; background-color: #EFF0F4; clear: both; } .chat-form .input-cont { margin-right: 55px; } .chat-form .input-cont input { margin-bottom: 0px; } .chat-form .input-cont input { border: 1px solid #ddd; width: 94%; margin-top: 0; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; } .chat-form .input-cont input { background-color: #fff !important; } .normal-chat .message { border: 1px solid #EFF0F4; border-left: 1px solid #EFF0F4 !important; border-right: 1px solid #EFF0F4 !important; padding: 10px !important; border-radius: 5px; -webkit-border-radius: 5px; } .normal-chat li img.avatar { height: 45px; width: 45px; } .normal-chat li.in img.avatar, .normal-chat li.out img.avatar { margin-top: 0px; } .normal-chat li.in .message .arrow { border-right: 8px solid #EFF0F4 !important; } .normal-chat li.in .message .arrow { border-bottom: 8px solid transparent; border-top: 8px solid transparent; display: block; height: 0; left: -8px; position: absolute; top: 15px; width: 0; } .normal-chat li.out .message .arrow { border-left: 8px solid #EFF0F4 !important; } .normal-chat li.out .message .arrow { border-bottom: 8px solid transparent; border-top: 8px solid transparent; display: block; position: absolute; right: -8px; top: 15px; } .normal-chat li.in .name { color: #ed6f7e !important; } /* .normal-chat li.out .name { color: #424F63 !important; } */ .normal-chat li .datetime { color: #ADADAD; font-size: 11px !important; font-weight: 400; } .normal-chat li.in .datetime {margin-left: 65px;} .normal-chat li.out .datetime {margin-right: 65px;} .chat-form .form-group { width: 83%; margin-right: 2%; float: left; } .chats li.out .name { color: #333; } .cool-chat li.in .message { background: #ed6f7e; color: #fff; border-radius: 5px; -webkit-border-radius: 5px; } .cool-chat li.in .message .arrow { border-right: 8px solid #ed6f7e; } .cool-chat li.in .message a.name { font-weight: bold; } .cool-chat li.in .message .datetime { opacity: .7; } .cool-chat li.in .message a.name, .cool-chat li.in .message .datetime { color: #fff; } .cool-chat li.out .message .arrow { border-left: 8px solid #EFF0F4; } .cool-chat li.out .message { background: #EFF0F4; border-radius: 5px; -webkit-border-radius: 5px; } .make-responsive {overflow-x: scroll;overflow-y: scroll;padding-bottom: 5px;width: auto;max-height: calc(100vh - 290px);scrollbar-width: thin;} .adv-table .table thead {z-index: 5;position: sticky;top: 0;} @media(max-width:768px) { .make-responsive {overflow-x: scroll;overflow-y: scroll;padding-bottom: 5px;width: auto;max-height: calc(100vh - 290px);scrollbar-width: thin;} } /*************************************************/ /********************************/ .border-0{border: none;} .padding-0{padding: 0;} .form-horizontal .control-label { color: #2f2f2f; font-weight: 600; text-align: left;white-space: nowrap;} .active-status { color: #21b384; } .deactive-status { /*color:#C31111;*/ color: #999; } .edit-icon { color: #333; } .delete-icon { color: #C31111; } /* .dt-icons { border: 1px solid #E8DEDF; font-size: 12pt; padding: 4px 5px; color: #847f7f;border-radius: 4px;} .dt-icons:hover{ color: #ed6f7e; border: 1px solid #ed6f7e;} */ .dt-icons { /* color: #46515c; font-weight: 600; padding: 6px; width: 28px; height: 28px; display: inline-flex; justify-content: center; align-items: center; margin: 0 2px; text-decoration: none; vertical-align: top; border-radius: 6px; border: 1px solid #d7e3f7; background: #f9fbff; */ padding: 6px; color: #847f7f; width: 28px; height: 28px; display: inline-flex; justify-content: center; align-items: center; vertical-align: top; border-radius: 6px; border: 1px solid #fdd6d9; background: #f9f1f2; } .dt-icons:hover { /* color: #ed6f7e; background: #dee4ee; */ color: #ed6f7e; background-color: #f4d9dc; } /*.dt-succses { font-size: 14pt; padding: 0 2px; font-size: 12pt; padding: 4px 5px; background-color: #6bd67d; color: #fff; } .dt-succses:hover{ background-color: #028117;} .dt-danger { font-size: 14pt; padding: 0 2px; font-size: 12pt; padding: 4px 5px; background-color: #d44a50; color: #fff; } .dt-danger:hover{ background-color: #b4020b;}*/ /*-------------------------------- style-responsive Css --------------------------------*/ @media(max-width:800px) { .margin-top{margin-top:10px;} } /* MEDIA QUERIES */ @media screen and (max-width: 768px) { body { position: relative; } .left-side { display: none; } .main-content { margin-left: 0; width: 100%; } .left-side-collapsed .left-side { display: none; } .left-side-collapsed .main-content { margin-left: 0; } .left-side-collapsed .header-section { margin-left: 0; } .left-side-show section { overflow-x: hidden; } .left-side-show .left-side { display: block; } .left-side-show .main-content { margin-left: 240px; } .btn-demo { margin-bottom: 20px; } .left-sideinner { padding: 5px 10px; } .left-sideinner .searchform input { background: #fff; border: 0; } .sticky-header .header-section { left: 0; } .sticky-header.left-side-show .header-section { left: 240px; } .sticky-header .menu-right { margin-right: 15px; } .sticky-header .left-side { top: 60px; } .lock-wrapper { margin: 25% auto; } .sticky-left-side .custom-nav { margin-top: -5px; } .stepy-error { bottom: 50px; } .margin-top{margin-top:10px;} } @media screen and (max-width: 767px) { .searchform { position: relative; } .searchform input { background: #fff; } .notification-menu li:nth-child(4) { display: none; } .left-side .searchform, .left-side .logged-user { display: block; } .breadcrumb-wrapper { display: none; } .notification-menu .dropdown-menu:after { display: none; } /*calendar*/ .fc-button-inner { padding: 0; } /*media gallery*/ .media-gal .item { width: 100%; } .media-filter { margin: 25px 0; } .media-filter + .pull-right, .media-filter + .pull-right + .btn { float: left !important; } /*state info*/ .state-info { position: static; width: 100%; margin-top: 15px; } .state-info .panel { width: 100%; } .lock-wrapper { margin: 40% auto; } .pricing-table { width: 100%; margin-left: 0; } .mail-box > aside, .mail-box > section { display: block; margin-bottom: 10px; width: 100%; } .mail-list { height: auto; } } @media screen and (max-width: 640px) { } @media screen and (max-width: 480px) { /*form wizard steps*/ .widget-container .stepy-titles li, .stepy-titles li { width: 100%; } .directory-list li { display: inline-block; float: left; width: auto; } .directory-list li a { display: block; padding: 5px 10px; margin-bottom: 1px; } } @media screen and (max-width: 479px) { /*calendar*/ .fc-button-inner, .fc-button-content { padding: 0; } .fc-header-title h2 { font-size: 12px!important; } .fc .fc-header-space { padding-left: 0; } .fc-state-active, .fc-state-active .fc-button-inner, .fc-state-active, .fc-button-today .fc-button-inner, .fc-state-hover, .fc-state-hover .fc-button-inner { background: none repeat scroll 0 0 #FFFFFF !important; color: #32323A !important; } .fc-state-default, .fc-state-default .fc-button-inner { background: none repeat scroll 0 0 #FFFFFF !important; } .error-wrapper h1 img { width: 100%; } /*form wizard steps*/ .widget-container .stepy-titles li, .stepy-titles li { width: 100%; } .directory-list li { display: inline-block; float: left; width: auto; } .directory-list li a { display: block; padding: 5px 10px; margin-bottom: 1px; } .margin-top{margin-top:10px;} } @media screen and (max-width: 360px) { .notification-menu li:first-child .dropdown-menu { margin-right: -90px; } .notification-menu li:nth-child(2) .dropdown-menu { margin-right: -45px; } .notification-menu li:nth-child(3) .dropdown-menu { margin-right: 0px; } .nav-tabs.nav-justified.nav-profile > li { float: none; display: block; width: auto; } .lock-wrapper { margin: 40% auto; max-width: 300px; } .lock-wrapper input, .lock-wrapper input:focus { width: 80% !important; } .lock-wrapper .locked { right: 70px; } } @media screen and (max-width: 320px) { .lock-wrapper { margin: 40% auto; max-width: 300px; } .lock-wrapper input, .lock-wrapper input:focus { width: 80% !important; } .lock-wrapper .locked { right: 70px; } .media-filter li { margin-bottom: 10px; display: inline-block; } .media-filter + .btn-group .btn { margin-bottom: 5px; } } @media(max-width:990px) { .m_search{width:275px;} } /*****************/ .modal-header { background-color: #c14b59; display: flex; justify-content: space-between; align-items: center; } .modal-title{font-size: 18px;} .notification-menu .dropdown-toggle { padding: 0 0 0 0; margin: 10px 0 0 0; } .notification-menu .dropdown-toggle img { max-width: 45px!important; max-height: 35px!important; } /*****************************************/ /***************************/ .btn-primary { background-color: #ed6f7e; border-color: #0173b2; color: #ffffff; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary { background-color: transparent; border-color: #ed6f7e; color: #ed6f7e; } img { max-width: 100%; } /*****************************************/ /***************************/ .fixed-logo { background: url(../images/fixed-logo.png) no-repeat; height: 105px; width: 206px; position: fixed; z-index: 50000; right: 20px; bottom: -20px; opacity: 0.5; } .fixed-logo:hover { opacity: 1; } .fixed-logo { background-size: 195px auto; z-index: 110; display:none; } .ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all { z-index: 115 !important; } .grayBox { position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background:rgba(255,255,255,0.5); /*background: #fff;*/ z-index: 1000; } /*****************************************/ /***************************/ /*-------------------------- TAB STYLES ---------------------------*/ .r-tabs .r-tabs-nav { margin: -31px 0 0 -1px; padding: 0; } .r-tabs .r-tabs-tab { display: inline-block; list-style: none outside none; margin: 0 6px 0 0; } .r-tabs .r-tabs-panel { display: none; padding: 15px; } .r-tabs .r-tabs-accordion-title { display: none; } .r-tabs .r-tabs-panel.r-tabs-state-active { display: block; } .r-tabs { border: 1px solid #999; border-radius: 4px; margin: 0 auto; position: relative; } .r-tabs .r-tabs-nav .r-tabs-tab { position: relative; } .r-tabs .r-tabs-nav .r-tabs-anchor { color: #000; display: inline-block; font-size: 14px; font-weight: normal; padding: 0 12px; text-decoration: none; } .r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor { border-top-left-radius: 4px; border-top-right-radius: 4px; color: #000; text-shadow: none; } .r-tabs .r-tabs-panel { background-color: white; border-bottom: 4px solid white; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .r-tabs .r-tabs-accordion-title .r-tabs-anchor { background: none repeat scroll 0 0 #e0e0e0; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #000; display: block; font-size: 14px; font-weight: normal; padding: 10px; text-decoration: none; text-shadow: 0 1px rgba(0, 0, 0, 0.4); } .r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor { background-color: #fff; color: #000; text-shadow: none; } ul.tabs { float: left; height: 32px; list-style: none outside none; margin: 0; padding: 0; width: 100%; } ul.tabs li { background: none repeat scroll 0 0 #e0e0e0; border: 1px solid #999; border-top-left-radius: 8px; border-top-right-radius: 8px; float: left; height: 31px; line-height: 31px; margin: 0 5px -1px 0; overflow: hidden; padding: 0; position: relative; } ul.tabs li a { border: 1px solid #fff; border-top-left-radius: 8px; border-top-right-radius: 8px; color: #000; display: block; font-size: 1.2em; outline: medium none; padding: 0 20px; text-decoration: none; } ul.tabs li a:hover { background: none repeat scroll 0 0 #ccc; } html ul.tabs li.active, html ul.tabs li.active a:hover { background: none repeat scroll 0 0 #fff !important; border-bottom: 1px solid #fff; } .tabContainer { background: none repeat scroll 0 0 #fff; border: 1px solid #999; border-radius: 0 8px 8px; clear: both; float: left; overflow: hidden; width: 100%; } .tabContent { font-size: 1.2em; padding: 20px; } .tabContent { overflow-x: scroll !important; } @media only screen and (max-width: 768px) { .r-tabs .r-tabs-nav { display: none; } .r-tabs .r-tabs-accordion-title { display: block; } } /*-------------------------- New Paginations ---------------------------*/ .new-pagination { clear:both; padding:10px 0; } .new-pagination, .new-pagination span, .new-pagination a { text-align:left; font-size:14px!important; transition: all 0.3s; } .new-pagination .paginate_active { font-size:15px!important ; transition: all 0.3s; background:#ed6f7e; color:#fff; border-color:#032539; } .new-pagination .paginate_button { border:1px solid #ddd; display:inline-block; margin:0 1px; } .new-pagination .paginate_button a { padding:5px 10px; display:inline-block; color:#797979; text-decoration:none; } .new-pagination .paginate_button:hover { transition: all 0.3s; background:#ed6f7e; color:#fff; border-color:#032539; } .new-pagination .paginate_button:hover a { color:#fff; } .new-pagination .paginate_active { border:1px solid #ddd; display:inline-block; margin:0 1px; padding:5px 10px; } .btn {display: inline-block;margin-bottom: 0;font-weight: 400;text-align: center;vertical-align: middle;transition: all .3s ease-in-out;cursor: pointer;background-image: none;border: 1px solid transparent;white-space: nowrap;padding: 8px 16px;font-size: 13px;letter-spacing: 0.2px;line-height: 1.42857143;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;border-radius: 4px;} .btn-default {background-color: #fff;color: #303e5c;border: 1px solid #c6ccdb;} .btn-default:hover, .btn-default:focus {background-color: #dee4ee;color: #303e5c;border: 1px solid #c6ccdb;} .form-control {padding:2px 10px; border: solid 1px #e8dedf; background-color: #fcfcfc; -webkit-transition: box-shadow 0.3s, border 0.3s; -moz-transition: box-shadow 0.3s, border 0.3s; -o-transition: box-shadow 0.3s, border 0.3s; transition: box-shadow 0.3s, border 0.3s; height: 44px; } #reportrange{ background: #F8F6F6; cursor: pointer; padding: 7px 6px; border: 1px solid #e8dedf; width: 100%; min-width: 285px;border-radius: 4px; } #reportrange img{ width:16px; margin-left:10px; margin-top:-3px; } .form-control:focus{ border: solid 1px #E8DEDF; border-radius: 0px !important ; /* -webkit-box-shadow: 0 0 5px 1px #ffc7cd; -moz-box-shadow: 0 0 5px 1px #ffc7cd; box-shadow: 0 0 5px 1px #ffc7cd; */ } .iti{width: 100%;} input[type="text"], select, input[type="password"], input[type="tel"]{ /* padding: 10px; border: solid 1px gainsboro; border-radius: 0px !important ; */ /* -webkit-transition: box-shadow 0.3s, border 0.3s; -moz-transition: box-shadow 0.3s, border 0.3s; -o-transition: box-shadow 0.3s, border 0.3s; transition: box-shadow 0.3s, border 0.3s; */ } input[type="text"]:focus, input[type="text"].focus { border: solid 1px #ffc7cd; border-radius: 0px !important ; /* -webkit-box-shadow: 0 0 5px 1px #ffc7cd; -moz-box-shadow: 0 0 5px 1px #ffc7cd; box-shadow: 0 0 5px 1px #ffc7cd; */ } .no-gutter { margin-right: 0; margin-left: 0; } .no-gutter > [class*="col-"] { padding-right: 0; padding-left: 0; } .no-gutter-5 { margin-right: -5px; margin-left: -5px; } .no-gutter-5 > [class*="col-"] { padding-right: 5px; padding-left: 5px; } .no-gutter > [class*="col-"] { padding-right: 0; padding-left: 0; } .btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) { margin-right: 2px; } .alert-modal{padding: 0px;} .alert-modal h5{color: #000; font-size: 18px;line-height: 30px;margin: 15px 0px;padding: 20px;} .alert-modal .btn{padding: 15px;border-radius: 0;} .alert{padding: 8px;} .setting-box {border-radius: 3px;width: 100%;background-color: #fbe6e9;height: 50%;overflow-x: auto;columns: 3;break-inside: avoid;scrollbar-width: thin;} .setting-box .item{box-sizing: border-box;break-inside: avoid;margin-bottom: 15px;} .setting-megamenu .dropdown-menu .menu-box ul li a.active { background: #EFF7FF; color: #007df2; } .setting-megamenu{position: static !important;} .setting-megamenu .dropdown-menu{position: absolute;left: 0;right: 0;width: auto;padding: 0px;border: 1.8px solid #E9EBEF; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;opacity: 0;background-color: rgba(0,0,0,0.5);} .setting-megamenu.open .dropdown-menu{display: block !important;opacity: 1; height: 100vh;width: calc(100% - 60px) !important;margin: 0;} .setting-megamenu .dropdown-toggle:hover.dropdown-menu{display: block !important;} .setting-megamenu .dropdown-menu .menu-box{padding: 20px 15px 15px 70px; position: relative;} .setting-megamenu .dropdown-menu .menu-box h3 {margin-top: 0;padding: 0px 10px 0px;font-size: 18px;color: #ed6f7e;font-weight: 500;text-align: left;font-family: 'Inter';} .setting-megamenu .dropdown-menu .menu-box .icon-box{position: absolute;padding: 14px 2px;width: 45px;height: 45px;left: 15px;top: 20px;border-radius: 7px;display: flex;justify-content: center;align-items: center;} .setting-megamenu .dropdown-menu .menu-box .icon-box {font-size: 18px;color: #ed6f7e;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxone{background: rgba(249, 115, 213, 0.2) !important;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxone img{position: absolute;width: 24px;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxtwo{background: rgba(30, 136, 253, 0.2) !important;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxtwo img{position: absolute;width: 24px;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxthree{background: rgba(255, 130, 85, 0.2) !important;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxthree img{position: absolute;width: 24px;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxfour{background: rgba(237, 111, 126, 0.2) !important;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxfour img{position: absolute;width:24px;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxfive{background: rgba(89, 196, 241, 0.2) !important;} .setting-megamenu .dropdown-menu .menu-box .icon-box.boxfive img{position: absolute;width: 24px;} .setting-megamenu .dropdown-menu .menu-box ul{padding: 0px;} .setting-megamenu .dropdown-menu .menu-box ul li{padding: 0px;float: none !important;list-style: none;} .setting-megamenu .dropdown-menu .menu-box ul li a{display: block;text-decoration: none;border-radius: 5px;padding: 4px 10px !important; font-size: 15px !important; -webkit-transition: all 1s;transition: all 1s;text-align: left;color: #484848;} .setting-megamenu .dropdown-menu .menu-box ul li a:hover{background: rgba(237, 111, 126, 0.2); color: #ed6f7e;} .setting-megamenu .dropdown-menu .menu-box ul li a.active{background: rgba(237, 111, 126, 0.2); color: #ed6f7e;} .component-box{border-radius: 12px;padding: 10px 10px;margin: 0px 10px 10px 0px;display: flex;align-items: center;min-height: 110px;} .component-box.box1{background: linear-gradient(271.37deg, #e75886 0%, #ed6f7e 100%);box-shadow: 0px 10px 30px rgba(234, 91, 137, 0.25);} .component-box.box2{background: linear-gradient(271.37deg, #F18BAB 0%, #ed6f7e 100%);box-shadow: 0px 10px 30px rgba(234, 91, 137, 0.25);} .component-box .content h3{font-size: 25px;font-weight: 600;margin: 0 0 6px;} .component-box .content h3 .number{color: #fff;} .component-box .content .top-content{font-size: 15px;color: #fff;margin-bottom:10px;} .component-box .content .pending-labels{display: flex;justify-content: space-between;align-items: center;} .component-box .content .pending-labels .label-name{font-size: 15px;color: #fff;margin-bottom:0;padding-right: 10px;} .component-box .content .pending-labels .label-name a{color: #fff;} /* Dashboard page invitation table css */ .invitation-table-main .scrollable-table{max-height: 480px;overflow-y: auto;display: block;width: 100%;overflow-x: hidden;scrollbar-width: thin;} .invitation-table-main tr {display: table;width: 100%;} /* .invitation-table-main .scrollable-table tr td{width: 50%;white-space: nowrap;} */ .invitation-table-main .scrollable-table tr td{white-space: nowrap;width: 220px;} .invitation-table-main .display{margin: 0;margin-bottom: 0px;clear: both;width: auto;} /* ############################################################################ Pickup Schedule page design ################################################################################ */ .pickup-row{display: flex;flex-wrap: wrap;} .pickup-schedule-box{box-shadow: 0px 0px 30px rgba(167, 167, 167, 0.2);padding: 15px;border-radius: 6px;min-height: 400px;margin-bottom: 12px;min-width: 380px;} .pickup-schedule-box .pnr-no{font-size: 15px;color: #555;margin-bottom: 0;} .pickup-schedule-box .detail-box{display: flex; justify-content: space-between;align-items: center;margin-bottom: 10px;} .pickup-schedule-box .detail-box .name{font-size: 18px;font-weight: 500;margin: 0;color: #212121;font-family: "inter", sans-serif;} .pickup-schedule-box .detail-box .numberof-person {background-color: #ed6f7e; color: #fff; font-size: 22px; font-weight: 600; padding: 7px 0px; border-radius: 50px;width: 36px;height: 36px;text-align: center;} .pickup-schedule-box .info-detail{padding-left: 0;list-style: none;} .pickup-schedule-box .info-detail li {position: relative;padding-left: 26px;font-size: 13px;color: #555;margin-bottom: 10px;} .pickup-schedule-box .info-detail li:last-child{margin-bottom: 0;} .pickup-schedule-box .info-detail li img{position: absolute;left: 0;top: 2px;} .pickup-schedule-box .information-list{padding-left: 0;list-style: none;display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;margin-bottom: 0;background-color: #fef5f9;padding: 8px 16px;border-radius: 6px;} .pickup-schedule-box .information-list li {font-size: 13px;color: #555;margin-bottom: 10px;padding-right: 5px;} .pickup-schedule-box .assign-btn {background-color: #f8e5ee;color: #c14b59;transition: all .2s ease-in-out;} .pickup-schedule-box .assign-btn:hover{background-color: #c14b59;color: #fff;} .pickup-schedule-list{display: flex;align-items: start;flex-wrap: wrap;gap: 10px;} .pickup-schedule-list .schedule-list-box{display: flex; align-items: center; flex: 1; box-shadow: 0 2px 4px rgba(0,0,0,.1); border: 1px solid #E8DEDF; flex-wrap: wrap; min-width: 20%; border-radius: 16px; } .p15{padding: 15px;} .input-group-addon{background-color: transparent; border: 1px solid #e8dedf;} .no-gutter { margin-right: 0; margin-left: 0; } .no-gutter > [class*="col-"] { padding-right: 0; padding-left: 0; } .payroll-widget{margin: 5px 5px;min-height: 110px;display: flex;} .payroll-widget .panel-body{padding:5px 15px;display: flex;justify-content: flex-start;align-items: center;width: 100%; border-radius: 4px;} .payroll-widget .title{color: #2f2f2f; font-size: 14px; font-style: normal; font-weight: 400; margin-bottom: 5px; font-family: "Inter", sans-serif;} .payroll-widget .number{color: #2f2f2f; font-size: 20px; font-style: normal; font-weight: 700; margin: 0px 0; text-transform: uppercase; line-height: 34px;} .payroll-widget .number a{color: #212121;} .payroll-dash-icon{width: 55px;height: 55px;min-width: 55px; border-radius: 50%;display: flex;justify-content: center;align-items: center;margin-right: 15px;} .payroll-dash-icon img{width: 28px;} .payroll-dash-icon.red{background: #F35B5F;box-shadow: 0px 3.7228317260742188px 23.267698287963867px rgba(255, 76, 81, 0.25);} .payroll-dash-icon.orange{background: #FA8D66;box-shadow: 0px 4.006295680999756px 25.039350509643555px rgba(255, 149, 111, 0.25);} .payroll-dash-icon.blue{background: #1BA3E7;box-shadow: 0px 3.7228317260742188px 23.267698287963867px rgba(32, 171, 240, 0.25);} .payroll-dash-icon.green{background: #F39D1B;box-shadow: 0px 3.7228317260742188px 23.267698287963867px rgba(243, 157, 27, 0.25);} .payroll-dash-icon.yellow{background: #56BAD9;box-shadow: 0px 3.7228317260742188px 23.267698287963867px rgba(86, 186, 217, 0.25);} .payroll-dash-icon.rating{background: #E7C253;box-shadow: 0px 3.7228317260742188px 23.267698287963867px rgba(231, 194, 83, 0.25);} .payroll-dash-icon.pink{background: #28AB60; box-shadow: 0px 4.925036907196045px 30.78148078918457px 0px rgba(46, 169, 99, 0.25);} .payroll-dash-icon.purple{background: #9E68FF; box-shadow: 0px 4.006295680999756px 25.039350509643555px rgba(145, 85, 253, 0.25);} /* Light background variants */ .bg-red-light {background: #FFE8E8;} .bg-orange-light {background: #FFF2E6;} .bg-blue-light {background: #E6F6FF;} .bg-green-light {background: #FFF7E6;} .bg-yellow-light {background: #E6F8FF;} .bg-rating-light {background: #FFF9E6;} .bg-pink-light {background: #E6FFF0;} .bg-purple-light {background: #F3EDFF;} .pending-labels{display: flex; justify-content: end; padding: 0px 0px 0px 5px; margin: 0 0 0 10px !important; border-left: 1px solid #ccc;} .pending-labels .label-name a{color: #212121;} .pending-labels p{margin-bottom: 5px;} .filter-main{display: flex; justify-content: space-between; width: 100%; border-bottom: 1px solid #E7E8EA; margin-bottom: 10px; padding-bottom: 5px;align-items: center;} .filter-main .right{display: flex;align-items: flex-start;justify-content: space-between;} .filter-main .btn-group{display: flex;} .filter-box{display: flex;flex-wrap: wrap;padding: 0;margin: 0px;align-items: center;} .filter-box li .search-inline { position:relative } .filter-box li .search-inline input { padding-left:30px } .filter-box li .search-inline .search-icon { position:absolute; top:10px; left:10px; width:15px; height:15px; cursor:pointer; z-index:1 } .filter-box li h4{font-size: 18px; padding: 0; margin: 0;} .filter-box li{list-style: none;padding-right: 15px;margin-bottom: 10px;} .filter-box li .input-append .add-on{margin-top: -36px;} .filter-box li .title{margin: 0;font-size: 18px;padding: 0;} .filter-box li .new-selectbox-options { border: 1px solid #fff; width: 150px; box-shadow: 0px 10px 30px rgba(22, 132, 253, 0.25);} .filter-box li .custom-date-range{border-radius: 7px;width: 285px;} .filter-box li .custom-date-range .input-group-addon{background-color: #fff;} .filter-box li .custom-date-range .form-control{background-color: #fff;} .filter-box li .reset-btn{left: 8px;top: 12px;width: 12px;} .filter-box li .form-control{background-color: #F8F6F6; color: #2f2f2f; padding: 5px 9px; max-width: 200px; height: calc(2.1em + .75rem + 0px) !important; font-size: 14px !important; border-radius: 6px; } .filter-box li .new-selectbox {border-radius: 4px;display: inline-block; outline: medium none; padding: 4px 23px 3px 12px; position: relative; text-align: left; text-decoration: none; vertical-align: middle; width: 100%; font: 13px/26px Inter, sans-serif; color: #4C4C4C; min-height: 17px; cursor: pointer; margin-top: 12px; background-color: #fff; } .filter-box li .search-inline{position: relative;} .filter-box li .search-inline .btn-primary{padding: 0px 11px; position: absolute; right: 7px; top: 5px; min-height: 25px; height: 28px;} .filter-box li .input-group .input-group-text{background-color: #fff;border: 1px solid #e9ebef;padding: 4px 4px;} .filter-box li .btn{min-height: 35px; line-height: 18px; padding: 8px 12px;} .filter-box li .btn img{transition: all .3s ease-in-out;} .filter-box li .btn:hover img{filter: brightness(0) saturate(100%)} .filter-box li .chosen-container-multi .chosen-choices {padding: 3px 15px; min-height: 30px;} .select2-selection__rendered li{margin-bottom: 0px;} .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #fce7e9; border: 1px solid #fce7e9; border-radius: 4px; color: #ed6f7e; cursor: default; float: left; margin-right: 4px; margin-top: 1px; padding: 0 5px;} .select2-container .select2-selection--multiple{min-height: 36px !important; border-radius: 4px; border: 1px solid #e8dedf;} .modal-header .close{opacity: 1;background-color: #fbe3e4;border-radius: 50px;height: 30px;width: 30px;color: #ed6f7e;} .modal-header .close span{color: #ed6f7e;font-size: 26px;font-weight: 400;} .driver-box{padding: 15px; background-color: #fbe6e9; border: 1px solid #ed6f7e; border-radius: 10px;} /* --- Task Detail Modal Custom Styles --- */ .status-select {border: none;border-radius: 16px !important;padding: 5px 15px;font-weight: 400;font-size: 13px;cursor: pointer;background-color: #f0f0f0;color: #666;} .status-pending {background-color: #F0F0F5;color: #7A7A9D;} .status-assigned {background-color: #E8F0FE;color: #3A6BC8;} .status-inprogress {background-color: #DDF1FC;color: #1BA3E7;} .status-completed {background-color: #D9ECD9;color: #008000;} .status-hold {background-color: #FBECCC;color: #C38410;} .status-cancelled {background-color: #FDECEA;color: #D32F2F;} .status-select:focus {outline: none;} /* Priority flag styles */ /* Custom priority flag dropdown styles */ .priority-flag-dropdown {position: relative;display: inline-block;} .priority-flag-btn {background: none;border: none;cursor: pointer;padding: 0;outline: none;} .priority-flag-single {font-size: 14px;transition: color 0.2s;} .priority-flag-menu {display: none; position: absolute; left: 0;top: 25px; background: #fff;border-radius: 8px;box-shadow: 0 2px 8px rgba(0,0,0,0.08); min-width: 160px; z-index: 4; padding: 6px 0;} .priority-flag-dropdown.open .priority-flag-menu { display: block;} .priority-flag-menu-item {display: flex; align-items: center; justify-content: flex-start;padding: 4px 16px 4px 10px;cursor: pointer;font-size: 13px; background: none;border: none; width: 100%; transition: background 0.15s;line-height: 22px;} .priority-flag-menu-item:hover { background: #f5f5f5;} .priority-flag-menu-item .fa.fa-flag{margin-right: 5px;} .flag-high { color: #e74c3c; } .flag-medium { color: #f1c40f; } .flag-low { color: #93989D; } .flag-clear { color: #34495e; } /* Group By Dropdown Styles */ .groupby-dropdown { position: relative; display: inline-block;} .groupby-btn {display: flex; align-items: center;gap: 6px;background: #fff; border: 1px solid #E9EBEF;padding: 6px 14px 6px 10px;font-size: 15px;font-weight: 400;color: #2F2F2F;cursor: pointer;transition: border 0.15s;outline: none;} .groupby-icon {height: 18px;} .groupby-caret .fa-chevron-down{font-size: 10px;} .groupby-menu {display: none;position: absolute;left: 0;top: 40px; min-width: 150px; background: #fff;border-radius: 2px;box-shadow: 0 0 10px 0 rgba(0,0,0,10%);z-index: 20;padding: 8px 0;} .groupby-dropdown.open .groupby-menu {display: block;} .groupby-menu-item {padding: 6px 15px;font-size: 14px;color: #2f2f2f;cursor: pointer;transition: background 0.13s;} .groupby-menu-item:hover { background: #f5f5f5;} #taskDetailModal .modal-dialog {max-width: 1400px;width: 100%;margin: 30px auto;} #taskDetailModal .modal-content { border-radius: 10px; border: none; padding: 0; background: #fff; min-height: 600px; } #taskDetailModal .modal-header {border: none;padding: 6px 15px;display: flex;align-items: center;justify-content: space-between;background: #fff;border-bottom: 1px solid #E8EAED;} #taskDetailModal .modal-title {font-size: 20px;font-weight: 600;margin-bottom: 8px;line-height: 28px;color: #2f2f2f;} #taskDetailModal .volunteer-name{font-size: 12px;color: #495057;margin: 0;} #taskDetailModal .volunteer-detail{display: flex;justify-content: space-between;align-items: center;} #taskDetailModal .task-modal-left {padding-right: 15px; border-right: 2px solid #DFDFDF;margin-right: 15px;} #taskDetailModal .task-modal-right {background: #FBFBFC;border: 1px solid #E8EAED;padding: 15px;} #taskDetailModal .task-meta-row {display: flex;align-items: center;margin-bottom: 20px;padding: 8px 10px;background-color: #F6F7F8;justify-content: space-between;} #taskDetailModal .task-meta-row .meta-block {flex: 1;border-left: 2px solid #E1E3E5;padding-left: 8px;} #taskDetailModal .meta-label {font-size: 12px;color: #6D7278;margin-bottom: 2px;line-height: 18px;} #taskDetailModal .meta-value {font-size: 13px;color: #2F2F2F;line-height: 18px;} #taskDetailModal .volunteer-avatar {width: 30px;height: 30px;border-radius: 50%;object-fit: cover;} #taskDetailModal .desc-label {font-size: 15px;font-weight: 500;margin: 0 0 10px;color: #495057;} #taskDetailModal .desc-toolbar {display: flex;align-items: center;gap: 8px;padding: 8px 0 8px 0;border: 1px solid #ededed;border-bottom: none;border-radius: 6px 6px 0 0;background: #fff;padding-left: 12px;} #taskDetailModal .desc-toolbar select, #taskDetailModal .desc-toolbar button {border: none;background: none;font-size: 15px;color: #222;margin-right: 2px; cursor: pointer;padding: 3px 6px;border-radius: 4px;transition: background 0.13s;} #taskDetailModal .desc-toolbar button:hover, #taskDetailModal .desc-toolbar select:hover {background: #f0f0f0;} #taskDetailModal .desc-area {width: 100%;min-height: 70px; border: none; background: #f9f9f9; border-radius: 0 0 6px 6px; padding: 16px 14px; font-size: 15px; color: #444; margin-bottom: 0; resize: vertical;} #taskDetailModal .desc-area {border: 1px solid #ededed;border-top: none;} #taskDetailModal .modal-footer {border: none;padding: 0;display: flex;align-items: center;} #taskDetailModal .photos-label {font-size: 15px;font-weight: 500;margin: 30px 0 15px 0;color: #495057;display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #E8EAED; margin-bottom: 15px;padding-bottom: 15px;} #taskDetailModal .photos-label .btn-primary:hover img{filter: invert(63%) sepia(75%) saturate(2092%) hue-rotate(309deg) brightness(96%) contrast(93%);} #taskDetailModal .owl-nav .owl-prev {position: absolute;left: -10px;top: 45%;transition: all .3s ease-in-out;width: 28px;height: 28px;background-color: #fff; -webkit-box-shadow: 0px 0px 14.03px 0px rgba(0,0,0,.1); -moz-box-shadow: 0px 0px 14.03px 0px rgba(0,0,0,.1); border-radius: 50% !important; box-shadow: 0 0 14.03px #0000001a;} #taskDetailModal .owl-nav .owl-prev span{font-size: 24px;} #taskDetailModal .owl-nav .owl-prev:hover{background-color: #ed6f7e;} #taskDetailModal .owl-nav .owl-next {position: absolute;right: -10px;top: 45%;transition: all .3s ease-in-out; width: 28px;height: 28px;background-color: #fff; -webkit-box-shadow: 0px 0px 14.03px 0px rgba(0,0,0,.1); -moz-box-shadow: 0px 0px 14.03px 0px rgba(0,0,0,.1); border-radius: 50% !important; box-shadow: 0 0 14.03px #0000001a;} #taskDetailModal .owl-nav .owl-next span{font-size: 24px;} #taskDetailModal .owl-nav .owl-next:hover{background-color: #ed6f7e;} #taskDetailModal .photo-card {background: #fff;width: 100%;min-width: 275px;max-width: 275px;overflow: hidden;box-shadow: 0 0 14px 0 rgba(0,0,0,10%);} #taskDetailModal .photo-card .attach-content{padding: 10px;display: flex;justify-content: space-between;align-items: flex-start;} #taskDetailModal .photo-card .attach-content .photo-title {font-size: 13px;color: #495057;margin: 0;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 230px;} #taskDetailModal .photo-card .attach-content .photo-date {font-size: 10px;color: #9E9E9E;margin: 0;} #taskDetailModal .photo-card .attach-img {width: 100%;height: 130px;background: #E8F0F9;display: flex;justify-content: center;align-items: center;} #taskDetailModal .photo-card .attach-img .file-icon{width: auto;margin: 0 auto;height: 70px;} #taskDetailModal .photo-card .attach-img .card-img{display: block; width: 100%;height: 130px; object-fit: cover;} #taskDetailModal .owl-carousel .owl-stage-outer{padding: 0 0 15px;} #taskDetailModal .notes-label {font-size: 15px;font-weight: 500;margin-bottom: 15px;color: #495057;padding-bottom: 15px;border-bottom: 1px solid #f0f0f0;} #taskDetailModal .notes-list {margin-bottom: 15px;border-bottom: 1px solid #E8EAED;padding-bottom: 15px;padding-left: 0;list-style: none;} #taskDetailModal .notes-list .note-item {background: #fff;border: 1px solid #E8EAED;border-radius: 3px;padding: 12px;margin-bottom: 10px;} #taskDetailModal .notes-list .note-item .user-detail{padding-left: 40px;position: relative;margin-bottom: 5px;} #taskDetailModal .notes-list .note-item:last-child{margin-bottom: 0;} #taskDetailModal .note-item .note-avatar { width: 32px;height: 32px;border-radius: 50%;object-fit: cover;position: absolute;left: 0;top: 0;} #taskDetailModal .note-item .note-author {font-size: 13px; color: #495057; margin-bottom: 0; line-height: 20px;} #taskDetailModal .note-item .note-date {font-size: 11px;color: #9E9E9E;} #taskDetailModal .note-item .note-text {font-size: 13px; color: #495057;margin: 0;} #taskDetailModal .note-input-row {display: flex; align-items: center;gap: 10px;margin-top: 8px;} #taskDetailModal .btn-send-note {background: #ED6F7E;border: none;border-radius: 50%;width: 42px;height: 42px;display: flex;align-items: center;justify-content: center;transition: background 0.13s;min-width: 42px;} #taskDetailModal .btn-send-note:hover { background: #e95c6b;} /* Add this to your style.css file */ .deliver-box .delivery-details-row{align-items: flex-start;} .delivery-details-card {background: #FAFBFB;border: 1px solid #E8EAED;border-radius: 3px;margin-bottom: 20px;padding: 15px 10px 0;} .delivery-details-header {font-size: 15px;font-weight: 500;color: #495057;padding-bottom: 15px;border-bottom: 1px solid #f0f0f0;display: flex;align-items: center;justify-content: space-between;} .delivery-details-toggle {cursor: pointer;background: none;border: none;outline: none;padding: 0;} .delivery-details-body {margin: 15px 0 0;padding: 0 0 15px;} .delivery-details-row {display: flex;align-items: flex-start; margin-bottom: 10px;} .delivery-details-label {min-width: 165px;color: #6B7280; display: flex; align-items: center; gap: 5px; font-size: 13px;} .delivery-details-value {color: #2F2F2F;font-weight: 400;line-height: 22px;font-size: 13px;} input[type=checkbox] {position: relative;border: 2px solid #8A8A8A;border-radius: 5px;background: none;cursor: pointer;line-height: 0; margin: 0 .6em 0 0;outline: 0;padding: 0 !important;vertical-align: sub;height: 22px;width: 22px;-webkit-appearance: none;opacity: .5;} input[type=checkbox]:checked {background-color: #ED6F7E;opacity: 1;border-color: #ED6F7E;} input[type="checkbox"]::before {content: "";position: absolute;right: 15%;top: 24%;z-index: 2;width: 11px;height: 6px;border-bottom: solid 2px #fff;border-left: solid 2px #fff;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);} /* input[type="checkbox"]:checked + label{color: #2F2F2F;} */ /* active_deactive button */ .active_deactive {height:25px;position: relative;width: 200px;margin: 0;} .active_deactive input {display: none;} .active_deactive .slider {background-color: #d52f39;bottom: 0;cursor: pointer;left: 0;position: absolute;right: 0;top: 0;transition: all 0.4s ease 0s;} .active_deactive .slider::after {content: "Delivered to other person"; font-size: 11px; font-weight: 600; position: absolute;right: 2px;text-transform: uppercase; top: 6px; color: #fff; width: 170px; line-height: 13px; text-align: left;} .active_deactive .slider::before {background-color: #fff; bottom: 4px;content: "";height: 16px; width: 16px;left: 5px; position: absolute; transition: all 0.4s ease 0s;} .active_deactive input:checked+.slider {background-color: #1A8717;} .active_deactive input:checked+.slider::after {content: "Delivered to other person";font-size: 11px;font-weight:600;left: 10px; position: absolute; top: 7px; color: #fff; text-align: left; width: 170px; line-height: 11px;} .active_deactive input:focus+.slider {box-shadow: 0 0 1px #1A8717;} .active_deactive input:checked+.slider::before {transform: translateX(175px);} .active_deactive .slider.round {border-radius: 2px;} .active_deactive .slider.round::before {border-radius: 2px;} /* Stronger/darker backdrop for stacked modal */ .modal-backdrop.stacked-backdrop {z-index: 1061 !important;background: rgba(0,0,0,0.75) !important;opacity: .8;} #VolunteerModal {z-index: 1062 !important;} #EditDocumentModal {z-index: 1062 !important;} .delivery-other-person-form {background: #fff;border: 1px solid #E8EAED;border-radius: 3px;padding: 10px;margin-top: 10px;} .delivery-other-person-form .delivery-details-row {margin-bottom: 12px;align-items: center;} .delivery-details-actions {margin-top: 10px;display: flex;justify-content: end; gap: 10px;} .task-modal-main{padding: 0 15px;} .task-modal-main .row > div{padding-left: 0;padding-right: 0;} .close-modal{background: none;border: none;outline: none;} .edit-btn{background: none;border: none;outline: none;cursor: pointer;} /* Volunteer Select Dropdown Styles */ .volunteer-select-dropdown { position: relative; display: inline-block; } .volunteer-select-btn {background: none;outline: none;border: none;padding: 0;display:flex;align-items:center;} .volunteer-select-btn .volunteer-avatar {height:30px !important;width:30px !important;border-radius:50% !important;border:2px solid #e8b4c0;object-fit:cover;} .volunteer-select-btn .volunteer-select-label { flex: 1; color: #222; font-size: 15px; font-weight: 500; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .volunteer-select-btn .volunteer-select-arrow { margin-left: 8px; width: 18px; height: 18px; opacity: 0.7; } .volunteer-select-menu {display: none;position: absolute;top: auto;left: 0;min-width: 220px;background: #fff;border-radius: 10px;box-shadow: 0 8px 28px rgba(0,0,0,0.13);z-index: 1002;padding: 0;max-height: 300px;overflow-y: auto;scrollbar-width: thin;border: 1px solid #f0d6db;} .volunteer-select-dropdown.open .volunteer-select-menu {display: block;} .vol-dropdown-header {padding: 9px 12px 7px 12px;font-size: 11px;font-weight: 600;color: #b94a6f;letter-spacing: 0.6px;text-transform: uppercase;border-bottom: 1px solid #f5e0e4;} .volunteer-select-list {list-style: none;margin: 0;padding: 5px;} .volunteer-select-item {display: flex;align-items: center;padding: 5px 7px;cursor: default;transition: background 0.15s;border-radius: 7px;gap: 10px;} .volunteer-select-item:hover {background: #fff2f4;} .volunteer-select-item .volunteer-avatar {height: 34px !important;width: 34px !important;border-radius: 50% !important;border: 2px solid #e8b4c0;flex-shrink: 0;object-fit: cover;} .volunteer-select-item .volunteer-info {flex: 1;min-width: 0;} .volunteer-select-item .volunteer-name {font-weight: 500;font-size: 13px;color: #2f2f2f;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .volunteer-select-item .volunteer-designation {font-size: 11px;color: #9b7a84;margin-bottom: 0;} .volunteer-select-item .volunteer-designation:empty {display: none;} .volunteer-select-empty {text-align: center;color: #bbb;font-size: 12px;padding: 16px 0 10px 0;} #volunteerSelectDropdown .volunteer-select-menu {right:0;left:auto;} .vol-initials-circle {width:34px;height:34px;border-radius:50%;background:#b94a6f;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;border:2px solid #e8b4c0;letter-spacing:0.3px;vertical-align:middle;} .vol-trigger-initials {width:30px;height:30px;border-radius:50%;background:#b94a6f;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;border:2px solid #e8b4c0;vertical-align:middle;} .top-filter{display: flex;justify-content: space-between;align-items: center;margin-bottom: 15px;} .top-filter .status-selection .status-control{color: #333e5a;line-height: 32px;transition: all .4s ease-in-out;display: inline-block;height: 34px; background: none;border: 1px solid #E5E7EB;border-radius: 4px !important;width: 100%;padding: 0 10px;font-size: 14px; cursor: pointer;} .input-wrapper{position: relative;} .input-wrapper .input-label{color: #6a7182;font-size: 13px;font-weight: 500; position: absolute; pointer-events: none; left: 10px; top: -8px; padding: 0 5px; background: #fff; transition: .2s ease all; z-index: 6; line-height: 15px;} .input-wrapper .task-form-control{border-bottom: 1px solid #ECECEC;color: #2f2f2f;border-top: 1px solid transparent;border-right: 1px solid transparent;border-left: 1px solid transparent;padding: 10px;font-weight: 500;font-size: 14px !important;outline: none; width: 100%;} .input-wrapper .form-control{padding-left: 40px;} .input-wrapper .input-group-text{position: absolute;align-items: center;justify-content: center;display: flex;z-index: 1; top: 15px;left: 15px;} .bg-box{background-color: #fff7f8;padding: 15px 10px;} /* --- TO DO LIST PAGE STYLES --- */ .todo-container .tabbox-view-main{position: relative;} .todo-container .tabbox-view-main .todo-left-panel {background: #fff;padding: 15px 12px;border: 1px solid #E9EBEF;position: absolute;left: 0;top: 0;z-index: 2;margin: 0 20px 0 0;width: 280px;} .todo-container .tabbox-view-main .nav-tabs.tabs-left {margin-bottom: 20px; border-bottom: 1px solid #E9EBEF;padding-bottom: 10px;} .todo-container .tabbox-view-main .nav-tabs.tabs-left li {float: none;margin-bottom: 2px;} .todo-container .tabbox-view-main .nav-tabs.tabs-left li a {color: #495057;border: none;border-radius: 4px;cursor: pointer;background: none;font-size: 16px;transition: background 0.2s, color 0.2s;padding: 10px;display: flex;justify-content: flex-start;align-items: center;} .todo-container .tabbox-view-main .nav-tabs.tabs-left li.active a{background: #FDF0F2;color: #ED6F7E;} .todo-container .tabbox-view-main .nav-tabs.tabs-left li a img{transition: all 0.2s, color 0.2s;margin-right: 10px;} .todo-container .tabbox-view-main .nav-tabs.tabs-left li.active a img{filter: invert(52%) sepia(18%) saturate(1658%) hue-rotate(304deg) brightness(105%) contrast(86%);} .todo-container .tabbox-view-main .todo-tags-label {font-size: 16px;color: #92969A;font-weight: 400;margin: 0 0 15px;} .todo-container .tabbox-view-main .todo-tags-list {list-style: none;padding: 0;margin: 0;} .todo-container .tabbox-view-main .todo-tags-list li {position: relative;padding: 10px;display: flex;align-items: center;} .todo-container .tabbox-view-main .todo-tags-list li a{text-decoration: none;font-size: 16px;} .todo-container .tabbox-view-main .todo-tags-list li a img{margin-right: 10px;} .todo-container .tabbox-view-main .todo-tags-list li a.team { color: #00AB55; } .todo-container .tabbox-view-main .todo-tags-list li a.low { color: #E2A03F; } .todo-container .tabbox-view-main .todo-tags-list li a.medium { color: #4361EE; } .todo-container .tabbox-view-main .todo-tags-list li a.high { color: #E7515A; } .todo-container .tabbox-view-main .todo-tags-list li a.update { color: #2196F3; } .todo-container .tabbox-view-main .todo-right-panel {position: relative;padding-left: 280px;width: 100%;} .todo-container .tabbox-view-main .todo-right-panel .tab-content{background-color: #fff;border: 1px solid #E9EBEF;padding: 15px;margin: 0 20px;} .todo-container .tabbox-view-main .todo-list {margin: 0;padding: 0;} .todo-container .tabbox-view-main .todo-item {background: #fff;border-radius: 4px;box-shadow: 0 0 10px 0px rgba(0,0,0,5%);display: flex;align-items: center;margin-bottom: 18px;padding: 15px 10px;position: relative;border: 1px solid #E9EBEF;transition: box-shadow 0.2s, border 0.2s;} .todo-container .tabbox-view-main .todo-drag { cursor: move; color: #d3d3d3; font-size: 20px; margin-right: 12px; width: 20px; text-align: center; } .todo-container .tabbox-view-main .todo-checkbox {margin-right: 12px;position: relative;} .todo-container .tabbox-view-main .custom-checkbox {display: none;} .todo-container .tabbox-view-main .custom-checkbox + label {margin: 0;width: 22px;height: 22px;border: 2px solid #D9D9D9;border-radius: 5px;display: inline-block;position: relative;cursor: pointer;background: #fff;transition: border 0.2s;} .todo-container .tabbox-view-main .custom-checkbox:checked + label {border: 2px solid #ed6f7e;background: #ed6f7e;} .todo-container .tabbox-view-main .custom-checkbox + label:after {content: '';position: absolute;left: 5px;top: -1px;width: 10px;height: 17px;border: solid #fff;border-width: 0 3px 3px 0;opacity: 0;transform: scale(0.7) rotate(45deg);transition: opacity 0.2s;} .todo-container .tabbox-view-main .custom-checkbox:checked + label:after {opacity: 1;} .todo-container .tabbox-view-main .todo-content { flex: 1;min-width: 0;} .todo-container .tabbox-view-main .review-list {margin-right: 12px;} .todo-container .tabbox-view-main .todo-title-main {font-size: 16px;font-weight: 500;color: #2F2F2F;margin: 0 0 6px;display: flex;align-items: center;} .todo-container .tabbox-view-main .text-line{text-decoration: line-through;} .todo-container .tabbox-view-main .todo-desc {font-size: 15px;color: #495057;white-space: nowrap;overflow: hidden;width: 850px;text-overflow: ellipsis;margin-bottom: 0;} .todo-container .tabbox-view-main .todo-tags {margin-left: 10px;display: flex;align-items: center;} .todo-container .tabbox-view-main .todo-tag {font-size: 13px;border-radius: 4px;padding: 3px 10px;} .todo-container .tabbox-view-main .todo-tag-pending {background: #FFF2E8;color: #F4AA09;margin-right: 5px;} .todo-container .tabbox-view-main .todo-tag-update {background: #FEF1F3;color: #ED6F7E;} .todo-container .tabbox-view-main .todo-avatar {margin-left: 10px;} .todo-container .tabbox-view-main .todo-avatar img {width: 30px;height: 30px;border-radius: 50%;object-fit: cover;} .todo-container .tabbox-view-main .todo-dropdown {margin-left: 10px;position: relative;} .todo-container .tabbox-view-main .todo-dropdown .dropdown-toggle {background: none;border: none;outline: none;padding: 0 5px;cursor: pointer;} .todo-container .tabbox-view-main .todo-dropdown .dropdown-menu {border-radius: 4px;box-shadow: 0 10px 25px #0000001a;border: none;padding: 0;margin-top: 5px;} .todo-container .tabbox-view-main .todo-dropdown .dropdown-menu li a {font-size: 13px;color: #495057;padding: 10px 15px;display: flex;align-items: center;transition: all .3s ease-in-out;} .todo-container .tabbox-view-main .todo-dropdown .dropdown-menu li a:hover {background: #fdf0f2;color: #ED6F7E;} .todo-container .tabbox-view-main .todo-dropdown .dropdown-menu li a:hover img{filter: invert(52%) sepia(18%) saturate(1658%) hue-rotate(304deg) brightness(105%) contrast(86%);} .todo-container .tabbox-view-main .todo-dropdown .dropdown-menu li a img{margin-right: 10px;transition: all .3s ease-in-out;} /* Drag & drop visual feedback */ .todo-item.dragElem { opacity: 0.8; } .todo-item.over { border: 2px dashed #2e7dff; } /* --- END TO DO LIST PAGE STYLES --- */ /* --- ROOM STATUS DASHBOARD STYLES --- */ .room-status-wrapper {background: #fff;padding: 15px;min-height: 100vh;border-radius: 8px;margin: 10px 0 0 0;border: 1px solid #E9EBEF;} .room-status-wrapper .room-status-summary-row {display: flex;gap: 15px;margin-bottom: 15px;} .room-status-wrapper .room-status-summary-card {background: #FDF8F8;border-radius: 6px;padding: 10px;min-width: 200px;display: flex;align-items: center;border: 1px solid #ed6f7e;} .room-status-wrapper .room-status-summary-card .summary-icon {width: 55px;height: 55px;min-width: 55px;margin-right: 15px;background-color: #ed6f7e;border-radius: 50%;display: flex;justify-content: center; align-items: center;} .room-status-wrapper .room-status-summary-card .summary-icon img {object-fit: contain;width: 30px;} .room-status-wrapper .room-status-summary-card .summary-count {font-size: 24px;font-weight: 600;color: #2f2f2f; margin: 0 0 10px;line-height: 20px;} .room-status-wrapper .room-status-summary-card .summary-label {font-size: 13px;line-height: 16px;background-color: #f6e3e5;padding: 3px 8px;border-radius: 3px;color: #e26675;font-weight: 500;} .room-status-wrapper .room-status-cards-row {display: flex;flex-wrap: wrap;gap: 15px;} .room-status-wrapper .room-card {background: #fff;border-radius: 2px;border: 1px solid #EDEDED;flex-basis: 15.8%;box-shadow: 0 0 5px 0 rgba(0, 0, 0, 5%);padding: 27px 15px 15px 15px;position: relative;} .room-status-wrapper .room-card-number {font-size: 20px;font-weight: 600;color: #2F2F2F;margin: 0 0 8px;line-height: 20px;} .room-status-wrapper .room-card-badge {font-size: 12px;border-top-right-radius: 2px;padding: 5px 8px 8px 15px;background: #FBECCC;color: #C38410;position: absolute;top: 0;right: 0;line-height: 13px;clip-path: polygon(0.01% 0%, 100% 0%, 103.75% 96.3%, 16.25% 96.30%);border-bottom-left-radius: 2px;} .room-status-wrapper .room-card-badge.empty{background: #E8F5E9;color: #1B5E20;} .room-status-wrapper .room-card-badge.occupied{background: #FFEBEE;color: #B71C1C;} .room-status-wrapper .room-card-badge.partial{background: #FFF3E0;color: #E65100;} .room-status-wrapper .room-card-capacity {font-size: 14px;color: #6E6E6E;} .room-status-wrapper .room-card-actions {display: flex;gap: 6px; margin: 10px 0 0;align-items: center;} .room-status-wrapper .btn-assign-default {background-color: #6E6E6E;color: #fff;} .room-status-wrapper .btn-assign-default:hover {background-color: #FFF;color: #6E6E6E;border: 1px solid #6E6E6E;} /* --- ROOM DETAIL MODAL STYLES --- */ .room-modal-detail .room-modal-header {display: flex;align-items: center;justify-content: space-between;border-bottom: 1px solid #E9E9E9;margin-bottom: 15px;padding-bottom: 15px;} .room-modal-detail .room-modal-title {font-size: 16px;font-weight: 600;color: #2F2F2F;margin: 0;} .room-modal-detail .room-modal-list-item {display: flex;align-items: center;justify-content: space-between;margin-bottom: 10px;} .room-modal-detail .room-modal-list-item:last-child{margin-bottom: 0;} .room-modal-detail .room-modal-user {font-size: 15px;color: #6E6E6E;} .room-modal-detail .btn-release {background-color: #6E6E6E;color: #fff;} .room-modal-detail .btn-release:hover {background-color: #FFF;color: #6E6E6E;border: 1px solid #6E6E6E;} /* --- ASSIGN MODAL STYLES --- */ .assign-modal-select-row {display: flex;align-items: center;gap: 6px;margin-bottom: 10px;} .assign-modal-add-btn {background-color: #6E6E6E;color: #fff;height: 35px;min-width: 35px;width: 35px;outline: none;border: none;border-radius: 2px;} .assign-modal-list-item {display: flex;align-items: center;justify-content: space-between;background: #EAEAEA;border-radius: 2px;margin-bottom: 8px;padding: 10px 10px;} .assign-modal-user {font-size: 13px;color: #2F2F2F;font-weight: 500;} .assign-modal-remove-btn {background: none;border: none;cursor: pointer;transition: background 0.15s, color 0.15s;} /* Address List Page Design CSS */ .address-box-main {background: #fff;border-radius: 8px;padding: 15px;margin: 0;min-height: 100vh;border: 1px solid #E9EBEF;} .address-box-main .address-grid {display: flex;flex-wrap: wrap;gap: 15px;} .address-box-main .address-card {background: #fff;border-radius: 2px;border: 1px solid #EDEDED;flex-basis: 24.2%;box-shadow: 0 0 5px 0 rgba(0, 0, 0, 5%);padding: 20px 15px 15px 15px;} .address-box-main .address-card .address-title {font-size: 20px;font-weight: 600;color: #2F2F2F;margin: 0 0 8px;line-height: 20px;} .address-box-main .address-card .address-desc {font-size: 14px;margin: 0 0 15px;color: #6E6E6E;} .address-box-main .address-card .btn-print-default{background-color: #6E6E6E;color: #fff;} .address-box-main .address-card .btn-print-default:hover {background-color: #FFF;color: #6E6E6E;border: 1px solid #6E6E6E;} .toogle-btn {width: 36px;height: 36px; background: #fff; border: 1px solid #c6ccdb;border-radius: 6px;text-align: center;display: flex;align-items: center;justify-content: center;padding: 8px; cursor: pointer;font-size: 18px;} .dropdown .filter-submenu { min-width:610px;padding:10px!important;right: 0;left: auto;} .dropdown .filter-submenu .form-control { max-width:100%} .offcanvas-header{ border-bottom: 1px solid #E9E9E9; padding-bottom: 10px; margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; } .offcanvas-header .offcanvas-title{ font-size: 18px; font-weight: 600; color: #2F2F2F; margin: 0; } .d-flex { display: flex !important; } .d-inline-flex { display: inline-flex !important; } .flex-row { flex-direction: row !important; } .flex-row-reverse { flex-direction: row-reverse !important; } .flex-column { flex-direction: column !important; } .flex-column-reverse { flex-direction: column-reverse !important; } .flex-wrap { flex-wrap: wrap !important; } .flex-nowrap { flex-wrap: nowrap !important; } .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } .justify-content-start { justify-content: flex-start !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-center { justify-content: center !important; } .justify-content-between { justify-content: space-between !important; } .justify-content-around { justify-content: space-around !important; } .justify-content-evenly { justify-content: space-evenly !important; } .align-items-start { align-items: flex-start !important; } .align-items-end { align-items: flex-end !important; } .align-items-center { align-items: center !important; } .align-items-baseline { align-items: baseline !important; } .align-items-stretch { align-items: stretch !important; } .align-content-start { align-content: flex-start !important; } .align-content-end { align-content: flex-end !important; } .align-content-center { align-content: center !important; } .align-content-between { align-content: space-between !important; } .align-content-around { align-content: space-around !important; } .align-content-stretch { align-content: stretch !important; } .align-self-auto { align-self: auto !important; } .align-self-start { align-self: flex-start !important; } .align-self-end { align-self: flex-end !important; } .align-self-center { align-self: center !important; } .align-self-baseline { align-self: baseline !important; } .align-self-stretch { align-self: stretch !important; } .flex-fill { flex: 1 1 auto !important; } .flex-grow-0 { flex-grow: 0 !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-0 { flex-shrink: 0 !important; } .flex-shrink-1 { flex-shrink: 1 !important; } .order-first { order: -1 !important; } .order-0 { order: 0 !important; } .order-1 { order: 1 !important; } .order-2 { order: 2 !important; } .order-3 { order: 3 !important; } .order-4 { order: 4 !important; } .order-5 { order: 5 !important; } .order-last { order: 6 !important; } @media print { body { background: white; } .btn, .card-footer, .btn-print-all, h2 { display: none !important; } .grid { display: block; } .card { box-shadow: none !important; border: none !important; margin-bottom: 20px; text-align: center; } .card strong { font-size: 18px; margin-bottom: 6px; } .card p { font-size: 16px; margin: 2px 0; color: black; } } @media (max-width: 900px) { /* #taskDetailModal .modal-dialog { max-width: 99vw; } */ #taskDetailModal .task-modal-main { flex-direction: column; } #taskDetailModal .task-modal-left, #taskDetailModal .task-modal-right { padding: 18px !important; border: none; } #taskDetailModal .task-modal-right { border-top: 1px solid #ededed; } #taskDetailModal .photo-card { width: 100%; max-width: 100%; } }