form{font-family: 'Poppins', sans-serif;letter-spacing:0.6px;}
/*=================================*/
/* btn =================================*/
.btn > i {
  font-size: 120%;
}
.btn{
	font-weight:500;
	font-size:14px;
	padding:12px 20px;
	text-transform:none;
	border-radius:0px;
	font-family: 'Poppins', sans-serif;
}
.btn-link{color:#000;box-shadow:none}
.btn-link:hover, .btn-link.focus, .btn-link:focus{
	color:#666;text-decoration:none;
}
.btn-primary {
  background: #000 none repeat scroll 0 0;
  border-color:#000;
  color: #fff;
}
.btn-primary:hover, .btn-primary.focus, .btn-primary:focus,
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover{
  background: #666 none repeat scroll 0 0;
  border-color:#666;
  color: #fff;
}
.btn-default {
  background: #e1e1e1  none repeat scroll 0 0;
  border-color:#e1e1e1 ;
  color: #000;
}
.btn-default:hover, .btn-default.focus, .btn-default:focus,
.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default.focus:active, .btn-default:active:focus, .btn-default:active:hover, .open > .dropdown-toggle.btn-default.focus, .open > .dropdown-toggle.btn-default:focus, .open > .dropdown-toggle.btn-default:hover{
  background: #000 none repeat scroll 0 0;
  border-color:#000;
  color: #fff;
}
.btn-default.active, .btn-default:active, .open > .dropdown-toggle.btn-default{background:#000;color:#fff;border-color:#000;}

/*=================================*/
/* form =================================*/
label{font-weight:400;font-size:14px;}
.form-group{margin-bottom:10px;}
.form-control {background:#e1e1e1;border:1px solid #e1e1e1;box-shadow:none;border-radius:0px;height:44px;color:#000;}
.form-control::-moz-placeholder {color: #000;font-style:normal;letter-spacing:0.6px;}
.form-control:focus {border-color: #000;box-shadow: none;outline: 0 none;}

.form-control.sm{width:120px;}
.help-block{font-size:12px;}


@media(max-width:767px) {

}

.m-t-20{
	margin-top:20px;
}
.m-t-40{
	margin-top:40px;
}
.padding0{
	padding:0;
}

#masonry {
  column-count: 2;
  column-gap: 1em;
}

@media(min-width: 30em) {
  #masonry {
    column-count: 3;
    column-gap: 1em;
  }
}

@media(min-width: 40em) {
  #masonry {
    column-count: 4;
    column-gap: 1em;
  }
}

@media(min-width: 60em) {
  #masonry {
    column-count: 5;
    column-gap: 1em;
  }
}

@media(min-width: 75em) {
  #masonry {
    column-count: 3;
    column-gap: 1em;
  }
}

.item {
  background-color: none;
  display: inline-block;
  margin: 0 0 1em 0;
  width: 100%;
  cursor: pointer;
}

.item img {
  max-width: 100%;
  height: auto;
  width: 100%;
  margin-bottom: -10px;
  
  /*idk why but this fix stuff*/
}

.item.active {
  animation-name: active-in;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}

.item.active:before {
  content: "+";
  transform: rotate(45deg);
  font-size: 48px;
  color: white;
  position: absolute;
  top: 20px;
  right: 20px;
  background-color:rgba(0,0,0,0.85);
  border-radius: 50%;
  width:48px;
  height:48px;
  text-align:center;
  line-height:48px;
  z-index:12;
}

.item.active img {
  animation-name: active-in-img;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}
