/*
Import typefaces
*/
@font-face {
    font-family: Suisse-Intl-Regular;
    src: url('../fonts/SuisseIntl-Regular.otf');
    font-weight: 400
}

@font-face {
    font-family: Suisse-Intl-Light;
    src: url('../fonts/SuisseIntl-Light.otf');
    font-weight: 300
}


/* 
Typography
*/
.type--caption {
    font-family: Suisse-Intl-Regular, Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 0.8rem;
    letter-spacing: .001em;
    line-height: 120%;
    max-width: 800px;
}

.type--body {
    font-family: Suisse-Intl-Regular, Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 1rem;
    letter-spacing: -.015em;
    line-height: 123%;
    max-width: 800px;
}

.type--headline {
    font-family: Suisse-Intl-Light, Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 1.5rem;
    letter-spacing: -.01em;
    line-height: 112%;
    max-width: 1400px;
}

.type--display {
    font-family: Suisse-Intl-Light, Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 2rem;
    letter-spacing: -.02em;
    line-height: 107%;
    max-width: 1800px;
}

/* 
Text Style 
*/
.text--uppercase {
	text-transform: uppercase;
}
.text--lowercase {
	text-transform: lowercase;
}
.text--italic {
	font-style: italic;
}
.text--align-left {
	text-align: left;
}
.text--align-center {
	text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.text--align-right {
	text-align: right;
}

.text--fit {
    line-height: 1em;
}

.text--white {
    color: var(--color-white) !important;
}
.text--gray {
    color: var(--color-gray) !important;
}
.text--blue {
    color: var(--color-blue) !important;
}



/* TABLET */
@media only screen and (min-width: 720px) {
    .type--headline {
        font-size: 2rem;
        letter-spacing: -.02em;
    }

    .type--display {
        font-size: 2.5rem;
        line-height: 105%;
        letter-spacing: -.02em;
    }
}


/* DESKTOP LARGE */
@media only screen and (min-width: 1760px) {
    .type--display {
        font-size: 3rem;
    }
}