/*====================================
=            Modal window            =
====================================*/

.modal-header {
	border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
.modal-header h2 {
	margin-top: 10px;
}


#product-modal .modal-header {
	padding: 0;
	border-bottom:none;
}
#product-modal .modal-body h3{
	margin: 0;
}
#product-modal .modal-header img{
	border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
#product-modal .modal-body {
	padding-bottom:0;
}

#product-modal .modal-footer {
	border:0;
}

#product-modal form p {
  margin: 0;
}

#product-modal .form-group {
	margin-bottom: 15px;
}


.close-modal {
  position: absolute;
  top:18px;
  height: 50px;
  width: 50px;
  z-index: 200;
  border-radius: 50%;
  right: 15px;
  background-color: #202020;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;

}
.close-modal:hover {
  background-color: #F7C723;

}
.close-modal:hover .menu-icon:after,
.close-modal:hover .menu-icon:before{
    background-color: #202020;
} 
.close-modal .menu-icon {
  /* this span is the central line in the menu menu */
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 18px;
  height: 2px;
  /*background-color: #FFFFFF;*/
 background-color: rgba(255, 255, 255, 0);

  /* these are the upper and lower lines in the menu menu */
}

.close-modal .menu-icon::before, .close-modal .menu-icon:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: inherit;
  left: 0;

  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /* apply transition to transform property */
  -webkit-transition: -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  transition: transform .3s;
}
.close-modal .menu-icon::before {
  /*bottom: 0;*/
  background-color: #FFF;
   -webkit-transform: translateY(0) rotate(45deg);
  -moz-transform: translateY(0) rotate(45deg);
  -ms-transform: translateY(0) rotate(45deg);
  -o-transform: translateY(0) rotate(45deg);
  transform: translateY(0) rotate(45deg);
}
.close-modal .menu-icon::after {
  /*top: 0;*/
  background-color: #FFF;
  -webkit-transform: translateY(0) rotate(-45deg);
  -moz-transform: translateY(0) rotate(-45deg);
  -ms-transform: translateY(0) rotate(-45deg);
  -o-transform: translateY(0) rotate(-45deg);
  transform: translateY(0) rotate(-45deg);
}


/*-----  End of Modal window  ------*/