body {
    font-family: 'verdana';
}



h1,h2 {

    color: #2E2E2E;
    text-align: left;
    padding-left:10%;
}

P {
    color: #2E2E2E;
    text-align: left;

   
    line-height: 1.8rem;

}

ul {
    color: #2E2E2E;
    text-align: left;
    padding-left:25%;
    padding-right:20%;
    line-height: 1.8rem;
}

* {
    box-sizing: border-box;
  }

  .boxed {
    margin-top: 5%;
    margin-left: 10%;
    margin-right: 10%;
    border: 1px solid rgb(138, 143, 138) ;
    box-shadow:  0 0.2rem 0.3rem gray;
  }


.column {

    float: left;
 
  }
  
  .left {
    width: 5%;
  
   height: 100%;

    padding-right: 0%;

  align-items: left;
  


  justify-content: left;
  }

  .middle {
      width: 80%;
      height: 10%;
  }
  
  .right {
    width: 0%;
    padding-right:0%;

   
  }

  .wide {
    padding-left:7%;
      width: 100%
  }

  .footer {
    padding-left:5%;
      width: 85%;
      font-family: 'verdana';
      font-size:10px;
  }

  .row:after {
    content: "";
    display: table;
    clear: both;
  }
  

body {background-color: #FFFFFF;}

.avatar {
  
    width: 26px;
    height: auto;
    padding-top: 1%;
    padding-right: 1%;
   
}

lead {
    color: #333333;

    font-weight: bold;
    font-size: larger;
}

smallerlead {
    color: #333333;

    font-weight: bold;
    font-size: larger;
}

#highlight {
  background-color: #FF7C9D;
  color: white;
  padding-left:25%;
  padding-right:3%;
}

a {
    color: #2E2E2E;
    text-transform: uppercase;
    font-weight: bold;
}

#main-title {
  text-transform: uppercase;
}


@media (max-device-width: 1000px) {

    P {
        color: #2E2E2E;
        text-align: left;

        margin-left: 5%;
        margin-right: 5%;
        line-height: 1.8rem;
    }

    ul {
        color: #2E2E2E;
        text-align: left;
        padding-left:10%;
        padding-right:5%;
        line-height: 1.8rem;
    }

}






.divider
{
	position: relative;
	margin-top: 90px;
	height: 1px;
}

.div-transparent:before
{
	content: "";
	position: absolute;
	top: -40px;
	left: 5%;
	right: 5%;
	width: 90%;
	height: 1px;
	background-image: linear-gradient(to right, transparent, rgb(48,49,51), transparent);
}

.div-arrow-down:after
{
	content: "";
	position: absolute;
	z-index: 1;
	top: -7px;
	left: calc(50% - 7px);
	width: 14px;
	height: 14px;
	transform: rotate(45deg);
	background-color: white;
	border-bottom: 1px solid rgb(48,49,51);
	border-right: 1px solid rgb(48,49,51);
}

.div-tab-down:after
{
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	left: calc(50% - 10px);
	width: 20px;
	height: 14px;
	background-color: white;
	border-bottom: 1px solid rgb(48,49,51);
	border-left: 1px solid rgb(48,49,51);
	border-right: 1px solid rgb(48,49,51);
	border-radius: 0 0 8px 8px;
}

.div-stopper:after
{
	content: "";
	position: absolute;
	z-index: 1;
	top: -6px;
	left: calc(50% - 7px);
	width: 14px;
	height: 12px;
	background-color: white;
	border-left: 1px solid rgb(48,49,51);
	border-right: 1px solid rgb(48,49,51);
}

.div-dot:after
{
	content: "";
	position: absolute;
	z-index: 1;
	top: -9px;
	left: calc(50% - 9px);
	width: 18px;
	height: 18px;
	background-color: goldenrod;
	border: 1px solid rgb(48,49,51);
	border-radius: 50%;
	box-shadow: inset 0 0 0 2px white,
					0 0 0 4px white;
}