  
.header-ÐÓ°ÉPro-logo {
  max-width:335px;
}

a.skip-main {
    left:-999px;
    position:absolute;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
    z-index:-999;
}

a.skip-main:focus, a.skip-main:active {
    color: #fff;
    background-color:#557F43;
    left: auto;
    top: auto;
    width: 30%;
    height: auto;
    overflow:auto;
    margin: 10px 35%;
    padding:5px;
    border:4px solid #557F43;
    text-align:center;
    font-size:1.2em;
    z-index:999;
}

table.gsc-search-box td.gsc-input {
    background-color: transparent;
}

td.gsc-search-button {
    background-color: transparent;
}

td.gsc-clear-button {
    background-color: transparent;
}

td.gssb_a {
    background-color: transparent;
}

.gssb_a table tr td{
    background-color: transparent;
}

td.gsc-clear-button
{
	display:none;
}

table.gsc-search-box td {
    vertical-align: none;
    background-color: transparent;
    border-left: 0px;
    border-top: 0px;
}

.gsst_a .gscb_a {
    display:none;
}

.translate-button {
    margin-top:-3px;
}



.TDSBtopBannerBox {
  margin: 0 auto;
  max-width: 87.5rem;/* = 1400px  */
  width: 100%;
}

.TDSBtopBannerBox .container {
  width: 100%;
  max-width: 87.5rem;/* = 1400px  */
}

#topMenuWrapper {
  width:100%; 
  padding:1rem 0!important;
}

#topMenuWrapper * {
  border-radius: 0 !important;
}

.top-header {
  display: flex;
  justify-content: space-between;
}

.header-left {
   padding: 0;
}

.TDSBtopBannerBoxLeft {
  /*  margin: 0 0px 20px -10px;
   height: 105px;
   width: 325px; */
 }
 
 .TDSBtopBannerBoxLeft img {
   border: none;
   width:100%;
   max-width:337px;
   height:auto;
 }
 

/* HEADER RIGHT */
.header-right {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  text-align: right;
  justify-content: end;
  margin-top:-2rem;
}

.TBBR1 {
  
}
  
a.TBBR1text:link, a.TBBR1text:visited, a.TBBR1text:active, a.TBBR1text:hover {
  font-family: "Rokkitt", serif;
  font-weight: 600;
  font-size: 1.2rem;
  text-decoration: none;
  color: #43347B;
  text-decoration: none;
  margin: 0px 0em 0.28em 0px;
  padding: 0px 0.18em 0px 0px; 
  line-height: 1.6rem;
}

.TBBR1divider {
  font-weight: bold;
  color: #757575;
  margin: 0 5px 0 5px;
}

.header-right-row1 {
  display: flex;
  justify-content: end;
}


#mobile-header-left {
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  visibility: hidden; 
}

#nav-toggler {
  border: 1px solid #000;
  height: 38px;
}

.search-container-box {
  display:flex;
  justify-content: end;
}

/* SEARCH BOX */
#search-box {
  margin-top:1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
  margin-top:-2.2rem;
  margin-right:0;
}

#search-box #search-bar {
  margin-right:0!important;
  width: 50%;
  margin-left:auto!important;
  margin-top:0!important;
  height:40px!important;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  padding:0!important;
}

#search-box button {
  height: 38px;
}

.gsc-search-box td {
  padding: 0;
}

#search-box .gsc-input-box {
	padding-top:0px!important;
	padding-bottom:0!important;
	margin:0;
	height:38px;
}

#search-box .gsc-input {
  height: 0;
  padding:0!important;
  margin-top:1px!important;
  width:275px;
}

#search-box .gsc-input:focus {
  outline: green 2px solid !important;
}


#search-box td .gsib_a {
	padding:5px 0 0 4px!important;
}

#search-box .gsc-search-button {
	margin:0!important;
    padding:0!important;
}

#search-box .gsc-search-button-v2 {
	padding:6px 15px!important;
}

#search-box #translate-btn {
  background-color: #fff;
  border: 1px solid #ccc;
  display: flex;
  align-items: center;
  height:38px;
}

/* MAIN NAV */
.navbar,
.navbar-light .navbar-nav {
  width: 100%;
}

.navbar-nav {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
 justify-content: space-between; 
  justify-content:space-evenly;
  flex-direction: row;
}

.navbar-light .navbar-nav .nav-link {
  color: #000;
}

/* Go To MODAL */
.want-to-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
/*  justify-content: space-evenly; */
}

.want-to-container a {
  text-transform: uppercase;
  width: 50%;
  text-align: center;
  float: left;
  padding: 7px;
}

.TDSBtopBannerBox .modal-content {
	border:2px solid #555;  
}

.TDSBtopBannerBox .modal-header {
	background-color:#4472a6;
	color:#FFF;
	padding:0.88em!important;
}

.TDSBtopBannerBox .modal-title {
	color:#FFF;
}

.TDSBtopBannerBox .close {
	font-size:2.4em!important;
	color:#FFF;
	margin-top:-0.30em;
	margin-right:0.023em;
}
.ui-widget-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.ui-front {
    z-index: 100;
}	


/* MEDIA QUERIES */
@media (max-width: 1400px) {
  .TDSBtopBannerBox {
   padding-left:1.2rem;
   padding-right:1.2rem;
  }
}

@media screen and (max-width: 1000px) {
  #search-box {
    margin-top:-30px;
  }
}

@media (max-width: 991px) {

  #search-box #search-bar {
    /* width: 85%; */
    flex: 1 1 auto;
    margin-left: 0;
  }

  #search-box .gsc-input {
    width:150px;
  }

  .container {
    max-width: 100%;
  }


.container.p-4 {
  width:100%!important;
	padding:1.1em 1em 0 1em!important;
}
	
/ FireFox Hack /	
@-moz-document url-prefix() {
#search-box {
   margin-top: -30px;
  }	
}	
}

@media (max-width: 780px) {
.header-content {
  margin-top:1rem;
}

.homepage-box-top {
  margin-top: -2.6rem;
}

#topMenuWrapper {
	width: 100% !important;
}

.TDSBtopBannerBox {
  padding-left:0.68rem;
  padding-right:0.68rem;
  margin-bottom:-1rem;
}

.content-box-home {
  margin-top: 0rem;
}

#mobile-header-left {
	visibility: visible; 
  margin-right:1rem;
}  
  
/* Look for info and Hamburger menu items */
#btn-iwantto-sm, #nav-toggler  {
	display: block;
	color:#FFF;
	border:1px solid #333;
	background-color:#4472a6!important;
}

#nav-toggler {
	color:#333;
	background-color:#F0F0F0!important;
}

#mobile-header-left #btn-iwantto-sm.btn-warning:focus {
	box-shadow:none!important;
}

#mobile-header-left button:focus {
	outline: 2px solid #74a061;
}
/* End of Look for info and Hamburger menu items */

.header-left {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	width: 60%;
}

#logo-box {
	width: 60%;
	height:auto;
	margin-top:-0.78em;
}

#logo-box img {
	width: 100%;
	height:auto;
}
 
.header-right {
	display: none;
}

.search-container-box {
  padding-left: 1.2rem;
  padding-right: 0.88rem;
  margin-bottom:-1rem;
}

#search-box {
	width: 100%;
	align-items: flex-start;
	margin-left: 0;
	margin-top: 1.2rem;
  margin-bottom:1rem;
/*  border:1px solid grey; */
}

#search-box .gsc-input-box {
	margin-left:-10px;
	height:38px!important;
}

#search-box .gsc-input {
  width:auto;
}

#search-box button {
    margin-left: 0px;
}

#search-box #translate-btn {
	margin-right:0%!important;
}

.navbar {
	z-index:50;
}

.navbar-nav {
	flex-direction: column;
}

.TDSBwwwNavBarBox {
  background-image: none!important; 
	height:auto;
	margin-bottom:7%;
	margin-top:0.58rem
}

#GoogleTranslate .modal-body.rounded-0.p-5 {
	padding:1.4rem!important;
}
}


@media (max-width: 568px) {
.container.p-4 {
    /*margin-bottom:-2.6rem; */
  }

  .TDSBtopBannerBox {
    margin-bottom:-1rem;
  }
  
  .homepage-box-top {
    margin-top: 1rem;
  }
}

/* Only iPhone 5 (portrait mode) */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px)
and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:portrait) {
  #btn-iwantto-sm, #nav-toggler  {
	margin-top:3%;
}
}

@media (max-width: 430px) and (orientation: portrait) {
.TDSBwwwNavBarBox {
	margin-bottom: 1%!important;
	margin-top:0.58rem; 
}
}

@media (max-width: 430px) {
.header-left {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	margin-bottom: 0.3rem;
}

.TDSBtopBannerBox {
  padding-left: 0.18rem;
  padding-right: 0.48rem;
}

#mobile-header-left {
	margin-top: 0.3rem;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	margin-top:-65px;
  margin-top:0px;
/*  margin-left:14.4rem; */
  margin-right:0;
}

#logo-box {
	width: 60%;
	height:auto;
}

.search-container-box {
  padding-left: 1rem;
  padding-right: 0rem;
}

#search-box {
	margin-top: 1.44em;
  margin-top: 1rem;
  margin-bottom: 0rem;
}

.modal-content {
  width: 98%;
}
}

@media (max-width: 390px) {
  #mobile-header-left {
    margin-top:-14px;
    margin-left:0rem;
  }

  .modal-content {
    width: 98%;
  }
}

  @media (max-width: 360px) {
    #mobile-header-left {
      margin-left: 0rem;
    }  
}




@media (max-width: 344px) {
  #mobile-header-left {
  margin-left: 11.8rem;
  margin-top: -2.6rem;
}
}
