
html
{
  height:100%;
  width: 100%;
}
 
 
body {
  width: 100%;
  height: 100%;
}
 

h1 {
  font-family:'Inter', sans-serif; font-weight:500;font-size: 40px; letter-spacing: .5px;
}
p {
  font-family:'Inter', sans-serif; font-weight:300; color: black; font-size: 14px; line-height: 150%;
line-height: }


h2 {font-family:'Inter', sans-serif; font-weight:500;  color: white; font-size: 20px;
}

 
 
h3 {
  font-family:'Inter', sans-serif; font-weight:400; font-size: 20px;
  
}
 
.hardrule {
  border-top: 1px solid; color: rgb(0, 0, 0);
}

.greygradient {
  background-image: linear-gradient(rgb(215, 213, 213), rgb(255, 255, 255)); height:5px; width:100%;
 
}

/* links*/
a {
font-family:'Inter', sans-serif; font-weight: 300; color:  rgb(92, 91, 91); text-decoration:none; font-size: 15px
}
 a:link
 {font-family:'Inter', sans-serif; font-weight: 400; 
}

 a:hover {
  color: red; text-decoration:underline;
} 

a:visited 
{color: #9900FF; font-weight: bold
}  
 
/* links end */



.row {
  display:flex; flex-direction: row;  
}

.column {
  display:flex; flex-direction: column; width:100%;
}



/* justification */


.center /* centered by height*/
{ display:flex; align-items: center;

}

.middle /* centered by width*/
{ display: flex; justify-content: center;}


.right  
{ display: flex; justify-content: flex-end;
  padding-right: 25px;
}

.left
{ display: flex; justify-content: flex-start;

}

.grey
{ background-color: rgb(92, 91, 91)
}

.bigpad { 
  box-sizing: border-box;
  padding: 7%;
}

.leftpad { 
  box-sizing: border-box;
   padding-left: 50px;
}
.tall {
  height: 90%;
}

.half
{
 width:50%;

}

.outer
{
  background: hsl(0, 3%, 51%);
}
.inner {  
  height:18%;
  margin-top:15px;
  padding: 5px
}
  

.card { 
 
width: 180px;
height: 180px;
padding: 1rem;
box-sizing: border-box;
border: 1px solid #aba8a8;
border-radius:15px;
margin: 20px; 
 
}


.boxshadow {

  box-shadow:2px 2px 5px rgb(231, 230, 230)

}
 
.black {
  background-color:black;
}

.blue {
  border-color:blue;
}


.wrapper {
  margin:20px;
}

.pink {
  background-color: hsl(350, 43%, 80%);
}