/*
Theme Name: Understrap
Theme URI: https://understrap.com
Author: Howard Development &amp; Consulting
Author URI: https://howarddc.com
GitHub Theme URI: https://github.com/understrap/understrap
Description: The renowned WordPress starter theme framework that combined Underscores and Bootstrap. Trusted by more than 100,000 developers for building handcrafted, custom WordPress sites.
Version: 1.1.0
Requires at least: 5.0
Tested up to: 5.8.1
Requires PHP: 5.2
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: understrap
Tags: one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, theme-options, translation-ready, block-styles, wide-blocks, editor-style, threaded-comments, accessibility-ready

Understrap WordPress Theme, (C) 2021 Howard Development & Consulting, LLC
Understrap is distributed under the terms of the GNU GPL.

Resource Licenses:
Understrap is based on Underscores https://underscores.me/, (C) Automattic, Inc.
Font Awesome: https://fontawesome.com/v4.7/license/ (Font: SIL OFL 1.1, (S)CSS: MIT)
Bootstrap: https://getbootstrap.com | https://github.com/twbs/bootstrap/blob/master/LICENSE (MIT)
WP Bootstrap Navwalker by Edward McIntyre & William Patton: https://github.com/twittem/wp-bootstrap-navwalker (GNU GPLv3)
*/

/*
Do not modify the parent Understrap theme. Instead, download a copy of the Understrap Child starter theme and do all your development within the child theme.
Full developer documentation: https://docs.understrap.com
*/

html {
  scroll-behavior: smooth;
  scroll-margin: 100px;
}

body {
  --primary-light-var-1: #f2fbff;
  --primary-light-var-2: #61c8f0;
  --primary: #005c81;
  --primary-dark-var-1: #003348;
  --primary-dark-var-2: #001d29;

  --secondary-light-var-1: #fffaeb;
  --secondary-light-var-2: #ffeb85;
  --secondary: #ffd500;
  --secondary-dark-var-1: #a3842e;
  --secondary-dark-var-2: #524010;
}

/* TITLE FONT SIZE */

/* I'm obliged to make !important because the default style elementor overwrite those styles */
h1 {
  font-size: 48px !important;
}

h2 {
  font-size: 36px !important;
}

h3 {
  font-size: 28px !important;
}

h4 {
  font-size: 20px !important;
}

/* Tablet */
@media screen and (max-width: 768px) {
  h1 {
    font-size: 48px !important;
  }

  h2 {
    font-size: 38px !important;
  }

  h3 {
    font-size: 28px !important;
  }

  h4 {
    font-size: 22px !important;
  }
}
@media screen and (max-width: 768px) and (orientation: landscape) {
  h1 {
    font-size: 48px !important;
  }

  h2 {
    font-size: 38px !important;
  }

  h3 {
    font-size: 28px !important;
  }

  h4 {
    font-size: 22px !important;
  }
}

/* Mobile */
@media screen and (max-width: 576px) {
  h1 {
    font-size: 36px !important;
  }

  h2 {
    font-size: 28px !important;
  }

  h3 {
    font-size: 22px !important;
  }

  h4 {
    font-size: 18px !important;
  }
}
@media screen and (max-width: 576px) and (orientation: landscape) {
  h1 {
    font-size: 36px !important;
  }

  h2 {
    font-size: 28px !important;
  }

  h3 {
    font-size: 22px !important;
  }

  h4 {
    font-size: 18px !important;
  }
}

/* TITLE FONT SIZE END */

p,
li > span {
  font-size: 16px !important;
}

/* GLOBAL FONT FAMILY */
@font-face {
  font-family: Aleo;
  src: url('fonts/aleo/Aleo-Regular.ttf');
}

h1,
h2,
h3,
h4 {
  font-family: Aleo !important;
  font-weight: 600 !important;
}

@font-face {
  font-family: DM-sans;
  src: url('fonts/dm-sans/DMSans-Regular.ttf');
}

p,
li > span {
  font-family: DM-sans !important;
}
a[role='button'] span {
  font-family: DM-sans !important;
}

/* GLOBAL FONT FAMILY END */
