/*
* Slidetrack CSS V1.0.0
* Copyright 2019, Daniel Lathrop
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 1/1/2019
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Import Skeleton framework
- Override settings
- Custom settings
- Media queries
*/

/* My overrides of Skeleton styles
–––––––––––––––––––––––––––––––––––––––––––––––––– * /


/* My custom styling
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 body {
/* 
  // dark mode
  background-color: #323232;
  color: #569cd6;
 */
  background-color: ivory; /*  #FFFFF0 */
  color: #4F4F4F;  /* unnamed dark grey */
  font-family: 'Courier Prime Sans', 'Courier Prime', 'Courier New', Courier, monospace;

 }
 
.profilebot {
    background-color: #f5f5f5;;
    color: #37506A;
 }
 
 .profilebot h2 , .profilebot h4 {
    background-color: #f5f5f5;;
    color: #37506A;
 }
 
 .profilebot img.hero {
    width: 100%;
 
 }

 a {
   color:dodgerblue; /* #1E90FF */
 }

 a:hover {
   color: dodgerblue; /* #1E90FF */
   filter: brightness(90%);
 }


 footer {
   text-align: center;
   color: darkgrey;
   margin-top: 10rem;
   border-top: 0.5px lightslategray solid;
 }

 p + ul {
   margin-top: -2.5rem;
 }

 .chart {
   height: 400px;
 }

 h2.name {
  font-family: 'Courier Prime Sans', 'Courier Prime', 'Courier New', Courier, monospace;
   font-size: 3rem;
   margin-top: 15%;
   margin-bottom: 0rem;
   text-align: left;
   font-weight: bold;
 }

 dl {
   margin-top: 0rem;
 }

h5, h4 {
  margin-bottom: 0rem;
}

h1, h2, h3, h4, h5, h6 {
/*   color: #569cd6; */
/* color: CornflowerBlue; /* #6495ED  */ 
  color: #0f0f0f;
}

#sidebar p {
  color: lightslategray
}


/* mess with TypeIt */

.ti-cursor {
  margin-left: -0.9ch;
}

/*  when a <dt> has a matching <dd> add spacing before the next one */
dt+dd {
  margin-bottom: 1rem;
}

/* Media queires
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* small screens */
@media (max-width: 400px) {
  h4, h5, h6 {
    font-size: 2rem;
  }

}

/* Larger than mobile */
@media (min-width: 400px) {
  h2.name {
    font-size: 3.5rem;
  }

}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
  h2.name {
    font-size: 4rem;

  }
}

/* Larger than tablet */
@media (min-width: 750px) {
  h2.name {
    font-size: 6rem;
  }
}

/* Larger than desktop */
@media (min-width: 1000px) {
  h2.name {
    font-size: 7rem;
  }
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
  h2.name {
    font-size: 8rem;
  }
}
