.view {width:204px;height:190px;float: left;overflow: hidden;position: relative;text-align: center;box-shadow: 0px 0px 5px #aaa;cursor: default;}
.view .mask, .view .content {width:100px;position:absolute;overflow:hidden;top: 50px;}
.view img {display: block;position: relative; margin:10px 0 10px 35px;}
.view a.info {background:url(../img/link.png) center no-repeat;display: inline-block;text-decoration: none;padding:0;text-indent:-9999px;width:20px;height:20px;}

.fourth-effect .mask {position:absolute;top:50px;left:50px;cursor:pointer;border-radius:50px;border-width:50px;display:inline-block;height: 100px;width: 100px;
	border: 50px solid rgba(0, 0, 0, 0.7);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;
	opacity:0.8;visibility:visible;
	-moz-transform:scale(4);-webkit-transform:scale(4);-o-transform:scale(4);-ms-transform:scale(4);transform:scale(4);
	-moz-transition:all 0.4s ease-in-out;-webkit-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;-ms-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;}
.fourth-effect:hover .mask {opacity: 0;border:0px solid rgba(0,0,0,0.7);visibility:hidden;}
.fourth-effect .mask_top {position:absolute;top:50px;left:50px;cursor:pointer;border-radius:50px;border-width:50px;display:inline-block;height: 100px;width: 100px;
	border: 50px solid rgba(0, 0, 0, 0.7);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;
	opacity:0.8;visibility:visible;
	-moz-transform:scale(4);-webkit-transform:scale(4);-o-transform:scale(4);-ms-transform:scale(4);transform:scale(4);
	-moz-transition:all 0.4s ease-in-out;-webkit-transition:all 0.4s ease-in-out;-o-transition:all 0.4s ease-in-out;-ms-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;}
.fourth-effect:hover .mask_top {opacity: 0;border:0px solid rgba(0,0,0,0.7);visibility:hidden;}

.rd1{background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:215px; left:3px;display:none;}
.rd2{background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:215px; left:3px;display:none;}
.rd3{background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:-23px; left:3px;display:none;}
.rd4{background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:-23px; left:4px;display:none;}
.box1:hover .rd1{display:block;}
.box2:hover .rd2{display:block;}
.box3:hover .rd3{display:block;}
.box4:hover .rd4{display:block;}
.dot1{ position:absolute; height:18px; width:18px; bottom:-43px; left:3px; }
.dot2{ position:absolute; height:10px; width:10px; bottom:234px; right:217px;}
.dot3{ position:absolute; height:10px; width:10px; bottom:234px; left:108px;}
.dot4{ position:absolute; height:10px; width:10px; bottom:234px; left:330px;}
.dot1:hover .mask_top, .dot2:hover .mask_top, .dot3:hover .mask_top, .dot4:hover .mask_top{opacity: 0;border:0px solid rgba(0,0,0,0.7);visibility:hidden; cursor:pointer;} 
.dot1:hover .mask_top {opacity: 0;border:0px solid rgba(0,0,0,0.7);visibility:hidden; }
.dot2:hover { cursor:pointer;background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:215px; left:3px;display:none;}
.dot3:hover { cursor:pointer; background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:-23px; left:3px;display:none;}
.dot4:hover { cursor:pointer; background:url(../images/round-image.png) no-repeat; position:absolute; width:18px; height:18px; top:-23px; left:4px;display:none;}