/*============================================================================================*/
/* Your custom styles below */
/*============================================================================================*/
@media(min-width:992px){
	
	.custom-form-img{
		-webkit-flex: 1 0 28%; 
		-ms-flex: 1 0 28%;
		flex: 1 0 28%;
	}
	
	.custom-form-fields{
		-webkit-flex: 1 0 15%; 
		-ms-flex: 1 0 15%;
		flex: 1 0 15%;
	}
	
	.flex-content{
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -moz-flex;
		display: -webkit-flex;
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		vertical-align: top;
		overflow: hidden;
	}
	
	.flex-content-img{
		position: relative;
		overflow: hidden;
	}
	
	.flex-content-img img{
		height: 100%;
	}
}


.custom-form .form-group select {
    height: 45px !important;
    padding-left: 40px;
    border: 0;
    border-radius: 0;
}



/*svg on message page */
.tick {
    stroke-dasharray: 29px;
    stroke-dashoffset: 29px;
    animation: draw .5s cubic-bezier(.25, .25, .25, 1) forwards;
    animation-delay: .6s
}

.circle {
    fill-opacity: 0;
    stroke: #28a745;
    stroke-width: 16px;
    transform-origin: center;
    transform: scale(0);
    animation: grow 1s cubic-bezier(.25, .25, .25, 1.25) forwards;   
}

@keyframes grow {
    60% {
        transform: scale(.8);
        stroke-width: 4px;
        fill-opacity: 0;
    }
    100% {
        transform: scale(.9);
        stroke-width: 8px;
        fill-opacity: 1;
        fill: #28a745;
    }
}

@keyframes draw {
    100% { stroke-dashoffset: 0; }
}



.svg-container {
    text-align: center;
    vertical-align: middle;
}

.container_msg {
    background-color: #fff;
    padding: 40px 30px;
    border: 1px dashed #28a745;
}