:root { --repeat_vidsHen: var(--vidsHen_repeat2); }
.contPerAll
{        
    width:100%;height:auto;
    display:grid;
    justify-items:center;
    align-items:start;
    grid-template-columns:auto;
    grid-template-rows:auto auto auto auto;
    background-color: var(--BGcolor2);
    padding:0px;margin:0px;
}
.contModelAll
{   
    /*max-width:1400px;*/      
    width:100%;height:auto;
    display:grid;
    justify-items:center;
    align-items:start;
    grid-template-columns:auto;
    grid-template-rows:auto;
    padding:0px;margin:0px;
}
.contModelName1, .contModelName3
{
    justify-self: center;
    display:grid;
    justify-content:start;
    justify-items:start;
    align-items:center;
    align-content:center;
    grid-template-rows:auto;
    grid-gap:15px;
    padding:15px 10px;
}
.contModelName1 { grid-template-columns:auto 560px; }
.contModelName3 { grid-template-columns:auto 560px; }
.contModelName2, .contModelName4
{
    display:grid;
    justify-content:start;
    justify-items:start;
    align-items:center;
    grid-gap:7px;
    grid-template-columns:auto auto;
    grid-template-rows:auto;
}

.infoTop, .infoTop2
{
    width:100%;
    display: grid;
    grid-gap: 7px;
    padding: 7px 10px;
    margin:0px 0px 0px 0px;
    align-items: center;
    background-color:unset; /*var(--BGcolor1)*/;
    color:var(--textColor1);
}
.infoTop2{ font-size:18px; }
.contGalPics
{
    width:100%;
    height:100%;
    display: grid;
    justify-content:center;
    align-items:center;
    padding:0px 10px; 
    margin:0px;
    /*
    max-width:1640px;        
    width:100%;
    display:grid;
    grid-template-columns:auto auto auto auto;
    grid-template-rows:auto;
    grid-gap:2px;
    */
}
.divVidRatio
{
    /*1280 x 720*/
    max-width:1400px;
    max-height:788px;
    width:100%;
    height:100%;
    vertical-align:top;
}
.vidMinWith{ min-height:619px;min-width:1100px; }
.contPerData
{         
    width:100%;height:auto;
    display:grid;
    justify-items:center;
    align-items:start;
    grid-template-columns:auto;
}
.contPerBioSide
{
    display:grid;
    justify-items:center;
    align-items:start;
    align-content:start;
}
.performerName { font-size:20px; color:var(--textColor1); }
.hartIcon1
{
    width:30px;height:30px;
    border-radius: 8px;
    background-color: var(--iconsColorBg); 
    border: 1px solid var(--iconsColorBor);
    text-align:center;
    color:var(--iconsColor);
    padding-top:6px;
    font-size:16px;
}
.contPerBio
{    
    max-width:var(--vidWidth1);    
    width:100%;height:auto;
    padding:10px 0px;
    display:grid;
    grid-template-columns:114px auto;
    grid-template-rows:auto;
    grid-gap: 25px;
    color:var(--textColor1);
    background-color: var(--BGcolor2);
}
.textInfoBG_cont{
    width:100%;
    height:auto;
    display:grid;
    justify-items:center;
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}
.textInfoBG_cont2{
    max-width:1400px;
    width:95%;
    height:auto;
    margin:100px 10px;
}
.textInfoBG{
    width:100%;
    background-color:rgba(0,0,0, 0.9);  
    padding:35px 15px;
    border-radius:10px;
    color:var(--textColor1);
}
/*For special systems that have on the item info page the system categories links and tags links*/
.oneCatLink
{
    display:inline-block;
    min-width:100px;
    height:28px;
    border-radius: 8px;
    background-color: var(--sysMenuBgColorA1); 
    border: 1px solid var(--sysMenuBorderColor);
    text-align:center;
    line-height:24px;
    color:var(--sysMenuColorA);
    padding:0px 6px;
    margin:5px;
}
.oneCatLink:hover{ background-color:var(--sysMenuBgColAhover); }
.oneTagLink
{
    display:inline-block;
    min-width:100px;
    height:28px;
    border-radius: 8px;
    background-color: var(--iconsColorBg); 
    border: 1px solid var(--iconsColorBor);
    text-align:center;
    line-height:24px;
    color:var(--iconsColor);
    padding:0px 6px;
    margin:5px;
}
.oneTagLink:hover{ background-color:var(--iconsColorBgHo); border-color:var(--iconsColorBorHo);color:var(--iconsColorText); }
/*stackoverflow.com/questions/26421274/css-circular-cropping-of-rectangle-image*/
.image-cropper {
    display:block;
    text-decoration:none;
    width: 100px;
    height: 100px;
    position: relative;
    overflow: hidden;
    border-radius: 30%;
    border: 3px solid var(--borderColor1);
    margin-bottom:10px;
}
.image-cropper:hover { border-color:var(--bColor1hover); }
.image-cropper img {
    position: absolute;
    left:-15px;
    display: inline;
    margin: 0 auto;
    width: auto;
    height: 100%;
}
/*-----------------start for thumb anime css------------------*/
/*
.oneGalPic{
    display: block;   
    width:100%;
    border:2px solid var(--borderColor1);
}
.oneGalPic:hover { border-color:var(--bColor1hover); } 
*/
.oneGalPic
{
    min-width:590px;
    border-radius: 0px !important;
    box-shadow: 0px 0px 0px 0px #ffffff;
    transition: box-shadow 0.2s ease-out;
}
.oneGalPic:hover{ 
    box-shadow: 0px 0px 0px 2px #000000;
}
.galleryMain img{ opacity:0; }
@keyframes fadeIn {
    0% {
        opacity: 0.1;
    }

    100% {
        opacity: 1;
    }
}
/*-----------------end for thumb anime css------------------*/
@media only screen and (max-width: 1150px) {
    .vidMinWith{ min-height:unset;min-width:unset; }
}
@media only screen and (max-width: 1000px) {
    .contModelName4{ display:none; }
    .grAreaMchat2 { grid-area: mChat2; }
    .contModelName1, .contModelName3
    {
        width:100%;
        justify-content:center;
        justify-items:center;
        grid-template-columns:auto;
        grid-template-rows:auto auto;
        grid-gap:8px;
    }
    .topLinkChat { justify-self:center; }
    .textInfoBG_cont2{
        width:95%;
        margin:200px 0px;
    }
}
@media only screen and (max-width: 800px) {
    .infoTop { display:grid; }
    .sLinkHome { display:none; }
}
@media only screen and (max-width: 450px) {
    .contPerBio { grid-gap: 10px; }
}