@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');

::-moz-selection {
  background-color: #008EA8;
  color: #ffffff;
}
::selection {
  background-color: #008EA8;
  color: #ffffff;
}
@-ms-viewport {
  width: auto !important;
}
@media (prefers-color-scheme: dark){
    body{color:#c9d1d9;background:#0d1117}
    a:link{color:#58a6ff}
    a:visited{color:#8e96f0}
}

body {
  font-family: 'Poppins', 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  color: #454545;
  padding:0 10px;
}
h1,h2,h3{line-height:1.2}
h1 {
  color: #008EA8;
}
h2 {
  color: #FF7C00;
}
h3 {
  font-size: 1.25rem;
}
.txt-primary {
  color: #008EA8;
}
.txt-secondary {
  color: #FF7C00;
}
.txt-center {
  text-align: center;
}
.txt-bigger,
.motto {
  font-size: 1.2rem;
}
.font-italic,
.motto {
  font-style: italic;
}
.font-thin,
.font-300,
.motto {
  font-weight: 300;
}
.content {
  background-color: #ffffff;
  max-width: 800px;
  min-height: 100vh;
}
.avatar {
  border-radius: 50%;
  height: 200px;
  width: 200px;
}
.footer {
  font-size: 0.8rem;
}
.butn {
  color: #ffffff;
  background: #008EA8;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}
.butn:hover {
  color: #ffffff;
  background: #00697d;
  text-decoration: none;
}
.butn.full {
  display: inline-block;
  width: 100%;
}
/* From Bootstrap */
.w-25 {
  width: 25% !important;
}
.w-50 {
  width: 50% !important;
}
.w-75 {
  width: 75% !important;
}
.w-100 {
  width: 100% !important;
}
.w-auto {
  width: auto !important;
}
.h-25 {
  height: 25% !important;
}
.h-50 {
  height: 50% !important;
}
.h-75 {
  height: 75% !important;
}
.h-100 {
  height: 100% !important;
}
.h-auto {
  height: auto !important;
}