/* Color Scheme*/
.dark-primary-color    { background: #1976D2; }
.default-primary-color { background: #2196F3; }
.light-primary-color   { background: #BBDEFB; }
.text-primary-color    { color: #FFFFFF; }
.accent-color          { background: #9E9E9E; }
.primary-text-color    { color: #212121; }
.secondary-text-color  { color: #757575; }
.divider-color         { border-color: #BDBDBD; }
/* End of color Scheme*/

/*  Google Font Family  */
font-family: 'Roboto Slab', serif;
font-family: 'Anton', sans-serif;
font-family: 'Lobster', cursive;
font-family: 'Montserrat', sans-serif;
/* End of Google font family */

/* Body CSS */
body {
}
.background {
  background-image: url("../img/git-fit-background-smudge2.png");
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
}


/* End of Body CSS */

/*start of navbar and Header */
/* Header Gradiant start*/
.header-bar {
  background: -moz-linear-gradient(top,  rgba(25,118,210,1) 0%, rgba(29,133,226,1) 47%, rgba(33,150,243,0.02) 99%, rgba(33,150,243,0) 100%);
  background: -webkit-linear-gradient(top,  rgba(25,118,210,1) 0%,rgba(29,133,226,1) 47%,rgba(33,150,243,0.02) 99%,rgba(33,150,243,0) 100%);
  background: linear-gradient(to bottom,  rgba(25,118,210,1) 0%,rgba(29,133,226,1) 47%,rgba(33,150,243,0.02) 99%,rgba(33,150,243,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1976d2', endColorstr='#002196f3',GradientType=0 );
  height: 25vh;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 5vh;
}

.header-text {
  color:#000;
  font-size: 2em;
  font-weight: 900;
  font-family: roboto+Condensed;
  padding-bottom: 6vh;
}

.navbar-logo{
  height: 130px;
  margin-top: -60px;
  padding: 5px;
}

h3 {
  padding-left: 30px;
}

.pad-right {
  margin-right: : 50px;
}
.form-background {
  background: rgba(214, 94, 21, .5);
  padding: .6%;
  opacity: 1;
  color: #fff;
  font-weight:300;
  font-family: "Anton";
  font-size: 1.5em;

}
.results {
    padding: 20px;
    background-color: #fff;
    color: #000;

    box-sizing: border-box;

}
.result {
    font-size: 36px;
    font-family: 'Arial-BoldMT','Arial Bold','Arial';
    vertical-align: middle;
    line-height: 40px;
}

.social-fb {
  text-align: center;
  font-size: 2em;
  background-color: #3b5999;
  border-radius: 50%;
  padding: 0;
  position: relative;
  display: inline-block;
  height:50px;
  width: 50px;
  cursor: pointer;
}

.social-tw {
  text-align: center;
  font-size: 2em;
  background-color: #55acee;
  border-radius: 50%;
  padding: 0;
  position: relative;
  display: inline-block;
  height:50px;
  width: 50px;
  cursor: pointer;
}

.social-google {
  text-align: center;
  font-size: 2em;
  background-color: #dd4b39;
  border-radius: 50%;
  padding: 0;
  position: relative;
  display: inline-block;
  height:50px;
  width: 50px;
  cursor: pointer;
}

.social-instagram {
  text-align: center;
  font-size: 2em;
  background-color: #e4405f;
  border-radius: 50%;
  padding: 0;
  position: relative;
  display: inline-block;
  height:50px;
  width: 50px;
  cursor: pointer;
}

.social-youtube {
  text-align: center;
  font-size: 2em;
  background-color: #cd201f;
  border-radius: 50%;
  padding: 0;
  position: relative;
  display: inline-block;
  height:50px;
  width: 50px;
  cursor: pointer;
}

.cp-decoration {
  color:#000;
}
/* Footer Gradient */
.footer-bar {
  background: -moz-linear-gradient(top,  rgba(33,150,243,0) 0%, rgba(28,130,223,1) 62%, rgba(25,118,210,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(33,150,243,0) 0%,rgba(28,130,223,1) 62%,rgba(25,118,210,1) 100%);
  background: linear-gradient(to bottom,  rgba(33,150,243,0) 0%,rgba(28,130,223,1) 62%,rgba(25,118,210,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002196f3', endColorstr='#1976d2',GradientType=0 );
  height: 25vh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 7%;
  margin-top: 3%;
}

/* Landing Page Css */
.logo-box {
  height: 550px;
  width: 550px;
  background-color: rgba(28,130,223,.8);
  margin: auto;
  margin-top: 3%;
  border-radius: 50%;
  border: 4px groove rgba(214, 94, 21, 1);
  }

.logo-img {
  margin: -10% 0% 0% 4%;
}

.button-header {
  color: #000;
  background-color: rgba(255,255,255,.8);
  padding: 5px;
  margin: auto;
  margin-top: 1%;
  border-radius: 7px;
  padding: 1%;
  text-align: center;
}

.start-button {
  background: rgba(214, 94, 21, 1);
  margin: auto;
  margin-top: 1%;
  font-size: 40px;
  text-decoration: none !important;
  color: #000;
  font-family: 'anton', sans-serif;
  border-radius: 5px;
}
.start-button:hover {
  color: #1976d2;
}