first commit
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"dotnet.preferCSharpExtension": true
|
||||
}
|
||||
|
|
@ -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();
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -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>
|
||||
|
|
@ -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
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -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
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -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());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -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 }
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -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 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
body {
|
||||
}
|
||||
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
|
@ -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%; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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
|
||||
*/
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
/*
|
||||
===============================
|
||||
@Import Function
|
||||
===============================
|
||||
*/
|
||||
/*
|
||||
===============================
|
||||
@Import Mixins
|
||||
===============================
|
||||
*/
|
||||
.widget-content .row.padding35 .col-md-4 {
|
||||
margin-bottom: 20px; }
|
||||
|
||||
.btn {
|
||||
margin-right: 5px; }
|
||||
|
|
@ -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); }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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;
|
||||
}
|
||||
|
|
@ -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
|
||||
}
|
||||
}
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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); }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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;
|
||||
}
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; }
|
||||
}
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
/*
|
||||
===============================
|
||||
@Import Function
|
||||
===============================
|
||||
*/
|
||||
/*
|
||||
===============================
|
||||
@Import Mixins
|
||||
===============================
|
||||
*/
|
||||
.jumbotron p {
|
||||
text-align: left; }
|
||||
|
||||
.display-4 {
|
||||
word-wrap: break-word;
|
||||
font-size: 45px; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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 */
|
||||
|
|
@ -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 */
|
||||
|
|
@ -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;
|
||||
}
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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%); }
|
||||
|
|
@ -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%); }
|
||||
|
|
@ -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%); }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; } }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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';
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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; }
|
||||
|
|
@ -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%; } }
|
||||
|
|
@ -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; } }
|
||||
|
After Width: | Height: | Size: 186 KiB |
|
After Width: | Height: | Size: 9.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 5.8 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 771 B |
|
After Width: | Height: | Size: 9.6 KiB |
|
After Width: | Height: | Size: 538 KiB |
|
After Width: | Height: | Size: 8.9 KiB |
|
After Width: | Height: | Size: 816 B |
|
|
@ -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 |
|
After Width: | Height: | Size: 469 B |
|
After Width: | Height: | Size: 5.6 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 638 B |