@charset "UTF-8";

main > .container {
  padding: 125px 10px 0px 10px;
  font-size: 1.1em !important;
}

/* body {
    background: rgb(193, 193, 193);
    } */

/* h1 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 2.5em;
    color: rgb(49, 49, 49);
} */

/* p {
    font-family: Georgia, serif;
    font-size: 1.2em;
    color: DarkSlateGray;
} */

.navbar a {
  /* font-family: 'Roboto', sans-serif; */
  color: black !important;
  font-size: 1.2em !important;
  font-style: bold !important;
}

.nav li{
  padding-right:5px;
 }

figcaption {
    font-style: bold;
    padding: 2px;
    text-align: center;
  }

form {
    margin: 10px auto;
    padding: 10px 20px;
    /* background: #f4f7f8; */
    border-radius: 8px;
  }

  .form_footer{
    margin: 0px 0px;
    padding: 0px 0px;
    /* background: #f4f7f8; */
    border-radius: 0px;
  }

.number {
    background-color: #5fcf80;
    color: #fff;
    height: 30px;
    width: 30px;
    display: inline-block;
    font-size: 0.8em;
    margin-right: 4px;
    line-height: 30px;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255,255,255,0.2);
    border-radius: 100%;
}

table_view {
	text-align: left;
	vertical-align: middle;
}

.table_view label{
  font-weight: bold;
}

select.col-search {
  width: 80%;
}  

#rowAdder {
  margin-left: 17px;
}

.stars-container {
  position: relative;
  display: inline-block;
  color: transparent;
}

.stars-container:before {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: lightgray;
}

.stars-container:after {
  position: absolute;
  top: 0;
  left: 0;
  content: '★★★★★';
  color: gold;
  overflow: hidden;
}


.btn-xl {
  padding: 10px 10px;
  font-size: 20px;
  border-radius: 10px;
  min-width: 250px;
  max-width: 250px;
  min-height: 75px;
}

.btn-xxl {
  padding: 10px 20px;
  font-size: 35px;
  border-radius: 10px;
  min-width: 250px;
  min-height: 75px;
}

.submit_material_1 {
  background-color: #e51873;
  border: #e51873;
  color: #fff;
}

.submit_material_2 {
  border: #49b15c;
  background-color: #49b15c;
  color: #fff;
}

.submit_material_3 {
  background-color: #314e9a;
  border: #314e9a;
  color: #fff;
}

.submit_material_4 {
  background-color: #2daae2;
  border: #2daae2;
  color: #fff;
}

.submit_material_1_light {
  background-color: #F17EB2;
  border: #F17EB2;
  color: #fff;
}

.submit_material_2_light {
  border: #7DCA8B;
  background-color: #7DCA8B;
  color: #fff;
}

.submit_material_3_light {
  background-color: #7390D3;
  border: #7390D3;
  color: #fff;
}

.submit_material_4_light {
  background-color: #A5DAF3;
  border: #A5DAF3;
  color: #fff;
}

.detailed_view_image {
  float: right;
  clear: right;
  max-height: 200px;
  max-width: 100%;
}

#share_buttons {
  display: flex;
  justify-content: space-between
}

#share_buttons a,
#share_buttons button {
  background: transparent;
  border: none;
  padding: 0;
  margin: 8px;
  font-size: 2em;
  opacity: 0.9
}

#share_buttons a:hover,
#share_buttons button:hover {
  opacity: 1
}

#share_buttons button,
#share_buttons button:hover {
  color: #4e5050
}

#share_buttons a[data-share=email],
#share_buttons a[data-share=email]:hover,
#share_buttons a[data-share=email]:visited {
  color: #00527A
}

#share_buttons a[data-share=reddit],
#share_buttons a[data-share=reddit]:hover,
#share_buttons a[data-share=reddit]:visited {
  color: #FF4500
}

#share_buttons a[data-share=twitter],
#share_buttons a[data-share=twitter]:hover,
#share_buttons a[data-share=twitter]:visited {
  color: #00acee
}

#share_buttons a[data-share=facebook],
#share_buttons a[data-share=facebook]:hover,
#share_buttons a[data-share=facebook]:visited {
  color: #3B5998
}

#share_buttons a[data-share=linkedin],
#share_buttons a[data-share=linkedin]:hover,
#share_buttons a[data-share=linkedin]:visited {
  color: #0077b5
}

#copy-success {
  margin: 0;
  font-size: 0.85em;
  padding: 6px;
  color: #fff;
  background-color: #3c763d
}

.screen-reader-only {
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

.text-justify {
  text-align: justify;
  text-justify: inter-word;
}