﻿.blogTable 
{
    width: 100%;
    }




.blogTable tr
{
    border-bottom: 1px solid silver;
    }



.blogTable tr:last-child 
{
    border: none;
    }
    
    
    

  /* --------------------------- */    
 /*  Column with Image & Theme  */
/* --------------------------- */  

.blogImage img
{    
    width: 240px;  
    }

.blogImage
{
    position: relative;
    width: 240px;
    height:140px;
    overflow: hidden;
    margin-right: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
    cursor: pointer;
    }
 
 @media only screen and (max-width: 980px), only screen and (max-device-width: 980px) and (orientation: portrait) 
{
    .blogImage
    {
        display: none;
    }
}




.blogImageMobile
{
    display: none;
    cursor: pointer;
    }
 
 @media only screen and (max-width: 980px), only screen and (max-device-width: 980px) and (orientation: portrait) 
{
        .blogImageMobile
        {
            display: block;
            position: relative;
            width: 100%;
            height:220px;
            overflow: hidden;
            margin-right: 20px;
            margin-top: 20px;
            }
            
          .blogImageMobile img
          {
              width: 100%;
              }  
}
 
    
 .blogTheme
 {
     position: absolute;
     top: 0;
     left: 0;
     z-index: 10;
     background-color: #5c7f92;
     opacity: 0.9;
     color: White;
     font-weight: bold;
     font-size: 11px;
     
     height: 20px;
     padding: 2px 15px; 
     }
     
  
  .blogThemeMobile
 {
     position: absolute;
     top: 0;
     left: 0;
     z-index: 10;
     background-color: #5c7f92;
     opacity: 0.9;
     color: White;
     font-weight: bold;
     font-size: 11px;
     
     height: 20px;
     padding: 2px 15px; 
    }
  
     
     
     
   /*  --------------------------------  */     
  /*  Column with Date, Title & Teaser  */
 /*  --------------------------------  */     
 
 
 .blogDate
 {
     padding-top: 20px;
     opacity: 0.5;
     color: #666666;
     }
     
 .blogTitle
 {
     font-size: 20px;
     padding: 10px 0px 6px 0px;
     line-height: 22px;
     
     }
 
 .blogTitle a
 {
     color: #005b82;
     text-decoration: none;
     cursor: pointer;
     }
     

.blogTeaser
 {
    color: #666666;
    margin-bottom: 20px;
        }
        

   /*  -------------------------  */     
  /*  Row with Pager number       */
 /*  -------------------------  */     
        

/* active page */
.blogPager a 
{
    display: inline-block;
    background-color: #00b9e4;
    padding: 5px 10px;
    margin: 25px 5px 10px 5px;
    
    
    font-size: 15px;
    font-weight: bold;
    color: White;
    
    text-decoration: none;
    cursor: pointer;
    }
 
 .blogPager 
 {
     height: 10px;
     width: 10px;
     }
    
    
.blogPager table
 {
    margin-left: auto;
    margin-right: auto;   
       } 
    
    
 /* non-visible pages */   
.blogPager span
{
    display: inline-block;
    background-color: #005b82;
    padding: 10px;
    margin: 25px 5px 10px 5px;
    
    font-size: 15px;
    font-weight: bold;
    color: White;
    
    text-decoration: none;
    cursor: pointer;
    }    
    


   /*  -------------------------  */     
  /*  In case of empty blog      */
 /*  -------------------------  */         
 .emptyBlog
 {
     height:350px;
     width: 200px;
  
     background-image: url(../images/nothingHere.png);
     background-position:center;
     background-repeat: no-repeat;     
     }