:root {
    --r-font-color : #000000;
    --r-font-size : 16px; 
    --r-line-height : 1.5;
    --r-el-border-bottom: solid 1px #dddddd;
    --r-el-padding: 1rem;
    --r-smaller-font : 0.8em;
    --r-container-padding : 1em;
    --r-hori-gap : 2em;
    --r-heading-font-weight : 700;
    --r-heading-font-size : 1.2em;
}

.isNotIndexPage .variableContent
{
   padding : 1em 0;
}

html, body {
    font-family: 'Roboto Condensed', '微軟正黑體', 'Microsoft JhengHei', 'Segoe UI Semibold', 'Segoe UI', 'Lucida Grande', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #000000;
    line-height: 24px;
}

body
{
    padding : 1rem;
    /*background-image : url(/download/Resource/BGImage/bgTop01.jpg), url(/download/Resource/BGImage/bgBottom01.jpg), url(/download/Resource/BGImage/bgMiddle01.jpg);
    background-repeat: repeat-x, repeat-x, repeat;
    background-position: top left, bottom left, top left;*/
}

.textWhiteBorder
{
   text-shadow: 2px 2px 0 #FFFFFF, 2px -2px 0 #FFFFFF, -2px 2px 0 #FFFFFF, -2px -2px 0 #FFFFFF, 2px 0px 0 #FFFFFF, 0px 2px 0 #FFFFFF, -2px 0px 0 #FFFFFF, 0px -2px 0 #FFFFFF;
}

a {
    text-decoration : none;
    color: #000000;
}

.shdHeader
{
   position : relative;
   padding : 0 0 1rem 0;
   display : flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
   background-image : url(/download/Resource/BGImage/building01.png);
   background-repeat: no-repeat;
   background-position: bottom right;
   background-size: contain;
}
.shdEclassAndLowerSubMenu
{
  display : flex;
  flex-direction : column;
  align-self: flex-end;
}
.shdSubMenu
{
   /*position : absolute;
   bottom : 0;
   right : 0;*/
   background-color: rgba(255,255,255,0.9);
}
.shdSchoolLogoAndNames
{
   display : flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: flex-start;
   align-items: center;
}
.shdSchoolLogo
{
   margin-right : 20px;
   width : auto;
}
.shdSchoolNames
{
   font-weight : 800;
   
}
.shdSchoolNameChinese{}
.shdSchoolNameEnglish{}

.shdTopShortcut
{

}

.shdEclassOneRow
{
   height : 50px;
   width : 340px;
}

.shdFooter
{
   padding : 1rem;
   background-color: rgb(28,146,222);
   background-image: linear-gradient(to bottom, rgb(29,152,229), rgb(26,140,214));
   color : #FFFFFF;
   border-radius: 8px;
   box-shadow: 0 1px 4px rgb(0 0 0 / 20%);
}

.shdFooter a
{
   color : #FFFFFF;
}

@media (max-width: 480px) 
{
   .shdSchoolLogoAndNames
   {
      justify-content: center;
   }
   .shdSchoolLogo
   {
      height : 80px;
   }
   .shdSchoolNames
   {
      text-align: center;
   }
   .shdSchoolNameChinese
   {
      font-size : 20px;
      line-height : 30px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 20px;
      line-height : 30px;
   }
   .shdTopShortcut
   {
      display : none;
   }
   .shdSubMenu
   {
      positive : static;
   }
}
@media (min-width: 481px) and (max-width: 767px) 
{
   .shdSchoolLogo
   {
      height : 100px;
   }
   .shdSchoolNameChinese
   {
      font-size : 30px;
      line-height : 45px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 25px;
      line-height : 35px;
   }
   .shdTopShortcut
   {
      display : none;
   }

}
@media (min-width: 768px) and (max-width: 979px) 
{
   .shdSchoolLogo
   {
      height : 100px;
   }
   .shdSchoolNameChinese
   {
      font-size : 30px;
      line-height : 45px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 25px;
      line-height : 35px;
   }
   /*.shdSubMenu
   {
      position : absolute;
      top : 0;
   }*/
}
@media (min-width: 980px) and (max-width:1199px) 
{
   .shdSchoolLogo
   {
      height : 100px;
   }
   .shdSchoolNameChinese
   {
      font-size : 30px;
      line-height : 45px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 25px;
      line-height : 35px;
   }
}
@media (min-width: 1200px) and (max-width:1919px) 
{
   .shdSchoolLogo
   {
      height : 100px;
   }
   .shdSchoolNameChinese
   {
      font-size : 30px;
      line-height : 45px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 25px;
      line-height : 35px;
   }
}
@media (min-width: 1920px) 
{
   .shdSchoolNameChinese
   {
      font-size : 40px;
      line-height : 60px;
   }
   .shdSchoolNameEnglish
   {
      font-size : 30px;
      line-height : 50px;
   }
}