@charset "UTF-8";
/* Tuition Template */
*{
    box-sizing: border-box; /**For flexbox**/
}
.background {
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    align-content: center;
    width:100vw;
    font-size:1.5vh;
}
#page-wrapper{
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 2% auto;
    width:90vw;
}
@media only screen and (min-width:2000px) and (orientation:landscape)
    {#page-wrapper{width:85vw;}}
@media only screen and (max-width:1400px) and (orientation:landscape)
    {#page-wrapper{width:95vw;}}
@media only screen and (orientation:portrait)
    {#page-wrapper{width:96vw;}}


.page-header{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 3%;
    height: 25vmin;
    width: 100%;
}
.page-header-image {
    height: 100%;
    width: 30vmin;
    margin-right:1.5%;
}
.page-header-label{
    display: flex;
    align-items: center;
    height: 100%;
    width:100%;
    font-size: 6vmin;
    padding-left: 6%;
}


#middle-box {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: stretch;
	visibility: visible;
    margin-bottom: 2%;
}
@media only screen and (min-width:768px) and (max-width:1400px) and (orientation:landscape)
    {#middle-box{width:100%;}}
@media only screen and (max-width:767px) and (orientation:landscape)
    {#middle-box{flex-flow:column nowrap; justify-content: flex-start;}}
@media only screen and (orientation:portrait)
    {#middle-box{width:100%;flex-flow:column nowrap; justify-content: flex-start;}}


#left-column{
    display:flex;
    flex-flow: column nowrap;
    justify-content: space-between;
	width:63%;
    margin-right: 3%;
}
@media only screen and (min-width:1024px) and (max-width:1400px) and (orientation:landscape)
    {#left-column{width:55%;}}
@media only screen and (max-width:767px) and (orientation:landscape)
    {#left-column{width:100%;}}
@media only screen and (orientation:portrait)
    {#left-column{width:100%;}}


#right-column{
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
	width: 37%;
} 
@media only screen and (min-width:1024px) and (max-width:1400px) and (orientation:landscape)
    {#right-column{width:45%}}
@media only screen and (max-width:767px) and (orientation:landscape)
    {#right-column{width:100%;}}
@media only screen and (orientation:portrait)
    {#right-column{width:100%;}}