@font-face {
        font-family: LH-Thin;
        font-style: normal;
        font-weight: 400;
        src: url(/fonts/HelveticaNeue-Thin-c4a50243b7f41a6ed2d16b090483a543.woff) format("woff");
        src: url(/fonts/HelveticaNeue-Thin-5b0efc679168eb5d78eebe7212061141.woff2) format("woff2")
    }

    @font-face {
        font-family: LH-Light;
        font-style: normal;
        font-weight: 400;
        src: url(/fonts/HelveticaNeue-Light-cef69869851efdcb050f31ac6cdf44b4.woff) format("woff");
        src: url(/fonts/HelveticaNeue-Light-c3f666809fb755330402dd3a1aa4cf8b.woff2) format("woff2")
    }

    @font-face {
        font-family: LH-Love;
        font-style: normal;
        font-weight: 400;
        src: url(/fonts/HelveticaLove-6c4ccfe59572f59287d922622ce4774f.woff) format("woff");
        src: url(/fonts/HelveticaLove-0287c2c54b2118658f33d5cf921a1d08.woff2) format("woff2")
    }

    @font-face {
        font-family: LH-Thin-Italic;
        font-style: normal;
        font-weight: 400;
        src: url(/fonts/HelveticaNeue-ThinItalic-44c450432ace314de94ec214e0364f7f.woff) format("woff");
        src: url(/fonts/HelveticaNeue-ThinItalic-b19892c161fbfb8ce9612ec965a8cbbe.woff2) format("woff2")
    }
 
 
 body { font-family: LH-Light, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
    sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    
    }
  
  
  .hidden { display:none; transition: opacity 1s ease-out; }
     .iconbar { position:absolute; top: 20px; right:0px; width: 300px; text-align:right;  }
    
    .iconbar div { display: inline-block; }
    
    .navicon { margin-right: 20px; }
    .accounticon { margin-right: 20px; }
	.searchicon { margin-right: 20px; }  
	
	
.recommendations .searchicon { display:none; }

@media (min-width: 700px) {
.recommendations .searchicon { display:inline-block; }


}

    
.logoarea {  display:none; float: left; padding-top: 7px; margin-left:15px;   }
.logoarea img { max-width: 200px; }


.footer { position:fixed; line-height:18px; bottom:0px; left:0px; width: 100%; height: 158px;  border:0px solid #000; z-index:500; background:#FFF; padding-top:10px; }



.footer { display: none; }
.footer div { display:inline-block; border:0px solid #000;  width: 240px; vertical-align:top; }


.footer .lowerlogo img { max-width: 180px; }
.footer .lowerlogo { width: 320px; margin-right:15px; margin-left:15px; }

.footer .contactdetails { margin-right:25px; margin-left:15px; }

.footer .lowernav, .footer .ack { display:none;}
.container { border:1px solid #00F;}
 
 
 .detailscard .closecard { float:right; border:1px solid #CCC; top: 15px; right: 15px; width: 44px; height: 44px; background:none ;padding:7px; color:#333; }
 .detailscard { position: fixed; width: 100%; height:100%; top: 0; right: -2000px; padding-left:10px;  padding-top:10px; background:#FFF;  z-index:100;   transition: right 1s; overflow:auto; }
 
 .detailscard.contactcard {  transition: right 0s !important; /* Default. No transition */ }
 
 .valueitem { display:inline-block; margin-right: 10px; width: 100%;    }
 .valuedata { display:inline-block; margin-right: 10px; width: 60%; text-align:left;   }
 .valuetitle { width: 35%; display:inline-block; padding-left:0px; color:#000;   }
  .valuearea {  border:0px solid #000; margin-bottom:10px; margin-left: 10px;  }


@media (min-width: 1000px) {


.footer .lowernav, .footer .ack { display: inline-block; }
.footer .ack { width: 30%; }
}
 
 @media (min-width: 700px) {
 
 .valuearea {  position:absolute; font-size:24px; left:10px; top: 550px; width: 350px;   }

.valueitem { display:block; margin-right: 10px;    }


 .valuedata { display:inline; margin-right: 10px;   }
 .valuetitle {  display:inline; padding-left:0px;  }
 
 .valuearea .valueitem .valuetitle { display:block;  width: 100%; }
.valuearea .valueitem .valuedata { text-align:left; display:block; width: 100%; }

 
 .iconbar {  top: 8px;  }
 
 .logoarea img { max-width: 280px;}
 .logoarea {  display:none; float: left; padding-top: 7px; margin-left:15px; border:0px solid #000;   }
 .footer div { width: 20%;  }
 

.footer { display: none; border:0px solid #000;  }
.footer .lowerlogo { margin-right:35px;  }

.footer .contactdetails { margin-left:25px; width: 20%; min-width:200px; }
   
    .detailscard {
       min-width:600px;
       width:30%;
       padding-right:10px;
    }
}
 
 
 
 .navfooter { position:absolute; bottom:40px; left:27px;   display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px; }
 
 .navfooter .footeritem { font-size:14px; color:rgb(158, 158, 158);  }
 
.navigationcard .closecard { position: absolute;  top: 15px; right: 15px; width: 44px; height: 44px; background:#FFF;padding:10px; color:#333; }
 .navigationcard { position: fixed; width: 100%; height:100%; top: 0; right: -10000px; padding-left:10px;  padding-top:18px; background:#FFF;  z-index:10;   transition: right 1s; }
 
 @media (min-width: 700px) {
   
    .navigationcard {
       min-width:600px;
       width:72%;
       padding-right:10px;
    }
}

.navigationcard .navitem { font-family: LH-Thin; display:block; font-size:60px; color:#000; margin-left:15px; line-height: 1.1em; font-weight: 100; cursor:pointer; }
.navigationcard .navitem:hover { color:rgb(158, 158, 158); }


 .overlay { position: fixed; width: 100%; height:100%; top: 0; left:0; opacity: 1; background: #FFF; z-index:5; display:none;  }
 
  .overlay.grey {  background: #FFF; opacity: 0.8   }

 .header { height: 130px; border:0px solid #000; position:relative; 
/*  max-width:1920px; */ 
  }
 
 .mainbody { background: #FFF; }
 
.mheadenclosure { display: block }

.middleheader {  width:500px; margin-left:15px; margin-right:auto; margin-top:-8px; text-align:left;  color: rgb(0,0,0); font-size: 50px; font-weight:100;   }
.middleheader .rec { display:block;  font-family: LH-Thin; }

/* 
.recommendsfooter {
width:500px; margin-left:auto; margin-right:auto; text-align:center;  color: rgb(158, 158, 158); font-size: 60px; font-weight:200; border:1px solid #FFF;
 }
 */



.searchenclosure {  display:block; position:relative; width: 100%; clear:both; }
.searchenclosure .searcharea { width: 90%; margin-left: 10px; margin-top: 15px; padding:8px; }
 input.searcharea:focus { border:1px solid #000; }

@media (min-width: 700px) {
   
.mheadenclosure .middleheader .rec { display: block; }   
   .middleheader { display:block; position:absolute; text-align:left; top: 10px;  font-size:60px; border:0px solid #000;  }
   
   .searchenclosure {  display:block; position:absolute; text-align:left; top: 15px; left: 450px; border:0px solid #000;  }
   .searchenclosure .recommends {  margin-left:50px;   }
   .searchenclosure .searcharea { width: 300px; }
  
  
}



    .swiper {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .swiper-slide .recimage img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .favheart { width: 30px; height:30px; margin-right:15px; margin-left:0px; margin-bottom:10px;  float:left; }
    
    @media (min-width: 700px) {
    .favheart { width: 40px; height:40px; margin-right:5px; margin-left:0px; margin-top:10px;  position:absolute; bottom:0px; left:-4px; }
    }
    
    .favheart .favourited { display: none; }
    .favheart.chosen .empty { display:none; }
    .favheart.chosen .favourited { display: inline; }
   
  
    
    .imagedetails { color: #000; }
    .artistname { display:block; min-width: 500px; font-weight:300; font-size:24px; text-align:left; margin-top: 10px; }
    
    .artworkdetails p { font-size: 14px; font-family: LH-Thin; margin-bottom:0px; }
    .collectiongrid .artistname { margin-top: -9px; }
    .artworktitle { display:block; text-align:left; font-weight:400; font-size:14px; cursor:pointer; }
    .artworktitle { font-family: LH-Thin-Italic;  /* font-family:LH-Love; font-style:italic; */ }
    .imagedetails .price { display:block; text-align:left; font-weight:300;  }
    .imagedetails .detailslink { float:right; color: #999; margin-top: -30px; cursor:pointer; }
    .imagedetails .detailslink:hover {  color: #000;  }
    
 
	
	
	
	.infotable { margin-left: 10px; }
	.infotable .infotitle { display: inline-block; width: 25%; min-width:150px;  vertical-align:top;  color:#999; margin-left:5px; text-transform:uppercase; }
	.infotable .infotext { display: inline-block; width: 56%;    }
	
	.enquirebutton, .removefromwishlistbutton { text-align:center; border:1px solid #000; padding:10px; width: 92%; margin-top:25px;  margin-left:5px; margin-right:10px; margin-bottom:25px;  font-weight: bold; }
	.enquirebutton:hover, .removefromwishlistbutton:hover { background:#EEE; cursor:pointer; }
	
	
	.wishlist .enquirebutton, .removefromwishlistbutton { width: 80%; }
	
	.wishlist .enquirebutton, .removefromwishlistbutton  { margin-bottom: 10px; margin-top:5px; }
	
	
	
	@media (min-width: 700px) {
   
   .enquirebutton { width: 95%; }
   
}
	
	
	
	.prevslide { position:absolute; top: 20%; left: 0px; width: 40%; height:60%; border:0px solid #000; cursor:w-resize;  }
	
	.nextslide { position:absolute; top: 20%; right: 0px; width: 40%; height:60%; border:0px solid #000; cursor:e-resize; }


textarea:focus { border: 1px solid #333; }
 
 

  
  .collectiongrid { width: 100%; min-width:550px; margin-right:auto; border:0px solid #000;  }
  
  .collectionlistcontainer { padding-left: 0px; }
.collectionlist { width: 97%; border:0px solid #000;  min-width:150px; margin-left:0px; margin-right:auto;  

 }
 .collectionlist table { max-width: 100%; }
 
  .collectiongrid .artworkitem { width: 100%; margin-left:25px;  float:left; margin-bottom:15px;  text-align:left ; }
   
  
  
    .collectiongrid.wishlist .artworkitem.extended {  transition: height 0.2s; }
  
   .collectiongrid .artworkimage { text-align:left; width: 100%;  cursor:pointer;   }
   .collectiongrid .artworkimage img { max-width:85%; max-height:100%;  box-shadow: -3px 5px 5px rgba(200,200,200,.7);  }  
    
 
 
    
.leftprofilenav { display:none;  }

.leftprofilenavmobile { display:block; height: 60px;  font-size:18px; cursor:pointer; color:rgb(158,158,158);  top: -10px; left: 10px; position:relative; clear:both; }
.leftprofilenavmobile .showprofilegrid { position:absolute; top: 0px; left: 0px; width: 130px; border:0px solid #000;  }
.leftprofilenavmobile .showarchivegrid { position:absolute; top: 25px; left: 3px; width: 130px; border:0px solid #000;  }

.leftprofilenavmobile .showprofilelist { position:absolute; top: 25px; left: 0px; width: 130px; border:0px solid #000;  }

.leftprofilenavmobile .showcollection { position:absolute; top: 0px; right: 30px; width: 130px; border:0px solid #000; text-align:right;  }
.leftprofilenavmobile .showwishlist { position:absolute; top: 25px; right: 30px; width: 130px; border:0px solid #000; text-align:right;  }
.leftprofilenavmobile .showarchivelist.mainnav { position:absolute; top: 0px; right: 30px; width: 130px; border:0px solid #000; text-align:right;  }
.leftprofilenavmobile .showarchivelist.thelist { padding-left:3px;  }

.leftprofilenavmobile .showvalues { position:absolute; top: 0px; left: 33%; width: 130px; border:0px solid #000;  }

.leftprofilenavmobile span.current { color:#000; }



.archivedivcontainer .collectionlist .text-right { padding: 3px !important; }


@media (min-width: 700px) {

.collectionlist { margin-top:170px; }

.leftprofilenavmobile { display: none; }

.leftprofilenav {  display:block; position:absolute; padding-left:15px; font-size: 24px; line-height: 32px; top: 320px; left: 0px; width: 380px; border:0px solid #000; height: 500px; vertical-align:top; }
.leftprofilenav span { cursor:pointer; color:rgb(158,158,158); }

.leftprofilenav span.current, .leftprofilenavmobile span.current { color:#000; }

  .collectionlistcontainer { padding-left: 390px; padding-right:120px; }
  
   .collectiongrid.wishlist .artworkitem {  height: auto; margin-bottom:10px; }
   .collectiongrid {  display:grid;  grid-template-columns: repeat(2, 1fr); gap: 30px;
   
   width: 100%; min-width:550px; padding-left:380px; margin-right:auto;  
   margin-top: 280px;
/*    max-width:1920px; */
     }
     
     .recommendationsdiv .collectiongrid { margin-top: 195px; }
   
     .collectiongrid .artworkitem {  height: auto; margin-right:1px; border:0px solid #000; float:left; margin-bottom:15px;  text-align:left; position:relative; }
       .collectiongrid .artworkimage { text-align:left; width: 70%;   }

  .archivedivcontainer .collectiongrid .artworkimage, .collectiongrid.wishlist .artworkimage, .rcontentcontainer .artworkimage { text-align:right; width: auto;    }


  


}


.collectionlist table { width: 98%; margin-left:10px; border:0px solid #000; font-size:14px; }
 
 .collectionlist table tr th { text-transform:uppercase; color:rgb(158,158,158); }
 
 .collectionlist table td { display: table-cell;  vertical-align:top; }
 .uppercase { text-transform:uppercase; }
 
 .text-right { text-align:right; }
 
 .recommendationsdiv { display:none;}
 
 .valuetitle { color: rgb(158,158,158); }
 
 .valueinfo { display:none; }
 
 
 .largepreview { display: none; border:0px solid #000;  position:fixed; top: 10px; left: 100px;  width: 100%;  height: 100%; z-index:10; }
 
 .largepreview img { margin-left:auto; margin-right:auto; border:3px solid #FFF; }
  
 
 .archiveartist, .archivetitle, .artname { cursor: pointer; }
 
 .artname {  font-family: LH-Light; }


 .span-all {
     
    }


.column1, .column2 {  
 grid-column: 1 / -1; /* This will make the element span all columns */
box-sizing: border-box !important; text-align:justify; 

max-width: 95%;
padding-left:20px;




 }
 
 .column1 p, .column2 p { margin-bottom: 2rem;  }
 .column2 { margin-bottom: 20px; font-weight:400;}
 
 
 .detailsimage { max-width:95%; margin-left:auto; margin-right:auto; }

 @media (min-width: 700px) {
 
 .column1, .column2 {  max-width:100%; }
 
#contactinfodivcontent { margin-right: 40px; float:right; width:30%; min-width: 650px; }
 .archivediv {  border:0px solid #000;  }
 

 .collectiongrid {  box-sizing: border-box !important; }
td.py-4 { position:relative; }
.archivedivcontainer .collectiongrid { margin-top: 155px; width:90%; }
.profilecontentcontainer .collectiongrid { margin-top: 195px; }

.archiverow:hover td { background-color: #eee;  transition: background-color 0.5s ease-in-out; }

.archiverow.selected td { background-color: #c1c1c1;  transition: background-color 0.5s ease-in-out; }
.archivepreviewimageholder { position:absolute; left: -253px; top: 0px;  width: 250px;   }

.artworkrow:hover td, .artworkrow.selected td { background-color: #eee;  transition: background-color 0.5s ease-in-out; }
.artworkpreviewimage { position: absolute; left: -252px; top: 0px; display:none; height:250px; width: 250px; }
.detailsimage { display:none; }

}



.disclaimer { font-weight:bold; font-style: italic; font-size:12px; grid-column: 1 / -1; box-sizing: border-box !important; padding-right:25px; text-align:justify; }
.disclaimer a { color:#000; }

.valuecolumn  { padding-right:2px !important; padding-left:0px !important; } 

.valuecolumn.hidden  { display:none !important; }


.cardvaluedata { display:none; }
.showvaluedata { cursor:pointer; }



#collectorinfodivcontent { margin-left:10px; }

#collectorinfodivcontent input[type="text"] { width: 95%; }
#collectorinfodivcontent textarea { width: 95%; min-height:100px; }

#collectorinfodivcontent textarea[name="biography"] { min-height:200px; }

#collectorinfodivcontent label { font-weight:normal; }

 @media (min-width: 700px) {
 
#collectorinfodivcontent {  margin-left:300px; }
#collectorinfodivcontent textarea { width: 80%; max-width:700px;  }
#collectorinfodivcontent input[type="text"] { width: 80%; max-width:700px; }
 
 
 }