/*@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --primary: #1A5C91;
    --secondary: #F06752;
    --primary-dark: #000066;
    --primary-mid: #2876B8;
    --primary-light: #00CCFF;
    --gray-dark: #262F37;
    --gray-mid: #767F87;
    --gray-light: #E6EFF7;
    --white: #FFFFFF;
    --breakpoint: 100%;
    --safe-width: calc(var(--breakpoint) - 3rem);
}

@media screen and (min-width: 576px) {
    :root {
        --breakpoint: 576px;
    }
}

@media screen and (min-width: 576px) {
    :root {
        --breakpoint: 576px;
    }
}

@media screen and (min-width: 768px) {
    :root {
        --breakpoint: 768px;
    }
}

@media screen and (min-width: 992px) {
    :root {
        --breakpoint: 992px;
    }
}

@media screen and (min-width: 1200px) {
    :root {
        --breakpoint: 1200px;
    }
}

@media screen and (min-width: 1400px) {
    :root {
        --breakpoint: 1400px;
    }
}

* {
    all: none;
    border: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    transition: all .1s ease-in-out;
}

html {
    /*font-family: 'Source Sans Pro', sans-serif;
    font-family: 'Montserrat', sans-serif;*/
	font-family: 'Poppins', sans-serif;
    scroll-behavior: smooth;
}

/* DISPLAY TYPES */

    .flex {
        display: flex;
        flex-wrap: wrap;
    }

    @media screen and (min-width: 768px) {
        .flex {
            flex-wrap: nowrap;
        }
    }

    .flex-wrap {
        flex-wrap: wrap;
    }


    .flex-x-pos-center { justify-content: center; }
    .flex-x-pos-left { justify-content: left; }
    .flex-x-pos-right { justify-content: right; }
    .flex-y-pos-center { align-items: center; }
    .flex-y-pos-top { align-items: flex-start; }
    .flex-y-pos-bottom { align-items: flex-end; }

    .grid {
        display: grid;
    }
	
	.block {
        display: block;
    }
	
	.inline-block {
        display: inline-block;
    }



/* TYPOGRAPHY */

    /* Font Size */
    .fsize-10 { font-size: 2.4rem; }
    .fsize-9 { font-size: 2.2rem; }
    .fsize-8 { font-size: 2rem; }
    .fsize-7 { font-size: 1.8rem; }
    .fsize-6 { font-size: 1.6rem; }
    .fsize-5 { font-size: 1.4rem; }
    .fsize-4 { font-size: 1.2rem; }
    .fsize-3 { font-size: 1rem; }
    .fsize-2 { font-size: .8rem; }
    .fsize-1 { font-size: .6rem; }

    /* Text Align */

    .talign-left { text-align: left; }
    .talign-center { text-align: center; }
    .talign-right { text-align: right; }
    .talign-justify { text-align: justify; }

    /* Font Color */
    .color-primary { color: var(--primary); }
    .color-primary-dark { color: var(--primary-dark); }
    .color-secondary { color: var(--secondary); }
    .color-gray-mid { color: var(--gray-mid); }
    .color-gray-dark { color: var(--gray-dark); }
    .color-white { color: var(--white); }

    /* Font Weight */
    .fweight-5 { font-weight: 900; }
    .fweight-4 { font-weight: 600; }
    .fweight-3 { font-weight: 400; }
    .fweight-2 { font-weight: 300; }
    .fweight-1 { font-weight: 100; }

    /* Line Height */
    .lheight-10 { line-height: 6.5rem; }
    .lheight-9 { line-height: 6rem; }
    .lheight-8 { line-height: 4.5rem; }
    .lheight-7 { line-height: 4rem; }
    .lheight-6 { line-height: 3.5rem; }
    .lheight-5 { line-height: 3rem; }
    .lheight-4 { line-height: 2.5rem; }
    .lheight-3 { line-height: 2rem; }
    .lheight-2 { line-height: 1.5rem; }
    .lheight-1 { line-height: 1rem; }

    /* Font Case */
    .uppercase { text-transform: uppercase; }
    .lowercase { text-transform: lowercase; }


    /* Link */
    a { display: inline-block; text-decoration: none; color: var(--primary-dark); }
    a:hover { color: var(--primary-light); }


/* SPACING */

    /* Padding */
        /* Equal */
        .p-10 { padding: 10rem; }
        .p-9 { padding: 9rem; }
        .p-8 { padding: 8rem; }
        .p-7 { padding: 7rem; }
        .p-6 { padding: 6rem; }
        .p-5 { padding: 5rem; }
        .p-4 { padding: 4rem; }
        .p-3 { padding: 3rem; }
        .p-2 { padding: 2rem; }
        .p-1 { padding: 1rem; }
        .p-0 { padding: 0rem; }

        /* Equal X */
        .px-10 { padding-left: 10rem; padding-right: 10rem; }
        .px-9 { padding-left: 9rem; padding-right: 9rem; }
        .px-8 { padding-left: 8rem; padding-right: 8rem; }
        .px-7 { padding-left: 7rem; padding-right: 7rem; }
        .px-6 { padding-left: 6rem; padding-right: 6rem; }
        .px-5 { padding-left: 5rem; padding-right: 5rem; }
        .px-4 { padding-left: 4rem; padding-right: 4rem; }
        .px-3 { padding-left: 3rem; padding-right: 3rem; }
        .px-2 { padding-left: 2rem; padding-right: 2rem; }
        .px-1 { padding-left: 1rem; padding-right: 1rem; }
        .px-0 { padding-left: 0rem; padding-right: 0rem; }

        /* Equal Y */
        .py-10 { padding-top: 10rem; padding-bottom: 10rem; }
        .py-9 { padding-top: 9rem; padding-bottom: 9rem; }
        .py-8 { padding-top: 8rem; padding-bottom: 8rem; }
        .py-7 { padding-top: 7rem; padding-bottom: 7rem; }
        .py-6 { padding-top: 6rem; padding-bottom: 6rem; }
        .py-5 { padding-top: 5rem; padding-bottom: 5rem; }
        .py-4 { padding-top: 4rem; padding-bottom: 4rem; }
        .py-3 { padding-top: 3rem; padding-bottom: 3rem; }
        .py-2 { padding-top: 2rem; padding-bottom: 2rem; }
        .py-1 { padding-top: 1rem; padding-bottom: 1rem; }
        .py-0 { padding-top: 0rem; padding-bottom: 0rem; }

        /* Top */
        .pt-10 { padding-top: 10rem; }
        .pt-5 { padding-top: 9rem; }
        .pt-8 { padding-top: 8rem; }
        .pt-7 { padding-top: 7rem; }
        .pt-6 { padding-top: 6rem; }
        .pt-5 { padding-top: 5rem; }
        .pt-4 { padding-top: 4rem; }
        .pt-3 { padding-top: 3rem; }
        .pt-2 { padding-top: 2rem; }
        .pt-1 { padding-top: 1rem; }
        .pt-0 { padding-top: 0rem; }

        /* Right */
        .pr-10 { padding-right: 10rem; }
        .pr-9 { padding-right: 9rem; }
        .pr-8 { padding-right: 8rem; }
        .pr-7 { padding-right: 7rem; }
        .pr-6 { padding-right: 6rem; }
        .pr-5 { padding-right: 5rem; }
        .pr-4 { padding-right: 4rem; }
        .pr-3 { padding-right: 3rem; }
        .pr-2 { padding-right: 2rem; }
        .pr-1 { padding-right: 1rem; }
        .pr-0 { padding-right: 0rem; }

        /* Bottom */
        .pb-10 { padding-bottom: 10rem; }
        .pb-9 { padding-bottom: 9rem; }
        .pb-8 { padding-bottom: 8rem; }
        .pb-7 { padding-bottom: 7rem; }
        .pb-6 { padding-bottom: 6rem; }
        .pb-5 { padding-bottom: 5rem; }
        .pb-4 { padding-bottom: 4rem; }
        .pb-3 { padding-bottom: 3rem; }
        .pb-2 { padding-bottom: 2rem; }
        .pb-1 { padding-bottom: 1rem; }
        .pb-0 { padding-bottom: 0rem; }
		.pb-100p { padding-bottom: 100%; }
		.pb-75p { padding-bottom: 75%; }
        .pb-50p { padding-bottom: 50%; }
		.pb-25p { padding-bottom: 25%; }
		.pb-10p { padding-bottom: 10%; }

        /* Left */
        .pl-10 { padding-left: 10rem; }
        .pl-9 { padding-left: 9rem; }
        .pl-8 { padding-left: 8rem; }
        .pl-7 { padding-left: 7rem; }
        .pl-6 { padding-left: 6rem; }
        .pl-5 { padding-left: 5rem; }
        .pl-4 { padding-left: 4rem; }
        .pl-3 { padding-left: 3rem; }
        .pl-2 { padding-left: 2rem; }
        .pl-1 { padding-left: 1rem; }
        .pl-0 { padding-left: 0rem; }

    /* Margin */
        /* Equal */
		.m-auto { margin: auto; }
        .m-5 { margin: 5rem; }
        .m-4 { margin: 4rem; }
        .m-3 { margin: 3rem; }
        .m-2 { margin: 2rem; }
        .m-1 { margin: 1rem; }
        .m-0 { margin: 0rem; }

        /* Top */
        .mt-5 { margin-top: 5rem; }
        .mt-4 { margin-top: 4rem; }
        .mt-3 { margin-top: 3rem; }
        .mt-2 { margin-top: 2rem; }
        .mt-1 { margin-top: 1rem; }
        .mt-0 { margin-top: 0rem; }

        /* Right */
        .mr-5 { margin-right: 5rem; }
        .mr-4 { margin-right: 4rem; }
        .mr-3 { margin-right: 3rem; }
        .mr-2 { margin-right: 2rem; }
        .mr-1 { margin-right: 1rem; }
        .mr-0 { margin-right: 0rem; }

        /* Bottom */
        .mb-5 { margin-bottom: 5rem; }
        .mb-4 { margin-bottom: 4rem; }
        .mb-3 { margin-bottom: 3rem; }
        .mb-2 { margin-bottom: 2rem; }
        .mb-1 { margin-bottom: 1rem; }
        .mb-0 { margin-bottom: 0rem; }

        /* Left */
        .ml-5 { margin-left: 5rem; }
        .ml-4 { margin-left: 4rem; }
        .ml-3 { margin-left: 3rem; }
        .ml-2 { margin-left: 2rem; }
        .ml-1 { margin-left: 1rem; }
        .ml-0 { margin-left: 0rem; }

    /* Border */
    .border { border: 1px solid var(--gray-dark); }
    .border-mid { border: 1px solid var(--gray-mid); }
    .border-light { border: 1px solid var(--gray-light); }
	.border-bottom-light { border-bottom: 1px solid var(--gray-light); }
	
	
	.bradius-5 { border-radius: 5rem; }
	.bradius-4 { border-radius: 4rem; }
	.bradius-3 { border-radius: 3rem; }
	.bradius-2 { border-radius: 2rem; }
	.bradius-1 { border-radius: 1rem; }

    /* Safe Content Width*/
    .safe-width { width: var(--safe-width); }


/* SIZING */
    .w100, .w75, .w66, .w50, .w33, .w25 { width: 100%; }

    @media screen and (min-width: 768px) {
        .w100 { width: 100%; }
		.w90 { width: 90%; }
		.w80 { width: 80%; }
        .w75 { width: 75%; }
        .w66 { width: calc(100% / 3 * 2); }
        .w50 { width: 50%; }
        .w33 { width: calc(100% / 3); }
        .w25 { width: 75%; }
    }

/* BACKGROUND */

    .bg-primary { background-color: var(--primary); }
	.bg-primary-dark { background-color: var(--primary-dark); }
	.bg-primary-mid { background-color: var(--primary-mid); }
	.bg-primary-light { background-color: var(--primary-light); }
    .bg-secondary { background-color: var(--secondary); }
    .bg-white { background-color: var(--white); }
    .bg-gray-dark { background-color: var(--gray-dark); }
    .bg-gray-mid { background-color: var(--gray-mid); }
    .bg-gray-light { background-color: var(--gray-light); }

    .bg-image_cover {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
	
/* FORM ELEMENTS */

	button {
		padding: 1rem 2rem;
		background-color: white;
		color: var(--primary);
		cursor: pointer;
	}



.always-on-top {
    z-index: 9998;
}

.super-top {
    z-index: 9999;
}