#mainwrapper {  
      font: 10pt normal Arial, sans-serif;  
      height: auto;  
      margin: 0;  
      text-align: center;  
      width: 960px;  
    }  

    #mainwrapper .box {  
        border: 1px solid #e5e5e5;  
        cursor: pointer;  
        height: 82px;  
        float: left;  
        position: relative;  
        overflow: hidden;  
        width: 219px;  
		margin-left:25px; margin-top:12px

    }  
      
    #mainwrapper .box img {  
        position: absolute;  
        left: 0;  
 
    }  
    #mainwrapper .box .caption {  
        background-color: rgba(0,0,0,0.6);  
        position: absolute;  
        color: #fff;  
        z-index: 100;  
        left: 0;  
    }  
    #mainwrapper .box .simple-caption {  
        height: 30px;  
        width: 219px;  
        display: block;  
        bottom: -30px;  
        line-height: 25pt;  
        text-align: center;  
    }  
    #mainwrapper .box .full-caption {  
        width: 170px;  
        height: 170px;  
        top: -200px;  
        text-align: left;  
        padding: 15px;  
    }  
    #mainwrapper .box .fade-caption, #mainwrapper .box .scale-caption {  
        opacity: 0;  
        width: 219px;  
        height: 82px;  
        text-align: center;  
        padding-top: 30px
    } 
   /** Caption 4: Slide **/  
    #mainwrapper .box .slide-caption {  
        width: 170px;  
        height: 170px;  
        text-align: left;  
        padding: 15px;  
        left: 200px;  
    }  

    #mainwrapper #box-5.box .rotate-caption {  
        width: 170px;  
        height: 170px;  
        text-align: left;  
        padding: 15px;  
        top: 200px;  
        -moz-transform: rotate(-180deg);  
        -o-transform: rotate(-180deg);  
        -webkit-transform: rotate(-180deg);  
        transform: rotate(-180deg);  
    }  
      
    #mainwrapper .box .rotate {  
        width: 200px;  
        height: 400px;  
        -webkit-transition: all 300ms ease-out;  
        -moz-transition: all 300ms ease-out;  
        -o-transition: all 300ms ease-out;  
        -ms-transition: all 300ms ease-out;  
        transition: all 300ms ease-out;  
    }  
    #mainwrapper .box .scale-caption h3, #mainwrapper .box .scale-caption p {  
        position: relative;  
        left: -200px;  
        width: 170px;  
        -webkit-transition: all 300ms ease-out;  
        -moz-transition: all 300ms ease-out;  
        -o-transition: all 300ms ease-out;  
        -ms-transition: all 300ms ease-out;  
        transition: all 300ms ease-out;  
    }  
      
    #mainwrapper .box .scale-caption h3 {  
        -webkit-transition-delay: 300ms;  
        -moz-transition-delay: 300ms;  
        -o-transition-delay: 300ms;  
        -ms-transition-delay: 300ms;  
        transition-delay: 300ms;  
    }  
      
    #mainwrapper .box .scale-caption p {  
        -webkit-transition-delay: 500ms;  
        -moz-transition-delay: 500ms;  
        -o-transition-delay: 500ms;  
        -ms-transition-delay: 500ms;  
        transition-delay: 500ms;  
    }  
    #mainwrapper .box:hover .simple-caption {  
        -moz-transform: translateY(-100%);  
        -o-transform: translateY(-100%);  
        -webkit-transform: translateY(-100%);  
        transform: translateY(-100%);  
    }  
#mainwrapper .box:hover .full-caption {  
    -moz-transform: translateY(100%);  
    -o-transform: translateY(100%);  
    -webkit-transform: translateY(100%);  
    transform: translateY(100%);  
}   
    #mainwrapper .box:hover .fade-caption {  
        opacity: 1;  
    }  
    #mainwrapper .box:hover .slide-caption {  
      background-color: rgba(0,0,0,1) !important;  
      -moz-transform: translateX(-100%);  
      -o-transform: translateX(-100%);  
      -webkit-transform: translateX(-100%);  
      opacity: 1;  
      transform: translateX(-100%);  
    }  
	
    #mainwrapper .box:hover img#image-4 {  
      -moz-transform: translateX(-100%);  
      -o-transform: translateX(-100%);  
      -webkit-transform: translateX(-100%);  
      transform: translateX(-100%);  
    }  
	
    /** Rotate Caption :hover Behaviour **/  
        #mainwrapper .box:hover .rotate {  
        background-color: rgba(0,0,0,1) !important;  
        -moz-transform: rotate(-180deg);  
        -o-transform: rotate(-180deg);  
        -webkit-transform: rotate(-180deg);  
        transform: rotate(-180deg);  
    }  
	
#mainwrapper .box:hover #image-6 {  
   -moz-transform: scale(1.4);  
   -o-transform: scale(1.4);  
   -webkit-transform: scale(1.4);  
	transform: scale(1.4);
}


    #mainwrapper .box:hover .scale-caption h3,#mainwrapper .box:hover .scale-caption p {  
        -moz-transform: translateX(200px);  
        -o-transform: translateX(200px);  
        -webkit-transform: translateX(200px);  
        transform: translateX(200px);  
	
    }    
	
#mainwrapper .box:hover .fade-caption, #mainwrapper .box:hover .scale-caption {
    opacity: 1;
}