/******* Homepage CSS ********/

.quickNavBar  ul {
        margin-top:2.5rem;
}

.vl-content-box {
        max-width: 1400px;
        margin: 2rem auto 0px auto;
        padding-bottom: 275px;
}

.vl-home-frame {
  padding: 0 10px;
}


.box-item-t, .box-item-p,  .lib-box-right-container ul  {
        font-family:Verdana, Geneva, sans-serif;
 }
    
.lib-box-container {
        display: flex;
        width:100%;
        padding-top:1.2rem;
     /*   border:2px solid blue;  */
        column-gap: 1.2rem;
}
      
.lib-box-right-container {
        width:70%;
        margin-right:0;
    /*    border:2px solid red;   */
}

.lib-box-right-container ul {
        padding:-5px;
        margin:0;
        list-style:none;
}

      .lib-logo-btn-box {
        color: black;
        display: block;
        cursor: pointer;
        border: 2px solid #3B60AF;
        border-radius: 2rem;
        margin-bottom: 0.48rem;
        display: flex;
        align-items: center;
        justify-content: left;
        gap: 1.6rem;
        font-size: 1.2rem;
        width: 100%!important;
        padding:1rem 0.12rem 1rem 0.22rem!important;
         text-decoration: none !important;
    }

      .lib-logo-box {
        padding-top:0.38rem;
        padding-bottom:0.28rem;
        padding-left:0.78rem;
}

      .lib-logo {
        max-width:40px;
        max-height:40px;
        margin:0.15rem 0.0rem 0.18rem 0.76rem;
}

      .lib-logo-text    {
       text-decoration: none !important;
      }
 
      .boxRow {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 1rem;
        align-content: flex-start;
        margin-bottom:0.28em!important;
        /*width:70%;*/
        margin-left:0rem;
      /*  border:2px solid purple;  */
       }
      
      .box-item-read, .box-item-makedo, .box-item-francais,
      .box-item-find, .box-item-info, .box-item-mylib, .box-item-educa, .box-item-parent,.box-item-vst {
        width:300px;
        border-radius:1.8rem;
        padding:2em 0.60em 1.8em 0.60em;
        height:5rem;
        background-color:#4FA643;
        position:relative;
        display: block;
        cursor: pointer;
        height: 12rem;
        text-decoration: none !important;
      }
    
    .box-item-makedo {
        background-color:#8E39A1; 
    }
    
    .box-item-francais {
        background-color:#00693C;
    }
    
    .box-item-find {
      background-color:#FDB813;
    }
    
    .box-item-info {
        background-color:#C93939;
    }
    
    .box-item-mylib {
        background-color:#E06D15;
    }
    
  .box-item-educa{
        background-color:#C25400;
    }

      .box-item-parent{
        background-color:#3B60AF;
    }

    .box-item-vst{
         background-color:#18206F;
    }

/****** Promo cards positon *******/
.box-read-icon, .box-makedo-icon, .box-francais-icon,
.box-find-icon, .box-info-icon, .box-mylib-icon,
.box-educa-icon, .box-parent-icon,.box-vst-icon{   
    position: absolute;
    top: 10px;
    left: 12px;
    width: 55px;
    height: 55px;
}
    
/****** Promo cards text positon ******/
.box-text-t, .box-text-p {
    position: absolute;
    right: 1.2rem;
    top: 1.16rem;
    font-family:Verdana, Geneva, sans-serif;
    font-size: 2em;
    font-weight: 300!important;
    line-height: 2.6rem;
    text-shadow:2px 1px 1px rgba(0, 0, 0, 0.5);
    color:white!important;
    text-decoration:none!important;
    text-align:right;
}

.box-text-p {
    margin-top:0rem;
    font-size: 1.3rem;
    line-height: 0.98rem;
}

.t-rwl  {
    top:2.2rem;
}

.t-info  {    
  top: 2.6rem;
}
    
.t-makedo  {
    top:3.6rem;
}

.t-francais  {
    top:5rem;
}

.t-find, .t-mylib {
    top:3.6rem;
}

.t-educa, .t-parent {
    top:3.6rem;
}

.t-vst  {
    top:2rem;
}

.p-find, .p-mylib {
    top:6.8rem;
}

.p-info {
    top:8rem;
}

.p-ml {
    top:1rem;
}

.box-text-mylib  {
    margin-top:-0.2rem!important;
}

.box-text-educa {
    margin-top:-0.7rem!important;
}

.box-text-parent  {
    margin-top:-0.5rem!important;
}

.box-text-vst  {
    margin-top:-2rem!important;
}





/*********** OLD CSS ****************

table, table tbody tr td {
	background-color:#FFF;
}

 .rpExpandHandle .rpText
{
	font-weight:bold;
}

.leftNavBox .RadPanelBar .rpText {
    padding: 15px 0 0 55px;
    font-size: 1.3em;
}

.leftNavBox {
        width: 200px!important;
        margin:0px!important;
}
*/

/***** CSS used for format rows of conent ******/
.boxContentRow {
	font-family:Arial, Helvetica, sans-serif;
	width:100%;
	margin-bottom:2.2%;
}

.boxItems { 
	display:inline-block;
	margin-right:3.2%;
	margin-bottom:3%;
	margin-top:0;
	vertical-align: top;
}

.boxItemsIcon, .boxItemsContent { 
	display:inline; 
	padding-right:2%;
	margin-bottom:3%;
	margin-top:0;
	vertical-align: middle;
	width:25%;
}

.boxItemsContent { 
	padding-right:0;
	width:70%;
}

.boxItemsIcon, .boxItemText  { 
	margin-bottom:3%;
	margin-top:0;
	vertical-align: top;
	width:130px;
	display:inline-block;
}

.boxItemText {
	width:64%;
}

.titleHeadingBox {
	display:block;
	color:white!important;
	font-size:1.6em!important;
	padding:4px 3px 2px 7px;
	border-radius:5px 5px;
	background-color:#CCC; 
}


/****** Colour Number Blocks ********/
#lableBoxRed, #lableBoxNumbersRed,
#lableBoxGreen, #lableBoxNumbersGreen,
#lableBoxBlue, #lableBoxNumbersBlue, 
#lableBoxMustard, #lableBoxNumbersMustard  {
	display:inline-block;
}


#lableBoxRed, #lableBoxNumbersRed ul,
#lableBoxGreen, #lableBoxNumbersGreen ul,
#lableBoxBlue, #lableBoxNumbersBlue, ul,
#lableBoxMustard, #lableBoxNumbersMustard ul {
		color:white;
}

#lableBoxRed, #lableBoxGreen, #lableBoxBlue, #lableBoxMustard {
	font-size:1em;
        font-weight:bold;
	vertical-align:middle;
	padding:5px 0 5px 0;
	background-color:#990000;
	width:180px;
	text-align:center;
	margin-left:5px;
}

#lableBoxGreen {
	background-color:#669933;
}

#lableBoxBlue {
	background-color: #336699;
}

#lableBoxMustard {
	background-color: #cc9933;
}


#lableBoxNumbersRed, #lableBoxNumbersGreen,
#lableBoxNumbersBlue, #lableBoxNumbersMustard{
	margin:0 5px 0 5px;
	padding:0;
}

#lableBoxNumbersRed ul, #lableBoxNumbersGreen ul,
#lableBoxNumbersBlue ul, #lableBoxNumbersMustard ul {
	margin:0;
	padding:0;
}

#lableBoxNumbersRed li,
#lableBoxNumbersRed li a:link,
#lableBoxNumbersRed li a:visited,
#lableBoxNumbersRed li a:active,
#lableBoxNumbersRed li a:hover,

#lableBoxNumbersGreen li,
#lableBoxNumbersGreen li a:link,
#lableBoxNumbersGreen li a:visited,
#lableBoxNumbersGreen li a:active,
#lableBoxNumbersGreen li a:hover,

#lableBoxNumbersBlue li,
#lableBoxNumbersBlue li a:link,
#lableBoxNumbersBlue li a:visited,
#lableBoxNumbersBlue li a:active,
#lableBoxNumbersBlue li a:hover, 

#lableBoxNumbersMustard li,
#lableBoxNumbersMustard li a:link,
#lableBoxNumbersMustard li a:visited,
#lableBoxNumbersMustard li a:active,
#lableBoxNumbersMustard li a:hover {	
font-weight:bold;	
text-align:center;
	color:white!important;
	text-decoration:underline;	
	display:inline-block;
	list-style-type: none;
	padding: 6px 8px 8px 8px;
	background-color:#990000;
}

#lableBoxNumbersGreen li,
#lableBoxNumbersGreen li a:link,
#lableBoxNumbersGreen li a:visited,
#lableBoxNumbersGreen li a:active,
#lableBoxNumbersGreen li a:hover {	
	background-color:#669933;
}

#lableBoxNumbersBlue li,
#lableBoxNumbersBlue li a:link,
#lableBoxNumbersBlue li a:visited,
#lableBoxNumbersBlue li a:active,
#lableBoxNumbersBlue li a:hover {	
	background-color: #336699;
}

#lableBoxNumbersMustard li,
#lableBoxNumbersMustard li a:link,
#lableBoxNumbersMustard li a:visited,
#lableBoxNumbersMustard li a:active,
#lableBoxNumbersMustard li a:hover {
	background-color: #cc9933;
}



@media screen and (max-width: 1360px) {
  .boxRow {
 /*   width:74%;
    border:2px solid green;*/
}

.lib-box-right-container {
  width: 70%;
  /* border: 2px solid green; */
}

.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:250px;
}

.box-text-t {
    top: 2.4rem;
    font-size: 1.8em;
    line-height: 2.3rem;
}

.box-text-p {
    font-size: 1.4rem;
}

.t-makedo, .t-educa, .t-parent  {
    top:3.5rem;
}

.t-francais  {
    top:4.5rem;
}

.t-find, .t-mylib {
    top:5rem;
}

.t-info  {    
  top: 4.2rem;
}

.p-find, .p-mylib, .p-info {
    top:7.68rem;
    font-size: 1.150rem;
}

.p-info {
    top:9.3rem;
}
.lib-logo-btn-box {
    gap: 0.58rem;
}
}

@media screen and (max-width: 1130px) {
.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:280px;
}

.boxRow {
  /* border: 2px solid purple; */
    width: 70%;
    
}
.lib-box-right-container {
    width: 30%;
  /*  border: 2px solid purple; */
}
.lib-logo-text {
    font-size: 1.1rem;
}
}

@media screen and (max-width: 1000px) {
.vl-home-frame {
    max-width: 100%!important;
}

.vl-content-box {
	width:auto!important;
}  

.library-left-content .VL-LeftMenu {
    max-width:89% !important; 
    margin-right: 1rem !important;
}

.boxRow .box-read-icon, .boxRow .box-makedo-icon, .boxRow .box-francais-icon,
.boxRow .box-find-icon, .boxRow .box-info-icon, .boxRow .box-mylib-icon,
.boxRow .box-educa-icon, .boxRow .box-parent-icon, .boxRow .box-vst-icon {
    position: absolute;
    width: 45px!important;
    height: 45px!important;
}

.lib-box-right-container img.lib-logo {
    width:15%!important;
}
}

@media screen and (max-width: 928px) {
.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:240px;
}

.boxRow {
  /*  border: 2px solid hotpink;  */
}
.lib-box-right-container {
  /* border: 2px solid hotpink;  */
}
}
    
@media screen and (max-width: 820px) {
.boxRow {
    width:100%;
    padding-left:0rem;
    justify-content: center;
 /*   border: 2px solid blue;   */
}

.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:280px;
}

.lib-box-container, .lib-box-right-container  {
    display:block;
    width:100%;
}

.lib-box-right-container {
    padding:1.4rem 0 1rem 0rem;
  /*  border: 2px solid blue;   */
}

.lib-logo-text {
    font-size: 1.4rem;
}
}

@media screen and (max-width: 688px) {
.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:230px;
} 
}
    
@media screen and (max-width: 572px) {
.boxRow {
      flex-direction:row;
}

.box-item-read, .box-item-makedo, .box-item-francais,
.box-item-find, .box-item-info, .box-item-mylib,
.box-item-educa, .box-item-parent,.box-item-vst {
    width:290px;
} 
}