.pink-oval-frame{
width: 330px;
margin: 0 auto;
}
.pink-oval-frame .image-frame{
position: relative;
z-index: 2;
}
.pink-oval-frame .solid-image{
width: 210px;
height: 330px;
top: 52px;
left: 60px;
position: absolute;
z-index: 1;
object-fit: cover;
-webkit-mask-image: url(//seymourhouse.co.uk/wp-content/themes/seymourhouse/blocks/frames/images/oval-img-shap.png);
mask-image: url(//seymourhouse.co.uk/wp-content/themes/seymourhouse/blocks/frames/images/oval-img-shap.png);
-webkit-mask-size: 100%;
mask-size: 100%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
transform: rotate(-1deg);
}
@media(min-width: 768px){
.pink-oval-frame{
width: 330px;
margin: 0;
}
.pink-oval-frame .solid-image{
width: 204px;
height: 330px;
top: 56px;
left: 60px;
}
}
@media(min-width: 992px){
.pink-oval-frame{
width: 367px;
}
.pink-oval-frame .solid-image{
width: 234px;
height: 314px;
top: 56px;
left: 64px;
}
}.purple-box-frame{
width: 351px;
margin: 0 auto;
}
.purple-box-frame .image-frame{
position: relative;
z-index: 2;
}
.purple-box-frame .solid-image{
width: 270px;
height: 320px;
top: 50%;
left: 50%;
transform: translate(-50% ,-50%);
position: absolute;
z-index: 1;
object-fit: cover;
border-radius: 10px;
}
@media(min-width: 768px){
.purple-box-frame{
margin: 0;
}
}.pink-outline-box-frame{
width: 350px;
margin: 0 auto;
}
.pink-outline-box-frame .image-frame{
position: relative;
z-index: 2;
}
.pink-outline-box-frame .solid-image{
width: 260px;
height: 240px;
position: absolute;
z-index: 1;
object-fit: cover;
border-radius: 10px;
top: 50%;
left: 50%;
transform: translate(-50% ,-50%);
}
@media(min-width: 768px){
.pink-outline-box-frame{
width: 307px;
}
.pink-outline-box-frame .solid-image{
width: 220px;
height: 220px;
}	
}
@media(min-width: 992px){
.pink-outline-box-frame{
width: 407px;
margin: 0;
}
.pink-outline-box-frame .solid-image{
width: 300px;
height: 280px;
}	
}.lime-green-round-frame{
width: 350px;
margin: 0 auto;
}
.lime-green-round-frame .image-frame{
position: relative;
z-index: 2;
}
.lime-green-round-frame .solid-image{
width: 270px;
height: 270px;
position: absolute;
z-index: 1;
object-fit: cover;
border-radius: 50% 50% 50% 50% / 50% 50% 50% 50% ;
top: 50%;
left: 50%;
transform: translate(-50% ,-50%);
}
@media(min-width: 992px){
.lime-green-round-frame{
width: 375px;
margin: 0;
}	
}