@use '../utils' as *;
/*---------------------------------
1.2 Common Classes
---------------------------------*/
.w-img {
& img {
width: 100%;
}
}
.m-img {
& img {
max-width: 100%;
}
}
.fix {
overflow: hidden
}
.clear {
clear: both;
}
.overflow-y-visible {
overflow-x: hidden;
overflow-y: visible;
}
.p-relative {
position: relative;
}
.p-absolute {
position: absolute;
}
.z-index-11 {
z-index: 11;
}
.pt-190{
padding-top: 190px;
}
.pt-255{
padding-top: 255px;
@media #{$xs} {
padding-top: 170px;
}
}
.pb-255{
padding-bottom: 255px;
}
.pb-220{
padding-bottom: 220px;
}
.pb-290{
padding-bottom: 290px;
}
.z-index{
&-1 {
z-index: 1;
}
&-2 {
z-index: 2;
}
&-3 {
z-index: 3;
}
&-4 {
z-index: 4;
}
&-5 {
z-index: 5;
}
&-6 {
z-index: 6;
}
&-7 {
z-index: 7;
}
&-8 {
z-index: 8;
}
&-9 {
z-index: 9;
}
}
.br-20 {
border-radius: 20px !important;
}
.br-10 {
border-radius: 10px !important;
}
.br {
&-5 {
& img {
border-radius: 5px !important;
}
}
&-8 {
& img {
border-radius: 8px !important;
}
}
&-10 {
& img {
border-radius: 10px;
}
}
&-12 {
& img {
border-radius: 12px !important;
}
}
&-15 {
& img {
border-radius: 15px !important;
}
}
&-20 {
& img {
border-radius: 20px !important;
}
}
&-40 {
& img {
border-radius: 40px !important;
}
}
}
.mt-fs{
&-12 {
font-size: 12px;
}
&-24{
font-size: 24px;
}
&-28{
font-size: 28px;
}
&-30{
font-size: 30px;
}
&-32{
font-size: 32px;
}
&-36{
font-size: 36px;
}
&-40{
font-size: 40px;
}
&-42{
font-size: 42px;
}
&-48{
font-size: 48px;
}
&-50{
font-size: 50px;
}
}
.mt-upper {
text-transform: uppercase;
}
.mt-lower {
text-transform: lowercase;
}
.mt-capit {
text-transform: capitalize;
}
.include-bg {
@include background();
}
/*----------------------------------------
Body Overlay
-----------------------------------------*/
.body-overlay {
background-color: var(--mt-common-black);
height: 100%;
width: 100%;
position: fixed;
top: 0;
z-index: 9999;
left: 0;
opacity: 0;
visibility: hidden;
@include transition(.3s);
&:hover {
cursor: url('../img/icon/cross-out.png'), pointer;
}
}
.body-overlay.opened {
opacity: .7;
visibility: visible;
}
/* dropcap */
.#{$theme-prifix}-dropcap {
&::first-letter {
font-size: 90px;
font-weight: 500;
float: left;
text-align: center;
color: var(--mt-common-black);
margin-right: 5px;
line-height: inherit;
text-transform: capitalize;
}
}
// for svg
// on hover stroke animation
// not checked
.class {
stroke-dasharray: 189px, 191px;
stroke-dashoffset: 0px;
}
/* gutter for x axis */
.mt-gx-20 {
--bs-gutter-x: 20px;
@media #{$lg} {
--bs-gutter-x: 20px;
}
@media #{$md} {
--bs-gutter-x: 20px;
}
@media #{$sm} {
--bs-gutter-x: 15px;
}
@media #{$xs} {
--bs-gutter-x: 10px;
}
& [class*="col-"] {
padding-right: calc(var(--bs-gutter-x) * .5);
padding-left: calc(var(--bs-gutter-x) * .5);
margin-top: var(--bs-gutter-y);
}
}
/* gutter for x axis */
.mt-gx-30 {
--bs-gutter-x: 30px;
@media #{$lg} {
--bs-gutter-x: 30px;
}
@media #{$md} {
--bs-gutter-x: 30px;
}
@media #{$sm} {
--bs-gutter-x: 15px;
}
@media #{$xs} {
--bs-gutter-x: 10px;
}
& [class*="col-"] {
padding-right: calc(var(--bs-gutter-x) * .5);
padding-left: calc(var(--bs-gutter-x) * .5);
margin-top: var(--bs-gutter-y);
}
}
/* gutter for x axis */
.mt-gx-40 {
--bs-gutter-x: 40px;
@media #{$lg} {
--bs-gutter-x: 40px;
}
@media #{$md} {
--bs-gutter-x: 30px;
}
@media #{$sm} {
--bs-gutter-x: 30px;
}
@media #{$xs} {
--bs-gutter-x: 15px;
}
& [class*="col-"] {
padding-right: calc(var(--bs-gutter-x) * .5);
padding-left: calc(var(--bs-gutter-x) * .5);
margin-top: var(--bs-gutter-y);
}
}
@media (min-width: 1400px) {
.container-large {
max-width: 1325px;
}
}
.mt-slide-transtion {
-webkit-transition-timing-function: linear !important;
transition-timing-function: linear !important;
}
.mt-brand-slide-element {
width: auto !important;
display: inline-block;
}