File: D:/HostingSpaces/MBoogaard/oosting-horseriding.com/wwwroot/oosting/media/system/galery/galery.css
.five-photo-wrapper {
position: relative;
overflow: auto;
overflow-y: hidden;
}
.five-photo-wrapper > a:nth-of-type(1),
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3),
.five-photo-wrapper > a:nth-of-type(4),
.five-photo-wrapper > a:nth-of-type(5),
.photos-to-show a {
display: inline-block;
float: left;
margin: 0 0 0 0;
}
.five-photo-wrapper a, .photos-to-show a {
background-size: cover !important;
display:inline-block !important;
background-position:top center !important;
}
.five-photo-wrapper > a:nth-of-type(1) {
width: 66%;
margin: 0 0.4% 0 0;
height: 0px;
-moz-transition: all ease 400ms;
-o-transition: all ease 400ms;
-webkit-transition: all ease 400ms;
transition: all ease 400ms;
overflow: hidden;
}
.five-photo-wrapper > a:nth-of-type(5),
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a,
.gallery-expander {
width: 16.2%;
}
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3) {
margin-bottom: 0.4%;
}
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a {
margin-right: 0.4%;
}
.gallery-expander {
display: inline-block;
position: relative;
cursor: pointer;
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
.blue-bg {
position: absolute;
background: rgba(182, 111, 58, 0.9);
z-index: 100;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align: center;
}
.blue-bg span {
display: inline-block;
color: white;
text-transform: uppercase;
font-size: 16px;
position: absolute;
font-weight: bold;
line-height: 1.8;
left: 50%;
margin-left: -53px;
top: 50%;
margin-top: -28px;
text-align:center;
}
.photos-to-show {
width: 100%;
height:auto;
overflow: hidden;
-moz-transition: all ease-out 1500ms;
-o-transition: all ease-out 1500ms;
-webkit-transition: all ease-out 1500ms;
transition: all ease-out 1500ms;
position: relative;
}
.photos-to-show-height{
width: 100%;
overflow: hidden;
position: relative;
}
.gallery-expander > a {
float: left;
width: 100%;
}
@media only screen and (max-width: 900px) {
.five-photo-wrapper > a:nth-of-type(5),
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a, .gallery-expander {
width: 24.62%;
margin: 0.5% 0 0 0;
}
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a {
margin-right: 0.5%;
}
.photos-to-show a:nth-of-type(4n + 4) {
margin-right: 0;
}
.five-photo-wrapper > a:nth-of-type(1) {
width: 100%;
margin: 0;
}
}
@media only screen and (max-width: 620px) {
.five-photo-wrapper > a:nth-of-type(5),
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(3),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a, .gallery-expander {
width: 49.5%;
margin: 1% 0 0 0;
}
.five-photo-wrapper > a:nth-of-type(2),
.five-photo-wrapper > a:nth-of-type(4),
.photos-to-show a {
margin-right: 1%;
}
.photos-to-show a:nth-of-type(2n + 2) {
margin-right: 0;
}
.five-photo-wrapper > a:nth-of-type(1) {
width: 100%;
}
}