/*
            WIDTHS
*/
.max-width { max-width: 192rem; }
.card-width { max-width: 75rem; }
.width-lg { max-width: 50%; }
.sc-size { max-width: 50%;}
.min-width-xxl { min-width: 100%; }
.width-25 { width: 25%; }
.stat-foot-width { max-width: 45rem; }


/*
            HEIGHTS
*/
.max-height { max-width: 180rem; }
.height-100 { height: 100%; }

/* 
            POSITIONS
*/
.position-relative { position: relative !important; }
.position-absolute { position: absolute !important; }
.overflow-hidden { overflow: hidden; }
.centerXY {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/*
            MARGINS
*/
.mr-auto,
.mx-auto { margin-right: auto; }
.ml-auto,
.mx-auto { margin-left: auto; }

.m-6 { margin: var(--distance-6); }
.m-15 { margin: var(--distance-15); }

.mt-0, .my-0 { margin-top: var(--distance-0); }
.mb-0, .my-0 { margin-bottom: var(--distance-0); } /* 0rem */
.mt-1, .my-1 { margin-top: var(--distance-1); }
.mb-1, .my-1 { margin-bottom: var(--distance-1); } /* .25rem */
.mt-2, .my-2 { margin-top: var(--distance-2); }
.mb-2, .my-2 { margin-bottom: var(--distance-2); } /* .5rem */
.mt-3, .my-3 { margin-top: var(--distance-3); }
.mb-3, .my-3 { margin-bottom: var(--distance-3); } /* .5rem */
.mt-4, .my-4 { margin-top: var(--distance-4); }
.mb-4, .my-4 { margin-bottom: var(--distance-4); } /* 1rem */
.mt-6, .my-6 { margin-top: var(--distance-6); }
.mb-6, .my-6 { margin-bottom: var(--distance-6); } /* 1.5rem */
.mt-8, .my-8 { margin-top: var(--distance-8); }
.mb-8, .my-8 { margin-bottom: var(--distance-8); } /* 2rem */
.mt-10, .my-10 { margin-top: var(--distance-10); }
.mb-10, .my-10 { margin-bottom: var(--distance-10); } /* 2.5rem */
.mt-12, .my-12 { margin-top: var(--distance-12); }
.mb-12, .my-12 { margin-bottom: var(--distance-12); } /* 3rem */
.mt-15, .my-15 { margin-top: var(--distance-15); }
.mb-15, .my-15 { margin-bottom: var(--distance-15); } /* 4rem */

.mr-2, .mx-2 { margin-right: var(--distance-2); }
.ml-2, .mx-2 { margin-left: var(--distance-2); }
.mr-4, .mx-4 { margin-right: var(--distance-4); }
.ml-4, .mx-4 { margin-left: var(--distance-4); }
.mr-6, .mx-6 { margin-right: var(--distance-6); }
.ml-6, .mx-6 { margin-left: var(--distance-6); }
.mr-8, .mx-8 { margin-right: var(--distance-8); }
.ml-8, .mx-8 { margin-left: var(--distance-8); }
.mr-10, .mx-10 { margin-right: var(--distance-10); }
.ml-10, .mx-10 { margin-left: var(--distance-10); }
.mr-15, .mx-15 { margin-right: var(--distance-15); }
.ml-15, .mx-15 { margin-left: var(--distance-15); }

.m--4 { margin-left: -10rem;}
.mb--2 { margin-bottom: -.2rem; }

/*
            PADDINGS
*/
.p-1 { padding: var(--distance-1); }
.p-2 { padding: var(--distance-2); }
.p-3 { padding: var(--distance-3); }
.p-4 { padding: var(--distance-4); }
.p-5 { padding: var(--distance-5); }
.p-6 { padding: var(--distance-6); }
.p-8 { padding: var(--distance-8); }
.p-10 { padding: var(--distance-10); }
.p-12 { padding: var(--distance-12); }
.p-15 { padding: var(--distance-15); }

.pr-4, .px-4 { padding-right: var(--distance-4); }
.pl-4, .px-4 { padding-left: var(--distance-4); }
.pr-6, .px-6 { padding-right: var(--distance-6); }
.pl-6, .px-6 { padding-left: var(--distance-6); }
.pr-12, .px-12 { padding-right: var(--distance-12); }
.pl-12, .px-12 { padding-left: var(--distance-12); }

.pt-2, .py-2 { padding-top: var(--distance-2); }
.pb-2, .py-2 { padding-bottom: var(--distance-2); }
.pt-4, .py-4 { padding-top: var(--distance-4); }
.pb-6, .py-6 { padding-bottom: var(--distance-6); }
.pt-6, .py-6 { padding-top: var(--distance-6); }
.pb-4, .py-4 { padding-bottom: var(--distance-4); }
.pt-8, .py-8 { padding-top: var(--distance-8); }
.pb-8, .py-8 { padding-bottom: var(--distance-8); }

/* 
            TYPOGRAPHY
 */
.text-decoration-none { text-decoration: none; }
.text-center { text-align: center; }
.text-uppercase { text-transform: uppercase; }
.text-bold { font-weight: bold; }

.text-size-xxs { font-size: var(--display-xxs); }
.text-size-xs { font-size: var(--display-xs); }
.text-size-sm { font-size: var(--display-sm); }
.text-size-md { font-size: var(--display-md); }
.text-size-lg { font-size: var(--display-lg); }
.text-size-xl { font-size: var(--display-xl); }
.text-size-xxl { font-size: var(--display-xxl); }

.lh-sm { line-height: var(--line-height-sm); }
.lh-md { line-height: var(--line-height-md); }
.lh-lg { line-height: var(--line-height-lg); }

/* 
            CIRCLE
 */
 .circle { border-radius: 100%; }
 .circle-lg { width: 15rem; height: 15rem; }

/* 
            SHADOWS
 */
 .shadow-sm { box-shadow: var(--shadow-small-light); }
 .shadow-lg { box-shadow: var(--shadow-large-light); }
 .text-shadow { text-shadow: var(--shadow-medium-dark); }
 .text-shadow-sm { text-shadow: var(--shadow-medium-light); }

/* 
            BUTTONS
*/
nav div a:not(:first-child) { margin-left: var(--distance-12);}
nav div a:hover div {
    background-color: #535353;
}
nav div a:hover div i {
    color: var(--color-warning);
}
.icon-badge {
    top: -8px;
    right: -8px;
    padding: var(--distance-1) var(--distance-3);
}
footer form button:hover {
    background-color: var(--color-warning);
}

/* 
            BORDERS
*/
.border-radius { border-radius: var(--border-radius-sm);}
.border-small-white { border: var(--border-xs-white); }
.border-bottom-xs { border-bottom: var(--border-xs);}
.border-sm { border: var(--border-sm); }
.border-lg { border: var(--border-lg); }
.border-transparent { border: var(--border-transparent); }

/* 
            COLORED BAR 
*/
.bar-height { height: 0.3rem; }

/*
            IMAGES
*/
.logo-width { max-width: 15rem; }
.gallery-img { width: 20rem;}
.stat-logo { max-width: 45rem;}
.logo-md-width { max-width: 25%; }
.logo-lg-width { max-width: 35%; }
.img-lg-width { max-width: 50%; }
.img-logo-md { bottom: 0;}
.slider-icon-sm { left: 1.5rem;}
.welcome-width { max-width: 35%; }
.bygg-mark-width { max-width: 30rem; }
.title-header {
    max-width: 35%;
}
.footer-logo { width: 30rem; margin-left: 10rem; }


/* SLIDER */
.slider-width { 
    width: 400%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: center;
}
.slider-container { max-height: 125rem; } /* Display 1 image at a time */
.slider-img { width: 100%; max-height: 125rem; min-height: 100rem; } /* img covers container */
.slider-content { width: 25%; }

.slider-animation { animation: 75s slider-keyframes infinite;}
@keyframes slider-keyframes {
    0%, 13% { left: 0% ; }
    15%, 28% { left: -100% ;}
    30%, 43% { left: -200% ;}
    45%, 58% { left: -300% ;}
    60%, 73% { left: -200% ;}
    75%, 88% { left: -100% ;}
    90%, 100% { left: 0% ; }
}

/* 
            FEATURES
*/
.f-width { max-width: 33%; }

/* 
            ICONS
*/
.icon-feature {
    width: 7.6rem;
    height: 7.6rem;
    padding: 0.375rem;
}
.icon-circle {
    width: 6.2rem;
    height: 6.2rem;
    line-height: 6rem;
}
.icon-form-control { right: 10px; top: 10px; }

/* 
            STATISTICS
*/
.statistics-image {
    background-image: url('../IMG/stats/bg.jpg');
    background-repeat: no-repeat; background-size: cover; background-position: center;
}

#drop-down {
    display: none;
}

#footer-link {
    scroll-behavior: smooth;
    transition: ease-in;
}

/* 
            HOLD
*/
.hold-top { top: 0; }
.hold-bottom { bottom: 0; }
.hold-left { left: 0; }
.hold-right { right: 0; }

/* 
            OPACITY
*/

.op-1 {
    opacity: .1;
}

.op-2 {
    opacity: .2;
}

.op-3 {
    opacity: .3;
}

.op-4 {
    opacity: .4;
}

.op-5 {
    opacity: .5;
}

.op-6 {
    opacity: .6;
}

.op-7 {
    opacity: .7;
}

.op-8 {
    opacity: .8;
}

.op-9 {
    opacity: .9;
}