/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/

/* Helper Classes */
* Layout Helpers */ 
:root {
  --spacer-sm: .5rem;
  --spacer-md: 1rem;
  --spacer-lg: 2rem;
  --spacer-xl: 2.5rem;
}

/* Spacing */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: var(--spacer-sm)!important; }
.mt-2 { margin-top: var(--spacer-md)!important; }
.mt-3 { margin-top: var(--spacer-lg)!important; }
.mt-4 { margin-top: var(--spacer-xl)!important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: var(--spacer-sm)!important; }
.mr-2 { margin-right: var(--spacer-md)!important; }
.mr-3 { margin-right: var(--spacer-lg)!important;; }

.mb-0 { margin-bottom: 0!important; }
.mb-1 { margin-bottom: var(--spacer-sm)!important; }
.mb-2 { margin-bottom: var(--spacer-md)!important; }
.mb-3 { margin-bottom: var(--spacer-lg)!important; }
.mb-4 { margin-bottom: var(--spacer-xl)!important; }

.ml-0 { margin-left: 0!important; }
.ml-1 { margin-left: var(--spacer-sm)!important; }
.ml-2 { margin-left: var(--spacer-md)!important; }
.ml-3 { margin-left: var(--spacer-lg)!important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: var(--spacer-sm)!important; }
.pt-2 { padding-top: var(--spacer-med)!important; }
.pt-3 { padding-top: var(--spacer-lg)!important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: var(--spacer-sm)!important; }

.pb-0 { padding-bottom: 0!important; }
.pb-1 { padding-bottom: var(--spacer-sm)!important; }

.pl-0 { padding-left: 0!important; }
.pl-1 { padding-left: var(--spacer-sm)!important; }

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
.has-small-font-size { font-size: 12px!important; }

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/

.entry-content > .alignwide { max-width: 1100px; }
.entry-content > .alignfull { max-width: 100%; }

.entry-content ul,
.entry-content ol {
  margin: 1.5em auto;
  max-width: 636px;
  list-style-position: outside;
}

.wp-block-cover { min-height: 95vh; height: 100%; margin:0; }

.wp-block-image img { display: block;  }
.wp-block-video video { max-width: 640px; }

.wp-block-image.alignleft,
.wp-block-image.alignright {
  width: 100%
}

.wp-block-image.alignfull img { width: 100vw; }

.wp-block-gallery:not(.components-placeholder) { margin: 1.5em auto; }

.wp-block-cover-text p { padding: 1.5em 14px; }

ul.wp-block-latest-posts.alignwide,
ul.wp-block-latest-posts.alignfull,
ul.wp-block-latest-posts.is-grid.alignwide,
ul.wp-block-latest-posts.is-grid.alignwide {
  padding: 0 14px;
}

.wp-block-table { display: block; overflow-x: auto; }
.wp-block-table table { border-collapse: collapse; width: 100% }
.wp-block-table td, 
.wp-block-table th { 
	padding: .5em; 
}

.entry-content li {
  margin-left: 2.5em;
  margin-bottom: 6px;
}

.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
  margin: 0 auto;
}

.entry-content ul ul li,
.entry-content ol ol li,
.entry-content ul ol li,
.entry-content ol ul li {
  margin-left: 0;
}


.wp-block-embed.type-video > .wp-block-embed__wrapper {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}

.wp-block-embed.type-video > .wp-block-embed__wrapper > iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.wp-block-quote.is-large { margin: 0 auto 16px; }

.wp-block-pullquote>p:first-child { margin-top: 0; }

.wp-block-separator { margin: 3em auto;padding: 0; }

.more-link { display: block; }

.wp-block-group > * {
  max-width: 610px;
  margin-left: auto;
  margin-right: auto;
}

.wp-block-group > .alignwide {
  max-width: 1100px;
}

.wp-block-group > .alignfull {
  max-width: 100%;
}

.wp-block-group.has-background > .alignfull {
  width: calc( 100% + 60px );
  max-width: calc( 100% + 60px );
  position: relative;
  left: -30px;
}

@media screen and (min-width: 768px) {
  .wp-block-cover-text p {
    padding: 1.5em 0;
  }

  .entry-content > * {
    padding-left: 0px;
    padding-right: 0px;
  }

}

/*--------------------------------------------------------------
# Extend Gutenberg Columns w/ custom classes
--------------------------------------------------------------*/

/* Layout Helpers */ 
:root {
  --spacer-sm: .5rem;
  --spacer-md: 1rem;
  --spacer-lg: 2rem;
  --spacer-xl: 2.5rem;
}

/* Spacing */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: var(--spacer-sm)!important; }
.mt-2 { margin-top: var(--spacer-md)!important; }
.mt-3 { margin-top: var(--spacer-lg)!important; }
.mt-4 { margin-top: var(--spacer-xl)!important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: var(--spacer-sm)!important; }
.mr-2 { margin-right: var(--spacer-md)!important; }
.mr-3 { margin-right: var(--spacer-lg)!important;; }

.mb-0 { margin-bottom: 0!important; }
.mb-1 { margin-bottom: var(--spacer-sm)!important; }
.mb-2 { margin-bottom: var(--spacer-md)!important; }
.mb-3 { margin-bottom: var(--spacer-lg)!important; }
.mb-4 { margin-bottom: var(--spacer-xl)!important; }

.ml-0 { margin-left: 0!important; }
.ml-1 { margin-left: var(--spacer-sm)!important; }
.ml-2 { margin-left: var(--spacer-md)!important; }
.ml-3 { margin-left: var(--spacer-lg)!important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: var(--spacer-sm)!important; }
.pt-2 { padding-top: var(--spacer-med)!important; }
.pt-3 { padding-top: var(--spacer-lg)!important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: var(--spacer-sm)!important; }
.pr-2 { padding-right: var(--spacer-med)!important; }
.pr-3 { padding-right: var(--spacer-lg)!important; }

.pb-0 { padding-bottom: 0!important; }
.pb-1 { padding-bottom: var(--spacer-sm)!important; }
.pb-2 { padding-bottom: var(--spacer-med)!important; }
.pb-3 { padding-bottom: var(--spacer-lg)!important; }

.pl-0 { padding-left: 0!important; }
.pl-1 { padding-left: var(--spacer-sm)!important; }
.pl-2 { padding-left: var(--spacer-med)!important; }
.pl-3 { padding-left: var(--spacer-lg)!important; }

/* Layout */
.one-col-centered { max-width: 800px; margin: auto; }

.has-2-columns,
.has-3-columns,
.has-4-columns,
.has-5-columns,
.has-6-columns {
  display: grid; grid-gap: 20px; margin: auto;
}

.has-2-columns { grid-template-columns: 1fr 1fr; }
.has-3-columns { grid-template-columns: 1fr 1fr 1fr; }
.has-4-columns { grid-template-columns: 1fr 1fr 1fr 1fr; }
.has-5-columns { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
.has-6-columns { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }

.has-2-columns figure { margin: 0; }
.has-2-columns .wp-block-column { margin: 0; }

.wp-block-columns { display: grid; grid-gap: 30px; margin: auto; }
.wp-block-columns.two-thirds-layout { grid-template-columns: repeat(6,1fr); }
.wp-block-columns.two-thirds-layout .wp-block-column:first-child { grid-column: 1/5; }
.wp-block-columns.two-thirds-layout .wp-block-column:last-child { grid-column: 5 / 7; }
.wp-block-columns.two-thirds-layout .wp-block-column:not(:first-child) { margin-left: 0; }

@media screen and (max-width: 960px) {
  .has-5-columns,
  .has-6-columns { 
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 800px) {
  .has-3-columns { grid-template-columns: 1fr!important; }  
  .has-4-columns { grid-template-columns: 1fr 1fr!important; }  
  
  #page .wp-block-columns.one-third-layout .wp-block-column,
  #page .wp-block-columns.two-thirds-layout .wp-block-column { 
     grid-column: 1;
  }
  #page .wp-block-columns.two-thirds-layout { grid-template-columns: inherit; }

  .wp-block-columns .wp-block-column { flex-basis: 100%!important; margin-left: 0; }
}

@media screen and (max-width: 600px) {
  .has-2-columns,
  .has-4-columns { 
    grid-template-columns: 1fr!important; 
  }
} 

/*--------------------------------------------------------------
# Block Color Palette Colors
--------------------------------------------------------------*/

.has-strong-blue-color { color: #052935; }
.has-strong-blue-background-color { background-color: #052935; }

.has-lighter-blue-color { color: #095169; }
.has-lighter-blue-background-color { background-color: #095169; }

.has-very-light-gray-color { color: #5F7077; }
.has-very-light-gray-background-color { background-color: #5F7077; }


