﻿@media only screen and (max-width: 1200px) {
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 480px) {
}

/* Commonly Used */
@media only screen and (max-width: 1200px) {
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 768px) {
  h1 {
    font-size: 40px;
  }
  h2 {
    font-size: 30px;
  }
  h3 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 480px) {
}

/* Trial Banner */
@media only screen and (max-width: 1024px) {
  .TrialBanner.SubscribeBanner .SubBannerContainer {
    padding: 10px 40px;
  }
}
@media only screen and (max-width: 768px) {
  .TrialBanner.SubscribeBanner {
    height: inherit;
    text-align: center;
  }
  .TrialBanner.SubscribeBanner .SubBannerContainer {
    display: block;
    padding: 10px 30px 15px 30px;
  }
  .TrialBanner.SubscribeBanner .TrialDaysRemaining {
    text-align: center;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 480px) {
  .TrialBanner.SubscribeBanner .SubBannerContainer {
    padding: 10px 20px 15px 20px;
  }
}

/* GetSet4Education Redirect Banner */
@media only screen and (max-width: 1024px) {
  .EducationRedirectBanner .SubBannerContainer {
    padding: 4px 40px 1px 40px;
  }
}
@media only screen and (max-width: 768px) {
  .EducationRedirectBanner .SubBannerContainer {
    padding: 4px 30px 1px 30px;
  }
}
@media only screen and (max-width: 480px) {
  .EducationRedirectBanner .SubBannerContainer {
    padding: 10px 20px 10px 20px;
    flex-wrap: wrap;
  }
  .EducationRedirectBanner .EduLogo {
    flex: 0 0 100%;
    text-align: center;
    margin-bottom: 10px;
  }
  .EducationRedirectBanner .EduLogo img {
    width: 93px;
  }
  .EducationRedirectBanner .EduWebBtn {
    flex: 0 0 100%;
    text-align: center;
  }
}

/* Main Header */
@media only screen and (max-width: 1200px) {
  .MainHeader .Logo {
    /* width: 110px; */
    width: 115px;

    top: 8px;
    margin-left: -57px;
  }
  .MainHeader .Logo.LogoEduWhite {
    top: 42px;
  }
  .MainHeader .Menu .LeftMenu {
    margin: 0px 0px 0px 170px;
    margin: 0;
  }
  .MainHeader .Menu .RightMenu {
    margin: 0px 0px 0px 0px;
    display: none;
  }
  .Navigation ul.Level1 li.Level1 a.Level1 {
    padding: 15px 10px;
  }
  .Navigation ul.Level1 li.Level1 a.Level1 .Nav_Arrow {
    width: 16px;
    height: 16px;
    top: 13px;
    margin-left: 7px;
  }
  .Navigation ul.Level1 li.Level1 a.AboutUs {
    padding: 15px 10px 0px 10px;
  }
  .Navigation ul.Level1 li.Level1 a.SchoolName {
    padding: 15px 10px 0px 10px;
  }
  .Navigation ul.Level2 li.Level2 a.Level2 {
    padding: 8px 10px;
  }
}
@media only screen and (max-width: 1200px) {
  .MainHeader .WidthContent {
    padding: 0px 40px;

    display: flex;
    justify-content: center;
    align-items: center;
  }
  .MainHeader .Logo {
    left: 50%;
    margin-left: -55px;
    top: 5px;
    width: 130px;
  }
  .MainHeader .Logo.LogoEduWhite {
    top: 28px;
  }
  .MainHeader .Menu {
  }
  .MainHeader .Menu .LeftMenu {
    visibility: hidden !important;
  }

  .MainHeader .BtnMobileMenu {
    display: block;
    top: 0;

    left: 0px;
    /* margin-left: -57px; */
    margin-left: 0;
  }

  .PupilCheckboxImgTable .LabelCell {
    text-align: left;
  }

  .PupilInfoSm {
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  .MainHeader {
    height: 60px;
    position: relative;
  }
  .MainHeader .WidthContent {
    padding: 0px 30px;
  }
  .MainHeader .Logo {
    width: 120px;
  }
  .MainHeader .Logo.LogoEduWhite {
    top: 10px;
  }
  .MainHeader .BtnMobileMenu {
    top: 0px;
    left: 0px;
  }
}
@media only screen and (max-width: 480px) {
  .MainHeader .WidthContent {
    padding: 0px 20px;
  }
}

/* Lesson Plan Menu */
@media only screen and (max-width: 1024px) {
  .LessonPlanMenu {
    left: -240px;
    width: 240px;
  }
  .LessonPlanMenu .OverflowPanel1 .Nav_Title {
    padding: 30px 10px 45px 10px;
    cursor: pointer;
    font-size: 26px;
    font-weight: 400;
  }
  .LessonPlanMenu .OverflowPanel1 .Nav_Title .Nav_Back {
    display: table-cell;
  }
  .LessonPlanMenu .OverflowPanel1 ul li a {
    font-weight: 700;
  }
  .LessonNav_01 {
    z-index: 140;
  }
  .LessonNav_01.Opened {
    left: 0px;
  }
  .LessonNav_02 {
    z-index: 150;
  }
  .LessonNav_02.Opened {
    left: 0px;
  }
  .LessonNav_03 {
    z-index: 160;
  }
  .LessonNav_03.Opened {
    left: 0px;
  }
}

/* Main Content */
@media only screen and (max-width: 1024px) {
  .MainContent .WidthContent {
    padding: 0px 40px;
  }
}
@media only screen and (max-width: 768px) {
  .MainContent .WidthContent {
    padding: 0px 30px;
  }
}
@media only screen and (max-width: 480px) {
  .MainContent .WidthContent {
    padding: 0px 20px;
  }
}

/* Main Footer */
@media only screen and (max-width: 1400px) {
  .MainFooter .WidthContent {
    text-align: center;
  }
  .MainFooter .Links {
    float: none;
  }
  .MainFooter .Copyright {
    float: none;
    text-align: center;
    margin-top: 20px;
  }
}
@media only screen and (max-width: 1024px) {
  .MainFooter .WidthContent {
    padding: 20px 40px;
  }
  .MainFooter .Links ul li {
    margin: 0px 0px 10px 0px;
    padding: 0px;
    display: block;
    border-right: none;
    text-align: center;
  }
}
@media only screen and (max-width: 768px) {
  .MainFooter .WidthContent {
    padding: 20px 30px;
  }
}
@media only screen and (max-width: 480px) {
  .MainFooter .WidthContent {
    padding: 20px 20px;
  }
}

/* Error Page */
@media only screen and (max-width: 768px) {
  .ErrorPage .ErrorInner {
    padding: 100px 0px;
  }
  .ErrorPage .ErrorInner .Img {
    width: 120px;
  }
}

/* Home */
@media only screen and (max-width: 1200px) {
  .Panel_01 .Block .Text .BigTitle {
    font-size: 55px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .BigTitle {
    font-size: 55px;
  }
  .Panel_02 .Warpper .Item {
    width: 46%;
  }
  .Panel_03 .Warpper .Item {
    margin: 0px;
  }
  .swiper-home-panel-three {
    padding: 0px 0px;
  }
  .Panel_03 .Warpper .Item .Img img {
    width: 60%;
  }
  .swiper-home-panel-three .swiper-slide {
    width: 240px;
    margin: 0px 0px 0px 40px;
  }
  .swiper-home-panel-three .swiper-slide:last-child {
    margin-right: 40px;
  }

  .swiper-home-panel-three:hover .swiper-button-next-panel {
    display: block;
  }
  .swiper-home-panel-three:hover .swiper-button-prev-panel {
    display: block;
  }
}
@media only screen and (max-width: 1024px) {
  .Panel_01 .Block .Text {
    width: 65%;
  }
  .Panel_01 .Block .Text .BigTitle {
    font-size: 50px;
  }
  .Panel_01 .Block .Img {
    width: 35%;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 {
    width: 65%;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .BigTitle {
    font-size: 50px;
  }
  .Panel_01 .CmsPage .Video_Blog_Right {
    width: 35%;
    padding-top: 135px;
  }
  /* .Panel_02 .Inner                                  {padding:60px 0px;} */
  .Panel_02 .Inner .AboutUsWrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 30px;
    align-items: center;
  }
  .Panel_02 .Inner .AboutUsWrapper .AboutUsInner1 {
    order: 1;
    width: 100%;
  }
  .Panel_02 .Inner .AboutUsWrapper .AboutUsInner2 {
    order: 2;
    width: 70%;
    margin-top: 35px;
  }
  .Panel_02 .Inner .AboutUsWrapper .AboutUsInner3 {
    order: 3;
    width: 70%;
  }
  .Panel_03 .Inner {
    padding: 0px 0px 60px 0px;
  }
  .Panel_04 .Inner {
    padding: 60px 0px;
  }
  .Panel_05 .Inner {
    padding: 60px 0px;
  }
  .Panel_05 .CallToAction {
    display: block;
  }
  .Panel_05 .CallToAction .Desc {
    display: block;
    text-align: center;
  }
  .Panel_05 .CallToAction .Desc .ImgHidden {
    display: block;
  }
  .Panel_05 .CallToAction .Img {
    display: none;
  }
  .Panel_06 .Inner {
    padding: 60px 0px;
  }
  .Panel_06 .ContactTable {
    display: block;
  }
  .Panel_06 .ContactTable .CellLeft {
    display: block;
  }
  .Panel_06 .ContactTable .CellRight {
    display: block;
    width: 100%;
    padding: 40px 0px 0px 0px;
  }
  .Panel_06 .Form .Bottom {
    text-align: center;
  }
  .Panel_06 .Form .Bottom .BtnSend {
    float: none;
  }
  .Panel_06 .Form .Bottom .BtnSend a {
    width: 320px;
  }
  .Panel_06 .Form .Bottom .BtnSend input {
    width: 320px;
  }
  .Panel_06 .Form .Bottom .Denotes {
    float: none;
    margin-top: 30px;
  }
}
@media only screen and (max-width: 768px) {
  .Panel_01 .Table_P01 {
  }
  .Panel_01 .DownArrow {
    display: none;
  }
  .Panel_01 .Block {
    display: block;
    padding: 60px 0px;
    text-align: center;
    height: inherit;
  }
  .Panel_01 .Block .Text {
    width: 100%;
    display: block;
  }
  .Panel_01 .Block .Text .ImgMobile {
    display: inline-block;
  }
  .Panel_01 .Block .Text .BigTitle {
    font-size: 40px;
    margin-top: 0px;
  }
  .Panel_01 .Block .Text .SubTitle {
    font-size: 18px;
    line-height: 1.4em;
  }
  .Panel_01 .Block .Img {
    display: none;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 {
    width: 100%;
    display: block;
    padding-top: 40px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .BigTitle {
    font-size: 40px;
    margin-top: 0px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .SubTitle {
    font-size: 18px;
    line-height: 1.4em;
  }
  .Panel_01 .CmsPage .Video_Blog_Right {
    width: 90%;
    margin: 0 auto;
    padding: 40px 0px;
  }
  /* .Panel_02 .Inner                                  {padding:40px 0px;} */
  .Panel_02 .Warpper {
    width: 100%;
  }
  .Panel_02 .Warpper .Item {
    width: 100%;
    margin-right: 0%;
  }
  .Panel_03 .Inner {
    padding: 0px 0px 40px 0px;
  }
  .swiper-home-panel-three .swiper-slide {
    width: 200px;
    margin-left: 30px;
  }
  .swiper-home-panel-three .swiper-slide:last-child {
    margin-right: 30px;
  }
  .swiper-home-panel-three:hover .swiper-button-next-panel {
    display: none;
  }
  .swiper-home-panel-three:hover .swiper-button-prev-panel {
    display: none;
  }
  .Panel_04 .Inner {
    padding: 40px 0px;
  }
  .Panel_04 .Testimonial .Desc .Txt {
    font-size: 18px;
  }
  .Panel_04 .Testimonial .Desc .Txt .QuoteStart {
    width: 20px;
    height: 20px;
  }
  .Panel_04 .Testimonial .Desc .Txt .QuoteEnd {
    width: 20px;
    height: 20px;
  }
  .swiper-testimonial:hover .swiper-button-next {
    display: none;
  }
  .swiper-testimonial:hover .swiper-button-prev {
    display: none;
  }
  .Panel_05 .Inner {
    padding: 40px 0px;
  }
  .Panel_05 .CallToAction .Desc .Txt {
    font-size: 20px;
  }
  .Panel_06 .Inner {
    padding: 40px 0px;
  }
  .Panel_06 .Form .Box_Title {
    float: none;
    width: 100%;
  }
  .Panel_06 .Form .Box_FirstName {
    float: none;
    width: 100%;
  }
  .Panel_06 .Form .Box_LastName {
    float: none;
    width: 100%;
  }
  .Panel_06 .Form .Box_EmailAddress {
    float: none;
    width: 100%;
  }
  .Panel_06 .Form .Box_PhoneNumber {
    float: none;
    width: 100%;
  }
  .Panel_06 .Form .SpacerContact {
    display: none;
  }
}
@media only screen and (max-width: 480px) {
  .Panel_01 .Block .Text .BigTitle {
    font-size: 40px;
  }
  .Panel_01 .Block .Text .SubTitle {
    font-size: 16px;
    line-height: 1.8em;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .BigTitle {
    font-size: 40px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .SubTitle {
    font-size: 16px;
    line-height: 1.8em;
  }
  .swiper-home-panel-three .swiper-slide {
    width: 200px;
    margin-left: 20px;
  }
  .swiper-home-panel-three .swiper-slide:last-child {
    margin-right: 20px;
  }
  .Panel_06 .Form .Bottom .BtnSend a {
    width: 100%;
  }
  .Panel_06 .Form .Bottom .BtnSend input {
    width: 100%;
  }
}
@media only screen and (max-width: 400px) {
  .Panel_01 .Block .Text .BigTitle {
    font-size: 30px;
  }
  .Panel_01 .Block .Text .SubTitle {
    font-size: 14px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .BigTitle {
    font-size: 30px;
  }
  .Panel_01 .CmsPage .WWD_ColumnRight_01 .SubTitle {
    font-size: 14px;
  }
}

/* Login */
@media only screen and (max-width: 768px) {
  .Login .Inner {
    padding: 60px 20px 60px 20px;
  }
}
@media only screen and (max-width: 480px) {
  .Login .Inner {
    padding: 40px 20px 40px 20px;
  }
  .Login .Form {
    width: 100%;
    display: block;
  }
}

/* Register */
@media only screen and (max-width: 1024px) {
  .Register .Packages {
    padding: 0px 40px;
  }
  .WrapperPack {
    width: 104%;
    margin: 40px auto -40px auto;
  }
  .WrapperPack .ItemPack {
    width: 46%;
    margin-right: 4%;
  }
}
@media only screen and (max-width: 768px) {
  .Register .Inner {
    padding: 60px 30px 60px 30px;
  }
  .Register .PositionStatus {
    position: relative;
    top: auto;
    left: auto;
  }
  .Register .SpacerStatus {
    display: none;
  }
  .Register .Packages {
    padding: 0px 0px;
  }
  .WrapperPack {
    width: 100%;
    margin: 30px 0px -30px 0px;
  }
  .WrapperPack .ItemPack {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 30px;
    min-height: initial !important;
  }
  .WrapperPack .ItemPack .Content .EmptySpace {
    display: none;
  }
  .Register .BigForm {
    width: 320px;
  }
  .Register .BigForm .ColumnBox {
    float: none;
    width: 100%;
  }
  .Register .BigForm .SpacerBox {
    display: none;
  }
  .Register .BigForm .BtnNext a {
    width: 100%;
  }
  .Register .BigForm .BtnNext input {
    width: 100%;
  }
  .StatusBar .Circle {
    font-size: 14px;
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
  .StatusBar .Line {
    width: 40px;
    height: 4px;
  }
}
@media only screen and (max-width: 480px) {
  .Register .Inner {
    padding: 40px 20px 40px 20px;
  }
  .Register .BigForm {
    width: 100%;
  }
  .Register .SmallForm {
    width: 100%;
  }
  .Register .RegSuccess .Desc .BtnBackHome a {
    width: 100%;
  }
  .Register .RegSuccess .Desc .BtnBackHome input {
    width: 100%;
  }
  .StatusBar .Circle {
    font-size: 14px;
    width: 30px;
    height: 30px;
    line-height: 30px;
  }
  .StatusBar .Line {
    width: 20px;
    height: 4px;
  }
}

/* SiteMap */
@media only screen and (max-width: 1024px) {
  .SiteMap .Block {
    padding: 0px 40px;
  }
  .SiteMap .Block ul.Links {
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
  }
}
@media only screen and (max-width: 768px) {
  .SiteMap .Inner {
    padding: 60px 20px 60px 20px;
  }
  .SiteMap .Block {
    padding: 0px 0px;
  }
  .SiteMap .Block ul.Links {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 0px;
    -moz-column-gap: 0px;
    column-gap: 0px;
  }
}
@media only screen and (max-width: 480px) {
  .SiteMap .Inner {
    padding: 40px 20px 40px 20px;
  }
  .AboutUsMotto .AboutUsItem {
    padding: 20px;
  }
  .AboutUsMotto .AboutUsItem h1 {
    font-size: 16px;
  }
}

/* Cms Page */
@media only screen and (max-width: 1200px) {
  .CmsPage .Top .Table {
    height: 400px;
  }
  .CmsPage .Top .Table .Img {
    width: 360px;
  }
  .CmsPage .Top .Table .Desc .Title {
    font-size: 55px;
  }
  .CmsPage .WWD_ColumnLeft_01 {
    width: 38%;
  }
  .CmsPage .WWD_ColumnLeft_02 {
    width: 38%;
  }
  .CmsPage .WWD_ColumnRight_01 {
    width: 58%;
  }
  .CmsPage .WWD_ColumnRight_02 {
    width: 58%;
  }
  .CmsPage .Video_Blog_Left {
    width: 58%;
  }
  .CmsPage .Video_Blog_Right {
    width: 38%;
  }
}
@media only screen and (max-width: 1024px) {
  .CmsPage .Content .Inner {
    padding: 60px 0px;
  }
  .CmsPage .Top .Table .Desc .Title {
    font-size: 50px;
  }
}
@media only screen and (max-width: 768px) {
  .CmsPage .Top {
    padding: 0px;
  }
  .CmsPage .Top .Table {
    display: block;
    height: auto;
    text-align: center;
  }
  .CmsPage .Top .Table .Desc {
    display: block;
    padding: 40px 0px;
  }
  .CmsPage .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .CmsPage .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .CmsPage .Top .Table .Img {
    display: none;
  }
  .CmsPage .Content .Inner {
    padding: 40px 0px;
  }
  .CmsPage.HomeLoggedOut .PanelTable {
    display: block;
    padding: 60px 0px;
    text-align: center;
    height: inherit;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 {
    display: block;
    width: 100%;
    padding-top: 0px;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 .BigTitle {
    font-size: 40px;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 ul {
    list-style-type: none;
    margin: 0px;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 ul li {
    margin-left: 0px;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 .BtnFreeTrial {
    margin: auto;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 .ImgMobile {
    background: none;
    display: inline-block;
    width: 120px;
    height: 200px;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_01 .ImgMobile img {
    width: 100%;
  }
  .CmsPage.HomeLoggedOut .PanelTable .WWD_ColumnRight_02 {
    display: none;
  }
  .CmsPage .WWD_ColumnLeft_01 {
    width: 100%;
    float: none;
    margin-bottom: 30px;
  }
  .CmsPage .WWD_ColumnLeft_02 {
    width: 100%;
    float: none;
    margin-bottom: 30px;
  }
  .CmsPage .WWD_ColumnRight_01 {
    width: 100%;
    float: none;
  }
  .CmsPage .WWD_ColumnRight_02 {
    width: 100%;
    float: none;
  }
  .CmsPage .WWD_Line {
    margin: 40px 0px;
  }
  .CmsPage .Video_Blog_Left {
    width: 100%;
    float: none;
    margin-bottom: 30px;
  }
  .CmsPage .Video_Blog_Right {
    width: 100%;
    float: none;
  }
  .CmsPage .Video_Block {
    width: 100%;
    margin: 20px 0px;
  }
}
@media only screen and (max-width: 480px) {
  .CmsPage .Top .Table .Desc .Title {
    font-size: 40px;
  }
}

/* Audio Video page */
@media only screen and (max-width: 1024px) {
  .AVPage .Inner {
    padding: 160px 0px 60px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .AVPage .Inner {
    padding: 40px 0px 40px 0px;
  }
  .AVPage .Top .Title {
    text-align: center;
  }
}

/* Virtual PE Cupboard */
@media only screen and (max-width: 1200px) {
  .VirtualPECupboard .BtnBack .Txt_Four {
    display: none;
  }
  .VirtualPECupboard .WarpperKeyStage .Item {
    width: 200px;
  }
  .VirtualPECupboard .WarpperActivity {
    width: 104%;
  }
  .VirtualPECupboard .WarpperActivity .Item {
    width: 21%;
    margin: 0px 4% 40px 0px;
  }
  .DetailCupboard .Panel_Supplier .Warpper_PS .Item_PS {
    width: 46%;
  }
}
@media only screen and (max-width: 1024px) {
  .VirtualPECupboard .BtnBack {
    display: none;
  }
  .VirtualPECupboard .Inner {
    padding: 160px 0px 60px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage {
    width: 104%;
    margin: 0px 0px -40px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage .Item {
    width: 29.33%;
    margin: 0px 4% 40px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage.ReportingTabs .Item {
    width: 29.33%;
  }
  .VirtualPECupboard .WarpperActivity .Item {
    width: 29.33%;
  }
  .DetailCupboard .Inner {
    padding: 60px 0px 60px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .VirtualPECupboard .Inner {
    padding: 40px 0px 40px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage {
    margin: 0px 0px -30px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage .Item {
    width: 46%;
    margin: 0px 4% 30px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage.ReportingTabs .Item {
    width: 46%;
  }
  .VirtualPECupboard .WarpperKeyStage .Item .Img img {
    width: 100px;
  }
  .VirtualPECupboard .WarpperActivity {
    margin: 0px 0px -30px 0px;
  }
  .VirtualPECupboard .WarpperActivity .Item {
    width: 46%;
    margin: 0px 4% 30px 0px;
  }
  .VirtualPECupboard .WarpperActivity .Item .Img img {
    width: 100px;
  }
  .DetailCupboard .Inner {
    padding: 40px 0px 40px 0px;
  }
  .DetailCupboard .Panel_Supplier .Warpper_PS {
    width: 100%;
    margin: 0px 0px -30px 0px;
  }
  .DetailCupboard .Panel_Supplier .Warpper_PS .Item_PS {
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .DetailCupboard .Panel_Supplier .Warpper_PS .Item_PS .Table_PS .Desc_PS {
    padding-left: 30px;
  }

  .KeyStageChoice .Table_KS.Long .Cell_KS {
    vertical-align: middle;
    width: 200px;
    font-size: 14px;
    line-height: 1.5em;
    padding: 10px 5px;
  }
}
@media only screen and (max-width: 480px) {
  .VirtualPECupboard .WarpperKeyStage {
    width: 100%;
  }
  .VirtualPECupboard .WarpperKeyStage .Item {
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .VirtualPECupboard .WarpperKeyStage.ReportingTabs .Item {
    width: 100%;
  }
  .VirtualPECupboard .WarpperKeyStage .Item .Img img {
    width: 80px;
  }
  .VirtualPECupboard .WarpperActivity {
    width: 100%;
  }
  .VirtualPECupboard .WarpperActivity .Item {
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .VirtualPECupboard .WarpperActivity .Item .Txt {
    min-height: unset !important;
  }
  .VirtualPECupboard .WarpperActivity .Item .Img img {
    width: 80px;
  }
}

/* Warpper Equipment */
@media only screen and (max-width: 768px) {
  .WarpperEquipment {
    width: 100%;
    margin: 0px 0px -30px 0px;
  }
  .WarpperEquipment .Item_E {
    display: block;
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .WarpperEquipment .Item_E .Table_E {
    display: table;
    padding: 0px;
  }
  .WarpperEquipment .Item_E .Table_E .Img_E {
    display: table-cell;
    width: 100px;
    margin-bottom: 0px;
    padding: 20px;
  }
  .WarpperEquipment .Item_E .Table_E .Img_E img {
    display: block;
    width: 100%;
  }
  .WarpperEquipment .Item_E .Table_E .Desc_E {
    display: table-cell;
    width: auto;
    text-align: left;
    padding: 20px;
    min-height: 0 !important;
  }
}
@media only screen and (max-width: 480px) {
  .WarpperEquipment .Item_E .Table_E .Img_E {
    width: 80px;
  }
}

@media only screen and (max-width: 600px) {
  .WarpperEquipment2 {
    width: 100%;
    margin: 0px 0px -30px 0px;
  }
  .WarpperEquipment2 .Item_E {
    display: block;
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .WarpperEquipment2 .Item_E .Table_E {
    display: table;
    padding: 0px;
  }
  .WarpperEquipment2 .Item_E .Table_E .Img_E {
    display: table-cell;
    width: 100px;
    margin-bottom: 0px;
    padding: 20px 0px 20px 15px;
  }
  .WarpperEquipment2 .Item_E .Table_E .Img_E img {
    display: block;
    width: 100%;
  }
  .WarpperEquipment2 .Item_E .Table_E .Desc_E {
    display: table-cell;
    width: auto;
    text-align: left;
    padding: 20px 15px 20px 20px;
    min-height: 0 !important;
  }
  .WarpperEquipment2 .Item_E .Table_E .Desc_E .BottomButtons {
    position: static;
  }
  .WarpperEquipment2 .Item_E .Table_E .Desc_E .BtnOpen a {
    padding-left: 20px;
    padding-right: 20px;
    width: auto;
  }
  .WarpperEquipment2 .Item_E .Table_E.Presentation .Img_E {
    padding: 20px 0px 20px 15px;
  }
}

/* Resource Bank */
@media only screen and (max-width: 1200px) {
  .ResourceBank .Top .Table {
    height: 400px;
  }
  .ResourceBank .Top .Table .Img {
    width: 360px;
  }
  .ResourceBank .Top .Table .Desc .Title {
    font-size: 55px;
  }
  .ResourceBank .BtnBack .Txt_Four {
    display: none;
  }
  .ResourceBankLanding .WrapperKeyStage .Item {
    width: 200px;
  }
}
@media only screen and (max-width: 1024px) {
  .ResourceBank .Top .Table .Desc .Title {
    font-size: 50px;
  }
  .ResourceBank .Content .Inner {
    padding: 60px 0px;
  }
  .ResourceBank .BtnBack {
    display: none;
  }

  .ResourceBankLanding .WrapperKeyStage {
    width: 104%;
    margin: 0px 0px -40px 0px;
  }
  .ResourceBankLanding .WrapperKeyStage .Item {
    width: 29.33%;
    margin: 0px 4% 40px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .ResourceBank .Top {
    padding: 0px;
  }
  .ResourceBank .Top .Inner {
    padding: 0px;
  }
  .ResourceBank .Top .Table {
    display: block;
    height: auto;
    text-align: center;
  }
  .ResourceBank .Top .Table .Desc {
    display: block;
    padding: 40px 0px;
  }
  .ResourceBank .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .ResourceBank .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .ResourceBank .Top .Table .Desc .SearchBox {
    width: fit-content;
    margin: 30px auto 20px;
  }
  .ResourceBank .Top .Table .Img {
    display: none;
  }
  .ResourceBank .Content .Inner {
    padding: 40px 0px;
  }

  .WrapperActivity .Item_A .Activity_Top .Txt {
    font-size: 30px;
  }
  .WrapperActivity .Item_A .Activity_Top .IconOne {
    top: 35px;
  }
  .WrapperActivity .Item_A .Activity_Top .IconTwo {
    top: 35px;
  }

  .ResourceBankLanding .WrapperKeyStage {
    margin: 0px 0px -30px 0px;
  }
  .ResourceBankLanding .WrapperKeyStage .Item {
    width: 46%;
    margin: 0px 4% 30px 0px;
  }
  .ResourceBankLanding .WrapperKeyStage .Item .Img img {
    width: 100px;
  }
}
@media only screen and (max-width: 480px) {
  .ResourceBank .Top .Table .Desc .Title {
    font-size: 40px;
  }

  .ResourceBankLanding .WrapperKeyStage {
    width: 100%;
  }
  .ResourceBankLanding .WrapperKeyStage .Item {
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .ResourceBankLanding .WrapperKeyStage .Item .Img img {
    width: 80px;
  }
}

/* Warpper Resource */
@media only screen and (max-width: 1024px) {
  .WarpperResource .Item_R {
    width: 30.33%;
  }
}
@media only screen and (max-width: 768px) {
  .WarpperResource {
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .WarpperResource .Item_R {
    display: block;
    width: 100%;
    margin: 0px 0px 30px 0px;
  }
  .WarpperResource .Item_R .Table_R {
    display: table;
    padding: 0px;
  }
  .WarpperResource .Item_R .Table_R .Img_R {
    display: table-cell;
    width: 100px;
    margin-bottom: 0px;
    padding: 20px;
  }
  .WarpperResource .Item_R .Table_R .Img_R img {
    display: block;
    width: 100%;
  }
  .WarpperResource .Item_R .Table_R .Desc_R {
    display: table-cell;
    width: auto;
    text-align: left;
    padding: 20px;
    min-height: inherit !important;
  }
  .WarpperResource .Item_R .Table_R .Desc_R .VariableText {
    width: 100%;
    margin-left: 0%;
  }
  .WarpperResource .Item_R .Table_R .Desc_R .VariableText .In {
    height: auto;
  }
  .WarpperResource .Item_R .Table_R .Desc_R .VariableText .In .Txt_R {
  }
  .WarpperResource .Item_R .Table_R .Desc_R .VariableText .In .Nbre_R {
  }
  .WarpperResource .Item_R .Table_R .Desc_R .BtnOpen a {
    width: auto;
    padding-left: 30px;
    padding-right: 30px;
  }
  .WarpperResource .Item_R .Table_R .Desc_R .BtnOpen input {
    width: auto;
    padding-left: 30px;
    padding-right: 30px;
  }
  .WarpperResource .Item_R .Table_R .Desc_R .BtnOpen.Top {
    margin-top: 15px;
  }
}
@media only screen and (max-width: 480px) {
  .WarpperResource .Item_R .Table_R .Img_R {
    width: 80px;
  }
}
@media only screen and (max-width: 370px) {
  .WarpperResource .Item_R .Table_R .Desc_R {
    padding-left: 0px;
  }
}

/* Lesson Landing */
@media only screen and (max-width: 1200px) {
  .LessonLanding .Top .Table {
    height: 400px;
  }
  .LessonLanding .Top .Table .Img {
    width: 360px;
  }
  .LessonLanding .Top .Table .Desc .Title {
    font-size: 55px;
  }
  .LessonLanding .Top .BackArrowA {
    top: -100px;
  }
}
@media only screen and (max-width: 1024px) {
  .LessonLanding .Top .Table .Desc .Title {
    font-size: 50px;
  }
  .LessonLanding .Panel_One .Inner {
    padding: 60px 0px;
  }
  .LessonLanding .Panel_Two .Inner {
    padding: 60px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .LessonLanding .Top {
    padding: 0px;
  }
  .LessonLanding .Top .Inner {
    padding: 0px;
  }
  .LessonLanding .Top .Table {
    display: block;
    height: auto;
    text-align: center;
  }
  .LessonLanding .Top .Table .Desc {
    display: block;
    padding: 40px 0px;
  }
  .LessonLanding .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .LessonLanding .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .LessonLanding .Top .Table .Img {
    display: none;
  }
  .LessonLanding .Top .DownArrow {
    display: none;
  }
  .LessonLanding .Top .BackArrowA {
    top: 20px;
  }
  .LessonLanding .Panel_One .Inner {
    padding: 40px 0px;
  }
  .LessonLanding .Panel_Two .Inner {
    padding: 40px 0px;
  }
}
@media only screen and (max-width: 480px) {
  .LessonLanding .Top .Table .Desc .Title {
    font-size: 40px;
  }
}

/* Warpper Sheme Of Work */
@media only screen and (max-width: 1024px) {
  .WarpperShemeWork {
    width: 100%;
    margin: 0px 0px -40px 0px;
  }
  .WarpperShemeWork .Item_SW {
    width: 100%;
    margin: 0px 0% 40px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .WarpperShemeWork {
    width: 100%;
    margin: 0px 0px -30px 0px;
  }
  .WarpperShemeWork .Item_SW {
    width: 100%;
    margin: 0px 0% 30px 0px;
  }
}
@media only screen and (max-width: 480px) {
  .WarpperShemeWork .Item_SW .Table_SW {
    display: block;
    width: 100%;
    height: auto;
  }
  .WarpperShemeWork .Item_SW .Table_SW .Year_SW {
    display: block;
    width: 100%;
    text-align: center;
  }
  .WarpperShemeWork .Item_SW .Table_SW .Desc_SW {
    display: block;
    text-align: center;
    padding: 20px 0px;
  }
  .WarpperShemeWork .Item_SW .Table_SW .Button_SW {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 0px 30px 30px 30px;
  }
}

/* Warpper Lesson Plans */
@media only screen and (max-width: 1024px) {
  .WarpperLessonPlans {
    width: 100%;
    margin: 0px 0px -40px 0px;
  }
  .WarpperLessonPlans .Item_LP {
    width: 100%;
    margin: 0px 0% 40px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .WarpperLessonPlans {
    width: 100%;
    margin: 0px 0px -30px 0px;
  }
  .WarpperLessonPlans .Item_LP {
    width: 100%;
    margin: 0px 0% 30px 0px;
  }
}
@media only screen and (max-width: 480px) {
  .WarpperLessonPlans .Item_LP .Table_LP {
    display: block;
    width: 100%;
    height: auto;
  }
  .WarpperLessonPlans .Item_LP .Table_LP .Year_LP {
    display: block;
    width: 100%;
    text-align: center;
  }
  .WarpperLessonPlans .Item_LP .Table_LP .Desc_LP {
    display: block;
    text-align: center;
    padding: 20px 0px;
  }
  .WarpperLessonPlans .Item_LP .Table_LP .Button_LP {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 0px 30px 30px 30px;
  }
  .WarpperLessonPlans .Item_LP .Table_LP .Item_Subscribe .CheckboxRow {
    margin: 20px auto 20px auto;
  }
}

/* Lesson Detail */
@media only screen and (max-width: 1200px) {
  .LessonDetail .Top .BtnBack .Txt_Four {
    display: none;
  }
  .LessonDetail .Top .Table_Inner .Cell_Inner {
    padding: 160px 0px 0px 0px;
  }
  .LessonDetail .Top .Table {
    height: 400px;
    padding-top: 100px;
  }
  .LessonDetail .Top .Table .Img {
    width: 360px;
  }
  .LessonDetail .Top .Table .Desc .Title {
    font-size: 55px;
  }
}
@media only screen and (max-width: 1024px) {
  .LessonDetail .Top .BtnBack {
    display: none;
  }
  .LessonDetail .Top .Table_Inner .Cell_Inner {
    padding: 0px;
  }
  .LessonDetail .Top .Table .Desc .Title {
    font-size: 50px;
  }
  .LessonDetail .Panel_One .Inner {
    padding: 60px 0px;
  }
  .LessonDetail .Panel_Two {
    display: block;
    width: 100%;
  }
  .LessonDetail .Panel_Two .Inner {
    padding: 60px 40px;
  }
  .LessonDetail .Panel_Two .WidthCell {
    max-width: none;
    display: block;
  }
  .LessonDetail .Panel_Two .Cell_Left {
    display: block;
    width: 100%;
  }
  .LessonDetail .Panel_Two .Cell_Right {
    display: block;
    width: 100%;
  }
  .LessonDetail .Panel_Three .Inner {
    padding: 60px 0px;
  }
  .LessonDetail .Panel_Four .Inner {
    padding: 60px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .LessonDetail .Top {
    padding: 0px;
  }
  .LessonDetail .Top .Inner {
    padding: 0px;
  }
  .LessonDetail .Top .Table {
    display: block;
    height: auto;
    text-align: center;
    padding-top: 0px;
  }
  .LessonDetail .Top .Table .Desc {
    display: block;
    padding: 40px 0px;
  }
  .LessonDetail .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .LessonDetail .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .LessonDetail .Top .Table .Img {
    display: none;
  }
  .LessonDetail .Top .DownArrow {
    display: none;
  }
  .LessonDetail .Panel_One .Inner {
    padding: 40px 0px;
  }
  .LessonDetail .Panel_One .Subtitle {
    font-size: 24px;
  }
  .LessonDetail .Panel_One .Txt {
    font-size: 30px;
  }
  .LessonDetail .Panel_Two .Inner {
    padding: 40px 30px;
  }
  .LessonDetail .Panel_Two .Cell_Left .SubTitle {
    font-size: 30px;
  }
  .LessonDetail .Panel_Two .Cell_Right .SubTitle {
    font-size: 30px;
  }
  .LessonDetail .Panel_Two .Cell_Right .List {
    font-size: 24px;
    margin: 20px 0px 0px 0px;
  }
  .LessonDetail .Panel_Three .Inner {
    padding: 40px 0px;
  }
  .LessonDetail .Panel_Three .Subtitle {
    font-size: 30px;
  }
  .LessonDetail .Panel_Four .Inner {
    padding: 40px 0px;
  }
  .LessonDetail .Panel_Four .Subtitle {
    font-size: 30px;
  }

  .LessonDetail .Pagination {
    margin-bottom: 40px;
  }
  .LessonDetail .Pagination .Next {
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 480px) {
  .LessonDetail .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .LessonDetail .Panel_Two .Inner {
    padding: 40px 20px;
  }
}

/* Panel Cms */
@media only screen and (max-width: 1024px) {
  .Panel_Cms .Inner {
    padding: 60px 0px;
  }
  .Panel_Cms .WrapperPlan .ItemPlan {
    border-bottom: 1px solid #ebecee;
    margin-bottom: 60px;
    padding-bottom: 60px;
  }
  .Panel_Cms .Time {
    float: none;
    text-align: center;
  }
  .Panel_Cms .Time .NM {
    display: inline-block;
  }
  .Panel_Cms .Subtitle {
    float: none;
    padding: 30px 0px 5px 0px;
    text-align: center;
  }
  .Panel_Cms ol {
    width: 100%;
  }
  .Panel_Cms ol li {
    display: block;
    width: 100%;
    margin: 0px 0px 40px 0px;
  }
  .Panel_AssessmentCriteria .Column {
    display: block;
    width: 100%;
    padding: 0px;
  }
  .Panel_NationalCurriculum .Column {
    display: block;
    width: 100%;
    padding: 0px;
  }
}
@media only screen and (max-width: 768px) {
  .Panel_Cms .Inner {
    padding: 40px 0px;
  }
  .Panel_Cms .WrapperPlan .ItemPlan {
    border-bottom: 1px solid #ebecee;
    margin-bottom: 40px;
    padding-bottom: 40px;
  }
  .Panel_Cms .Equip {
    display: block;
  }
  .Panel_Cms .Equip .Img {
    display: block;
    width: 100%;
    padding: 0px 0px 0px 0px;
    text-align: center;
  }
  .Panel_Cms .Equip .Img img {
    width: 100px;
    display: inline-block;
  }
  .Panel_Cms .Equip .Desc {
    display: block;
  }
  .Panel_KeyVocabulary ul {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 0px;
    -moz-column-gap: 0px;
    column-gap: 0px;
  }
  .Panel_HealthSafety .Smalltitle {
    font-size: 24px;
  }
  .Panel_HealthSafety .Txt {
    font-size: 30px;
  }
}

/* Create Class */
@media only screen and (max-width: 1200px) {
  .CreateClass .BtnBack .Txt_Four {
    display: none;
  }
}
@media only screen and (max-width: 1024px) {
  .CreateClass .BtnBack {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  .CreateClass .Table_CC .Cell_CC {
    padding: 60px 0px 60px 0px;
  }
}
@media only screen and (max-width: 480px) {
  .CreateClass .Form {
    width: 100%;
  }
}

/* My Classes */
@media only screen and (max-width: 1200px) {
  .MyClasses .Content .WrapperList {
    width: 102%;
  }
  .MyClasses .Content .WrapperList .ItemList {
    display: inline-block;
    width: 31.33%;
    margin: 0px 2% 20px 0px;
  }
  .MyClasses .Content .HeadList .Inner_HL {
    padding: 0px 30px 20px 30px;
  }
  .MyClasses .Content .HeadList .Table_HL .Cell_01 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL .Cell_02 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL .Cell_03 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL .Cell_04 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL .Cell_05 {
    width: 100%;
    text-align: center;
  }
  .MyClasses .Content .TableList {
    display: block;
  }
  .MyClasses .Content .TableList .CellList {
    display: block;
    text-align: left;
  }
  .MyClasses .Content .TableList .CellList .BtnAssessments {
    margin-left: 0px;
  }
  .MyClasses .Content .TableList .CellList .BtnView {
    margin-left: 0px;
  }
  .MyClasses .Content .TableList .CellList .Lab {
    display: inline-block;
  }
  .MyClasses .Content .TableList .Cell_01 {
    width: 100%;
  }
  .MyClasses .Content .TableList .Cell_02 {
    width: 100%;
    margin-top: 20px;
  }
  .MyClasses .Content .TableList .Cell_03 {
    width: 100%;
    margin-top: 10px;
  }
  .MyClasses .Content .TableList .Cell_04 {
    width: 100%;
    margin-top: 10px;
  }
  .MyClasses .Content .TableList .Cell_05 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyClasses .Content .TableList .Cell_06 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyClasses .Content .TableList .Cell_07 {
    width: 100%;
    margin-top: 20px;
  }
  .MyClasses .Content .TableList .Cell_08 {
    width: 100%;
    margin-top: 20px;
  }

  /* Updates for School Users page */
  .MyClasses .Content .HeadList .Table_HL2 .Cell_01 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL2 .Cell_02 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL2 .Cell_03 {
    display: none;
  }
  .MyClasses .Content .HeadList .Table_HL2 .Cell_05 {
    width: 100%;
    text-align: center;
  }

  .MyClasses .Content .TableList.TableListUpd .Cell_01 {
    width: 100%;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_01 .Name {
    font-size: 20px;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_02 {
    width: 100%;
    margin-top: 0px;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_02 .Name {
    font-size: 20px;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_03 {
    width: 100%;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_04 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_05 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyClasses .Content .TableList.TableListUpd .Cell_06 {
    width: 100%;
    margin-top: 24px;
  }
  .MyClasses .Content .TableList.TableListUpd .CellList .Email {
    font-size: 13px;
  }

  .MyClasses .Content .TableList.MyClassesList .Cell_01 {
    width: 100%;
  }
  .MyClasses .Content .TableList.MyClassesList .Cell_02 {
    width: 100%;
  }
  .MyClasses .Content .TableList.MyClassesList .Cell_03 {
    display: none;
  }
  .MyClasses .Content .TableList.MyClassesList .Cell_07 {
    width: 100%;
    text-align: left;
  }
  .MyClasses .Content .TableList.MyClassesList .Cell_08 {
    width: 100%;
  }
  .MyClasses .Content .TableList.MyClassesList .CellList .BtnView {
    width: 100%;
    margin: 0px;
  }
}
@media only screen and (max-width: 1024px) {
  .MyClasses .Inner {
    padding: 160px 0px 60px 0px;
  }
  .MyClasses .Top.MyClassesTopRow {
    flex-wrap: wrap;
  }
  .MyClasses .Top.MyClassesTopRow .Desc {
    flex: 0 0 100%;
    padding-right: 0px;
  }
  .MyClasses .Top.MyClassesTopRow .Buttons {
    flex: 0 0 100%;
  }
  .MyClasses .Top .Desc {
    float: none;
    text-align: center;
  }
  .MyClasses .Top .Buttons {
    float: none;
    margin-top: 30px;
    text-align: center;
  }
  .MyClasses .Top .Buttons .BtnDarkTwo {
    margin-bottom: 20px;
  }
  .MyClasses .Content .WrapperList .ItemList {
    width: 48%;
  }
  .BtnBack.MyClassesBackBtn {
    flex-wrap: wrap;
  }
  .BtnBack.MyClassesBackBtn .Icon_Four {
    margin: 0px auto 20px auto;
  }
  .BtnBack.MyClassesBackBtn .Txt_Four {
    flex: 0 0 100%;
    padding-left: 0px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 768px) {
  .MyClasses .Inner {
    padding: 40px 0px 40px 0px;
  }
  .MyClasses .Top .Desc .Nbre {
    font-size: 30px;
  }
  .MyClasses .Top .Buttons .BtnCopyMap {
    display: block;
    width: 100%;
    text-align: center;
  }
  .MyClasses .Top .Buttons .BtnCopyMap a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnCopyMap input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnArchive {
    display: block;
    width: 100%;
    text-align: center;
    margin-left: 0px;
  }
  .MyClasses .Top .Buttons .BtnArchive a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnArchive input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnCopy {
    display: block;
    width: 100%;
    text-align: center;
    margin-left: 0px;
  }
  .MyClasses .Top .Buttons .BtnCopy a {
    padding: 14px 0px;
    width: 300px;
  }
  .MyClasses .Top .Buttons .BtnCreate {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }
  .MyClasses .Top .Buttons .BtnCreate a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnCreate input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnUploadExcelFile {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }
  .MyClasses .Top .Buttons .BtnUploadExcelFile a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Top .Buttons .BtnUploadExcelFile input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyClasses .Content .WrapperList {
    width: 100%;
  }
  .MyClasses .Content .WrapperList .ItemList {
    display: block;
    width: 100%;
    margin: 0px 0px 20px 0px;
  }
}

/* Pagination */
@media only screen and (max-width: 768px) {
  .Pagination .Previous {
    display: none;
  }
  .Pagination .Next {
    display: none;
  }
  .Pagination.ShowSm .Previous {
    display: inline-block;
  }
  .Pagination.ShowSm .Next {
    display: inline-block;
  }
  .Pagination.ShowSm .Previous.Hidden {
    display: none;
  }
  .Pagination.ShowSm .Next.Hidden {
    display: none;
  }
}

@media only screen and (max-width: 600px) {
  .Pagination.ShowSm .Previous {
    float: none;
    display: block;
    width: 100%;
    margin: 0px 0px 15px;
  }
  .Pagination.ShowSm .Next {
    float: none;
    display: block;
    width: 100%;
    margin: 0px;
  }
  .Pagination.Light {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
    padding: 0px 0px 40px 0px;
  }
  .Pagination.Light .Previous {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
  }
  .Pagination.Light .Next {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
  }
}

/* Dark Pagination */
@media only screen and (max-width: 768px) {
  .DarkPagination .Preview {
    display: none;
  }
  .DarkPagination .Next {
    display: none;
  }
}

/* Prev/Next Buttons With Icons */
@media only screen and (max-width: 768px) {
  .BackForwardBtns .BtnWithArrow.Back {
    margin-bottom: 40px;
  }
  .BackForwardBtns .BtnWithArrow.Forward {
    margin-bottom: 40px;
  }
  .BackForwardBtns .BtnWithArrow .HideSm {
    display: none;
  }
}

/* View Classes */
@media only screen and (max-width: 1200px) {
  .ViewClasses .Top .Desc .BtnBack .Txt_Four {
    display: none;
  }
  .ViewClasses .Content .WrapperList {
    width: 102%;
    margin: 0px 0px -20px 0px;
  }
  .ViewClasses .Content .WrapperList .ItemList {
    width: 31.33%;
    margin: 0px 2% 20px 0px;
  }
  .ViewClasses .Content .HeadList .Inner_HL {
    padding: 0px 30px 20px 30px;
    text-align: center;
  }
}
@media only screen and (max-width: 1024px) {
  .ViewClasses .Inner {
    padding: 160px 0px 60px 0px;
  }
  .ViewClasses .Top {
    margin: 0px 0px 30px 0px;
  }
  .ViewClasses .Top .Desc .BtnBack {
    display: none;
  }
  .ViewClasses .Top .Desc {
    float: none;
    text-align: center;
  }
  .ViewClasses .Top .Buttons {
    float: none;
    margin-top: 30px;
    text-align: center;
  }
  .ViewClasses .Content .WrapperList .ItemList {
    width: 48%;
  }
}
@media only screen and (max-width: 768px) {
  .ViewClasses .Inner {
    padding: 40px 0px 40px 0px;
  }
  .ViewClasses .Top .Buttons .BtnAssign {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }
  .ViewClasses .Top .Buttons .BtnAssign a {
    padding: 14px 0px;
    width: 220px;
  }
  .ViewClasses .Top .Buttons .BtnAssign input {
    padding: 14px 0px;
    width: 220px;
  }
  .ViewClasses .Content .WrapperList {
    width: 100%;
  }
  .ViewClasses .Content .WrapperList .ItemList {
    display: block;
    width: 100%;
    margin: 0px 0px 20px 0px;
  }
}

/* Assign Pupils */
@media only screen and (max-width: 1200px) {
  .AssignPupils .BtnBack .Txt_Four {
    display: none;
  }
}
@media only screen and (max-width: 1024px) {
  .AssignPupils .TopLabelRow {
    display: none;
  }
  .AssignPupils .LBRTxtRow {
    flex-wrap: wrap;
  }
  .AssignPupils .LBRTxtRow .TRCol {
    flex: 0 0 100%;
    margin-bottom: 10px;
  }
  .AssignPupils .LBRTxtRow .TRCol:last-child {
    margin-bottom: 0px;
  }
  .AssignPupils .LBRTxtRow .TRCol .SmLabel {
    display: block;
  }
  .AssignPupils .Top {
    margin: 0px 0px 30px 0px;
  }
  .AssignPupils .Top .Desc .BtnBack {
    display: none;
  }
  .AssignPupils .Top .Desc {
    float: none;
    text-align: center;
  }
  .AssignPupils .Top .Buttons {
    float: none;
    margin-top: 30px;
    text-align: center;
  }
  .AssignPupils .TopInfoRow .LeftIcon {
    display: none;
  }
  .AssignPupils .PupilList {
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  .AssignPupils .Table_AP .Cell_AP {
  }
  .AssignPupils .Form {
    width: 100%;
    display: block;
  }
  .AssignPupils .Form .PreviousClass {
    width: 100%;
    display: block;
    padding: 0px 0px 40px 0px;
  }
  .AssignPupils .Form .PreviousClass .List_Name .Iem_Name {
    display: inline-block;
  }
  .AssignPupils .Form .PreviousClass .List_Name .Iem_Name .Comma {
    display: inline-block;
  }
  .AssignPupils .Form .PreviousClass .List_Name .Iem_Name:last-child .Comma {
    display: none;
  }
  .PupilList {
    display: block;
  }
  .AssignPupils .Top {
    padding-top: 40px;
  }
}
@media only screen and (max-width: 768px) {
  .PupilList .BtnSave a {
    width: 100%;
  }
  .PupilList .BtnSave input {
    width: 100%;
  }
}

/* Assessments */
@media only screen and (max-width: 1200px) {
  .Assessments .Top .BtnBack .Txt_Four {
    display: none;
  }
  .Assessments .Top .Table_Inner .Cell_Inner {
    padding: 160px 0px 0px 0px;
  }
  .Assessments .Top .Table {
    height: 400px;
    padding-top: 100px;
  }
  .Assessments .Top .Table .Img {
    width: 360px;
  }
  .Assessments .Top .Table .Desc .Title {
    font-size: 55px;
  }
}
@media only screen and (max-width: 1024px) {
  .Assessments .Top .BtnBack {
    display: none;
  }
  .Assessments .Top .Table_Inner .Cell_Inner {
    padding: 0px;
  }
  .Assessments .Top .Table .Desc .Title {
    font-size: 50px;
  }
  .Assessments .Content .Inner {
    padding: 60px 0px 60px 0px;
  }

  .AssessTableContainer .AssessTableInner {
    margin: 0px 40px;
  }

  .WrapperSeason .ItemSeason {
    width: auto;
    margin: 0px -40px 0px 40px;
  }
  .WrapperSeason .ItemSeason:first-child {
    margin: 0px -40px 0px 0px;
  }
  .WrapperSeason .ItemSeason:last-child {
    margin: 0px 40px 0px 40px;
  }
}
@media only screen and (max-width: 768px) {
  .Assessments .Top {
    padding: 0px;
  }
  .Assessments .Top .Inner {
    padding: 0px;
  }
  .Assessments .Top .Table {
    display: block;
    height: auto;
    text-align: center;
    padding-top: 0px;
  }
  .Assessments .Top .Table .Desc {
    display: block;
    padding: 40px 0px;
  }
  .Assessments .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .Assessments .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .Assessments .Top .Table .Img {
    display: none;
  }
  .Assessments .Top .DownArrow {
    display: none;
  }
  .Assessments .Content .Inner {
    padding: 40px 0px 40px 0px;
  }

  .AssessCriteriaList .FieldsRow .Col2 {
    width: 20px;
  }

  .AssessTableContainer .AssessTableInner {
    margin: 0px 30px;
  }

  .WrapperSeason .ItemSeason {
    width: auto;
    margin: 0px -30px 0px 30px;
  }
  .WrapperSeason .ItemSeason:first-child {
    margin: 0px -30px 0px 0px;
  }
  .WrapperSeason .ItemSeason:last-child {
    margin: 0px 30px 0px 30px;
  }

  .swiper-assessments:hover .swiper-button-next {
    display: none;
  }
  .swiper-assessments:hover .swiper-button-prev {
    display: none;
  }
}
@media only screen and (max-width: 480px) {
  .Assessments .Top .Table .Desc .Title {
    font-size: 40px;
  }

  .AssessTableContainer .AssessTableInner {
    margin: 0px 20px;
  }

  .WrapperSeason .ItemSeason {
    width: auto;
    margin: 0px -20px 0px 20px;
  }
  .WrapperSeason .ItemSeason:first-child {
    margin: 0px -20px 0px 0px;
  }
  .WrapperSeason .ItemSeason:last-child {
    margin: 0px 20px 0px 20px;
  }
}

@media only screen and (max-width: 768px) {
  .PopupParent .Popup .ActualContent .Content2 {
    padding: 10px 10px 0px 10px;
  }

  .PopupParent .BtmBtnsContainer {
    padding: 15px 20px;
  }
  .PopupParent .BtmBtnsContainer .BtmBtns {
    display: flex;
    flex-wrap: wrap;
  }
  .PopupParent .BtmBtnsContainer .BtmBtns .LeftBtn {
    flex: 0 0 100%;
    order: 3;
  }
  .PopupParent .BtmBtnsContainer .BtmBtns .MiddleBtn {
    flex: 0 0 100%;
    order: 2;
    margin-bottom: 10px;
    margin-left: 0px;
  }
  .PopupParent .BtmBtnsContainer .BtmBtns .RightBtn {
    flex: 0 0 100%;
    order: 1;
    margin-bottom: 10px;
    margin-left: 0px;
  }
  .PopupParent .BtmBtnsContainer .BtmBtns a {
    width: 100%;
  }
}

@media only screen and (max-width: 480px) {
  .PopupParent .Popup .ActualContent .Content2 {
    padding: 5px 5px 0px 5px;
  }

  .PopupParentV2 .Popup .PopupMsg h2.Hdr3 {
    padding: 17px 60px 17px 20px;
  }

  .PopupParentV2 .Popup .MsgContainer {
    padding-left: 20px;
    padding-right: 20px;
  }

  .PopupParentV2 .Popup .PopupMsg.MiddleBlock {
    max-height: calc(100vh - 230px);
  }

  .PopupParentV2 .Popup .BtmBtnsContainer {
    padding: 15px 20px 5px 20px;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer .BtmBtns {
    display: flex;
    flex-wrap: wrap;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer .BtmBtns .LeftBtn {
    flex: 0 0 100%;
    order: 3;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer .BtmBtns .MiddleBtn {
    flex: 0 0 100%;
    order: 2;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer .BtmBtns .RightBtn {
    flex: 0 0 100%;
    order: 1;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer .BtmBtns a {
    width: 100%;
  }



  .PopupParentV3 .Popup .PopupMsg h2.Hdr3 {
    padding: 17px 60px 17px 20px;
  }

  .PopupParentV3 .Popup .MsgContainer {
    padding-left: 20px;
    padding-right: 20px;
  }

  .PopupParentV3 .Popup .PopupMsg.MiddleBlock {
    max-height: calc(100vh - 230px);
  }

  .PopupParentV3 .Popup .BtmBtnsContainer {
    padding: 15px 20px 5px 20px;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer .BtmBtns {
    display: flex;
    flex-wrap: wrap;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer .BtmBtns .LeftBtn {
    flex: 0 0 100%;
    order: 3;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer .BtmBtns .MiddleBtn {
    flex: 0 0 100%;
    order: 2;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer .BtmBtns .RightBtn {
    flex: 0 0 100%;
    order: 1;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer .BtmBtns a {
    width: 100%;
  }
}

@media only screen and (max-width:360px) {
  .PopupParentV2 .Popup .PopupMsg h2.Hdr3 {
    padding: 17px 60px 17px 10px;
  }

  .PopupParentV2 .Popup .MsgContainer {
    padding-left: 10px;
    padding-right: 10px;
  }

  .PopupParentV2 .Popup .BtmBtnsContainer {
    padding-left: 10px;
    padding-right: 10px;
  }



  .PopupParentV3 .Popup .PopupMsg h2.Hdr3 {
    padding: 17px 60px 17px 10px;
  }

  .PopupParentV3 .Popup .MsgContainer {
    padding-left: 10px;
    padding-right: 10px;
  }

  .PopupParentV3 .Popup .BtmBtnsContainer {
    padding-left: 10px;
    padding-right: 10px;
  }
}


/* Panels */
@media only screen and (max-width:768px) {
  .PopoutContainer.Panel  {
    width: 100% !important;
    max-width: 100% !important;
  }

  .PopoutContainer.Panel .PopoutMenuTitleBar  {
    padding-left: 30px;
    padding-right: 30px;
  }

  .PopoutContainer.Panel .PopoutMenuContent {
    padding-left: 30px;
    padding-right: 30px;
  }

  .PopoutContainer.Panel .ErrorMsg  {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media only screen and (max-width:480px) {
  .PopoutContainer.Panel .PopoutMenuTitleBar  {
    padding-left: 20px;
    padding-right: 20px;
  }

  .PopoutContainer.Panel .PopoutMenuTitleBar .CloseButton {
    left: 0px;
  }

  .PopoutContainer.Panel .PopoutMenuContent {
    padding-left: 20px;
    padding-right: 20px;
  }

  .PopoutContainer.Panel .ErrorMsg  {
    padding-left: 20px;
    padding-right: 20px;
  }

  .PopoutContainer.Panel .PopoutMenuFooter {
    flex-wrap: wrap;
    height: auto;
    padding: 10px 20px;
  }

  .PopoutContainer.Panel .PopoutMenuFooter .Btn {
    width: 100%;
    margin-bottom: 10px;
  }

  .PopoutContainer.Panel .PopoutMenuFooter .SecondaryButton {
    order: 2;
    margin-right: 0px;
    margin-bottom: 0px;
  }
}

@media only screen and (max-width:360px) {
  .PopoutContainer.Panel  {
    min-width: 320px !important;
  }

  .PopoutContainer.Panel .PopoutMenuTitleBar  {
    padding-left: 10px;
    padding-right: 10px;
  }

  .PopoutContainer.Panel .PopoutMenuContent {
    padding-left: 10px;
    padding-right: 10px;
  }

  .PopoutContainer.Panel .ErrorMsg  {
    padding-left: 10px;
    padding-right: 10px;
  }

  .PopoutContainer.Panel .PopoutMenuFooter {
    padding: 10px 10px;
  }
}


/* My Pupils */
@media only screen and (max-width: 1200px) {
  .MyPupils .Content .HeadList {
    display: block;
  }
  .MyPupils .Content .HeadList .Img_HL {
    display: none;
  }
  .MyPupils .Content .HeadList .Inner_HL {
    display: block;
    padding: 0px 30px 20px 30px;
  }
  .MyPupils .Content .HeadList .Table_HL .Cell_01 {
    display: none;
  }
  .MyPupils .Content .HeadList .Table_HL .Cell_02 {
    display: none;
  }
  .MyPupils .Content .HeadList .Table_HL .Cell_03 {
    display: none;
  }
  .MyPupils .Content .HeadList .Table_HL .Cell_04 {
    display: none;
  }
  .MyPupils .Content .HeadList .Table_HL .Cell_05 {
    width: 100%;
    text-align: center;
  }

  .MyPupils .Content .WrapperList {
    width: 102%;
  }
  .MyPupils .Content .WrapperList .ItemList {
    display: inline-block;
    width: 31.33%;
    margin: 0px 2% 20px 0px;
  }
  .MyPupils .Content .WrapperList .ItemList .ImgList {
    display: block;
    width: 100%;
  }
  .MyPupils .Content .WrapperList .ItemList .ImgList img {
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
  }
  .MyPupils .Content .WrapperList .ItemList .InnerList {
    display: block;
  }
  .MyPupils .Content .TableList {
    display: block;
  }
  .MyPupils .Content .TableList .CellList {
    display: block;
    text-align: left;
  }
  .MyPupils .Content .TableList .CellList .BtnView {
    margin-left: 0px;
  }
  .MyPupils .Content .TableList .CellList .Lab {
    display: inline-block;
  }
  .MyPupils .Content .TableList .Cell_01 {
    width: 100%;
  }
  .MyPupils .Content .TableList .Cell_02 {
    width: 100%;
    margin-top: 20px;
  }
  .MyPupils .Content .TableList .Cell_03 {
    width: 100%;
    margin-top: 10px;
  }
  .MyPupils .Content .TableList .Cell_04 {
    width: 100%;
    margin-top: 10px;
  }
  .MyPupils .Content .TableList .Cell_05 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyPupils .Content .TableList .Cell_06 {
    width: 49%;
    margin-top: 30px;
    display: inline-block;
    text-align: center;
  }
  .MyPupils .Content .TableList .Cell_07 {
    width: 100%;
    margin-top: 20px;
  }
}
@media only screen and (max-width: 1024px) {
  .MyPupils .Inner {
    padding: 160px 0px 60px 0px;
  }
  .MyPupils .Top .Desc {
    float: none;
    text-align: center;
  }
  .MyPupils .Top .Buttons {
    float: none;
    margin-top: 30px;
    margin-left: -20px;
    text-align: center;
  }
  .MyPupils .Content .WrapperList .ItemList {
    width: 48%;
  }
}
@media only screen and (max-width: 768px) {
  .MyPupils .Inner {
    padding: 40px 0px 40px 0px;
  }
  .MyPupils .Top .Buttons {
    margin-left: 0px;
  }
  .MyPupils .Top .Buttons .BtnUploadExcelFile {
    display: block;
    width: 100%;
    text-align: center;
  }
  .MyPupils .Top .Buttons .BtnUploadExcelFile a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyPupils .Top .Buttons .BtnUploadExcelFile input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyPupils .Top .Buttons .BtnCreate {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }
  .MyPupils .Top .Buttons .BtnCreate a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyPupils .Top .Buttons .BtnCreate input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyPupils .Top .Filter {
    display: block;
  }
  .MyPupils .Top .Filter .Title {
    display: block;
    width: 100%;
  }
  .MyPupils .Top .Filter .Wrapper_F {
    display: block;
  }
  .MyPupils .Content .WrapperList {
    width: 100%;
  }
  .MyPupils .Content .WrapperList .ItemList {
    display: block;
    width: 100%;
    margin: 0px 0px 20px 0px;
  }
}

/* Updating Existing Pupils */
@media only screen and (max-width: 768px) {
  .EPFilterList .FilterRow {
    flex: 0 0 100%;
  }

  .ExistingPupilsList .EPRow .Img {
    flex: 0 0 45px;
  }
  .ExistingPupilsList .EPRow .Name {
    flex: 0 0 60%;
  }
  .ExistingPupilsList .EPRow .Name .Txt {
    font-size: 11px;
  }
  .ExistingPupilsList .EPRow .Class {
    text-align: right;
    padding-right: 10px;
  }
  .ExistingPupilsList .EPRow .Class .Txt {
    font-size: 10px;
  }
  .ExistingPupilsList .EPRow .Year {
    display: none;
  }
  .ExistingPupilsList .EPRow .KeyStage {
    display: none;
  }
  .ExistingPupilsList .EPRow.TopRow .Name .Txt {
    font-size: 12px;
  }
  .ExistingPupilsList .EPRow.TopRow .Class .Txt {
    font-size: 12px;
  }
}

/* Create Pupil */
@media only screen and (max-width: 1200px) {
  .CreatePupil .BtnBack .Txt_Four {
    display: none;
  }

  .WrapperImage {
  }
  .WrapperImage .ItemImage {
    width: 46%;
  }
}
@media only screen and (max-width: 1024px) {
  .CreatePupil .BtnBack {
    display: none;
  }
  .CreatePupil .Form {
    width: 100%;
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  .CreatePupil .Table_CC .Cell_CC {
    padding: 60px 0px 60px 0px;
  }
  .CreatePupil .Form .Column01 {
    float: none;
    width: 100%;
  }
  .CreatePupil .Form .Column02 {
    float: none;
    width: 100%;
  }
  .CreatePupil .Form .ColumnSpacer {
    display: none;
  }
  .CreatePupil .Form .ColumnBox {
    float: left;
    width: 48%;
  }
  .CreatePupil .Form .ColumnBoxSpacer {
    float: left;
    width: 4%;
    height: 1px;
    display: block;
  }

  .WrapperImage {
    width: 100%;
  }
  .WrapperImage .ItemImage {
    margin: 0px 0px 40px 0px;
    display: block;
    width: 100%;
  }

  .WrapperImage .ItemImage .AddImage {
    border: 2px dashed #3a484e;
    box-sizing: border-box;
    border-radius: 4px;
    position: relative;
    display: block;
  }
  .WrapperImage .ItemImage .AddImage .AddCell {
    position: relative;
    top: auto;
    width: 100%;
    margin-top: auto;
  }
}
@media only screen and (max-width: 480px) {
  .CreatePupil .Form {
    width: 100%;
  }
  .CreatePupil .Form .ColumnBox {
    float: none;
    width: 100%;
  }
  .CreatePupil .Form .ColumnBoxSpacer {
    display: none;
  }
  .CreatePupil .BtnSave a {
    width: 100%;
  }
  .CreatePupil .BtnSave input {
    width: 100%;
  }
}

/* Pupils View */
@media only screen and (max-width: 1200px) {
  .PupilsView .Top .Table {
    height: 400px;
  }
  .PupilsView .Top .Table .Desc .Title {
    font-size: 55px;
  }
  .PupilsView .Top .BtnBack .Txt_Four {
    display: none;
  }
}
@media only screen and (max-width: 1024px) {
  .PupilsView .Top .Inner {
    padding: 150px 0px 0px 0px;
  }
  .PupilsView .Top .SortSelect {
    position: relative;
    top: auto;
    right: auto;
    display: block;
    margin-bottom: 20px;
    width: 100%;
    text-align: center;
  }
  .PupilsView .Top .SortSelect .SortBy {
    width: 160px;
    display: inline-block;
    text-align: left;
  }
  .PupilsView .Top .Table {
    display: block;
    height: auto;
    text-align: center;
  }
  .PupilsView .Top .Table .Img {
    display: inline-block;
    margin: 25px auto;
    padding-right: 0px;
    max-width: 100%;
  }
  .PupilsView .Top .Table .Desc {
    display: block;
    padding-bottom: 40px;
  }
  .PupilsView .Top .Table .Desc .ImgHidden {
    display: block;
  }
  .PupilsView .Top .Table .Desc .Title {
    font-size: 50px;
  }
  .PupilsView .Content .Inner {
    padding: 60px 0px;
  }
  .PupilsView .Top .BtnBack {
    display: none;
  }

  .Wrapper_PV .Item_PV {
    display: block;
    padding-bottom: 60px;
    margin-bottom: 60px;
  }
  .Wrapper_PV .Item_PV .Desc_PV {
    display: block;
  }
  .Wrapper_PV .Item_PV .Pict_PV {
    display: block;
    width: 100%;
    padding: 40px 0px 0px 0px;
  }
}
@media only screen and (max-width: 768px) {
  .PupilsView .Top {
    padding: 0px;
  }
  .PupilsView .Top .Inner {
    padding: 0px;
  }
  .PupilsView .Top .SortSelect {
    margin: 20px 0px 0px 0px;
  }
  .PupilsView .Top .Table .Desc {
    padding: 20px 0px 40px 0px;
  }
  .PupilsView .Top .Table .Desc .Title {
    font-size: 40px;
  }
  .PupilsView .Content .Inner {
    padding: 40px 0px;
  }

  .Wrapper_PV .Item_PV {
    padding-bottom: 40px;
    margin-bottom: 40px;
  }
  .Wrapper_PV .Item_PV .Desc_PV .Status_PV {
    width: 45px;
    height: 45px;
  }
  .Wrapper_PV .Item_PV .Desc_PV .Title_PV {
    font-size: 30px;
  }
}
@media only screen and (max-width: 480px) {
  .PupilsView .Top .Table .Desc .ImgHidden img {
    width: 100%;
  }
  .PupilsView .Top .Table .Desc .Title {
    font-size: 40px;
  }
}

/* My Reporting */
@media only screen and (max-width: 1200px) {
  .MyReporting .Content .HeadList {
    display: none;
  }

  .MyReporting .Content .WrapperList {
    width: 102%;
  }
  .MyReporting .Content .WrapperList .ItemContainer {
    display: inline-block;
    width: 31.33%;
    margin: 0px 2% 20px 0px;
  }
  .MyReporting .Content .WrapperList .ItemList {
    display: block;
  }
  .MyReporting .Content .WrapperList .ItemList .ImgList {
    display: block;
    width: 100%;
  }
  .MyReporting .Content .WrapperList .ItemList .ImgList img {
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
  }
  .MyReporting .Content .WrapperList .ItemList .InnerList {
    display: block;
  }
  .MyReporting .Content .TableList {
    display: block;
  }
  .MyReporting .Content .TableList .CellList {
    display: block;
    text-align: left;
  }
  .MyReporting .Content .TableList .PupilNumber {
    font-size: 16px;
  }
  .MyReporting .Content .TableList .WorkTowards {
    font-size: 16px;
    color: #5c7279;
  }
  .MyReporting .Content .TableList .SmHiddenTitle {
    display: inline-block;
    vertical-align: top;
    width: 48%;
    margin-right: 1%;
    font-size: 12px;
    font-weight: 400;
    color: #5c7279;
    font-style: italic;
    font-family: "Quicksand", Arial, Helvetica, Verdana;
  }
  .MyReporting .Content .TableList .SmTitle {
    display: inline-block;
    vertical-align: top;
    width: 48%;
    margin-left: 1%;
    text-align: right;
  }
  .MyReporting .Content .TableList .Cell_01 {
    width: 100%;
    margin-top: -5px;
  }
  .MyReporting .Content .TableList .Cell_02 {
    width: 100%;
    margin: 10px 0px 30px 0px;
  }
  .MyReporting .Content .TableList .Cell_03 {
    width: 100%;
    margin-top: 10px;
  }
  .MyReporting .Content .TableList .Cell_04 {
    width: 100%;
    margin-top: 10px;
  }
  .MyReporting .Content .TableList .Cell_05 {
    width: 100%;
    margin-top: 10px;
    text-align: left;
  }
}
@media only screen and (max-width: 1024px) {
  .MyReporting .Inner {
    padding: 160px 0px 60px 0px;
  }

  .MyReporting .Top .Desc {
    float: none;
    text-align: center;
  }
  .MyReporting .Top .Buttons {
    float: none;
    margin-top: 30px;
    text-align: center;
  }

  .MyReporting .ReportingPageTabs {
    flex-wrap: wrap;
  }

  .MyReporting .ReportingPageTabs a {
    flex: 0 0 100%;
  }

  .MyReporting .Content .WrapperList .ItemContainer {
    width: 48%;
  }
}
@media only screen and (max-width: 768px) {
  .MyReporting .Inner {
    padding: 40px 0px 40px 0px;
  }
  .MyReporting .Top .Buttons .ExportData {
    display: block;
    width: 100%;
    text-align: center;
  }
  .MyReporting .Top .Buttons .ExportData a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyReporting .Top .Buttons .ExportData input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyReporting .Top .Buttons .BtnPrint {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }
  .MyReporting .Top .Buttons .BtnPrint a {
    padding: 14px 0px;
    width: 220px;
  }
  .MyReporting .Top .Buttons .BtnPrint input {
    padding: 14px 0px;
    width: 220px;
  }
  .MyReporting .Top .Filter {
    display: block;
  }
  .MyReporting .Top .Filter .Title {
    display: block;
    width: 100%;
  }
  .MyReporting .Top .Filter .Wrapper_F {
    display: block;
  }

  .MyReporting .WorkPercentTitle {
    font-size: 30px;
  }

  .MyReporting .Content .WrapperList {
    width: 100%;
  }
  .MyReporting .Content .WrapperList .ItemContainer {
    display: block;
    width: 100%;
    margin: 0px 0px 20px 0px;
  }

  .MyReporting .Content .TableList .Cell_01 {
    display: inline-block;
    vertical-align: top;
    width: 58%;
    margin: -5px 1% 10px 0px;
  }
  .MyReporting .Content .TableList .Cell_02 {
    display: inline-block;
    vertical-align: top;
    width: 39%;
    margin: -5px 0px 10px 1%;
    text-align: right;
    line-height: 3em;
  }

  .MyReporting .MainLoadBox {
    top: 100px;
  }

  .ReportingChoice .Table_RC .Cell_RC {
    padding: 12px 15px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 480px) {
  .MyReporting .Content .TableList .Cell_01 {
    display: block;
    width: 100%;
    margin-right: 0px;
  }
  .MyReporting .Content .TableList .Cell_02 {
    display: block;
    width: 100%;
    margin-left: 0px;
    margin-bottom: 20px;
    text-align: left;
    line-height: 3em;
  }
}

/* Horizontal Bars */
@media only screen and (max-width: 768px) {
  .ReportingChart .ChartBlock {
    padding: 80px 10px 10px 10px;
    box-sizing: border-box;
  }

  .ReportingChart .ChartBlock .ViewPupils {
    right: 15px;
    width: 95%;
  }

  .ReportingChart .ChartBlock .ViewPupils a {
    width: 100%;
  }

  .ReportingChart .PupilsList .PLTable .Row {
    font-size: 12px;
  }
  .ReportingChart .PupilsList .PLTable .Row .Col {
    padding-right: 10px;
  }
  .ReportingChart .PupilsList .PLTable .Row.Hdr {
    font-size: 12px;
  }
}
@media only screen and (max-width: 480px) {
  .ReportingChart .ChartBlock .ViewPupils {
    width: 93%;
  }
}
@media only screen and (max-width: 360px) {
  .ReportingChart .ChartBlock .ViewPupils {
    right: 10px;
  }
}


/* My Account */
@media only screen and (max-width: 1200px) {
  .MyAccount .BtnBack .Txt_Four {
    display: none;
  }
  .MyAccount .Table_AC .Cell_AC {
    padding: 160px 0px 80px 0px;
  }
  .MyAccount .Form {
    display: block;
  }
  .MyAccount .Form .Column01 {
    display: inline-block;
    width: 270px;
    padding: 0px 0px 60px 0px;
  }
  .MyAccount .Form .Column02 {
    display: block;
    width: 100%;
  }
}
@media only screen and (max-width: 1024px) {
  .MyAccount .BtnBack {
    display: none;
  }
  .MyAccount .Form {
    width: 100%;
    display: block;
  }
  .MyAccount .Form .Info .Desc .Detail {
    display: block;
  }
  .MyAccount .Form .Info .Desc .Detail .Question {
    display: block;
    width: 100%;
    margin-bottom: 5px;
  }
  .MyAccount .Form .Info .Desc .Detail .Answer {
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  .MyAccount .Table_AC .Cell_AC {
    padding: 60px 0px 60px 0px;
  }
  .MyAccount .Form .Column01 {
    float: none;
    width: 100%;
    padding: 0px 0px 40px 0px;
  }
  .MyAccount .Form .Column02 {
    float: none;
    width: 100%;
  }
  .MyAccount .Form .ColumnSpacer {
    display: none;
  }
  .MyAccount .Form .ColumnBox {
    float: left;
    width: 48%;
  }
  .MyAccount .Form .ColumnBoxSpacer {
    float: left;
    width: 4%;
    height: 1px;
    display: block;
  }
  .MyAccount .Form .Info {
    display: block;
    width: 100%;
  }
  .MyAccount .Form .Info .Desc {
    display: block;
  }
  .MyAccount .Form .Info .Action {
    display: block;
    width: 100%;
    padding: 30px 0px 0px 0px;
    text-align: center;
  }
  .MyAccount .Form .Info .Action .BtnAction a {
    width: 320px;
    display: inline-block;
  }
  .MyAccount .Form .Info .Action .BtnAction input {
    width: 320px;
    display: inline-block;
  }
  .MyAccount .BigForm {
    width: 320px;
  }
  .MyAccount .BigForm .ColumnBox {
    float: none;
    width: 100%;
  }
  .MyAccount .BigForm .SpacerBox {
    display: none;
  }
  .MyAccount .BigForm .BtnSave a {
    width: 100%;
  }
  .MyAccount .BigForm .BtnSave input {
    width: 100%;
  }
}
@media only screen and (max-width: 480px) {
  .MyAccount .Table_AC .Cell_AC {
    padding: 40px 0px 40px 0px;
  }
  .MyAccount .Form {
    width: 100%;
  }
  .MyAccount .Form .ColumnBox {
    float: none;
    width: 100%;
  }
  .MyAccount .Form .ColumnBoxSpacer {
    display: none;
  }
  .MyAccount .Form .BtnSave a {
    width: 100%;
  }
  .MyAccount .Form .BtnSave input {
    width: 100%;
  }
  .MyAccount .Form .Info .Action .BtnAction a {
    width: 100%;
  }
  .MyAccount .Form .Info .Action .BtnAction input {
    width: 100%;
  }
  .MyAccount .BigForm {
    width: 100%;
  }
  .MyAccount .SmallForm {
    width: 100%;
  }
}

/* My Curriculum App */
@media only screen and (max-width: 1200px) {
}
@media only screen and (max-width: 1024px) {
  .MyCurriculumApp .Inner {
    padding: 160px 0px 60px 0px;
  }
  .MyCurriculumApp .Top .Desc {
    float: none;
    text-align: center;
  }
  .MyCurriculumApp .Top .Buttons {
    float: none;
    margin-top: 30px;
    text-align: center;
  }
  .MyCurriculumApp .Top .InfoIcon {
    position: relative; 
    top: inherit; 
    right: inherit;
    margin: 20px auto -20px auto;
  }
  .MyCurriculumApp .Top .InfoIcon span {
    width: 100%;
  }
}
@media only screen and (max-width: 768px) {
  .MyCurriculumApp .Inner {
    padding: 40px 0px 40px 0px;
  }
  .MyCurriculumApp .Top .Buttons .BtnPrint {
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0px 0px 0px;
  }

  .CMAssignedClasses .CMAssignedClassList .AssignedClassBlock .Inner  {
    flex-wrap: wrap;
  }

  .CMAssignedClasses .CMAssignedClassList .AssignedClassBlock .Inner .ClassName {
    flex: 0 0 100%;
    padding-left: 0px;
    margin-bottom: 10px;
  }

  .CMAssignedClasses .CMAssignedClassList .AssignedClassBlock .Inner .ClassesToAssign {
    flex: 0 0 100%;
  }
}
@media only screen and (max-width: 600px) {
  .MyCurriculumApp .Top .Buttons .BtnPrint                          {display:block; margin-left:0px;}
  .MyCurriculumApp .Top .Buttons .BtnCopyMap							          {display:block; margin-left:0px;}
  .MyCurriculumApp .Top .Buttons .BtnArchive							          {display:block; margin-right:0px;}
  .MyCurriculumApp .Top .Buttons .BtnArchive.V2                     {margin-left:0px;}
}

/* View User */
@media only screen and (max-width: 1200px) {
  .ViweUser .BtnBack .Txt_Four {
    display: none;
  }
}
@media only screen and (max-width: 1024px) {
  .ViweUser .BtnBack {
    display: none;
  }
  .ViweUser .Table_CC .Cell_CC {
    padding-top: 120px;
  }
}
@media only screen and (max-width: 768px) {
  .ViweUser .Table_CC .Cell_CC {
    padding-top: 40px;
    padding-bottom: 0px;
  }
  .ViweUser .ColLeft {
    float: none;
    width: 100%;
    margin-right: 0;
  }
  .ViweUser .ColRight {
    float: none;
    width: 100%;
  }
  .ViweUser .BigForm {
    width: 320px;
  }
}
@media only screen and (max-width: 480px) {
  .ViweUser .BigForm {
    width: 100%;
  }
}

/* P section - BEGIN */
@media only screen and (max-width: 900px) {
  .SubtitleW {
    width: auto;
  }
}
@media only screen and (max-width: 600px) {
  .PupilList2 .FormList {
    width: 100%;
  }
  .PupilList2 .BtnSave {
    width: 100%;
  }
}
@media only screen and (max-width: 550px) {
  .Form .Col1 {
    float: none;
    width: 100%;
    margin-right: 0%;
  }
  .Form .Col2 {
    float: none;
    width: 100%;
  }

  .PupilList2 .BtnSave {
    width: 100%;
  }
  .PupilList2 .BtnSave .L {
    float: none;
    width: 100%;
    margin-bottom: 15px;
  }
  .PupilList2 .BtnSave .R {
    float: none;
    width: 100%;
  }
}
/* P section - END */

/* Blog */
@media only screen and (max-width: 1024px) {
  .ToggleSmArchiveMenu {
    display: block;
  }

  .BlogListTable {
    display: block;
  }
  .BlogListTable .Categories {
    display: none;
    width: 100%;
    padding-bottom: 40px;
  }
  .BlogListTable .PostList {
    display: block;
  }

  .BlogPostHdrTable {
    display: block;
    height: inherit;
    margin: 30px 0px 40px 0px;
  }
  .BlogPostHdrTable .ImgCell {
    display: block;
    width: 100%;
    padding-bottom: 40px;
  }
  .BlogPostHdrTable .ImgCell .Img {
    width: 300px;
  }
  .BlogPostHdrTable .DetailsCell {
    padding-left: 0px;
  }
}

@media only screen and (max-width: 768px) {
  .BlogPostFilter .sbHolder {
    display: block;
  }

  .BlogPostHdrTable .Date {
    padding: 10px 20px;
    font-size: 15px;
  }
  .BlogPostHdrTable .Title {
    font-size: 30px;
  }
  .BlogPostHdrTable .Author {
    font-size: 15px;
  }
  .BlogPostHdrTable .SocialMediaIcons a {
    width: 40px;
  }
}

@media only screen and (max-width: 480px) {
  .BlogListTable .BlogPost {
    display: block;
  }
  .BlogListTable .BlogPost .LeftSide {
    display: block;
    width: 100%;
  }
  .BlogListTable .BlogPost .RightSide {
    display: block;
    width: 100%;
    padding-left: 0px;
    padding-top: 20px;
  }
}

/* case studies */
@media only screen and (max-width: 1200px) {
  .CaseStudiesList .CSBlock {
    width: 46%;
  }
}

@media only screen and (max-width: 1024px) {
  .CmsPage .Top.CaseStudies {
    padding-top: 125px;
  }

  .CaseStudiesHdrTable {
    display: block;
    margin: 30px 0px 40px 0px;
  }
  .CaseStudiesHdrTable .ImgCell {
    display: block;
    width: 100%;
    padding-bottom: 40px;
  }
  .CaseStudiesHdrTable .ImgCell .Img {
    width: 300px;
  }
  .CaseStudiesHdrTable .DetailsCell {
    padding-left: 0px;
  }
}

@media only screen and (max-width: 768px) {
  .CaseStudyFilters {
    text-align: center;
  }

  .SortBy.CSFilter {
    margin: 0px 15px;
  }

  .CaseStudiesList {
    width: 100%;
  }
  .CaseStudiesList .CSBlock {
    width: 100%;
    margin-right: 0px;
  }
}

/* case studies */
@media only screen and (max-width: 1200px) {
  .CaseStudiesList .CSBlock {
    width: 46%;
  }
}

@media only screen and (max-width: 1024px) {
  .CmsPage .Top.CaseStudies {
    padding-top: 125px;
  }

  .CaseStudiesHdrTable {
    display: block;
    margin: 30px 0px 40px 0px;
  }
  .CaseStudiesHdrTable .ImgCell {
    display: block;
    width: 100%;
    padding-bottom: 40px;
  }
  .CaseStudiesHdrTable .ImgCell .Img {
    width: 300px;
  }
  .CaseStudiesHdrTable .DetailsCell {
    padding-left: 0px;
  }
}

@media only screen and (max-width: 768px) {
  .CaseStudyFilters {
    text-align: center;
  }

  .SortBy.CSFilter {
    margin: 0px 15px;
  }

  .CaseStudiesList {
    width: 100%;
  }
  .CaseStudiesList .CSBlock {
    width: 100%;
    margin-right: 0px;
  }

  .CmsPage .Top.CaseStudies {
    padding-top: 35px;
  }

  .CaseStudiesHdrTable .Date {
    padding: 10px 20px;
    font-size: 15px;
  }
  .CaseStudiesHdrTable .Title {
    font-size: 30px;
  }
  .CaseStudiesHdrTable .Author {
    font-size: 15px;
  }
  .CaseStudiesHdrTable .SocialMediaIcons a {
    width: 40px;
  }

  .CaseStudiesMediaBlock .Img {
    margin-bottom: 20px;
  }
  .CaseStudiesMediaBlock .Vid {
    margin-bottom: 20px;
  }

  .CSTestimonialBlock {
    padding: 40px 0px;
  }
  .CSTestimonialBlock .Img {
    margin-bottom: 20px;
  }
  .CSTestimonialBlock .TestimonialText {
    font-size: 2em;
  }
  .CSTestimonialBlock .TestimonialText .Quotes {
    top: 20px;
  }
  .CSTestimonialBlock .TestimonialText .Quotes.Open {
    padding-right: 10px;
  }
  .CSTestimonialBlock .TestimonialText .Quotes.Close {
    padding-left: 10px;
  }
  .CSTestimonialBlock .Name {
    font-size: 1.8em;
  }
  .CSTestimonialBlock .Details {
    font-size: 1.4em;
  }
}

/* Presentation */
@media only screen and (max-width: 1024px) {
  .PresentationBlock .PBContainer {
    max-width: 450px;
  }
  .PresentationBlock .VidContainer {
    width: 100%;
  }
  .PresentationBlock .swiper-container {
    height: auto;
  }
  .PresentationBlock .swiper-slide {
    height: initial;
    display: block;
    overflow: hidden;
  }
  .PresentationBlock .mejs__container {
    width: 100%;
  }
}

@media only screen and (max-width: 768px) {
  .PresentationBlock {
    padding-top: 75px;
  }
  .PresentationBlock .PBContainer {
    max-width: 300px;
  }
  .PresentationBlock .PBContainer .BtmCtrls .FullScreenBtn {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .PresentationBlock .PBContainer.FullScreen {
    position: fixed;
    z-index: 100;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    max-width: inherit;
    min-width: 320px;
    background-color: #000000;
    display: flex;
    padding-bottom: 0px;
  }
  /*.PresentationBlock .PBContainer.FullScreen .BtmCtrlsContainer {
    bottom: inherit;
  }*/
  .PresentationBlock .PBContainer.FullScreen .BtmCtrls .FullScreenBtn {
    background-size: 60%;
  }
  .PresentationBlock .PBContainer.FullScreen h3 {
    font-size: 30px;
  }
  .PresentationBlock .PBContainer.FullScreen .VidContainer {
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    margin: auto;
    padding: 0;
  }
  .PresentationBlock .PBContainer.FullScreen img {
    max-width: 85%;
  }
  .PresentationBlock .PBContainer.FullScreen .mejs__container {
    max-width: 85%;
    margin: 0 auto;
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper {
    flex: 1;
    height: calc(100vh - 40px);
    background-color: #000000;
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper {
    min-height: calc(100vh - 40px);
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper .swiper-slide {
    height: calc(100vh - 40px);
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper .swiper-slide > img {
    height: calc(100vh - 40px);
    object-fit: contain;
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper .swiper-slide .ImgAudioBlock {
    height: calc(100vh - 40px);
    margin: auto;
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper .swiper-slide .ImgAudioBlock .Img {
    height: calc(100vh - 40px);
  }
  .PresentationBlock .PBContainer.FullScreen #presentation-swiper .swiper-wrapper .swiper-slide .ImgAudioBlock .Img img {
    height: 100%;
    object-fit: contain;
  }
}

/* Cookie Banner */
@media only screen and (max-width: 1024px) { 
  .CookieBanner .CookieBannerContent                                    {flex-wrap:wrap;}
  .CookieBanner .CookieBannerContent .InfoTxt                           {flex:0 0 100%; margin-bottom:5px;}
  .CookieBanner .CookieBannerContent .Btn                               {flex:1;}
}

@media only screen and (max-width: 768px) {
  .CookieBanner                                                         {padding:0 30px;}
  .CookieBanner .CookieBannerContent                                    {flex-direction:column;}
  .CookieBanner .CookieBannerContent .InfoTxt                           {padding-right:0px;}
  .CookieBanner .CookieBannerContent .Btn.AcceptBtn,
  .CookieBanner .CookieBannerContent .Btn.RejectBtn,
  .CookieBanner .CookieBannerContent .Btn.SettingsBtn                   {width:100%;}

  .CookieSettingsPopup .AcceptCookieBtnRow                              {flex-wrap:wrap;}
  .CookieSettingsPopup .AcceptCookieBtnRow .Btn                         {flex:0 0 100%;}
}

@media only screen and (max-width: 480px) {
  .CookieBanner                                                         {padding:0 20px;}  
}

@media only screen and (max-width: 360px) {
  .CookieBanner                                                         {padding:0 10px;}
}



/* Clubs and Competitions */
@media only screen and (max-width: 1200px) {
  .ClubsAndCompetitions .HeadList                                       {display:block;}
  .ClubsAndCompetitions .HeadList .Img_HL                               {display:none;}
  .ClubsAndCompetitions .HeadList .Inner_HL                             {display:block; padding:0px 30px 20px 30px;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_01                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_02                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_03                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_04                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_05                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_06                    {display:none;}
  .ClubsAndCompetitions .HeadList .Table_HL .Cell_07                    {width:100%; text-align:center;}
  .ClubsAndCompetitions .WrapperList                                    {width:102%;}
  .ClubsAndCompetitions .WrapperList .ItemList                          {display:inline-block; vertical-align:top; width:31.33%; margin: 0px 2% 20px 0px;}
  .ClubsAndCompetitions .WrapperList .ItemList .InnerList               {display:block;}
  .ClubsAndCompetitions .TableList .CellList .Name                      {font-size:24px;}
  .ClubsAndCompetitions .TableList .CellList .BtnView                   {width:100%; margin-left:0px;}
  .ClubsAndCompetitions .TableList .CellList .Lab                       {display:inline-block;}
  .ClubsAndCompetitions .TableList .CellList.Cell_01                    {display:block; width:100%; text-align:left; padding-right:0px;}
  .ClubsAndCompetitions .TableList .CellList.Cell_02                    {display:block; width:100%; text-align:left; margin-top:20px;}
  .ClubsAndCompetitions .TableList .CellList.Cell_03                    {display:block; width:100%; text-align:left; padding:0px;}
  .ClubsAndCompetitions .TableList .CellList.Cell_04                    {display:block; width:100%; text-align:left; padding:0px;}
  .ClubsAndCompetitions .TableList .CellList.Cell_05                    {display:block; width:100%; text-align:left;}
  .ClubsAndCompetitions .TableList .CellList.Cell_06                    {display:block; width:49%; margin-top:20px; display:inline-block; text-align:center;}
  .ClubsAndCompetitions .TableList .CellList.Cell_07                    {display:block; width:49%; margin-top:20px; display:inline-block; text-align:center;}
  .ClubsAndCompetitions .TableList .CellList.Cell_08                    {display:block; width:100%; margin-top:20px; text-align:center;}
  .ClubsAndCompetitions .TableList .CellList.Cell_09                    {display:block; width:100%; margin-top:20px;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_01    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_02    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_03    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_04    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_06    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList.Cell_07    {display:block; width:100%;}
  .ClubsAndCompetitions .WrapperList.V2 .TableList .CellList .BtnView   {display:block; width:100%;}
}

@media only screen and (max-width: 1024px) {
  .ClubsAndCompetitions .Inner                                          {padding-top:120px;}
  .ClubsAndCompetitions .TopRow .BtnBack                                {display:none;}
  .ClubsAndCompetitions .WrapperList .ItemList                          {width:48%;}

  .PupilViewCandCCols                                                   {text-align:left;}
}

@media only screen and (max-width: 768px) {
  .ClubsAndCompetitions .Inner                                          {padding-top:60px;}
  .ClubsAndCompetitions .TopRow .Desc                                   {float:none; padding-right:0px;}
  .ClubsAndCompetitions .TopRow .Buttons                                {float:none;}
  .ClubsAndCompetitions .TopRow .Buttons .BtnDarkTwo                    {display:block; margin-right:0px; margin-bottom:15px;}
  .ClubsAndCompetitions .TopRow .Buttons .BtnDarkTwo a                  {width:100%;}
  .ClubsAndCompetitions .TopRow .Buttons .BtnOne                        {display:block;}
  .ClubsAndCompetitions .TopRow .Buttons .BtnOne a                      {width:100%;}
  .ClubsAndCompetitions .TopRow .Filter .Title                          {display:block; width:100%;}
  .ClubsAndCompetitions .TopRow .Filter .Wrapper_F                      {display:block;}
  .ClubsAndCompetitions .NoCCEmptyBlock                                 {height:300px;}
  .ClubsAndCompetitions .WrapperList                                    {width:100%;}
  .ClubsAndCompetitions .WrapperList .ItemList                          {display:block; width:100%; margin:0px 0px 20px 0px;}

  .PupilViewCandCCols                                                   {flex-wrap:wrap;}
  .PupilViewCandCCols .WrapperList                                      {flex:0 0 100%; padding-right:0px;}
  .PupilViewCandCCols .WrapperList:first-child                          {padding-right:0px;}
  .PupilViewCandCCols .Name                                             {margin-bottom:3px;}
}





/* My Documents */
@media only screen and (max-width: 768px) {
  .MyDocumentsIFrame                                                    {margin-top:0px;}
}