:root {
    --white: #fff;
    --black: #000;
    --red: rgb(255, 0, 0);
    --dark-orange: rgb(255, 140, 0);
    --darker-orange: #EA4428;
    --grey: rgba(0, 0, 0, 0.3);
}

h1, h2, h3, h4, h5, h6  { font-family: Montserrat, sans-serif; }
h5 { font-size: 18px; }
h6 { color: #F8F8F8; }
sup { font-size: 0.6em; }

.dark-orange { color: var(--dark-orange) !important; }
.red { color: var(--red) !important; }

.quarter-width { width: 25%; }
.half-width { width: 50%; }
.three-quarter-width { width: 75%; }
.full-width { width: 100%; }
.full-height { height: 100%; }


.subtitle { font-size: 1.2em; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-uppercase { text-transform: uppercase; }

.text-red { color: var(--red) !important; }


.hero { background: url('/img/M-NAV-Color.jpg') no-repeat center center / cover; }

.download-app-text { margin-bottom: 30px; }
.download-app-text h6 {
    font-size: 32pt; 
    line-height: 50px;
    color: var(--white);
}

.panel-body ul { list-style: disc; }
.panel-title { background: url('/img/download-bg-small.jpg'); }
.panel-title a { font-size: 80%; }

#storytelling { background: url('/img/download-bg-AR-LaunchPad.jpg') center center; }
#project { background: url('/img/download-bg2.png') no-repeat center center; }

.info-block {
    margin-bottom: 10px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--grey);
}
.info-block h2 {
    text-transform: uppercase;
    font-size: 1.6em;
    font-weight: 600;
    margin: 0;
}
.info-block h3 { 
    font-size: 1.2em; 
    font-weight: 500;
}
.info-block ul {
    list-style: disc;
    list-style-position: inside;
    font-style: italic;
}
.info-block .btn {
    padding: 10px;
    text-align: center;
    border: 2px solid var(--red);
    border-radius: 10px;
    color: var(--red);
}

/* QUERIES */
    /* Phones and Lower Res Tablets */
    @media only screen and (max-width: 600px) {
        .info-block .col-xs-12 {
            margin-bottom: 20px;
        }
    }

    /* Tablet */
    @media only screen and (min-width: 601px) and (max-width: 1024px) {
        .pt-90 { padding-top: 150px; }
        .navbar-right { margin-right: 0px; }
    }