/*
Theme Name: Opportunity Network
Theme URI: http://www.opportunitynetwork.org
Author: Constructive
Author URI: http://www.constructive.co
Version: 1.0
Template: constructive
*/

@import url('https://fonts.googleapis.com/css?family=Heebo:300,400,700,500,800,900&display=swap');
:root {
    --font_primaryFamily: Heebo, sans-serif;
    --font_primaryWeight: 400;
    --font_primaryLineHeight: 1.2;
    --font_primaryLineHeightBig: 1.5;

    --base-font-size: 1.2rem;
    --vr: 1.4rem;

    /* Type Scale */
    --typescale: 1.35;

    --type-preset-1: calc(1em * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-2: calc(1em * var(--typescale) * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-3: calc(1em * var(--typescale) * var(--typescale) * var(--typescale));
    --type-preset-4: calc(1em * var(--typescale) * var(--typescale));
    --type-preset-5: calc(1em * var(--typescale));
    --type-preset-6: 1em;
    --type-preset-7: calc(1em / var(--typescale));


    /* Containers */
    --nav-container: 1740px;
    --main-container: 1600px;
    --md-container: 970px;
    --sm-container: 770px;
    --x-sm-container: 570px;

    /* Colors */
    --sea: #49a2a4;
    --ugly-blue: #318082;
    --white: #ffffff;
    --white-two: #fefefe;
    --deep-orange: #e65100;
    --black: #000000;
    --battleship-grey: #667b82;
    --battleship-grey-50: rgba(102, 123, 130, .50);
    --battleship-grey-15: rgba(102, 123, 130, .15);
    --azure: #039be5;
    --cerulean: #0293d9;
    --yellow-orange: #ffb300;
    --quote-rule: #f8f6f4;
    --deep-orange-95: rgba(230, 81, 0, 0.95);
    --deep-orange-75: rgba(230, 81, 0, 0.50);
    --deep-orange-50: rgba(230, 81, 0, 0.50);
    --deep-orange-10: #fcede5;
    --sea-10: rgba(73, 162, 164, 0.10); /*#45a7a7*/
    --deep-orange-hover: #f27f00;
    --footer-links-color: #8ad0d2;
    --body-color: #32373c;
}

@media (min-width: 1210px) {
    :root {
        --typescale: 1.414;
        --base-font-size: 1.8rem;
    }
}

body {
    font-family: var(--font_primaryFamily);
    font-size: var(--base-font-size);
    overflow-x: hidden;
    line-height: var(--font_primaryLineHeightBig);
    color: var(--body-color);
}

.type-preset--1 { 
    font-size: var(--type-preset-1__fontSize); 
    line-height: var(--font_primaryLineHeight);

}
.type-preset--2 { 
    font-size: var(--type-preset-2__fontSize); 
    line-height: var(--font_primaryLineHeight);

}
.type-preset--3 { 
    font-size: var(--type-preset-3__fontSize); 
    line-height: var(--font_primaryLineHeight);

}
.type-preset--4 { 
    font-size: var(--type-preset-4__fontSize); 
    line-height: var(--font_primaryLineHeight);

}
.type-preset--5 { 
    font-size: var(--type-preset-5__fontSize); 
    line-height: var(--font_primaryLineHeightBig);

}
.type-preset--6 { 
    font-size: var(--type-preset-6__fontSize); 
    line-height: var(--font_primaryLineHeightBig);

}
.type-preset--7 { 
    font-size: var(--type-preset-7__fontSize); 
    line-height: var(--font_primaryLineHeightBig);

}

.uppercase {
    text-transform: uppercase;
}

.primary-line-height {
    line-height: var(--font_primaryLineHeight);
}

@media (min-width: 1000px) and (max-width: 1209px) {
    .row {
        max-width: 960px;
        margin: 0 auto;
    }
}

@media (min-width: 1210px) and (max-width: 1639px) {
    .row {
        max-width: 1170px;
        margin: 0 auto;
    }
}

@media (min-width: 1640px) {
    .row {
        max-width: 1600px;
        margin: 0 auto;
    }
}