.title{

  padding-top: 100px;
  color: var(--main);

}

#main{

  width: 800px;
  margin: auto;
  margin-bottom: 40px;

}

.h2{

  text-decoration: none;
  font-weight: normal;
  font-size: 23px;
  margin-bottom: 20px;
  margin-top: 50px;

}



.div {
    width: 720px;
    margin: 30px auto 10px;
    color: white;
    border-radius: 40px;
    padding: 40px 40px;
    transition: 0.2s;
    text-align: center;

}

.div:hover:not(.blue){

  cursor: pointer;
  opacity: 0.8;

}

.blue{

  background-color: #42bff4;
  padding-bottom: 20px;


}

.blue:hover{

  /*cursor: pointer;*/

}

.blue:first-child{

  margin-top: 50px;

}

.brown{

  background-color: #cc6600;

}

.purple{

  background-color: #b259e5;

}

.link{

  margin-bottom: 50px;

}

textarea{

  width: 780px;
  padding: 10px 10px;

}

.close{

  float: right !important;

}


.submittedLink{

  color: white;

}


.submittedLink:hover{

  text-decoration: underline;

}


#amountInput{

  margin: auto;
  padding: 3px;
  margin-bottom: 5px;

}

#don{

  display: none;

}


#subscribe{

  float: right;
  width: auto;
  text-align: center;

}


.btnLight{

  font-size: 20px;

}

.postBtn{

  width: 70px;
  text-align: center;
  float: right !important;


}

.quote{

  background-color: transparent;

}

.material-icons{

  padding-right: 5px;

}

.material-icons:hover{

  cursor: pointer;
  opacity: 0.5;
  transition: 0.2s;

}

.points{

  font-size: 35px;
  color: black;

}

.rate{

  text-align: left;

}

.fileInputLabel{

  text-align: center;
  display: block;
  margin-right: 10px;
  margin-top: 20px;
  padding: 8px;
  transition: 0.4s;
  width: 100px;


}

.fileInputLabel:active{

  background-color: var(--second);

}

.time{

  font-size: 10px;
  float: left;
  padding-top: 0px;
  width: 100%;
  text-align: left;

}

.postText{

  width: 100%;

}


.postLink{

  color: #e2e2e2;
  float: right;
  text-decoration: none;
  font-size: 12px;
  margin-top: 6px;


}


.postLink:hover{

  color: white;

}

.share{

  background-color: #42bff4;
  padding-left: 0px;
  margin-left: -5px;

}

.shareImg{

  float: left;

}

.shareImg:hover{

  background-color: #1047bc;

}




.comment{

  padding: 5px;
  border-radius: 5px;
  color: white;
  float: left;
  text-decoration: none;
  font-size: 13px;
  /*margin-top: 6px;*/


}


.comment:hover{

  background-color: #1047bc;

}

#footer{

  margin-top: 40px;

}


@media only screen and (max-width: 800px) {
    .div {
        width: 90%;
        padding: 5% 5%;
        border-radius: 0;
        border: none;
        margin: 0px;
        margin-bottom: 20px;
    }

    .fileInputLabel{

      padding: 7px;

    }



    .blue:first-child{

      margin-top: 100px;

    }

    #main{

      width: calc(100%);
      margin: 0px;
      padding: 0px;
      margin-bottom: 50px;

    }

    .h2{

      padding-left: 5px;
      padding-top: 20px;

    }

    .title{

      margin-bottom: 30px;

    }

    .postBtn{

      font-size: 17px;
      margin-right: 10px;

    }

    textarea{

      width: calc(100% - 22px);

    }


    .link{

      margin-left: 5px;


    }

    .blue{

      margin-top: 50px;

    }
}


@media only screen and (max-width: 323px) {



}