/* Grid

Purple

PANTONE® 269 C
RGB: 79, 38, 131
HTML: #4F2683 (Lighter Shade - #8546C2) (Darker Shade- #271241)
CMYK: 82, 100, 00, 12

Gold

PANTONE® 1235 C
RGB: 255, 198, 47
HTML: #FFC62F
CMYK: 00, 23, 91, 00

================================================== */
.container {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.col, .cols {
    width: 100%;
    float: left;
    box-sizing: border-box;
}

/* For devices larger than 400px */
@media (min-width: 400px) {
    .container {
        width: 85%;
        padding: 0;
    }
}

/* For devices larger than 800px */
@media (min-width: 800px) {
    .container {
        width: 80%;
    }

    .col, .cols {
        margin-left: 4%;
    }

    .col:first-child, .cols:first-child {
        margin-left: 0;
    }

    .one.col, .one.cols {
        width: 4.66666666667%;
    }

    .two.cols {
        width: 13.3333333333%;
    }

    .three.cols {
        width: 22%;
    }

    .four.cols {
        width: 30.6666666667%;
    }

    .five.cols {
        width: 39.3333333333%;
    }

    .six.cols {
        width: 48%;
    }

    .seven.cols {
        width: 56.6666666667%;
    }

    .eight.cols {
        width: 65.3333333333%;
    }

    .nine.cols {
        width: 74.0%;
    }

    .ten.cols {
        width: 82.6666666667%;
    }

    .eleven.cols {
        width: 91.3333333333%;
    }

    .twelve.cols {
        width: 100%;
        margin-left: 0;
    }

    .one-third.col {
        width: 30.6666666667%;
    }

    .two-thirds.col {
        width: 65.3333333333%;
    }

    .one-half.col {
        width: 48%;
    }/* Offsets */

    .offset-by-one.col, .offset-by-one.cols {
        margin-left: 8.66666666667%;
    }

    .offset-by-two.col, .offset-by-two.cols {
        margin-left: 17.3333333333%;
    }

    .offset-by-three.col, .offset-by-three.cols {
        margin-left: 26%;
    }

    .offset-by-four.col, .offset-by-four.cols {
        margin-left: 34.6666666667%;
    }

    .offset-by-five.col, .offset-by-five.cols {
        margin-left: 43.3333333333%;
    }

    .offset-by-six.col, .offset-by-six.cols {
        margin-left: 52%;
    }

    .offset-by-seven.col, .offset-by-seven.cols {
        margin-left: 60.6666666667%;
    }

    .offset-by-eight.col, .offset-by-eight.cols {
        margin-left: 69.3333333333%;
    }

    .offset-by-nine.col, .offset-by-nine.cols {
        margin-left: 78.0%;
    }

    .offset-by-ten.col, .offset-by-ten.cols {
        margin-left: 86.6666666667%;
    }

    .offset-by-eleven.col, .offset-by-eleven.cols {
        margin-left: 95.3333333333%;
    }

    .offset-by-one-third.col, .offset-by-one-third.cols {
        margin-left: 34.6666666667%;
    }

    .offset-by-two-thirds.col, .offset-by-two-thirds.cols {
        margin-left: 69.3333333333%;
    }

    .offset-by-one-half.col, .offset-by-one-half.cols {
        margin-left: 52%;
    }
}

/* Base Styles
================================================== */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
    font-size: 62.5%;
}

var {
    font-style: normal;
}

body {
    font-size: 1.7em;
    /* currently ems cause chrome bug misinterpreting rems on body element */
    line-height: 1.4;
    font-weight: 400;
    color: #1e1d22;
    font-family: poppins, sans-serif;
}

body.mceContentBody, .mceContentBody table, .mceContentBody td {
    font-size: 17px;
}

.mceContentBody {
    margin: 5px;
    background-image: none;
    background-color: #fff
}

p {
    margin: 0;
    margin-bottom: 2rem;
}

/* Typography
================================================== */
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    margin-bottom: 2rem;
    font-weight: 600;
    line-height: 1.1;
    color: #271241;
    ;
}

h1.pagename {
    margin-bottom: 4rem;
    font-size: 4rem;
    font-weight: 300;
}

h1 {
    font-size: 3rem;
}

h2 {
    font-size: 3rem;
}

h3 {
    font-size: 2.5rem;
}

h4 {
    font-size: 2.5rem;
    color: #4F2683;
    margin-bottom: 1rem;
}

h5 {
    font-size: 2rem;
    color: #4F2683;
    margin-bottom: 1rem;
}

h6 {
    font-size: 2rem;
    color: #4F2683;
    margin-bottom: 1rem;
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 800px) {
    h1.pagename {
        margin-bottom: 4rem;
        font-size: 5rem;
        font-weight: 300;
    }

    h1 {
        font-size: 5rem;
    }

    h2 {
        font-size: 3.5rem;
    }

    h3 {
        font-size: 3rem;
    }

    h4 {
        font-size: 2.5rem;
    }

    h5 {
        font-size: 2rem;
    }

    h6 {
        font-size: 1.7rem;
    }
}

/* Links
================================================== */
a {
    text-decoration: none;
    color: #4F2683;
}

a:hover {
    color: #4F2683;
    text-decoration: underline;
}

/* Buttons
================================================== */
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
    display: inline-block;
    padding: 1rem 2rem;
    background: #FFC62F;
    border: 2px solid #FFC62F;
    color: #271241;
    line-height: 1;
    font-size: 1.65rem;
    height: 4rem;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    text-transform: uppercase;
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
    transition: all ease 0.3s;
    text-shadow: none;
    border-radius: .5rem;
}

.button-lg {
    padding: 2rem 4rem;
    height: auto;
}

.button:hover, a.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .button:focus, button:focus, input[type="submit"]:focus, input[type="reset"]:focus, input[type="button"]:focus {
    outline: 0;
    background: none;
    color: #320870;
    border: 2px solid #320870;
    text-decoration: none;
}

/* Forms
================================================== */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="date"], input[type="password"], textarea, select {
    padding: .4rem 1rem;
    margin: 0;
    background-color: #fff;
    box-shadow: none;
    box-sizing: border-box;
    color: #320870;
    line-height: 1;
    height: 4rem;
    width: auto;
    max-width: 100%;
    border-radius: .5rem;
    border: 2px solid #DCD4E6;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -ms-appearance: none;
    transition: border ease 0.3s;
}

/* Removes awkward default styles on some inputs for iOS */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

textarea {
    min-height: 65px;
    padding-top: 6px;
    padding-bottom: 6px;
}

input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
    border: 2px solid #4F2683;
    outline: 0;
}

::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #DCD4E6;
}

::-moz-placeholder {
    /* Firefox 19+ */
    color: #DCD4E6;
}

::-ms-input-placeholder {
    /* IE 10+ */
    color: #DCD4E6;
}

::-moz-placeholder {
    /* Firefox 18- */
    color: #DCD4E6;
}

label, legend {
    display: block;
}

fieldset {
    padding: 0;
    border-width: 0;
}

input[type="checkbox"], input[type="radio"] {
    display: inline;
}

label > .label-body {
    display: inline-block;
    margin-left: .5rem;
    font-weight: normal;
}

/* Contact Forms, Error Styles */
.form-general {
    border: 2px solid #4F2683;
    padding: 2rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
    max-width: 600px;
}

.form-general .fc-error {
    border: 0;
    margin: 0;
    padding: 1rem 0rem;
    display: block;
    background: none;
}

.form-general .fc-error p {
    margin: 0px;
    color: #cc0000;
    line-height: 1;
}

.form-general ul {
    padding: 0;
    margin: 0;
    margin-bottom: 2rem;
}

.form-general li {
    padding: 0;
    margin: 0;
    list-style: none;
}

.form-general input[type=text], .form-general input[type=email], .form-general input[type=tel], .form-general input[type=date], .form-general select, .form-general textarea {
    width: 100%;
    max-width: 600px;
    margin-bottom: 0rem;
}

.form-general .check-input {
    display: flex;
    flex-wrap: nowrap;
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-general input[type=checkbox] {
    margin: 0;
    margin-right: .5rem;
    margin-top: 5px;
}

.form-general .check-input label {
    flex: 2;
}

.form-general input[type=submit] {
    margin-top: 3rem;
    margin-bottom: 0;
}

/* Lists
================================================== */
ul, ol {
    margin: 0;
    padding: 0;
    margin-bottom: 2rem;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

ol {
    list-style: decimal;
    margin: 0;
    padding: 0;
    margin-left: 2rem;
}

.main li, .mceContentBody li {
    margin-bottom: 0;
    padding: 1rem 0;
    border-bottom: 2px solid #E4DDF1;
    position: relative;
}

/* Code
================================================== */
code {
    padding: .2rem .5rem;
    margin: 0 .2rem;
    font-size: 90%;
    white-space: nowrap;
    background: #F1F1F1;
    border: 1px solid #E1E1E1;
    border-radius: 4px;
}

pre > code {
    display: block;
    padding: 1rem 1.5rem;
    white-space: pre;
}

/* Tables
================================================== */
th, td {
    padding: 5px 15px;
    text-align: left;
}

th:first-child, td:first-child {
    padding-left: 0;
}

th:last-child, td:last-child {
    padding-right: 0;
}

strong {
    font-weight: 600;
}

/* Spacing
================================================== */
button, .button {
    margin-bottom: 1rem;
}

input, textarea, select, fieldset {
    margin-bottom: 1.5rem;
}

pre, blockquote, dl, figure, table, p, ul, ol, form {
    margin-bottom: 2.5rem;
}

/* Smallerthan phablet (also point when grid becomes active) */
@media (max-width: 900px) {
    table td {
        display: block;
        width: 100% !important;
        padding: 0;
        margin: 0;
    }

    td input[type=text], table td select, table td textarea {
        display: block;
        width: 100%;
        margin: 0;
        box-sizing: border-box;
    }

    .content-wrap iframe {
        max-width: 100%;
    }
}

/* Utilities
================================================== */
.u-full-width {
    width: 100%;
    box-sizing: border-box;
}

.u-max-full-width {
    max-width: 100%;
    box-sizing: border-box;
}

.u-pull-right {
    float: right;
}

.u-pull-left {
    float: left;
}

img {
    width: auto;
    max-width: 100%;
}

/* Misc
================================================== */
hr {
    margin-top: 3rem;
    margin-bottom: 3.5rem;
    border-width: 0;
    border-top: 1px solid #CECFCF;
}

/* Slider Fix for Chrome */
.owl-carousel .owl-wrapper, .owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}

.fc-tbx table td {
    margin: 0;
    padding: 0;
    border: 0;
}

.jarallax {
    position: relative;
    z-index: 0;
}

.jarallax > .jarallax-img {
    position: absolute;
    object-fit: cover;
    /* support for plugin https://github.com/bfred-it/object-fit-images */
    font-family: 'object-fit: cover;';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.video-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
    border-radius: 1rem;
}

.video-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    border-radius: 1rem;
}

/* Clearing
================================================== */
/* Self Clearing Goodness */
.container:after, .clearfix:after, .row:after, .u-cf {
    content: "";
    display: table;
    clear: both;
}

/* Media Queries
================================================== */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
/* Larger than mobile */
@media (min-width: 400px) {
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 800px) {
}

/* Larger than desktop */
@media (min-width: 1000px) {
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
}

