Cloud zoom not working with enfold and woocommerce

Hi Enfold Team,
The cloud zoom is hiding under the description area.
Help would be greatly appreciated.
Regards,
Kayzel

Private content link is as provided below.

CSS Codes utilized:

#av-overlay-wrap {
background: url("http://www.mylittlestorybox.com/wp-content/uploads/2014/12/pastel-pink-background-temp.jpg") !important;
}

.main_color .avia_cart, .main_color form, .main_color .avia_cart, .main_color form, .main_color tr:nth-child(odd) { background-color: white; }

#top .woocommerce-message{
padding:1em 1em 1em 3.5em!important;
margin:0 0 2em!important;
position:relative;
-webkit-border-radius:0px;
border-radius:0px;
background:#ffffff;
background-color: transparent !important;
border: 0px;
background:-webkit-gradient(linear,left top,left bottom,from(#ffffff),to(#ffffff));
background:-webkit-linear-gradient(#ffffff,#ffffff);
background:-moz-linear-gradient(center top,#ffffff 0,#ffffff 100%);
background:-moz-gradient(center top,#ffffff 0,#ffffff 100%);
color:#000000 !important;
text-shadow:0 1px 0 #fff;
list-style:none outside!important;*zoom:1;width:auto;
-webkit-box-shadow:inset 0 -2px 6px rgba(0,0,0,.05),inset 0 -2px 30px rgba(0,0,0,.015),inset 0 1px 0 #fff,0 1px 2px rgba(0,0,0,.3);box-shadow:inset 0 -2px 6px rgba(0,0,0,.05),inset 0 -2px 30px rgba(0,0,0,.015),inset 0 1px 0 #fff,0 1px 2px rgba(0,0,0,.3)
}

.main_color .avia_cart, .main_color form, .main_color .avia_cart, .main_color form, .main_color tr:nth-child(odd) {
background-color: white !important;
background-image: url("http://www.mylittlestorybox.com/wp-content/uploads/2014/12/pastel-pink-background-temp.jpg");
}

.cloud-zoom-big {
	border:4px solid #ccc;
	overflow:scroll !important;
        z-index: 99999999 !important;
}

.four.units.single-product-main-image {
overflow: visible !important;
}

. single-product #av_section_1 {
height: auto !important;
}

.title_container { 
display: none !important; 
}