/* Basic styles for the modals */
.modal {
    display: none;
    position: absolute;/*fixed*/
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    /*overflow-y: auto;*/ /* Allow scrolling if content overflows */
}

.modal-content {
    position: relative;/*relative*/
    margin: 135px auto 0px auto;
    top: 0px;
    padding: 0px;
    background-color: transparent;/*white*/
    /*width: 100%;*/
    width: 960px;
	height:auto;
	max-width: 960px;
    animation: slideDown 0.5s ease-in-out;
}

/* Animation from the top */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

/* Close button styles */
.close {
    /*position: absolute;
    top: 0px;
    right: 0px;
	width:120px;
	height:60px;
	cursor: pointer;*/
		background:#000000;
		color:#ffffff;
		font-size:30px;
		position: absolute;
		padding:20px;
		text-align:center;
		top: 0px;
		right: 0px;
		cursor: pointer;
		} 

.modal-content{width:100%; background:#ffffff; padding:20px}
.modal-content-container{width:100%; -webkit-justify-content:space-between; justify-content:space-between; -webkit-flex-wrap:wrap; flex-wrap:wrap}

@media (max-width:992px){
	.modal{padding:0px 0px}
	.modal-content{
	margin: 135px auto 0px auto;
	width:100%;
	height: auto;
	max-width: 350px;
	}
	.modal-content .close{padding:15px;right:0px}
	}
@media (min-width:993px){
	
	.modal{padding:0px}/*16.66%*/
	.modal-content .close{right:0px}
	}