.view {
   width:22%;
   height: auto;
   margin: 0 20px 20px 0;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
}
.view .mask,.view .content {
   width: 100%;
   height:100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
   width:100%; height:auto;
   -webkit-box-shadow: 1px 1px 15px #000000;
   -moz-box-shadow: 1px 1px 15px #000000;
   box-shadow: 1px 1px 15px #000000;
   

}
@media all and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), 
only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
.view { width:30%;}
}
@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 768px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 768px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 768px), only screen and (min-device-pixel-ratio: 2) and (max-width: 768px), 
only screen and (min-resolution: 192dpi) and (max-width: 768px), only screen and (min-resolution: 2dppx) and (max-width: 768px) {
.view { width:30%;}
}
@media all and (max-width: 659px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:659px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:659px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:659px), only screen and (min-device-pixel-ratio: 2) and (max-width:659px), 
only screen and (min-resolution: 192dpi) and (max-width:659px), only screen and (min-resolution: 2dppx) and (max-width:659px) {
.view { width:28%;}
}
@media all and (max-width: 640px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:640px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:640px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:640px), only screen and (min-device-pixel-ratio: 2) and (max-width:640px), 
only screen and (min-resolution: 192dpi) and (max-width:640px), only screen and (min-resolution: 2dppx) and (max-width:640px) {
.view { width:28%;}
}

@media all and (max-width: 480px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:480px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:480px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:480px), only screen and (min-device-pixel-ratio: 2) and (max-width:480px), 
only screen and (min-resolution: 192dpi) and (max-width:480px), only screen and (min-resolution: 2dppx) and (max-width:480px) {
.view {  width:45%;}
}
@media all and (max-width: 459px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:459px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:459px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:459px), only screen and (min-device-pixel-ratio: 2) and (max-width:459px), 
only screen and (min-resolution: 192dpi) and (max-width:459px), only screen and (min-resolution: 2dppx) and (max-width:459px) {
.view {  width:40%;height:auto}
}

@media all and (max-width: 411px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:411px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:411px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:411px), only screen and (min-device-pixel-ratio: 2) and (max-width:411px), 
only screen and (min-resolution: 192dpi) and (max-width:411px), only screen and (min-resolution: 2dppx) and (max-width:411px) {
.view {  width:80%; height:auto}
}

@media all and (max-width: 320px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width:320px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width:320px), 
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width:320px), only screen and (min-device-pixel-ratio: 2) and (max-width:320px), 
only screen and (min-resolution: 192dpi) and (max-width:320px), only screen and (min-resolution: 2dppx) and (max-width:320px) {
.view {  width:95%;}
}
