.tkpGrid {
    display: grid;
    grid-template-columns: 1fr 250px;
    grid-template-rows: auto auto;
}
.tkp3Columns {
    flex-basis: calc(100% - 250px);
    grid-area: 1 / 1 / 2 / 2;
}
.tkpRightShortcut {
    grid-area: 1 / 2 / 2 / 3;
    flex-basis: calc(250px - 2rem);
}
.tkpGallery {
    margin-top: 1rem;
    flex-basis: 100%;
    grid-area: 2 / 1 / 3 / 3;
}
.tkpPicturePlayer {
   margin-top: 1rem;
}
.tkpLeftRight
{
   display : flex;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-between;
   align-items: stretch;
   margin-top : 1rem;
}
.tkpLeft
{
   flex-basis : calc(100% - 250px)
}
.tkpRight
{
   flex-basis : 250px;
}
.tkpRightShortcut
{
   padding : 0 1rem;
}
.tkp3Columns
{
   display : flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: stretch;
}
.orangeBorder {
  background-color: #FFFFFF;
  color: #000000;
  border: 2px solid #AB8C55;
  padding: 16px;
  border-radius: 7px;
  box-shadow: 2px 2px 3px #800000;
}
.tkpNews
{
   flex-basis : 33%;
   max-width: 33%;
}
.tkpBulletin
{
   flex-basis : 33%;
   max-width: 33%;
}
.tkpCirculars
{
   flex-basis : 33%;
   max-width: 33%;
}
.tkpGallery
{
   padding : 2rem 0;
   border-width : 0 1px 1px 1px;
   border-style : none solid solid solid;
   border-color : #d6d6d6;
   background-image : url(/download/Resource/BGImage/line.png);
   background-repeat: no-repeat;
   background-size: cover;
}


@media (max-width: 480px) 
{

   .tkpLeftRight
   {
      display : block;
   }
   .tkpRightShortcut
   {
      padding : 1rem;
   }
   .tkpGrid {
     display: block;
     display: grid;
     grid-template-columns: 1fr;
     grid-template-rows: auto auto auto;
   }
   .tkp3Columns
   {
      display : block;
      grid-area: 1 / 1 / 2 / 2;
   }
   .tkpGallery {
      grid-area; 2 / 1 / 3 / 2;
   }
   .tkpRightShortcut {
      grid-area: 3 / 1 / 4 / 2;
   }
   .tkpNews,.tkpBulletin,.tkpCirculars {
      max-width: 100%;
    }
}
@media (min-width: 481px) and (max-width: 767px) 
{
   .tkpLeftRight
   {
      display : block;
   }
   .tkpRightShortcut
   {
      padding : 1rem;
   }
   .tkp3Columns
   {
      display : block;
   }
   .tkpGrid {
     display: block;
     display: grid;
     grid-template-columns: 1fr;
     grid-template-rows: auto auto auto;
   }
   .tkp3Columns
   {
      grid-area: 1 / 1 / 2 / 2;
   }
   .tkpGallery {
      grid-area; 2 / 1 / 3 / 2;
   }
   .tkpRightShortcut {
      grid-area: 3 / 1 / 4 / 2;
   }
   .tkpRightShortcut>div>.shortcutList {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-auto-rows: auto;
   }

   .tkpNews,.tkpBulletin,.tkpCirculars {
      max-width: 100%;
    }
}
@media (min-width: 768px) and (max-width: 979px) 
{
   .tkp3Columns
   {
      display : block;
   }

   .tkpNews,.tkpBulletin,.tkpCirculars {
      max-width: 100%;
    }
}
@media (min-width: 980px) and (max-width:1199px) 
{
   .tkpNews
   {
      flex-basis : 100%;
      max-width: 100%; /* needed for IE*/
      border-bottom : solid 5px #FFFFFF;
   }
   .tkpBulletin
   {
      flex-basis : 50%;
      max-width: 50%;
   }
   .tkpCirculars
   {
      flex-basis : 50%;
      max-width: 50%;
   }
}
@media (min-width: 1200px) and (max-width:1919px) 
{

}
@media (min-width: 1920px) 
{

}