/**
 * @file
 * base
 * Base styles for the entire site
 * 
 * -------------------------------------------------
 * Updated: Alberni Design Jr - 2019-03-04
 * 
 * Attached thru `.info.yml`
 *
 ============================================================================ */           

/*=======================================
   Global
  =======================================*/

*, :before, :after {
  padding: 0;
  margin: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*=======================================
   Elements
  =======================================*/

/*----------------------------
   Form Elements
  ----------------------------*/

/* Input
----------------*/

input {
  border-radius: 0; /* Sarfari issue */
  font-size: 1em;
}

/*----------------------------
   Links (has classes)
  ----------------------------*/
a {
  color: #3d86c5;
  text-decoration: none;
  -webkit-transition: all .4s;
  transition: all .4s;
  display: inline-block;
  vertical-align: bottom;
}

#main-content {  display: inline;  } /* For "display:inline-block" above */

a:hover {
  color: inherit;
  opacity: .7;
  text-decoration: none;
}

/* Shorthand classes */
.no-fade a:hover {  opacity: 1;  }

.links-inherit a {  color: inherit;  }

/*----------------------------
   Headers
  ----------------------------*/
h2, h3, h4 {
  margin: 1em 0 .5em;
}

h1 {
    font: 400 2.5em/1.2 'Lato', Helvetica, sans-serif;
    margin: 1em 0 0 0;
}

h2 {
  font: 500 1.9em/1.2 'Lato', Helvetica, sans-serif;
  color: #333;
}

h3 {
  font: 500 1.5em/1.5 'Lato', Helvetica, sans-serif;
}

h4 {
  font: 500 1.2em 'Lato', Helvetica, sans-serif;
}

.no-top-margin {  margin-top: 0;  }

.no-margin {  margin: 0;  }

/*----------------------------
   Misc 
  ----------------------------*/

/* Main: IE issue
----------------*/
main, aside, footer {
  display: block;
}

/* Figure
----------------*/
figure {
  margin: 0;
}

/* Lists
----------------*/
ol, ul {
  margin: 0 0 1em;
}

/* Paragraphs
----------------*/
p {  margin: 0 0 1em;  }

/*=======================================
   Shorthand clases
  =======================================*/

/*----------------------------
   Forms
  ----------------------------*/
.form--inline {
  float: left;
}

.form-item--comfy input,
.form-item--comfy button {
  padding: .5em .7em;
  border-radius: .15em;
  width: 100%;
}

/*----------------------------
   Image Content
  ----------------------------*/
.img-content {
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.img-content__img {
  line-height: 0;
  background: #333;
}

.img-content__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .35;
  z-index: 10;
}

.img-content__content {
  position: absolute;
  z-index: 20;
}

/*----------------------------
   Menu
  ----------------------------*/
.menu {
  margin: 0;
  list-style: none;
}

/* Inline
----------------*/
ul.inline,
.menu {
  list-style: none;
}

ul.inline li,
.menu li {
  display: inline-block;
  vertical-align: middle;
}

ul.inline a,
.menu a {  color: inherit;  }