// ---------------------------------------------------------------- // Project Specific: Browse Websites Gallery // ---------------------------------------------------------------- .website-Gallery{ list-style:none; padding:30px 24px; li{ @extend .col-25; float:left; margin-bottom:$spacing*2; color: #666; @include box-shadow(1px 1px 2px 0px rgba(0, 0, 0, 0.18)); @media (max-device-width:480px), screen and (max-width:800px){ width:50% } } // li a { // display:block; // } .site-info { a { color: #666; font-size: 80%; } .username { float: left; overflow: hidden; width: 70%; } .site-stats { float: right; overflow: hidden; width: 28%; text-align: right; } .site-tags { width: 100%; height: 1.4em; float: left; margin-top: -4px; } .site-tags .fa-tag { vertical-align: -2px; } .fa-user { margin-right: .45em; } } .title { margin-top: 8px; margin-bottom: 2px; white-space: nowrap; } &.int-Gall{ li { margin:0 .5% 12px; width:24%; background-color: white; border: 9px solid white; overflow: hidden; @media (max-width:1000px){ width:32% } @media (max-device-width:480px), screen and (max-width:800px){ width:49% } } &.suggestions { padding: .25em 0 0 0; li { margin: 0 1.33% 12px 0; width: 32%; @include box-shadow(1px 1px 2px 1px rgba(0, 0, 0, 0.1)); @media (max-width:1000px){ width:48% } } } } } .neo-SS, .z{ border: 4px solid #eee; display:block; height:auto!important; position:relative; width:100%; } .img-Holder{ -moz-background-size:cover!important; -webkit-background-size:cover!important; background-size:cover!important; display:block; border: 1px solid #eee; } .hp-Gallery img, .neo-Screen-Shot img{ width:100% } .hp-Gallery { padding: 0px; margin-bottom: 0; margin-left: 5.25%; li { width: 14.5%; margin-right: 1.5%; margin-bottom: 0; @media (max-device-width:480px), screen and (max-width:800px){ width:45%; margin-bottom: 8px; margin-right: 0; margin-left: 1.5%; } } li:last-child { margin-right: 0; } }