* {
  /*border: 1px dotted red;*/
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

:root {
  --sea-salt: #ced2cb;
  --sea-salt-rgb: 206, 210, 203;
  --light-sea-salt: #fafef6;
  --royal-purple: #1a3180;
  --deep-purple: #150e61;
  --maritime: #214478;
  --carribean: #77bbff;
  --light-carribean: #99ccff;
  --lighter-carribean: #b8dbff;
  --granny-smith-apple: #cae8a8;
  --outer-space-green: #395a62;
  /*--nice-blue-link: #4f6ae7;*/
  --nice-blue-link: #435ed7;
  --nice-blue-link-hover: #738dff;
  --huffmanian-orange: #ffa509;
  --huffmanian-orange-hover: #ffc45d;
  --huffmanian-orange-rgb: 255, 165, 9;
  --slate: #121212;
  --light-slate: #3a3a3a;
  --basic-beige: #ecece4;
  --baby-blue: #ebeef3;
  --almost-white: #a8a8a8;
  --light-cream: #fffaf1;
  --lighter-cream: #ffe;
  --lapus-lazuli: #1F4788;
  --porcelain: #ECF0F1;
  --dark-columbia-green: #007A72;

  /* Dot Graph Variables */
  --mm: 3.7795275591px;
  --grid-unit: calc(5 * var(--mm));
  --a5-height: calc(210 * var(--mm));
  --a5-width: calc(148 * var(--mm));
  --line: 0.13px;
}

/* Scrollbar styles */

html {
    scrollbar-width: 24px;
    scrollbar-color: var(--dark-columbia-green) var(--porcelain);
}

/* General Styles */

body {
  background: var(--dark-columbia-green);
  background-image: radial-gradient(var(--deep-purple) 0.06rem, transparent 0);
  background-size: var(--grid-unit) var(--grid-unit);
  background-position: calc(var(--grid-unit) / 2) calc(var(--grid-unit) / 2);
  color: var(--porcelain);
  font-size: 18px;
  font-family: "Merriweather Sans", sans-serif;
  display: flex;
  flex-direction: column;
}

a {
  color: var(--nice-blue-link);
}

a:visited {
  color: var(--nice-blue-link-hover);
}

h1, h2, h3, p, ul {
  margin: .8em 0 .2em 0;
}

h1 {
  font-family: "Ramaraja", serif;
  font-size: 3rem;
  line-height: 3rem;
}

h2 {
  font-family: "Ramaraja", serif;
  font-size: 2.6rem;
  line-height: 2.6rem;
  margin-top: 1em;;
}

h3 {
  font-family: "Ramaraja", serif;
  font-size: 2.2rem;
  line-height: 2rem;
  margin-top: 1em;
}

p { 
  font-family: "Merriweather Sans", sans-serif;
  font-weight: 400;
  line-height: 1.6em;
}

p small {
  line-height: .1em;
}

ul {
  margin-left:1rem;
}

li {
  line-height: 1.6em;
  margin: .25em 0;
}

img {
  max-width: 100%;
}

/* Header Styles */

header {
  background: var(--lapus-lazuli);  
  width: 100%;  
  /*border-radius: 0% 0% 64% 36% / 0% 0% 10% 2% ;
  margin-bottom: -1.4rem;*/
  z-index: 100;
  /*background-image: radial-gradient(var(--royal-purple) 0.06rem, transparent 0);
  background-size: var(--grid-unit) var(--grid-unit);
  background-position: calc(var(--grid-unit) / 2) calc(var(--grid-unit) / 2);*/
  border-bottom: .2rem solid var(--porcelain);
  box-shadow: 8px 8px 24px #0000004d;
}

header section {
  margin: 0 auto;
  padding:40px 10px 40px 10px;
  max-width: 940px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items:center;
}

header section h1 {
  text-shadow: 2px 2px 2px var(--deep-purple);
  margin: 0;
}

/*header section h1::after {
  content: ".net";
  font-size: 2rem;
  position:relative;
  top: 0rem;
  left: .6rem;
  color: var(--carribean);
}*/

header section nav {
  margin: 12px 0 20px 0;
}

header section nav ul {
  background: var(--carribean);
  padding: 10px 10px 14px 20px;
  border-radius: 5px;
  box-shadow: 2px 2px 4px var(--deep-purple);
  margin: 0;
}

header section nav ul li {
  color: var(--maritime);
  display: inline-block;
  font-weight: 800;
  margin: 0 20px 0 0;
}

header section nav ul li a,
header section nav ul li a:visited {
  color: var(--maritime);
}


/*  Main Content Styles */

main {
  width: 100%;
  color: var(--maritime);
  background: var(--lighter-cream);
  /*background-image: radial-gradient(var(--huffmanian-orange) 0.06rem, transparent 0);
  background-size: var(--grid-unit) var(--grid-unit);
  background-position: calc(var(--grid-unit) / 2) calc(var(--grid-unit) / 2);*/
  min-height: 50vh;
  /*padding-bottom:40px;*/
  /*border-radius: 0% 0% 0% 100% / 100% 0% 0% 3%  ;*/
  /*margin-bottom:-2rem;*/
  z-index: 2;
}

main article {
  margin: 0 auto;
  max-width: 1000px;
  padding: 10px 40px;  
  display: flex;
  flex-direction: row;  
  background-image: radial-gradient(var(--huffmanian-orange) 0.06rem, transparent 0);
  background-size: var(--grid-unit) var(--grid-unit);
  background-position: calc(var(--grid-unit) / 2) calc(var(--grid-unit) / 2);*
}

/*main article section p {
  margin-bottom: 1.2em;
}*/

main h1 {
  margin-top: 40px;
}

.home-left {
  max-width: 56%;
}

main article aside {
  margin: 40px 0px 40px 40px;
  padding: 20px;
  border: 4px solid var(--sea-salt);
  box-shadow: 0px 0px 48px 12px rgba(0, 0, 0, 0.123);
  border-radius: 8px;
  /*border-radius: 5% 93% 5% 87% / 28% 2% 95% 1% ;*/
  background: var(--porcelain);
  /*margin: 2.4rem 0;*/
  /*background: var(--light-cream);*/
  border-radius: .76rem;
  
}

main article aside h2 {
  font-size: 1.6rem;
  line-height: 1.6rem;;
  margin-bottom:20px;
  margin-top: 0px;
}

main article aside a,
main article aside a:visited {
  color: var(--nice-blue-link)
}

main article section ul {
  margin-bottom:3rem;
}

main article section hr {
  border: 0;
  border-bottom: 4px dotted var(--dark-columbia-green);   
  margin: 2rem 0; 
}

main article section img {
  border-radius: 1rem;
  box-shadow: 8px 8px 24px #0000004d;
}

.svg-img {
  box-shadow: none;
  border-radius: 0;  
}

main>section {
  color: red;
  margin: 0 auto;
  max-width: 900px;
  padding: 10px;  
}

/* Tables */

/* Default Table */
table {
  margin: 2.4rem 0;
  background: var(--light-cream);
  border-radius: .76rem;
  /*padding: .5rem 1rem;*/
  box-shadow: 8px 8px 24px #0000004d;
  border: 4px solid var(--lapus-lazuli);
  border-spacing: 0;
  /*border-collapse: collapse;*/
  vertical-align:middle;
  width: 100%;
  table-layout:auto;
  
}
thead {  
  /*background: var(--light-cream); */
  border-radius: .76rem;
  border-top-left-radius: .76rem;
  border-top-right-radius: .76rem;
}
thead>tr>th {
  background: var(--porcelain);
  border-bottom: 3px dashed var(--lapus-lazuli); 
  border-right: 3px dotted var(--lapus-lazuli);
}
thead>tr>th:first-child {
  border-top-left-radius: .76rem;
}
thead>tr>th:last-child {
  border-top-right-radius: .76rem;
}
thead>tr>th:last-child {border-right:none;}
tbody {
  border-collapse: collapse;
  border-spacing: 0;
}
table>thead>tr>th {
  padding: .5rem 1rem;
}
td {
  border-bottom: 3px dotted var(--dark-columbia-green);
  border-right: 3px dotted var(--dark-columbia-green);  
  padding:.5rem 1rem;
  color: var(--dark-columbia-green);
}
td:last-child {border-right:none;}
tr:last-child>td {border-bottom:none;}

tbody tr:nth-child(odd) {
  background: var(--lighter-cream);  
}

/* Pagination */

.pagination-links {
  text-align: center;
  width: 100%;
  margin-top:2rem;
}




/* Footer Styles */

footer {
  background: var(--dark-columbia-green);
  padding: 40px 0 30px 0;
  width:100%;
  /*position: absolute;
  bottom:0px;*/ 
  border-top: .2rem solid var(--porcelain);
  box-shadow: 0px -12px 12px #0000002b;
  z-index: 10;
}

footer section {
  margin: auto;
  padding: 10px;
  max-width: 940px;
}

footer a, footer a:visited {
  color: var(--porcelain); 
}

/* Custom Styles */


.centered {
  text-align: center;
  margin-top: 40px;
}

h1.big-text {
  font-size: 5rem;  
}

h1.really-big-text {
  font-size: 8rem;
  margin: 1rem 2rem 1rem 9rem;
  background: var(--carribean);  
  padding:4rem 2rem 2rem 3rem;
  border-radius: 50%;
  z-index: 1;
  transform: skewX(-10deg);
  border-bottom: .2rem solid var(--light-carribean);
  border-right: .5rem solid var(--light-carribean);
}

h1.really-big-text::after {
  content: "";
  position:absolute;
  margin-left:-20rem;
  margin-top: 3rem;
  width: 6rem;
  height: 3rem;
  /*background: black;*/
  border-radius: 50%;
  border-right: 3rem solid var(--carribean);
  z-index: -1;
}

p.big-text, span.big-text {
  font-size: 1.8rem;
}

.profile-img {
  position: absolute;
  max-width: 140px;
  border-radius: 1rem;
  margin: 1rem 0rem 0rem 2rem;
  transform: rotate(-12deg);
  border: 4px solid var(--sea-salt);  
  z-index: 2;
}

.profile-and-greeting {
  display: flex;
  width:100%;
  flex-direction: row;
  margin: 0 auto;
  padding: 3rem 0;
}

.img-5px-radius {
  border-radius: 5px;
}

.topics-section {
  width: 100%;;
  flex-direction: column;
}

#path854 {
  fill: var(--outer-space-green)
}



/* Responsive Styles */

@media screen and (max-width: 500px) {
  main {min-height: initial;}
  main article {flex-direction: column;padding: 10px;}
  main article aside {margin:10px;}
  header section {flex-direction: column;}
  header section nav {
  margin: 12px;
}

header section {
  padding:40px 10px 20px 10px;
}

header section nav ul {
  padding: 10px;
  margin-left: -14px;

}
header section nav ul li {
  margin: 0 8px 0 0;
}
  .profile-img {
    margin: 0rem 0rem 0rem -.4rem;
    max-width:120px;
  }
  h1.really-big-text {
    font-size: 6.8rem;
    margin: 1rem 2rem 1rem 7rem;
    padding:2rem 1rem 1rem 1rem;
  } 
  h1.really-big-text::after {
      margin-left:-16rem;
  margin-top: 2rem;
  }
  .home-left {
  max-width: 100%;
  }
}