@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');

body { 
background-color: #f1f1f1;
color: #0f141e;

  font-size: 16px;
  font-weight: normal;
  font-family: 'Roboto Slab', serif;

  /*font: normal 16px 'Roboto Slab', serif;*/

 /* font-family: 'Times New Roman', Times, serif; */
}

a {
  color: black;
  text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:active {
    color: blue;
}

a:visited {
    color:grey;
}

.avatar {
    width: 200px;
    border-radius: 28px;
    box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.25);
}

.info {
    display: flex;
    margin-bottom: 20px;
}

@media (max-width: 700px) {
    .info {
        text-align: center;
        display: block;
    }
}

.info-text {
    margin-left: 40px;
}

.info-text h4 {
    margin-bottom: 10px;
}

.info p {
    color: #86898f;
    margin: 0;
    font-style: italic;
    font-weight: bold;
    text-decoration: none;
   /* text-transform: uppercase;*/
  /* letter-spacing: 5px;*/
 /* word-spacing: 42px;*/
}

.container {
 max-width: 750px;
margin: auto;
padding-top: 30px;
}

/*.social {
  background: green;*/
/*padding: 15px 20px 25px 30px;
border: 5px solid red;
margin: 5px;

border-bottom-style: dotted;
border-top-width: 15px;
border-right-color:blue ;
} */

/*.box-model div {
float: left;
background: #000;
height: 200px;
border: 4px solid red;
width: 25%;
box-sizing: border-box;
}*/

.bg-yellow {
    background: #fff9dc;
}

.bg-green {
    background: #e5ffe7;
}

.bg-red {
    background: #ffe5e5;
}

.card {
    padding: 15px 20px;
    margin-bottom: 20px;
    border-radius: 20px;
}

.card h2 {
    margin-bottom: 10px;
}

.list {
    padding: 0 20px;
}

.list li {
color: #86898f;
margin-bottom: 10px;
}

.table {
    width: 100%;
}

.table td {
 padding-bottom: 10px;
}

.table td:nth-child(2),
 .table td:nth-child(3){
color: #86898f;
}

/*.table tr:nth-child(even) {
    background: red;
}*/

.link-list {
    list-style: none;
    padding: 0;
}

.link-list li {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #ccc;
}

.contact h2 {
    text-align: center;
}

.form-group label {
display: block;
font: 14px;
color: #86898f;
}

.form-group input,
.form-group textarea {
    width: 100%;
    box-sizing: border-box;
    border: none;
    background: transparent;
    border-bottom: 1px solid #ccc;
    color: #000;
    padding: 15px 0 10px;
    outline: none;
    font-family: inherit;
    box-shadow: 28px;
}

.row {
    display: flex;
    margin-bottom: 20px;
}

.row > .form-group {
    width: 50%;
    margin-right: 20px;
}

.btn {
    background: #111;
    padding: 15px 20px;
    color: #fff;
    border: none;
    font-family: inherit;
    cursor: pointer;
}

.btn.hover {
    opacity: 0.9;
}