/* some style */
body {
  background-color: #dddddd;
}

img {
  width: 90%;
  height: 90%;
  margin: 25px;
}

a {
  outline: 0;
  color: #FFFFFF;
  text-decoration: none;
}

header img{
  background-color: #FFFFFF;
  border-radius: 25%;
}

.ruler{
  border-color: #989898;
  border-top-style: solid;
  border-width: 1px;
}

.card-a-tag {
  text-decoration: underline;
}

.stretch_wrapper{
  display: block;
  width: 100%;
}

.event_info{
  float: right;
  margin: auto;
  width: 48%;
}

.gmaps{
  width: 50%;
  margin: auto;
  float: left;
}

.value_wrapper{
  padding-left: 1%;
  float: left;
  width: 22%;
}

.text_wrapper{
  margin: 0;
  padding: 0;
  height: 100%;
}

.progress_bar{
  margin: 0;
  padding: 0;
  display: inline-block;
  background-color: #f20808;
  width: 5%;
  vertical-align: top;
}

.full-bar{
  border-bottom-left-radius:0%;
  border-bottom-right-radius:0%;
}

.round-bar{
  border-bottom-left-radius: 40%;
  border-bottom-right-radius: 40%;
}

.stretch_goal{
  padding-right: 1%;
  float: right;
  width: 71%;
}

.input{
    width: 20%;
    margin: 2%;
    display: inline;
}

.form_input{
  width: 10%;
  padding: 5%;
}

form{
  width: 10%;
  margin-left: auto;
  margin-right: auto;

}

.center_form{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

.goal_container{
    padding: 5px;
}
.stretch_wrapper_row{
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 150px;
}

.header.mdl-layout__header{
  background-color: #d50000;
}

.donation_ammount{
  text-align: center;
}

.mdl-layout__content{
  padding: 0;
  margin: 0;
}

.mdl-layout-title{
  color: rgb(255, 255, 255);
}

.video_wrapper.mdl-card{
  width: 100%;
  height: 400px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  vertical-align: middle;
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
                    url("../bin/images/WebBG.jpg");
  background-position: bottom;
  background-color: rgb(255, 255, 255);
}

.appear{
  -webkit-animation: fadein 2.5s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 2.5s; /* Firefox < 16 */
      -ms-animation: fadein 2.5s; /* Internet Explorer */
        -o-animation: fadein 2.5s; /* Opera < 12.1 */
         animation: fadein 2.5s;
}

.appear-slow{
  -webkit-animation: fadein 3.5s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 3.5s; /* Firefox < 16 */
     -ms-animation: fadein 3.5s; /* Internet Explorer */
      -o-animation: fadein 3.5s; /* Opera < 12.1 */
       animation: fadein 3.5s;
}

.padder{
  padding: 15px;
}

video.mdl-card {
  width: 70%;
  outline: 0;
  margin-left: auto;
  margin-right: auto;
}

.card-text.mdl-card__supporting-text pre {
  color: #000000;
  font-size: 14px;
}

.card_content img {
  float: left;
  width: 25%;
}

.text_block {
  display: inline;
  width: 75%;
  margin-right: 10px;
}

.content {
  width: 65%;
  margin-right:auto;
  margin-left: auto;
}

.fill-card.mdl-card{
  height: 100%;
  width: 100%;
}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}


@media screen and (max-width: 768px) {
  .content {
    width: 75%;
    margin-right:auto;
    margin-left: auto;
  }
}

@media screen and (max-width: 570px) {
  header img{
    display:none;
  }

  .gmaps{
    width: 100%;
    margin: auto;
  }

  .event_info{
    width: 100%;
    margin: auto;
  }

  .content {
    width: 90%;
    margin-right:auto;
    margin-left: auto;
  }
}