﻿.twsPicturePlayer
{
   
}

.tws3Columns
{
   display : flex;
   flex-direction: row;
   align-items: stretch;
   justify-content: space-between;
   flex-wrap: nowrap;
   margin : 2rem 0;
}

.tws3Columns > div
{
  flex-shrink: 1;
  flex-basis: calc(100% / 3);
}

/*.index最新消息2 .newsList, .index活動8 .activityList
{
   height : 600px;
}*/

.index校曆11 .blockContent
{
   height : 600px;
}

.tws3Columns .blockTitle img
{
   max-width : 100%;
}

.twsCalendar
{
   margin-right : 3%;
}

.twsCalendar .blockContent
{
   background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); 
   border-radius : 10px;
   padding : 1rem;
}

.twsNews
{
}

.twsNews .blockContent
{
   background: linear-gradient(to bottom,  #b2e1ff 0%,#66b6fc 100%); 
   border-radius : 10px;
   padding : 1rem;
}

.twsActivity
{
   margin-left : 3%;
   order : 3;
}

.twsActivity .blockContent
{
   background: linear-gradient(to bottom,  #febbbb 0%,#fe9090 45%,#ff5c5c 100%);
   border-radius : 10px;
   padding : 1rem;
}

.twsShortcut
{

}

@media (max-width: 480px) 
{
  .tws3Columns
  {
    display : block; 
  }
  
   .twsActivity
   {
      order : 2;
      margin-bottom : 2rem;
   }
   .twsNews
   {
      order : 1;
      margin-bottom : 2rem;
   }
   .twsCalendar
   {
      order : 3;
      margin-bottom : 2rem;
   }
}
@media (min-width: 481px) and (max-width: 767px) 
{
  .tws3Columns
  {
    display : block; 
  }
  
   .twsActivity
   {
      margin-left : 1rem;
      margin-right : 1rem;
      order : 2;
      margin-bottom : 2rem;
   }
   .twsNews
   {
      margin-left : 1rem;
      margin-right : 1rem;
      order : 1;
      margin-bottom : 2rem;
   }
   .twsCalendar
   {
      margin-left : 1rem;
      margin-right : 1rem;
      order : 3;
      margin-bottom : 2rem;
   }
}
@media (min-width: 768px) and (max-width: 979px) 
{

}
@media (min-width: 980px) and (max-width:1199px) {}
@media (min-width: 1200px) and (max-width:1919px) 
{

}
@media (min-width: 1920px) 
{
   
}
