/*
   CSS specific to library/index.php
*/

.alphaheader
{
 font-size: 24px;
 padding: 8px 0 8px 0;
 color: #0C4664;
 font-weight: bold;
}

.blurb
{
 font-size: 14px;
 padding: 0 15px 0 0;
}
.smallerblurb 
{
 font-size: 13px;
 padding: 0 15px 0 0;
}  
.biggerblurb
{
 font-size: 15px;
 padding: 0 15px 0 0;
}

.typefind:hover
{
 text-decoration: none;
 background-color: #eee;
 //font-style: italic;
}


//.typeimage
//{
// width: 240px;
// height: auto;
//}     
//.typeimage2
//{
// width: auto;
// height: 240px;
//}

//.typewrapper
//{
// display: flex;
// flex-flow: row wrap;
// align-items: flex-end;
// justify-content: space-between; 
// margin: 0 25px 0px 0;
// row-gap: 15px;
// column-gap: 5px;
// //background-color: pink; 
//}
//.typecontent
//{
// align: center;
// border: 1px solid red; 
// background-color: pink; 
//}
.typeimageX
{
 width: 100%;
 max-width: 240px;
 height: auto;
}
.typecat
{
 font-size: 13px;
}

.desktop  { display: block; }
.midi     { display: none; }
.mini     { display: none; }

.footer1 { margin: 0 5px 0 0; }
.footer2 { margin: 0 5px 0 3px; }

/* ::::::::::::::::  MEDIA QUERIES :::::::::::::::::::: */

@media only screen and (max-width: 950px)
{
  .typeimage
  {
   width: 200px;
   height: auto;
  }        
  .typeimage2
  {
   width: auto;
   height: 200px; 
  }
//  .typecat
//  {
//   font-size: 12px;
//  }
}                                      

@media only screen and (max-width: 850px)
{
  .alphaheader
  {
   font-size: 20px;
   padding: 0px 0 8px 0;
   color: #0C4664;
   font-weight: bold;
  }
}                       

@media only screen and (max-width: 650px)
{ 
  .typebreadcrumbs
   {
    font-size: 14px;
    padding: 0px 0 5px 0;
   }
  .typebreadcrumbs2
  {
   font-size: 16px;
   font-weight: bold;
  }  
  .typeimage
  {
   width: 180px;
   //min-width: 240px;
   height: auto;
  }              
  .typeimage2
  {
   width: auto;
   height: 180px;
  }
  .typewrapper
  {
   display: flex;
   margin-right: 5px; 
  }     
//  .typecat
//  {
//   font-size: 10px;
//  }
}                                 

@media only screen and (max-width: 600px)
{
  .blurb
  {
   font-size: 13px;
   padding: 0 15px 0 0;
  }
  .smallerblurb 
  {
   font-size: 13px;
   padding: 0 15px 0 0;
  }
  .maximidi { display: none; }
  .mini     { display: block;}  
  .clicktoseemore
  {
   padding-right: 10px;
   font-size: 12px;
   display: none;
  }
  .imagecolumn { display: none; }
  .typecol2
  {
   display: none;
  }
  .desktop { display: none; }
  .midi    { display: block; }
  .mini    { display: none; }        
}                                            

@media only screen and (max-width: 500px)
{   
  .typebreadcrumbs
   {
    font-size: 13px;
    padding: 0px 0 5px 0;
   }
  .typebreadcrumbs2
  {
   font-size: 15px;
   font-weight: bold;
  }  
}                                                 

@media only screen and (max-width: 450px)
{
 .desktop { display: none; }
 .midi    { display: none; }
 .mini    { display: block; }
}