first commit

This commit is contained in:
annuary.lyimo 2025-11-15 14:14:31 +03:00
commit e33cc60cd7
2458 changed files with 3834304 additions and 0 deletions

3
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"dotnet.preferCSharpExtension": true
}

1686
AmendmentAppProfile.Designer.cs generated Normal file

File diff suppressed because it is too large Load Diff

17
AmendmentAppProfile.cs Normal file
View File

@ -0,0 +1,17 @@
using System;
using System.Drawing;
using System.Collections;
using System.ComponentModel;
using DevExpress.XtraReports.UI;
namespace OSS
{
public partial class AmendmentAppProfile : DevExpress.XtraReports.UI.XtraReport
{
public AmendmentAppProfile()
{
InitializeComponent();
}
}
}

195
AmendmentAppProfile.resx Normal file

File diff suppressed because one or more lines are too long

47
App_Browsers/qt.browser Normal file
View File

@ -0,0 +1,47 @@
<!--
You can find existing browser definitions at
<windir>\Microsoft.NET\Framework\<ver>\CONFIG\Browsers
File per permettere a wkhtmltopdf di inviare richiete con cookie
-->
<browsers>
<browser id="Qt" parentID="Safari">
<identification>
<userAgent match="Qt/(?'version'(?'major'\d+)(\.(?'minor'\d+)?)\w*)" />
</identification>
<!--<capture>
<userAgent match="NewBrowser (?'version'\d+\.\d+)" />
</capture>-->
<capabilities>
<capability name="browser" value="Qt" />
<capability name="version" value="${version}" />
<capability name="majorversion" value="${major}" />
<capability name="minorversion" value="${minor}" />
<capability name="type" value="Qt${major}" />
<capability name="ecmascriptversion" value="3.0" />
<capability name="javascript" value="true" />
<capability name="javascriptversion" value="1.7" />
<capability name="w3cdomversion" value="1.0" />
<capability name="tagwriter" value="System.Web.UI.HtmlTextWriter" />
<capability name="cookies" value="true" />
<capability name="frames" value="true" />
<capability name="javaapplets" value="true" />
<capability name="supportsAccesskeyAttribute" value="true" />
<capability name="supportsCallback" value="true" />
<capability name="supportsDivNoWrap" value="false" />
<capability name="supportsFileUpload" value="true" />
<capability name="supportsMaintainScrollPositionOnPostback" value="true" />
<capability name="supportsMultilineTextBoxDisplay" value="true" />
<capability name="supportsXmlHttp" value="true" />
<capability name="tables" value="true" />
</capabilities>
</browser>
<!--<browser refID="Mozilla">
<capabilities>
<capability name="xml" value="true" />
</capabilities>
</browser>-->
</browsers>

39
App_Start/BundleConfig.cs Normal file
View File

@ -0,0 +1,39 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Optimization;
namespace OSS {
public class BundleConfig {
public static void RegisterBundles(BundleCollection bundles) {
var scriptBundle = new ScriptBundle("~/Scripts/bundle");
var styleBundle = new StyleBundle("~/Content/bundle");
// jQuery
scriptBundle
.Include("~/Scripts/jquery-3.4.1.js");
// Bootstrap
scriptBundle
.Include("~/Scripts/bootstrap.js");
// Bootstrap
styleBundle
.Include("~/Content/bootstrap.css");
// Custom site styles
styleBundle
.Include("~/Content/Site.css");
bundles.Add(scriptBundle);
bundles.Add(styleBundle);
#if !DEBUG
BundleTable.EnableOptimizations = true;
#endif
}
}
}

View File

@ -0,0 +1,66 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Optimization;
namespace OSS {
public class DevExtremeBundleConfig {
public static void RegisterBundles(BundleCollection bundles) {
var styleBundle = new StyleBundle("~/Content/DevExtremeBundle");
var scriptBundle = new ScriptBundle("~/Scripts/DevExtremeBundle");
// Uncomment to use the Gantt control
//styleBundle.Include("~/Content/dx-gantt.css");
// Uncomment to use the Diagram control
//styleBundle.Include("~/Content/dx-diagram.css");
styleBundle.Include("~/Content/dx.common.css");
// Predefined themes: https://js.devexpress.com/DevExtreme/Guide/Themes_and_Styles/Predefined_Themes/
styleBundle.Include("~/Content/dx.light.css");
// Uncomment to use the Gantt control
//scriptBundle.Include("~/Scripts/dx-gantt.js");
// Uncomment to use the Diagram control
//scriptBundle.Include("~/Scripts/dx-diagram.js");
// NOTE: jQuery may already be included in the default script bundle. Check the BundleConfig.cs file.
//scriptBundle.Include("~/Scripts/jquery-3.4.1.js");
scriptBundle.Include("~/Scripts/cldr.js");
scriptBundle.Include("~/Scripts/cldr/event.js");
scriptBundle.Include("~/Scripts/cldr/supplemental.js");
scriptBundle.Include("~/Scripts/cldr/unresolved.js");
scriptBundle.Include("~/Scripts/globalize.js");
scriptBundle.Include("~/Scripts/globalize/message.js");
scriptBundle.Include("~/Scripts/globalize/number.js");
scriptBundle.Include("~/Scripts/globalize/currency.js");
scriptBundle.Include("~/Scripts/globalize/date.js");
// Uncomment to enable client-side export
//scriptBundle.Include("~/Scripts/jszip.js");
scriptBundle.Include("~/Scripts/dx.all.js");
// Uncomment to provide geo-data for the VectorMap control
// Docs: https://js.devexpress.com/DevExtreme/Guide/Widgets/VectorMap/Providing_Data/#Data_for_Areas
//scriptBundle.Include("~/Scripts/vectormap-data/world.js");
scriptBundle.Include("~/Scripts/aspnet/dx.aspnet.mvc.js");
scriptBundle.Include("~/Scripts/aspnet/dx.aspnet.data.js");
bundles.Add(styleBundle);
bundles.Add(scriptBundle);
#if !DEBUG
BundleTable.EnableOptimizations = true;
#endif
}
}
}

11
App_Start/FilterConfig.cs Normal file
View File

@ -0,0 +1,11 @@
using System.Web;
using System.Web.Mvc;
namespace OSS {
public class FilterConfig {
public static void RegisterGlobalFilters(GlobalFilterCollection filters)
{
//filters.Add(new HandleErrorAttribute());
}
}
}

20
App_Start/RouteConfig.cs Normal file
View File

@ -0,0 +1,20 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;
namespace OSS {
public class RouteConfig {
public static void RegisterRoutes(RouteCollection routes) {
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
}
}

20
App_Start/WebApiConfig.cs Normal file
View File

@ -0,0 +1,20 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;
namespace OSS {
public static class WebApiConfig {
public static void Register(HttpConfiguration config) {
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
}

2
Content/Site.css Normal file
View File

@ -0,0 +1,2 @@
body {
}

BIN
Content/assets/arm.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

View File

@ -0,0 +1,415 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
#content:before {
content: '';
position: absolute;
left: 0;
right: 0;
background: rgba(136, 142, 168, 0.211765);
width: 100%;
height: 183px;
z-index: -1; }
/*----------Theme checkbox---------*/
.new-control {
padding-left: 0;
margin-right: 0; }
.new-control-input {
position: unset; }
.new-control.new-checkbox span.new-control-indicator:after {
top: 51%; }
/*
Filtered List Search
*/
.filtered-list-search form > div {
position: relative;
width: 80%; }
.filtered-list-search form > div svg {
position: absolute;
right: 11px;
color: #acb0c3;
height: 36px;
width: 19px;
top: 4px; }
.filtered-list-search form input {
padding: 6px 27px 6px 15px;
color: #d3d3d3;
border: none;
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
width: 100% !important;
background-color: #fff; }
.filtered-list-search form input:focus {
border-color: #d3d3d3; }
.filtered-list-search form input::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: #888ea8; }
.filtered-list-search form input::-moz-placeholder {
/* Firefox 19+ */
color: #888ea8; }
.filtered-list-search form input:-ms-input-placeholder {
/* IE 10+ */
color: #888ea8; }
.filtered-list-search form input:-moz-placeholder {
/* Firefox 18- */
color: #888ea8; }
.searchable-container .switch {
text-align: right; }
.searchable-container .switch .view-grid, .searchable-container .switch .view-list {
padding: 10px;
background: #fff;
border-radius: 5px;
cursor: pointer;
color: #515365;
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
width: 43px;
height: 41px;
fill: rgba(0, 23, 55, 0.08); }
.searchable-container #btn-add-contact {
padding: 9px;
background: #ffffff;
border-radius: 5px;
cursor: pointer;
margin-right: 35px;
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
width: 43px;
height: 41px;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.searchable-container #btn-add-contact:hover {
color: #515365;
fill: rgba(0, 23, 55, 0.08); }
.modal-backdrop {
background-color: #ebedf2; }
.searchable-container .modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.searchable-container .modal-content svg.close {
position: absolute;
right: -7px;
top: -8px;
font-size: 12px;
font-weight: 600;
padding: 7px;
background: #fff;
border-radius: 5px;
opacity: 1;
color: #2196f3;
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: .600s; }
.searchable-container .add-contact-box .add-contact-content .contact-name .validation-text, .searchable-container .add-contact-box .add-contact-content .contact-email .validation-text, .searchable-container .add-contact-box .add-contact-content .contact-occupation .validation-text, .searchable-container .add-contact-box .add-contact-content .contact-phone .validation-text, .searchable-container .add-contact-box .add-contact-content .contact-location .validation-text {
display: none;
color: #e7515a;
font-weight: 600;
text-align: left;
margin-top: 6px;
font-size: 12px;
letter-spacing: 1px; }
.searchable-container .add-contact-box .add-contact-content .contact-name svg, .searchable-container .add-contact-box .add-contact-content .contact-email svg, .searchable-container .add-contact-box .add-contact-content .contact-occupation svg, .searchable-container .add-contact-box .add-contact-content .contact-phone svg, .searchable-container .add-contact-box .add-contact-content .contact-location svg {
align-self: center;
font-size: 19px;
margin-right: 14px;
color: #2196f3;
font-weight: 600; }
.searchable-container .add-contact-box .add-contact-content .contact-name #c-name::-webkit-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-email #c-email::-webkit-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-occupation #c-occupation::-webkit-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-phone #c-phone::-webkit-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-location #c-location::-webkit-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-name #c-name::-ms-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-email #c-email::-ms-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-occupation #c-occupation::-ms-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-phone #c-phone::-ms-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-location #c-location::-ms-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-name #c-name::-moz-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-email #c-email::-moz-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-occupation #c-occupation::-moz-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-phone #c-phone::-moz-input-placeholder, .searchable-container .add-contact-box .add-contact-content .contact-location #c-location::-moz-input-placeholder {
color: #acb0c3;
font-weight: 600; }
.searchable-container .add-contact-box .add-contact-content .contact-name, .searchable-container .add-contact-box .add-contact-content .contact-email, .searchable-container .add-contact-box .add-contact-content .contact-occupation, .searchable-container .add-contact-box .add-contact-content .contact-phone {
padding-top: 20px; }
.searchable-container .add-contact-box .add-contact-content .contact-location {
padding-top: 20px; }
.searchable-container .add-contact-box .add-contact-content .contact-location #c-location {
resize: none; }
.searchable-container .modal-footer {
border: none;
padding: 0 15px 14px 15px; }
.searchable-container .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
.searchable-container .modal-footer .btn[data-dismiss="modal"] svg {
font-size: 11px;
font-weight: 600;
margin-right: 8px; }
.searchable-container .modal-footer .btn#btn-add {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #1b55e2;
padding: 10px 25px; }
.searchable-container .modal-footer .btn#btn-edit {
background-color: #009688;
color: #fff;
font-weight: 600;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
.searchable-container .switch .view-grid:hover, .searchable-container .switch .view-list:hover, .searchable-container .switch .active-view {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.searchable-container .searchable-items.list .items.items-header-section h4 {
display: inline-block;
font-size: 16px;
font-weight: 600;
margin-bottom: 0;
margin-left: 39px; }
.searchable-container .searchable-items.list .items.items-header-section .n-chk {
display: inline-block; }
.searchable-container .searchable-items.list .items .item-content {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-align: center;
align-items: center;
padding: .75rem .625rem;
position: relative;
display: inline-flex;
min-width: 0;
word-wrap: break-word;
justify-content: space-between;
background: #fff;
margin-bottom: 8px;
border-radius: 6px;
padding: 13px 18px;
width: 100%;
min-width: 767px;
transition: all 0.35s ease;
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.searchable-container .searchable-items.list .items:not(.items-header-section) .item-content:hover {
-webkit-transform: translateY(0) scale(1.03);
transform: translateY(0) scale(1.01); }
.searchable-container .searchable-items.list .items .user-profile {
display: flex; }
.searchable-container .searchable-items.list .items .user-profile img {
width: 43px;
height: 43px;
border-radius: 5px;
margin-right: 11px;
margin-left: 18px; }
.searchable-container .searchable-items.list .items .user-meta-info .user-name {
margin-bottom: 0;
color: #3b3f5c;
font-weight: 600;
font-size: 15px; }
.searchable-container .searchable-items.list .items .user-meta-info .user-work {
margin-bottom: 0;
color: #888ea8;
font-weight: 500;
font-size: 13px; }
.searchable-container .searchable-items.list .items .user-email p {
margin-bottom: 0;
color: #888ea8;
font-weight: 600; }
.searchable-container .searchable-items.list .items .user-email .info-title {
display: none; }
.searchable-container .searchable-items.list .items .user-location p {
font-size: 13px;
font-weight: 600;
margin-bottom: 0; }
.searchable-container .searchable-items.list .items .user-location .info-title {
display: none; }
.searchable-container .searchable-items.list .items .user-phone p {
margin-bottom: 0;
color: #888ea8;
font-weight: 600;
font-size: 13px; }
.searchable-container .searchable-items.list .items .user-phone .info-title {
display: none; }
.searchable-container .searchable-items.list .items .action-btn {
font-weight: 600;
color: #acb0c3; }
.searchable-container .searchable-items.list .items .action-btn .delete-multiple {
margin-right: 5px;
cursor: pointer;
color: #515365;
width: 20px;
fill: rgba(27, 85, 226, 0.239216); }
.searchable-container .searchable-items.list .items .action-btn .delete-multiple:hover {
color: #1b55e2; }
.searchable-container .searchable-items.list .items .action-btn .edit, .searchable-container .searchable-items.list .items .action-btn .delete {
margin-right: 5px;
cursor: pointer;
color: #515365;
width: 20px;
fill: rgba(27, 85, 226, 0.239216); }
.searchable-container .searchable-items.list .items .action-btn .edit:hover, .searchable-container .searchable-items.list .items .action-btn .delete:hover {
color: #1b55e2; }
.searchable-items.grid {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px; }
.searchable-container .searchable-items.grid .items {
margin-bottom: 30px;
border-radius: 6px;
width: 100%;
color: #0e1726;
transition: all 0.35s ease;
width: 33%;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px; }
.searchable-container .searchable-items.grid .items .item-content {
background-color: #fff;
padding: 13px 18px;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
border-radius: 6px; }
.searchable-container .searchable-items.grid .items.items-header-section {
display: none; }
.searchable-container .searchable-items.grid .items .user-profile {
text-align: center;
margin-top: 20px; }
.searchable-container .searchable-items.grid .items .user-profile .n-chk {
display: none; }
.searchable-container .searchable-items.grid .items .user-profile img {
border-radius: 12px; }
.searchable-container .searchable-items.grid .items .user-meta-info {
margin-top: 10px; }
.searchable-container .searchable-items.grid .items .user-meta-info .user-name {
font-size: 21px;
font-weight: 600;
margin-bottom: 0;
color: #2196f3; }
.searchable-container .searchable-items.grid .items .user-meta-info .user-work {
font-weight: 700;
font-size: 13px; }
.searchable-container .searchable-items.grid .items .user-email {
display: flex;
justify-content: space-between;
margin-top: 24px; }
.searchable-container .searchable-items.grid .items .user-email .info-title {
font-size: 14px;
font-weight: 600;
color: #3b3f5c;
margin-bottom: 11px; }
.searchable-container .searchable-items.grid .items .user-email p {
color: #888ea8;
font-size: 13px;
margin-bottom: 11px; }
.searchable-container .searchable-items.grid .items .user-location {
display: flex;
justify-content: space-between; }
.searchable-container .searchable-items.grid .items .user-location .info-title {
font-size: 14px;
font-weight: 600;
color: #3b3f5c;
margin-bottom: 11px;
margin-right: 10px; }
.searchable-container .searchable-items.grid .items .user-location p {
color: #888ea8;
font-size: 13px;
margin-bottom: 11px; }
.searchable-container .searchable-items.grid .items .user-phone {
display: flex;
justify-content: space-between; }
.searchable-container .searchable-items.grid .items .user-phone .info-title {
font-size: 14px;
font-weight: 600;
color: #3b3f5c;
margin-bottom: 11px; }
.searchable-container .searchable-items.grid .items .user-phone p {
color: #888ea8;
font-size: 13px;
margin-bottom: 11px;
margin-right: 10px; }
.searchable-container .searchable-items.grid .items .action-btn {
font-weight: 600;
color: #acb0c3;
text-align: center;
margin: 20px 0; }
.searchable-container .searchable-items.grid .items .action-btn .edit, .searchable-container .searchable-items.grid .items .action-btn .delete {
margin-right: 5px;
cursor: pointer;
color: #515365;
width: 20px;
fill: rgba(27, 85, 226, 0.239216); }
.searchable-container .searchable-items.grid .items .action-btn .edit:hover, .searchable-container .searchable-items.grid .items .action-btn .delete:hover {
color: #1b55e2; }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
.new-control.new-checkbox .new-control-indicator {
top: -13px;
left: -8px; } }
@media (max-width: 1199px) {
.searchable-container .searchable-items.list {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch; }
.searchable-container .searchable-items.grid .items {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%; } }
@media (max-width: 767px) {
.searchable-container .searchable-items.list {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch; }
.searchable-container .searchable-items.list .items {
min-width: 767px; }
.searchable-container .searchable-items.grid .items {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%; } }
@media (max-width: 575px) {
.searchable-container .searchable-items.grid .items {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%; }
.filtered-list-search form > div {
width: 100%; } }

View File

@ -0,0 +1,370 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
@keyframes fadeInUp {
from {
transform: translate3d(0, 40px, 0); }
to {
transform: translate3d(0, 0, 0);
opacity: 1; } }
@-webkit-keyframes fadeInUp {
from {
transform: translate3d(0, 40px, 0); }
to {
transform: translate3d(0, 0, 0);
opacity: 1; } }
.animated {
animation-duration: 1s;
animation-fill-mode: both;
-webkit-animation-duration: 1s;
-webkit-animation-fill-mode: both; }
.animatedFadeInUp {
opacity: 0; }
.fadeInUp {
opacity: 0;
animation-name: fadeInUp;
-webkit-animation-name: fadeInUp; }
.actions-btn-tooltip.tooltip {
opacity: 1;
top: -11px !important; }
.actions-btn-tooltip .arrow:before {
border-top-color: #3b3f5c; }
.actions-btn-tooltip .tooltip-inner {
background: #3b3f5c;
color: #fff;
font-weight: 700;
border-radius: 30px;
box-shadow: 0px 5px 15px 1px rgba(113, 106, 202, 0.2);
padding: 4px 16px; }
.doc-container {
position: relative;
display: flex;
background: #fff;
border-radius: 6px;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); }
.tab-title {
min-width: 250px; }
.tab-title .search {
border-bottom: 1px solid #e0e6ed;
border-right: 1px solid #e0e6ed; }
.tab-title .search input {
border: none;
padding: 18px 18px 18px 18px;
background: transparent;
height: auto; }
.tab-title .search input::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: #888ea8; }
.tab-title .search input::-moz-placeholder {
/* Firefox 19+ */
color: #888ea8; }
.tab-title .search input:-ms-input-placeholder {
/* IE 10+ */
color: #888ea8; }
.tab-title .search input:-moz-placeholder {
/* Firefox 18- */
color: #888ea8; }
.tab-title .inv-list-container {
position: relative;
margin: auto;
overflow: auto;
border-right: 1px solid #e0e6ed;
height: calc(100vh - 185px); }
.tab-title .nav-item {
border-bottom: 1px solid #e0e6ed; }
.tab-title .list-actions {
padding: 20px 10px;
border-radius: 5px;
transition: all 0.35s ease;
cursor: pointer; }
.tab-title .list-actions.active {
background-color: #fff;
-webkit-transform: translateY(0) scale(1.03);
transform: translateY(0) scale(1.03);
box-shadow: 0px 0px 15px 1px #ebedf2; }
.tab-title .list-actions:hover {
-webkit-transform: translateY(0) scale(1.03);
transform: translateY(0) scale(1.03);
box-shadow: 0px 0px 15px 1px #ebedf2; }
.tab-title .list-actions .f-m-body {
display: flex; }
.tab-title .list-actions .f-m-body .f-head {
margin-right: 13px;
align-self: center; }
.tab-title .list-actions .f-m-body .f-head svg {
background: rgba(0, 23, 55, 0.08);
border-radius: 50%;
padding: 6px;
color: #0e1726;
width: 30px;
height: 30px; }
.tab-title .list-actions .f-m-body .f-body .invoice-number {
margin-bottom: 0;
font-size: 12px;
color: #888ea8;
font-weight: 600; }
.tab-title .list-actions .f-m-body .f-body .invoice-customer-name {
font-size: 14px;
font-weight: 700;
color: #0e1726;
margin-bottom: 0; }
.tab-title .list-actions .f-m-body .f-body .invoice-customer-name span {
color: #3b3f5c; }
.tab-title .list-actions .f-m-body .f-body .invoice-generated-date {
margin-bottom: 0;
font-size: 13px;
font-weight: 600;
color: #3b3f5c; }
.invoice-container {
width: 100%; }
.invoice-inbox {
position: relative;
overflow-x: hidden;
overflow-y: auto;
max-width: 100%;
width: 100%;
height: calc(100vh - 126px); }
.invoice-inbox .inv-not-selected {
display: flex;
height: 100%;
justify-content: center;
background-image: url(../../img/bg.png);
border-bottom-right-radius: 6px;
border-top-right-radius: 6px; }
.invoice-inbox .inv-not-selected p {
align-self: center;
font-size: 18px;
color: #3b3f5c;
margin-bottom: 0;
font-weight: 600;
background: #bfc9d4;
padding: 7px 11px;
border-radius: 6px;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.invoice-inbox .invoice-header-section {
display: flex;
justify-content: space-between;
padding: 17px 20px;
border-bottom: 1px solid #ebedf2;
display: none; }
.invoice-inbox .inv-number {
font-size: 18px;
font-weight: 700;
margin-bottom: 0;
color: #888ea8; }
.invoice-inbox .invoice-action svg {
cursor: pointer;
font-weight: 600;
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
fill: rgba(0, 23, 55, 0.08); }
.invoice-inbox .invoice-action svg:not(:last-child) {
margin-right: 15px; }
.invoice-inbox .invoice-action svg:hover {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.invoice-inbox #ct {
display: none; }
/*
===================
Invoice
===================
*/
/*Invoice*/
.content-section {
padding: 36px 35px; }
.invoice .content-section {
height: calc(100vh - 193px); }
.invoice .content-section .inv--head-section {
margin-bottom: 50px; }
.invoice .content-section .inv--head-section h3.in-heading {
font-size: 32px;
font-weight: 700;
color: #0e1726;
margin: 0; }
.invoice .content-section .inv--head-section div.company-info {
display: flex;
justify-content: flex-end; }
.invoice .content-section .inv--head-section div.company-info svg {
width: 42px;
height: 42px;
margin-right: 10px;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.invoice .content-section .inv--head-section .inv-brand-name {
font-size: 23px;
font-weight: 600;
margin-bottom: 0;
align-self: center; }
.invoice .content-section .inv--detail-section .inv-to {
font-weight: 700;
font-size: 15px;
margin-bottom: 15px; }
.invoice .content-section .inv--detail-section .inv-customer-name {
font-weight: 700;
margin-bottom: 2px;
font-size: 13px;
color: #1b55e2; }
.invoice .content-section .inv--detail-section .inv-detail-title {
font-weight: 700;
margin-bottom: 0;
font-size: 15px;
margin-bottom: 15px; }
.invoice .content-section .inv--detail-section .inv-details {
font-weight: 700;
margin-bottom: 15px; }
.invoice .content-section .inv--detail-section .inv-street-addr, .invoice .content-section .inv--detail-section .inv-email-address {
font-weight: 600;
margin-bottom: 2px;
font-size: 13px; }
.invoice .content-section .inv--detail-section .inv-list-number {
margin-bottom: 2px; }
.invoice .content-section .inv--detail-section .inv-list-number .inv-title {
font-weight: 700;
font-size: 13px; }
.invoice .content-section .inv--detail-section .inv-list-number .inv-number {
font-weight: 700;
font-size: 13px;
color: #1b55e2; }
.invoice .content-section .inv--detail-section .inv-created-date, .invoice .content-section .inv--detail-section .inv-due-date {
margin-bottom: 2px; }
.invoice .content-section .inv--detail-section .inv-created-date .inv-title, .invoice .content-section .inv--detail-section .inv-due-date .inv-title {
font-weight: 700;
font-size: 13px; }
.invoice .content-section .inv--detail-section .inv-created-date .inv-date, .invoice .content-section .inv--detail-section .inv-due-date .inv-date {
font-size: 13px;
font-weight: 600; }
.invoice .content-section .inv--product-table-section {
margin-top: 50px;
margin-bottom: 50px; }
.invoice .content-section .inv--product-table-section table {
border: 1px solid #e0e6ed; }
.invoice .content-section .inv--product-table-section thead tr {
border: none;
background: #ebedf2; }
.invoice .content-section .inv--product-table-section th {
border: none;
color: #1b55e2; }
.invoice .content-section .inv--product-table-section td {
border-top: 1px solid #e0e6ed;
color: #515365;
font-weight: 600; }
.invoice .content-section .inv--payment-info {
font-size: 13px;
font-weight: 600;
margin-bottom: 52px; }
.invoice .content-section .inv--payment-info .inv-title {
color: #1b55e2;
font-weight: 600;
margin-bottom: 15px; }
.invoice .content-section .inv--payment-info .inv-subtitle {
font-weight: 700;
font-size: 14px; }
.invoice .content-section .inv--total-amounts {
font-size: 13px;
font-weight: 600;
margin-bottom: 52px; }
.invoice .content-section .inv--total-amounts .grand-total-title h4, .invoice .content-section .inv--total-amounts .grand-total-amount h4 {
position: relative;
font-weight: 700;
font-size: 16px;
margin-bottom: 0;
padding: 0;
color: #0e1726;
display: inline-block;
letter-spacing: 1px; }
/* Inv head section */
/* Inv detail section */
/*inv-list-number*/
/*inv-created-date*/
/*inv-due-date*/
/* Inv product table section */
/*inv--payment-info*/
/*inv--total-amounts*/
/*inv--thankYou*/
.inv--thankYou {
display: none;
text-align: center; }
.inv--thankYou p {
margin-bottom: 0;
font-weight: 600;
font-size: 12px;
color: #888ea8; }
@media print {
body * {
visibility: hidden; }
#ct {
visibility: visible; }
#ct * {
visibility: visible; }
.doc-container {
position: absolute;
left: 0;
right: 0;
top: 0; } }
@page {
size: auto;
margin: 0mm; }
@media (max-width: 1199px) {
.doc-container {
overflow: auto; }
.tab-title {
position: absolute;
z-index: 60;
left: -300px; }
.tab-title.open-inv-sidebar {
left: 0;
background: #fff; }
.app-hamburger-container {
text-align: right; }
.hamburger {
position: relative;
top: -13px;
padding: 6px 9px 6px 9px;
font-size: 20px;
color: #fff;
align-self: center;
display: inline-block;
background-color: #515365;
border-radius: 50%; } }
@media (max-width: 575px) {
.invoice .content-section .inv--head-section div.company-info {
justify-content: flex-start; }
.invoice .content-section .inv--detail-section .inv-detail-title {
margin-top: 20px;
margin-bottom: 10px; } }
@media (max-width: 991px) {
.layout-top-spacing {
margin-top: 37px; } }

View File

@ -0,0 +1,918 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
[class*="g-dot-"] {
position: relative; }
[class*="g-dot-"]:before {
position: absolute;
padding: 4px;
content: '';
background: transparent;
border-radius: 50%;
top: 15px;
left: 0;
border: 2px solid #515365; }
.g-dot-primary:before {
border: none;
background: #2196f3; }
.g-dot-warning:before {
border: none;
background: #e2a03f; }
.g-dot-success:before {
border: none;
background: #8dbf42; }
.g-dot-danger:before {
border: none;
background: #e7515a; }
.mail-content-container.mailInbox [data-original-title="Restore"], .mail-content-container.sentmail [data-original-title="Restore"], .mail-content-container.important [data-original-title="Restore"], .mail-content-container.spam [data-original-title="Restore"] {
display: none; }
.mail-content-container.trashed [data-original-title="Reply"], .mail-content-container.trashed [data-original-title="Forward"], .mail-content-container.trashed [data-original-title="Print"] {
display: none; }
/*----------Theme checkbox---------*/
.new-control {
position: relative;
display: -ms-inline-flexbox;
display: inline-flex; }
.new-control-input {
position: absolute;
z-index: -1;
opacity: 0; }
.new-control.new-checkbox {
cursor: pointer; }
.new-control.new-checkbox .new-control-indicator {
position: relative;
top: .25rem;
left: 0;
display: block;
width: 1rem;
height: 1rem;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #bfc9d4;
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
border-radius: 2px;
margin-right: 13px; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator {
background: #888ea8; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator:after {
display: block; }
.new-control.new-checkbox span.new-control-indicator:after {
border: solid #fff;
top: 50%;
left: 50%;
margin-left: -2px;
margin-top: -6px;
width: 5px;
height: 10px;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg);
content: '';
position: absolute;
display: none; }
.new-control.new-checkbox.checkbox-primary > input:checked ~ span.new-control-indicator {
background: #3b3f5c; }
.mail-box-container {
position: relative;
display: flex;
border-radius: 6px;
background-color: #fff;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
height: calc(100vh - 126px); }
.mail-box-container .avatar-sm {
width: 2.5rem;
height: 2.5rem;
font-size: .83333rem; }
.mail-box-container .avatar {
position: relative;
display: inline-block;
width: 34px;
height: 34px;
font-size: 12px; }
.mail-box-container .avatar .avatar-title {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background-color: #060818;
color: #ebedf2; }
.mail-overlay {
display: none;
position: absolute;
width: 100vw;
height: 100%;
background: #3b3f5c !important;
z-index: 4 !important;
opacity: 0;
transition: all 0.5s ease-in-out; }
.mail-overlay.mail-overlay-show {
display: block;
opacity: .7; }
.tab-title {
padding: 33px 15px;
max-width: 115px;
border-right: 1px solid #e0e6ed; }
.tab-title .mail-btn-container {
padding: 0 30px; }
.tab-title #btn-compose-mail {
transform: none;
background: #5c1ac3;
border: none !important;
padding: 7px 9px;
font-size: 14px;
font-weight: 700;
letter-spacing: 1px;
color: #fff !important;
width: 40px;
margin: 0 auto;
box-shadow: 0px 5px 10px 0px rgba(92, 26, 195, 0.380392); }
.tab-title #btn-compose-mail:hover {
box-shadow: none; }
.tab-title #btn-compose-mail svg {
width: 22px;
height: 22px; }
.tab-title.mail-menu-show {
left: 0;
width: 100%;
height: 100%; }
.tab-title .nav-pills .nav-link.active, .tab-title .nav-pills .show > .nav-link {
background-color: transparent;
color: #1b55e2;
font-weight: 600;
fill: rgba(27, 85, 226, 0.239216); }
.tab-title .mail-categories-container {
margin-top: 35px;
padding: 0 0; }
.tab-title .mail-sidebar-scroll {
position: relative;
margin: auto;
width: 100%;
overflow: auto;
height: calc(100vh - 230px); }
.tab-title .mail-sidebar-scroll .ps__rail-y {
right: -15px !important; }
.tab-title .nav-pills:nth-child(1) .nav-item:first-child a.nav-link {
border-top: 1px solid #e0e6ed;
padding-top: 24px; }
.tab-title .nav-pills a.nav-link {
position: relative;
font-weight: 600;
color: #515365;
padding: 14px 0px 14px 0px;
cursor: pointer;
font-size: 14px;
display: block;
text-align: center;
border-radius: 0;
border-bottom: 1px solid #e0e6ed; }
.tab-title .nav-pills .nav-link.active svg, .tab-title .nav-pills .show > .nav-link svg {
color: #1b55e2; }
.tab-title .nav-pills a.nav-link svg {
width: 19px;
height: 19px;
margin-bottom: 7px;
fill: rgba(0, 23, 55, 0.08);
color: #888ea8; }
.tab-title .nav-pills a.nav-link span.nav-names {
display: block;
letter-spacing: 1px;
padding: 0; }
.tab-title .nav-pills a.nav-link .mail-badge {
background: #1b55e2;
border-radius: 50%;
position: absolute;
right: 8px;
padding: 3px 0;
height: 19px;
width: 19px;
color: #fff;
font-weight: 500;
font-size: 10px;
top: 7px; }
.group-section {
font-weight: 700;
font-size: 15px;
display: inline-block;
color: #060818;
letter-spacing: 1px;
margin-top: 22px;
margin-bottom: 13px;
display: flex;
justify-content: center; }
.group-section svg {
color: #060818;
margin-right: 6px;
align-self: center;
width: 17px;
height: 17px;
fill: #acb0c3; }
.tab-title .nav-pills.group-list .nav-item a {
position: relative;
padding: 6px 45px 6px 41px;
letter-spacing: 1px;
border-radius: 5px;
font-size: 12px;
font-weight: 700;
color: #888ea8;
border-bottom: none !important; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-primary.active:before {
background: #2196f3; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-warning.active:before {
background: #e2a03f; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-success.active:before {
background: #8dbf42; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-danger.active:before {
background: #e7515a; }
.tab-title .nav-pills.group-list .nav-item a[class*="g-dot-"]:before {
position: absolute;
padding: 3px;
content: '';
border-radius: 50%;
top: 11px;
left: 18px;
border: 2px solid #e0e6ed; }
.tab-title .nav-pills .nav-item .dropdown-menu {
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
padding: 0;
border: none; }
.tab-title li.mail-labels a.dropdown-item {
font-size: 13px;
font-weight: 700;
padding: 8px 18px; }
.tab-title li.mail-labels a.dropdown-item:hover {
background-color: #fff;
color: #1b55e2; }
.tab-title li.mail-labels .label:after {
position: absolute;
content: "";
height: 6px;
width: 6px;
border-radius: 50%;
right: 15px;
top: 43%; }
/*Mail Labels*/
.actions-btn-tooltip.tooltip {
opacity: 1;
top: -11px !important; }
.actions-btn-tooltip .arrow:before {
border-top-color: #3b3f5c; }
.actions-btn-tooltip .tooltip-inner {
background: #3b3f5c;
color: #fff;
font-weight: 700;
border-radius: 30px;
box-shadow: 0px 5px 15px 1px rgba(113, 106, 202, 0.2);
padding: 4px 16px; }
/*
=====================
Mailbox Inbox
=====================
*/
.mailbox-inbox {
position: relative;
overflow-x: hidden;
overflow-y: hidden;
max-width: 100%;
width: 100%;
background: #f9f9f9; }
.mailbox-inbox .mail-menu {
margin: 12px 13px 12px 13px;
width: 22px;
border-radius: 0;
color: #515365;
align-self: center; }
.mailbox-inbox .search {
display: flex;
border-bottom: 1px solid #e0e6ed;
background: #ebedf2; }
.mailbox-inbox .search input {
border: none;
padding: 12px 13px 12px 13px;
background-color: #fff;
border-radius: 0;
border-top-right-radius: 6px; }
.mailbox-inbox .search input:focus {
box-shadow: 0 0 5px 2px #f1f2f3; }
.mailbox-inbox .action-center {
display: flex;
justify-content: space-between;
background: transparent;
padding: 14px 25px;
border-bottom: 1px solid #e0e6ed; }
.mailbox-inbox .action-center .new-control {
font-weight: 600;
color: #3b3f5c; }
.mailbox-inbox .action-center .nav-link {
padding: 0;
display: inline-block; }
.mailbox-inbox .action-center .more-actions .dropdown-menu {
top: 11px !important;
left: 9px !important; }
.mailbox-inbox .action-center .dropdown-menu.d-icon-menu {
padding: 0;
border: 1px solid #e0e6ed;
min-width: 6rem;
-webkit-box-shadow: 0px 0px 0px 1px rgba(136, 142, 168, 0.313725);
box-shadow: 0px 0px 4px 0px rgba(136, 142, 168, 0.313725);
border-radius: 6px;
top: 11px !important;
left: 9px !important; }
.mailbox-inbox .action-center .dropdown-menu.d-icon-menu a {
font-size: 14px;
font-weight: 600;
padding: 10px 23px 10px 43px;
color: #3b3f5c;
letter-spacing: 1px; }
.mailbox-inbox .action-center .dropdown-menu.d-icon-menu a[class*="g-dot-"]:before {
left: 19px; }
.mailbox-inbox .action-center .dropdown-menu.d-icon-menu a.dropdown-item.active, .mailbox-inbox .action-center .dropdown-menu.d-icon-menu a.dropdown-item:active {
background-color: transparent; }
.mailbox-inbox .action-center .dropdown-menu.d-icon-menu a svg {
vertical-align: middle;
font-size: 15px;
margin-right: 7px;
color: #888ea8; }
.mailbox-inbox .action-center .nav-link:after {
display: none; }
.mailbox-inbox .action-center svg {
cursor: pointer;
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 20px;
height: 20px;
fill: #e0e6ed; }
.mailbox-inbox .action-center .nav-link.label-group svg {
margin-right: 12px; }
.mailbox-inbox .action-center svg:not(:last-child) {
margin-right: 12px; }
.mailbox-inbox .action-center svg.revive-mail, .mailbox-inbox .action-center svg.permanent-delete {
display: none; }
.mailbox-inbox .action-center.tab-trash-active .nav-link svg {
display: none; }
.mailbox-inbox .action-center.tab-trash-active svg.action-important, .mailbox-inbox .action-center.tab-trash-active svg.action-spam, .mailbox-inbox .action-center.tab-trash-active svg.action-delete {
display: none; }
.mailbox-inbox .action-center.tab-trash-active svg.revive-mail, .mailbox-inbox .action-center.tab-trash-active svg.permanent-delete {
display: inline-block; }
.mailbox-inbox .more-actions svg.feather-more-vertical {
margin-right: 0; }
.mailbox-inbox .message-box {
padding: 0 0 0 0; }
.mailbox-inbox .message-box .message-box-scroll {
position: relative;
margin: auto;
width: 100%;
overflow: auto;
height: calc(100vh - 231px); }
.mailbox-inbox .mail-item[id*="unread-"] div.mail-item-heading .mail-item-inner .f-body .mail-title {
font-weight: 700;
color: #1b2e4b; }
.mailbox-inbox .mail-item[id*="unread-"] div.mail-item-heading .mail-item-inner .f-body .user-email {
font-weight: 700;
color: #0e1726; }
.mailbox-inbox .mail-item[id*="unread-"] div.mail-item-heading .mail-item-inner .mail-content-excerpt {
font-weight: 600;
color: #1b2e4b; }
.mailbox-inbox .mail-item[id*="unread-"] div.mail-item-heading .mail-item-inner .f-body .meta-time {
font-weight: 700; }
.mailbox-inbox .mail-item div.mail-item-heading {
padding: 11px 10px 11px 0;
cursor: pointer;
position: relative;
background: #fff;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
margin: 9px;
border: 1px solid #e0e6ed;
border-radius: 6px; }
.mailbox-inbox .mail-item div.mail-item-heading:hover {
background: #ebedf2;
border: 1px solid #1b55e2 !important; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner {
padding-left: 15px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .n-chk {
align-self: center; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-head {
align-self: center; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-head img {
width: 35px;
height: 35px;
border-radius: 50%; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body {
align-self: center;
display: flex;
width: 100%; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div.meta-title-tag {
display: flex;
width: 100%;
justify-content: space-between; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div.meta-mail-time {
display: flex;
justify-content: space-between; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .user-email {
padding: 0 15px 0 20px;
min-width: 215px;
max-width: 215px;
font-size: 15px;
color: #607d8b;
margin-bottom: 0;
letter-spacing: 0px;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
align-self: center; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .meta-time {
margin-bottom: 0;
float: right;
font-weight: 500;
font-size: 12px;
min-width: 75px;
max-width: 80px;
text-align: right; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .mail-title {
font-size: 15px;
color: #515365;
margin-bottom: 2px;
letter-spacing: 0px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .tags {
position: relative; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .tags span {
display: none;
margin-left: 11px; }
.mailbox-inbox .mail-item div.mail-item-heading.personal .mail-item-inner .f-body .tags span.g-dot-primary, .mailbox-inbox .mail-item div.mail-item-heading.work .mail-item-inner .f-body .tags span.g-dot-warning, .mailbox-inbox .mail-item div.mail-item-heading.social .mail-item-inner .f-body .tags span.g-dot-success, .mailbox-inbox .mail-item div.mail-item-heading.private .mail-item-inner .f-body .tags span.g-dot-danger {
display: inline-block; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .tags span[class*="g-dot-"]:before {
top: -11px;
left: -13px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt {
font-size: 14px;
margin-bottom: 0;
color: #607d8b;
margin-left: 0;
margin-right: 0;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
width: calc(100vw - 830px);
align-self: center; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt svg.attachment-indicator {
width: 18px;
height: 18px;
margin-right: 5px;
vertical-align: top; }
.mailbox-inbox .mail-item.sentmail div.mail-item-heading .mail-item-inner .mail-content-excerpt, .mailbox-inbox .mail-item.draft div.mail-item-heading .mail-item-inner .mail-content-excerpt {
margin-left: 31px; }
.mailbox-inbox .mail-item div.mail-item-heading .attachments {
width: calc(100vw - 830px);
margin: 0 auto;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
width: calc(100vw - 830px); }
.mailbox-inbox .mail-item div.mail-item-heading .attachments span {
display: inline-block;
border: 1px solid #bfc9d4;
padding: 1px 11px;
border-radius: 30px;
color: #3b3f5c;
background: transparent;
font-size: 12px;
margin-right: 3px;
font-weight: 700;
margin-bottom: 2px;
letter-spacing: 0px;
max-width: 96px;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important; }
/*
=====================
Content Box
=====================
*/
.content-box {
background-color: #f9f9f9;
position: absolute;
top: 0;
height: 100%;
width: 0px;
left: auto;
right: -46px;
overflow: hidden;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px; }
.content-box .msg-close {
padding: 13px;
background: #fff;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.content-box svg.close-message {
font-size: 15px;
color: #3b3f5c;
padding: 3px;
align-self: center;
cursor: pointer;
margin-right: 12px; }
.content-box .mail-title {
font-size: 24px;
font-weight: 600;
color: #1b55e2;
margin-bottom: 0;
align-self: center; }
.mailbox-inbox .collapse {
position: relative;
height: calc(100vh - 180px); }
.mailbox-inbox .mail-content-container {
position: relative;
height: auto;
overflow: auto;
padding: 25px;
border-radius: 6px; }
.mailbox-inbox .mail-content-container .user-info img {
width: 50px;
height: 50px;
border-radius: 50%;
margin-right: 8px;
border: 3px solid #ebedf2; }
.mailbox-inbox .mail-content-container .user-info .avatar {
margin-right: 8px; }
.mailbox-inbox .mail-content-container .user-info .meta-title-tag .mail-usr-name {
margin-bottom: 0;
font-size: 18px;
font-weight: 700;
color: #2196f3; }
.mailbox-inbox .mail-content-container .user-info .user-email {
margin-bottom: 0;
font-weight: 600;
display: inline-block; }
.mailbox-inbox .mail-content-container .user-info .user-email span {
font-size: 16px;
font-weight: 700; }
.mailbox-inbox .mail-content-container .user-info .user-cc-mail {
margin-bottom: 0;
font-weight: 600;
margin-left: 8px;
display: inline-block; }
.mailbox-inbox .mail-content-container .user-info .user-cc-mail span {
font-size: 16px;
font-weight: 700; }
.mailbox-inbox .mail-content-container .user-info .meta-mail-time .meta-time {
display: inline-block;
font-weight: 700; }
.mailbox-inbox .mail-content-container .mail-content-meta-date {
font-size: 13px;
font-weight: 600;
color: #3b3f5c;
display: inline-block;
font-weight: 700; }
.mailbox-inbox .mail-content-container .action-btns a {
margin-right: 20px; }
.mailbox-inbox .mail-content-container .action-btns svg {
color: #acb0c3;
font-weight: 600; }
.mailbox-inbox .mail-content-container .action-btns svg.restore {
position: relative; }
.mailbox-inbox .mail-content-container .action-btns svg.restore:after {
content: '';
height: 28px;
width: 2px;
background: #acb0c3;
position: absolute;
border-radius: 50px;
left: 9px;
transform: rotate(30deg);
top: -3px; }
.mailbox-inbox .mail-content-container .mail-content-title {
font-weight: 600;
font-size: 20px;
color: #515365;
margin-bottom: 25px; }
.mailbox-inbox .mail-content-container p {
font-size: 14px;
color: #3b3f5c; }
.mailbox-inbox .mail-content-container p.mail-content {
padding-top: 45px;
border-top: 1px solid #e0e6ed;
margin-top: 20px; }
.mailbox-inbox .mail-content-container .attachments {
margin-top: 55px;
margin-bottom: 0; }
.mailbox-inbox .mail-content-container .attachments .attachments-section-title {
font-weight: 600;
color: #515365;
font-size: 16px;
border-bottom: 1px solid #e0e6ed;
padding-bottom: 9px;
margin-bottom: 20px; }
.mailbox-inbox .mail-content-container .attachment {
display: inline-block;
padding: 9px;
border-radius: 5px;
margin-bottom: 10px;
cursor: pointer;
min-width: 150px;
max-width: 235px; }
.mailbox-inbox .mail-content-container .attachment svg {
font-size: 18px;
margin-right: 13px;
color: #5c1ac3;
align-self: center; }
.mailbox-inbox .mail-content-container .attachment .file-name {
color: #3b3f5c;
font-size: 12px;
font-weight: 700;
margin-bottom: 0;
word-break: break-word; }
.mailbox-inbox .mail-content-container .attachment .file-size {
color: #3b3f5c;
font-size: 11px;
text-align: left;
font-weight: 700;
margin-bottom: 0; }
#editor-container {
height: 200px; }
.ql-toolbar.ql-snow {
border: 1px solid #e0e6ed;
margin-top: 30px; }
.ql-container.ql-snow {
border: 1px solid #e0e6ed; }
.modal-backdrop {
background-color: #515365; }
.modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.modal-content svg.close {
position: absolute;
right: -7px;
top: -8px;
font-size: 12px;
font-weight: 600;
padding: 2px;
background: #fff;
border-radius: 5px;
opacity: 1;
color: #2196f3;
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: .600s; }
.modal-content svg.close:hover {
box-shadow: none;
transition: .600s;
opacity: 1 !important; }
.compose-box {
background-color: #fff;
border-radius: 6px; }
.compose-box .compose-content form .validation-text {
display: none;
color: #e7515a;
font-weight: 600;
text-align: left;
margin-top: 6px;
font-size: 12px;
letter-spacing: 1px; }
.compose-box .compose-content form .mail-form p {
font-weight: 700;
color: #3b3f5c;
font-size: 16px;
margin-bottom: 0;
align-self: center; }
.compose-box .compose-content form .mail-form select {
padding: 5px;
font-weight: 700;
color: #1b55e2;
margin-left: 10px;
border-radius: 6px;
border: 1px solid #d3d3d3; }
.compose-box .compose-content form .mail-to svg, .compose-box .compose-content form .mail-cc svg, .compose-box .compose-content form .mail-subject svg {
align-self: center;
font-size: 19px;
margin-right: 14px;
color: #1b55e2;
font-weight: 600; }
.compose-box .compose-content form #editor-container h1, .compose-box .compose-content form #editor-container p {
color: #3b3f5c; }
#composeMailModal .modal-content .modal-footer {
border-top: none;
padding-top: 0; }
#composeMailModal .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
#composeMailModal .modal-footer .btn[data-dismiss="modal"] svg {
font-size: 11px;
font-weight: 600;
margin-right: 8px; }
#composeMailModal .modal-footer #btn-reply, #composeMailModal .modal-footer #btn-fwd, #composeMailModal .modal-footer #btn-send {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #1b55e2;
padding: 10px 25px; }
#composeMailModal .modal-footer #btn-reply.disabled, #composeMailModal .modal-footer #btn-fwd.disabled, #composeMailModal .modal-footer #btn-send.disabled {
opacity: .53; }
#composeMailModal .modal-footer #btn-save, #composeMailModal .modal-footer #btn-reply-save, #composeMailModal .modal-footer #btn-fwd-save {
background-color: #009688;
color: #fff;
font-weight: 600;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
@keyframes fadeInUp {
from {
transform: translate3d(0, 40px, 0); }
to {
transform: translate3d(0, 0, 0);
opacity: 1; } }
@-webkit-keyframes fadeInUp {
from {
transform: translate3d(0, 40px, 0); }
to {
transform: translate3d(0, 0, 0);
opacity: 1; } }
.animated {
animation-duration: 1s;
animation-fill-mode: both;
-webkit-animation-duration: 1s;
-webkit-animation-fill-mode: both; }
.animatedFadeInUp {
opacity: 0; }
.fadeInUp {
opacity: 0;
animation-name: fadeInUp;
-webkit-animation-name: fadeInUp; }
@media (min-width: 992px) {
.main-container:not(.sidebar-closed) .mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt {
width: calc(100vw - 857px); }
.main-container:not(.sidebar-closed) .mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .user-email {
min-width: 170px;
max-width: 170px; }
.main-container:not(.sidebar-closed) .mailbox-inbox .mail-item div.mail-item-heading .attachments {
width: calc(100vw - 940px); } }
@media (max-width: 991px) {
.mail-box-container {
overflow-x: hidden;
overflow-y: auto; }
.mailbox-inbox .search input {
border-left: 1px solid #e0e6ed; }
.tab-title {
position: absolute;
z-index: 4;
left: -147px;
width: 0;
background: #fff; }
.tab-title.mail-menu-show {
left: 0;
width: 100%;
min-width: 111px; }
.mailbox-inbox {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%; }
.mailbox-inbox .mail-menu {
margin: 12px 13px 8px 13px; }
.mailbox-inbox .search {
background-color: #fff;
padding: 0; }
.mailbox-inbox .action-center {
padding: 14px 14px; }
.mailbox-inbox .mail-item div.mail-item-heading:hover {
background: transparent;
border: none !important; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner {
padding-left: 14px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt {
width: calc(100vw - 527px); }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .user-email {
min-width: 170px;
max-width: 170px; }
.mailbox-inbox .mail-item div.mail-item-heading .attachments {
width: calc(100vw - 527px);
padding: 0 15px; } }
@media (max-width: 767px) {
.new-control.new-checkbox .new-control-indicator {
margin-right: 10px; }
.mailbox-inbox {
display: block; }
.mailbox-inbox .mail-item div.mail-item-heading {
margin: 0;
padding: 20px 10px 20px 0;
border: none; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-head img {
width: 35px;
height: 35px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body {
display: block; }
.mailbox-inbox .message-box {
width: 100%;
margin-bottom: 40px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div.meta-title-tag {
padding-left: 10px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .user-email {
padding: 0 0 0 10px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .meta-time {
min-width: auto; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt {
width: calc(100vw - 192px);
padding-right: 7px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .tags {
position: absolute;
right: 5px;
top: 23px;
width: 60px; }
.mailbox-inbox .mail-item.sentmail div.mail-item-heading .mail-item-inner .mail-content-excerpt, .mailbox-inbox .mail-item.draft div.mail-item-heading .mail-item-inner .mail-content-excerpt {
margin-left: 0;
width: calc(100vw - 178px); }
.mailbox-inbox .mail-item div.mail-item-heading .attachments {
width: calc(100vw - 192px);
padding: 0 11px; }
.mailbox-inbox .mail-item.sentmail div.mail-item-heading .attachments {
margin: 0 0 0 40px; } }
@media (max-width: 575px) {
.mailbox-inbox .message-box {
margin-bottom: 0; }
.mailbox-inbox .mail-content-container .user-info {
display: block !important; }
.mailbox-inbox .mail-content-container .user-info img {
margin-bottom: 10px; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div {
display: block; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div.meta-mail-time {
display: block; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .meta-time {
margin-bottom: 0;
float: none; }
.mailbox-inbox .mail-item div.mail-item-heading .mail-item-inner .mail-content-excerpt {
margin-left: 0;
margin-right: 0;
width: calc(100vw - 215px); }
.mailbox-inbox .mail-content-container .action-btns a {
margin-right: 0; }
.compose-box .compose-content form .mail-form select {
margin-left: 3px;
margin-top: 10px; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
.tab-title {
width: 100%; }
.mailbox-inbox .mail-content-container .attachment .media .media-body {
flex: none; } }

View File

@ -0,0 +1,664 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.wrapper {
position: relative;
left: 50%;
width: 1000px;
height: 600px;
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0); }
.chat-system {
display: flex;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
height: calc(100vh - 126px); }
.chat-system .hamburger {
display: none; }
.chat-system .user-list-box {
width: 30%;
max-width: 400px;
border-right: 1px solid #ebedf2;
border-bottom-left-radius: 6px;
background: #fff;
border-top-left-radius: 6px; }
.chat-system .user-list-box .search {
position: relative;
padding: 13px 0 13px 0;
display: flex; }
.chat-system .user-list-box .search svg {
content: "\f169";
position: absolute;
left: 11px;
color: #acb0c3;
top: 25px;
left: 30px; }
.chat-system .user-list-box input {
border-radius: 4px;
padding-left: 38px;
font-size: 16px;
width: 100%;
color: #3b3f5c;
border: 0;
outline: none;
padding: 12px 16px 12px 43px;
background: #f1f2f3;
margin: 0 20px 0 20px;
border: 1px dashed #888ea8; }
.chat-system .user-list-box .people {
padding: 0;
overflow: auto;
position: relative;
margin: auto;
width: 100%;
overflow: auto;
height: calc(100vh - 199px); }
.chat-system .user-list-box .people .person {
position: relative;
width: 100%;
padding: 20px 20px;
cursor: pointer;
border-bottom: 1px solid #e0e6ed; }
.chat-system .user-list-box .people .person.border-none {
border-bottom: none; }
.person {
display: inline-block; }
.chat-system .user-list-box .people .person .user-info {
display: flex; }
.chat-system .user-list-box .people .person .user-info .f-head img {
width: 45px;
height: 45px;
margin-right: 12px;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
border: 2px solid #d3d3d3;
box-shadow: 0px 0px 14px 3px rgba(126, 142, 177, 0.24); }
.chat-system .user-list-box .people .person .user-info .f-body {
width: 100%; }
.chat-system .user-list-box .people .person .user-info .f-body .meta-info .user-name {
font-size: 14px;
color: #3b3f5c;
font-weight: 700; }
.chat-system .user-list-box .people .person .user-info .f-body .meta-info .user-meta-time {
font-size: 12px;
position: absolute;
top: 16px;
right: 11px;
color: #888ea8;
font-weight: 700;
float: right; }
.chat-system .user-list-box .people .person .user-info .f-body .preview {
font-size: 13px;
display: inline-block;
overflow: hidden !important;
width: 70%;
white-space: nowrap;
text-overflow: ellipsis;
color: #888ea8;
font-weight: 600; }
.chat-system .user-list-box .people .person:hover .user-info .f-head img {
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.chat-system .user-list-box .people .person:hover .user-info .f-body .meta-info .user-name, .chat-system .user-list-box .people .person:hover .user-info .f-body .meta-info .user-meta-time {
color: #1b55e2; }
.chat-system .user-list-box .people .person.active:after, .chat-system .user-list-box .people .person:hover:after {
display: none; }
.chat-system .chat-box {
position: relative;
width: 100%;
height: 616px;
background-image: url(../../img/bg.png);
border-bottom-right-radius: 6px;
border-top-right-radius: 6px;
height: calc(100vh - 126px); }
.chat-system .chat-box .chat-not-selected {
display: flex;
height: 100%;
justify-content: center; }
.chat-system .chat-box .chat-not-selected p {
align-self: center;
font-size: 18px;
color: #3b3f5c;
margin-bottom: 0;
font-weight: 600;
background: #bfc9d4;
padding: 7px 20px;
border-radius: 6px;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.chat-system .chat-box .chat-not-selected p svg {
vertical-align: middle;
color: #888ea8; }
.chat-system .chat-box .overlay-phone-call {
display: none;
position: absolute;
width: 100%;
height: calc(100vh - 179px);
z-index: 4 !important;
opacity: 0;
transition: all 0.5s ease-in-out;
background-color: #1b55e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%232b50ed' cx='50' cy='0' r='50'/%3E%3Cg fill='%233154ea' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%233658e8' cx='50' cy='100' r='50'/%3E%3Cg fill='%233c5be5' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23415fe2' cx='50' cy='200' r='50'/%3E%3Cg fill='%234662df' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%234b66dc' cx='50' cy='300' r='50'/%3E%3Cg fill='%235069d9' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23546cd5' cx='50' cy='400' r='50'/%3E%3Cg fill='%23596fd2' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%235e72cf' cx='50' cy='500' r='50'/%3E%3Cg fill='%236275cb' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%236678c8' cx='50' cy='600' r='50'/%3E%3Cg fill='%236b7bc4' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%236f7ec0' cx='50' cy='700' r='50'/%3E%3Cg fill='%237381bc' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%237783b8' cx='50' cy='800' r='50'/%3E%3Cg fill='%237c86b4' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%238089b0' cx='50' cy='900' r='50'/%3E%3Cg fill='%23848bac' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23888ea8' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain; }
.chat-system .chat-box .overlay-phone-call.phone-call-show {
display: block;
opacity: 1; }
.chat-system .chat-box .overlay-phone-call > div {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-info {
padding: 20px 16px; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-info svg {
font-size: 28px;
margin-right: 12px;
color: #fff;
vertical-align: middle;
cursor: pointer; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-info .user-name {
font-size: 20px;
color: #fff;
vertical-align: middle;
margin-right: 8px; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-info .call-status {
vertical-align: sub;
color: #fff;
font-size: 10px;
font-weight: 600; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-img {
text-align: center; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-img img {
border-radius: 50%;
border: 4px solid #ebedf2; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-img .timer {
visibility: hidden;
font-size: 16px;
font-weight: 600;
margin-top: 7px;
color: #fff; }
.chat-system .chat-box .overlay-phone-call > div .calling-user-img .timer .minutes, .chat-system .chat-box .overlay-phone-call > div .calling-user-img .timer .seconds {
color: #ffffff; }
.chat-system .chat-box .overlay-phone-call > div .calling-options {
text-align: center; }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg {
font-size: 25px;
border-radius: 50%;
padding: 11px;
background: #2196f3;
margin-bottom: 23px;
color: #fff;
cursor: pointer;
width: 48px;
height: 46px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg:hover {
-webkit-transform: translateY(-5px) scale(1.02);
transform: translateY(-5px) scale(1.02); }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg:not(:last-child) {
margin-right: 7px; }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg.switch-to-microphone {
position: relative; }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg.switch-to-microphone.micro-off:after {
content: '';
height: 35px;
width: 2px;
background: #fff;
position: absolute;
left: 20px;
top: 6px; }
.chat-system .chat-box .overlay-phone-call > div .calling-options svg.cancel-call {
background-color: #e7515a; }
.chat-system .chat-box .overlay-video-call {
display: none;
position: absolute;
width: 100%;
height: calc(100vh - 179px);
z-index: 4 !important;
opacity: 0;
transition: all 0.5s ease-in-out;
background-color: #1b55e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%232b50ed' cx='50' cy='0' r='50'/%3E%3Cg fill='%233154ea' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%233658e8' cx='50' cy='100' r='50'/%3E%3Cg fill='%233c5be5' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23415fe2' cx='50' cy='200' r='50'/%3E%3Cg fill='%234662df' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%234b66dc' cx='50' cy='300' r='50'/%3E%3Cg fill='%235069d9' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23546cd5' cx='50' cy='400' r='50'/%3E%3Cg fill='%23596fd2' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%235e72cf' cx='50' cy='500' r='50'/%3E%3Cg fill='%236275cb' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%236678c8' cx='50' cy='600' r='50'/%3E%3Cg fill='%236b7bc4' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%236f7ec0' cx='50' cy='700' r='50'/%3E%3Cg fill='%237381bc' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%237783b8' cx='50' cy='800' r='50'/%3E%3Cg fill='%237c86b4' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%238089b0' cx='50' cy='900' r='50'/%3E%3Cg fill='%23848bac' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23888ea8' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain; }
.chat-system .chat-box .overlay-video-call.video-call-show {
display: block;
opacity: 1; }
.chat-system .chat-box .overlay-video-call.onConnect {
background-image: url(../../../assets/img/640x426.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
background-attachment: unset; }
.chat-system .chat-box .overlay-video-call .video-caller {
position: absolute;
height: 112px;
width: 173px;
bottom: 8px;
right: 8px; }
.chat-system .chat-box .overlay-video-call > div {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info {
padding: 20px 16px; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info svg {
font-size: 28px;
margin-right: 12px;
color: #fff;
cursor: pointer; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info .user-name {
font-size: 20px;
color: #fff;
margin-right: 8px; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info .call-status {
color: #fff;
font-size: 10px;
font-weight: 600;
margin-top: 10px; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info .timer {
visibility: hidden;
font-size: 16px;
font-weight: 600;
color: #fff; }
.chat-system .chat-box .overlay-video-call > div .calling-user-info .timer .minutes, .chat-system .chat-box .overlay-video-call > div .calling-user-info .timer .seconds {
margin-bottom: 0;
color: #ffffff; }
.chat-system .chat-box .overlay-video-call > div .calling-user-img {
text-align: center; }
.chat-system .chat-box .overlay-video-call > div .calling-user-img img {
border-radius: 50%;
border: 4px solid #ebedf2; }
.chat-system .chat-box .overlay-video-call > div .calling-options {
text-align: center; }
.chat-system .chat-box .overlay-video-call > div .calling-options svg {
border-radius: 50%;
padding: 10px;
background: #2196f3;
margin-bottom: 23px;
color: #fff;
cursor: pointer;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
width: 47px;
height: 48px; }
.chat-system .chat-box .overlay-video-call > div .calling-options svg:hover {
-webkit-transform: translateY(-5px) scale(1.02);
transform: translateY(-5px) scale(1.02); }
.chat-system .chat-box .overlay-video-call > div .calling-options svg:not(:last-child) {
margin-right: 7px; }
.chat-system .chat-box .overlay-video-call > div .calling-options svg.switch-to-microphone {
position: relative; }
.chat-system .chat-box .overlay-video-call > div .calling-options svg.switch-to-microphone.micro-off:after {
content: '';
height: 35px;
width: 2px;
background: #fff;
position: absolute;
transform: rotate(46deg);
left: 20px;
top: 6px; }
.chat-system .chat-box .overlay-video-call > div .calling-options svg.cancel-call {
background-color: #e7515a; }
.chat-system .chat-box .chat-box-inner {
height: auto; }
.chat-system .chat-box .chat-box-inner .chat-meta-user {
display: none; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active {
display: flex;
width: 100%;
justify-content: space-between;
background-color: #fafafa;
border-top-right-radius: 6px; }
.chat-system .chat-box .chat-box-inner .chat-meta-user .current-chat-user-name {
padding: 14px 15px 15px 15px; }
.chat-system .chat-box .chat-box-inner .chat-meta-user .current-chat-user-name span {
font-size: 15px;
color: #888ea8; }
.chat-system .chat-box .chat-box-inner .chat-meta-user .current-chat-user-name span img {
width: 45px;
height: 45px;
border-radius: 7px;
border-radius: 10px;
margin-top: 0px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
margin-right: 10px; }
.chat-system .chat-box .chat-box-inner .chat-meta-user .current-chat-user-name span .name {
color: #0e1726;
font-weight: 600; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn svg {
cursor: pointer;
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 20px;
height: 20px;
fill: rgba(0, 23, 55, 0.08); }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn svg:hover {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn svg:not(:last-child) {
margin-right: 9px; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu {
box-shadow: rgba(113, 106, 202, 0.2) 0px 0px 15px 1px;
top: 15px !important;
padding: 10px;
border-width: initial;
border-style: none;
border-color: initial;
border-image: initial; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu a {
font-size: 12px;
font-weight: 700;
color: #888ea8;
padding: 11px 8px; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu a svg {
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 20px;
height: 20px;
fill: rgba(0, 23, 55, 0.08); }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu a.dropdown-item.active, .chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu a.dropdown-item:active {
background-color: transparent; }
.chat-system .chat-box .chat-box-inner .chat-meta-user.chat-active .chat-action-btn .dropdown-menu a:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.chat-system .chat-box .chat-box-inner .chat-conversation-box {
position: relative;
margin: auto;
width: 100%;
height: calc(100% - 79px);
overflow: auto; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat {
position: relative;
display: none;
overflow: hidden;
padding: 30px 40px 0;
-webkit-justify-content: flex-end;
justify-content: flex-end;
-webkit-flex-direction: column;
flex-direction: column; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat {
display: block;
display: -webkit-flex;
display: flex; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble {
-moz-transition-timing-function: cubic-bezier(0.4, -0.04, 1, 1);
-o-transition-timing-function: cubic-bezier(0.4, -0.04, 1, 1);
-webkit-transition-timing-function: cubic-bezier(0.4, -0.04, 1, 1);
transition-timing-function: cubic-bezier(0.4, -0.04, 1, 1); }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(1) {
-moz-animation-duration: 0.15s;
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(2) {
-moz-animation-duration: 0.3s;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(3) {
-moz-animation-duration: 0.45s;
-webkit-animation-duration: 0.45s;
animation-duration: 0.45s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(4) {
-moz-animation-duration: 0.6s;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(5) {
-moz-animation-duration: 0.75s;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(6) {
-moz-animation-duration: 0.9s;
-webkit-animation-duration: 0.9s;
animation-duration: 0.9s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(7) {
-moz-animation-duration: 1.05s;
-webkit-animation-duration: 1.05s;
animation-duration: 1.05s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(8) {
-moz-animation-duration: 1.2s;
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(9) {
-moz-animation-duration: 1.35s;
-webkit-animation-duration: 1.35s;
animation-duration: 1.35s; }
.chat-system .chat-box .chat-box-inner .chat-conversation-box .chat.active-chat .bubble:nth-of-type(10) {
-moz-animation-duration: 1.5s;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s; }
.chat-system .chat-box .chat-footer {
display: none; }
.chat-system .chat-box .chat-footer.chat-active {
display: block;
padding: 6px 10px;
background: #fafafa;
border-bottom-right-radius: 6px; }
.chat-system .chat-box .chat-form {
position: relative; }
.chat-system .chat-box .chat-input svg {
position: absolute;
color: #888ea8;
left: 11px;
top: 12px;
fill: rgba(0, 23, 55, 0.08); }
.chat-system .chat-box .chat-input input {
font-size: 16px;
width: 100%;
color: #3b3f5c;
border: 0;
outline: none;
padding: 12px 16px 12px 43px;
border: 1px dashed #888ea8;
background: #fafafa; }
.chat-system .chat-box .chat-input input::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: #888ea8; }
.chat-system .chat-box .chat-input input::-moz-placeholder {
/* Firefox 19+ */
color: #888ea8; }
.chat-system .chat-box .chat-input input:-ms-input-placeholder {
/* IE 10+ */
color: #888ea8; }
.chat-system .chat-box .chat-input input:-moz-placeholder {
/* Firefox 18- */
color: #888ea8; }
.chat-system .chat-box .bubble {
font-size: 16px;
position: relative;
display: inline-block;
clear: both;
margin-bottom: 8px;
padding: 9px 18px;
vertical-align: top;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
word-break: break-word;
max-width: 370px; }
.chat-system .chat-box .bubble:before {
position: absolute;
top: 18px;
display: block;
width: 8px;
height: 6px;
content: '\00a0';
-moz-transform: rotate(29deg) skew(-35deg);
-ms-transform: rotate(29deg) skew(-35deg);
-webkit-transform: rotate(29deg) skew(-35deg);
transform: rotate(29deg) skew(-35deg); }
.chat-system .chat-box .bubble.you {
float: left;
color: #1b55e2;
background-color: #f6f6f6;
-webkit-align-self: flex-start;
align-self: flex-start;
-moz-animation-name: slideFromLeft;
-webkit-animation-name: slideFromLeft;
animation-name: slideFromLeft;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.chat-system .chat-box .bubble.you:before {
left: -3px;
background-color: #fff; }
.chat-system .chat-box .bubble.me {
float: right;
color: #fff;
background-color: #1b55e2;
-webkit-align-self: flex-end;
align-self: flex-end;
-moz-animation-name: slideFromRight;
-webkit-animation-name: slideFromRight;
animation-name: slideFromRight;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
.chat-system .chat-box .bubble.me:before {
right: -3px;
background-color: #1b55e2; }
.chat-system .chat-box .conversation-start {
position: relative;
width: 100%;
margin-bottom: 27px;
text-align: center; }
.chat-system .chat-box .conversation-start span {
font-size: 12px;
color: #3b3f5c;
margin-bottom: 0;
font-weight: 700;
background: #fff;
padding: 7px 20px;
border-radius: 6px;
-webkit-box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12); }
@keyframes slideFromLeft {
0% {
margin-left: -200px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0; }
100% {
margin-left: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1; } }
@-webkit-keyframes slideFromLeft {
0% {
margin-left: -200px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0; }
100% {
margin-left: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1; } }
@keyframes slideFromRight {
0% {
margin-right: -200px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0; }
100% {
margin-right: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1; } }
@-webkit-keyframes slideFromRight {
0% {
margin-right: -200px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0; }
100% {
margin-right: 0;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1; } }
.credits {
color: white;
font-size: 11px;
position: absolute;
bottom: 10px;
right: 15px; }
.credits a {
color: white;
text-decoration: none; }
@media (max-width: 1199px) {
.chat-system .user-list-box {
width: 40%; }
.chat-system .chat-box {
width: 60%; }
.chat-system .chat-box .overlay-video-call .video-caller {
height: 68px;
width: 68px; } }
@media (max-width: 991px) {
.chat-system .chat-box {
border-radius: 6px; }
.chat-system .chat-box .overlay-video-call .video-caller {
height: 67px;
width: 83px; } }
@media (max-width: 767px) {
.chat-system .hamburger {
padding: 7px 10px 7px 10px;
font-size: 20px;
border-radius: 0;
color: #fff;
align-self: center;
position: fixed;
top: 218px;
right: 9px;
display: block;
z-index: 78;
background-color: #515365;
border-radius: 50%; }
.chat-system .user-list-box {
position: absolute;
z-index: 40;
left: -341px;
width: 255px; }
.chat-system .user-list-box.user-list-box-show {
position: absolute;
z-index: 34;
left: 15px;
border-radius: 0; }
.chat-system .chat-box {
width: 100%; }
.chat-system .chat-box .overlay-video-call .video-caller {
height: 75px;
width: 110px; } }
@media (max-width: 575px) {
.chat-system .chat-box .overlay-video-call .video-caller {
bottom: 83px; }
.chat-system .chat-box .conversation-start span:before, .chat-system .chat-box .conversation-start span:after {
background-color: transparent; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.chat-system .chat-box .overlay-phone-call {
background-image: none; }
.chat-system .chat-box .overlay-video-call {
background-image: none; }
.chat-system .chat-box .overlay-video-call.onConnect {
background-attachment: local; } }

View File

@ -0,0 +1,442 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
#content:before {
content: '';
position: absolute;
left: 0;
right: 0;
background: rgba(136, 142, 168, 0.211765);
width: 100%;
height: 183px;
z-index: -1; }
.main-container, #content {
min-height: auto; }
/*
App Note Container
*/
.app-note-container {
position: relative;
display: flex; }
.app-note-container .tab-title {
max-width: 210px;
width: 100%; }
.note-sidebar-scroll {
position: relative;
margin: auto;
width: 100%;
overflow: auto;
height: calc(100vh - 202px); }
/*
Group section
*/
.group-section {
font-weight: 600;
font-size: 15px;
color: #3b3f5c;
letter-spacing: 1px;
margin-top: 25px;
margin-bottom: 13px;
padding: 9px 20px; }
.group-section svg {
color: #888ea8;
margin-right: 6px;
vertical-align: text-top;
width: 20px;
height: 20px;
fill: rgba(0, 23, 55, 0.08); }
.app-note-overlay {
display: none;
position: absolute;
width: 100%;
height: 100%;
background: #3b3f5c !important;
z-index: 4 !important;
opacity: 0;
transition: all 0.5s ease-in-out; }
.app-note-overlay.app-note-overlay-show {
display: block;
opacity: .7; }
/*
Tab Title
*/
.tab-title.mail-menu-show {
left: 0;
width: 100%;
min-width: 190px;
height: 100%; }
.tab-title hr {
border-top: 1px solid #0e1726;
max-width: 54px;
margin-top: 25px;
margin-bottom: 25px; }
.tab-title .nav-pills .nav-link.active, .tab-title .nav-pills .show > .nav-link {
background-color: #bfc9d4;
color: #3b3f5c;
font-weight: 700; }
.tab-title .nav-pills a.nav-link {
position: relative;
font-weight: 700;
color: #515365;
padding: 9px 20px;
cursor: pointer;
font-size: 14px;
border-radius: 6px; }
.tab-title .nav-pills a.nav-link svg {
margin-right: 7px;
width: 18px;
height: 18px;
vertical-align: sub; }
.tab-title .nav-pills a.nav-link .mail-badge {
background: #c2d5ff;
border-radius: 50%;
position: absolute;
right: 8px;
padding: 4px 7px;
height: 24px;
width: 23px;
color: #1b55e2;
font-weight: 600; }
.tab-title .nav-pills.group-list .nav-item a {
position: relative;
font-size: 14px;
font-weight: 700;
padding: 9px 15px 9px 50px;
color: #3b3f5c;
letter-spacing: 1px; }
.tab-title .nav-pills.group-list .nav-item a[class*="g-dot-"]:before {
position: absolute;
padding: 4px;
content: '';
border-radius: 50%;
top: 14px;
left: 20px;
border: 2px solid #515365; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-danger:before {
background: #ffe1e2;
border: 1px solid #e7515a; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-primary:before {
background: #bae7ff;
border: 1px solid #2196f3; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-warning:before {
background: #ffeccb;
border: 1px solid #e2a03f; }
.tab-title .nav-pills.group-list .nav-item a.g-dot-success:before {
background: #dccff7;
border: 1px solid #5c1ac3; }
.tab-title .nav-pills .nav-item .dropdown-menu {
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
padding: 0;
border: none; }
.tab-title li.mail-labels a.dropdown-item {
font-size: 13px;
font-weight: 700;
padding: 8px 18px; }
.tab-title li.mail-labels a.dropdown-item:hover {
background-color: #fff;
color: #1b55e2; }
.tab-title li.mail-labels .label:after {
position: absolute;
content: "";
height: 6px;
width: 6px;
border-radius: 50%;
right: 15px;
top: 43%; }
/*Mail Labels*/
/*
Note container
*/
.note-container {
padding: 0 15px;
width: 100%; }
.note-container .switch {
text-align: right;
margin-bottom: 43px; }
.note-container .switch .active-view {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.note-container .switch .view-list, .note-container .switch .view-grid {
padding: 10px;
background: #fff;
border-radius: 5px;
cursor: pointer;
color: #515365;
box-shadow: 0px 2px 4px rgba(126, 142, 177, 0.12);
width: 43px;
height: 41px;
fill: rgba(0, 23, 55, 0.08); }
.note-container.note-grid .note-item {
position: relative;
padding: 16px 16px;
margin-right: 0;
margin-left: 5px;
margin-bottom: 18px;
width: 100%;
max-width: 300px;
border-radius: 6px;
display: inline-flex;
background: #e0e6ed; }
.note-container.note-grid .note-item.note-personal {
background: #bae7ff; }
.note-container.note-grid .note-item.note-work {
background: #ffeccb; }
.note-container.note-grid .note-item.note-important {
background: #ffe1e2; }
.note-container.note-grid .note-item.note-social {
background: #dccff7; }
.note-container.note-grid .note-item .note-inner-content {
border-radius: 4px;
width: 100%;
min-height: 163px; }
.note-container.note-grid .note-item .note-inner-content .note-title {
font-size: 19px;
font-weight: 600;
color: #3b3f5c;
margin-bottom: 11px;
letter-spacing: 0px; }
.note-container.note-grid .note-item .note-inner-content .meta-time {
font-weight: 600;
margin-bottom: 10px;
font-size: 14px;
color: #515365;
display: inline-block;
border-radius: 4px; }
.note-container.note-grid .note-item .note-inner-content .note-description {
font-size: 15px;
font-weight: 600;
margin-bottom: 18px;
letter-spacing: 0px;
word-wrap: break-word; }
.note-container.note-grid .note-item .note-inner-content .note-action {
display: inline-block; }
.note-container.note-grid .note-item .note-inner-content .note-action .fav-note, .note-container.note-grid .note-item .note-inner-content .note-action .delete-note {
padding: 4px;
border-radius: 5px;
cursor: pointer;
color: #515365;
width: 28px;
height: 28px;
fill: rgba(0, 23, 55, 0.08); }
.note-container.note-grid .note-item.note-fav .note-inner-content .note-action .fav-note {
fill: #e2a03f; }
.note-container.note-grid .note-item .note-inner-content .note-action .fav-note:hover {
fill: #e2a03f; }
.note-container.note-grid .note-item .note-inner-content .note-action .delete-note:hover {
color: #e7515a; }
.note-container.note-grid .note-item .note-inner-content .note-footer {
display: inline-block;
float: right; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags {
display: inline-block;
position: relative;
padding: 4px 6px;
border-radius: 4px; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags [class*="g-dot-"] {
content: '';
background: transparent;
border-radius: 50%;
border: 2px solid #acb0c3;
display: inline-block;
height: 11px;
width: 11px;
vertical-align: middle;
display: none; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags .g-dot-personal {
background: #bae7ff;
border: 2px solid #2196f3; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags .g-dot-work {
background: #ffeccb;
border: 2px solid #e2a03f; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags .g-dot-social {
background: #dccff7;
border: 2px solid #5c1ac3; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags .g-dot-important {
background: #ffe1e2;
border: 2px solid #e7515a; }
.note-container.note-grid .note-item.note-personal .note-inner-content .note-footer .tags .g-dot-personal, .note-container.note-grid .note-item.note-work .note-inner-content .note-footer .tags .g-dot-work, .note-container.note-grid .note-item.note-social .note-inner-content .note-footer .tags .g-dot-social, .note-container.note-grid .note-item.note-important .note-inner-content .note-footer .tags .g-dot-important {
display: inline-block; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector {
display: inline-block; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu {
min-width: 8rem; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu a {
font-size: 14px;
padding: 3px 35px;
font-weight: 600;
letter-spacing: 0px;
color: #3b3f5c; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu .dropdown-item.active, .note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu .dropdown-item:active {
background: transparent; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu [class*="g-dot-"]:before {
content: '';
position: absolute;
padding: 4px;
border-radius: 50%;
top: 9px;
left: 10px;
border: 2px solid #515365; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu a.g-dot-important:before {
background: #ffe1e2;
border: 1px solid #e7515a; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu a.g-dot-personal:before {
background: #bae7ff;
border: 1px solid #2196f3; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu a.g-dot-work:before {
background: #ffeccb;
border: 1px solid #e2a03f; }
.note-container.note-grid .note-item .note-inner-content .note-footer .tags-selector .dropdown-menu a.g-dot-social:before {
background: #dccff7;
border: 1px solid #5c1ac3; }
.note-container.note-grid .note-item .note-inner-content .note-footer .nav-link {
padding: 0; }
.note-container.note-grid .note-item .note-inner-content .note-footer .nav-link span {
display: block; }
.note-container.note-grid .note-item .note-inner-content .note-footer .nav-link .feather-more-vertical {
border-radius: 5px;
cursor: pointer;
color: #515365;
width: 20px;
height: 20px; }
.note-container.note-grid .note-item .note-inner-content .note-footer .nav-link .feather-more-vertical:hover {
color: #0e1726; }
.note-container.note-grid .note-item.note-personal .note-inner-content .note-footer .nav-link .feather-more-vertical, .note-container.note-grid .note-item.note-work .note-inner-content .note-footer .nav-link .feather-more-vertical, .note-container.note-grid .note-item.note-social .note-inner-content .note-footer .nav-link .feather-more-vertical, .note-container.note-grid .note-item.note-important .note-inner-content .note-footer .nav-link .feather-more-vertical {
display: none; }
/*
Note Container
*/
/*
=====================
Modal Content
=====================
*/
.modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.modal-content .modal-footer {
border-top: none; }
.modal-content .modal-footer [data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
.modal-content .modal-footer .btn[data-dismiss="modal"] svg {
margin-right: 5px;
width: 18px;
vertical-align: bottom; }
.modal-content .modal-footer #btn-n-add {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #1b55e2;
padding: 10px 25px; }
.modal-content .modal-footer #btn-n-save {
font-weight: 600;
padding: 10px 25px; }
.modal-backdrop {
background-color: #ebedf2; }
.modal-content svg.close {
position: absolute;
right: -7px;
top: -8px;
font-size: 12px;
font-weight: 600;
padding: 3px;
background: #fff;
border-radius: 5px;
opacity: 1;
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: .600s;
color: #3b3f5c; }
.notes-box .notes-content form .note-title {
padding-top: 20px; }
.notes-box .notes-content form .note-description {
padding-top: 40px; }
/*
===============
Note Box
===============
*/
.hamburger {
display: none; }
/*
Media Query
*/
@media (max-width: 2132px) {
.note-container.note-grid .note-item {
max-width: 32%; } }
@media (max-width: 1199px) {
.note-container.note-grid .note-item {
max-width: 48%; } }
@media (max-width: 991px) {
.app-notes {
margin-top: 37px; }
.app-note-container .tab-title {
position: absolute;
z-index: 4;
left: -170px;
width: 0; }
.tab-title.note-menu-show {
left: 0;
width: 100%;
min-width: 190px;
min-height: 485px;
border-radius: 0;
border-bottom-right-radius: 6px;
padding: 11px;
background: #fff; }
.note-sidebar-scroll {
height: 100%; }
.app-hamburger-container {
text-align: right; }
.hamburger {
position: relative;
top: -13px;
padding: 6px 9px 6px 9px;
font-size: 20px;
color: #fff;
align-self: center;
display: inline-block;
background-color: #515365;
border-radius: 50%; } }
@media (max-width: 767px) {
.note-container.note-grid .note-item {
max-width: 47%; } }
@media (max-width: 575px) {
.note-container.note-grid .note-item {
max-width: 100%;
margin-left: 0; } }

View File

@ -0,0 +1,496 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
#content:before {
content: '';
position: absolute;
left: 0;
right: 0;
background: rgba(136, 142, 168, 0.211765);
width: 100%;
height: 183px;
z-index: -1; }
.action-btn p {
display: inline-block;
margin-right: 16px;
margin-bottom: 0;
font-size: 14px;
letter-spacing: 0px;
color: #3b3f5c;
font-weight: 700; }
.action-btn svg {
width: 20px;
height: 20px;
vertical-align: bottom;
margin-right: 3px; }
.modal-backdrop {
background-color: #888ea8; }
.modal-backdrop.show {
opacity: .7; }
#addListModal .modal-dialog {
max-width: 345px; }
#addListModal .modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
#addListModal .compose-box h5 {
font-weight: 700;
font-size: 18px;
color: #3b3f5c;
text-align: center;
margin-bottom: 38px; }
#addListModal .compose-box .list-title {
display: flex; }
#addListModal .compose-box .list-title svg {
align-self: center;
font-size: 19px;
margin-right: 14px;
color: #1b55e2;
font-weight: 600; }
#addListModal .compose-box .list-title input {
border: none;
padding: 10px 16px;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1); }
#addListModal .compose-box .list-title input::-webkit-input-placeholder, #addListModal .compose-box .list-title input::-ms-input-placeholder, #addListModal .compose-box .list-title input::-moz-placeholder {
color: #acb0c3;
font-weight: 600; }
#addListModal .modal-footer {
justify-content: center;
border: none;
padding: 23px 20px; }
#addListModal .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
#addListModal .modal-footer .edit-list {
background-color: #009688;
color: #fff;
font-weight: 600;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
#addListModal .modal-footer .btn.add-list {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
/*Add Task Modal*/
#addTaskModal .compose-box h5 {
font-weight: 700;
font-size: 18px;
color: #515365;
text-align: center;
margin-bottom: 38px; }
#addTaskModal .task-title {
display: flex; }
#addTaskModal .modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
#addTaskModal .modal-content .card {
border: 1px solid #e0e6ed;
margin-bottom: 26px;
border-radius: 6px;
cursor: pointer;
background-color: #fff; }
#addTaskModal .modal-content .card-header {
padding: 0;
padding: 0;
border: none;
background: none; }
#addTaskModal .modal-content .card-header > div {
padding: 13px 21px;
font-weight: 600;
font-size: 16px;
color: #1b55e2; }
#addTaskModal .modal-content svg {
align-self: center;
font-size: 19px;
margin-right: 14px;
color: #1b55e2;
font-weight: 600; }
#addTaskModal .modal-content input {
padding: 10px 16px; }
#addTaskModal .modal-content input[type="range"] {
box-shadow: none;
padding: 0; }
#addTaskModal .modal-content input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
background: #1b55e2;
cursor: pointer;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
#addTaskModal .modal-content input[type="range"]:active::-webkit-slider-thumb {
-webkit-transform: scale(1.2);
transform: scale(1.2);
box-shadow: none; }
#addTaskModal .modal-content input[type="range"]:focus::-webkit-slider-thumb {
box-shadow: none; }
#addTaskModal .modal-content .range-count {
display: inline-block;
margin-left: 6px;
font-size: 16px;
font-weight: 700;
color: #3b3f5c; }
#addTaskModal .modal-content .img-preview {
text-align: center; }
#addTaskModal .modal-content .img-preview img {
width: 280px;
height: 280px;
margin: 0 auto; }
#addTaskModal .modal-content .custom-file .custom-file-label {
margin-bottom: 0; }
#addTaskModal .modal-content .input-group .input-group-append {
height: 40px; }
#addTaskModal .modal-content .custom-file .custom-file-label:after {
height: auto;
display: none; }
#addTaskModal .modal-content .input-group-append .input-group-text {
border: none;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px; }
#addTaskModal .task-badge {
display: flex; }
#addTaskModal .modal-content textarea {
padding: 10px 16px; }
#addTaskModal .modal-footer {
justify-content: center;
border: none;
padding-top: 0; }
#addTaskModal .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
#addTaskModal .modal-footer [data-btnfn="addTask"] {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #1b55e2;
padding: 10px 25px; }
#addTaskModal .modal-footer [data-btnfn="editTask"] {
background-color: #009688;
color: #fff;
font-weight: 600;
border: 1px solid #e0e6ed;
padding: 10px 25px; }
/* Delete Modal*/
#deleteConformation .modal-content {
border: 0;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
padding: 30px; }
#deleteConformation .modal-content .modal-header {
border: none;
padding: 0; }
#deleteConformation .modal-content .modal-header .icon {
padding: 7px 9px;
background: rgba(231, 81, 90, 0.37);
text-align: center;
margin-right: 8px;
border-radius: 50%; }
#deleteConformation .modal-content .modal-header svg {
width: 20px;
color: #e7515a;
fill: rgba(231, 81, 90, 0.37); }
#deleteConformation .modal-content .modal-header .modal-title {
color: #3b3f5c;
font-size: 18px;
font-weight: 700;
align-self: center; }
#deleteConformation .modal-content .modal-body {
padding: 28px 0; }
#deleteConformation .modal-content .modal-body p {
color: #888ea8;
font-size: 15px;
font-weight: 600;
margin-bottom: 0; }
#deleteConformation .modal-content .modal-footer {
padding: 0;
border: none; }
#deleteConformation .modal-content .modal-footer [data-dismiss="modal"] {
background-color: #fff;
color: #e7515a;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
#deleteConformation .modal-content .modal-footer [data-remove="task"] {
color: #fff;
font-weight: 600;
padding: 10px 25px; }
.task-list-section {
display: flex;
overflow-x: auto;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
padding-bottom: 15px; }
.task-list-container {
min-width: 309px;
padding: 0 15px;
width: 467px; }
.task-list-container:first-child {
padding-left: 0; }
.task-list-container:last-child {
padding-right: 0; }
/*
Connect Sorting Div
*/
.connect-sorting {
padding: 15px;
background: #e0e6ed;
border-radius: 10px;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); }
.connect-sorting .task-container-header {
display: flex;
justify-content: space-between;
padding: 18px 5px; }
.connect-sorting .task-container-header .dropdown .dropdown-menu {
padding: 11px; }
.connect-sorting .task-container-header .dropdown .dropdown-menu .dropdown-item {
padding: 5px;
font-size: 14px;
font-weight: 700; }
.connect-sorting .task-container-header .dropdown .dropdown-menu .dropdown-item:hover {
color: #1b55e2; }
.connect-sorting .task-container-header .dropdown .dropdown-menu .dropdown-item.active, .connect-sorting .task-container-header .dropdown .dropdown-menu .dropdown-item:active {
background-color: transparent; }
.connect-sorting .task-container-header h6 {
font-size: 16px;
font-weight: 700; }
.connect-sorting .add-s-task {
cursor: pointer;
transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out; }
.connect-sorting .add-s-task:hover {
-webkit-transform: translateY(-3px);
transform: translateY(-3px); }
.connect-sorting .add-s-task .addTask {
display: block;
color: #ffffff;
font-size: 14px;
font-weight: 600;
text-align: center;
padding: 13px 11px;
border-radius: 4px;
background: #1b55e2; }
.connect-sorting .add-s-task .addTask:hover {
color: #fff; }
.connect-sorting .add-s-task .addTask svg {
width: 18px;
vertical-align: bottom; }
.scrumboard .task-header {
margin-bottom: 25px;
display: flex;
justify-content: space-between;
padding: 20px 20px 0 20px; }
.scrumboard .task-header h4 {
font-size: 16px;
font-weight: 700;
margin-bottom: 0; }
.scrumboard .task-header svg.feather-edit-2 {
width: 18px;
height: 18px;
color: #888ea8;
vertical-align: middle;
fill: rgba(0, 23, 55, 0.08);
cursor: pointer;
padding: 0;
margin-right: 5px; }
.scrumboard .task-header svg.feather-edit-2:hover {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.scrumboard .task-header svg.feather-trash-2 {
color: #e7515a;
margin-right: 6px;
vertical-align: middle;
width: 18px;
height: 18px;
fill: rgba(231, 81, 90, 0.14);
cursor: pointer; }
.scrumboard .task-header svg.feather-trash-2:hover {
fill: rgba(231, 81, 90, 0.37); }
.scrumboard .card {
border: none;
border-radius: 4px;
margin-bottom: 30px;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1); }
.scrumboard .card .card-body {
padding: 0; }
.scrumboard .card .card-body .task-body .task-bottom {
display: flex;
justify-content: space-between;
padding: 12px 15px; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-1 span {
font-size: 13px;
font-weight: 600;
width: 17px;
height: 17px; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-1 span:hover {
color: #1b55e2;
cursor: pointer; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-1 span:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-1 svg {
width: 18px;
vertical-align: bottom; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-1 svg:not(:last-child) {
margin-right: 5px; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg {
width: 18px;
cursor: pointer;
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 18px;
height: 18px;
fill: rgba(0, 23, 55, 0.08); }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg.feather-edit-2 {
width: 18px;
height: 18px;
color: #888ea8;
vertical-align: middle;
fill: rgba(0, 23, 55, 0.08);
cursor: pointer;
padding: 0; }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg.feather-edit-2:hover {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg.feather-trash-2 {
color: #e7515a;
margin-right: 6px;
vertical-align: middle;
width: 18px;
height: 18px;
fill: rgba(231, 81, 90, 0.14); }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg.feather-trash-2:hover {
fill: rgba(231, 81, 90, 0.37); }
.scrumboard .card .card-body .task-body .task-bottom div.tb-section-2 svg:not(:last-child) {
margin-right: 5px; }
.scrumboard .card.img-task .card-body .task-content {
padding: 10px 10px 0 10px; }
.scrumboard .card.img-task .card-body .task-content img {
border-radius: 6px;
height: 105px;
width: 100%; }
.scrumboard .card.simple-title-task .card-body .task-header {
margin-bottom: 0;
padding: 20px; }
.scrumboard .card.simple-title-task .card-body .task-header div:nth-child(1) {
width: 70%; }
.scrumboard .card.simple-title-task .card-body .task-header div:nth-child(2) {
width: 30%;
text-align: right; }
.scrumboard .card.simple-title-task .card-body .task-body .task-bottom {
padding: 3px 15px 11px 15px; }
.scrumboard .card.task-text-progress .card-body .task-content p {
padding: 5px 20px 5px 20px; }
.scrumboard .card.task-text-progress .card-body .task-content > div {
display: flex;
padding: 5px 20px 5px 20px; }
.scrumboard .card.task-text-progress .card-body .task-content .progress {
height: 9px;
width: 100%;
margin-right: 17px;
margin-bottom: 0;
align-self: center; }
.scrumboard .card.task-text-progress .card-body .task-content > div p.progress-count {
padding: 0;
margin-bottom: 0; }
.scrumboard .card.ui-sortable-helper {
background-color: #1b55e2; }
.scrumboard .card.ui-sortable-helper .task-header span {
color: #fff; }
.scrumboard .card.ui-sortable-helper .task-header span svg {
color: #fff; }
.scrumboard .card.ui-sortable-helper .task-header svg.feather-edit-2, .scrumboard .card.ui-sortable-helper .task-header svg.feather-trash-2 {
color: #fff; }
.scrumboard .card.ui-sortable-helper .task-header h4 {
color: #fff; }
.scrumboard .card.ui-sortable-helper.task-text-progress .card-body .task-content p {
color: #fff; }
.scrumboard .card.ui-sortable-helper.task-text-progress .card-body .task-content .progress .progress-bar {
background-color: #2196f3 !important; }
.scrumboard .card.ui-sortable-helper .task-header svg.feather-user {
color: #fff; }
.scrumboard .card.ui-sortable-helper .card-body .task-body .task-bottom div.tb-section-1 {
color: #fff; }
.scrumboard .card.ui-sortable-helper .card-body .task-body .task-bottom div.tb-section-1 svg {
color: #fff; }
.scrumboard .card.ui-sortable-helper .card-body .task-body .task-bottom div.tb-section-2 svg {
color: #fff; }
.scrumboard .card.ui-sortable-helper .card-body .task-content .progress {
box-shadow: none; }
/*
img task
*/
/*
task-text-progress
*/
/*
Style On events
*/
/* On Drag Task */
.ui-state-highlight {
position: relative;
border-color: #1b55e2;
height: 141px;
margin-bottom: 36px;
border-radius: 15px;
border: 1px dashed #1b55e2;
background-image: linear-gradient(45deg, rgba(27, 85, 226, 0.09) 25%, transparent 25%, transparent 50%, rgba(27, 85, 226, 0.09) 50%, rgba(27, 85, 226, 0.09) 75%, transparent 75%, transparent);
background-size: 1rem 1rem;
-webkit-animation: progress-bar-stripes 1s linear infinite;
animation: progress-bar-stripes 1s linear infinite; }
.ui-state-highlight:before {
content: 'Drop';
position: absolute;
left: 41%;
font-size: 19px;
color: #1b55e2;
top: 50%;
margin-top: -16px;
font-weight: 600; }
.connect-sorting-content {
min-height: 80px; }
@keyframes progress-bar-stripes {
0% {
background-position: 1rem 0; }
100% {
background-position: 0 0; } }

View File

@ -0,0 +1,495 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*----------Theme checkbox---------*/
.new-control {
position: relative;
display: -ms-inline-flexbox;
display: inline-flex; }
.new-control-input {
position: absolute;
z-index: -1;
opacity: 0; }
.new-control.new-checkbox {
cursor: pointer; }
.new-control.new-checkbox .new-control-indicator {
position: relative;
top: .25rem;
left: 0;
display: block;
width: 30px;
height: 30px;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #e0e6ed;
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
border-radius: 50%;
margin-right: 13px; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator {
background: #888ea8; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator:after {
display: block; }
.new-control.new-checkbox span.new-control-indicator:after {
border: solid #888ea8;
top: 50%;
left: 50%;
margin-left: -2px;
margin-top: -6px;
width: 5px;
height: 10px;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg);
content: '';
position: absolute;
display: none; }
.new-control.new-checkbox.checkbox-primary > input:checked ~ span.new-control-indicator {
background: transparent;
border: 2px solid #888ea8; }
.mail-box-container {
position: relative;
display: flex;
border-radius: 6px;
background: #fff;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07); }
.mail-overlay {
display: none;
position: absolute;
width: 100vw;
height: 100%;
background: #3b3f5c !important;
z-index: 4 !important;
opacity: 0;
transition: all 0.5s ease-in-out; }
.mail-overlay.mail-overlay-show {
display: block;
opacity: .7; }
.tab-title {
position: relative;
padding: 20px 15px;
max-width: 240px;
border-right: 1px solid #e0e6ed; }
.tab-title svg.feather-clipboard {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216);
margin-bottom: 13px; }
.tab-title h5 {
position: relative;
font-size: 18px;
font-weight: 700;
letter-spacing: 3px;
color: #515365; }
.tab-title #addTask {
position: absolute;
font-size: 14px;
padding: 9px 20px;
border: none;
color: #fff;
bottom: 32px;
left: 17%;
background-color: #1b55e2; }
.tab-title #addTask svg {
margin-right: 5px; }
.tab-title.mail-menu-show {
left: 0;
width: 100%;
min-width: 190px;
height: 100%; }
.tab-title hr {
border-top: 1px solid #ebedf2;
max-width: 54px; }
.tab-title .todoList-sidebar-scroll {
position: relative;
width: 100%;
height: calc(100vh - 306px); }
.tab-title .nav-pills .nav-link.active {
background-color: transparent;
color: #1b55e2;
color: #1b55e2;
background: #ebedf2;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
padding: 10px 12px 10px 14px; }
.tab-title .nav-pills .nav-link.active svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.tab-title .nav-pills a.nav-link {
position: relative;
font-weight: 700;
color: #888ea8;
border-radius: 0;
padding: 20px 0px 20px 15px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.tab-title .nav-pills .nav-link .badge {
border-radius: 50%;
position: absolute;
right: 24px;
padding: 2px 5px;
height: 24px;
width: 23px;
font-weight: 700;
border: 2px solid #e0e6ed;
transform: none; }
.tab-title .nav-pills .nav-link.active .badge {
border: none;
padding: 0 !important;
font-size: 15px;
top: 11px;
color: #1b55e2 !important; }
.tab-title .nav-pills a.nav-link:hover {
color: #1b55e2; }
.tab-title .nav-pills a.nav-link:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.tab-title .nav-pills a.nav-link svg {
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 21px;
height: 21px;
fill: rgba(0, 23, 55, 0.08); }
.tab-title .nav-pills .nav-link#all-list .badge {
color: #3b3f5c; }
.tab-title .nav-pills .nav-link#todo-task-done .badge {
color: #2196f3; }
.tab-title .nav-pills .nav-link#todo-task-important .badge {
color: #e95f2b; }
/*
=====================
Todo Inbox
=====================
*/
.todo-inbox {
position: relative;
overflow-x: hidden;
overflow-y: auto;
max-width: 100%;
width: 100%; }
.todo-inbox .search {
display: flex; }
.todo-inbox .search input {
border: none;
padding: 12px 13px 12px 13px;
border-bottom: 1px solid #e0e6ed;
background: transparent;
border-radius: 0; }
.todo-inbox .mail-menu {
background: #fff;
margin: 7px 13px 7px 13px;
width: 25px;
border-radius: 0;
color: #515365;
align-self: center;
border-bottom: 1px solid #e0e6ed; }
.todo-inbox .todo-item-inner {
display: flex; }
.todo-inbox .message-box {
background: #fff;
padding: 0 0 5px 0; }
.todo-box-scroll {
position: relative;
margin: auto;
width: 100%;
overflow: auto;
height: calc(100vh - 171px); }
.todo-inbox .todo-item {
cursor: pointer;
position: relative; }
.todo-inbox .todo-item:not(:last-child) {
border-bottom: 1px solid #e0e6ed; }
.todo-inbox .todo-item.todo-task-trash {
display: none; }
.todo-inbox .todo-item.todo-task-trash.trash-show {
display: block; }
.todo-inbox .todo-item .todo-item-inner .n-chk {
padding: 20px 10px 20px 10px; }
.todo-inbox .todo-item .todo-item-inner .todo-content {
width: 100%;
padding: 20px 10px 20px 10px; }
.todo-inbox .todo-item .todo-item-inner .todo-heading {
font-size: 18px;
font-weight: 700;
color: #515365;
margin-bottom: 2px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.todo-inbox .todo-item .todo-item-inner:hover .todo-heading {
-webkit-transform: translateY(0) scale(1.01);
transform: translateY(0) scale(1.01); }
.todo-inbox .todo-item .todo-item-inner p.todo-text {
font-size: 14px;
margin-bottom: 0;
color: #acb0c3;
font-weight: 600;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
max-width: calc(100vw - 730px); }
.todo-inbox .todo-item .todo-item-inner:hover .todo-text {
-webkit-transform: translateY(0) scale(1.01);
transform: translateY(0) scale(1.01); }
.todo-inbox .todo-item .todo-item-inner p.meta-date {
margin-bottom: 0;
font-size: 12px;
font-weight: 600;
color: #888ea8;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.todo-inbox .todo-item .todo-item-inner:hover p.meta-date {
-webkit-transform: translateY(0) scale(1.01);
transform: translateY(0) scale(1.01); }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown {
float: right;
padding: 20px 10px 20px 10px; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-toggle {
font-size: 20px; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-toggle.danger svg {
color: #e7515a;
fill: rgba(231, 81, 90, 0.19); }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-toggle.warning svg {
color: #e2a03f;
fill: rgba(233, 176, 43, 0.19); }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-toggle.primary svg {
color: #2196f3;
fill: rgba(33, 150, 243, 0.19); }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu {
left: -45px !important; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a.dropdown-item.active, .todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a.dropdown-item:active {
background: transparent; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a svg {
font-size: 19px;
font-weight: 700;
margin-right: 7px;
vertical-align: middle; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a.danger svg {
color: #e7515a; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a.warning svg {
color: #e2a03f; }
.todo-inbox .todo-item .todo-item-inner .priority-dropdown .dropdown-menu a.primary svg {
color: #2196f3; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-menu .permanent-delete, .todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-menu .revive {
display: none; }
.todo-inbox .todo-item.todo-task-trash .n-chk {
display: none; }
.todo-inbox .todo-item.todo-task-trash .todo-item-inner .todo-content {
width: 100%;
padding: 20px 14px 20px 14px; }
.todo-inbox .todo-item.todo-task-trash .todo-item-inner .priority-dropdown .dropdown-menu {
display: none; }
.todo-inbox .todo-item.todo-task-trash .todo-item-inner .action-dropdown .dropdown-menu .edit, .todo-inbox .todo-item.todo-task-trash .todo-item-inner .action-dropdown .dropdown-menu .important, .todo-inbox .todo-item.todo-task-trash .todo-item-inner .action-dropdown .dropdown-menu .delete {
display: none; }
.todo-inbox .todo-item.todo-task-trash .todo-item-inner .action-dropdown .dropdown-menu .permanent-delete, .todo-inbox .todo-item.todo-task-trash .todo-item-inner .action-dropdown .dropdown-menu .revive {
display: block; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown {
float: right;
padding: 20px 10px 20px 10px; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-menu {
left: -7px !important; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-menu .dropdown-item.active, .todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-menu .dropdown-item:active {
background-color: transparent; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown .dropdown-toggle svg {
width: 21px;
height: 21px;
margin-top: 5px;
color: #888ea8; }
.todo-inbox .todo-item .todo-item-inner .action-dropdown .show .dropdown-toggle svg {
color: #1b2e4b; }
.todo-inbox .todo-item.todo-task-done .todo-item-inner .todo-heading {
text-decoration: line-through; }
.todo-inbox .todo-item.todo-task-done .todo-item-inner p.meta-date, .todo-inbox .todo-item.todo-task-done .todo-item-inner p.todo-text {
text-decoration: line-through; }
.modal-content {
border: none;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.modal-content svg.close {
position: absolute;
right: -7px;
top: -8px;
font-size: 12px;
font-weight: 600;
padding: 2px;
background: #fff;
border-radius: 5px;
opacity: 1;
color: #1b55e2;
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: .600s; }
.modal-content svg.close:hover {
box-shadow: none;
transition: .600s;
opacity: 1 !important; }
#todoShowListItem .task-text {
position: relative;
max-height: 260px;
padding: 0 16px; }
.compose-box {
background-color: #fff;
border-radius: 6px; }
#todoShowListItem .modal-content .modal-body {
padding-left: 0;
padding-right: 0; }
#todoShowListItem .compose-content h5 {
margin-bottom: 19px;
padding-bottom: 19px;
border-bottom: 1px solid #e0e6ed; }
.compose-box .compose-content h5 {
font-weight: 700;
font-size: 18px;
color: #3b3f5c;
text-align: center;
margin-bottom: 35px; }
.compose-box .compose-content .task-text p {
word-break: break-word; }
.compose-box .compose-content .task-text img {
max-width: 100%; }
#todoShowListItem .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
#todoShowListItem .modal-footer .btn[data-dismiss="modal"] svg {
margin-right: 8px;
width: 19px;
height: 19px; }
.compose-box .compose-content form svg {
align-self: center;
font-size: 19px;
margin-right: 14px;
color: #1b55e2;
font-weight: 600; }
.compose-box .compose-content form #taskdescription {
height: 170px; }
.compose-box .compose-content form .validation-text {
display: none;
color: #e7515a;
font-weight: 600;
text-align: left;
margin-top: 6px;
font-size: 12px;
letter-spacing: 1px; }
#addTaskModal .modal-footer {
border-top: none;
padding-top: 0; }
#addTaskModal .modal-footer .btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8;
padding: 10px 25px; }
#addTaskModal .modal-footer .btn.add-tsk {
background-color: #1b55e2;
color: #fff;
font-weight: 600;
border: 1px solid #1b55e2;
padding: 10px 25px; }
#addTaskModal .modal-footer .btn.edit-tsk {
background-color: #8dbf42;
color: #fff;
font-weight: 600;
padding: 10px 25px; }
.modal-backdrop {
background-color: #515365; }
.compose-box .compose-content form #editor-container h1, .compose-box .compose-content form #editor-container p {
color: #3b3f5c; }
@media (max-width: 767px) {
.todo-inbox {
display: block; }
.todo-inbox .message-box {
width: 100%;
margin-bottom: 40px; } }
@media (max-width: 991px) {
.mail-box-container {
overflow-x: hidden;
overflow-y: auto; }
.todo-inbox .search {
border-bottom: 1px solid #e0e6ed; }
.todo-inbox .mail-menu {
border-bottom: none; }
.todo-inbox .search input {
border-right: 1px solid #e0e6ed;
border-bottom: none; }
.todo-inbox .todo-item .todo-item-inner p.todo-text {
max-width: calc(100vw - 228px); }
.tab-title {
position: absolute;
z-index: 4;
left: -100px;
width: 0;
background: #fff; }
.todo-inbox {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%; }
.modal-backdrop {
opacity: 0.8 !important; } }
@media (max-width: 575px) {
.todo-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body > div {
display: block; }
.todo-inbox .mail-item div.mail-item-heading .mail-item-inner .f-body .meta-time {
margin-bottom: 0;
float: none; } }
/*
=====================
IE Support
=====================
*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
.tab-title {
width: 100%; } }
/*
=====================
Mozilla Support
=====================
*/
@-moz-document url-prefix() {
.todo-inbox .todo-item .todo-item-inner .todo-content {
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important; } }

View File

@ -0,0 +1,206 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
html {
height: 100%; }
body {
height: 100%;
overflow: auto;
margin: 0;
padding: 0;
background: #fff; }
.form-container {
display: flex; }
.form-form {
width: 50%;
display: flex;
flex-direction: column;
min-height: 100%; }
.form-form .form-form-wrap {
max-width: 480px;
margin: 0 auto;
min-width: 311px;
min-height: 100%;
height: 100vh;
align-items: center;
justify-content: center; }
.form-form .form-container {
align-items: center;
display: flex;
flex-grow: 1;
padding: .71428571rem 2.85714286rem;
width: 100%;
min-height: 100%; }
.form-form .form-container .form-content {
display: block;
width: 100%; }
.form-form .form-form-wrap .user-meta {
margin-bottom: 35px; }
.form-form .form-form-wrap .user-meta img {
width: 52px;
height: 52px;
border-radius: 50%;
margin-right: 15px;
border: 4px solid #e0e6ed; }
.form-form .form-form-wrap .user-meta div {
align-self: center; }
.form-form .form-form-wrap .user-meta p {
font-size: 31px;
color: #3b3f5c;
margin-bottom: 0; }
.form-form .form-form-wrap h1 .brand-name {
color: #1b55e2;
font-weight: 600; }
.form-form .form-form-wrap p.signup-link {
font-size: 14px;
color: #3b3f5c;
font-weight: 700;
margin-bottom: 50px; }
.form-form .form-form-wrap p.signup-link a {
color: #1b55e2;
border-bottom: 1px solid; }
.form-form .form-form-wrap form .field-wrapper.input {
position: relative;
padding: 11px 0 25px 0;
border-bottom: none; }
.form-form .form-form-wrap form .field-wrapper.input:focus {
border: 1px solid #000; }
.form-form .form-form-wrap form .field-wrapper.toggle-pass p {
font-weight: 600;
color: #3b3f5c;
margin-bottom: 0; }
.form-form .form-form-wrap form .field-wrapper .logged-in-user-name {
font-size: 37px;
color: #3b3f5c; }
.form-form .form-form-wrap form .field-wrapper svg {
position: absolute;
top: 16px;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.form-form .form-form-wrap form .field-wrapper.terms_condition {
margin-bottom: 20px; }
.form-form .form-form-wrap form .field-wrapper.terms_condition label {
font-size: 14px;
color: #888ea8;
padding-left: 31px;
font-weight: 100; }
.form-form .form-form-wrap form .field-wrapper.terms_condition a {
color: #1b55e2; }
.form-form .form-form-wrap form .field-wrapper input {
display: inline-block;
vertical-align: middle;
border-radius: 0;
min-width: 50px;
max-width: 635px;
width: 100%;
min-height: 36px;
background-color: #ffffff;
border: none;
-ms-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
color: #3b3f5c;
font-weight: 700;
font-size: 16px;
border-bottom: 1px solid #e0e6ed;
padding: 0px 0 10px 35px; }
.form-form .form-form-wrap form .field-wrapper input::-webkit-input-placeholder, .form-form .form-form-wrap form .field-wrapper input::-ms-input-placeholder, .form-form .form-form-wrap form .field-wrapper input::-moz-placeholder {
color: #d3d3d3;
font-size: 14px; }
.form-form .form-form-wrap form .field-wrapper input:focus {
border-bottom: 1px solid #1b55e2;
box-shadow: none; }
.form-form .form-form-wrap form .field-wrapper.toggle-pass {
align-self: center;
text-align: left; }
.form-form .form-form-wrap form .field-wrapper.toggle-pass .switch {
margin-bottom: 0;
vertical-align: sub;
margin-left: 7px; }
.form-form .form-form-wrap form .field-wrapper button.btn {
align-self: center; }
.form-form .form-form-wrap form .field-wrapper a.forgot-pass-link {
width: 100%;
font-weight: 700;
color: #1b55e2;
text-align: center;
display: block;
letter-spacing: 2px;
font-size: 15px;
margin-top: 15px; }
.form-form .form-form-wrap form .field-wrapper .n-chk .new-control-indicator {
top: 1px;
border: 1px solid #bfc9d4;
background-color: #f1f2f3; }
.form-form .form-form-wrap form .field-wrapper .n-chk .new-control-indicator:after {
top: 52%; }
.form-form .form-form-wrap form .field-wrapper.keep-logged-in {
margin-top: 60px; }
.form-form .form-form-wrap form .field-wrapper.keep-logged-in label {
font-size: 14px;
color: #888ea8;
padding-left: 31px;
font-weight: 100; }
.form-form .terms-conditions {
max-width: 480px;
margin: 0 auto;
color: #3b3f5c;
font-weight: 600;
margin-top: 90px; }
.form-form .terms-conditions a {
color: #1b55e2;
font-weight: 700; }
.form-image {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
position: fixed;
right: 0;
min-height: auto;
height: 100vh;
width: 50%; }
.form-image .l-image {
background-image: url(https://cdn.pixabay.com/photo/2015/12/10/16/39/shield-1086703_960_720.png);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #060818;
background-position: center center;
background-repeat: no-repeat;
background-size: 75%;
background-position-x: center;
background-position-y: center; }
@media (max-width: 991px) {
.form-form {
width: 100%; }
.form-form .form-form-wrap {
min-width: auto; }
.form-image {
display: none; } }
@media (max-width: 575px) {
.form-form .form-form-wrap form .field-wrapper.toggle-pass {
margin-bottom: 28px; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.form-form .form-form-wrap {
width: 100%; }
.form-form .form-container {
height: 100%; } }

View File

@ -0,0 +1,232 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
html {
height: 100%; }
body {
height: 100%;
overflow: auto;
margin: 0;
padding: 0;
background-color: #fff; }
.form-form {
width: 50%;
display: flex;
flex-direction: column;
min-height: 100%;
margin:0 auto;
}
.form-form .form-form-wrap {
max-width: 480px;
margin: 0 auto;
min-width: 311px;
min-height: 100%;
align-self: center;
width: 100%;
height: 100vh;
justify-content: center; }
.form-form .form-container {
align-items: center;
display: flex;
flex-grow: 1;
width: 100%;
min-height: 100%; }
.form-form .form-container .form-content {
display: block;
width: 100%;
padding: 25px;
background: #fff;
text-align: center;
border-radius: 15px;
border: 1px solid #e0e6ed;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06); }
.form-form .form-container .form-content h1 {
font-size: 32px;
color: #3b3f5c; }
.form-form .form-container .form-content > p {
font-size: 13px;
color: #888ea8;
font-weight: 600;
margin-bottom: 35px; }
.form-form .form-form-wrap .user-meta {
margin-bottom: 35px; }
.form-form .form-form-wrap .user-meta img {
width: 52px;
height: 52px;
border-radius: 50%;
margin-right: 15px;
border: 4px solid #e0e6ed; }
.form-form .form-form-wrap .user-meta div {
align-self: center; }
.form-form .form-form-wrap .user-meta p {
font-size: 31px;
color: #3b3f5c;
margin-bottom: 0; }
.form-form .form-form-wrap h1 .brand-name {
color: #3b3f5c;
font-weight: 600; }
.form-form .form-form-wrap p.signup-link {
font-size: 14px;
color: #3b3f5c;
font-weight: 700;
margin-bottom: 15px;
text-align: center;
margin-top: 50px; }
.form-form .form-form-wrap p.signup-link.register {
font-size: 13px;
color: #888ea8;
font-weight: 600;
margin-bottom: 25px;
margin-top: 0; }
.form-form .form-form-wrap p.signup-link.recovery {
margin-top: 0; }
.form-form .form-form-wrap p.signup-link a {
color: #1b55e2;
border-bottom: 1px solid; }
.form-form .form-form-wrap form .field-wrapper {
width: 100%; }
.form-form .form-form-wrap form .field-wrapper.input {
padding: 11px 0px 16px 0;
border-bottom: none;
position: relative; }
.form-form .form-form-wrap form .field-wrapper.input:focus {
border: 1px solid #000; }
.form-form .form-form-wrap form .field-wrapper.toggle-pass p {
font-weight: 600;
color: #3b3f5c;
margin-bottom: 0; }
.form-form .form-form-wrap form .field-wrapper .logged-in-user-name {
font-size: 37px;
color: #3b3f5c; }
.form-form .form-form-wrap form .field-wrapper label {
font-size: 10px;
font-weight: 700;
color: #3b3f5c;
margin-bottom: 8px; }
.form-form .form-form-wrap form .field-wrapper.terms_condition {
margin-bottom: 20px; }
.form-form .form-form-wrap form .field-wrapper.terms_condition label {
font-size: 14px;
color: #888ea8;
padding-left: 31px;
font-weight: 100; }
.form-form .form-form-wrap form .field-wrapper.terms_condition a {
color: #1b55e2; }
.form-form .form-form-wrap form .field-wrapper svg.feather-user {
top: 53px; }
.form-form .form-form-wrap form .field-wrapper svg.feather-lock {
top: 50px; }
.form-form .form-form-wrap form .field-wrapper svg.feather-at-sign {
top: 47px; }
.form-form .form-form-wrap form .field-wrapper svg.feather-at-sign.register {
top: 53px; }
.form-form .form-form-wrap form .field-wrapper svg:not(.feather-eye) {
position: absolute;
left: 12px;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08);
width: 20px;
height: 20px; }
.form-form .form-form-wrap form .field-wrapper svg.feather-eye {
position: absolute;
top: 49px;
right: 13px;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08);
width: 17px;
cursor: pointer; }
.form-form .form-form-wrap form .field-wrapper input {
display: inline-block;
vertical-align: middle;
border-radius: 6px;
min-width: 50px;
max-width: 635px;
width: 100%;
-ms-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
color: #3b3f5c;
font-weight: 600;
font-size: 16px;
padding: 13px 35px 13px 46px; }
.form-form .form-form-wrap form .field-wrapper input::-webkit-input-placeholder, .form-form .form-form-wrap form .field-wrapper input::-ms-input-placeholder, .form-form .form-form-wrap form .field-wrapper input::-moz-placeholder {
color: #d3d3d3;
font-size: 14px; }
.form-form .form-form-wrap form .field-wrapper button.btn {
align-self: center;
width: 100%;
padding: 11px 14px;
font-size: 16px;
letter-spacing: 2px; }
.form-form .form-form-wrap form .field-wrapper a.forgot-pass-link {
font-weight: 600;
color: #888ea8;
display: block;
letter-spacing: 1px;
font-size: 12px;
margin-bottom: 8px; }
.form-form .form-form-wrap form .field-wrapper .n-chk .new-control-indicator {
top: 2px;
border: 1px solid #bfc9d4;
background-color: #f1f2f3; }
.form-form .form-form-wrap form .field-wrapper .n-chk .new-control-indicator:after {
top: 54%; }
.new-control.new-checkbox.checkbox-primary > input:checked ~ span.new-control-indicator {
border: none; }
.form-form .form-form-wrap form .division {
text-align: center;
font-size: 13px;
margin: 35px 0 38px 0; }
.form-form .form-form-wrap form .social {
text-align: center; }
.form-form .form-form-wrap form .social a {
background: transparent;
box-shadow: none;
border: 1px solid #e0e6ed;
padding: 12px 10px;
width: 181px; }
.form-form .form-form-wrap form .social a.social-fb {
margin-right: 15px; }
.form-form .form-form-wrap form .social a.social-fb svg, .form-form .form-form-wrap form .social a.social-fb .brand-name {
color: #1b55e2; }
@media (max-width: 991px) {
.form-form {
width: 100%; }
.form-form .form-form-wrap {
min-width: auto;
margin: 0 auto; }
.form-form .form-container .form-content {
border-radius: 15px; } }
@media (max-width: 575px) {
.form-form .form-form-wrap form .field-wrapper.toggle-pass {
margin-bottom: 28px; }
.form-form .form-form-wrap form .social a.social-fb, .form-form .form-form-wrap form .social a.social-github {
margin-right: auto;
margin-left: auto;
margin-bottom: 10px;
display: block; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.form-form .form-form-wrap {
width: 100%; }
.form-form .form-container {
height: 100%; } }
@supports (-ms-ime-align: auto) {
.form-form .form-form-wrap {
height: 100%; } }

View File

@ -0,0 +1,440 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Component Card 1
*/
.component-card_1 {
border: 1px solid #e0e6ed;
border-radius: 6px;
width: 19rem;
margin: 0 auto;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_1 .card-body {
padding: 28px 25px; }
.component-card_1 .icon-svg {
margin-bottom: 20px;
display: inline-block;
background: #3b3f5c;
padding: 12px;
border-radius: 50%;
color: #f1f2f3; }
.component-card_1 svg {
width: 20px;
height: 20px; }
.component-card_1 .card-title {
font-size: 20px;
font-weight: 600;
letter-spacing: 1px;
margin-bottom: 15px; }
.component-card_1 .card-text {
color: #888ea8; }
/*
Component Card 2
*/
.component-card_2 {
border: 1px solid #e0e6ed;
border-radius: 6px;
width: 18rem;
margin: 0 auto;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_2 .card-body {
padding: 22px 20px; }
.component-card_2 .card-title {
font-size: 20px;
font-weight: 700;
letter-spacing: 1px;
margin-bottom: 15px; }
.component-card_2 .card-text {
color: #888ea8;
line-height: 22px; }
.component-card_2 a.btn-primary {
margin: 26px 0 0 0;
padding: 10px 16px;
background: #f8538d !important;
border-color: #f8538d; }
/*
Component Card 3
*/
.component-card_3 {
border: none;
border-radius: 8px;
background: #3b3f5c;
width: 18rem;
margin: 0 auto;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_3 .card-body {
padding: 22px 20px;
text-align: center; }
.component-card_3 .card-body img {
width: 85px;
height: 85px;
margin-bottom: 25px;
border-radius: 50%; }
.component-card_3 .card-body h5.card-user_name {
font-size: 15px;
color: #fff;
letter-spacing: 1px;
font-weight: 600; }
.component-card_3 .card-body p.card-user_occupation {
font-size: 14px;
color: #acb0c3;
letter-spacing: 1px; }
.component-card_3 .card-body .card-star_rating {
margin-bottom: 24px; }
.component-card_3 .card-body .card-star_rating svg {
width: 20px;
color: #e2a03f; }
.component-card_3 .card-body .card-star_rating svg.fill {
fill: #e2a03f; }
.component-card_3 .card-body .card-text {
color: #acb0c3;
font-style: italic;
font-size: 14px;
letter-spacing: 1px; }
/*
Component Card 4
*/
.component-card_4 {
width: 30rem;
margin: 0 auto;
border: none;
border: 1px solid #e0e6ed;
border-radius: 8px;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_4 .card-body {
padding: 0;
display: flex; }
.component-card_4 .user-profile {
align-self: center;
padding: 0 25px; }
.component-card_4 img {
border-radius: 50%; }
.component-card_4 .user-info {
padding: 24px 8px 24px 0px; }
.component-card_4 .card-user_name {
font-size: 16px;
font-weight: 700;
margin-bottom: 10px; }
.component-card_4 .card-user_occupation {
color: #888ea8;
font-size: 13px; }
.component-card_4 .card-star_rating span {
display: inline-block;
padding: 0px 8px;
font-size: 15px;
border-radius: 50px;
margin-bottom: 22px; }
.component-card_4 .card-star_rating svg {
width: 16px;
vertical-align: bottom; }
.component-card_4 .card-text {
color: #515365;
font-size: 14px;
letter-spacing: 1px;
font-weight: 600;
line-height: 23px; }
/*
Component Card 5
*/
.component-card_5 {
width: 20rem;
margin: 0 auto;
border: none;
border-radius: 8px;
background: #5c1ac3;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_5 .card-body {
padding: 30px 30px; }
.component-card_5 .card-body .user-info {
display: flex;
padding: 22px 0 0 0; }
.component-card_5 .card-body .media-body {
align-self: center; }
.component-card_5 .card-body img {
width: 56px;
height: 56px;
margin-right: 18px;
border-radius: 50%; }
.component-card_5 .card-body h5.card-user_name {
font-size: 15px;
color: #fff;
letter-spacing: 1px;
font-weight: 600;
margin-bottom: 3px; }
.component-card_5 .card-body p.card-user_occupation {
font-size: 14px;
color: #acb0c3;
letter-spacing: 1px;
margin-bottom: 0; }
.component-card_5 .card-body .card-text {
color: #f1f2f3;
font-size: 14px;
letter-spacing: 1px; }
/*
Component Card 6
*/
.component-card_6 {
border-radius: 8px;
background: #fff;
border: 1px solid #e0e6ed;
width: 19rem;
margin: 0 auto;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_6 .card-body {
padding: 30px 30px; }
.component-card_6 .card-body .user-info {
display: flex;
padding: 13px 0 0 0; }
.component-card_6 .card-body .media-body {
align-self: center; }
.component-card_6 .card-body img {
width: 56px;
height: 56px;
margin-right: 18px;
border-radius: 50%; }
.component-card_6 .card-body h5.card-user_name {
font-size: 16px;
color: #3b3f5c;
letter-spacing: 1px;
font-weight: 700;
margin-bottom: 3px; }
.component-card_6 .card-body p.card-user_occupation {
font-size: 14px;
color: #888ea8;
letter-spacing: 1px;
margin-bottom: 0; }
.component-card_6 .card-body .card-text {
color: #515365;
font-style: italic;
font-size: 14px;
letter-spacing: 1px;
font-weight: 600; }
.component-card_6 .card-body .card-star_rating svg {
width: 12px;
color: #e2a03f; }
.component-card_6 .card-body .card-star_rating svg.fill {
fill: #e2a03f; }
/*
Component Card 7
*/
.component-card_7 {
background-color: #1b55e2;
color: #fff;
border: none;
width: 18rem;
margin: 0 auto;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_7 .card-body {
padding: 23px 10px;
text-align: center; }
.component-card_7 .card-text, .component-card_7 .rating-count {
color: #fff;
margin-bottom: 20px; }
.component-card_7 .rating-stars svg {
width: 18px;
color: #e2a03f; }
.component-card_7 .rating-stars svg.fill {
fill: #e2a03f; }
/*
Component Card 8
*/
.component-card_8 {
background: #fff;
border: 1px solid #e0e6ed;
width: 24rem;
margin: 0 auto;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_8 .progress-order .progress-order-header h6 {
color: #0e1726;
font-weight: 600;
font-size: 16px; }
.component-card_8 .progress-order .progress-order-header span.badge {
font-size: 12px;
padding: 6px 10px;
color: #1b55e2;
background-color: #c2d5ff; }
.component-card_8 .progress-order .progress-order-body ul li img {
width: 40px;
height: 40px; }
.component-card_8 .progress-order .progress-order-body ul li.badge-notify {
position: relative; }
.component-card_8 .progress-order .progress-order-body ul li.badge-notify .notification {
position: absolute;
top: -15px;
right: -34px; }
.component-card_8 .progress-order .progress-order-body ul li.badge-notify .notification span.badge {
background-color: #fff;
color: #1b55e2;
box-shadow: 0 0 20px 0 #d0d0d0;
font-size: 12px;
padding: 4px 7px; }
.component-card_8 .progress-order .progress-order-body .p-o-percentage {
font-size: 14px;
color: #1b55e2; }
.component-card_8 .progress-order .progress-order-body .progress {
height: 6px;
border-radius: 30px; }
.component-card_8 .progress-order .progress-order-body .progress .p-o-progress {
border-radius: 30px; }
.pending-order {
padding: 22px 20px; }
/*
Component Card 9
*/
.component-card_9 {
border: 1px solid #e0e6ed;
border-radius: 6px;
width: 22rem;
margin: 0 auto;
-webkit-box-shadow: 4px 6px 10px -3px #bfc9d4;
box-shadow: 4px 6px 10px -3px #bfc9d4; }
.component-card_9 .card-body {
padding: 22px 20px; }
.component-card_9 .meta-date {
margin-bottom: 5px;
font-size: 12px;
font-weight: 600;
color: #1b55e2; }
.component-card_9 .card-title {
font-size: 15px;
font-weight: 700;
letter-spacing: 1px;
margin-bottom: 15px; }
.component-card_9 .card-text {
color: #888ea8;
line-height: 22px; }
.component-card_9 .meta-info {
position: relative;
display: flex;
justify-content: space-between;
margin-top: 25px;
padding-top: 15px; }
.component-card_9 .meta-info:before {
content: '';
position: absolute;
height: 1px;
width: 215px;
background: #e0e6ed;
top: 0;
right: 0;
left: 0;
margin-right: auto;
margin-left: auto; }
.component-card_9 .meta-user {
display: flex; }
.component-card_9 .avatar {
position: relative;
display: inline-block;
width: 34px;
height: 34px;
font-size: 1rem;
margin-right: 10px; }
.component-card_9 .avatar .avatar-title {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background-color: #515365;
color: #e0e6ed;
font-size: 14px; }
.component-card_9 .user-name {
align-self: center;
color: #515365;
font-weight: 600; }
.component-card_9 .meta-action {
display: flex; }
.component-card_9 .meta-likes {
align-self: center;
margin-right: 13px;
color: #1b55e2; }
.component-card_9 .meta-likes svg {
width: 16px;
vertical-align: sub;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.component-card_9 .meta-view {
align-self: center;
color: #1b55e2; }
.component-card_9 .meta-view svg {
width: 16px;
vertical-align: sub;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
/*
Media Queries
*/
@media (max-width: 575px) {
/*
Component Card 1
*/
.component-card_1, .component-card_2, .component-card_3 {
width: auto; }
/*
Component Card 2
*/
/*
Component Card 3
*/
/*
Component Card 4
*/
.component-card_4 {
width: auto;
text-align: center; }
.component-card_4 .card-body {
padding: 0;
display: block; }
.component-card_4 .user-info {
padding: 0 25px 25px 25px; }
.component-card_4 .user-profile {
align-self: center;
padding: 25px 25px; }
/*
Component Card 5
*/
.component-card_5, .component-card_6, .component-card_7, .component-card_8 {
width: auto; }
/*
Component Card 6
*/
/*
Component Card 7
*/
/*
Component Card 8
*/
/*
Component Card 9
*/
.component-card_9 {
width: auto; }
.component-card_9 .meta-info {
display: block; }
.component-card_9 .meta-action {
margin-top: 16px; }
.component-card_9 .meta-info:before {
width: 50%; } }

View File

@ -0,0 +1,152 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.carousel-caption h3, .carousel-caption h5 {
color: #fff; }
/* style-custom-1 */
.style-custom-1 .carousel-inner {
border-radius: 10px; }
.style-custom-1 .carousel-item {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d; }
.style-custom-1 .carousel-caption {
position: absolute;
right: auto;
left: 44px;
color: #fff;
text-align: left;
width: 50%;
top: 50%;
transform: translateY(-50%);
bottom: initial; }
.style-custom-1 .carousel-caption .badge {
padding: 6px 16px;
font-weight: 700;
letter-spacing: 2px;
background-color: #4dcf8f;
color: #fff;
font-size: 13px;
margin-bottom: 35px; }
.style-custom-1 .carousel-caption h3 {
font-weight: 600;
color: #fff;
font-size: 28px;
letter-spacing: 2px;
margin-bottom: 36px; }
.style-custom-1 .carousel-caption .media img {
width: 49px;
height: 49px;
border-radius: 50%;
margin-right: 15px; }
.style-custom-1 .carousel-caption .media .media-body .user-name {
color: #fff;
font-size: 15px;
margin-bottom: 0; }
.style-custom-1 .carousel-caption .media .media-body .meta-time {
color: #fff;
font-size: 12px;
margin-bottom: 0; }
.style-custom-1 .carousel-caption .media .media-body .meta-time svg {
vertical-align: bottom;
width: 17px; }
.style-custom-1 .carousel-indicators {
top: 45%;
bottom: auto;
display: block;
left: auto;
margin: auto;
right: 33px; }
.style-custom-1 .carousel-control-next, .style-custom-1 .carousel-control-prev {
top: auto;
bottom: 32px;
background-color: transparent; }
.style-custom-1 .carousel-indicators li {
width: 9px;
height: 10px;
border-radius: 10px;
border: none;
margin-top: 0;
margin-bottom: 9px; }
.style-custom-1 .carousel-indicators li.active {
height: 32px;
border-radius: 10px; }
.style-custom-1 .carousel-control-prev {
right: 100px;
left: auto; }
.style-custom-1 .carousel-control-prev .carousel-control-prev-icon {
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-left'%3e%3cline x1='19' y1='12' x2='5' y2='12'%3e%3c/line%3e%3cpolyline points='12 19 5 12 12 5'%3e%3c/polyline%3e%3c/svg%3e");
width: 26px;
height: 26px; }
.style-custom-1 .carousel-control-next {
right: 40px;
left: auto; }
.style-custom-1 .carousel-control-next .carousel-control-next-icon {
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3e%3cline x1='5' y1='12' x2='19' y2='12'%3e%3c/line%3e%3cpolyline points='12 5 19 12 12 19'%3e%3c/polyline%3e%3c/svg%3e");
width: 26px;
height: 26px; }
/*
Default Style of the carousel arrows
*/
.carousel-control-next, .carousel-control-prev {
top: 0;
bottom: 0;
width: 50px;
height: 50px;
border-radius: 50px;
background-color: rgba(255, 255, 255, 0.2);
display: -ms-flexbox;
-ms-flex-align: center;
-ms-flex-pack: center;
margin: auto 10px auto 10px; }
/*
@media Query
*/
@media (max-width: 768px) {
.style-custom-1 {
min-height: 392px; }
.style-custom-1 .carousel-caption {
top: 8%;
transform: translateY(0); }
.style-custom-1 .carousel-indicators {
top: 16%; }
.style-custom-1 .carousel-inner {
min-height: 392px; }
.style-custom-1 .carousel-item {
min-height: 392px; }
.style-custom-1 .carousel-item img.slide-image {
min-height: 392px; } }
@media (max-width: 575px) {
.style-custom-1 .carousel-caption {
width: 78%;
left: 30px; }
.style-custom-1 .carousel-indicators {
display: flex;
top: auto;
bottom: 22px;
right: 0;
left: 0; }
.style-custom-1 .carousel-indicators li.active {
width: 26px;
border-radius: 18px;
height: 10px; }
.style-custom-1 .carousel-control-next, .style-custom-1 .carousel-control-prev {
display: none; } }

View File

@ -0,0 +1,70 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Countdown Simple
*/
#cd-simple {
display: flex;
justify-content: space-around;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
#cd-simple .countdown {
margin-bottom: 23px; }
#cd-simple .clock-count-container {
width: 100px;
height: 100px;
-webkit-box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
border-radius: 6px;
display: flex;
justify-content: center;
flex-direction: column;
border: 1px solid #e0e6ed; }
#cd-simple .clock-val {
font-size: 35px;
color: #1b55e2;
margin-bottom: 0; }
#cd-simple .clock-text {
color: #3b3f5c;
font-size: 15px;
margin-bottom: 0;
margin-top: 16px; }
/*
Countdown Circle
*/
#cd-circle {
display: flex;
justify-content: space-around;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
#cd-circle .countdown {
margin-bottom: 23px; }
#cd-circle .clock-count-container {
width: 85px;
height: 85px;
-webkit-box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
border-radius: 50%;
display: flex;
justify-content: center;
flex-direction: column;
border: 1px solid #e0e6ed;
margin: 0 0 12px 0; }
#cd-circle .clock-val {
font-size: 25px;
color: #1b55e2;
margin-bottom: 0; }
#cd-circle .clock-text {
color: #3b3f5c;
font-size: 15px;
margin-bottom: 0;
margin-top: 16px; }

View File

@ -0,0 +1,76 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Simple Counter
*/
.simple--counter-container {
display: flex;
justify-content: space-around;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
.simple--counter-container .counter-container {
margin-bottom: 23px; }
.simple--counter-container .counter-container .counter-content {
width: 100px;
height: 100px;
-webkit-box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
border-radius: 6px;
display: flex;
justify-content: center;
flex-direction: column;
border: 1px solid #e0e6ed; }
.simple--counter-container .s-counter {
font-size: 35px;
color: #1b55e2;
margin-bottom: 0; }
.simple--counter-container .s-counter-text {
color: #3b3f5c;
font-size: 15px;
margin-bottom: 0;
margin-top: 16px; }
/*
With Icon
*/
.icon--counter-container {
display: flex;
justify-content: space-around;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
.icon--counter-container .counter-container {
margin-bottom: 23px; }
.icon--counter-container .counter-ico {
color: #1b55e2;
font-size: 28px;
width: 30px;
height: 30px;
margin-bottom: 6px; }
.icon--counter-container .counter-content {
width: 85px;
height: 85px;
-webkit-box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
box-shadow: 1px 2px 12px 0 rgba(31, 45, 61, 0.1);
border-radius: 50%;
display: flex;
justify-content: center;
flex-direction: column;
border: 1px solid #e0e6ed;
margin: 0 0 12px 0; }
.icon--counter-container .ico-counter {
font-size: 25px;
color: #3b3f5c;
margin-bottom: 0; }
.icon--counter-container .ico-counter-text {
color: #888ea8;
font-size: 13px;
font-weight: 100;
letter-spacing: 1px; }

View File

@ -0,0 +1,215 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
==================
Switches
==================
*/
/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 35px;
height: 18px; }
.switch input {
display: none; }
.switch .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ebedf2;
-webkit-transition: .4s;
transition: .4s; }
.switch .slider:before {
position: absolute;
content: "";
background-color: white;
-webkit-transition: .4s;
-ms-transition: .4s;
transition: .4s;
height: 14px;
width: 14px;
left: 2px;
bottom: 2px;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch input:checked + .slider:before {
-webkit-transform: translateX(17px);
-ms-transform: translateX(17px);
transform: translateX(17px); }
.switch .slider.round {
border-radius: 34px; }
.switch .slider.round:before {
border-radius: 50%; }
.switch.s-secondary input:checked + .slider {
background-color: #5c1ac3; }
.switch.s-secondary input:focus + .slider {
box-shadow: 0 0 1px #5c1ac3; }
/* Hide default HTML checkbox */
/* The slider */
/* Rounded Slider Switches */
/*----------Theme checkbox---------*/
.new-control {
position: relative;
display: -ms-inline-flexbox;
display: inline-flex;
padding-left: 1.5rem;
margin-right: 1rem; }
.new-control-input {
position: absolute;
z-index: -1;
opacity: 0; }
.new-control.new-checkbox {
cursor: pointer;
color: #3b3f5c;
margin-bottom: 0; }
.new-control.new-checkbox .new-control-indicator {
position: absolute;
top: .25rem;
left: 0;
display: block;
width: 1rem;
height: 1rem;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #e0e6ed;
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
border-radius: 2px; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator {
background: #888ea8; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator:after {
display: block; }
.new-control.new-checkbox span.new-control-indicator:after {
border: solid #fff;
top: 50%;
left: 50%;
margin-left: -2px;
margin-top: -6px;
width: 5px;
height: 10px;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg);
content: '';
position: absolute;
display: none; }
.new-control.new-checkbox[class*="checkbox-outline-"] > input:checked ~ span.new-control-indicator {
background-color: transparent; }
.new-control.new-checkbox.new-checkbox-line-through.checkbox-outline-primary > input:checked ~ span.new-chk-content {
color: #1b55e2; }
.new-control.new-checkbox.checkbox-outline-primary > input:checked ~ span.new-control-indicator {
border: 1px solid #1b55e2; }
.new-control.new-checkbox.checkbox-outline-primary > input:checked ~ span.new-control-indicator:after {
border-color: #1b55e2; }
.new-control.new-checkbox.checkbox-primary > input:checked ~ span.new-control-indicator {
background: #1b55e2; }
.list-group-item {
border: 1px solid #e0e6ed;
padding: 10px 12px; }
.list-group-item.active {
color: #fff;
background-color: #888ea8;
border-color: transparent;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.15); }
.new-control-indicator {
background-color: #f1f2f3; }
a.list-group-item.list-group-item-action.active i {
color: #010156; }
code {
color: #e7515a; }
.list-group-item-action:hover {
color: #3b3f5c;
background-color: #f1f2f3;
box-shadow: 0px 0px 12px 1px rgba(113, 106, 202, 0.08); }
/*------list group-----*/
/*
Icons Meta
*/
.list-group.list-group-icons-meta .list-group-item.active {
background-color: #888ea8; }
.list-group.list-group-icons-meta .list-group-item.active .media svg {
font-size: 27px;
color: #fff; }
.list-group.list-group-icons-meta .list-group-item.active .media .media-body h6, .list-group.list-group-icons-meta .list-group-item.active .media .media-body p {
color: #fff;
font-weight: 500; }
.list-group.list-group-icons-meta .list-group-item .media svg {
width: 20px;
color: #1b55e2;
height: 20px; }
.list-group.list-group-icons-meta .list-group-item .media .media-body h6 {
color: #3b3f5c;
font-weight: 700;
margin-bottom: 0;
font-size: 15px;
letter-spacing: 1px; }
.list-group.list-group-icons-meta .list-group-item .media .media-body p {
color: #3b3f5c;
margin-bottom: 0;
font-size: 12px;
font-weight: 600; }
.list-group.list-group-media .list-group-item.active {
background-color: #888ea8; }
.list-group.list-group-media .list-group-item.active .media .media-body h6, .list-group.list-group-media .list-group-item.active .media .media-body p {
color: #fff;
font-weight: 500; }
.list-group.list-group-media .list-group-item .media img {
color: #1b55e2;
width: 42px;
height: 42px; }
.list-group.list-group-media .list-group-item .media .media-body {
align-self: center; }
.list-group.list-group-media .list-group-item .media .media-body h6 {
color: #3b3f5c;
font-weight: 700;
margin-bottom: 0;
font-size: 16px;
letter-spacing: 1px; }
.list-group.list-group-media .list-group-item .media .media-body p {
color: #3b3f5c;
margin-bottom: 0;
font-size: 12px;
font-weight: 600; }
.list-group.task-list-group .list-group-item-action.active {
background-color: #888ea8;
color: #fff; }
.list-group.task-list-group .list-group-item-action.active .new-control.new-checkbox {
color: #fff;
font-size: 14px; }
/*
Image Meta
*/
/*
task-list-group
*/

View File

@ -0,0 +1,158 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.widget-content-area {
padding: 10px 20px; }
.toggle-code-snippet {
margin-bottom: -6px; }
/* Media Object */
.media {
margin-top: 20px;
margin-bottom: 20px; }
.media img {
width: 50px;
height: 50px;
margin-right: 15px; }
.media .media-body {
align-self: center; }
.media .media-body .media-heading {
color: #3b3f5c;
font-weight: 700;
margin-bottom: 10px;
font-size: 17px;
letter-spacing: 1px; }
.media .media-body .media-text {
color: #515365;
margin-bottom: 0;
font-size: 14px;
letter-spacing: 0; }
/* Right Aligned */
.media-right-aligned .media img {
margin-right: 0;
margin-left: 15px; }
/* Media Notation */
.notation-text .media:first-child {
border-top: none; }
.notation-text .media .media-body .media-notation {
margin-top: 8px;
margin-bottom: 9px; }
.notation-text .media .media-body .media-notation a {
color: #515365;
font-size: 13px;
font-weight: 700;
margin-right: 8px; }
/* Media Notation With Icon */
.notation-text-icon .media:first-child {
border-top: none; }
.notation-text-icon .media .media-body .media-notation {
margin-top: 8px;
margin-bottom: 9px; }
.notation-text-icon .media .media-body .media-notation a {
color: #515365;
font-size: 13px;
font-weight: 700;
margin-right: 8px; }
.notation-text-icon .media .media-body .media-notation a svg {
color: #888ea8;
margin-right: 6px;
vertical-align: sub;
width: 18px;
height: 18px;
fill: rgba(0, 23, 55, 0.08); }
/* With Labels */
.m-o-label .media:first-child {
border-top: none; }
.m-o-label .media .badge {
float: right; }
/* Dropdown */
.m-o-dropdown-list .media:first-child {
border-top: none; }
.m-o-dropdown-list .media .media-heading {
display: flex;
justify-content: space-between; }
.m-o-dropdown-list .media .media-heading div.dropdown-list {
cursor: pointer;
color: #888ea8;
font-size: 18px;
float: right; }
.m-o-dropdown-list .media .media-heading div.dropdown-list a.dropdown-item span {
align-self: center; }
.m-o-dropdown-list .media .media-heading div.dropdown-list a.dropdown-item svg {
margin-left: 20px;
color: #888ea8;
align-self: center;
width: 20px;
height: 20px;
fill: rgba(0, 23, 55, 0.08); }
.m-o-dropdown-list .media .media-heading div.dropdown-list a.dropdown-item:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.m-o-dropdown-list .dropdown-menu {
border-radius: 6px;
min-width: 9rem;
border: 1px solid #ebedf2;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
padding: 9px 0; }
.m-o-dropdown-list .dropdown-item {
font-size: 14px;
color: #888ea8;
padding: 5px 12px;
display: flex;
justify-content: space-between; }
.m-o-dropdown-list .dropdown-item:hover {
color: #e95f2b;
text-decoration: none;
background-color: #f1f2f3; }
/* Label Icon */
.m-o-label-icon .media:first-child {
border-top: none; }
.m-o-label-icon .media svg.label-icon {
align-self: center;
width: 30px;
height: 30px;
margin-right: 16px; }
.m-o-label-icon .media svg.label-icon.label-success {
color: #8dbf42; }
.m-o-label-icon .media svg.label-icon.label-danger {
color: #ee3d49; }
.m-o-label-icon .media svg.label-icon.label-warning {
color: #ffbb44; }
/* Checkbox */
.m-o-chkbox .media:first-child {
border-top: none; }
.m-o-chkbox .media .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
background-color: #515365; }
/* Checkbox */
.m-o-radio .media:first-child {
border-top: none; }
.m-o-radio .media .custom-radio .custom-control-input:checked ~ .custom-control-label::before {
background-color: #515365; }
.custom-control-label::before {
background-color: #d3d3d3; }

View File

@ -0,0 +1,238 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.modal-backdrop {
background-color: #515365; }
.modal-content {
border: none;
border-radius: 6px; }
.modal-content hr {
border-top: 1px solid #e0e6ed; }
.modal-content .modal-header {
padding: 12px 26px;
border: 1px solid #e0e6ed; }
.modal-content .modal-header h5 {
font-weight: 700;
font-size: 20px;
letter-spacing: 1px; }
.modal-content .modal-header svg {
width: 17px;
color: #acb0c3; }
.modal-content .modal-body {
padding: 26px 26px; }
.modal-content .modal-body a:not(.btn) {
color: #1b55e2;
font-weight: 600; }
.modal-content .modal-body p {
color: #888ea8;
letter-spacing: 1px;
font-size: 14px;
line-height: 22px; }
.modal-content .modal-body p:last-child {
margin-bottom: 0; }
.modal-content .modal-body p:not(:last-child) {
margin-bottom: 10px; }
.modal-content .modal-footer {
border-top: 1px solid #e0e6ed; }
.modal-content .modal-footer button.btn {
font-weight: 600;
padding: 10px 25px;
letter-spacing: 1px; }
.modal-content .modal-footer button.btn[data-dismiss="modal"] {
background-color: #fff;
color: #1b55e2;
font-weight: 700;
border: 1px solid #e8e8e8; }
.modal-content .modal-footer .btn.btn-primary {
background-color: #1b55e2;
color: #fff;
border: 1px solid #1b55e2; }
/*
Modal Success
*/
.modal-success .modal-content {
background-color: #e6ffbf; }
/*
Modal Video
*/
.modal-video .modal-content {
background-color: transparent; }
.modal-video .video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden; }
.modal-video .modal#videoMedia1 .modal-header, .modal-video .modal#videoMedia2 .modal-header {
border: none;
padding: 0; }
.modal-video .video-container iframe, .modal-video .video-container object, .modal-video .video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; }
.modal-video .modal#videoMedia1 .modal-header .close, .modal-video .modal#videoMedia2 .modal-header .close {
color: #fff !important;
opacity: 1; }
.modal-video .modal-content .modal-header svg {
color: #fff; }
/*
Modal Notification
*/
.modal-notification .modal-body .icon-content {
margin: 0 0 20px 0px;
display: inline-block;
padding: 13px;
border-radius: 50%;
background: #f1f2f3;
color: #000; }
.modal-notification .modal-body .icon-content svg {
width: 36px;
height: 36px;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08); }
/*
Profile
*/
.profile-modal .modal-content {
background-color: #5c1ac3; }
.profile-modal .modal-content .close {
font-size: 19px;
font-weight: 600;
line-height: 1;
color: #fff;
text-shadow: none;
opacity: 1;
text-align: right;
margin-right: 13px;
margin-top: 8px; }
.profile-modal .modal-content .modal-header, .profile-modal .modal-content .modal-footer {
border: none; }
.profile-modal .modal-content .modal-body p {
color: #fff; }
.profile-modal .modal-content .modal-footer button.btn {
box-shadow: none; }
/*
Slider
*/
.modal#sliderModal .modal-content {
border: 1px solid transparent;
background-color: transparent; }
.modal#sliderModal .modal-content .modal-body .carousel-indicators {
top: 37%;
bottom: auto;
display: block;
left: auto;
margin: auto;
right: 14px; }
.modal#sliderModal .modal-content .modal-body a.carousel-control-prev span.carousel-control-prev-icon {
position: absolute;
bottom: 14px;
left: 7px;
background-image: none;
color: #1b55e2; }
.modal#sliderModal .modal-content .modal-body a.carousel-control-next span.carousel-control-next-icon {
position: absolute;
bottom: 14px;
right: 7px;
background-image: none;
color: #1b55e2; }
.modal#sliderModal .modal-content .modal-body a.carousel-control-prev span.carousel-control-prev-text {
position: absolute;
bottom: 17px;
left: 30px;
color: #1b55e2; }
.modal#sliderModal .modal-content .modal-body a.carousel-control-next span.carousel-control-next-text {
position: absolute;
bottom: 17px;
right: 30px;
color: #1b55e2; }
.modal#sliderModal .modal-content .modal-body button.close {
position: absolute;
z-index: 2;
right: 16px;
top: 13px;
opacity: 1;
text-shadow: none; }
.modal#sliderModal .modal-content .modal-body button.close:hover {
color: #1b55e2; }
.carousel-indicators li {
background-color: #a1a3ac; }
.carousel-indicators .active {
background-color: #1b55e2; }
.modal-content .modal-body a:not(.btn) {
opacity: 1; }
/*
Login
*/
.login-modal .modal-header, .register-modal .modal-header {
text-align: center;
border: none;
padding-bottom: 0; }
.login-modal .modal-body .form-group, .register-modal .modal-body .form-group {
position: relative; }
.login-modal .modal-body .form-group svg, .register-modal .modal-body .form-group svg {
position: absolute;
width: 20px;
top: 11px;
left: 9px;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.login-modal .modal-body .form-group input, .register-modal .modal-body .form-group input {
padding-left: 35px;
border: none;
border-bottom: 1px solid #e0e6ed;
border-radius: 0; }
.login-modal .modal-body .form-group input.form-control:focus, .register-modal .modal-body .form-group input.form-control:focus {
box-shadow: none; }
.login-modal .modal-body .division, .register-modal .modal-body .division {
text-align: center;
font-size: 13px;
margin: 16px 0; }
.login-modal .modal-body .social, .register-modal .modal-body .social {
text-align: center; }
.login-modal .modal-body .social a, .register-modal .modal-body .social a {
background: transparent;
box-shadow: none;
border: 2px solid #e0e6ed; }
.login-modal .modal-body .social a.social-fb svg, .register-modal .modal-body .social a.social-fb svg {
color: #1b55e2; }
.login-modal .modal-body .social a.social-github svg, .register-modal .modal-body .social a.social-github svg {
color: #e7515a; }
.login-modal .modal-body .social a.social-fb .brand-name, .register-modal .modal-body .social a.social-fb .brand-name {
color: #1b55e2; }
.login-modal .modal-body .social a.social-github .brand-name, .register-modal .modal-body .social a.social-github .brand-name {
color: #e7515a; }
/*
Register
*/
@media (min-width: 576px) {
.login-modal .modal-dialog, .register-modal .modal-dialog {
max-width: 330px; } }

View File

@ -0,0 +1,15 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.widget-content .row.padding35 .col-md-4 {
margin-bottom: 20px; }
.btn {
margin-right: 5px; }

View File

@ -0,0 +1,108 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
h1, h2, h3, h4, h5, h6 {
color: #3b3f5c; }
/*
Basic
*/
.card {
border: 2px solid #e0e6ed;
border-radius: 6px;
margin-bottom: 4px; }
.card-header {
background-color: transparent;
color: #f8538d;
border-color: transparent;
border-radius: 4px;
padding: 0;
position: relative; }
.card-header section > div {
padding: 13px 19px;
cursor: pointer;
display: block;
font-size: 14px;
letter-spacing: 1px; }
.card-header section > div.collapsed {
color: #888ea8; }
.card-header section > div:not(.collapsed) {
color: #1b55e2;
border-bottom: 2px solid #e0e6ed;
font-weight: 600; }
.card-header section > div .icons {
position: absolute;
right: 0;
top: 0;
bottom: 0;
padding: 9px; }
.card-header section > div .icons svg {
width: 18px; }
.card .card-body p {
color: #888ea8;
letter-spacing: 1px;
font-size: 13px; }
.card .card-body p:not(:last-child) {
margin-bottom: 10px; }
.card .card-body ul {
margin-bottom: 0; }
.card .card-body ul li {
font-size: 12px;
letter-spacing: 1px; }
.card .card-body ul li:not(:last-child) {
margin-bottom: 5px; }
.card .card-body ul li a {
color: #3b3f5c;
font-size: 13px;
font-weight: 600; }
.card .card-body ul li a:hover {
color: #1b55e2; }
/*
No Outer Spacing
*/
.no-outer-spacing {
border: 2px solid #e0e6ed;
border-radius: 6px; }
.no-outer-spacing .card {
margin-bottom: 0;
border: none;
border-radius: 0; }
.no-outer-spacing .card:first-child {
border-top-left-radius: 6px;
border-top-right-radius: 6px; }
.no-outer-spacing .card:last-child {
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px; }
.no-outer-spacing .card:not(:last-child) {
border-bottom: 2px solid #e0e6ed; }
.no-outer-spacing .card-header section > div:not(.collapsed) {
border-bottom: none; }
/*
Accordin with Icons
*/
.accordion-icons .accordion-icon {
display: inline-block;
margin-right: 10px; }
.accordion-icons .accordion-icon svg {
color: #888ea8;
margin-right: 6px;
vertical-align: middle;
width: 20px;
height: 20px;
fill: rgba(0, 23, 55, 0.08); }
.accordion-icons div:not(.collapsed) .accordion-icon svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }

View File

@ -0,0 +1,485 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.nav-tabs {
border-bottom: 1px solid #ebedf2; }
.nav-tabs svg {
width: 20px;
vertical-align: bottom; }
.nav-tabs .nav-link.active {
color: #e95f2b;
background-color: #fff;
border-color: #e0e6ed #e0e6ed #fff; }
.nav-tabs .nav-link.active:after {
color: #e95f2b; }
.nav-tabs .nav-link:hover {
border-color: #ebedf2 #ebedf2 #f1f2f3; }
.dropdown-menu {
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.1); }
.nav-tabs .dropdown-item:hover {
background-color: #f1f2f3;
color: #515365; }
.nav-tabs li a.disabled {
color: #acb0c3 !important; }
.nav-pills .nav-item:not(:last-child) {
margin-right: 5px; }
.nav-pills .nav-link {
color: #3b3f5c; }
.nav-pills .nav-link.active:after {
color: #fff; }
.nav-pills .show > .nav-link {
background-color: #e95f2b; }
.nav-pills li a.disabled {
color: #acb0c3 !important; }
h4 {
font-size: 1.125rem; }
/*
Simple Tab
*/
.simple-tab .nav-tabs li a {
color: #3b3f5c; }
.simple-tab .nav-tabs .nav-item.show .nav-link, .simple-tab .nav-tabs .nav-link.active {
color: #1b55e2;
font-weight: 600;
background-color: #fff; }
.nav-tabs {
border-bottom: 1px solid #e0e6ed; }
.simple-tab .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Simple Pills
*/
.simple-pills .nav-pills li a {
color: #3b3f5c; }
.simple-pills .nav-pills .nav-link.active, .simple-pills .nav-pills .show > .nav-link {
background-color: #1b55e2;
border-color: transparent; }
.simple-pills .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Icon Tab
*/
.icon-tab .nav-tabs li a {
color: #3b3f5c; }
.icon-tab .nav-tabs svg {
width: 20px;
vertical-align: bottom; }
.icon-tab .nav-tabs .nav-item.show .nav-link, .icon-tab .nav-tabs .nav-link.active {
color: #e95f2b;
background-color: #fff;
border-color: #e0e6ed #e0e6ed #fff; }
.icon-tab .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Icon Pill
*/
.icon-pill .nav-pills li a {
color: #3b3f5c; }
.icon-pill .nav-pills svg {
width: 20px;
vertical-align: bottom; }
.icon-pill .nav-pills .nav-link.active, .icon-pill .nav-pills .show > .nav-link {
background-color: #e2a03f;
border-color: transparent; }
.icon-pill .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Underline
*/
.underline-content .nav-tabs {
border-bottom: 1px solid #e0e6ed; }
.underline-content .nav-tabs li a {
padding-top: 15px;
padding-bottom: 15px; }
.underline-content .tab-content > .tab-pane {
padding: 20px 0 0 0; }
.underline-content .nav-tabs .nav-link.active, .underline-content .nav-tabs .show > .nav-link {
border-color: transparent;
border-bottom: 1px solid #5c1ac3;
color: #5c1ac3;
background-color: transparent; }
.underline-content .nav-tabs .nav-link.active:hover, .underline-content .nav-tabs .show > .nav-link:hover, .underline-content .nav-tabs .nav-link.active:focus, .underline-content .nav-tabs .show > .nav-link:focus {
border-bottom: 1px solid #5c1ac3; }
.underline-content .nav-tabs .nav-link:focus, .underline-content .nav-tabs .nav-link:hover {
border-color: transparent; }
/*
Animated Underline
*/
.animated-underline-content .nav-tabs {
border-bottom: 1px solid #e0e6ed; }
.animated-underline-content .nav-tabs li a {
padding-top: 15px;
padding-bottom: 15px;
position: relative; }
.animated-underline-content .tab-content > .tab-pane {
padding: 20px 0 0 0; }
.animated-underline-content .nav-tabs .nav-link.active, .animated-underline-content .nav-tabs .show > .nav-link {
border-color: transparent;
color: #5c1ac3; }
.animated-underline-content .nav-tabs .nav-link:focus, .animated-underline-content .nav-tabs .nav-link:hover {
border-color: transparent; }
.animated-underline-content .nav-tabs .nav-link.active:before {
-webkit-transform: scale(1);
transform: scale(1); }
.animated-underline-content .nav-tabs .nav-link:before {
content: "";
height: 1px;
position: absolute;
width: 100%;
left: 0;
bottom: 0;
background-color: #5c1ac3;
-webkit-transform: scale(0);
transform: scale(0);
transition: all .3s; }
/*
Justify Tab
*/
.justify-tab .nav-tabs li a {
color: #3b3f5c; }
.justify-tab .nav-tabs .nav-item.show .nav-link, .justify-tab .nav-tabs .nav-link.active {
color: #1b55e2;
background-color: #fff;
border-color: #e0e6ed #e0e6ed #fff; }
.justify-tab .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Justify Pill
*/
.justify-pill .nav-pills li a {
color: #3b3f5c; }
.justify-pill .nav-pills .nav-link.active, .justify-pill .nav-pills .show > .nav-link {
background-color: #2196f3;
border-color: transparent; }
.justify-pill .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Justify Centered Tab
*/
.tab-justify-centered .nav-tabs li a {
color: #3b3f5c; }
.tab-justify-centered .nav-tabs .nav-item.show .nav-link, .tab-justify-centered .nav-tabs .nav-link.active {
color: #e95f2b;
background-color: #fff;
border-color: #e0e6ed #e0e6ed #fff; }
.tab-justify-centered .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Justify Centered Pill
*/
.pill-justify-centered .nav-pills li a {
color: #3b3f5c; }
.pill-justify-centered .nav-pills .nav-link.active, .pill-justify-centered .nav-pills .show > .nav-link {
background-color: #e2a03f; }
.pill-justify-centered .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Justify Right Tab
*/
.tab-justify-right .nav-tabs li a {
color: #3b3f5c; }
.tab-justify-right .nav-tabs .nav-item.show .nav-link, .tab-justify-right .nav-tabs .nav-link.active {
color: #1b55e2;
background-color: #fff;
border-color: #e0e6ed #e0e6ed #fff; }
.tab-justify-right .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Justify Right Pill
*/
.pill-justify-right .nav-pills .nav-link.active, .pill-justify-right .nav-pills .show > .nav-link {
background-color: #2196f3; }
.pill-justify-right .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
With Icons
*/
.rounded-pills-icon .nav-pills li a {
-webkit-border-radius: 0.625rem !important;
-moz-border-radius: 0.625rem !important;
-ms-border-radius: 0.625rem !important;
-o-border-radius: 0.625rem !important;
border-radius: 0.625rem !important;
background-color: #f1f2f3;
width: 100px;
padding: 8px; }
.rounded-pills-icon .nav-pills li a svg {
display: block;
text-align: center;
margin-bottom: 10px;
margin-top: 5px;
margin-left: auto;
margin-right: auto; }
.rounded-pills-icon .nav-pills .nav-link.active, .rounded-pills-icon .nav-pills .show > .nav-link {
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
background-color: #009688; }
.rounded-pills-icon .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Vertical With Icon
*/
.rounded-vertical-pills-icon .nav-pills a {
-webkit-border-radius: 0.625rem !important;
-moz-border-radius: 0.625rem !important;
-ms-border-radius: 0.625rem !important;
-o-border-radius: 0.625rem !important;
border-radius: 0.625rem !important;
background-color: #ffffff;
border: solid 1px #e4e2e2;
padding: 11px 23px;
text-align: center;
width: 100px;
padding: 8px; }
.rounded-vertical-pills-icon .nav-pills a svg {
display: block;
text-align: center;
margin-bottom: 10px;
margin-top: 5px;
margin-left: auto;
margin-right: auto; }
.rounded-vertical-pills-icon .nav-pills .nav-link.active, .rounded-vertical-pills-icon .nav-pills .show > .nav-link {
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
background-color: #009688;
border-color: transparent; }
/*
Rouned Circle With Icons
*/
.rounded-circle-pills-icon .nav-pills li a {
background-color: #f1f2f3;
padding: 20px 20px; }
.rounded-circle-pills-icon .nav-pills li a svg {
display: block;
text-align: center; }
.rounded-circle-pills-icon .nav-pills .nav-link.active, .rounded-circle-pills-icon .nav-pills .show > .nav-link {
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
background-color: #2196f3; }
.rounded-circle-pills-icon .tab-content > .tab-pane {
padding: 20px 0 0 0; }
/*
Vertical Rounded Circle With Icon
*/
.rounded-circle-vertical-pills-icon .nav-pills a {
background-color: #ffffff;
border: solid 1px #e4e2e2;
border-radius: 50%;
height: 58px;
width: 60px;
padding: 16px 18px;
max-width: 80px;
min-width: auto; }
.rounded-circle-vertical-pills-icon .nav-pills a svg {
display: block;
text-align: center;
line-height: 19px; }
.rounded-circle-vertical-pills-icon .nav-pills .nav-link.active, .rounded-circle-vertical-pills-icon .nav-pills .show > .nav-link {
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
background-color: #2196f3;
border-color: transparent; }
/*
Vertical Pill
*/
.vertical-pill .nav-pills .nav-link.active, .vertical-pill .nav-pills .show > .nav-link {
background-color: #009688; }
/*
Vertical Pill Right
*/
.vertical-pill-right .nav-pills .nav-link.active, .vertical-pill-right .nav-pills .show > .nav-link {
background-color: #009688; }
/*
Creative vertical pill
*/
.vertical-line-pill .nav-pills {
border-bottom: 1px solid transparent;
width: 92px;
border-right: 1px solid #e0e6ed; }
.vertical-line-pill .nav-pills a {
padding-top: 15px;
padding-bottom: 15px;
position: relative; }
.vertical-line-pill .nav-pills .nav-link {
padding: .5rem 0; }
.vertical-line-pill .nav-pills .nav-link.active {
position: relative;
background-color: transparent;
border-color: transparent;
color: #5c1ac3;
font-weight: 600; }
.vertical-line-pill .nav-pills .show > .nav-link {
position: relative;
background-color: transparent;
border-color: transparent;
color: #5c1ac3;
font-weight: 600; }
.vertical-line-pill .nav-pills .nav-link:focus, .vertical-line-pill .nav-pills .nav-link:hover {
border-color: transparent; }
.vertical-line-pill .nav-pills .nav-link.active:before {
-webkit-transform: scale(1);
transform: scale(1);
bottom: 0; }
.vertical-line-pill .nav-pills .nav-link:before {
content: "";
height: 100%;
position: absolute;
width: 1px;
right: -1px;
background-color: #5c1ac3;
-webkit-transform: scale(0);
transform: scale(0);
transition: all .3s; }
.vertical-line-pill #v-line-pills-tabContent h4 {
color: #e2a03f; }
.vertical-line-pill #v-line-pills-tabContent p {
color: #888ea8; }
.media img {
border-radius: 50%;
border: solid 5px #ebedf2;
width: 80px;
height: 80px; }
/*
Border Tab
*/
.border-tab .tab-content {
border: 1px solid #e0e6ed;
border-top: none;
padding: 10px; }
.border-tab .tab-content > .tab-pane {
padding: 20px 30px 0 30px; }
.border-tab .tab-content .media img.meta-usr-img {
margin-left: -30px; }
/*
Vertical Border Tab
*/
.vertical-border-pill .nav-pills {
width: 92px; }
.vertical-border-pill .nav-pills a {
padding-top: 15px;
padding-bottom: 15px;
position: relative; }
.vertical-border-pill .nav-pills .nav-link {
padding: .5rem 0;
border: 1px solid #e0e6ed;
border-radius: 0;
border-bottom: none; }
.vertical-border-pill .nav-pills .nav-link:last-child {
border-bottom: 1px solid #e0e6ed; }
.vertical-border-pill .nav-pills .nav-link.active {
position: relative;
color: #fff;
background-color: #8dbf42; }
.vertical-border-pill .nav-pills .show > .nav-link {
position: relative;
color: #fff;
background-color: #8dbf42; }
/*
Border Top Tab
*/
.border-top-tab .nav-tabs {
border-bottom: 1px solid transparent; }
.border-top-tab .nav-tabs li a {
border-radius: 0px;
padding: 12px 30px;
background: #f6f7f8;
color: #0e1726;
border-right: 1px solid transparent; }
.border-top-tab .tab-content > .tab-pane {
padding: 20px 0 0 0; }
.border-top-tab .nav-tabs .nav-item.show .nav-link {
color: #495057;
border-radius: 0px;
padding: 12px 30px;
background: #f6f7f8;
color: #5c1ac3;
border: 1px solid transparent;
border-top: 2px solid #5c1ac3; }
.border-top-tab .nav-tabs .nav-link.active {
color: #495057;
border-radius: 0px;
padding: 12px 30px;
background: #f6f7f8;
color: #5c1ac3;
border: 1px solid transparent;
border-top: 2px solid #5c1ac3; }
.border-top-tab .nav-tabs .nav-link:focus, .border-top-tab .nav-tabs .nav-link:hover {
border: 1px solid transparent;
border-top: 2px solid #5c1ac3; }

View File

@ -0,0 +1,514 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
=======================
Timeline Simple
=======================
*/
.timeline-simple {
margin-bottom: 45px;
max-width: 1140px;
margin-right: auto;
margin-left: auto; }
.timeline-simple h3 {
font-size: 23px;
font-weight: 600; }
.timeline-simple p.timeline-title {
position: relative;
font-size: 19px;
font-weight: 600;
color: #1b55e2;
margin-bottom: 28px; }
.timeline-simple p.timeline-title:before {
position: absolute;
content: "";
height: 2px;
width: 70px;
background: #1b55e2;
border-radius: 50px;
bottom: -2px;
left: 15px; }
.timeline-simple .timeline-list p.meta-update-day {
margin-bottom: 24px;
font-size: 16px;
font-weight: 600;
color: #888ea8; }
.timeline-simple .timeline-list .timeline-post-content {
display: flex; }
.timeline-simple .timeline-list .timeline-post-content > div > div {
margin-top: 28px; }
.timeline-simple .timeline-list .timeline-post-content:not(:last-child) > div > div {
margin-bottom: 70px; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile {
position: relative;
z-index: 2; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
top: 15px;
left: 34%;
transform: translateX(-50%);
width: 0;
height: auto;
top: 48px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0;
z-index: -1;
border-color: #ebedf2; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile img {
width: 53px;
height: 53px;
border-radius: 50%;
margin-right: 30px;
-webkit-box-shadow: 0px 4px 9px 0px rgba(31, 45, 61, 0.31);
box-shadow: 0px 4px 9px 0px rgba(31, 45, 61, 0.31); }
.timeline-simple .timeline-list .timeline-post-content h4 {
font-size: 20px;
font-weight: 700;
margin-bottom: 0;
color: #1b55e2; }
.timeline-simple .timeline-list .timeline-post-content svg {
color: #888ea8;
vertical-align: text-bottom;
width: 21px;
height: 21px; }
.timeline-simple .timeline-list .timeline-post-content:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.timeline-simple .timeline-list .timeline-post-content h6 {
display: inline-block;
font-size: 17px;
font-weight: 600;
margin-bottom: 11px; }
.timeline-simple .timeline-list .timeline-post-content:hover h6 {
color: #888ea8; }
.timeline-simple .timeline-list .timeline-post-content p.post-text {
padding-left: 31px;
color: #888ea8;
font-size: 14px;
font-weight: 600;
margin-bottom: 28px; }
.timeline-simple .timeline-list .timeline-post-content .post-contributers {
padding-left: 31px; }
.timeline-simple .timeline-list .timeline-post-content .post-contributers img {
width: 38px;
border-radius: 50%;
margin-right: 7px;
-webkit-box-shadow: 0px 6px 9px 2px rgba(31, 45, 61, 0.31);
box-shadow: 1px 3px 7px 2px rgba(31, 45, 61, 0.31);
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
cursor: pointer;
margin-bottom: 5px; }
.timeline-simple .timeline-list .timeline-post-content .post-contributers img:hover {
-webkit-transform: translateY(-3px) scale(1.02);
transform: translateY(-3px) scale(1.02);
box-shadow: none; }
.timeline-simple .timeline-list .timeline-post-content .post-gallery-img {
padding-left: 31px; }
.timeline-simple .timeline-list .timeline-post-content .post-gallery-img img {
width: 20%;
border-radius: 6px;
-webkit-box-shadow: 0px 6px 9px 2px rgba(31, 45, 61, 0.31);
box-shadow: 1px 3px 7px 2px rgba(31, 45, 61, 0.31);
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
cursor: pointer; }
.timeline-simple .timeline-list .timeline-post-content .post-gallery-img img:hover {
-webkit-transform: translateY(-3px) scale(1.02);
transform: translateY(-3px) scale(1.02);
box-shadow: none; }
.timeline-simple .timeline-list .timeline-post-content .post-gallery-img img:not(:last-child) {
margin-right: 23px; }
.mt-container {
max-width: 570px; }
.modern-timeline {
list-style: none;
position: relative;
padding: 50px 0 50px;
margin: 0; }
.modern-timeline:before {
position: absolute;
background: #ebedf2;
bottom: 0;
left: 50%;
top: 0;
content: "";
width: 3px;
margin-left: -1.5px; }
.modern-timeline > li {
margin-bottom: 50px;
position: relative; }
.modern-timeline > li:after, .modern-timeline > li:before {
display: table;
content: ""; }
.modern-timeline > li > .modern-timeline-badge {
position: absolute;
background: #fff;
border: 3px solid #ebedf2;
border-radius: 100%;
height: 20px;
width: 20px;
margin-left: -10px;
text-align: center;
z-index: 1;
left: 50%;
top: 32px; }
.modern-timeline > li > .modern-timeline-panel {
position: relative;
border: 1px solid #ebedf2;
background: #fff;
border-radius: .1875rem;
box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
box-shadow: 0px 20px 20px rgba(126, 142, 177, 0.12);
transition: .3s ease-in-out;
float: left;
width: 46%;
border-radius: 6px; }
.modern-timeline > li > .modern-timeline-panel:before {
position: absolute;
background: #ebedf2;
right: -37px;
top: 40px;
transition: .3s ease-in-out;
content: " ";
width: 37px;
height: 3px;
display: block; }
.modern-timeline > li:nth-child(even) > .modern-timeline-panel:before {
right: auto;
left: -37px;
width: 37px; }
.modern-timeline > li:after {
clear: both; }
.modern-timeline > li > .modern-timeline-panel .modern-timeline-preview img {
width: 100%;
border-top-left-radius: 6px;
border-top-right-radius: 6px; }
.modern-timeline > li > .modern-timeline-panel *:last-child {
margin-bottom: 0; }
.modern-timeline > li:nth-child(even) > .modern-timeline-panel {
border: 1px solid #ebedf2;
float: right; }
.modern-timeline > li > .modern-timeline-panel *:last-child {
margin-bottom: 0; }
.modern-timeline > li > .modern-timeline-panel .modern-timeline-body {
padding: 30px 20px;
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px; }
.modern-timeline > li > .modern-timeline-panel .modern-timeline-body h4 {
color: #e95f2b;
margin-bottom: 20px;
font-size: 1.125rem; }
.modern-timeline > li > .modern-timeline-panel .modern-timeline-body p {
color: #3b3f5c;
margin-bottom: 0; }
.modern-timeline > li > .modern-timeline-panel .modern-timeline-body p a {
display: block; }
.modern-timeline > li > .modern-timeline-panel *:last-child {
margin-bottom: 0; }
.modern-timeline-top:before, .modern-timeline-bottom:before {
background: #ebedf2;
position: absolute;
height: 3px;
width: 50px;
display: block;
content: "";
bottom: 0;
left: 50%;
margin-left: -25px; }
.modern-timeline-top:before {
top: 0; }
@media (max-width: 767px) {
ul.modern-timeline > li > .modern-timeline-panel {
border: 1px solid #ebedf2;
float: right;
width: 100%; }
ul.modern-timeline > li > .modern-timeline-badge {
display: none; }
.modern-timeline > li > .modern-timeline-panel:before {
display: none; } }
/*
=====================
Modern
=====================
*/
.timeline-alter .item-timeline {
display: flex; }
.timeline-alter .item-timeline .t-time {
padding: 10px;
align-self: center; }
.timeline-alter .item-timeline .t-time p {
margin: 0;
min-width: 58px;
max-width: 100px;
font-size: 16px;
font-weight: 600;
color: #3b3f5c;
align-self: center; }
.timeline-alter .item-timeline .t-img {
position: relative;
border-color: #ebedf2;
padding: 10px; }
.timeline-alter .item-timeline .t-img:before {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%); }
.timeline-alter .item-timeline .t-img:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: auto;
top: 25px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0; }
.timeline-alter .item-timeline .t-img img {
width: 45px;
height: 45px;
border-radius: 50%;
z-index: 7;
position: relative; }
.timeline-alter .item-timeline .t-usr-txt {
display: block;
padding: 10px;
position: relative;
border-color: #ebedf2; }
.timeline-alter .item-timeline .t-usr-txt:before {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%); }
.timeline-alter .item-timeline .t-usr-txt:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: auto;
top: 25px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0; }
.timeline-alter .item-timeline .t-usr-txt p {
margin: 0;
background: #c2d5ff;
height: 45px;
width: 45px;
border-radius: 50%;
display: flex;
align-self: center;
justify-content: center;
margin-bottom: 0;
color: #1b55e2;
font-weight: 700;
font-size: 18px;
z-index: 7;
position: relative; }
.timeline-alter .item-timeline .t-usr-txt span {
align-self: center; }
.timeline-alter .item-timeline .t-meta-time {
padding: 10px;
align-self: center; }
.timeline-alter .item-timeline .t-meta-time p {
margin: 0;
min-width: 100px;
max-width: 100px;
font-size: 12px;
font-weight: 700;
color: #888ea8; }
.timeline-alter .item-timeline .t-text {
padding: 10px;
align-self: center; }
.timeline-alter .item-timeline .t-text p {
font-size: 13px;
margin: 0;
color: #3b3f5c;
font-weight: 600; }
.timeline-alter .item-timeline .t-text p a {
color: #1b55e2;
font-weight: 600; }
/*
=====================
Basic
=====================
*/
.timeline-line .item-timeline {
display: flex; }
.timeline-line .item-timeline .t-dot {
position: relative; }
.timeline-line .item-timeline .t-dot:before {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
border-color: #2196f3; }
.timeline-line .item-timeline .t-dot:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
border-color: #2196f3;
width: 0;
height: auto;
top: 25px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0; }
.timeline-line .item-timeline .t-dot.t-dot-primary:before {
border-color: #1b55e2; }
.timeline-line .item-timeline .t-dot.t-dot-success:before {
border-color: #8dbf42; }
.timeline-line .item-timeline .t-dot.t-dot-warning:before {
border-color: #e2a03f; }
.timeline-line .item-timeline .t-dot.t-dot-info:before {
border-color: #2196f3; }
.timeline-line .item-timeline .t-dot.t-dot-danger:before {
border-color: #e7515a; }
.timeline-line .item-timeline .t-dot.t-dot-dark:before {
border-color: #3b3f5c; }
.timeline-line .item-timeline .t-dot.t-dot-primary:after {
border-color: #1b55e2; }
.timeline-line .item-timeline .t-dot.t-dot-success:after {
border-color: #8dbf42; }
.timeline-line .item-timeline .t-dot.t-dot-warning:after {
border-color: #e2a03f; }
.timeline-line .item-timeline .t-dot.t-dot-info:after {
border-color: #2196f3; }
.timeline-line .item-timeline .t-dot.t-dot-danger:after {
border-color: #e7515a; }
.timeline-line .item-timeline .t-dot.t-dot-dark:after {
border-color: #3b3f5c; }
.timeline-line .item-timeline:last-child .t-dot:after {
display: none; }
.timeline-line .item-timeline .t-meta-time {
margin: 0;
min-width: 100px;
max-width: 100px;
font-size: 12px;
font-weight: 700;
color: #888ea8;
align-self: center; }
.timeline-line .item-timeline .t-text {
padding: 10px;
align-self: center;
margin-left: 10px; }
.timeline-line .item-timeline .t-text p {
font-size: 13px;
margin: 0;
color: #3b3f5c;
font-weight: 600; }
.timeline-line .item-timeline .t-text p a {
color: #1b55e2;
font-weight: 600; }
.timeline-line .item-timeline .t-time {
margin: 0;
min-width: 58px;
max-width: 100px;
font-size: 16px;
font-weight: 600;
color: #3b3f5c;
padding: 10px 0; }
.timeline-line .item-timeline .t-text .t-meta-time {
margin: 0;
min-width: 100px;
max-width: 100px;
font-size: 12px;
font-weight: 700;
color: #888ea8;
align-self: center; }
@media (max-width: 767px) {
.timeline-simple .timeline-list .timeline-post-content .post-gallery-img img {
width: 150px;
margin-bottom: 23px; } }
@media (max-width: 575px) {
.timeline-alter .item-timeline {
display: block;
text-align: center; }
.timeline-alter .item-timeline .t-meta-time p, .timeline-alter .item-timeline .t-usr-txt p {
margin: 0 auto; }
.timeline-simple .timeline-list .timeline-post-content {
display: block; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile {
margin-bottom: 18px;
text-align: center; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile:after {
display: none; }
.timeline-simple .timeline-list .timeline-post-content div.user-profile img {
margin-right: 0; }
.timeline-simple .timeline-list .timeline-post-content h4, .timeline-simple .timeline-list .timeline-post-content .meta-time-date {
text-align: center; } }

View File

@ -0,0 +1,45 @@
nav > .nav.nav-tabs{
border: none;
color:#fff;
background:#272e38;
border-radius:0;
}
nav > div a.nav-item.nav-link,
nav > div a.nav-item.nav-link.active
{
border: none;
padding: 5px 25px;
color:#fff;
background:#272e38;
border-radius:0;
}
nav > div a.nav-item.nav-link.active:after
{
content: "";
position: relative;
bottom: -60px;
left: -10%;
border: 15px solid transparent;
border-top-color: #e74c3c ;
}
.tab-content{
background: #fdfdfd;
line-height: 25px;
border: 1px solid #ddd;
border-top:5px solid #e74c3c;
border-bottom:5px solid #e74c3c;
padding:30px 25px;
}
nav > div a.nav-item.nav-link:hover,
nav > div a.nav-item.nav-link:focus
{
border: none;
background: #e74c3c;
color:#fff;
border-radius:0;
transition:background 0.20s linear;
}

View File

@ -0,0 +1,780 @@
.layout-spacing {
padding-bottom: 25px;
}
.widget {
position: relative;
padding: 0;
border-radius: 6px;
border: none;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.08), 0 1px 20px 0 rgba(0, 0, 0, 0.07), 0px 1px 11px 0px rgba(0, 0, 0, 0.07);
}
/*
==================
Notification
==================
*/
.widget-card-four {
padding: 25px 32px;
background: #fff;
}
.widget-card-four .w-content {
display: flex;
justify-content: space-between;
}
.widget-card-four .w-info h6 {
font-weight: 600;
margin-bottom: 0;
color: #0e1726;
font-size: 23px;
letter-spacing: 0;
}
.widget-card-four .w-info p {
font-weight: 600;
margin-bottom: 0;
color: #5c1ac3;
font-size: 16px;
}
.widget-card-four .w-icon {
color: #5c1ac3;
background-color: #dccff7;
height: 45px;
display: inline-flex;
width: 45px;
align-self: center;
justify-content: center;
border-radius: 50%;
padding: 10px;
}
.widget-card-four .progress {
height: 8px;
margin-bottom: 0;
margin-top: 62px;
margin-bottom: 0;
height: 22px;
padding: 4px;
border-radius: 20px;
box-shadow: 0 2px 2px rgba(224, 230, 237, 0.4588235294117647),
}
.widget-card-four .progress-bar {
position: relative;
}
.widget-card-four .progress-bar:before {
content: '';
height: 7px;
width: 7px;
background: #fff;
position: absolute;
right: 3px;
border-radius: 50%;
top: 3.4px;
}
/*
=====================
User Analytics
=====================
*/
.widget.widget-one {
padding: 22px 18px;
background: #fff;
}
.widget.widget-one .widget-heading h6 {
color: #0e1726;
margin-bottom: 41px;
font-size: 17px;
display: block;
font-weight: 600;
}
.widget.widget-one .w-chart {
display: flex;
}
.widget.widget-one .w-chart .w-chart-section {
width: 50%;
padding: 0 12px;
}
.widget.widget-one .w-chart .w-chart-section .w-detail {
position: absolute;
color: #fff;
}
.widget.widget-one .w-chart .w-chart-section .w-title {
font-size: 13px;
font-weight: 700;
margin-bottom: 0;
}
.widget.widget-one .w-chart .w-chart-section .w-stats {
color: #f8538d;
font-size: 20px;
letter-spacing: 1px;
margin-bottom: 0;
font-weight: 700;
}
/*
=====================
Unique Visitors
=====================
*/
.widget.widget-chart-three {
background: #fff;
}
.widget.widget-chart-three .widget-heading {
display: flex;
justify-content: space-between;
border-bottom: 1px dashed #e0e6ed;
padding: 20px 20px;
margin-bottom: 0;
padding-bottom: 20px;
}
.widget.widget-chart-three .widget-heading h5 {
font-size: 17px;
display: block;
color: #0e1726;
font-weight: 600;
margin-bottom: 0;
}
.widget.widget-chart-three .widget-heading .dropdown {
align-self: center;
}
.widget.widget-chart-three .widget-heading .dropdown a svg {
color: #888ea8;
width: 19px;
height: 19px;
}
.widget.widget-chart-three .widget-heading .dropdown .dropdown-menu {
padding: 8px 8px;
min-width: 10rem;
border-radius: 6px;
top: 5px !important;
}
.widget.widget-chart-three .apexcharts-legend-marker {
left: -5px!important;
}
/*
=========================
Organic Vs Direct
=========================
*/
/*
========================
Recent Activities
========================
*/
.widget.widget-activity-three {
position: relative;
background: #fff;
border-radius: 8px;
height: 100%;
}
.widget.widget-activity-three .widget-heading {
display: flex;
justify-content: space-between;
border-bottom: 1px dashed #e0e6ed;
padding: 20px 20px;
padding-bottom: 20px;
}
.widget.widget-activity-three .widget-heading h5 {
font-size: 17px;
display: block;
color: #0e1726;
font-weight: 600;
margin-bottom: 0;
}
.widget-activity-three .widget-content {
padding: 20px 10px 20px 20px
}
.widget-activity-three .mt-container {
position: relative;
height: 325px;
overflow: auto;
padding: 0 12px 0 12px;
}
.widget-activity-three .timeline-line .item-timeline { display: flex;
margin-bottom: 20px; }
.widget-activity-three .timeline-line .item-timeline .t-dot { position: relative; }
.widget-activity-three .timeline-line .item-timeline .t-dot div {
background: #1b55e2;
border-radius: 50%;
padding: 5px;
margin-right: 11px;
display: flex;
height: 37px;
justify-content: center;
width: 36px;
}
.widget-activity-three .timeline-line .item-timeline .t-dot div.t-primary {
background-color: #1b55e2;
box-shadow: 0 10px 20px -10px #1b55e2;
}
.widget-activity-three .timeline-line .item-timeline .t-dot div.t-success {
background-color: #009688;
box-shadow: 0 10px 20px -10px #009688;
}
.widget-activity-three .timeline-line .item-timeline .t-dot div.t-danger {
background-color: #e7515a;
box-shadow: 0 10px 20px -10px #e7515a;
}
.widget-activity-three .timeline-line .item-timeline .t-dot div.t-warning {
background-color: #e2a03f;
box-shadow: 0 10px 20px -10px #e2a03f;
}
.widget-activity-three .timeline-line .item-timeline .t-dot div.t-dark {
background-color: #3b3f5c;
box-shadow: 0 10px 20px -10px #3b3f5c;
}
.widget-activity-three .timeline-line .item-timeline .t-dot svg {
color: #fff;
height: 20px;
width: 20px;
stroke-width: 1.6px;
align-self: center;
}
.widget-activity-three .timeline-line .item-timeline .t-content {
width: 100%;
}
.widget-activity-three .timeline-line .item-timeline .t-content .t-uppercontent {
display: flex;
justify-content: space-between;
}
.widget-activity-three .timeline-line .item-timeline .t-content .t-uppercontent h5 {
font-size: 15px;
letter-spacing: 0;
font-weight: 700;
margin-bottom: 5px;
}
.widget-activity-three .timeline-line .item-timeline .t-content .t-uppercontent span {
margin-bottom: 0;
font-size: 11px;
font-weight: 500;
color: #888ea8;
}
.widget-activity-three .timeline-line .item-timeline .t-content p {
margin-bottom: 8px;
font-size: 13px;
font-weight: 500;
color: #888ea8;
}
.widget-activity-three .timeline-line .item-timeline .t-content div.tags {
}
.widget-activity-three .timeline-line .item-timeline .t-content div.tags .badge {
padding: 2px 4px;
font-size: 11px;
letter-spacing: 1px;
transform: none;
}
.widget-activity-three .timeline-line .item-timeline .t-content div.tags .badge-primary {
background-color: #c2d5ff;
color: #1b55e2;
}
.widget-activity-three .timeline-line .item-timeline .t-content div.tags .badge-success {
background-color: #e6ffbf;
color: #009688;
}
.widget-activity-three .timeline-line .item-timeline .t-content div.tags .badge-warning {
background-color: #ffeccb;
color: #e2a03f;
}
.widget-activity-three .timeline-line .item-timeline .t-dot:after {
content: '';
position: absolute;
border-width: 1px;
border-style: solid;
left: 40%;
transform: translateX(-50%);
border-color: #bfc9d4;
width: 0;
height: auto;
top: 36px;
bottom: -20px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0;
}
.widget-activity-three .timeline-line .item-timeline:last-child .t-dot:after { display: none; }
/*
==================
Statistics
==================
*/
.widget-one_hybrid {
background: #fff;
}
.widget-one_hybrid .widget-heading {
padding: 20px 13px;
}
.widget-one_hybrid .widget-heading .w-icon {
display: inline-block;
padding: 7px 8px;
border-radius: 50%;
margin-bottom: 15px;
}
.widget-one_hybrid .widget-heading svg {
height: 18px;
width: 18px;
}
.widget-one_hybrid .widget-heading .w-value {
font-size: 21px;
font-weight: 700;
margin-bottom: 0;
}
.widget-one_hybrid .widget-heading h5 {
margin-bottom: 0;
font-size: 15px;
font-weight: 600;
color: #506690;
}
.widget-one_hybrid.widget-followers {
background: #c2d5ff;
}
.widget-one_hybrid.widget-followers .widget-heading .w-icon {
color: #1b55e2;
border: 1px solid #1b55e2;
}
.widget-one_hybrid.widget-referral {
background: #ffe1e2;
}
.widget-one_hybrid.widget-referral .widget-heading .w-icon {
color: #e7515a;
border: 1px solid #e7515a;
}
.widget-one_hybrid.widget-social {
background: #bae7ff;
}
.widget-one_hybrid.widget-social .widget-heading .w-icon {
color: #2196f3;
border: 1px solid #2196f3;
}
.widget-one_hybrid.widget-engagement {
background: #e6ffbf;
}
.widget-one_hybrid.widget-engagement .widget-heading .w-icon {
color: #8dbf42;
border: 1px solid #8dbf42;
}
/*
==================
Balance
==================
*/
.widget-account-invoice-two {
padding: 22px 19px;
background: #e2a03f;
background-image: linear-gradient(to right, #d09693 0%, #c71d6f 100%);
background: linear-gradient(to right, #0081ff 0%, #0045ff 100%);
}
.widget-account-invoice-two .account-box .info {
display: flex;
justify-content: space-between;
margin-bottom: 84px;
}
.widget-account-invoice-two .account-box h5 {
color: #e0e6ed;
margin-bottom: 0;
font-size: 17px;
font-weight: 600;
}
.widget-account-invoice-two .account-box p {
color: #e0e6ed;
font-weight: 700;
margin-bottom: 0;
align-self: center;
}
.widget-account-invoice-two .account-box .acc-action {
margin-top: 23px;
display: flex;
justify-content: space-between;
}
.widget-account-invoice-two .account-box .acc-action a {
display: inline-block;
padding: 8px;
border-radius: 6px;
color: #e0e6ed;
font-weight: 600;
box-shadow: 0px 0px 2px 0px #bfc9d4;
}
.widget-account-invoice-two .account-box .acc-action a:first-child {
margin-right: 2px;
}
.widget-account-invoice-two .account-box .acc-action a svg {
width: 18px;
height: 18px;
}
/*
==================
Statistics
==================
*/
.widget-card-one {
background: #fff;
padding: 20px 0;
height: 100%;
}
.widget-card-one .widget-content .media {
padding-left: 15px;
padding-right: 15px;
margin-bottom: 19px;
padding-bottom: 21px;
border-bottom: 1px dashed #e0e6ed;
}
.widget-card-one .widget-content .media .w-img {
margin-right: 9px;
align-self: center;
}
.widget-card-one .widget-content .media img {
width: 50px;
height: 50px;
border-radius: 50%;
border: 3px solid #e0e6ed;
}
.widget-card-one .widget-content .media-body {
align-self: center;
}
.widget-card-one .widget-content .media-body h6 {
font-weight: 700;
font-size: 15px;
letter-spacing: 0;
margin-bottom: 0;
}
.widget-card-one .widget-content .media-body p {
font-size: 14px;
letter-spacing: 1px;
margin-bottom: 0;
font-weight: 600;
color: #888ea8;
padding: 0;
}
.widget-card-one .widget-content p {
font-weight: 600;
font-size: 13px;
margin-bottom: 61px;
padding: 0 20px;
}
.widget-card-one .widget-content .w-action {
padding: 0 20px;
}
.widget-card-one .widget-content .w-action svg {
color: #1b55e2;
fill: #c2d5ff;
}
.widget-card-one .widget-content .w-action span {
vertical-align: sub;
font-weight: 700;
color: #0e1726;
letter-spacing: 1px;
}
/*
====================
Visitors by Browser
====================
*/
.widget-four {
position: relative;
background: #fff;
padding: 20px;
border-radius: 8px;
height: 100%;
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.09019607843137255), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
}
.widget-four .widget-heading {
margin-bottom: 54px;
}
.widget-four .widget-heading h5 {
font-size: 17px;
display: block;
color: #0e1726;
font-weight: 600;
margin-bottom: 0;
}
.widget-four .widget-content {
font-size: 17px;
}
.widget-four .widget-content .browser-list {
display: flex;
}
.widget-four .widget-content .browser-list:not(:last-child) {
margin-bottom: 30px;
}
.widget-four .widget-content .w-icon {
display: inline-block;
padding: 8px 8px;
border-radius: 50%;
display: inline-flex;
align-self: center;
height: 34px;
width: 34px;
margin-right: 12px;
}
.widget-four .widget-content .w-icon svg {
display: block;
width: 17px;
height: 17px;
}
.widget-four .widget-content .browser-list:nth-child(1) .w-icon {
background: #c2d5ff;
}
.widget-four .widget-content .browser-list:nth-child(2) .w-icon {
background: #ffe1e2;
}
.widget-four .widget-content .browser-list:nth-child(3) .w-icon {
background: #ffeccb ;
}
.widget-four .widget-content .browser-list:nth-child(1) .w-icon svg {
color: #1b55e2;
}
.widget-four .widget-content .browser-list:nth-child(2) .w-icon svg {
color: #e7515a;
}
.widget-four .widget-content .browser-list:nth-child(3) .w-icon svg {
color: #e2a03f;
}
.widget-four .widget-content .w-browser-details {
width: 100%;
align-self: center;
}
.widget-four .widget-content .w-browser-info {
display: flex;
justify-content: space-between;
margin-bottom: 1px;
}
.widget-four .widget-content .w-browser-info h6 {
font-size: 13px;
font-weight: 600;
margin-bottom: 0;
color: #888ea8;
}
.widget-four .widget-content .w-browser-info p {
font-size: 12px;
font-weight: 600;
margin-bottom: 0;
color: #888ea8;
}
.widget-four .widget-content .w-browser-stats .progress {
margin-bottom: 0;
height: 22px;
padding: 4px;
border-radius: 20px;
box-shadow: 0 2px 2px rgba(224, 230, 237, 0.4588235294117647), 1px 6px 7px rgba(224, 230, 237, 0.4588235294117647);
}
.widget-four .widget-content .w-browser-stats .progress .progress-bar {
position: relative;
}
.widget-four .widget-content .w-browser-stats .progress .progress-bar:before {
content: '';
height: 7px;
width: 7px;
background: #fff;
position: absolute;
right: 3px;
border-radius: 50%;
top: 3.4px;
}
/*
==================
Dev Summit
==================
*/
.widget-card-two {
background: #fff;
padding: 20px 0px;
}
.widget-card-two .media {
padding-left: 15px;
padding-right: 15px;
margin-bottom: 19px;
padding-bottom: 21px;
border-bottom: 1px dashed #e0e6ed;
}
.widget-card-two .media .w-img {
margin-right: 10px;
}
.widget-card-two .media .w-img img {
width: 50px;
height: 50px;
border-radius: 50%;
border: 3px solid #e0e6ed;
}
.widget-card-two .media .media-body {
align-self: center;
}
.widget-card-two .media .media-body h6 {
font-weight: 700;
font-size: 15px;
letter-spacing: 0;
margin-bottom: 0;
}
.widget-card-two .media .media-body p {
margin-bottom: 0;
font-weight: 600;
color: #888ea8;
}
.widget-card-two .card-bottom-section {
text-align: center;
}
.widget-card-two .card-bottom-section h5 {
font-size: 14px;
color: #009688;
font-weight: 700;
margin-bottom: 20px;
}
.widget-card-two .card-bottom-section .img-group img {
width: 46px;
height: 46px;
border-radius: 50%;
border: 2px solid #e0e6ed;
}
.widget-card-two .card-bottom-section .img-group img:not(:last-child) {
margin-right: 5px;
}
.widget-card-two .card-bottom-section a {
display: block;
margin-top: 18px;
background: #1b55e2;
color: #fff;
padding: 10px 10px;
transform: none;
margin-right: 15px;
margin-left: 15px;
font-size: 15px;
font-weight: 600;
letter-spacing: 1px;
}
.widget-card-two .card-bottom-section a.btn:hover,
.widget-card-two .card-bottom-section a.btn:focus {
border-color: #1b55e2;
}
/*
=====================
Task Indicator
=====================
*/
.widget-five {
background: #fff;
padding: 28px 0 0 0;
height: 100%;
}
.widget-five .widget-content .header {
display: flex;
justify-content: space-between;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 23px;
border-bottom: 1px dashed #e0e6ed;
}
.widget-five .widget-content .header-body {
align-self: center;
}
.widget-five .widget-content .header-body h6 {
font-weight: 700;
font-size: 15px;
letter-spacing: 0;
margin-bottom: 0;
}
.widget-five .widget-content .header-body p {
margin-bottom: 0;
font-weight: 600;
color: #888ea8;
padding: 0;
}
.widget-five .widget-content .task-action {
display: flex;
}
.widget-five .widget-content .task-action .dropdown.custom-dropdown {
align-self: center;
}
.widget-five .widget-content .task-action .dropdown.custom-dropdown a.dropdown-toggle svg {
color: #888ea8;
}
.widget-five .widget-content .task-action .dropdown.custom-dropdown .dropdown-menu {
padding: 8px 8px;
min-width: 10rem;
border-radius: 6px;
top: 5px !important;
}
.widget-five .w-content {
text-align: center;
height: 100%;
padding: 20px 26px;
}
.widget-five .w-content div .task-left {
margin-bottom: 0;
font-size: 30px;
color: #1b55e2;
background: #c2d5ff;
font-weight: 600;
border-radius: 50%;
display: inline-flex;
height: 76px;
width: 76px;
justify-content: center;
padding: 13px 0px;
border: 5px solid #fff;
margin-bottom: 20px;
-webkit-box-shadow: 0px 0px 8px 2px #e0e6ed;
box-shadow: 0px 0px 8px 2px #e0e6ed;
}
.widget-five .w-content div .task-completed {
font-size: 14px;
font-weight: 700;
margin-bottom: 4px;
color: #009688;
}
.widget-five .w-content div .task-hight-priority {
color: #acb0c3;
font-weight: 500;
margin-bottom: 0;
}
.widget-five .w-content div .task-hight-priority span {
color: #e7515a;
font-weight: 700;
}
/*
=====================
Media Query
=====================
*/
@media (max-width: 1199px) {
.widget-activity-two .widget-content {
padding-top: 0;
}
.widget-activity-two .mt-container {
position: relative;
height: 177px;
}
}
@media (max-width: 575px) {
.widget-card-four .w-content-img img {
height: 94px;
}
.widget-notification-one .noti-action a span {
display: none;
}
.widget-statistic .col-12:not(:last-child) .widget-one_hybrid {
margin-bottom: 40px
}
}

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,229 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/* Alert */
.alert {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-bottom: 15px;
padding: 0.9375rem; }
.alert .btn {
padding: 3px 12px;
margin-right: 20px; }
.alert .btn:hover {
box-shadow: none; }
.alert .alert-icon svg {
vertical-align: middle;
width: 33px;
height: 33px; }
.alert .close {
color: #fff;
opacity: 1;
width: 18px; }
/*Default Alerts*/
.alert-primary {
color: #fff;
background-color: #1b55e2;
border-color: #1b55e2; }
.alert-warning {
color: #fff;
background-color: #e2a03f;
border-color: #e2a03f; }
.alert-success {
color: #fff;
background-color: #8dbf42;
border-color: #8dbf42; }
.alert-info {
color: #fff;
background-color: #2196f3;
border-color: #2196f3; }
.alert-danger {
color: #fff;
background-color: #e7515a;
border-color: #e7515a; }
.alert-dark {
color: #fff;
background-color: #3b3f5c;
border-color: #3b3f5c; }
/*Outline Alerts*/
.alert-outline-primary {
border-color: #1b55e2;
border-radius: 5px; }
.alert-outline-warning {
border-color: #dea82a;
border-radius: 5px; }
.alert-outline-success {
border-color: #8dbf42;
border-radius: 5px; }
.alert-outline-info {
border-color: #009eda;
border-radius: 5px; }
.alert-outline-danger {
border-color: #e7515a;
border-radius: 5px; }
.alert-outline-dark {
border-color: #454656;
border-radius: 5px; }
.alert.alert-light .close {
color: #0e1726; }
.alert.solid-alert-3 .close, .alert.solid-alert-4 .close {
color: #000; }
.hide-default {
display: none; }
/* Light Alert */
.alert-light-primary {
color: #1b55e2;
background-color: #c2d5ff;
border-color: #1b55e2; }
.alert-light-primary svg.close {
color: #1b55e2; }
.alert-light-warning {
color: #e2a03f;
background-color: #ffeccb;
border-color: #e2a03f; }
.alert-light-warning svg.close {
color: #e2a03f; }
.alert-light-success {
color: #8dbf42;
background-color: #e6ffbf;
border-color: #8dbf42; }
.alert-light-success svg.close {
color: #8dbf42; }
.alert-light-info {
color: #2196f3;
background-color: #bae7ff;
border-color: #2196f3; }
.alert-light-info svg.close {
color: #2196f3; }
.alert-light-danger {
color: #e7515a;
background-color: #ffe1e2;
border-color: #e7515a; }
.alert-light-danger svg.close {
color: #e7515a; }
.alert-light-dark {
color: #3b3f5c;
background-color: #acb0c3;
border-color: #3b3f5c; }
.alert-light-dark svg.close {
color: #3b3f5c; }
/* Background Alerts */
.alert-background {
color: #fff;
background: #fff url(../../img/ab-1.jpeg) no-repeat center center;
background-size: cover; }
/* Gradient Alerts */
.alert-gradient {
color: #fff;
border: none;
background-size: cover;
background-image: linear-gradient(135deg, #bc1a4e 0%, #004fe6 100%); }
/* Custom Alerts */
/* Default */
.custom-alert-1 {
background-color: #5c1ac3;
border-color: #5c1ac3;
border-radius: 5px;
color: #fff; }
.custom-alert-1 .alert-icon {
margin-right: 25px; }
.custom-alert-1 .media-body {
display: flex;
justify-content: space-between; }
.custom-alert-1 .alert-text {
margin-right: 10px; }
.custom-alert-1 .alert-text strong, .custom-alert-1 .alert-text span {
vertical-align: sub; }
/* Alert with Icon */
.alert-icon-left {
border-left: 64px solid; }
.alert-icon-left svg:not(.close) {
color: #fff;
width: 4rem;
left: -4rem;
text-align: center;
position: absolute;
top: 50%;
margin-top: -10px;
font-size: 1.25rem;
font-weight: 400;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }
.alert-icon-right {
border-right: 64px solid; }
.alert-icon-right svg:not(.close) {
color: #fff;
width: 4rem;
right: -4rem;
text-align: center;
position: absolute;
top: 50%;
margin-top: -10px;
font-size: 1.25rem;
font-weight: 400;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }
.alert-icon-right i {
float: left;
margin-right: 7px; }
.alert[class*=alert-arrow-]:before {
content: '';
display: inline-block;
position: absolute;
top: 50%;
left: 0;
border-left: 8px solid;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left-color: inherit;
margin-top: -8px; }
.alert.alert-arrow-right:before {
left: auto;
right: 0;
border-left: 0;
border-right: 8px solid;
border-right-color: inherit; }
@media (max-width: 575px) {
.custom-alert-1 .media-body {
display: block; }
.alert .btn {
margin-top: 8px; } }

View File

@ -0,0 +1,94 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.avatar {
position: relative;
display: inline-block;
width: 3rem;
height: 3rem;
font-size: 1rem; }
.avatar--group {
display: inline-flex;
margin-right: 15px; }
.avatar img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover; }
.avatar .avatar-title {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background-color: #bfc9d4;
color: #fff; }
.avatar--group .avatar-xl {
margin-left: -1.28125rem; }
.avatar--group .avatar {
margin-left: -.75rem; }
.avatar--group img, .avatar--group .avatar .avatar-title {
border: 2px solid #ffffff; }
.avatar-xl {
width: 5.125rem;
height: 5.125rem;
font-size: 1.70833rem; }
.avatar-lg {
width: 4rem;
height: 4rem;
font-size: 1.33333rem; }
.avatar-sm {
width: 2.5rem;
height: 2.5rem;
font-size: .83333rem; }
/*
Indicators
*/
.avatar-indicators:before {
content: "";
position: absolute;
bottom: 1%;
right: 5%;
width: 28%;
height: 28%;
border-radius: 50%;
border: 3px solid #fff; }
.avatar-offline:before {
background-color: #bfc9d4; }
.avatar-online:before {
background-color: #009688; }
.avatar.translateY-axis img, .avatar.translateY-axis .avatar-title {
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.avatar.translateY-axis img:hover, .avatar.translateY-axis .avatar-title:hover {
-webkit-transform: translateY(-5px) scale(1.02);
transform: translateY(-5px) scale(1.02); }
.avatar.translateX-axis img, .avatar.translateX-axis .avatar-title {
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.avatar.translateX-axis img:hover, .avatar.translateX-axis .avatar-title:hover {
-webkit-transform: translateX(5px) scale(1.02);
transform: translateX(5px) scale(1.02); }

View File

@ -0,0 +1,242 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.breadcrumb {
background-color: transparent;
margin-bottom: 0; }
/*
Breadcrumb 1
*/
.breadcrumb-one {
display: inline-block; }
.breadcrumb-one .breadcrumb {
padding: 0;
vertical-align: text-bottom; }
.breadcrumb-one .breadcrumb-item {
align-self: center; }
.breadcrumb-one .breadcrumb-item a {
color: #888ea8;
vertical-align: text-bottom; }
.breadcrumb-one .breadcrumb-item a svg {
width: 18px;
height: 18px;
vertical-align: sub;
fill: #e0e6ed; }
.breadcrumb-one .breadcrumb-item.active a {
color: #515365; }
.breadcrumb-one .breadcrumb-item span {
vertical-align: text-bottom; }
.breadcrumb-one .breadcrumb-item.active {
color: #3b3f5c;
font-weight: 600; }
.breadcrumb-one .breadcrumb-item + .breadcrumb-item {
padding: 0px; }
.breadcrumb-one .breadcrumb-item + .breadcrumb-item::before {
color: #888ea8;
padding: 0 6px 0 6px; }
/*
Breadcrumb 2
*/
.breadcrumb-two .breadcrumb {
list-style: none;
overflow: hidden;
padding: 0; }
.breadcrumb-two .breadcrumb li {
float: left; }
.breadcrumb-two .breadcrumb-item + .breadcrumb-item::before {
color: #fff; }
.breadcrumb-two .breadcrumb li a {
color: #1b55e2;
text-decoration: none;
padding: 6px 0 6px 40px;
background: #ebedf2;
position: relative;
display: block;
float: left; }
.breadcrumb-two .breadcrumb li a:after {
content: " ";
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent;
/* Go big on the size, and let overflow hide */
border-bottom: 50px solid transparent;
border-left: 30px solid #ebedf2;
position: absolute;
top: 50%;
margin-top: -50px;
left: 100%;
z-index: 2; }
.breadcrumb-two .breadcrumb li a:before {
content: " ";
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent;
/* Go big on the size, and let overflow hide */
border-bottom: 50px solid transparent;
border-left: 30px solid #ebedf2;
position: absolute;
top: 50%;
margin-top: -50px;
margin-left: 1px;
left: 100%;
z-index: 1; }
.breadcrumb-two .breadcrumb li:last-child a:before {
margin-left: -6px; }
.breadcrumb-two .breadcrumb li:first-child a {
padding-left: 10px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px; }
.breadcrumb-two .breadcrumb li.active a {
background: #1b55e2;
color: #fff; }
.breadcrumb-two .breadcrumb li.active a:after {
border-left-color: #1b55e2; }
.breadcrumb-two .breadcrumb li:last-child a {
pointer-events: none;
cursor: default;
padding-left: 20px;
padding-right: 20px;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px; }
.breadcrumb-two .breadcrumb li:last-child a:after {
border: none; }
/*
Breadcrumb 3
*/
.breadcrumb-three {
padding: 0;
background-color: transparent; }
.breadcrumb-three .breadcrumb {
padding: 0; }
.breadcrumb-three .breadcrumb-item {
color: #888ea8;
padding: 9px 9px;
background: #f1f2f3;
border-bottom-right-radius: 13px;
border-top-right-radius: 13px; }
.breadcrumb-three .breadcrumb-item.active {
color: #1b55e2;
font-weight: 600; }
.breadcrumb-three .breadcrumb-item + .breadcrumb-item::before {
color: #515365;
font-weight: 700;
font-size: 13px;
content: '';
padding: 0px 6px;
vertical-align: sub; }
/*
Breadcrumb 4
*/
.breadcrumb-four .breadcrumb {
display: inline-flex;
padding: 0;
background-color: transparent;
margin-bottom: 0; }
.breadcrumb-four .breadcrumb li {
position: relative;
font-size: 14px;
background: #fff;
margin-right: 20px;
margin-bottom: 6px;
padding: 7px 10px;
border-radius: 10px;
border: 1px solid #e0e6ed;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px 1px 8px 0px rgba(31, 45, 61, 0.1); }
.breadcrumb-four .breadcrumb li:last-child {
margin-right: 0; }
.breadcrumb-four .breadcrumb li:not(:first-child):before {
content: '';
position: absolute;
border-radius: 50%;
height: 4px;
width: 4px;
background: #1b55e2;
left: -13px;
top: 50%; }
.breadcrumb-four .breadcrumb li a {
color: #555;
vertical-align: sub; }
.breadcrumb-four .breadcrumb li a:hover {
text-decoration: none;
color: #4d7496; }
.breadcrumb-four .breadcrumb li:not(:first-child) svg {
margin-right: 5px; }
.breadcrumb-four .breadcrumb li svg {
color: #6f6f6f;
vertical-align: text-bottom;
width: 20px; }
.breadcrumb-four .breadcrumb li.active a {
color: #1b55e2 !important;
font-weight: 600; }
.breadcrumb-four .breadcrumb li.active svg {
color: #1b55e2; }
.breadcrumb-four .breadcrumb li span {
vertical-align: text-bottom; }
/*
Breadcrumb 5
*/
.breadcrumb-five .breadcrumb {
padding: 0;
background-color: transparent;
margin-bottom: 0; }
.breadcrumb-five .breadcrumb li {
position: relative;
font-size: 14px;
margin-right: 20px;
padding: 0 7px; }
.breadcrumb-five .breadcrumb li:last-child {
margin-right: 0; }
.breadcrumb-five .breadcrumb li:not(:first-child):before {
content: '';
position: absolute;
border-radius: 50%;
height: 4px;
width: 4px;
background: #1b55e2;
left: -13px;
top: 50%; }
.breadcrumb-five .breadcrumb li a {
color: #555;
vertical-align: sub; }
.breadcrumb-five .breadcrumb li a:hover {
text-decoration: none;
color: #4d7496; }
.breadcrumb-five .breadcrumb li svg {
color: #6f6f6f;
vertical-align: bottom;
width: 20px; }
.breadcrumb-five .breadcrumb li.active a {
color: #1b55e2 !important;
font-weight: 600; }
@media (max-width: 575px) {
.breadcrumb-two .breadcrumb li {
padding: 0; }
.breadcrumb-two .breadcrumb li a {
padding: 6px 10px 6px 10px;
margin-bottom: 5px; }
.breadcrumb-two .breadcrumb li a:after {
display: none; }
.breadcrumb-two .breadcrumb-item + .breadcrumb-item::before, .breadcrumb-two .breadcrumb li a:before {
display: none; } }

View File

@ -0,0 +1,45 @@
.widget {
border: none;
box-shadow: none;
}
/*---------Palette Box--------*/
.color-box {
display: flex;
align-items: center;
padding: 10px;
border: 1px solid #e0e6ed;
border-radius: 6px;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
-moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
background: white;
}
.color-box .cl-example {
width: 80px;
height: 80px;
margin-right: 20px;
border-radius: 6px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
margin-top: -10px;
margin-left: -10px;
margin-bottom: -10px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.color-box:hover .cl-example {
-webkit-transform: scale(1.09);
transform: scale(1.09);
}
.color-box .cl-info { flex: 1; }
.color-box .cl-title {
font-size: 16px;
font-weight: 600;
margin-bottom: 0;
color: #3b3f5c;
}
.color-box .cl-info span {
font-size: 14px;
color: #888ea8;
font-weight: 600;
}

View File

@ -0,0 +1,265 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
============================
Pagination container
=============================
*/
.paginating-container {
display: flex;
justify-content: center;
margin-bottom: 0; }
.paginating-container .prev svg, .paginating-container .next svg {
width: 18px;
height: 18px;
vertical-align: text-bottom; }
.paginating-container .pagination {
margin-bottom: 0; }
.paginating-container li {
padding: 10px 0;
font-weight: 600;
color: #3b3f5c;
border-radius: 4px; }
.paginating-container li a {
padding: 10px 15px;
font-weight: 600;
color: #3b3f5c; }
.paginating-container li:not(:last-child) {
margin-right: 4px; }
/*
Default Style
*/
.pagination-default li {
border: 2px solid #e0e6ed; }
.pagination-default li:hover {
border: 2px solid #1b55e2 !important; }
.pagination-default li:hover a {
color: #1b55e2; }
.pagination-default li.active {
border: 2px solid #1b55e2 !important;
color: #1b55e2; }
.pagination-default li a.active:hover, .pagination-default li.active a {
color: #1b55e2; }
.pagination-default .prev {
border: 2px solid #e0e6ed; }
.pagination-default .prev:hover {
border: 2px solid #1b55e2; }
.pagination-default .prev:hover a, .pagination-default .prev:hover svg {
color: #1b55e2; }
.pagination-default .next {
border: 2px solid #e0e6ed; }
.pagination-default .next:hover {
border: 2px solid #1b55e2; }
.pagination-default .next:hover a, .pagination-default .next:hover svg {
color: #1b55e2; }
/*
Solid Style
*/
.pagination-solid li {
background-color: #e0e6ed; }
.pagination-solid li:hover a {
color: #1b55e2; }
.pagination-solid li.active {
background-color: #1b55e2 !important;
color: #fff; }
.pagination-solid li a.active:hover, .pagination-solid li.active a {
color: #fff; }
.pagination-solid .prev {
background-color: #e0e6ed; }
.pagination-solid .prev:hover {
background-color: #1b55e2; }
.pagination-solid .prev:hover a, .pagination-solid .prev:hover svg {
color: #fff; }
.pagination-solid .next {
background-color: #e0e6ed; }
.pagination-solid .next:hover {
background-color: #1b55e2; }
.pagination-solid .next:hover a, .pagination-solid .next:hover svg {
color: #fff; }
/*
===================
No Spacing
===================
*/
.pagination-no_spacing {
display: flex;
justify-content: center;
margin-bottom: 0; }
.pagination-no_spacing .prev {
background-color: #e0e6ed;
border-radius: 50%;
padding: 10px 11px;
margin-right: 5px; }
.pagination-no_spacing .prev:hover {
background-color: #1b55e2; }
.pagination-no_spacing .prev:hover svg {
color: #fff; }
.pagination-no_spacing .next {
background-color: #e0e6ed;
border-radius: 50%;
padding: 10px 11px;
margin-left: 5px; }
.pagination-no_spacing .next:hover {
background-color: #1b55e2; }
.pagination-no_spacing .next:hover svg {
color: #fff; }
.pagination-no_spacing .prev svg, .pagination-no_spacing .next svg {
width: 18px;
height: 18px;
vertical-align: text-bottom; }
.pagination-no_spacing .pagination {
margin-bottom: 0; }
.pagination-no_spacing li {
background-color: #e0e6ed;
padding: 10px 0;
font-weight: 600;
color: #3b3f5c; }
.pagination-no_spacing li:first-child {
border-top-left-radius: 50px;
border-bottom-left-radius: 50px; }
.pagination-no_spacing li:last-child {
border-top-right-radius: 50px;
border-bottom-right-radius: 50px; }
.pagination-no_spacing li a {
padding: 10px 15px;
font-weight: 600;
color: #3b3f5c; }
.pagination-no_spacing li a.active {
background-color: #1b55e2 !important;
border-radius: 6px;
color: #fff; }
.pagination-no_spacing li a.active:hover {
color: #fff; }
.pagination-no_spacing li a:hover {
color: #1b55e2; }
/*
=======================
Custom Pagination
=======================
*/
/*
Custom Solid
*/
.pagination-custom_solid {
display: flex;
justify-content: center;
margin-bottom: 0; }
.pagination-custom_solid .prev {
background-color: #e0e6ed;
border-radius: 50%;
padding: 10px 11px;
margin-right: 25px; }
.pagination-custom_solid .prev:hover {
background-color: #1b55e2; }
.pagination-custom_solid .prev:hover svg {
color: #fff; }
.pagination-custom_solid .next {
background-color: #e0e6ed;
border-radius: 50%;
padding: 10px 11px;
margin-left: 25px; }
.pagination-custom_solid .next:hover {
background-color: #1b55e2; }
.pagination-custom_solid .next:hover svg {
color: #fff; }
.pagination-custom_solid .prev svg, .pagination-custom_solid .next svg {
width: 18px;
height: 18px;
vertical-align: text-bottom; }
.pagination-custom_solid .pagination {
margin-bottom: 0; }
.pagination-custom_solid li {
background-color: #e0e6ed;
padding: 10px 0;
font-weight: 600;
color: #3b3f5c; }
.pagination-custom_solid li:first-child {
border-top-left-radius: 50px;
border-bottom-left-radius: 50px; }
.pagination-custom_solid li:last-child {
border-top-right-radius: 50px;
border-bottom-right-radius: 50px; }
.pagination-custom_solid li a {
padding: 10px 15px;
font-weight: 600;
color: #3b3f5c; }
.pagination-custom_solid li a.active {
background-color: #1b55e2 !important;
border-radius: 6px;
color: #fff; }
.pagination-custom_solid li a.active:hover {
color: #fff; }
.pagination-custom_solid li a:hover {
color: #1b55e2; }
/*
Custom Outline
*/
.pagination-custom_outline {
display: flex;
justify-content: center;
margin-bottom: 0; }
.pagination-custom_outline .prev {
border: 2px solid #e0e6ed;
border-radius: 50%;
padding: 8px 11px;
margin-right: 25px; }
.pagination-custom_outline .prev:hover {
border: 2px solid #1b55e2; }
.pagination-custom_outline .prev:hover svg {
color: #1b55e2; }
.pagination-custom_outline .next {
border: 2px solid #e0e6ed;
border-radius: 50%;
padding: 8px 11px;
margin-left: 25px; }
.pagination-custom_outline .next:hover {
border: 2px solid #1b55e2; }
.pagination-custom_outline .next:hover svg {
color: #1b55e2; }
.pagination-custom_outline .prev svg, .pagination-custom_outline .next svg {
width: 16px;
height: 16px;
vertical-align: text-bottom; }
.pagination-custom_outline .pagination {
margin-bottom: 0; }
.pagination-custom_outline li {
padding: 10px 0;
font-weight: 600;
color: #3b3f5c;
border: 1px solid #e0e6ed; }
.pagination-custom_outline li.active {
background-color: #e0e6ed; }
.pagination-custom_outline li:first-child {
border-top-left-radius: 50px;
border-bottom-left-radius: 50px; }
.pagination-custom_outline li:last-child {
border-top-right-radius: 50px;
border-bottom-right-radius: 50px; }
.pagination-custom_outline li a {
padding: 10px 15px;
font-weight: 600;
color: #3b3f5c; }
.pagination-custom_outline li a:hover {
color: #1b55e2; }
.pagination-custom_outline li.active a {
background-color: #ffffff;
border: 2px solid #1b55e2 !important;
border-radius: 6px;
color: #1b55e2; }

View File

@ -0,0 +1,125 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/* Tree View */
#myUL {
list-style-type: none;
margin: 0;
padding: 0;
color: #3b3f5c;
font-weight: 600; }
#myUL ul {
list-style-type: none; }
.caret {
cursor: pointer;
-webkit-user-select: none;
/* Safari 3.1+ */
-moz-user-select: none;
/* Firefox 2+ */
-ms-user-select: none;
/* IE 10+ */
user-select: none;
font-size: 13px;
color: #0e1726;
text-transform: capitalize; }
.caret.caret-down::before {
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="%232b50ed" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-folder-plus"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path><line x1="12" y1="11" x2="12" y2="17"></line><line x1="9" y1="14" x2="15" y2="14"></line></svg>'); }
.caret::before {
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="%232b50ed" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-folder-minus"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path><line x1="9" y1="14" x2="15" y2="14"></line></svg>');
color: #888ea8;
display: inline-block;
margin-right: 6px;
vertical-align: sub; }
.nested {
display: none;
padding-left: 28px; }
.nested li {
margin-top: 8px;
margin-bottom: 8px;
color: #5c1ac3;
font-size: 13px; }
.active {
display: block; }
.file-tree {
margin-bottom: 0;
padding-left: 20px;
list-style: none;
overflow: hidden; }
.file-tree * {
list-style-type: none; }
.file-tree ul {
list-style: none;
display: none;
padding-left: 30px; }
.file-tree li {
position: relative;
padding: 5px 0;
border-radius: 0.25rem;
cursor: auto;
white-space: nowrap;
font-size: 0.875rem;
font-weight: 600;
color: #0e1726; }
.file-tree .file-tree-folder {
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
transition-delay: 0s;
cursor: pointer; }
.file-tree .file-tree-folder::before {
content: "\e9b9";
font-size: 1.25rem; }
.file-tree .file-tree-folder::after {
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
transition-delay: 0s;
position: absolute;
top: .4rem;
left: -2em;
content: "\f182";
display: block;
text-align: center;
font-family: 'flaticon' !important;
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="%232b50ed" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>');
font-size: 10px;
color: #2196f3; }
.file-tree .file-tree-folder.open::after {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
transform: rotate(180deg); }
.file-tree li.file-tree-folder::before {
display: inline-block;
text-align: center;
width: 30px;
margin-right: .25rem;
vertical-align: middle;
font-size: 1rem;
color: #2196f3;
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="%232b50ed" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-folder"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path></svg>'); }
.file-tree li::before {
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="%232b50ed" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>');
font-size: 1rem;
color: #2196f3;
margin-right: 9px;
position: relative;
top: 2px; }
@media (max-width: 767px) {
.custo-radio {
margin-top: 5px; } }

View File

@ -0,0 +1,28 @@
.element-background {
padding: 15px;
border: 1px solid #bfc9d4;
border-radius: 6px;
}
.font-family-showcase {
width: 18rem;
border: 1px solid #e0e6ed;
border-radius: 6px;
background: #fff;
margin: 0 auto;
}
.font-family-showcase .font-family-text { padding: 20px; border-bottom: 1px solid #e0e6ed; }
.font-family-showcase .font-family-text p { font-size: 40px; margin-bottom: 0; }
.font-family-showcase .font-family-info { padding: 20px; background-color: #ebedf2; }
.font-family-showcase .font-family-info h5 { font-size: 17px; margin-bottom: 0; }
.font-family-showcase .font-family-info a {
font-weight: 600;
font-size: 13px;
color: #1b55e2;
}
.font-family-showcase .font-family-info .font-family-link {
margin-top: 30px;
text-align: center;
}
@media (max-width: 575px) {
.font-family-showcase { width: auto; }
}

View File

@ -0,0 +1,131 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Infobox 1
*/
.infobox-1 {
border: 1px solid #e0e6ed;
width: 50%;
padding: 25px;
border-radius: 6px;
-webkit-box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
margin-right: auto;
margin-left: auto; }
.infobox-1 .info-icon svg {
width: 50px;
height: 50px;
stroke-width: 1px;
margin-bottom: 20px;
color: #1b55e2; }
.infobox-1 .info-heading {
font-weight: 600;
font-size: 19px;
margin-bottom: 14px;
letter-spacing: 2px; }
.infobox-1 .info-text {
font-size: 15px;
color: #888ea8;
margin-bottom: 15px; }
.infobox-1 .info-link {
color: #1b55e2;
font-weight: 600; }
.infobox-1 .info-link svg {
width: 15px;
height: 15px; }
/*
Infobox 2
*/
.infobox-2 {
border: 1px solid #e0e6ed;
width: 50%;
padding: 25px;
border-radius: 6px;
background: #3b3f5c;
-webkit-box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
margin-right: auto;
margin-left: auto; }
.infobox-2 .info-icon {
border-radius: 50%;
background: #888ea8;
display: inline-block;
padding: 15px;
margin-bottom: 20px; }
.infobox-2 .info-icon svg {
width: 50px;
height: 50px;
stroke-width: 1px;
color: #d3d3d3; }
.infobox-2 .info-heading {
font-weight: 600;
font-size: 19px;
margin-bottom: 14px;
letter-spacing: 2px;
color: #fff; }
.infobox-2 .info-text {
font-size: 15px;
color: #e0e6ed;
margin-bottom: 15px; }
.infobox-2 .info-link {
color: #2196f3;
font-weight: 600; }
.infobox-2 .info-link svg {
width: 15px;
height: 15px; }
/*
Infobox 3
*/
.infobox-3 {
position: relative;
border: 1px solid #e0e6ed;
width: 50%;
margin-top: 30px;
padding: 50px 25px 25px 25px;
border-radius: 6px;
-webkit-box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
box-shadow: 0px 2px 10px 1px rgba(31, 45, 61, 0.1);
margin-right: auto;
margin-left: auto; }
.infobox-3 .info-icon {
position: absolute;
margin-bottom: 20px;
background: #1b55e2;
display: inline-block;
top: -31px;
padding: 6px;
border-radius: 6px; }
.infobox-3 .info-icon svg {
width: 50px;
height: 50px;
stroke-width: 1px;
color: #fff; }
.infobox-3 .info-heading {
font-weight: 600;
font-size: 19px;
margin-bottom: 14px;
letter-spacing: 2px; }
.infobox-3 .info-text {
font-size: 15px;
color: #888ea8;
margin-bottom: 15px; }
.infobox-3 .info-link {
color: #1b55e2;
font-weight: 600; }
.infobox-3 .info-link svg {
width: 15px;
height: 15px; }
@media (max-width: 575px) {
.infobox-1, .infobox-2, .infobox-3 {
width: auto; } }

View File

@ -0,0 +1,16 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.jumbotron p {
text-align: left; }
.display-4 {
word-wrap: break-word;
font-size: 45px; }

View File

@ -0,0 +1,130 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.popovers-section h6 {
color: #3b3f5c;
font-size: 0.875rem;
margin-top: 25px;
margin-bottom: 20px; }
.popover {
border: 1px solid #ebedf2;
border-radius: 4px; }
/*
Popovers
*/
.popover-primary {
border-color: #c2d5ff; }
.popover-success {
border-color: #e6ffbf; }
.popover-info {
border-color: #bae7ff; }
.popover-danger {
border-color: #ffe1e2; }
.popover-warning {
border-color: #ffeccb; }
.popover-secondary {
border-color: #dccff7; }
.popover-dark {
border-color: #acb0c3; }
/* popover Arrow */
.popover-primary .arrow:after, .popover-primary .arrow:before {
border-top-color: #c2d5ff; }
.popover-success .arrow:after, .popover-success .arrow:before {
border-top-color: #e6ffbf; }
.popover-info .arrow:after, .popover-info .arrow:before {
border-top-color: #bae7ff; }
.popover-danger .arrow:after, .popover-danger .arrow:before {
border-top-color: #ffe1e2; }
.popover-warning .arrow:after, .popover-warning .arrow:before {
border-top-color: #ffeccb; }
.popover-secondary .arrow:after, .popover-secondary .arrow:before {
border-top-color: #dccff7; }
.popover-dark .arrow:after, .popover-dark .arrow:before {
border-top-color: #acb0c3; }
/* popover Header */
.popover-primary .popover-header {
background-color: #c2d5ff;
border: none;
color: #1b55e2; }
.popover-success .popover-header {
background-color: #e6ffbf;
border: none;
color: #8dbf42; }
.popover-info .popover-header {
background-color: #bae7ff;
border: none;
color: #2196f3; }
.popover-danger .popover-header {
background-color: #ffe1e2;
border: none;
color: #e7515a; }
.popover-warning .popover-header {
background-color: #ffeccb;
border: none;
color: #e2a03f; }
.popover-secondary .popover-header {
background-color: #dccff7;
border: none;
color: #5c1ac3; }
.popover-dark .popover-header {
background-color: #acb0c3;
border: none;
color: #3b3f5c; }
/* Popover Body */
.popover-primary .popover-body {
background-color: #c2d5ff;
color: #1b55e2; }
.popover-success .popover-body {
background-color: #e6ffbf;
color: #8dbf42; }
.popover-info .popover-body {
background-color: #bae7ff;
color: #2196f3; }
.popover-danger .popover-body {
background-color: #ffe1e2;
color: #e7515a; }
.popover-warning .popover-body {
background-color: #ffeccb;
color: #e2a03f; }
.popover-secondary .popover-body {
background-color: #dccff7;
color: #5c1ac3; }
.popover-dark .popover-body {
background-color: #acb0c3;
color: #3b3f5c; }

View File

@ -0,0 +1,213 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Live Search
*/
.filtered-list-search {
margin-top: 0;
margin-bottom: 50px; }
.filtered-list-search form > div {
position: relative; }
.filtered-list-search form input {
border: none;
padding: 10px 16px;
background: #fff;
-webkit-box-shadow: 0 0 4px 2px rgba(31, 45, 61, 0.1);
box-shadow: 0 0 4px 2px rgba(31, 45, 61, 0.1); }
.filtered-list-search form input:focus {
box-shadow: 0 0 4px 2px rgba(31, 45, 61, 0.1); }
.filtered-list-search form button {
border-radius: 50%;
padding: 7px 7px;
position: absolute;
right: 4px;
top: 4px; }
.filtered-list-search form input::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: #888ea8; }
.filtered-list-search form input::-moz-placeholder {
/* Firefox 19+ */
color: #888ea8; }
.filtered-list-search form input:-ms-input-placeholder {
/* IE 10+ */
color: #888ea8; }
.filtered-list-search form input:-moz-placeholder {
/* Firefox 18- */
color: #888ea8; }
.searchable-container {
max-width: 1140px;
margin: 0 auto; }
.searchable-items {
padding: 13px;
border: 1px solid #e0e6ed;
border-radius: 10px; }
.searchable-container .searchable-items {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch; }
.searchable-container .items {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-align: center;
align-items: center;
padding: .75rem .625rem;
position: relative;
display: -ms-flexbox;
display: flex;
min-width: 0;
word-wrap: break-word;
justify-content: space-between;
background: #fff;
margin-bottom: 15px;
border-radius: 14px;
padding: 13px 18px;
width: 100%;
color: #0e1726;
min-width: 625px;
transition: all 0.35s ease;
cursor: pointer;
-webkit-box-shadow: 0px 2px 9px 2px rgba(31, 45, 61, 0.1);
box-shadow: 0px 2px 9px 2px rgba(31, 45, 61, 0.1); }
.searchable-container .items:hover {
-webkit-transform: translateY(0) scale(1.03);
transform: translateY(0) scale(1.03);
transform: translateY(0) scale(1.01); }
.searchable-container .items .user-profile {
display: flex; }
.searchable-container .items .user-profile img {
width: 43px;
height: 43px;
border-radius: 5px; }
.searchable-container .items .user-name p, .searchable-container .items .user-work p, .searchable-container .items .user-email p {
margin-bottom: 0;
color: #888ea8;
font-weight: 600; }
.searchable-container .items .user-status span.badge {
background: transparent;
transform: none; }
.searchable-container .items .user-status span.badge.badge-warning {
color: #e2a03f;
border: 2px dashed #e2a03f; }
.searchable-container .items .user-status span.badge.badge-danger {
color: #e7515a;
border: 2px dashed #e7515a; }
.searchable-container .items .user-status span.badge.badge-primary {
color: #1b55e2;
border: 2px dashed #1b55e2; }
.searchable-container .items .action-btn p {
margin-bottom: 0;
color: #3b3f5c;
cursor: pointer;
font-weight: 600; }
.searchable-container .items:hover .serial-number p, .searchable-container .items:hover .user-name p, .searchable-container .items:hover .user-work p, .searchable-container .items:hover .user-email p, .searchable-container .items:hover .action-btn p {
color: #1b55e2; }
/*
Line Search
*/
.full-search.search-form-overlay {
height: 50px;
position: relative;
border: 1px solid #e0e6ed;
border-radius: 5px;
padding: 6px; }
.search-form-overlay.input-focused .form-inline.search {
position: absolute;
bottom: 0;
top: 0;
background: #fff;
height: 100%;
width: 100%;
left: 0;
right: 0;
z-index: 32;
border-radius: 0;
margin-top: 0px !important;
display: flex;
padding: 0; }
.search-form-overlay .form-inline {
justify-content: flex-end; }
.search-form-overlay .form-inline svg {
font-weight: 600;
margin: 4px 10px;
cursor: pointer;
color: #888ea8; }
.search-form-overlay.input-focused .form-inline svg {
margin: 0;
position: absolute;
top: 10px;
left: 11px; }
.search-form-overlay.input-focused .form-inline.search .search-bar {
width: 100%; }
.search-form-overlay form.form-inline input.search-form-control {
width: 100%;
font-size: 13px;
background-color: #e3e3e3;
padding-top: 8px;
padding-bottom: 8px;
border: none;
color: #515365;
letter-spacing: 1px; }
.search-form-overlay .form-inline.search .search-form-control {
border: none;
width: 100%;
display: none;
box-shadow: none; }
.search-form-overlay.input-focused .form-inline.search .search-form-control {
background: transparent;
border-bottom: none;
display: block;
padding-left: 45px; }
.demo-search-overlay {
display: none;
position: absolute;
width: 100%;
height: 100%;
background: #fff !important;
z-index: 0;
opacity: 0;
transition: all 0.5s ease-in-out;
left: 0;
right: 0; }
.demo-search-overlay.show {
display: block;
opacity: .1; }
/*
Search Box
*/
.search-input-group-style.input-group {
-webkit-box-shadow: 0px 0px 0px 1px rgba(136, 142, 168, 0.313725);
box-shadow: 0px 0px 0px 1px rgba(136, 142, 168, 0.313725); }
.search-input-group-style.input-group .input-group-prepend .input-group-text {
border: 1px solid #ffffff;
background-color: #ffffff; }
.search-input-group-style.input-group .input-group-prepend .input-group-text svg {
color: #1b55e2; }
.search-input-group-style input {
border: none;
border-radius: 4px;
padding: 6px 16px;
color: #0e1726; }

View File

@ -0,0 +1,81 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.tooltip-inner {
border-radius: 6px; }
.tooltip .tooltip-item {
color: #fff;
padding: 0 9px; }
.tooltip-section h6 {
color: #3b3f5c;
font-size: 0.875rem;
margin-top: 25px;
margin-bottom: 20px; }
/*
==================
Colors
=================
*/
/*
Tooltips
*/
/* Tooltip Inner */
.tooltip-primary .tooltip-inner {
color: #1b55e2;
background-color: #c2d5ff; }
.tooltip-success .tooltip-inner {
color: #8dbf42;
background-color: #e6ffbf; }
.tooltip-info .tooltip-inner {
color: #2196f3;
background-color: #bae7ff; }
.tooltip-danger .tooltip-inner {
color: #e7515a;
background-color: #ffe1e2; }
.tooltip-warning .tooltip-inner {
color: #e2a03f;
background-color: #ffeccb; }
.tooltip-secondary .tooltip-inner {
color: #5c1ac3;
background-color: #dccff7; }
.tooltip-dark .tooltip-inner {
color: #3b3f5c;
background-color: #acb0c3; }
/* Tooltip arrow */
.tooltip-primary .arrow:before {
border-top-color: #c2d5ff; }
.tooltip-success .arrow:before {
border-top-color: #e6ffbf; }
.tooltip-info .arrow:before {
border-top-color: #bae7ff; }
.tooltip-danger .arrow:before {
border-top-color: #ffe1e2; }
.tooltip-warning .arrow:before {
border-top-color: #ffeccb; }
.tooltip-secondary .arrow:before {
border-top-color: #dccff7; }
.tooltip-dark .arrow:before {
border-top-color: #acb0c3; }

View File

@ -0,0 +1,110 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.row .col-lg-12 .widget .widget-header h4 {
color: #000000;
font-size: 20px; }
body {
color: #515365;
font-weight: 600; }
.form-control {
border: 1px solid #ebedf2;
border-radius: 4px;
color: #F49499; }
.form-control:disabled, .form-control[readonly] {
background-color: #f1f2f3; }
.form-control:focus {
border-color: #5c1ac3; }
.help-block, .help-inline {
color: #888ea8; }
.input-group-addon {
background-color: #ebedf2;
color: #3b3f5c; }
.dropdown-toggle:after {
color: #3b3f5c; }
.has-warning .control-label, .has-warning .help-block {
color: #ffbb44; }
.has-warning .form-control {
border-color: #ffbb44; }
.has-error .control-label, .has-error .help-block {
color: #ee3d49; }
.has-error .form-control {
border-color: #ee3d49; }
.has-success .control-label, .has-success .help-block {
color: #009688; }
.has-success .form-control {
border-color: #009688; }
.ui-spinner-button {
border: 1px solid #ebedf2;
color: #d3d3d3; }
.form-horizontal .radio, .form-horizontal .radio-inline {
color: #888ea8;
font-weight: normal; }
div.tagsinput {
border: 1px solid #ebedf2; }
div.tagsinput span.tag {
background: #edf1f7;
border: 1px solid #ebedf2; }
.select2-container .select2-choice {
border: 1px solid #ebedf2;
color: #888ea8;
font-size: 13px;
font-weight: normal; }
.select2-default {
color: #888ea8 !important;
font-size: 13px !important;
font-weight: normal; }
.select2-container .select2-choice .select2-arrow {
border: 1px solid #f1f2f3;
background: #fff; }
.select2-container-multi .select2-choices {
border: 1px solid #ebedf2; }
.select2-container-multi .select2-choices .select2-search-choice {
border: 1px solid #f1f2f3;
color: #888ea8;
font-weight: normal;
font-size: 13px; }
.checkbox, .radio {
position: relative;
display: block;
cursor: pointer; }
.checkbox-inline, .radio-inline {
position: relative;
display: inline-block;
vertical-align: middle;
cursor: pointer; }
.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline {
padding-top: 7px;
margin-top: 0;
margin-bottom: 0; }
.form-horizontal .checkbox, .form-horizontal .radio {
min-height: 27px; }

View File

@ -0,0 +1,23 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
textarea {
resize: none; }
.clipboard {
background-color: #f1f2f3;
padding: 20px;
border-radius: 6px; }
.clipboard.copy-txt {
background-color: #f1f2f3; }
.clipboard.copy-txt .otp-pass span {
font-size: 24px;
font-weight: 600;
color: #3b3f5c; }

View File

@ -0,0 +1,226 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
==================
Switches
==================
*/
/* The switch - the box around the slider */
.switch {
position: relative;
display: inline-block;
width: 35px;
height: 18px; }
.switch input {
display: none; }
.switch .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ebedf2;
-webkit-transition: .4s;
transition: .4s; }
.switch .slider:before {
position: absolute;
content: "";
background-color: white;
-webkit-transition: .4s;
-ms-transition: .4s;
transition: .4s;
height: 14px;
width: 14px;
left: 2px;
bottom: 2px;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch input:checked + .slider:before {
-webkit-transform: translateX(17px);
-ms-transform: translateX(17px);
transform: translateX(17px); }
.switch .slider.round {
border-radius: 34px; }
.switch .slider.round:before {
border-radius: 50%; }
.switch.s-default .slider:before {
background-color: #d3d3d3; }
.switch.s-primary .slider:before {
background-color: #1b55e2; }
.switch.s-success .slider:before {
background-color: #8dbf42; }
.switch.s-warning .slider:before {
background-color: #e2a03f; }
.switch.s-danger .slider:before {
background-color: #e7515a; }
.switch.s-secondary .slider:before {
background-color: #5c1ac3; }
.switch.s-info .slider:before {
background-color: #2196f3; }
.switch.s-dark .slider:before {
background-color: #3b3f5c; }
.switch input:checked + .slider:before {
background-color: #fff; }
.switch.s-default input:checked + .slider {
background-color: #d3d3d3; }
.switch.s-default input:focus + .slider {
box-shadow: 0 0 1px #ebedf2; }
.switch.s-primary input:checked + .slider {
background-color: #1b55e2; }
.switch.s-primary input:focus + .slider {
box-shadow: 0 0 1px #1b55e2; }
.switch.s-success input:checked + .slider {
background-color: #8dbf42; }
.switch.s-success input:focus + .slider {
box-shadow: 0 0 1px #8dbf42; }
.switch.s-warning input:checked + .slider {
background-color: #e2a03f; }
.switch.s-warning input:focus + .slider {
box-shadow: 0 0 1px #e2a03f; }
.switch.s-danger input:checked + .slider {
background-color: #e7515a; }
.switch.s-danger input:focus + .slider {
box-shadow: 0 0 1px #e7515a; }
.switch.s-secondary input:checked + .slider {
background-color: #5c1ac3; }
.switch.s-secondary input:focus + .slider {
box-shadow: 0 0 1px #5c1ac3; }
.switch.s-info input:checked + .slider {
background-color: #2196f3; }
.switch.s-info input:focus + .slider {
box-shadow: 0 0 1px #2196f3; }
.switch.s-dark input:checked + .slider {
background-color: #3b3f5c; }
.switch.s-dark input:focus + .slider {
box-shadow: 0 0 1px #3b3f5c; }
.switch.s-outline .slider {
border: 2px solid #ebedf2;
background-color: transparent;
width: 36px;
height: 19px; }
.switch.s-outline .slider:before {
height: 13px;
width: 13px; }
.switch.s-outline[class*="s-outline-"] .slider:before {
bottom: 1px;
left: 1px;
border: 2px solid #bfc9d4;
background-color: #bfc9d4;
color: #ebedf2;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.25); }
.switch.s-icons.s-outline-default {
color: #d3d3d3; }
.switch.s-icons.s-outline-primary {
color: #1b55e2; }
.switch.s-icons.s-outline-success {
color: #8dbf42; }
.switch.s-icons.s-outline-warning {
color: #e2a03f; }
.switch.s-icons.s-outline-danger {
color: #e7515a; }
.switch.s-icons.s-outline-secondary {
color: #5c1ac3; }
.switch.s-icons.s-outline-info {
color: #2196f3; }
.switch.s-icons.s-outline-dark {
color: #3b3f5c; }
.switch.s-outline-default input:checked + .slider {
border: 2px solid #ebedf2; }
.switch.s-outline-default input:checked + .slider:before {
border: 2px solid #d3d3d3;
background-color: #d3d3d3;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.25); }
.switch.s-outline-default input:focus + .slider {
box-shadow: 0 0 1px #ebedf2; }
.switch.s-outline-primary input:checked + .slider {
border: 2px solid #1b55e2; }
.switch.s-outline-primary input:checked + .slider:before {
border: 2px solid #1b55e2;
background-color: #1b55e2;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-primary input:focus + .slider {
box-shadow: 0 0 1px #1b55e2; }
.switch.s-outline-success input:checked + .slider {
border: 2px solid #8dbf42; }
.switch.s-outline-success input:checked + .slider:before {
border: 2px solid #8dbf42;
background-color: #8dbf42;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-success input:focus + .slider {
box-shadow: 0 0 1px #8dbf42; }
.switch.s-outline-warning input:checked + .slider {
border: 2px solid #e2a03f; }
.switch.s-outline-warning input:checked + .slider:before {
border: 2px solid #e2a03f;
background-color: #e2a03f;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-warning input:focus + .slider {
box-shadow: 0 0 1px #e2a03f; }
.switch.s-outline-danger input:checked + .slider {
border: 2px solid #e7515a; }
.switch.s-outline-danger input:checked + .slider:before {
border: 2px solid #e7515a;
background-color: #e7515a;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-danger input:focus + .slider {
box-shadow: 0 0 1px #e7515a; }
.switch.s-outline-secondary input:checked + .slider {
border: 2px solid #5c1ac3; }
.switch.s-outline-secondary input:checked + .slider:before {
border: 2px solid #5c1ac3;
background-color: #5c1ac3;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-secondary input:focus + .slider {
box-shadow: 0 0 1px #5c1ac3; }
.switch.s-outline-info input:checked + .slider {
border: 2px solid #2196f3; }
.switch.s-outline-info input:checked + .slider:before {
border: 2px solid #2196f3;
background-color: #2196f3;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-info input:focus + .slider {
box-shadow: 0 0 1px #2196f3; }
.switch.s-outline-dark input:checked + .slider {
border: 2px solid #3b3f5c; }
.switch.s-outline-dark input:checked + .slider:before {
border: 2px solid #3b3f5c;
background-color: #3b3f5c;
box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34); }
.switch.s-outline-dark input:focus + .slider {
box-shadow: 0 0 1px #3b3f5c; }
.switch.s-icons {
width: 57px;
height: 30px; }
.switch.s-icons .slider {
width: 48px;
height: 25px; }
.switch.s-icons .slider:before {
vertical-align: sub;
color: #3b3f5c;
height: 19px;
width: 19px;
line-height: 1.3;
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%23e9ecef" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>'); }
.switch.s-icons input:checked + .slider:before {
content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%23fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check"><polyline points="20 6 9 17 4 12"></polyline></svg>');
vertical-align: sub;
color: #fff;
line-height: 1.4;
-webkit-transform: translateX(23px);
-ms-transform: translateX(23px);
transform: translateX(23px); }
/* Hide default HTML checkbox */
/* The slider */
/* Rounded Slider Switches */
/* Solid Switches*/
/* Outline Switches */
/* Icons Switches */

View File

@ -0,0 +1,275 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*----------Theme checkbox---------*/
.new-control {
position: relative;
display: -ms-inline-flexbox;
display: inline-flex;
padding-left: 1.5rem;
margin-right: 1rem;
font-weight: 100;
font-size: 14px; }
.new-control-input {
position: absolute;
z-index: -1;
opacity: 0; }
.new-control.new-checkbox {
cursor: pointer; }
.new-control.new-checkbox .new-control-indicator {
position: absolute;
top: 2px;
left: 0;
display: block;
width: 17px;
height: 17px;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #e0e6ed;
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
border-radius: 4px; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator {
background: #888ea8; }
.new-control.new-checkbox > input:checked ~ span.new-control-indicator:after {
display: block; }
.new-control.new-checkbox span.new-control-indicator:after {
border: solid #fff;
top: 50%;
left: 50%;
margin-left: -2px;
margin-top: -5px;
width: 4px;
height: 8px;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg);
content: '';
position: absolute;
display: none;
margin-left: -2px;
margin-top: -5px;
width: 4px;
height: 8px;
height: 8px; }
/*rounded checkbox*/
.new-checkbox-rounded span.new-control-indicator {
border-radius: 50% !important; }
/* line through colors */
.new-control.new-checkbox.new-checkbox-text > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-default > input:checked ~ span.new-chk-content {
color: #888ea8; }
.new-control.new-checkbox.new-checkbox-text.checkbox-primary > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-primary > input:checked ~ span.new-chk-content {
color: #1b55e2; }
.new-control.new-checkbox.new-checkbox-text.checkbox-success > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-success > input:checked ~ span.new-chk-content {
color: #8dbf42; }
.new-control.new-checkbox.new-checkbox-text.checkbox-info > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-info > input:checked ~ span.new-chk-content {
color: #2196f3; }
.new-control.new-checkbox.new-checkbox-text.checkbox-warning > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-warning > input:checked ~ span.new-chk-content {
color: #e2a03f; }
.new-control.new-checkbox.new-checkbox-text.checkbox-danger > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-danger > input:checked ~ span.new-chk-content {
color: #e7515a; }
.new-control.new-checkbox.new-checkbox-text.checkbox-secondary > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-secondary > input:checked ~ span.new-chk-content {
color: #5c1ac3; }
.new-control.new-checkbox.new-checkbox-text.checkbox-dark > input:checked ~ span.new-chk-content, .new-control.new-checkbox.new-checkbox-text.checkbox-outline-dark > input:checked ~ span.new-chk-content {
color: #3b3f5c; }
.new-control.new-checkbox.checkbox-primary > input:checked ~ span.new-control-indicator {
background: #1b55e2; }
.new-control.new-checkbox.checkbox-success > input:checked ~ span.new-control-indicator {
background: #8dbf42; }
.new-control.new-checkbox.checkbox-info > input:checked ~ span.new-control-indicator {
background: #2196f3; }
.new-control.new-checkbox.checkbox-warning > input:checked ~ span.new-control-indicator {
background: #e2a03f; }
.new-control.new-checkbox.checkbox-danger > input:checked ~ span.new-control-indicator {
background: #e7515a; }
.new-control.new-checkbox.checkbox-secondary > input:checked ~ span.new-control-indicator {
background: #5c1ac3; }
.new-control.new-checkbox.checkbox-dark > input:checked ~ span.new-control-indicator {
background: #3b3f5c; }
.new-control.new-checkbox[class*="checkbox-outline-"] > input:checked ~ span.new-control-indicator {
background-color: transparent; }
.new-control.new-checkbox.checkbox-outline-default > input:checked ~ span.new-control-indicator {
border: 2px solid #888ea8; }
.new-control.new-checkbox.checkbox-outline-primary > input:checked ~ span.new-control-indicator {
border: 2px solid #1b55e2; }
.new-control.new-checkbox.checkbox-outline-success > input:checked ~ span.new-control-indicator {
border: 2px solid #8dbf42; }
.new-control.new-checkbox.checkbox-outline-info > input:checked ~ span.new-control-indicator {
border: 2px solid #2196f3; }
.new-control.new-checkbox.checkbox-outline-warning > input:checked ~ span.new-control-indicator {
border: 2px solid #e2a03f; }
.new-control.new-checkbox.checkbox-outline-danger > input:checked ~ span.new-control-indicator {
border: 2px solid #e7515a; }
.new-control.new-checkbox.checkbox-outline-secondary > input:checked ~ span.new-control-indicator {
border: 2px solid #5c1ac3; }
.new-control.new-checkbox.checkbox-outline-dark > input:checked ~ span.new-control-indicator {
border: 2px solid #3b3f5c; }
.new-control.new-checkbox.checkbox-outline-default > input:checked ~ span.new-control-indicator:after {
border-color: #888ea8; }
.new-control.new-checkbox.checkbox-outline-primary > input:checked ~ span.new-control-indicator:after {
border-color: #1b55e2; }
.new-control.new-checkbox.checkbox-outline-success > input:checked ~ span.new-control-indicator:after {
border-color: #8dbf42; }
.new-control.new-checkbox.checkbox-outline-info > input:checked ~ span.new-control-indicator:after {
border-color: #2196f3; }
.new-control.new-checkbox.checkbox-outline-warning > input:checked ~ span.new-control-indicator:after {
border-color: #e2a03f; }
.new-control.new-checkbox.checkbox-outline-danger > input:checked ~ span.new-control-indicator:after {
border-color: #e7515a; }
.new-control.new-checkbox.checkbox-outline-secondary > input:checked ~ span.new-control-indicator:after {
border-color: #5c1ac3; }
.new-control.new-checkbox.checkbox-outline-dark > input:checked ~ span.new-control-indicator:after {
border-color: #3b3f5c; }
.new-control.new-radio {
cursor: pointer; }
.new-control.new-radio .new-control-indicator {
position: absolute;
top: 2px;
left: 0;
display: block;
width: 16px;
height: 16px;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #e0e6ed;
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
border-radius: 50%; }
.new-control.new-radio > input:checked ~ span.new-control-indicator {
background: #888ea8; }
.new-control.new-radio span.new-control-indicator:after {
top: 50%;
left: 50%;
margin-left: -3px;
margin-top: -3px;
content: '';
position: absolute;
display: none;
border-radius: 50%;
height: 6px;
width: 6px;
background-color: #fff; }
.new-control.new-radio.square-radio .new-control-indicator, .new-control.new-radio.square-radio span.new-control-indicator:after {
border-radius: 0; }
.new-control.new-radio.radio-primary > input:checked ~ span.new-control-indicator {
background: #1b55e2; }
.new-control.new-radio.radio-success > input:checked ~ span.new-control-indicator {
background: #8dbf42; }
.new-control.new-radio.radio-info > input:checked ~ span.new-control-indicator {
background: #2196f3; }
.new-control.new-radio.radio-warning > input:checked ~ span.new-control-indicator {
background: #e2a03f; }
.new-control.new-radio.radio-danger > input:checked ~ span.new-control-indicator {
background: #e7515a; }
.new-control.new-radio.radio-secondary > input:checked ~ span.new-control-indicator {
background: #5c1ac3; }
.new-control.new-radio.radio-dark > input:checked ~ span.new-control-indicator {
background: #3b3f5c; }
.new-control.new-radio[class*="radio-classic-"] > input:checked ~ span.new-control-indicator {
background-color: transparent; }
.new-control.new-radio.radio-classic-default > input:checked ~ span.new-control-indicator {
border: 3px solid #888ea8; }
.new-control.new-radio.radio-classic-primary > input:checked ~ span.new-control-indicator {
border: 3px solid #1b55e2; }
.new-control.new-radio.radio-classic-success > input:checked ~ span.new-control-indicator {
border: 3px solid #8dbf42; }
.new-control.new-radio.radio-classic-info > input:checked ~ span.new-control-indicator {
border: 3px solid #2196f3; }
.new-control.new-radio.radio-classic-warning > input:checked ~ span.new-control-indicator {
border: 3px solid #e2a03f; }
.new-control.new-radio.radio-classic-danger > input:checked ~ span.new-control-indicator {
border: 3px solid #e7515a; }
.new-control.new-radio.radio-classic-secondary > input:checked ~ span.new-control-indicator {
border: 3px solid #5c1ac3; }
.new-control.new-radio.radio-classic-dark > input:checked ~ span.new-control-indicator {
border: 3px solid #3b3f5c; }
.new-control.new-radio.radio-classic-default > input:checked ~ span.new-control-indicator:after {
background-color: #888ea8; }
.new-control.new-radio.radio-classic-primary > input:checked ~ span.new-control-indicator:after {
background-color: #1b55e2; }
.new-control.new-radio.radio-classic-success > input:checked ~ span.new-control-indicator:after {
background-color: #8dbf42; }
.new-control.new-radio.radio-classic-info > input:checked ~ span.new-control-indicator:after {
background-color: #2196f3; }
.new-control.new-radio.radio-classic-warning > input:checked ~ span.new-control-indicator:after {
background-color: #e2a03f; }
.new-control.new-radio.radio-classic-danger > input:checked ~ span.new-control-indicator:after {
background-color: #e7515a; }
.new-control.new-radio.radio-classic-secondary > input:checked ~ span.new-control-indicator:after {
background-color: #5c1ac3; }
.new-control.new-radio.radio-classic-dark > input:checked ~ span.new-control-indicator:after {
background-color: #3b3f5c; }
.new-control.new-radio.new-radio-text > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-default > input:checked ~ span.new-radio-content {
color: #888ea8; }
.new-control.new-radio.new-radio-text.radio-primary > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-primary > input:checked ~ span.new-radio-content {
color: #1b55e2; }
.new-control.new-radio.new-radio-text.radio-success > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-success > input:checked ~ span.new-radio-content {
color: #8dbf42; }
.new-control.new-radio.new-radio-text.radio-info > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-info > input:checked ~ span.new-radio-content {
color: #2196f3; }
.new-control.new-radio.new-radio-text.radio-warning > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-warning > input:checked ~ span.new-radio-content {
color: #e2a03f; }
.new-control.new-radio.new-radio-text.radio-danger > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-danger > input:checked ~ span.new-radio-content {
color: #e7515a; }
.new-control.new-radio.new-radio-text.radio-secondary > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-secondary > input:checked ~ span.new-radio-content {
color: #5c1ac3; }
.new-control.new-radio.new-radio-text.radio-dark > input:checked ~ span.new-radio-content, .new-control.new-radio.new-radio-text.radio-classic-dark > input:checked ~ span.new-radio-content {
color: #3b3f5c; }
/* Color */
/* Outline checkbox */
/*----------Theme Radio---------*/
/*square radio*/
/* Color */
/* Outline Radio */
/* line through colors */

View File

@ -0,0 +1,23 @@
div#load_screen{
background: rgb(236, 239, 255);
opacity: 1;
position: fixed;
z-index:999999;
top: 0px;
bottom: 0;
left: 0;
right: 0;
width: 100%;
}
div#load_screen .loader {
display: flex;
justify-content: center;
height: 100vh;
}
div#load_screen .loader-content {
right: 0;
align-self: center;
}
.spinner-grow {
color: #304aca;
}

2070
Content/assets/css/main.css Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,219 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
html {
height: 100%; }
body {
height: 100%;
overflow: auto;
margin: 0;
padding: 0;
background: #fff; }
.coming-soon-container {
display: flex; }
.coming-soon-cont {
width: 50%;
display: flex;
flex-direction: column;
min-height: 100%;
height: 100vh; }
.coming-soon-cont .coming-soon-wrap {
max-width: 480px;
margin: 0 auto;
min-width: 311px;
min-height: 100%; }
.coming-soon-cont .coming-soon-container {
align-items: center;
display: flex;
flex-grow: 1;
padding: 30px 30px;
width: 100%;
min-height: 100%; }
.coming-soon-cont .coming-soon-container .coming-soon-content {
display: block;
width: 100%; }
.coming-soon-cont .coming-soon-content > h4 {
font-size: 40px;
margin-top: 30px;
font-weight: 700;
color: #1b55e2;
margin-bottom: 0;
text-shadow: 0px 5px 4px rgba(31, 45, 61, 0.101961); }
.coming-soon-cont .coming-soon-content > p:not(.terms-conditions) {
font-size: 16px;
color: #888ea8;
font-weight: 700;
margin-bottom: 50px; }
.coming-soon-cont #timer {
display: flex; }
.coming-soon-cont #timer .days, .coming-soon-cont #timer .hours, .coming-soon-cont #timer .min {
padding: 28px 0;
background: #1b55e2;
color: #fff;
border-radius: 4px;
font-weight: 600;
font-size: 15px;
letter-spacing: 2px;
text-align: center;
height: 95px;
width: 95px;
margin-right: 15px; }
.coming-soon-cont #timer .sec {
padding: 28px 0;
background: #1b55e2;
color: #fff;
border-radius: 4px;
font-weight: 600;
font-size: 15px;
letter-spacing: 2px;
text-align: center;
height: 95px;
width: 95px;
margin-right: 15px;
margin-right: 0; }
.coming-soon-cont #timer .days .count, .coming-soon-cont #timer .days .text {
display: block; }
.coming-soon-cont #timer .hours .count, .coming-soon-cont #timer .hours .text {
display: block; }
.coming-soon-cont #timer .min .count, .coming-soon-cont #timer .min .text {
display: block; }
.coming-soon-cont #timer .sec .count, .coming-soon-cont #timer .sec .text {
display: block; }
.coming-soon-cont .coming-soon-content > h3 {
text-align: center;
font-size: 21px;
font-weight: 700;
margin-top: 75px;
margin-bottom: 40px; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper {
position: relative;
display: flex;
width: 100%; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper svg {
position: absolute;
top: 11px;
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216);
left: 8px; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper input {
padding: 10px 97px 10px 45px; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper input::-webkit-input-placeholder, .coming-soon-cont .coming-soon-wrap form .field-wrapper input::-ms-input-placeholder, .coming-soon-cont .coming-soon-wrap form .field-wrapper input::-moz-placeholder {
color: #d3d3d3;
font-size: 14px; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper input:focus {
border-bottom: 1px solid #1b55e2; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper button.btn {
align-self: center;
position: absolute;
right: 0;
padding: 10px 17px;
border-bottom-left-radius: 20px; }
.coming-soon-cont .coming-soon-wrap form .field-wrapper button.btn:hover {
transform: none; }
.coming-soon-cont .social {
text-align: center;
color: #1b55e2;
margin: 45px 0 0 0; }
.coming-soon-cont .social li {
margin: 0; }
.coming-soon-cont .social li:not(:last-child) {
margin-right: 10px;
padding-right: 10px;
border-right: 2px solid #d3d3d3; }
.coming-soon-cont .social svg {
color: #1b55e2;
width: 20px;
height: 20px; }
.coming-soon-cont .terms-conditions {
max-width: 480px;
margin: 0 auto;
color: #3b3f5c;
font-weight: 600;
margin-top: 70px; }
.coming-soon-cont .terms-conditions a {
color: #1b55e2;
font-weight: 700; }
.coming-soon-image {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
position: fixed;
right: 0;
min-height: auto;
height: 100vh;
width: 50%; }
.coming-soon-image .img-overlay-content {
height: 100%;
background: rgba(0, 0, 0, 0.55); }
.coming-soon-image .img-overlay-content p {
color: #fff;
position: absolute; }
.coming-soon-image .l-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #060818;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-position-x: center;
background-position-y: center; }
.coming-soon-image .l-image .img-content {
display: flex;
justify-content: center;
height: 100%; }
.coming-soon-image .l-image img {
width: 577px;
align-self: center; }
@media (max-width: 991px) {
.coming-soon-cont {
width: 100%; }
.coming-soon-cont .coming-soon-wrap {
min-width: auto; }
.coming-soon-image {
display: none; } }
@media (max-width: 575px) {
.coming-soon-cont #timer {
display: flex;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
justify-content: center; }
.coming-soon-cont #timer .hours:not(:last-child) {
margin-right: 0; }
.coming-soon-cont #timer .days, .coming-soon-cont #timer .hours, .coming-soon-cont #timer .min, .coming-soon-cont #timer .sec {
-ms-flex: 0 0 40%;
flex: 0 0 40%;
max-width: 40%;
margin-bottom: 15px;
margin-bottom: 15px;
padding: 14px 0;
height: 71px; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.coming-soon-cont .coming-soon-wrap {
width: 100%; }
.coming-soon-cont .coming-soon-container {
height: 100%; } }

View File

@ -0,0 +1,131 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/* Map */
#basic_map1 {
width: 100%;
height: 757px; }
/* Contact Section Header */
.cu-contact-section {
position: relative;
padding: 0;
background-color: #c2d5ff; }
.cu-contact-section .cu-section-header {
position: absolute;
background: #3b3f5c;
z-index: 1;
width: 100%;
padding: 15px 34px;
color: #fff;
background-color: rgba(43, 80, 237, 0.109804); }
.cu-contact-section .cu-section-header h4 {
color: #fff;
font-size: 34px;
font-weight: 600;
letter-spacing: 3px; }
.cu-contact-section .cu-section-header p {
color: #fff;
font-size: 16px;
letter-spacing: 1px; }
.cu-contact-section .contact-form {
position: absolute;
top: 0;
right: 58px;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
height: fit-content;
height: -moz-max-content;
height: -webkit-fit-content;
z-index: 2; }
.cu-contact-section .contact-form form {
background: #fff;
padding: 25px 35px;
border-radius: 10px;
margin-top: 24px;
margin-bottom: 24px;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06); }
.cu-contact-section .contact-form form .input-fields {
position: relative; }
.cu-contact-section .contact-form form .input-fields svg {
position: absolute;
top: 11px;
color: #1b55e2;
width: 20px;
left: 25px; }
.cu-contact-section .contact-form form .input-fields svg.feather-mail {
left: 12px;
top: 7px; }
.cu-contact-section .contact-form form h4 {
font-size: 22px;
font-weight: 600;
margin-bottom: 25px;
color: #3b3f5c; }
.cu-contact-section .contact-form form input {
padding: 8px 5px 8px 40px;
background-color: transparent;
font-weight: 600; }
.cu-contact-section .contact-form form input::-webkit-input-placeholder, .cu-contact-section .contact-form form input::-ms-input-placeholder, .cu-contact-section .contact-form form input::-moz-placeholder {
color: #d3d3d3;
font-size: 14px; }
.cu-contact-section .contact-form form input:focus {
background-color: #ffffff;
border-color: #3b3f5c; }
.cu-contact-section .n-chk {
display: inline-block; }
.cu-contact-section .form-group textarea {
padding: 8px 5px 8px 43px;
background-color: transparent;
margin-top: 15px;
resize: none; }
.cu-contact-section .form-group textarea::-webkit-input-placeholder, .cu-contact-section .form-group textarea::-ms-input-placeholder, .cu-contact-section .form-group textarea::-moz-placeholder {
color: #d3d3d3;
font-size: 14px; }
.cu-contact-section .form-group textarea:focus {
background-color: #ffffff;
border-color: #3b3f5c; }
.cu-contact-section .form-group textarea:-ms-input-placeholder {
color: #7b8489; }
.cu-contact-section form button {
border: none;
padding: 15px 25px;
display: block;
width: 100%; }
/* Contact Content */
@media (max-width: 991px) {
.cu-contact-section .cu-section-header {
display: none; }
.cu-contact-section .contact-form {
right: 0;
left: 0;
margin-right: auto;
margin-left: auto;
margin-top: 0;
margin-bottom: 0; }
.cu-contact-section .contact-form form {
max-width: 530px;
margin: 0 auto;
width: 100%;
border-radius: 0; } }
@media (max-width: 991px) {
body {
background: #fff; }
#basic_map1 {
display: none; } }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.cu-contact-section .contact-form form {
min-width: 530px;
width: 100%; } }

View File

@ -0,0 +1,60 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.theme-logo {
width: 62px;
height: 62px;
border-radius: 5px; }
body.error404 {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 400'%3E%3Cdefs%3E%3CradialGradient id='a' cx='396' cy='281' r='514' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e6e6e6'/%3E%3Cstop offset='1' stop-color='%23c2d5ff'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='400' y1='148' x2='400' y2='333'%3E%3Cstop offset='0' stop-color='%231b55e2' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%231b55e2' stop-opacity='0.5'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='800' height='400'/%3E%3Cg fill-opacity='0.5'%3E%3Ccircle fill='url(%23b)' cx='267.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='532.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='400' cy='30' r='300'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
background-color: #ffffff; }
body.error404 > .error-content {
min-height: 80vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 30px; }
.error404 .mini-text {
font-size: 33px;
font-weight: 700;
margin-bottom: 0;
color: #1b55e2; }
.error404 .img-cartoon {
width: 170px;
height: 170px; }
.error404 .error-number {
font-size: 170px;
color: #fff;
font-weight: 600;
margin-bottom: 5px;
margin-top: 15px;
text-shadow: 0px 5px 4px rgba(31, 45, 61, 0.101961); }
.error404 .error-text {
font-size: 18px;
color: #3b3f5c;
font-weight: 600; }
.error404 a.btn {
width: 134px;
padding: 6px;
font-size: 17px;
background-image: linear-gradient(135deg, #1b55e2 0%, #5c1ac3 100%);
border: none;
letter-spacing: 2px; }
.error404 a.btn:hover, .error404 a.btn:not(:disabled):not(.disabled):active {
background-image: linear-gradient(to right, #1b55e2 0%, #5c1ac3 100%); }

View File

@ -0,0 +1,60 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.theme-logo {
width: 62px;
height: 62px;
border-radius: 5px; }
body.error500 {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 400'%3E%3Cdefs%3E%3CradialGradient id='a' cx='396' cy='281' r='514' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e6e6e6'/%3E%3Cstop offset='1' stop-color='%23c2d5ff'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='400' y1='148' x2='400' y2='333'%3E%3Cstop offset='0' stop-color='%231b55e2' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%231b55e2' stop-opacity='0.5'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='800' height='400'/%3E%3Cg fill-opacity='0.5'%3E%3Ccircle fill='url(%23b)' cx='267.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='532.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='400' cy='30' r='300'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
background-color: #ffffff; }
body.error500 > .error-content {
min-height: 80vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 30px; }
.error500 .mini-text {
font-size: 33px;
font-weight: 700;
margin-bottom: 0;
color: #1b55e2; }
.error500 .img-cartoon {
width: 170px;
height: 170px; }
.error500 .error-number {
font-size: 170px;
color: #fff;
font-weight: 600;
margin-bottom: 5px;
margin-top: 15px;
text-shadow: 0px 5px 4px rgba(31, 45, 61, 0.101961); }
.error500 .error-text {
font-size: 18px;
color: #3b3f5c;
font-weight: 600; }
.error500 a.btn {
width: 134px;
padding: 6px;
font-size: 17px;
background-image: linear-gradient(135deg, #1b55e2 0%, #5c1ac3 100%);
border: none;
letter-spacing: 2px; }
.error500 a.btn:hover, .error500 a.btn:not(:disabled):not(.disabled):active {
background-image: linear-gradient(to right, #1b55e2 0%, #5c1ac3 100%); }

View File

@ -0,0 +1,60 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.theme-logo {
width: 62px;
height: 62px;
border-radius: 5px; }
body.error503 {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 400'%3E%3Cdefs%3E%3CradialGradient id='a' cx='396' cy='281' r='514' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e6e6e6'/%3E%3Cstop offset='1' stop-color='%23c2d5ff'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='400' y1='148' x2='400' y2='333'%3E%3Cstop offset='0' stop-color='%231b55e2' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%231b55e2' stop-opacity='0.5'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='800' height='400'/%3E%3Cg fill-opacity='0.5'%3E%3Ccircle fill='url(%23b)' cx='267.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='532.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='400' cy='30' r='300'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
background-color: #ffffff; }
body.error503 > .error-content {
min-height: 80vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 30px; }
.error503 .mini-text {
font-size: 33px;
font-weight: 700;
margin-bottom: 0;
color: #1b55e2; }
.error503 .img-cartoon {
width: 170px;
height: 170px; }
.error503 .error-number {
font-size: 170px;
color: #fff;
font-weight: 600;
margin-bottom: 5px;
margin-top: 15px;
text-shadow: 0px 5px 4px rgba(31, 45, 61, 0.101961); }
.error503 .error-text {
font-size: 18px;
color: #3b3f5c;
font-weight: 600; }
.error503 a.btn {
width: 134px;
padding: 6px;
font-size: 17px;
background-image: linear-gradient(135deg, #1b55e2 0%, #5c1ac3 100%);
border: none;
letter-spacing: 2px; }
.error503 a.btn:hover, .error503 a.btn:not(:disabled):not(.disabled):active {
background-image: linear-gradient(to right, #1b55e2 0%, #5c1ac3 100%); }

View File

@ -0,0 +1,59 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.maintanence-hero-img img {
width: 62px;
height: 62px;
border-radius: 5px; }
body.maintanence {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 400'%3E%3Cdefs%3E%3CradialGradient id='a' cx='396' cy='281' r='514' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e6e6e6'/%3E%3Cstop offset='1' stop-color='%23c2d5ff'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='400' y1='148' x2='400' y2='333'%3E%3Cstop offset='0' stop-color='%231b55e2' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%231b55e2' stop-opacity='0.5'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='800' height='400'/%3E%3Cg fill-opacity='0.5'%3E%3Ccircle fill='url(%23b)' cx='267.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='532.5' cy='61' r='300'/%3E%3Ccircle fill='url(%23b)' cx='400' cy='30' r='300'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover;
background-color: #ffffff; }
body.maintanence > .maintanence-content {
min-height: 90vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 30px; }
.maintanence .error-title {
margin-top: 65px;
color: #ffffff;
font-weight: 600;
font-size: 54px;
font-weight: 600;
margin-bottom: 5px;
text-shadow: 0px 5px 4px rgba(31, 45, 61, 0.101961); }
.maintanence .error-text {
margin-top: 40px;
font-size: 24px;
font-weight: 600;
margin-bottom: 0;
color: #1b55e2; }
.maintanence a.btn {
width: 134px;
padding: 6px;
font-size: 17px;
background-image: linear-gradient(135deg, #1b55e2 0%, #5c1ac3 100%);
border: none;
letter-spacing: 2px; }
.maintanence .text {
color: #3b3f5c;
font-size: 15px;
font-size: 16px;
color: #3b3f5c;
font-weight: 600;
margin-top: 21px; }

View File

@ -0,0 +1,261 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
body {
background-color: #f1f2f3; }
/*Navbar*/
nav .navbar-brand {
font-size: 30px;
font-weight: 700;
color: #fff; }
.navbar-expand .navbar-nav .nav-link {
color: #fff;
padding: 0 17px; }
.fq-header-wrapper {
padding: 0 0;
background-color: #1b55e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%232b50ed' cx='50' cy='0' r='50'/%3E%3Cg fill='%233154ea' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%233658e8' cx='50' cy='100' r='50'/%3E%3Cg fill='%233c5be5' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23415fe2' cx='50' cy='200' r='50'/%3E%3Cg fill='%234662df' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%234b66dc' cx='50' cy='300' r='50'/%3E%3Cg fill='%235069d9' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23546cd5' cx='50' cy='400' r='50'/%3E%3Cg fill='%23596fd2' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%235e72cf' cx='50' cy='500' r='50'/%3E%3Cg fill='%236275cb' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%236678c8' cx='50' cy='600' r='50'/%3E%3Cg fill='%236b7bc4' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%236f7ec0' cx='50' cy='700' r='50'/%3E%3Cg fill='%237381bc' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%237783b8' cx='50' cy='800' r='50'/%3E%3Cg fill='%237c86b4' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%238089b0' cx='50' cy='900' r='50'/%3E%3Cg fill='%23848bac' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23888ea8' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain; }
.fq-header-wrapper h1 {
font-size: 46px;
font-weight: 700;
color: #fff;
margin-bottom: 8px; }
.fq-header-wrapper p {
color: #d3d3d3;
font-size: 14px;
margin-bottom: 27px;
line-height: 25px; }
.fq-header-wrapper button {
border-radius: 30px;
padding: 10px 25px;
letter-spacing: 2px;
font-weight: 600;
font-size: 16px;
background: transparent;
color: #fff; }
.fq-header-wrapper button:hover {
background-color: transparent;
color: #fff;
box-shadow: none; }
.fq-header-wrapper .banner-img img {
width: 582px;
height: 582px; }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.fq-header-wrapper {
background-image: none; } }
/*
Common Question
*/
.faq .faq-layouting .fq-comman-question-wrapper {
padding: 52px 52px;
-webkit-box-shadow: 0 10px 30px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0 10px 30px 0 rgba(31, 45, 61, 0.1);
border-radius: 15px;
background: #fff;
margin-top: -57px;
margin-bottom: 70px; }
.faq .faq-layouting .fq-comman-question-wrapper h3 {
font-size: 29px;
font-weight: 700;
margin-bottom: 40px; }
.faq .faq-layouting .fq-comman-question-wrapper ul {
padding: 0; }
.faq .faq-layouting .fq-comman-question-wrapper ul li {
font-size: 15px;
font-weight: 600;
margin-bottom: 16px;
color: #3b3f5c; }
.faq .faq-layouting .fq-comman-question-wrapper ul li:hover {
cursor: pointer;
color: #1b55e2; }
.faq .faq-layouting .fq-comman-question-wrapper ul li .icon-svg {
display: inline-block;
margin-right: 9px; }
.faq .faq-layouting .fq-comman-question-wrapper ul li svg {
color: #888ea8;
width: 19px;
height: 19px;
vertical-align: bottom; }
.faq .faq-layouting .fq-comman-question-wrapper ul li:hover svg {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section {
margin-bottom: 70px; }
.faq .faq-layouting .fq-tab-section h2 {
font-size: 29px;
font-weight: 700;
margin-bottom: 40px; }
.faq .faq-layouting .fq-tab-section .accordion .card {
border: none;
margin-bottom: 26px;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
border-radius: 12px;
cursor: pointer; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header {
padding: 0;
border: none;
background: none; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header > div {
padding: 13px 21px;
font-weight: 600;
font-size: 16px;
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .faq-q-title {
overflow: hidden;
white-space: nowrap;
font-size: 13px;
color: #3b3f5c;
font-weight: 700; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div svg.feather-code {
width: 17px;
vertical-align: middle;
margin-right: 11px;
color: #888ea8; }
.faq .faq-layouting .fq-tab-section .accordion .card:hover .card-header div svg.feather-code {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] svg.feather-code {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .like-faq {
display: inline-block;
float: right; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div svg.feather-thumbs-up {
cursor: pointer;
vertical-align: bottom;
margin-right: 10px;
width: 18px;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08); }
.faq .faq-layouting .fq-tab-section .accordion .card:hover .card-header div svg.feather-thumbs-up {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] svg.feather-thumbs-up {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div span.faq-like-count {
font-size: 13px;
font-weight: 700;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08); }
.faq .faq-layouting .fq-tab-section .accordion .card:hover .card-header div span.faq-like-count, .faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] span.faq-like-count {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-body p {
font-size: 14px;
font-weight: 600;
line-height: 23px; }
.faq .faq-layouting .fq-article-section {
margin-bottom: 90px; }
.faq .faq-layouting .fq-article-section h2 {
font-size: 29px;
font-weight: 700;
margin-bottom: 40px; }
.faq .faq-layouting .fq-article-section .card {
border: none;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
border-radius: 12px; }
.faq .faq-layouting .fq-article-section .card img {
border-top-left-radius: 12px;
border-top-right-radius: 12px; }
.faq .faq-layouting .fq-article-section .card .card-body .fq-rating {
margin-bottom: 13px; }
.faq .faq-layouting .fq-article-section .card .card-body .fq-rating svg {
width: 17px;
color: #e2a03f; }
.faq .faq-layouting .fq-article-section .card .card-body .fq-rating svg.checked {
fill: rgba(226, 160, 63, 0.541176); }
.faq .faq-layouting .fq-article-section .card .card-body h5.card-title {
font-weight: 700;
font-size: 20px;
margin-bottom: 21px; }
.faq .faq-layouting .fq-article-section .card .card-body p.card-text {
letter-spacing: 1px;
color: #888ea8; }
.faq .faq-layouting .fq-article-section .card .card-body p.meta-text {
font-size: 13px;
font-weight: 600;
color: #1b55e2; }
.faq .faq-layouting .fq-article-section .card .card-body p.meta-text svg {
width: 18px;
vertical-align: bottom; }
/*
Tab Section
*/
/*
Article Section
*/
/*
Mini Footer Wrapper
*/
#miniFooterWrapper {
color: #fff;
font-size: 14px;
border-top: solid 1px #ffffff;
padding: 14px;
-webkit-box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1); }
#miniFooterWrapper .arrow {
background-color: #1b55e2;
border-radius: 50%;
position: absolute;
z-index: 2;
top: -33px;
width: 40px;
height: 40px;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
left: 0;
right: 0;
margin: 0 auto;
display: flex;
justify-content: center;
cursor: pointer; }
#miniFooterWrapper .arrow p {
align-self: center;
margin-bottom: 0;
color: #fff;
font-weight: 600;
font-size: 15px;
letter-spacing: 1px; }
#miniFooterWrapper .copyright a {
color: #1b55e2;
font-weight: 700;
text-decoration: none; }
/*
Media Query
*/
@media (max-width: 1199px) {
.fq-header-wrapper .banner-img img {
width: 340px;
height: 363px;
margin: 0 auto; } }
@media (max-width: 767px) {
.fq-header-wrapper {
min-height: 640px; }
.faq .faq-layouting .fq-comman-question-wrapper {
margin-top: 32px; } }
@media (max-width: 575px) {
.fq-header-wrapper .banner-img img {
width: 283px;
height: 363px; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div svg.feather-code {
display: none; } }

View File

@ -0,0 +1,95 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
/*
Tab Section
*/
.faq .faq-layouting .fq-tab-section {
padding: 35px 50px;
background: #fff;
border-radius: 6px;
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06); }
.faq .faq-layouting .fq-tab-section h2 {
font-size: 25px;
font-weight: 700;
margin-bottom: 45px;
letter-spacing: 0px;
text-align: center; }
.faq .faq-layouting .fq-tab-section h2 span {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card {
border: 2px solid #e0e6ed;
border-radius: 6px;
margin-bottom: 4px; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header {
padding: 0;
border: none;
background: none; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header > div {
padding: 19px 30px;
font-weight: 600;
font-size: 16px;
color: #1b55e2;
cursor: pointer; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header > div[aria-expanded="true"] {
border-bottom: 2px solid #e0e6ed; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .faq-q-title {
overflow: hidden;
font-size: 14px;
color: #888ea8;
font-weight: 600;
letter-spacing: 1px; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] .faq-q-title {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .icons {
display: inline-block;
float: right; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .icons svg {
color: #888ea8; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] .icons svg {
color: #1b55e2; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div svg.feather-thumbs-up {
cursor: pointer;
vertical-align: bottom;
margin-right: 10px;
width: 18px;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08); }
.faq .faq-layouting .fq-tab-section .accordion .card:hover .card-header div svg.feather-thumbs-up {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] svg.feather-thumbs-up {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div span.faq-like-count {
font-size: 13px;
font-weight: 700;
color: #888ea8;
fill: rgba(0, 23, 55, 0.08); }
.faq .faq-layouting .fq-tab-section .accordion .card:hover .card-header div span.faq-like-count, .faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] span.faq-like-count {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.faq .faq-layouting .fq-tab-section .accordion .card .card-body {
padding: 19px 30px; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-body p {
font-size: 13px;
line-height: 23px;
letter-spacing: 1px; }
/*
Media Query
*/
@media (max-width: 575px) {
.faq .faq-layouting .fq-tab-section {
padding: 35px 25px; }
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div svg.feather-code {
display: none; } }

View File

@ -0,0 +1,307 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
body {
font-family: 'Nunito', sans-serif;
background-color: #f1f2f3; }
.helpdesk:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: -1;
pointer-events: none;
height: 280px;
background-color: #1b55e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%232b50ed' cx='50' cy='0' r='50'/%3E%3Cg fill='%233154ea' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%233658e8' cx='50' cy='100' r='50'/%3E%3Cg fill='%233c5be5' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23415fe2' cx='50' cy='200' r='50'/%3E%3Cg fill='%234662df' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%234b66dc' cx='50' cy='300' r='50'/%3E%3Cg fill='%235069d9' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23546cd5' cx='50' cy='400' r='50'/%3E%3Cg fill='%23596fd2' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%235e72cf' cx='50' cy='500' r='50'/%3E%3Cg fill='%236275cb' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%236678c8' cx='50' cy='600' r='50'/%3E%3Cg fill='%236b7bc4' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%236f7ec0' cx='50' cy='700' r='50'/%3E%3Cg fill='%237381bc' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%237783b8' cx='50' cy='800' r='50'/%3E%3Cg fill='%237c86b4' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%238089b0' cx='50' cy='900' r='50'/%3E%3Cg fill='%23848bac' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23888ea8' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain; }
.helpdesk .navbar .navbar-brand {
color: #fff;
font-weight: 800;
letter-spacing: 2px; }
.helpdesk .navbar .nav-link {
color: #fff !important; }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.helpdesk:before {
background-image: none; } }
/*
Helpdesk Header Wrapper
*/
.hd-header-wrapper {
padding: 67px 0;
border-radius: 4px; }
.hd-header-wrapper h4 {
color: #fff;
font-size: 46px;
padding: 0 8px; }
.hd-header-wrapper p {
color: #fff;
font-size: 17px;
font-weight: 600;
letter-spacing: 1px;
margin-bottom: 35px; }
.hd-header-wrapper .input-group {
-webkit-box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2); }
.hd-header-wrapper span.input-group-text {
background-color: #fff;
border-color: #fff;
padding: 11px 8px 11px 20px;
border-radius: 4px;
font-size: 22px;
font-weight: normal !important; }
.hd-header-wrapper span.input-group-text svg {
font-weight: 600;
color: #1b55e2; }
.hd-header-wrapper .form-control:focus {
box-shadow: none;
border-color: #1b55e2;
color: #3b3f5c;
background: #f1f2f3; }
.hd-header-wrapper input {
border: none;
border-radius: 4px;
padding: 20px 16px;
color: #0e1726;
height: 100%; }
.input-group .input-group-prepend .input-group-text {
border: 1px solid #ffffff;
background-color: #ffffff; }
/*
Tab Section
*/
/* Tab Content */
.hd-tab-section .accordion .card {
border: none;
margin-bottom: 26px;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
border-radius: 12px !important;
cursor: pointer; }
.hd-tab-section .accordion .card .card-header {
background-color: #fff;
color: #3b3f5c;
border-color: transparent;
padding: 0;
border-radius: 6px; }
.hd-tab-section .accordion .card .card-header div > div {
padding: 13px 21px;
cursor: pointer;
background: transparent;
border: none;
overflow: hidden;
white-space: nowrap;
font-size: 13px;
color: #3b3f5c;
font-weight: 700; }
.hd-tab-section .accordion .card .card-header div > div svg {
width: 17px;
vertical-align: middle;
margin-right: 11px;
color: #888ea8; }
.hd-tab-section .accordion .card .card-header div > div[aria-expanded="true"] svg {
color: #1b55e2; }
.hd-tab-section .accordion .card:hover .card-header div > div svg {
color: #1b55e2; }
.hd-tab-section .accordion .card:not(:last-child) .card-header div > div {
border-bottom: none; }
.hd-tab-section .accordion .card .card-body {
padding: 20px 30px; }
.hd-tab-section .accordion .card .card-body p {
line-height: 2.2;
font-size: 14px;
letter-spacing: 1px;
color: #0e1726; }
/* Contact Content */
.hd-contact-section {
margin-bottom: 50px; }
.hd-contact-section .hd-slide-header {
text-align: center;
font-size: 24px;
font-weight: 600;
margin-bottom: 50px;
color: #3b3f5c; }
.carousel-item.community-help {
padding: 13px; }
.carousel-item-content {
max-width: 607px;
max-width: 697px;
margin: 0 auto;
padding: 43px 0;
height: 331px; }
/* Community help */
.hd-contact-section .community-help .media {
padding: 13px 25px;
border: 1px solid #bfc9d4;
border-radius: 12px;
background: #fff; }
.hd-contact-section .community-help .media svg {
width: 54px;
height: 55px;
margin-right: 11px;
align-self: center;
color: #1b55e2;
stroke-width: 1.5px; }
.hd-contact-section .community-help .media h5 {
color: #1b55e2;
font-weight: 800;
font-size: 17px;
margin-bottom: 5px; }
.hd-contact-section .community-help .media p {
font-size: 14px;
font-weight: 600;
color: #3b3f5c; }
.hd-contact-section .news-updates .media {
padding: 13px 25px;
border: 1px solid #bfc9d4;
border-radius: 12px;
background: #fff; }
.hd-contact-section .news-updates .media svg {
width: 54px;
height: 55px;
margin-right: 11px;
color: #1b55e2;
stroke-width: 1.5px; }
.hd-contact-section .news-updates .media h5 {
color: #1b55e2;
font-weight: 800;
margin-bottom: 0; }
.hd-contact-section .news-updates .media p {
font-size: 14px;
font-weight: 600; }
/* News updates */
/* Carousel indicators */
.carousel-indicators {
bottom: -34px;
left: 0;
right: 0;
height: 22px; }
.carousel-indicators li {
width: 6px;
height: 6px;
border-radius: 50%;
opacity: 1;
background-color: #888ea8; }
.carousel-indicators li.active {
background-color: #1b55e2; }
.carousel-control-next, .carousel-control-prev {
opacity: 1;
background: #f1f2f3; }
.carousel-control-prev-icon {
background-image: none;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px 0px 19px 3px rgba(31, 45, 61, 0.1);
padding: 9px;
height: 33px;
width: 33px;
position: relative;
border-radius: 50px; }
.carousel-control-prev-icon svg {
color: #1b55e2;
position: absolute;
top: 4px;
left: -1px;
right: 0;
margin-left: auto;
margin-right: auto;
width: 23px; }
.carousel-control-prev-icon:before {
display: none; }
.carousel-control-next-icon {
background-image: none;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px 0px 19px 3px rgba(31, 45, 61, 0.1);
padding: 9px;
height: 33px;
width: 33px;
position: relative;
border-radius: 50px; }
.carousel-control-next-icon svg {
color: #1b55e2;
position: absolute;
top: 4px;
left: 0;
right: -2px;
margin-left: auto;
margin-right: auto;
width: 23px; }
.carousel-control-next-icon:before {
display: none; }
/*
Mini Footer Wrapper
*/
#miniFooterWrapper {
color: #fff;
font-size: 14px;
border-top: solid 1px #ffffff;
padding: 14px;
-webkit-box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1); }
#miniFooterWrapper .arrow {
background-color: #1b55e2;
border-radius: 50%;
position: absolute;
z-index: 2;
top: -33px;
width: 40px;
height: 40px;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
left: 0;
right: 0;
margin: 0 auto;
display: flex;
justify-content: center;
cursor: pointer; }
#miniFooterWrapper .arrow p {
align-self: center;
margin-bottom: 0;
color: #fff;
font-weight: 600;
font-size: 15px;
letter-spacing: 1px; }
#miniFooterWrapper .copyright a {
color: #1b55e2;
font-weight: 700;
text-decoration: none; }
@media (max-width: 1199px) {
.carousel-control-next, .carousel-control-prev {
background: transparent; } }
@media (max-width: 991px) {
.carousel-control-next, .carousel-control-prev {
display: none; } }
@media (max-width: 767px) {
.hd-contact-section .community-help .media {
margin-bottom: 3px; } }
@media (max-width: 575px) {
.carousel-item-content {
height: auto; } }

View File

@ -0,0 +1,137 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
body {
background-color: #f1f2f3; }
.h5, h5 {
font-size: 1.25rem; }
.h4, h4 {
font-size: 1.5rem; }
.h6, h6 {
font-size: 1rem; }
.navbar-brand-privacy img {
width: 62px;
height: 62px;
border-radius: 5px; }
/*
======================
Header Wrapper
======================
*/
#headerWrapper {
padding: 30px 50px; }
#headerWrapper:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: -1;
pointer-events: none;
height: 280px;
background-color: #1b55e2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 1000'%3E%3Cg %3E%3Ccircle fill='%232b50ed' cx='50' cy='0' r='50'/%3E%3Cg fill='%233154ea' %3E%3Ccircle cx='0' cy='50' r='50'/%3E%3Ccircle cx='100' cy='50' r='50'/%3E%3C/g%3E%3Ccircle fill='%233658e8' cx='50' cy='100' r='50'/%3E%3Cg fill='%233c5be5' %3E%3Ccircle cx='0' cy='150' r='50'/%3E%3Ccircle cx='100' cy='150' r='50'/%3E%3C/g%3E%3Ccircle fill='%23415fe2' cx='50' cy='200' r='50'/%3E%3Cg fill='%234662df' %3E%3Ccircle cx='0' cy='250' r='50'/%3E%3Ccircle cx='100' cy='250' r='50'/%3E%3C/g%3E%3Ccircle fill='%234b66dc' cx='50' cy='300' r='50'/%3E%3Cg fill='%235069d9' %3E%3Ccircle cx='0' cy='350' r='50'/%3E%3Ccircle cx='100' cy='350' r='50'/%3E%3C/g%3E%3Ccircle fill='%23546cd5' cx='50' cy='400' r='50'/%3E%3Cg fill='%23596fd2' %3E%3Ccircle cx='0' cy='450' r='50'/%3E%3Ccircle cx='100' cy='450' r='50'/%3E%3C/g%3E%3Ccircle fill='%235e72cf' cx='50' cy='500' r='50'/%3E%3Cg fill='%236275cb' %3E%3Ccircle cx='0' cy='550' r='50'/%3E%3Ccircle cx='100' cy='550' r='50'/%3E%3C/g%3E%3Ccircle fill='%236678c8' cx='50' cy='600' r='50'/%3E%3Cg fill='%236b7bc4' %3E%3Ccircle cx='0' cy='650' r='50'/%3E%3Ccircle cx='100' cy='650' r='50'/%3E%3C/g%3E%3Ccircle fill='%236f7ec0' cx='50' cy='700' r='50'/%3E%3Cg fill='%237381bc' %3E%3Ccircle cx='0' cy='750' r='50'/%3E%3Ccircle cx='100' cy='750' r='50'/%3E%3C/g%3E%3Ccircle fill='%237783b8' cx='50' cy='800' r='50'/%3E%3Cg fill='%237c86b4' %3E%3Ccircle cx='0' cy='850' r='50'/%3E%3Ccircle cx='100' cy='850' r='50'/%3E%3C/g%3E%3Ccircle fill='%238089b0' cx='50' cy='900' r='50'/%3E%3Cg fill='%23848bac' %3E%3Ccircle cx='0' cy='950' r='50'/%3E%3Ccircle cx='100' cy='950' r='50'/%3E%3C/g%3E%3Ccircle fill='%23888ea8' cx='50' cy='1000' r='50'/%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: contain; }
#headerWrapper .main-heading {
color: #fff;
margin: 0; }
#headerWrapper .main-heading i {
font-size: 50px;
vertical-align: sub; }
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
#headerWrapper:before {
background-image: none; } }
/*
======================
Privacy Wrapper
======================
*/
#privacyWrapper {
padding: 80px 0; }
#privacyWrapper .privacy-container {
max-width: 815px;
margin: 0 auto; }
#privacyWrapper .privacyContent {
padding: 30px 30px;
background: #fff;
margin-top: -60px;
border-radius: 5px;
-webkit-box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.1);
box-shadow: 2px 5px 17px 0 #1f2d3d1a; }
#privacyWrapper .privacyContent .privacy-head {
margin-bottom: 40px;
padding-bottom: 40px;
border-bottom: 1px solid #e0e6ed; }
#privacyWrapper .privacyContent .privacyHeader h1 {
font-weight: 600; }
#privacyWrapper .privacyContent .privacyHeader p {
margin-bottom: 0;
font-size: 16px; }
#privacyWrapper .privacyContent .get-privacy-terms svg {
margin-right: 12px; }
#privacyWrapper .privacy-content-container section:not(:last-child) {
margin-bottom: 45px; }
#privacyWrapper .privacy-content-container h5 {
margin-bottom: 24px; }
#privacyWrapper h5 {
margin: 0;
font-weight: 600;
font-size: 22px;
letter-spacing: 1px; }
#privacyWrapper h5.policy-info-ques {
color: #666666;
font-weight: 600; }
/*
==========================
Mini Footer Wrapper
==========================
*/
#miniFooterWrapper {
color: #fff;
font-size: 14px;
border-top: solid 1px #ffffff;
padding: 14px;
-webkit-box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1);
box-shadow: 0px -1px 20px 0 rgba(31, 45, 61, 0.1); }
#miniFooterWrapper .arrow {
background-color: #1b55e2;
border-radius: 50%;
position: absolute;
z-index: 2;
top: -33px;
width: 40px;
height: 40px;
box-shadow: 0px 0px 15px 1px rgba(113, 106, 202, 0.2);
left: 0;
right: 0;
margin: 0 auto;
display: flex;
justify-content: center;
cursor: pointer; }
#miniFooterWrapper .arrow p {
align-self: center;
margin-bottom: 0;
color: #fff;
font-weight: 600;
font-size: 15px;
letter-spacing: 1px; }
#miniFooterWrapper .copyright a {
color: #1b55e2;
font-weight: 700;
text-decoration: none; }

View File

@ -0,0 +1,12 @@
@import url('main.css');
@import url('../../plugins/perfect-scrollbar/perfect-scrollbar.css');
@import url('structure.css');
/*
Importing highlight.js CSS code
Just for demo purpose only
@Note:- monokai-sublime.css stylesheet is for highliting the code;
*/
@import '../../plugins/highlight/styles/monokai-sublime.css';

View File

@ -0,0 +1,72 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.sidenav {
position: fixed;
right: -30px;
top: 125px;
width: 236px;
height: auto;
border-left: 1px solid #e0e6ed; }
.sidenav .sidenav-header:after {
display: none; }
.sidenav .sidenav-header p {
font-weight: 600;
font-size: 18px;
color: #fff;
margin-bottom: 20px;
background: #1b55e2;
text-align: center;
border-radius: 5px;
padding: 4px;
letter-spacing: 1px;
background-image: linear-gradient(to right, #1b55e2 0%, #5c1ac3 100%); }
.sidenav .sidenav-content {
background-color: transparent;
display: block;
border: none; }
.sidenav .sidenav-content a {
display: block;
padding: 3px 0px;
color: #3b3f5c;
font-size: 12px;
padding: 3px 25px; }
.sidenav .sidenav-content a.active {
color: #5c1ac3;
font-weight: 700;
border-left: 1px solid #5c1ac3; }
.sidenav .sidenav-content a:hover {
color: #1b55e2;
font-weight: 700;
border-left: 1px solid #5c1ac3; }
#content > .container {
display: flex;
max-width: 58.333333% !important;
margin-left: 2px;
padding: 0 16px !important; }
#content > .container > .container {
padding: 0;
margin: 0; }
@media (max-width: 575px) {
.sidenav .sidenav-content a {
padding: 4px 7px;
margin-right: 0;
margin-bottom: 10px; } }
@media (max-width: 1199px) {
.sidenav {
display: none; }
#content > .container {
max-width: 100% !important;
margin-left: auto; }
#content > .container > .container {
max-width: 100%; } }

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,71 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.table-controls {
padding: 0;
margin: 0;
list-style: none; }
.table-controls > li {
display: inline-block;
margin: 0 2px;
line-height: 1; }
.table-controls > li > a {
display: inline-block; }
.table-controls > li > a i {
margin: 0;
color: #555;
font-size: 16px;
display: block; }
.table-controls > li > a i:hover {
text-decoration: none; }
.table .progress {
margin-bottom: 0; }
/*Table Colors*/
.contextual-table.table > thead > tr > th, .contextual-table.table > tbody > tr > td {
border: none; }
.table-default > td, .table-default > th {
background-color: #f1f2f3;
color: #3b3f5c; }
.table-primary > td, .table-primary > th {
background-color: #c7d8fd;
color: #2196f3; }
.table-secondary > td, .table-secondary > th {
background-color: #e0d4f9;
color: #5c1ac3; }
.table-success > td, .table-success > th {
background-color: #cbfdf3;
color: #8dbf42; }
.table-danger > td, .table-danger > th {
background-color: #ffe1e2;
color: #e7515a; }
.table-warning > td, .table-warning > th {
background-color: #fdefd5;
color: #e2a03f; }
.table-info > td, .table-info > th {
background-color: #bae7ff;
color: #2196f3; }
.table-light > td, .table-light > th {
background-color: #ffffff;
color: #888ea8; }
.table-dark > td, .table-dark > th {
background-color: #acb0c3;
color: #515365;
border-color: #fff !important; }

View File

@ -0,0 +1,308 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.section {
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06); }
.layout-spacing {
padding-bottom: 25px; }
.form-control {
padding: 8px 8px; }
.blockui-growl-message {
display: none;
text-align: left;
padding: 15px;
background-color: #8dbf42;
color: #fff;
border-radius: 3px; }
.blockui-growl-message i {
font-size: 20px; }
.general-info .info h6, .about .info h5, .work-platforms .info h5, .contact .info h5, .social .info h5, .skill .info h5, .edu-experience .info h5, .work-experience .info h5 {
color: #3b3f5c;
margin: 4px 8px 40px 8px;
font-weight: 700;
font-size: 16px;
text-transform: uppercase; }
/*
General Infomation
*/
.general-info {
background-color: #fff;
border-radius: 6px; }
.general-info .info, .general-info .save-info {
padding: 20px; }
.general-info .info .form {
width: 92%; }
.general-info .info .upload {
border-right: 1px solid #ebedf2; }
.general-info .info .upload p {
font-size: 14px;
font-weight: 600;
color: #1b55e2; }
.general-info .info .upload p i {
font-size: 22px;
color: #1b55e2;
vertical-align: middle; }
.general-info .info label {
color: #888ea8;
font-size: 13px;
letter-spacing: 1px; }
.general-info .info .dropify-wrapper {
width: 120px;
height: 120px;
border: none;
border-radius: 6px; }
.general-info .info .dropify-wrapper .dropify-preview {
background-color: #fff;
padding: 0; }
.general-info .info .dropify-wrapper .dropify-clear {
font-size: 16px;
padding: 4px 8px;
color: #fff;
border: none; }
.general-info .info .dropify-wrapper .dropify-clear:hover {
background-color: transparent; }
.general-info .info .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message {
padding-top: 27px; }
.general-info .info .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message::before {
height: 20px;
position: absolute;
top: -1px;
left: 45%;
color: #fff;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
background: transparent;
width: 0;
height: 0;
font-size: 28px;
width: 24px;
content: " ";
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-upload-cloud'%3e%3cpolyline points='16 16 12 12 8 16'%3e%3c/polyline%3e%3cline x1='12' y1='12' x2='12' y2='21'%3e%3c/line%3e%3cpath d='M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3'%3e%3c/path%3e%3cpolyline points='16 16 12 12 8 16'%3e%3c/polyline%3e%3c/svg%3e");
height: 20px; }
.general-info .info .dropify-wrapper.touch-fallback {
border: 1px solid #ebedf2; }
.general-info .info .dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner {
padding: 0; }
.general-info .info .dropify-wrapper.touch-fallback .dropify-clear {
color: #515365; }
.general-info .info .dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-filename {
margin-top: 10px; }
/*
Image upload
*/
/*
About
*/
.about {
background-color: #fff;
border-radius: 6px; }
.about .info, .about .save-info {
padding: 20px; }
.about .info label {
color: #888ea8;
font-size: 13px;
letter-spacing: 1px; }
/*
Education and Experience
*/
.work-platforms {
background-color: #fff;
border-radius: 6px; }
.work-platforms .info {
padding: 20px; }
.work-platforms .platform-div:not(:last-child) {
margin-bottom: 55px;
padding-bottom: 55px;
border-bottom: 2px solid #e0e6ed; }
.work-platforms .platform-div:last-child {
margin-bottom: 40px; }
/*
Contact
*/
.contact {
background-color: #fff;
border-radius: 6px; }
.contact .info, .contact .save-info {
padding: 20px; }
.contact .info label {
color: #888ea8;
font-size: 13px;
letter-spacing: 1px; }
/*
Social
*/
.social {
background-color: #fff;
border-radius: 6px; }
.social .info, .social .save-info {
padding: 20px; }
.social .input-group-prepend .input-group-text {
border-radius: 6px;
color: #fff;
border: none; }
.input-group .input-group-prepend .input-group-text svg {
color: #1b55e2; }
.social .info input {
border-radius: 0.25rem !important; }
/*
Skills
*/
.skill {
background-color: #fff;
border-radius: 6px; }
.skill .input-form {
margin-bottom: 24px;
display: flex;
width: 50%;
margin-right: auto;
margin-left: auto; }
.skill input[type="text"] {
margin-right: 10px; }
.skill .info {
padding: 20px; }
.skill .skill-name {
font-size: 13px;
font-weight: 700;
margin-bottom: 0;
margin-top: 0; }
.skill .save-info {
padding: 20px; }
.skill .info label {
text-transform: uppercase;
color: #c2d5ff; }
.skill .custom-progress.progress-up .range-count {
margin-top: 11px; }
.skill .custom-progress.progress-down .range-count {
margin-top: 15px; }
.skill .range-count {
font-weight: 700;
color: #3b3f5c; }
.skill .range-count .range-count-number {
display: inline-block;
background: #ffffff;
padding: 3px 8px;
border-radius: 5px;
color: #1b55e2;
border: 1px solid #e0e6ed; }
.skill .custom-progress.top-right .range-count, .skill .custom-progress.bottom-right .range-count {
text-align: right; }
.skill .progress-range-counter::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
background: #1b55e2;
cursor: pointer;
height: 16px;
width: 16px;
margin-top: -4px;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease; }
.skill .progress-range-counter:active::-webkit-slider-thumb {
-webkit-transform: scale(1.2);
transform: scale(1.2); }
.skill .progress-range-counter:focus::-webkit-slider-thumb {
background: #1b55e2;
cursor: pointer;
height: 16px;
width: 16px;
margin-top: -4px;
box-shadow: none; }
.skill .progress-range-counter::-moz-range-thumb {
background: #1b55e2;
cursor: pointer;
height: 16px;
width: 16px;
margin-top: -4px; }
/*
Education and Experience
*/
.edu-experience {
background-color: #fff;
border-radius: 6px; }
.edu-experience .edu-section:not(:last-child) {
margin-bottom: 55px;
padding-bottom: 55px;
border-bottom: 2px solid #e0e6ed; }
.edu-experience .edu-section:last-child {
margin-bottom: 40px; }
.edu-experience .info, .edu-experience .save-info {
padding: 20px; }
.edu-experience .info label {
color: #888ea8;
font-size: 13px;
letter-spacing: 1px; }
/*
Work Experience
*/
.work-experience {
background-color: #fff;
border-radius: 6px; }
.work-experience .work-section:not(:last-child) {
margin-bottom: 55px;
padding-bottom: 55px;
border-bottom: 2px solid #e0e6ed; }
.work-experience .work-section:last-child {
margin-bottom: 40px; }
.work-experience .info, .work-experience .save-info {
padding: 20px; }
.work-experience .info label {
color: #888ea8;
font-size: 13px;
letter-spacing: 1px; }
/*
Footer
*/
.account-settings-footer {
position: fixed;
bottom: 0;
width: calc(100% - 295px);
background: #191e3a;
padding: 12px 20px;
-webkit-box-shadow: -2px -9px 20px rgba(126, 142, 177, 0.12);
-moz-box-shadow: -2px -9px 20px rgba(126, 142, 177, 0.12);
box-shadow: -2px -9px 20px rgba(126, 142, 177, 0.12);
border-top: 1px solid #f1f2f3;
border-radius: 6px 6px 0 0;
z-index: 5; }
.account-settings-footer .as-footer-container {
display: flex;
justify-content: space-between; }
.sidebar-closed .account-settings-footer {
width: calc(100% - 94px); }
@media (max-width: 991px) {
.account-settings-container .account-content {
width: 100%;
padding: 0; }
.account-settings-footer {
width: calc(100% - 29px); } }
@media (max-width: 767px) {
.general-info .info .upload {
border-right: none; }
.skill .input-form {
width: 100%; } }

View File

@ -0,0 +1,389 @@
/*
===============================
@Import Function
===============================
*/
/*
===============================
@Import Mixins
===============================
*/
.widget-content-area {
-webkit-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06);
box-shadow: 0 4px 6px 0 rgba(85, 85, 85, 0.0901961), 0 1px 20px 0 rgba(0, 0, 0, 0.08), 0px 1px 11px 0px rgba(0, 0, 0, 0.06); }
.layout-spacing {
padding-bottom: 25px; }
/*
===================
User Profile
===================
*/
.user-profile .widget-content-area {
border-radius: 6px; }
.user-profile .widget-content-area .edit-profile {
height: 35px;
width: 35px;
display: flex;
justify-content: center;
align-self: center;
background-color: #1b55e2;
background: linear-gradient(to right, #0081ff 0%, #0045ff 100%);
border-radius: 50%;
box-shadow: 0 10px 15px rgba(0, 69, 255, 0.2); }
.user-profile .widget-content-area .edit-profile svg {
font-size: 17px;
vertical-align: middle;
margin-right: 0;
color: #fff;
width: 19px;
align-self: center; }
.user-profile .widget-content-area h3 {
position: relative;
font-size: 21px;
font-weight: 600;
color: #3b3f5c;
margin: 6px 0px 0 0; }
.user-profile .widget-content-area h3:after {
position: absolute;
content: "";
height: 2px;
width: 55px;
background: #1b55e2;
border-radius: 50%;
bottom: 9px;
left: 15px; }
.user-profile .widget-content-area .user-info {
margin-top: 40px; }
.user-profile .widget-content-area .user-info img {
border-radius: 9px;
box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); }
.user-profile .widget-content-area .user-info p {
font-size: 20px;
font-weight: 600;
margin-top: 22px;
color: #1b55e2; }
.user-profile .widget-content-area .user-info-list ul.contacts-block {
border: none;
max-width: 217px;
margin: 36px auto; }
.user-profile .widget-content-area .user-info-list ul.contacts-block li {
margin-bottom: 13px;
font-weight: 600;
font-size: 13px; }
.user-profile .widget-content-area .user-info-list ul.contacts-block li a {
font-weight: 600;
font-size: 15px;
color: #1b55e2; }
.user-profile .widget-content-area .user-info-list ul.contacts-block svg {
width: 21px;
margin-right: 15px;
color: #888ea8;
vertical-align: middle;
fill: rgba(0, 23, 55, 0.08); }
.user-profile .widget-content-area .user-info-list ul.contacts-block li:hover svg {
color: #1b55e2;
fill: rgba(27, 85, 226, 0.239216); }
.user-profile .widget-content-area .user-info-list ul.contacts-block ul.list-inline {
margin: 27px auto; }
.user-profile .widget-content-area .user-info-list ul.contacts-block ul.list-inline div.social-icon {
border: 2px solid #e0e6ed;
border-radius: 50%;
height: 35px;
width: 35px;
display: flex;
justify-content: center;
align-self: center; }
.user-profile .widget-content-area .user-info-list ul.contacts-block ul.list-inline svg {
margin-right: 0;
color: #1b55e2;
width: 19px;
align-self: center; }
/*
==============
Skills
==============
*/
.skills .widget-content-area {
border-radius: 6px; }
.skills .widget-content-area h3 {
position: relative;
font-size: 21px;
font-weight: 600;
color: #3b3f5c;
margin: 6px 0px 40px 0; }
.skills .widget-content-area h3:after {
position: absolute;
content: "";
height: 2px;
width: 47px;
background: #1b55e2;
border-radius: 50%;
bottom: -2px;
left: 15px; }
.skills .widget-content-area p.skill-item {
margin-bottom: 5px;
font-size: 15px;
color: #515365;
font-weight: 600; }
.skills .widget-content-area .progress {
height: 20px;
box-shadow: 1px 3px 20px 3px #f1f2f3;
margin-bottom: 31px; }
.skills .widget-content-area .progress .progress-bar {
background-color: #1b55e2;
background: linear-gradient(to right, #0081ff 0%, #0045ff 100%);
border-radius: 1rem;
box-shadow: 0 2px 4px rgba(0, 69, 255, 0.15), 0 8px 16px rgba(0, 69, 255, 0.2);
font-size: 12px;
letter-spacing: 1px;
font-weight: 100; }
.skills .widget-content-area .progress .progress-title {
display: flex;
justify-content: space-between;
padding: 15px; }
.skills .widget-content-area .progress .progress-title span {
align-self: center; }
/*
==============
Bio
==============
*/
.bio .widget-content-area {
border-radius: 6px;
padding-bottom: 0; }
.bio .widget-content-area h3 {
position: relative;
font-size: 21px;
font-weight: 600;
color: #3b3f5c;
margin: 6px 0px 40px 0; }
.bio .widget-content-area h3:after {
position: absolute;
content: "";
height: 2px;
width: 30px;
background: #1b55e2;
border-radius: 50%;
bottom: -2px;
left: 15px; }
.bio .widget-content-area h5 {
font-size: 16px;
font-weight: 700;
color: #3b3f5c; }
.bio .widget-content-area p {
color: #888ea8;
font-size: 15px; }
.bio .widget-content-area .bio-skill-box {
padding-top: 30px;
padding-bottom: 30px; }
.bio .widget-content-area .b-skills {
padding: 22px 16px;
box-shadow: 2px 5px 17px 0 rgba(31, 45, 61, 0.17);
background: #fff;
border-radius: 10px;
padding: 30px 30px 24px; }
.bio .widget-content-area .b-skills svg {
width: 30px;
height: 30px;
margin-right: 21px;
color: #1b55e2; }
.bio .widget-content-area .b-skills h5 {
margin-bottom: 10px;
font-size: 16px; }
.bio .widget-content-area .b-skills p {
font-size: 13px; }
/*
================
Education
================
*/
.education .widget-content-area {
border-radius: 6px; }
.education .widget-content-area h3 {
position: relative;
font-size: 21px;
font-weight: 600;
color: #3b3f5c;
margin: 6px 0px 40px 0; }
.education .widget-content-area h3:after {
position: absolute;
content: "";
height: 2px;
width: 97px;
background: #1b55e2;
border-radius: 50%;
bottom: -2px;
left: 15px; }
.education .widget-content-area .timeline-alter .item-timeline {
display: flex; }
.education .widget-content-area .timeline-alter .item-timeline .t-dot {
position: relative;
border-color: #1b55e2;
padding: 10px; }
.education .widget-content-area .timeline-alter .item-timeline .t-dot:before {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%); }
.education .widget-content-area .timeline-alter .item-timeline:not(:last-child) .t-dot:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: auto;
top: 25px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0;
border-color: #ebedf2; }
.education .widget-content-area .timeline-alter .item-timeline .t-dot img {
width: 45px;
height: 45px;
border-radius: 50%;
z-index: 7;
position: relative; }
.education .widget-content-area .timeline-alter .item-timeline .t-meta-date {
padding: 10px; }
.education .widget-content-area .timeline-alter .item-timeline .t-meta-date p {
margin: 0;
min-width: 100px;
max-width: 100px;
font-size: 12px;
font-weight: 700;
color: #888ea8; }
.education .widget-content-area .timeline-alter .item-timeline .t-text {
padding: 10px;
align-self: center; }
.education .widget-content-area .timeline-alter .item-timeline .t-text p {
font-size: 13px;
margin: 0;
color: #515365;
font-weight: 600; }
.education .widget-content-area .timeline-alter .item-timeline .t-text p a {
color: #2196f3;
font-weight: 600; }
@media (max-width: 575px) {
.education .widget-content-area .timeline-alter .item-timeline {
display: block;
text-align: center; }
.education .widget-content-area .timeline-alter .item-timeline .t-meta-date p, .education .widget-content-area .timeline-alter .item-timeline .t-usr-txt p {
margin: 0 auto; } }
/*
=======================
Work Experience
=======================
*/
.work-experience .widget-content-area {
border-radius: 6px; }
.work-experience .widget-content-area h3 {
position: relative;
font-size: 21px;
font-weight: 600;
color: #3b3f5c;
margin: 6px 0px 40px 0; }
.work-experience .widget-content-area h3:after {
position: absolute;
content: "";
height: 2px;
width: 173px;
background: #1b55e2;
border-radius: 50%;
bottom: -2px;
left: 15px; }
.work-experience .widget-content-area .timeline-alter .item-timeline {
display: flex; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-dot {
position: relative;
border-color: #1b55e2;
padding: 10px; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-dot:before {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%); }
.work-experience .widget-content-area .timeline-alter .item-timeline:not(:last-child) .t-dot:after {
content: '';
position: absolute;
border-color: inherit;
border-width: 2px;
border-style: solid;
border-radius: 50%;
width: 10px;
height: 10px;
top: 15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: auto;
top: 25px;
bottom: -15px;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 0;
border-radius: 0;
border-color: #ebedf2; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-dot img {
width: 45px;
height: 45px;
border-radius: 50%;
z-index: 7;
position: relative; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-meta-date {
padding: 10px; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-meta-date p {
margin: 0;
min-width: 100px;
max-width: 100px;
font-size: 12px;
font-weight: 700;
color: #888ea8; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-text {
padding: 10px;
align-self: center; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-text p {
font-size: 13px;
margin: 0;
color: #515365;
font-weight: 600; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-text p a {
color: #2196f3;
font-weight: 600; }
@media (max-width: 575px) {
.work-experience .widget-content-area .timeline-alter .item-timeline {
display: block;
text-align: center; }
.work-experience .widget-content-area .timeline-alter .item-timeline .t-meta-date p, .work-experience .widget-content-area .timeline-alter .item-timeline .t-usr-txt p {
margin: 0 auto; } }

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 186 KiB

BIN
Content/assets/img/1.jfif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
Content/assets/img/CRS.PNG Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

BIN
Content/assets/img/CRS.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

BIN
Content/assets/img/arm.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 771 B

BIN
Content/assets/img/bg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 538 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
Content/assets/img/ca.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 816 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 24 24" fill="none" stroke="#1b55e2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-map-pin"><path fill="#1b55e2" d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path><circle fill="#fff" cx="12" cy="10" r="3"></circle></svg>

After

Width:  |  Height:  |  Size: 344 B

BIN
Content/assets/img/de.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 469 B

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
Content/assets/img/fr.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 638 B

Some files were not shown because too many files have changed in this diff Show More