﻿/* set position relative to fix SectionIndex position */
.MainContent{
    position: relative;
}

/* position absolute don't have space on MainContent */
.SectionIndex{
    position: relative;
}

/* responsive tablet and phone */
.Page.tablet .SectionIndex.fixed, 
.Page.phone .SectionIndex:relative{
    position: relative;
    top: 0px;
}

/* fixed top when scroll page */
.SectionIndex.fixed{
    position: fixed;
    top: 20px;
    width: 100%;
    /* Chrome Fix */
    -webkit-transform: translateZ(0);
}

.SectionIndex.vertical{
    top: 0px;
    width: auto;
    margin-bottom: auto;
}

.SectionIndex.vertical.fixed{
  top: 20px;  
}


.Section:first-child{
    margin-top: 0px;
}


.SectionIndex a, 
.SectionIndex a:link, 
.SectionIndex a:visited{
     display: inline-block;
     padding-bottom: 4px;
     text-decoration: none;
     margin-right: 24px;
     padding-top: 4px;
    -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;   
    color: #999;
}

.Page.phone .SectionIndex a, 
.Page.tablet .SectionIndex a{
    margin-bottom: 10px;
}

.SectionIndex a:first-child{
  padding-left:0px;  
}

.SectionIndex a.active, 
.SectionIndex a:hover{
    text-decoration: none;
    border-bottom: solid 2px #125f90;
    color: #125f90;
}

.SectionIndex.vertical a{
    display: block;
    margin-right: 0px;
    margin-bottom: 5px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 10px;
}

.SectionIndex.vertical a.active, 
.SectionIndex.vertical  a:hover{
    border-bottom: none;
    border-left-color: #125f90;
}

.SectionIndex.vertical a{
    border-bottom: none;
    border-left: solid 2px #CCC;
}

/* ExcludeAllFromPickersOutsideBlock */