.cover .ios-cross {
	color: #777;
	font-size:21px;
	position: absolute; 
	display: block;
	padding: 7px 10px;
	right:0; 
	top: 0;

}

.cover {
    background: rgba(255, 255, 255, 0.5);
    position: fixed;
    display: none;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}

.cover-on .cover {
	display: table;
	z-index: 10;	
}

.cover-holder {
    display: table-cell;
	vertical-align: middle;
    position: relative;
	padding: 15px;
}
.cover-center {
	width: 100%; 
	max-width: 600px; 
	border: 1px solid rgb(187, 187, 187); 
	box-shadow: 0px 0px 5px rgb(221, 221, 221); 
	margin: 0px auto; 
	display: block; 
	background:white; 
	position:relative; 
	padding:5px 20px;
}


/** MOdalul din partea dreapta */
.column-right {
 	background: white;
   
	position: absolute;
	right:0;
	top:0;
	padding:45px 0;
	color: #7b8994;
    font-size: 12px;
	overflow: hidden;
	height: 100%;
	max-height:100%;
	opacity: 0;
	width: 0;
	
}




.column-right {
	transition: all 250ms ease-out 0s;
	transform: translate(100%, 0);
}

.modal-on .column-right {
	border-left: 1px solid rgba(0,0,0,0.1);
	transition: all 250ms ease-out 0s;
	transform: translate(0,0);
	width: 330px;
	opacity: 1;
}


.column-right-holder {
    display: table;
    height: 100%;
    padding: 0 10px;
    width: 100%;
}

.modal-on .contents {
}


@media screen and ( max-width: 400px) {
	/** facem modalul full screen pentru mobile */	
	.column-right {
		padding: 0;
		z-index: 20 !important;
	}
    .modal-on .column-right {
		width: 100%; 
	}
}