/*= Reset CSS 
============= */



.btn:hover{background-color: transparent;color:#fff;transition: 0.4s; text-decoration:none;}
.text-desc{position: absolute; left: 0; top: 0; background-color:rgba(164,0,13,0.85); height: 100%; opacity: 0; width: 100%;}
.sypro_txt{position: absolute;z-index:99999;text-align:center;height: 100%;width: 100%;}
.sypro_txt .img0{margin-top:40%;}
.sypro_txt .txt0{font-size:16px;color:#fff;padding-top:10px;}
.sypro_txt a:hover{text-decoration:none;}
.port-1 .image-bg{position: absolute; background-color:rgba(0,0,0,0.3); width:100%; height:100%;}
/*= Reset CSS End
================= *

/* effect-1 css */

.port-1{float: left;width: 30%;position: relative;overflow: hidden;text-align: center; margin:1.5%;}
.port-1 .text-desc{opacity: 0.9; top: -100%; transition: 0.5s; color: #000;}
.port-1 .text-desc h3 { font-size: 25px;font-weight: bold;color: #FFF;}
.port-1 .image-box img{ max-width:100%; height:auto !important; height:100%;transition:all 1s;}
.port-1:hover .image-box img{transform:scale(1.2,1.2);transform-origin:center center}

.port-1.effect-1:hover .text-desc{top: 0; }
.port-1.effect-2 .text-desc{top: auto; bottom: -100%;}
.port-1.effect-2:hover .text-desc{bottom: 0;}

.port-1.effect-2 .text-desc h3{padding-top:13px; font-size:18px; font-weight:100;}
.port-1.effect-2:hover .text-desc h3{padding-top:100px;font-size: 25px;font-weight: bold;}
.mt58{padding-top:25px;}


/* effect-1 css end */