@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
html {
--primary:#131720 !important;
--secondary:#2f80ed !important;
--white:#fff;
--white2:#fff;
--white3:#fff;
--bgcolor:#f5f5f5;
--bgcolor2:#f5f5f5;
--border-color:#ebebeb; }
html.dark-theme {
--secondary:#151f30 !important;
--primary:#fff !important;
--white:#2f80ed;
--white2:#151f30;
--white3:#131924;
--bgcolor:#131720;
--bgcolor2:#151f30;
--border-color:#1f2e47; }
/*
Media Query mixin
See https://github.com/sass-mq/sass-mq/ for original full version.
@example scss
.element {
@include mq($from: mobile) {
color: red;
}
@include mq($to: tablet) {
color: blue;
}
@include mq(mobile, tablet) {
color: green;
}
@include mq($from: tablet, $and: '(orientation: landscape)') {
color: teal;
}
@include mq(em(950px)) {
color: hotpink;
}
@include mq(em(950px), $media-feature: height) {
color: hotpink;
}
@include mq(tablet, $media-type: screen) {
color: hotpink;
}
// Advanced use:
$custom-breakpoints: (L: 900px, XL: 1200px);
@include mq(L, $bp: $custom-breakpoints) {
color: hotpink;
}
}
*/
/*
Margin / Padding Quick Resets
example: top & bottom margin set to $spacing-unit
.element {
@include push--ends;
}
example: left & right padding set to $spacing-unit--small
.element {
@include soft--sides($spacing-unit--small);
}
*/
/*
Helper mixins
*/
/*
Form input placeholder text
example:
input,
textarea {
@include input-placeholder {
color: $grey;
}
}
*/
/*
Retina images
example:
.element {
@include retina {
background-image: url(../img/background@2x.png);
}
}
*/
/*
Content margins
fore removing first/last child margins
example: default
.element {
@include content-margins;
}
output:
.element > *:first-child {
margin-top: 0;
}
.element > *:last-child {
margin-bottom: 0;
}
example: empty selector
.element {
@include content-margins('false');
}
output:
.element:first-child {
margin-top: 0;
}
.element:last-child {
margin-bottom: 0;
}
*/
/*
CSS Triangle
used for creating CSS only triangles
example:
.element {
&::before {
@include css-triangle(blue, down);
}
}
*/
/*
Hide text
example:
.element {
@include hide-text;
}
*/
/*
Responsive ratio
Used for creating scalable elements that maintain the same ratio
example:
.element {
@include responsive-ratio(400, 300);
}
*/
/*
Icon
For using fontastic icons in pseudo elements
*/
/*
Colours
background, colour, etc. match up with colour map in _variables.scss
modify to suit per project
*/
/*
Fluid Property
http://www.adrenalinmedia.com.au/the-agency/insights/this-changes-everything-css-fluid-properties.aspx
HTML:
Text to replace
example:
h1 {
@include fp(font-size, 50, 100); // 50px at 320, 100px at 1920;
}
output:
h1 {
font-size: calc(3.125vw + 40px); //This is the magic!
}
@media (max-width:320px){ //Clips the start to the min value
font-size:50px;
}
@media (min-width:1920px){ //Clips the end to the max value
font-size:100px;
}
*/
/*
Misc
*/
/*
Font face
example:
@include font-face('Clarendon', 'clarendon-webfont');
@include font-face('Clarendon', 'clarendon-webfont', $w--bold, italic);
*/
/*
REMs
*/
/*
EMs calculator
*/
/*
SVG inliner
*/
/*
Media Query mixin
See https://github.com/sass-mq/sass-mq/ for original full version.
@example scss
.element {
@include mq($from: mobile) {
color: red;
}
@include mq($to: tablet) {
color: blue;
}
@include mq(mobile, tablet) {
color: green;
}
@include mq($from: tablet, $and: '(orientation: landscape)') {
color: teal;
}
@include mq(em(950px)) {
color: hotpink;
}
@include mq(em(950px), $media-feature: height) {
color: hotpink;
}
@include mq(tablet, $media-type: screen) {
color: hotpink;
}
// Advanced use:
$custom-breakpoints: (L: 900px, XL: 1200px);
@include mq(L, $bp: $custom-breakpoints) {
color: hotpink;
}
}
*/
/*
Margin / Padding Quick Resets
example: top & bottom margin set to $spacing-unit
.element {
@include push--ends;
}
example: left & right padding set to $spacing-unit--small
.element {
@include soft--sides($spacing-unit--small);
}
*/
/*
Helper mixins
*/
/*
Form input placeholder text
example:
input,
textarea {
@include input-placeholder {
color: $grey;
}
}
*/
/*
Retina images
example:
.element {
@include retina {
background-image: url(../img/background@2x.png);
}
}
*/
/*
Content margins
fore removing first/last child margins
example: default
.element {
@include content-margins;
}
output:
.element > *:first-child {
margin-top: 0;
}
.element > *:last-child {
margin-bottom: 0;
}
example: empty selector
.element {
@include content-margins('false');
}
output:
.element:first-child {
margin-top: 0;
}
.element:last-child {
margin-bottom: 0;
}
*/
/*
CSS Triangle
used for creating CSS only triangles
example:
.element {
&::before {
@include css-triangle(blue, down);
}
}
*/
/*
Hide text
example:
.element {
@include hide-text;
}
*/
/*
Responsive ratio
Used for creating scalable elements that maintain the same ratio
example:
.element {
@include responsive-ratio(400, 300);
}
*/
/*
Icon
For using fontastic icons in pseudo elements
*/
/*
Colours
background, colour, etc. match up with colour map in _variables.scss
modify to suit per project
*/
/*
Fluid Property
http://www.adrenalinmedia.com.au/the-agency/insights/this-changes-everything-css-fluid-properties.aspx
HTML:
Text to replace
example:
h1 {
@include fp(font-size, 50, 100); // 50px at 320, 100px at 1920;
}
output:
h1 {
font-size: calc(3.125vw + 40px); //This is the magic!
}
@media (max-width:320px){ //Clips the start to the min value
font-size:50px;
}
@media (min-width:1920px){ //Clips the end to the max value
font-size:100px;
}
*/
/*
Misc
*/
/*
Font face
example:
@include font-face('Clarendon', 'clarendon-webfont');
@include font-face('Clarendon', 'clarendon-webfont', $w--bold, italic);
*/
/*
REMs
*/
/*
EMs calculator
*/
/*
SVG inliner
*/
html {
font-size: 100%;
overflow-x: hidden; }
@media screen and (max-width: 991px) {
html {
font-size: 80%; } }
@media screen and (max-width: 320px) {
html {
font-size: 70%; } }
@media (prefers-reduced-motion: no-preference) {
:root {
scroll-behavior: smooth; } }
body {
font-size: 1rem;
font-family: "Poppins", sans-serif;
color: var(--primary);
line-height: 1;
margin: 0;
padding: 0 !important;
overflow-x: hidden;
background-color: var(--bgcolor);
width: 100%;
position: relative; }
body.no-scroll {
overflow: hidden;
position: fixed; }
@media (min-width: 1200px) {
.container {
max-width: 1170px; } }
.button-row {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
margin-top: 2.1875rem; }
.button-row .list-inline-item:not(:last-child) {
margin-right: 4.0625rem; }
@media screen and (max-width: 575px) {
.button-row {
justify-content: center; }
.button-row .btn {
width: 100%; } }
.inline-buttons {
display: flex;
justify-content: space-between; }
.inline-buttons > .btn, .inline-buttons div {
width: 49%; }
.view-all {
width: 7.5rem;
height: 2.8125rem;
background-color: var(--primary);
color: #fff;
border-radius: 10px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center; }
@media screen and (min-width: 1025px) {
.view-all:hover {
background-color: var(--secondary);
color: #fff;
opacity: 1; } }
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
user-select: none;
border: 0;
border-radius: 0;
transition: all 0.5s ease;
font-size: 14px;
color: #fff;
padding: 0 1.25rem;
height: 40px;
line-height: 40px;
vertical-align: middle;
position: relative;
box-shadow: none !important;
border-radius: 9px;
z-index: 99; }
@media screen and (max-width: 767px) {
.btn {
height: 38px;
line-height: 38px;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px; } }
.btn:hover {
text-decoration: none; }
.btn.full {
width: 100%; }
.btn:active {
outline: none;
box-shadow: none; }
.btn:focus {
box-shadow: none !important; }
.btn.btn-primary,
.btn .btn-primary:focus,
.btn .btn-primary:active {
background: #2e80ec;
color: #ffffff; }
.btn.btn-primary:hover,
.btn .btn-primary:focus:hover,
.btn .btn-primary:active:hover {
opacity: .7; }
/*
Basic, low level typography
*/
a {
transition: .5s ease all;
color: var(--secondary); }
@media screen and (min-width: 1025px) {
a:hover {
color: var(--primary);
text-decoration: none; } }
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
font-weight: 600;
margin-top: 0;
line-height: 1.1; }
h1 {
font-size: 3.75rem; }
@media screen and (min-width: 320px) {
h1 {
font-size: 2.5rem; } }
@media screen and (min-width: 991px) {
h1 {
font-size: 3.125rem; } }
@media screen and (min-width: 1300px) {
h1 {
font-size: 3.75rem; } }
h2 {
font-size: 3rem; }
@media screen and (min-width: 320px) {
h2 {
font-size: 2.0625rem; } }
@media screen and (min-width: 991px) {
h2 {
font-size: 2.375rem; } }
@media screen and (min-width: 1300px) {
h2 {
font-size: 3rem; } }
h3 {
font-size: 2.25rem; }
@media screen and (min-width: 320px) {
h3 {
font-size: 1.375rem; } }
@media screen and (min-width: 991px) {
h3 {
font-size: 1.5625rem; } }
@media screen and (min-width: 1300px) {
h3 {
font-size: 2.25rem; } }
h4 {
font-size: 1.5rem; }
@media screen and (min-width: 320px) {
h4 {
font-size: 1.25rem; } }
@media screen and (min-width: 991px) {
h4 {
font-size: 1.375rem; } }
@media screen and (min-width: 1300px) {
h4 {
font-size: 1.5rem; } }
h5 {
font-size: 1.25rem; }
@media screen and (min-width: 320px) {
h5 {
font-size: 1.0625rem; } }
@media screen and (min-width: 991px) {
h5 {
font-size: 1.1875rem; } }
@media screen and (min-width: 1300px) {
h5 {
font-size: 1.25rem; } }
h6 {
font-size: 1.125rem;
margin-bottom: 1.875rem; }
@media screen and (min-width: 320px) {
h6 {
font-size: 0.9375rem; } }
@media screen and (min-width: 991px) {
h6 {
font-size: 0.9375rem; } }
@media screen and (min-width: 1300px) {
h6 {
font-size: 1.125rem; } }
p {
font-size: 1rem;
margin: 0 0 1.25rem 0;
line-height: 1.45;
color: var(--textcolor); }
ul, ol,
.blockquote, .button-wrapper, .media, .table-wrapper {
margin-bottom: 1rem; }
ul:last-child, ol:last-child,
.blockquote:last-child, .button-wrapper:last-child, .media:last-child, .table-wrapper:last-child {
margin-bottom: 0; }
ol,
ul {
padding: 0;
margin: 0; }
b,
strong {
font-weight: 700; }
.abs-link {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 9;
color: transparent;
font-size: 0;
text-indent: -2px; }
#loader-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1003; }
#loader {
position: relative;
width: 100%;
margin: auto;
height: 100%;
z-index: 1001;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
flex-direction: column; }
#loader-wrapper .loader-section {
position: fixed;
top: 0;
width: 51%;
height: 100%;
background: #fff;
z-index: 1000; }
#loader-wrapper .loader-section.section-left {
left: 0; }
#loader-wrapper .loader-section.section-right {
right: 0; }
.loader {
position: relative;
width: 60px;
height: 60px;
border-radius: 50%;
margin-top: 20px;
display: inline-block;
vertical-align: middle; }
.loader .loader-outter {
position: absolute;
border: 4px solid var(--primary);
border-left-color: transparent;
border-bottom: 0;
width: 100%;
height: 100%;
border-radius: 50%;
-webkit-animation: loader-1-outter 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
animation: loader-1-outter 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite; }
.loader .loader-inner {
position: absolute;
border: 4px solid var(--primary);
border-radius: 50%;
width: 40px;
height: 40px;
left: calc(50% - 20px);
top: calc(50% - 20px);
border-right: 0;
border-top-color: transparent;
-webkit-animation: loader-1-inner 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
animation: loader-1-inner 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite; }
@-webkit-keyframes loader-1-outter {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@keyframes loader-1-outter {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@-webkit-keyframes loader-1-inner {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg); } }
@keyframes loader-1-inner {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg); } }
/* Loaded styles */
.loaded #loader-wrapper .loader-section.section-left {
-webkit-transform: translateX(-100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateX(-100%);
/* IE 9 */
transform: translateX(-100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
/* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6 */
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
/* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+ */ }
.loaded #loader-wrapper .loader-section.section-right {
-webkit-transform: translateX(100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateX(100%);
/* IE 9 */
transform: translateX(100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
/* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6 */
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
/* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+ */ }
.loaded #loader {
opacity: 0;
-webkit-transition: all 0.3s ease-out;
/* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6 */
transition: all 0.3s ease-out;
/* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+ */ }
.loaded #loader-wrapper {
visibility: hidden;
-webkit-transform: translateY(-100%);
/* Chrome, Opera 15+, Safari 3.1+ */
-ms-transform: translateY(-100%);
/* IE 9 */
transform: translateY(-100%);
/* Firefox 16+, IE 10+, Opera */
-webkit-transition: all 0.3s 1s ease-out;
/* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6 */
transition: all 0.3s 1s ease-out;
/* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+ */ }
.modal-backdrop.show {
opacity: .8; }
.modal {
text-align: center;
padding: 0 !important; }
.modal .modal-dialog-centered {
display: flex !important; }
.modal .modal-dialog {
max-width: 1024px;
width: 1024px;
text-align: left;
vertical-align: middle;
display: inline-block;
margin: .7rem auto !important; }
@media screen and (max-width: 1200px) {
.modal .modal-dialog {
max-width: auto;
width: 95%;
margin: auto; } }
.modal .modal-dialog .modal-content {
box-shadow: none;
border: none;
margin: 0 auto;
pointer-events: all;
background: transparent;
overflow: visible;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
.modal .modal-dialog .modal-content .popup-cross-icon {
position: absolute;
right: 25px;
top: 25px;
cursor: pointer;
z-index: 1000;
width: 14px;
height: 14px;
border: 0;
background: transparent; }
.modal .modal-dialog .modal-content .popup-cross-icon:after {
content: '';
position: absolute;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24px' height='24px'%3E%3Cpath fill-rule='evenodd' fill='%2335461E' d='M13.711,12.337 L23.103,21.728 C23.622,22.247 23.622,23.088 23.103,23.607 C22.584,24.125 21.743,24.125 21.225,23.607 L11.833,14.215 L2.441,23.607 C1.922,24.125 1.082,24.125 0.563,23.607 C0.044,23.088 0.044,22.247 0.563,21.728 L9.955,12.337 L0.563,2.945 C0.044,2.426 0.044,1.585 0.563,1.066 C1.082,0.547 1.922,0.547 2.441,1.066 L11.833,10.458 L21.225,1.066 C21.743,0.547 22.584,0.547 23.103,1.066 C23.622,1.585 23.622,2.426 23.103,2.945 L13.711,12.337 Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
height: 14px;
width: 14px;
left: 0;
top: 0;
background-size: cover; }
@media screen and (min-width: 1025px) {
.modal .modal-dialog .modal-content .popup-cross-icon:hover {
opacity: 0.8; } }
.modal .modal-dialog .modal-content .modal-title {
font-size: 1.75rem;
font-weight: 700; }
.modal .modal-dialog .modal-content .modal-subtitle a {
color: var(--default); }
.modal.large .modal-dialog {
max-width: 1430px;
width: 1430px; }
@media screen and (max-width: 1500px) {
.modal.large .modal-dialog {
max-width: 1200px;
width: 1200px; } }
@media screen and (max-width: 1250px) {
.modal.large .modal-dialog {
width: 90%; } }
.modal.small .modal-dialog {
max-width: 600px;
width: 600px; }
@media screen and (max-width: 650px) {
.modal.small .modal-dialog {
width: 95%; } }
.modal.medium .modal-dialog {
max-width: 775px;
width: 775px; }
@media screen and (max-width: 850px) {
.modal.medium .modal-dialog {
width: 95%; } }
.modal.custom-modal .modal-body {
/*padding: 25px 30px 20px 30px;*/
padding: 0;
visibility: hidden;
overflow: hidden; }
.modal.custom-modal .modal-body.show {
visibility: visible;
height: auto;
overflow: visible; }
.modal.custom-modal .modal-body video {
width: 100%;
height: 100%; }
.modal.custom-modal:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -4px; }
.modal.show .modal-dialog {
transform: none; }
.modal.schedule-modal .modal-dialog {
max-width: 775px;
width: 775px; }
@media screen and (max-width: 850px) {
.modal.schedule-modal .modal-dialog {
width: 95%; } }
.modal.schedule-modal .modal-dialog .modal-content {
padding: 0; }
.modal.schedule-modal .modal-dialog .modal-content .back {
padding: 12px 0;
padding-left: 30px;
position: relative;
background: url(../images/icons/arrow-left.png) left center no-repeat;
background-size: 26px;
font-size: 14px;
color: #fff !important; }
.modal.schedule-modal .modal-dialog .modal-content .back:hover {
opacity: .7; }
.modal.schedule-modal .modal-dialog .modal-content .modal-close {
padding: 12px 0;
padding-right: 30px;
position: relative;
background: url(../images/icons/cross-circle-white.png) right center no-repeat;
background-size: 26px;
font-size: 14px;
color: #fff !important; }
.modal.schedule-modal .modal-dialog .modal-content .modal-close:hover {
opacity: .7; }
.modal.schedule-modal .modal-dialog .modal-content .form-control {
border: 1px solid #e0e2e3;
background: #f3f4f4;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
color: #949494;
font-size: 14px;
height: 43px;
line-height: 43px; }
.modal.schedule-modal .modal-dialog .modal-content .form-control::placeholder {
font-size: 14px;
font-weight: 400;
color: #949494; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-toggle {
border: 1px solid #e0e2e3;
background: #f3f4f4 !important;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
height: 43px;
line-height: 43px;
padding-left: 2.8125rem; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-toggle:after {
display: none; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
font-size: 14px;
font-weight: 400;
color: #949494; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-menu {
background: #f3f4f4;
max-width: 273px;
width: 273px;
min-width: 273px !important; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-menu .inner {
overflow-x: hidden !important; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-menu li a {
color: #949494 !important;
font-size: 14px;
font-weight: 400; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-menu li a:hover {
background: #00b3e2;
color: #fff !important; }
.modal.schedule-modal .modal-dialog .modal-content .bootstrap-select .dropdown-menu li.selected a {
background: #00b3e2;
color: #fff !important; }
.modal.schedule-modal .modal-dialog .modal-content .btn {
font-size: 14px;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
height: 43px;
line-height: 43px;
padding-top: 0;
padding-bottom: 0;
background: #00b3e2;
color: #fff !important; }
@media screen and (min-width: 1025px) {
.modal.schedule-modal .modal-dialog .modal-content .btn:hover {
background: var(--primary); } }
.modal.schedule-modal .modal-dialog .modal-content .top-head {
background: #00b3e2;
padding: 0.9375rem;
padding-bottom: 1rem;
margin: 0;
border-top-left-radius: 20px;
border-top-right-radius: 20px; }
.modal.schedule-modal .modal-dialog .modal-content .top-head .modal-title {
color: #fff;
font-size: 1.125rem;
font-weight: 500;
margin: 0; }
.modal.schedule-modal .modal-dialog .modal-content .popup-cross-icon {
right: 17px;
top: 15px; }
.modal.schedule-modal .modal-dialog .modal-content .popup-cross-icon:after {
background: url(../images/icons/cross-circle-white.png) left top no-repeat;
background-size: 100%; }
.modal.schedule-modal .modal-dialog .modal-content .modal-inner {
padding: 1.25rem;
padding-top: 1.875rem; }
@media screen and (max-width: 575px) {
.modal.schedule-modal .modal-dialog .modal-content .back {
position: absolute;
top: 10px;
left: 10px; }
.modal.schedule-modal .modal-dialog .modal-content .modal-close {
position: absolute;
right: 10px;
top: 10px; } }
.modal.information-modal .modal-dialog .modal-content .popup-cross-icon {
display: none; }
.datepicker {
position: relative; }
.datepicker .form-control {
padding-left: 2.8125rem; }
.datepicker > span {
width: 31px;
height: 31px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
background: #fff url(../images/icons/calendar.png) center center no-repeat;
background-size: 14px;
position: absolute;
top: 50%;
left: 6px;
transform: translateY(-50%);
z-index: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%); }
.time-select {
position: relative; }
.time-select > span {
width: 31px;
height: 31px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
background: #fff url(../images/icons/calendar-clock-blue.png) center center no-repeat;
background-size: 14px;
position: absolute;
top: 50%;
left: 6px;
transform: translateY(-50%);
z-index: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%); }
.flatpickr-day.selected {
background: #00b3e2;
color: #fff; }
.flatpickr-weekdays {
padding-top: 10px; }
.mCSB_scrollTools .mCSB_draggerRail {
width: 5px !important;
background: var(--textcolor) !important; }
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 5px !important;
background: #00b3e2 !important;
height: auto; }
.mCSB_inside > .mCSB_container {
margin-right: 12px; }
.bs-tooltip-auto[x-placement^=right] .arrow::before,
.bs-tooltip-right .arrow::before {
border-right-color: var(--primary); }
.tooltip-inner {
background-color: var(--primary); }
.nav-tabs {
border: 0;
margin-bottom: 1.6875rem; }
.nav-tabs .nav-link {
color: var(--primary);
background-color: #fff;
border-radius: 10px;
font-size: 1rem;
text-align: center;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
border: 0;
padding: 0.8125rem 1.125rem; }
.nav-tabs .nav-link span {
min-width: 23px;
height: 23px;
border-radius: 100%;
color: var(--primary);
font-size: 14px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
background-color: #dcf5f7; }
.nav-tabs .nav-link:not(:last-child) {
margin-right: 11px; }
.nav-tabs .nav-link.active {
background-color: var(--primary);
color: #fff !important; }
.nav-tabs .nav-link.active span {
background-color: #3ac8cf;
color: #fff; }
.nav-tabs.inner-tabs {
border-bottom: 1px solid var(--primary);
max-width: 328px;
justify-content: space-between; }
.nav-tabs.inner-tabs .nav-link {
padding: 0;
color: var(--secondary);
font-size: 14px;
background: transparent;
padding: 10px 8px;
border-bottom: 2px solid transparent;
border-radius: 0; }
.nav-tabs.inner-tabs .nav-link.active {
border-color: var(--primary);
color: var(--primary) !important; }
@media screen and (max-width: 414px) {
.nav-tabs {
margin-bottom: 1.25rem; }
.nav-tabs .nav-link {
font-size: 0.875rem; } }
.table {
border-collapse: separate;
border-spacing: 0px 15px;
border: 0 !important; }
.table .btn-primary {
color: #fff !important;
display: flex;
align-items: center;
justify-content: space-between;
border-radius: 6px;
padding: 0 8px;
height: 40px;
line-height: 40px;
max-width: 150px; }
.table .btn-primary img {
max-width: 16px; }
.table .text-primary {
color: var(--primary) !important; }
.table td, .table th {
font-size: 14px;
border: 0 !important;
font-weight: 400;
vertical-align: middle !important;
padding: 1.125rem 0.5rem; }
.table td:first-child, .table th:first-child {
padding-left: 1.5625rem; }
@media screen and (max-width: 991px) {
.table td, .table th {
font-size: 13px; }
.table td:first-child, .table th:first-child {
padding-left: 0.5rem; } }
.table thead {
background: #2f80ed;
border-radius: 10px; }
.table thead th {
color: #fff;
padding: 18px 12px !important; }
.table thead th:first-child {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px; }
.table thead th:last-child {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px; }
.table tbody td {
color: var(--primary);
background-color: #fff;
font-weight: 500; }
.table tbody td:first-child {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px; }
.table tbody td:last-child {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px; }
table.dataTable {
border-spacing: 0px 15px;
border: 0 !important;
white-space: nowrap; }
table.dataTable thead th {
padding: 1.125rem;
font-weight: 400; }
table.dataTable tbody td {
padding: 1.125rem 0.5rem; }
.dataTables_filter input {
background-color: #fff !important;
outline: none;
border: 1px solid transparent !important;
border-radius: 12px !important;
opacity: 1;
transition: all 0.2s;
touch-action: manipulation;
padding: 0 15px !important;
color: var(--textcolor) !important;
height: 50px; }
.dataTables_wrapper .dataTables_paginate .paginate_button {
color: var(--secondary) !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
background: var(--secondary) !important;
border: 0 !important;
color: #fff !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
background: var(--primary) !important;
border: 0 !important;
color: #fff !important; }
.header {
position: fixed;
z-index: 999;
width: 100%;
top: 35px;
transition: .5s ease all; }
.header .header-menu {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
flex-direction: column;
cursor: pointer;
z-index: 999;
margin-right: 1.25rem;
position: relative;
width: 48px;
height: 48px;
border-radius: 12px;
background: var(--white2);
border: 1px solid var(--border-color); }
.header .header-menu span {
width: 26px;
height: 2px;
background: var(--primary);
display: block;
margin-bottom: 4px;
transition: all .3s; }
.header__wrapper {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
transition: .5s ease all;
transition: .5s ease all; }
.header__search .form-group {
background-color: var(--white2);
border: 1px solid var(--border-color);
border-radius: 17px;
height: 3.75rem;
position: relative;
display: flex;
align-items: center;
padding: 0 1.25rem 0 3.75rem;
width: 330px; }
.header__search .form-group .form-control {
border: 0;
background: transparent;
padding: 0;
height: auto;
box-shadow: none;
outline: none !important;
color: #2d4163;
font-size: 14px; }
.header__search .form-group .form-control::placeholder {
color: #2d4163;
font-size: 14px;
font-style: italic; }
.header__search .form-group button {
position: absolute;
left: 18px;
top: 50%;
transform: translateY(-50%);
border: 0;
outline: none;
background-color: transparent;
width: 24px;
height: 24px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
background: url(../images/icons/search.png) center center no-repeat;
background-size: 100%; }
.header__links ul {
list-style: none;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end; }
.header__links ul li:not(:last-child) {
margin-right: 12px; }
.header__links ul li a {
width: 3.75rem;
height: 3.75rem;
border-radius: 20px;
background: var(--white2);
border: 1px solid var(--border-color);
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center; }
.header__links ul li a img {
max-width: 25px; }
.header__links ul li a.logout {
background: #2f80ed;
border-color: #2f80ed; }
.header.sticky {
top: 0;
background: #fff; }
.header.sticky:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
background: var(--primary);
left: 0;
bottom: 0; }
.header .header-search a img.cross {
width: 18px;
display: none; }
@media screen and (max-width: 991px) {
.header__logo {
font-weight: 600;
display: flex !important;
align-items: center;
font-size: 1.125rem;
width: 160px; }
.header__logo img {
max-width: 30px;
margin-right: 1rem; }
.header__search {
display: none; } }
@media screen and (max-width: 767px) {
.header__links ul li:not(:last-child) {
margin-right: 8px; }
.header__links ul li a {
width: 2.8125rem;
height: 2.8125rem;
border-radius: 10px; }
.header__links ul li a img {
max-width: 19px; } }
@media screen and (max-width: 575px) {
.header__wrapper {
flex-direction: column; }
.header__logo {
margin-bottom: 0.75rem; } }
footer {
background: var(--secondary);
padding: 1.125rem 0;
position: relative;
margin-top: -1px; }
footer .flex-wrapper {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between; }
footer p {
color: #fff;
font-weight: 300;
margin: 0;
line-height: 1; }
footer ul {
list-style: none;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: start; }
footer ul li:not(:last-child) {
margin-right: 1.25rem; }
footer ul li a {
color: #6ea6f2;
font-weight: 300; }
@media screen and (max-width: 500px) {
footer .flex-wrapper {
flex-direction: column-reverse; }
footer ul {
padding-bottom: 10px; } }
.no-scroll {
overflow: hidden; }
.modal-open {
position: fixed; }
.section-head {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
margin-bottom: 1.25rem; }
.section-head .back {
font-size: 1.125rem;
text-transform: uppercase; }
.section-head .back .fa {
margin-right: 6px; }
.section-head .section-title {
margin: 0 !important; }
.mb-60 {
margin-bottom: 3.75rem !important; }
@media screen and (max-width: 991px) {
.mb-60 {
margin-bottom: 1.875rem !important; } }
.section-title {
font-size: 1.375rem;
font-weight: 500;
margin-bottom: 0.75rem;
color: var(--primary);
text-transform: capitalize; }
@media screen and (max-width: 767px) {
.section-title {
font-size: 1.25rem; } }
.dashboard-menu {
max-width: 290px;
flex: 0 0 290px;
background-color: var(--white3);
padding: 1.75rem 2.1875rem;
color: var(--primary);
border-right: 1px solid var(--border-color);
display: none;
transition: .5s ease all;
-webkit-transition: .5s ease all;
-moz-transition: .5s ease all;
-ms-transition: .5s ease all;
-o-transition: .5s ease all; }
.dashboard-menu__logo {
font-size: 1.25rem;
font-weight: 600;
display: flex;
align-items: center;
width: 100%; }
.dashboard-menu__logo img {
margin-right: 10px;
max-width: 35px; }
.dashboard-menu .profile {
margin: 2.8125rem 0;
width: 216px;
height: 216px;
border-radius: 23px;
background-color: var(--secondary);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center; }
.dashboard-menu .profile__image {
width: 4.875rem;
height: 4.875rem;
border-radius: 100%;
background: var(--white);
overflow: hidden;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
margin-bottom: 13px; }
.dashboard-menu .profile__image img {
position: relative;
top: 6px; }
.dashboard-menu .profile p {
color: #fff;
line-height: 1;
margin-bottom: 5px; }
.dashboard-menu .profile p:last-child {
font-size: 14px;
margin: 0; }
.dashboard-menu__toggler {
width: 35px;
height: 35px;
border-radius: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
background: #fff url(../images/icons/list.png) center center no-repeat;
background-size: 20px; }
.dashboard-menu ul {
list-style: none; }
.dashboard-menu ul li:not(:last-child) {
margin-bottom: 1.0625rem; }
.dashboard-menu ul li a {
position: relative;
height: 3.3125rem;
padding: 0 1.875rem;
font-weight: 300;
border-radius: 15px;
color: var(--primary);
display: flex;
align-items: center;
border: 1px solid transparent; }
.dashboard-menu ul li a i {
margin-right: 8px;
font-size: 1.25rem; }
@media screen and (min-width: 1025px) {
.dashboard-menu ul li a:hover {
background-color: var(--secondary);
color: var(--white); } }
.dashboard-menu ul li.active a {
background-color: var(--secondary);
color: var(--white);
border: 1px solid var(--border-color); }
.dashboard-menu.menu-close {
max-width: 70px;
flex: 0 0 70px; }
.dashboard-menu.menu-close ul li a {
padding: 0 1rem; }
.dashboard-menu.menu-close ul li a img {
margin: auto; }
.dashboard-menu.menu-close ul li a span {
display: none; }
.dashboard-menu.menu-close ul li a p {
display: none; }
.dashboard-menu.menu-close .dashboard-menu__title {
display: none; }
@media screen and (max-width: 1200px) {
.dashboard-menu__title {
font-size: 1.125rem; } }
@media screen and (max-width: 991px) {
.dashboard-menu {
position: fixed;
height: 100%;
left: -100%;
overflow-y: scroll; } }
.dashboard .dashboard-menu {
display: block; }
.dashboard #loader-wrapper {
display: none; }
.dashboard .header {
position: static;
margin-bottom: 3rem; }
.dashboard .header .container {
max-width: 100%;
padding: 0; }
.dashboard .main-wrapper {
position: relative;
display: flex;
height: 100%; }
.dashboard .wrapper {
flex: 1;
width: 100%;
padding: 20px 36px 0 26px; }
.dashboard .dashboard-content .swiper {
padding-bottom: 3.125rem; }
.dashboard .dashboard-content .slider__arrows {
position: relative;
width: 107px;
margin: auto;
margin-top: 19px;
display: flex;
align-items: center;
justify-content: space-between; }
.dashboard .dashboard-content .slider__arrows .swiper-buttons {
position: relative;
transform: none;
left: auto;
right: auto;
top: auto;
bottom: 0;
margin: 0; }
.dashboard .dashboard-content .slider__arrows .swiper-buttons:after {
font-size: 1.75rem;
color: var(--primary); }
.dashboard .dashboard-content .card {
border-radius: 20px;
overflow: hidden;
border: 0;
color: #ffff;
position: relative;
height: 100%;
min-height: 270px;
transition: .4s ease all; }
.dashboard .dashboard-content .card.favourite .fa:before {
content: "\f02e"; }
.dashboard .dashboard-content .card .play-icon {
width: 3.75rem;
height: 3.75rem;
background: url(../images/icons/play-button.png) center center no-repeat;
background-size: 100%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1;
background-size: 85%; }
.dashboard .dashboard-content .card .image {
position: relative;
width: 100%;
height: 100%; }
.dashboard .dashboard-content .card .image:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-color: #151f30;
opacity: 0;
left: 0;
top: 0; }
.dashboard .dashboard-content .card .image img {
height: 100%;
width: 100%;
object-fit: cover;
object-position: center; }
.dashboard .dashboard-content .card .save {
display: flex;
align-items: center;
font-size: 13px;
color: #fff;
gap: 5px;
z-index: 99;
position: absolute;
padding: 10px;
top: -100%;
transition: .4s ease all; }
.dashboard .dashboard-content .card .save span {
width: 40px;
min-width: 40px;
height: 40px;
border-radius: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
background: #2e80ec; }
.dashboard .dashboard-content .card .save:hover {
opacity: .7; }
.dashboard .dashboard-content .card__content {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
position: absolute;
padding: 13px;
width: 100%;
bottom: -100%;
transition: .4s ease all; }
.dashboard .dashboard-content .card__content span {
font-size: 1.125rem;
font-weight: 500;
display: block;
margin-bottom: 6px; }
.dashboard .dashboard-content .card__content p {
margin: 0;
font-size: 12px;
margin: 0; }
@media screen and (min-width: 1025px) {
.dashboard .dashboard-content .card:hover .save {
top: 0; }
.dashboard .dashboard-content .card:hover .card__content {
bottom: 0; }
.dashboard .dashboard-content .card:hover .image:after {
opacity: 70%; } }
@media screen and (max-width: 1024px) {
.dashboard .dashboard-content .card .image:after {
opacity: 70%; }
.dashboard .dashboard-content .card__content {
bottom: 0; }
.dashboard .dashboard-content .card .save {
top: 0; } }
.dashboard .dashboard-content .col-wrapper {
display: flex;
justify-content: space-between;
padding-bottom: 5rem; }
.dashboard .dashboard-content .col-wrapper > div {
width: 19%;
flex: 0 0 19%;
padding: 0; }
.dashboard .dashboard-content .recently-uploaded {
padding-bottom: 2.5rem; }
.dashboard .dashboard-content .recently-uploaded .card {
min-height: 255px;
border: 1px solid var(--border-color);
transform: scaleY(1);
margin-bottom: 10px; }
.dashboard .dashboard-content .recently-uploaded .card .save {
position: static;
padding: 0; }
.dashboard .dashboard-content .recently-uploaded .card .save span {
width: 45px;
height: 45px; }
.dashboard .dashboard-content .recently-uploaded .card__content {
bottom: 0; }
.dashboard .dashboard-content .recently-uploaded .card .image:after {
background: url(../images/icons/card-layer.png) center center no-repeat;
background-size: cover;
opacity: 1; }
@media screen and (max-width: 1200px) {
.dashboard .dashboard-content .col-wrapper {
flex-wrap: wrap; }
.dashboard .dashboard-content .col-wrapper > div {
width: 24%;
flex: 0 0 24%;
margin-bottom: 10px; } }
@media screen and (max-width: 991px) {
.dashboard .dashboard-menu {
padding: 1.25rem 1rem; }
.dashboard .dashboard-menu .profile {
width: 170px;
height: 170px;
margin: 1.5625rem 0; }
.dashboard .dashboard-menu__logo {
font-size: 1.125rem; }
.dashboard .dashboard-menu__logo img {
max-width: 30px; } }
@media screen and (max-width: 767px) {
.dashboard .dashboard-content .col-wrapper {
justify-content: center;
padding-bottom: 2.5rem; }
.dashboard .dashboard-content .col-wrapper > div {
width: 30%;
flex: 0 0 30%;
margin-right: 1.25rem; }
.dashboard .dashboard-content .recently-uploaded {
justify-content: center; }
.dashboard .dashboard-content .recently-uploaded > div:not(:last-child) {
margin-bottom: 1.25rem; } }
@media screen and (max-width: 575px) {
.dashboard .dashboard-content .card {
height: 220px;
min-height: 220px; }
.dashboard .dashboard-content .col-wrapper {
justify-content: center;
margin: 0 -10px; }
.dashboard .dashboard-content .col-wrapper > div {
width: 46%;
flex: 0 0 46%;
padding: 0 10px;
margin-right: 0; } }
@media screen and (max-width: 414px) {
.dashboard .dashboard-content .card {
height: 220px;
min-height: 220px; }
.dashboard .dashboard-content .col-wrapper {
margin: 0; }
.dashboard .dashboard-content .col-wrapper > div {
width: 100%;
flex: 0 0 100%;
padding: 0; } }
.front-page header {
display: none; }
.menu-active .dashboard-menu {
left: 0;
z-index: 9999; }
@media screen and (max-width: 991px) {
.show-on-lg {
display: block !important; } }
.search {
position: fixed;
width: 0;
height: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 99;
margin: auto;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.8);
top: 0;
opacity: 0;
width: 0;
transition: .5s ease all;
padding: 0 15px; }
.search .form-control {
position: relative;
height: 3.75rem;
font-size: 1.125rem;
color: #3b3b3f;
background-color: #fff;
padding: 1.1875rem 1.5625rem 1.1875rem;
outline: 0;
border: solid 1px #c7c8ca;
border-radius: 0;
transition: all .2s;
opacity: 1;
-webkit-appearance: none;
width: 40%; }
@media screen and (max-width: 767px) {
.search .form-control {
width: 80%; } }
.search .btn {
height: 3.75rem;
border-radius: 0; }
.search-active .header .header-search {
z-index: 999; }
.search-active .header .header-search a img.search-icon {
display: none; }
.search-active .header .header-search a img.cross {
display: block; }
.search-active .search {
opacity: 1;
width: 100%;
height: 100vh; }
.login {
position: relative;
padding: 3.4375rem 15px 7.1875rem;
background: url(../images/login-bg.png) center center no-repeat;
background-size: cover; }
.login .theme-toggler {
position: absolute;
right: 20px;
top: 20px; }
.login__logo {
font-size: 2.5rem;
font-weight: 600;
display: flex;
align-items: center;
width: 100%;
margin-bottom: 3.75rem;
justify-content: center; }
.login__logo img {
margin-right: 10px;
max-width: 35px; }
.login .content-box {
max-width: 750px;
margin: auto;
background: var(--white3);
border-radius: 15px;
padding: 2.375rem 1.75rem 3.4375rem; }
.login .content-box .form-group {
position: relative; }
.login .content-box .form-group .form-control {
height: 4.375rem;
line-height: 4.375rem;
padding-left: 60px;
border-radius: 14px;
background: url(../images/icons/avatar.png) left 20px center no-repeat;
background-color: var(--bgcolor2);
border-color: var(--border-color);
background-size: 20px; }
.login .content-box .form-group .form-control::placeholder {
color: #2d4163; }
.login .content-box .form-group.password .form-control {
background: url(../images/icons/key.png) left 20px center no-repeat;
background-color: var(--bgcolor2);
background-size: 20px; }
.login .content-box .button-row .btn {
line-height: 4.375rem;
height: 4.375rem;
font-size: 1.125rem;
font-weight: 600;
width: 100%;
border-radius: 15px; }
.login .content-box h1 {
color: var(--primary);
font-weight: 600;
font-size: 2.25rem;
margin-bottom: 3.75rem; }
.login .content-box h1 img {
width: 50px;
margin-right: 1.25rem; }
@media screen and (max-width: 767px) {
.login__logo {
font-size: 1.75rem; }
.login .theme-toggler {
top: 15px;
right: 15px; }
.login .content-box h1 {
font-size: 1.75rem;
margin-bottom: 1.6875rem; }
.login .content-box h1 img {
width: 40px; } }
.dashboard .wrapper {
padding: 15px 15px 0 15px; }
.header__search .form-group {
border-radius: 12px;
height: 48px; }
.header__links ul li a {
width: 48px;
height: 48px;
border-radius: 12px; }
.header__links ul li a img {
max-width: 20px; }
.dashboard .header {
margin-bottom: 20px; }
.dashboard .dashboard-content .recently-uploaded .card {
min-height: 180px;
height: 180px; }
.dashboard .dashboard-content .card .play-icon {
width: 30px;
height: 30px; }
.dashboard .dashboard-content .card {
min-height: 180px;
height: 180px; }
.dashboard .dashboard-content .col-wrapper {
padding-bottom: 2.5rem; }
.dashboard .wrapper {
padding: 15px 15px 15px 245px; }
.dashboard .dashboard-menu {
position: fixed;
z-index: 999;
max-width: 230px;
width: 260px;
padding: 0.75rem 1.188rem;
height: 100%;
overflow-y: auto;
left: 0; }
.dashboard-menu .profile {
margin: 1.5rem 0 20px;
width: 100%;
height: auto;
border-radius: 12px;
padding: 12px; }
.dashboard-menu ul li:not(:last-child) {
margin-bottom: 0.500rem; }
@media screen and (min-width: 992px) {
footer {
padding-left: 245px; } }
.dashboard-menu__logo {
font-size: 0.8rem; }
.dashboard-menu .profile__image {
width: 3.575rem;
height: 3.575rem; }
.dashboard-menu ul li a {
height: auto;
padding: 12px 15px;
border-radius: 12px; }
.dashboard .dashboard-content .card .save {
top: 0; }
.dashboard .dashboard-content .card__content {
bottom: 0; }
.dashboard .dashboard-content .card .image::after {
opacity: 25%; }
.dashboard .dashboard-content .card .save span {
width: 25px;
min-width: 25px;
height: 25px;
background-size: 12px; }
.dashboard .dashboard-content .card__content span {
font-size: 1.0rem; }
.dashboard .dashboard-content .card__content .btn.btn-primary {
font-size: 12px;
padding: 7px 13px;
height: auto;
line-height: 1.2;
letter-spacing: 0.5px; }
.dashboard .dashboard-content .card .image::after {
opacity: 25%; }
.toggle .dashboard-menu {
left: -230px; }
.dashboard.toggle .wrapper {
padding-left: 15px; }
.dashboard.toggle .wrapper {
padding-left: 15px; }
.dashboard.toggle footer {
padding-left: 15px; }
.dashboard .dashboard-menu,
.dashboard.toggle .dashboard-menu,
.dashboard .wrapper,
.dashboard.toggle .wrapper,
.dashboard footer,
.dashboard.toggle footer {
transition: 0.1s linear; }
.dashboard .dashboard-content .recently-uploaded .card .save span {
color: #fff;
background-image: none;
width: 30px;
height: 30px; }
.dashboard .dashboard-content .recently-uploaded .card .save.active span {
background-color: #fff;
color: #2f80ed; }
.menu-active .dashboard-menu {
left: -100%; }
.menu-active footer {
padding-left: 0; }
.menu-active .wrapper {
padding-left: 20px; }
.detail-page .card {
background-color: transparent; }
.detail-page .card__content span {
margin: 0 !important; }
.detail-page .flex-wrapper {
margin: 0 -10px;
display: flex;
flex-wrap: wrap;
padding-top: 0.625rem; }
.detail-page .col {
width: 20%;
padding: 0 10px;
margin-bottom: 20px;
flex-basis: auto; }
.detail-page .image {
position: relative;
width: 100%;
height: 180px;
border-radius: 20px;
overflow: hidden; }
.detail-page .image img {
height: 100%;
width: 100%;
object-fit: cover;
object-position: center; }
@media screen and (max-width: 1200px) {
.detail-page .col {
width: 25%; } }
@media screen and (max-width: 767px) {
.detail-page .col {
width: 33.33%; } }
@media screen and (max-width: 575px) {
.detail-page .col {
width: 50%; } }
@media screen and (max-width: 991px) {
.dashboard .wrapper {
padding-left: 15px; } }
/*# sourceMappingURL=main.css.map */