/*
 Theme Name:   UU theme (Twenty Nineteen Child)
 Description:  Twenty Nineteen -- Modified Child Theme
 Template:     twentynineteen
 Version:      1.0.0
 Text Domain:  twentynineteenchild
*/
/* 
	Q: Huh?
  A: Child themes are best practice for customizing a theme. More info
     https://developer.wordpress.org/themes/advanced-topics/child-themes/

================================================================================== */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital@1&display=swap');



/*--------------------------------------------------------------
## responsive, er... TEMP
--------------------------------------------------------------*/
html { font-size:100%; }






/*--------------------------------------------------------------
## RESET TF out of ( text & ??) spacing
## DONT USE THIS FOR STYLING STUFF
--------------------------------------------------------------*/

html { font-size: 16px }



/* Blocks */
/* !Block styles */
  .entry .entry-content > *,
  .entry .entry-summary > *,
  .entry .entry-summary > .wp-block-group > .wp-block-group__inner-container > *,
  .entry .entry-content > .wp-block-group > .wp-block-group__inner-container > * {
  margin: 24px 0;
  max-width: 100%;
}

@media only screen and (min-width: 768px) {
  .entry .entry-content > *,
  .entry .entry-summary > *,
  .entry .entry-summary > .wp-block-group > .wp-block-group__inner-container > *,
  .entry .entry-content > .wp-block-group > .wp-block-group__inner-container > * {
    margin: 24px 0;
    max-width: 100%;
  }
}

@media only screen and (min-width: 1168px) {
  .entry .entry-content > *,
  .entry .entry-summary > *,
  .entry .entry-summary > .wp-block-group > .wp-block-group__inner-container > *,
  .entry .entry-content > .wp-block-group > .wp-block-group__inner-container > * {
    max-width: 100%;
  }
}


.entry { margin: 0; }

.entry .entry-header {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .entry .entry-header {
    margin: 0 !important;
  }
}



.entry .entry-content,
.entry .entry-summary {
  max-width: 100% ;
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .entry .entry-content,
  .entry .entry-summary {
    max-width: 100%;
    margin: 0;
    padding: 0;
  }
}


/* entry-footer == post meta */
.entry .entry-footer {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .entry .entry-footer {
    margin: 0;
    max-width: 100%;
  }
}



/* Next/Previous navigation */
.post-navigation {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .post-navigation {
    margin: 0;
    max-width: 100% !important;
  }
}
@media only screen and (min-width: 1168px) {
  .post-navigation {
    margin: 0;
    max-width: 100% !important;
  }
}


/* Site footer */
#colophon .widget-area,
#colophon .site-info {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  #colophon .widget-area,
  #colophon .site-info {
    margin: 0;
  }
}


/* TODO separate out flexbox shit */
.post-navigation .nav-links {
  margin: 0 1rem;
  max-width: 100%;
  display: flex;
  flex-direction: row;
}
@media only screen and (min-width: 1168px) {
  .post-navigation .nav-links {
    flex-direction: row;
    margin: 0;
    max-width: 100%;
  }
}

.nav-next, .nav-previous { width: 45%; }


/*--------------------------------------------------------------
## TT actual layout desires
## OK YOU CAN USE THIS FOR STYLING STUFF
--------------------------------------------------------------*/

#primary {
  padding-left: 11px;
  padding-right: 11px;
  padding-bottom: 1.3rem;
  padding-top: 8px;
  margin: 0 auto 1rem;
}
@media screen and (min-width: 768px) {
  #primary { width: 747px; }
}

article,
.post-navigation { 
  padding: 1rem !important; 
  margin-bottom: .6rem !important;
}


/*--------------------------------------------------------------
## TT text styles & colors
--------------------------------------------------------------*/

a:hover { color: #FF0035 !important ; } /* u can kill, menu still workx */
h1.entry-title, h1 { color: #FF0035; font-size: 2rem; }
h2.entry-title, h2 { color: #004E00; font-size: 1.7rem;  }
h3, h4, strong, b { color: #4524D8; }
.entry-footer, .entry-footer a, .entry-footer a:visited { color: #2F616C !important; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.25rem; }
.post-title { color: #4524D8; }


/*--------- UU colors:
powder         #4524D8
watermelon     #FF0035
poblano        #004E00
lymon          #BFEE00
TT light blue  #2F616C
==== OTHER COLORS ====
bg light gray  #e7e7e7
links on TT    #0073aa
--------------------*/

/* gray & rounded corners...er, card shadows */
body { 
  background-color: #e7e7e7; 
  background-size: cover;
  background-repeat: no-repeat;
  baXXckground-position: left center;
  background-position: bottom;
  background-attachment: fixed;
}
article,
.post-navigation {   /* ==========X==x======X===x=====X==========Xx======x============= */
  background-color: white; 
  border: 1px solid #2F616C;
  box-shadow: -3px 3px #BBBBBB;
}

#primary { 
  background-color: #e7e7e7; 
}

#gray-column { background-color: #e7e7e7; }


img#TT-logo { width: 244px; height: 40px; }



.search .page-title {
  color: red !important; 
  font-size: 2em;
  font-style: italic;
  font-family: 'IBM Plex Serif', 'Bitter', serif;
}
.search .page-header .page-description {
  font-style: normal;
  font-weight: normal;
  font-size: .8em;
}

.search .page-header,
.error404 .page-header { 
  margin: 1rem;
}



blockquote {
  boCCCrder-left: 2px solid #0073aa;
  border-left-color: #BFEE00;
}



/* material design icon fonts */
/* usage:  <span class="material-icons">face</span>  */
.material-icons {
  color: #FF0035;
  font-size: 1em !important; 
}
/* for more advice on styling see  https://google.github.io/material-design-icons/#setup-method-2-self-hosting */
.material-icons.md-08 { font-size: 0.8em !important; }
.material-icons.md-12 { font-size: 1.2em !important; }
.material-icons.md-15 { font-size: 1.5em !important; }
.material-icons.md-20 { font-size: 2.0em !important; }


/*--------------------------------------------------------------
## Footer -- tightening up the bottom to just be a simple nav
--------------------------------------------------------------*/


/* stick footer to bottom */
body, html {
  height: 100%;
}
div#page { 
	margin: 0 auto;
	position: relative;	
	height: auto !important;
	min-height: 100%;
  height: 100%;
}
#content { padding-bottom: 149px; }

#colophon {
  position: absolute;
  bottom:0;
  width: 100%;
  /* center horiz */
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, 0)
}
@media only screen and (min-width: 768px) {
  #colophon { width: 747px; } 
}

aside.widget_area { margin: auto; }

#colophon .widget-column {
  display: block;
  flex-wrap: nowrap;
}



/* footer contents */
#colophon .widget-area,
#colophon .site-info {
  margin-top: 0; margin-bottom: 0; 
}

@media only screen and (min-width: 768px) {
  #colophon .widget-area,
  #colophon .site-info {
    margin-top: 0; margin-bottom: 0; 
  }
}

#comments { display: none; }

#colophon { background-color: #e7e7e7; } /* customize me */
#colophon .widget_nav_menu { margin-bottom: 0 }

/* make the list into a horizontal menu */
#colophon .widget-area ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
#colophon .widget-area li {
  float: left;
}
#colophon .widget-area li a {
  display: block;
  color: #2F616C;
  text-align: center;
  padding: 6px 16px;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
}
#colophon .widget-area li a:hover {
  color: #FF0035; /* customize me */
}
/* list fonts */
.widget_archive ul li,
.widget_categories ul li,
.widget_meta ul li,
.widget_nav_menu ul li,
.widget_pages ul li,
.widget_recent_comments ul li,
.widget_recent_entries ul li,
.widget_rss ul li {
  font-family: "Lato", "Droid Sans", "Helvetica Neue", sans-serif; /* customize me */
  font-size: 1em;
  font-weight: 400;
} 


/*--------------------------------------------------------------
## header
--------------------------------------------------------------*/
.site-branding-container { background-color: black; }
.site-header {
  padding: 0;
}
.site-branding-container img { /* TT logo */
  margin-top: 8px; 
  margin-left: 30px; 
}
@media screen and (max-width: 767px) {
  .site-branding-container img#TT-logo { display: none; }
}


/* not really using this...   */
@media only screen and (min-width: 768px) {
  .site-header {
    margin: 0;
    padding: 0;
  }
  .site-header.featured-image { 
    min-height: 100vh;
    margin-bottom: 3rem;
  }
}



/*--------------------------------------------------------------
## small misc - don't mind colors, i'm mostly turning shit off!
--------------------------------------------------------------*/

.entry .entry-title:before {
  background: #767676;
  content: "\020";
  display: none; /* turn it off */
  height: 2px;
  margin: 1rem 0;
  width: 1em;
}
span.cat-links,
header .entry-meta { display: none !important; }

/* don't use page title as header */
.page .entry-header {dispXXlay: none !important; } 

.page h2:before,
.page h1:before {display: none !important; } 


span.comments-link { display: none !important; }

/* == hi */




#colophon .widget-column .widget {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  width: 100%;
  word-wrap: break-word;
}

@media only screen and (min-width: 1168px) {
  #colophon .widget-column .widget {
    maSSSrgin-right: calc(3 * 1rem);
    wSSSidth: calc(50% - (3 * 1rem));
  }
}

#colophon .site-info {
  color: #767676;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  word-wrap: break-word;
}

#colophon .site-info a {
  color: inherit;
}

#colophon .site-info a:hover {
  text-decoration: none;
  color: #0073aa;
}

#colophon .site-info .imprint,
#colophon .site-info .privacy-policy-link {
  margin-right: 1rem;
}

/* Widgets */
.widget {
  margin: 0 0 1rem;
  /* Make sure select elements fit in widgets. */
}

.widget .widget-title {
  font-size: 1.6875em;
}

.widget select {
  max-width: 100%;
}

.widget a {
  color: #0073aa;
}

.widget a:hover {
  color: #005177;
}

.widget_archive ul,
.widget_categories ul,
.widget_meta ul,
.widget_nav_menu ul,
.widget_pages ul,
.widget_recent_comments ul,
.widget_recent_entries ul,
.widget_rss ul {
  padding: 0;
  list-style: none;
}

/* moved up */

.widget_archive ul ul,
.widget_categories ul ul,
.widget_meta ul ul,
.widget_nav_menu ul ul,
.widget_pages ul ul,
.widget_recent_comments ul ul,
.widget_recent_entries ul ul,
.widget_rss ul ul {
  counter-reset: submenu;
}

.widget_archive ul ul > li > a::before,
.widget_categories ul ul > li > a::before,
.widget_meta ul ul > li > a::before,
.widget_nav_menu ul ul > li > a::before,
.widget_pages ul ul > li > a::before,
.widget_recent_comments ul ul > li > a::before,
.widget_recent_entries ul ul > li > a::before,
.widget_rss ul ul > li > a::before {
  font-family: "NonBreakingSpaceOverride", "Hoefler Text", Garamond, "Times New Roman", serif;
  font-weight: normal;
  content: "– " counters(submenu, "– ", none);
  counter-increment: submenu;
}

.widget_tag_cloud .tagcloud {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-weight: 700;
}