.artist-separator-line {
clear: both;
margin-bottom: 55px;
margin-top: 40px;
border-bottom: 1px solid #fff;
}
.artist-overview-wrapper { width: 100%;
}
.realization-base-info {
width: 100%;
min-height: 201px;
display: block;
}
.realization-base-info .artist-name {
text-align: left;
padding: 60px 0 40px 0;
text-transform: uppercase;
margin-left: 12%;
font-size: 22px !important;
font-size: 32px !important;
}
.realization-info-text {
color: #fff;
margin-left: 12%;
padding-bottom: 55px;
}
.realization-info-text p {
padding: 0;
}
.box-artist-bg {
background-color: #a2a2a2;
}
.realization-profile .entry-image img {
position: absolute;
left: -600px;
}
.artist-overview-wrapper .inner-wrapper, .realization-profile .inner-wrapper {
position: absolute;
bottom: 0;
width: 100%;
transition: opacity .25s ease-out;
background: rgba(220, 220, 200, 0.7);
padding: 8px 0;
}
.artist-overview-wrapper .inner-wrapper {
opacity: 0;
}
.artist-overview-wrapper img {
position: absolute;
top: -50%;
bottom: -50%;
margin: auto;
width: 100%;
height: auto;
min-height: 100%;
}
.artist-box:hover .inner-wrapper {
opacity: 1;
}
.artist-overview-wrapper .inner-wrapper:before {
content: " ";
display: inline-block;
height: 100%;
width: 1%;
vertical-align: middle;
}
.box-text {
background: #000;
}
.box-text p {
padding-bottom: 4px;
padding-left: 15px;
letter-spacing: -1px;
}
.box-text p:first-child {
margin-top: 30%;
}
.realization-profile h1, .realization-profile h2,
.artist-overview-wrapper h1, .artist-overview-wrapper h2 {
vertical-align: middle;
display: inline-block;
text-align: center;
color: #0c0c0c !important;
font-weight: normal;
width: 90%;
font-size: 20px;
margin: 0 0 0 4%;
text-transform: uppercase;
}
.artist-box h1, .artist-box h2 {
position: relative;
top: 20px;
opacity: 0;
transition: all .2s;
}
.artist-box:hover h1, .artist-box:hover h2 {
opacity: 1;
top: 0;
}
.artist-overview-wrapper p {
font-size: 15px;
margin-bottom: 0 0 10px 15px;
}
.artist-box, .artist-box-single {
position: relative;
overflow: hidden;
padding-top: 17.5%;
width: 17.5% !important;
background-size: cover;
background-position: center 14%;
background-repeat: none;
display: block;
float: left;
}
.artist-box:nth-child(4n + 1), .artist-box-single:nth-child(4n + 1) {
margin: 0 1% 2% 12%;
}
.artist-box:nth-child(4n + 2), .artist-box-single:nth-child(4n + 2),
.artist-box:nth-child(4n + 3), .artist-box-single:nth-child(4n + 3) {
margin: 0 1% 2% 1%;
}
.artist-box:nth-child(4n + 4), .artist-box-single:nth-child(4n + 4) {
margin: 0 12% 2% 1%;
}
@media all and ( max-width: 1000px ) {
.artist-box, .artist-box-single {
padding-top: 24.5%;
width: 23% !important;
}
.artist-box:nth-child(3n + 1), .artist-box-single:nth-child(3n + 1) {
margin: 0 1% 2% 12%;
}
.artist-box:nth-child(3n + 2), .artist-box-single:nth-child(3n + 2) {
margin: 0 1% 2% 1%;
}
.artist-box:nth-child(3n + 3), .artist-box-single:nth-child(3n + 3) {
margin: 0 12% 2% 1%;
}
} .realization-profile {
width: 100%;
}
.realization-profile .inner-wrapper-text {
height: 100%;
position: absolute;
top: 0;
width: 100%;
}
.realization-profile .inner-wrapper-text p {
padding-right: 10px;
}
.realization-profile .inner-wrapper:before {
content: " ";
display: inline-block;
height: 100%;
width: 1%;
vertical-align: middle;
}
.artist-column-info {
}
.artist-box img {
left: -4000px;
}
@media all and ( max-width: 600px ) {
.artist-box, .artist-box-single {
height: auto;
width: 90% !important;
padding-top: 90%;
float: none;
margin: 5% !important;
max-width: 360px;
}
.artist-box h2 {
padding: 9px 5px 11px !important;
line-height: 24px;
}
.artist-overview-wrapper .inner-wrapper {
top: auto;
bottom: 0;
height: auto;
opacity: 1;
}
.artist-overview-wrapper {
max-width: 360px;
margin: 0 auto;
float: none;
position: relative;
}
.artist-box h1, .artist-box h2 {
opacity: 1;
top: 0;
}
}
@media all and ( max-width: 1060px ) {
.box-text p:first-child {
margin-top: 10px !important;
}
}
.origin-image-box {
position: relative;
overflow: hidden;
padding-top: 250px;
width: 90% !important;
max-width: 250px;
max-height: 250px;
background-size: cover;
background-position: 50% 50%;
background-repeat: none;
display: block;
margin-top: 20px;
}
.origin-image-box img {
position: absolute;
left: -1000px;
width: 100%;
height: 100%;
}