@import url(https://fonts.googleapis.com/css?family=Slabo+27px);
@import url(https://fonts.googleapis.com/css?family=Heebo:400,500);

@media (min-width: 200px) {
  .card-columns {
    column-count: 1 !important;
  }
  p {
      font-size : 120% !important;
  }
}
@media (min-width: 567px) {
  .card-columns {
    column-count: 2 !important;
  }
  p {
      font-size : 105% !important;
  }
}

@media (min-width: 768px) {
  .card-columns {
    column-count: 3 !important;
  }
  p {
      font-size : 1em !important;
  }
}

@media (min-width: 992px) {
  .card-columns {
    column-count: 4 !important;
  }
  p {
      font-size : 1em !important;
  }
}

@media (min-width: 1600px) {
  .card-columns {
    column-count: 4 !important;
  }
}

p {
  font-family: 'Slabo 27px', sans-serif !important;
}

a,h1,h2,h3,h4,h5,h6 {
  font-family: 'Heebo', sans-serif !important;
  font-weight: 500 !important;
}

hr{
  border-color: #000000 !important;
}

.dashed {
  border-top: 1px dashed;
}

* {
  border-radius: 0 !important;
}

.carousel-item {
    position: relative !important;
    height: 440px !important;

}
.carousel-caption{
    text-align: left;
    padding-top: 15px !important;
    padding-left: 15px !important;
    width: 450px;
    height: 120px !important;
    position: absolute !important;
    top: 65% !important;
    transform: translateY(0%) !important;
    transform: translateX(-13%) !important;
    background: #FFFFFF !important;
    color: #000000 !important;
}

#show-previous-image img {
    height: 25px;
    width: 25px;
}

#show-next-image img {
    height: 25px;
    width: 25px;
}

.nav-item  {
  font-family: 'Heebo', sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
}

.navbar-brand {
  font-size: 1.2rem !important;
  color: #000000;
}

.navbar-brand .nav-item .nav-link{
  font-size: 1.2rem !important;
}

.slaboTypoMedium {
  font-family: 'Slabo 27px', sans-serif !important;
}

.heeboTypoBold {
  font-family: 'Heebo', sans-serif !important;
  font-weight: 500 !important;
}

.heeboTypoMedium {
  font-family: 'Heebo', sans-serif !important;
  font-weight: 400 !important;
}

.card{
  border-width : 0.05em solid black !important;
  border-color: #DCDCDC !important;
  /*background-color: #a5a5a5 !important;
  /*border-style: dotted !important;*/
}

.borderblackall{
  border-width : 2px !important;
  border-color: #000000 !important;
}

.borderblackallthin{
  border-width : 1px !important;
  border-color: #000000 !important;
}

.borderblack{
  border-width : 3px !important;
  border-left : 0 none !important;
  border-right : 0 none !important;
  border-color: #000000 !important;
  /*background-color: #a5a5a5 !important;
  /*border-style: dotted !important;*/
}

.card-text{
  font-size:0.9rem !important;
}

.typoblack, .page-link {
    color : #000000 !important;
}

.page-item.active .page-link {
  z-index: 1 !important;
  color: white !important;
  background-color: black !important;
  border-color: black !important;
}

.page-item .page-link {
  border-color: black !important;
}

.navbar-light .navbar-nav .nav-link{
    color: #000000 !important;
    padding: .75rem 1rem !important;;
}

/* change the color and background color of active links */
.navbar-light .nav-item.active .nav-link,
.navbar-light .nav-item:hover .nav-link {
    color: white !important;
    background-color: black !important;
}


.dropdown-menu a{
    color: #000000 !important;
    font-size: 0.9rem !important;
}

.container .dropdown .dropdown-menu a:hover
{
  color: #FFFFFF !important;
  background-color: #000000 !important;
}

.page-footer {
  background-color: #f0f5f5;
}

.remove-all-margin-padding{
  margin-top:-60px ! important;
  padding:0 ! important;
}

.wrapper{
  position:relative ! important;
  display:inline-block;
  text-align: center ! important;
}

.myWork{
  margin-left:50 ! important;
}

.modal-body{
  font-size: small ! important;
}

.centerText{
    text-align: center;
}


.btn:focus, .btn:active, button:focus, button:active {
  outline: none !important;
  box-shadow: none !important;
}

#image-gallery .modal-footer{
  display: block;
}

.btn{
  font-family: 'Heebo', sans-serif !important;
  font-weight: 400 !important;
}

.img-thumbnail {
  border: 0 none ! important;
  margin-bottom : 2px ! important;
}

.nopaddingsides {
   padding-left: 0 !important;
   padding-right: 0 !important;
   margin: 0 !important;
}

.modal-body {
  padding-left: 0px ! important;
  padding-right: 0px ! important;
}