/*TS Studio CSS*/

body{
    background: #e7e7e7;
}

.mainwrap{
    width: 95%;
    margin:0 auto;
}

.vinyet{
   background-image: url(../images/anchor/airbrush.jpg); 
  background-repeat: no-repeat;
  background-position-x: center; 
   background-position-y: -180px; 
   background-size: cover;  
   height: 240px;
   margin-bottom:-50px !important;
   padding: 0px !important;
   /* background-attachment: fixed; */
}


.blurb{
    background-color: #222;
    color:white;
    width:100%;
    height:100px;
}

.blurb h3{
 text-align: center;
 font-size: 1.75em;
 padding-top: 35px;
}


* {
box-sizing:border-box;
}

.heroGrid{
display:flex;
flex-wrap:wrap;
gap:20px;
width:100%;
/*justify-content: center;*/
}

.heroGrid img{
flex-grow: 1;
flex: 1 0 50%;
max-width:  calc(50% - 20px);
max-height: 500px;
object-fit:cover;
cursor: pointer;
}

.heroGridTag{
background:cyan;
min-width:100%;
flex:0 0 100%;


transition: all 0.4s ease-in-out;

}

.off{
display: none;
opacity: 0;
height: 0;
overflow: hidden;
flex: 0 0 100;
transition: all 0.4s ease-in-out;
}


@media only screen and (max-width: 800px) {

    .vinyet{
   background-position-x: center; 
   background-position-y: -10px; 
   background-size: cover;  
   height: 140px;
}


.heroGrid img{
flex-grow: 1;
flex: 1 0 100%;
max-width:  calc(100% - 5px);

}

}

@media only screen and (max-width: 600px) {

.blurb{
    font-size: .9em;
}

.blurb h3{
    padding:20px;
}

}