html {
    height: 100%;
}

body {
    min-height: 100%;
    background-color: #F4F6F8;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    font-family: 'EB Garamond', serif;
   background-position:center;
   background-size:cover; 
   background-repeat: no-repeat;
    background-attachment: fixed;
}

.fronPageBody
{
    min-height: 100%;
    background-color: #F4F6F8;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    font-family: 'EB Garamond', serif;
   background-image: url('/ImageHandler.ashx?personality=portalbackground&personalityid=0'); 
   background-position:center;
   background-size:cover; 
   background-repeat: no-repeat;
}

.joinButton
{
    background-color: rgba(255,255,240,255);
    color: rgba(130,65,16,255);
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

::-webkit-scrollbar {
    width: 11px;
    height: 11px;
}

::-webkit-scrollbar-button {
    width: 21px;
    height: 21px;
}

::-webkit-scrollbar-thumb {
    background: rgba(130,65,16,255);
    border: 1px solid rgba(120, 120, 120, 0.45);
    border-radius: 50px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: rgba(130,65,16,255);
    }

    ::-webkit-scrollbar-thumb:active {
        background: rgba(130,65,16,255);
        opacity:0.75;
    }

::-webkit-scrollbar-track {
    background: #FFFFFF;
    border: 0px solid #ffffff;
    border-radius: 50px;
}

    ::-webkit-scrollbar-track:hover {
        background: #EEEEEE;
    }

    ::-webkit-scrollbar-track:active {
        background: #DDDDDD;
    }

::-webkit-scrollbar-corner {
    background: transparent;
}

.sideMenu {
    display: block;
    background: rgba(130,65,16,255);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin-top: -65px;
}

.commentTextbox {
    overflow: auto;
    padding: 5px;
    border-radius: 5px 0px 0px 0px;
    color: rgba(130,65,16,255);
    border-width:1px;
    border-color:rgba(130,65,16,255);
}

.commentTracking {
    padding: 0px;
    background-color: rgba(130,65,16,255);
    border-bottom-left-radius: 5px;
    padding: 2px
}

.commentButton {
    min-width: 100%;
    border-width: 0px;
    background-color: rgba(130,65,16,255);
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px
}

.topHeaderTitle {
    border-collapse: collapse;
    background-color: rgba(255,255,240,255);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    color: rgba(130,65,16,255);
    font-weight: bold;
    font-size: large
}



.mobileHeader {
    border-collapse: collapse;
    background: rgba(255,255,240,255);
    box-shadow: 0px 3px 0px rgba(0,0,0, 0.2)
}

.dropDownTerms {
    margin-top: 7px;
    margin-bottom: 7px;
    color: rgba(130,65,16,255);
    width: 100%
}

.mobilePanelMenu {
    z-index: 20;
    top: 0px;
    left: 0px;
    background-color: rgba(130,65,16,255);
}

.modalbackground {
    background-color: white;
    filter: alpha(opacity=75);
    opacity: 0.9;
}

.passportImage {
    border-radius: 5px;
    max-width: 75px;
    max-height: 75px
}

.validatorMessage{
    font-size: x-small;
    color:red;
}

.hideTableMobileMenu {
    display: none;
}

.showTableMobileMenu {
    display: block;
}

.divMobileMenu {
    display: none;
}

.tdDesktopMenu {
    display: block;
   
}

.tdMobileMenu {
    display: none;
}

.TextBoxNormal {
    width: 300px;
    height: 50px;
    background-color: white;
    border-color: #AAAAAA;
    border-style: solid;
    border-width: 1px;
    font-size: 17px;
    text-align: left;
    border-radius: 5px;
}

.hideTableMobileMenu {
    display: none;
}

.showTableMobileMenu {
    display: block;
}
   

.TextBoxStretch {
    width: 100%;
    height: 50px;
    background-color: white;
    border-color: #AAAAAA;
    border-style: solid;
    border-width: 1px;
    font-size: 17px;
    text-align: left;
    border-radius: 5px;
}

.textboxwatermark {
    font-style: italic;
    color: gray;
    border-radius: 3px;
    font-size:medium;
    border-width: 1px;
    border-color: #EEEEEE;
}

.paginatordropdown {
    width: 100%;
    height: 25px;
    background-color: white;
    border-color: #AAAAAA;
    border-style: solid;
    border-width: 1px;
    font-size: 17px;
    
    text-align: left;
    border-radius: 5px;
}

.paginatorItem {
    font-size: 16px;
    font-weight: bold;
}

.modificationPanel {
    position: fixed;
    bottom: 77px;
    right: 5px;
    width: 70px;
    padding: 5px;
}

.modificationItem {
    box-shadow: 1px 2px rgba(0,0,0,.15);
    border-radius: 50%;
    color: white;
    font-size: small;
    background-color: rgba(130,65,16,255);
    width: 60px;
    height: 60px;
    border-color: white;
    border-width: 3px;
    margin-top: 15px;
}

.modificationItemIcon {
   width: 50px;
   height: 50px;
}    
.paginatorimage {
    width: 20px;
    height: 20px;
}

.paginatorbutton {
    padding: 2px;
    font-size: 15px;
    color: #ffffff;
    font-weight: bold;
    background-color: rgba(130,65,16,255);
    border-radius: 3px;
    border-style: none;
    border-width: 1px;
}

.buttonAnother{
    border-radius: 3px;
    color: white;
    background-color: rgba(130,65,16,255);
}

.buttonAnotherModal {
    border-radius: 3px;
    color: rgba(130,65,16,255);
    background-color: white;
    margin: 2px;
    min-width: 120px;
}

.modalContentArea
{
    padding:5px;
    align-items:center;
}

.modalTextInputs {
    border-color: white;
    border-width: 1px;
    border-radius:3px;
    height: 25px;
    color: rgba(130,65,16,255);
    margin: 2px;
}

.modalLabel {
    font-size: 18px;
    margin: 2px;
    font-weight:lighter;
}

.labepageldescription {
    font-size: 25px;
    
    font-weight: normal;
}

.labelDescription {
    font-size: 15px;
    font-weight: bold;
}

.labelDescriptionBigger {
    font-size: 18px;
    
    font-weight: normal;
}

.logopic {
    width: 50px;
    height: 50px;
}


.tdPopupHeader {
    padding: 0px 5px 5px 5px;
}

.popUpCloseButton {
    width: 20px;
    height: 20px;
}

.labelPopupTitle {
    color: white;
    font-size: x-large;
    margin: 5px;
    font-weight: bold;
}

.labelPopupMessage {
    color: #ffffff;
    font-size: large;
    margin: 5px;
    font-weight: bold;
}

.linkbuttonitemsindatalist {
    color: black;
    font-size: medium;
    margin: 1px;
    text-transform: none;
    white-space: nowrap;
}

.tablestudentdetails {
    top: 75px;
}

.tdmywardpic {
    padding: 0px, 0px 10px 10px;
}

.divstudentprofile {
    padding: 10px;
}

.tdnamesessioninfo {
    padding: 0px 10px 0px 10px;
}


.labelname {
    
    color: black;
    font-size: 25px;
    font-weight: bold;
}

.labelnamesmall {
    
    color: black;
    font-size: 15px;
    font-weight: bold;
}

.labelnameDataList {
    
    color: rgba(130,65,16,255);
    font-size: 16px;
    font-weight: bold;
}

.labelnamesmallDataList {
    
    color: #000000;
    font-size: 14px;
    font-weight: bold;
}

.divstudentprofileouter {
    padding: 10px 5px;
}

.divelements {
    margin: 10px 0px;
    border: 0.1px solid #211073;
    padding: 10px;
    border-radius: 3px;
    box-shadow: 5px 5px 8px rgba(0,0,0, 0.1) ;
    background-color:#FFFFFF;
    border-width: 0px;
}

.divnewelements {
    margin: 10px 0px;
    padding: 5px;
}

.contain-fluid-correction{
    padding: 0px;
}

.divheaderelements {
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    padding: 10px;
    border-radius: 5px 5px 0px 0px;
    box-shadow: 5px 5px 8px rgba(0,0,0, 0.1);
    background-color: #FFFFFF;
    border-width: 0.1px;
}

.divbottomelements {
    color: white;
    border: 0.1px solid #211073;
    padding: 10px 5px 10px 5px;
    border-radius: 0px 0px 5px 5px;
    box-shadow: 5px 5px 8px rgba(0,0,0, 0.1);
    background-color: #000000;
    border-width: 0px;
}

.divbottomelementsadornment {
    color: white;
    padding: 3px;
}

.linkbottombuttonitemsindatalist {
    color:white;
    font-size: medium;
    margin: 1px;
    text-transform: none;
    white-space: nowrap;
}

.divdashboardHousing {
    padding:  30px 15px 50px 15px;
}

.divdashboardItem {
    margin: 5px 3px 5px 3px;
    border: 0.1px solid #EEEEEE;
    padding: 10px 5px 10px 5px;
    border-radius: 5px;
    box-shadow: 5px 5px 8px #CCCCCC;
    background-color: rgba(130,65,16,255);
    border-width: 0.1px;
}

.datagridColumnContent {
    padding: 5px;
}

.divdashboardDescription {
    font-size: 14px;
    font-weight: bold;
    color: white;
    margin: 3px;
    opacity: 0.65;
}

.divdashboardIcon {
    height: 20px;
}

.divdashboardTitles {
    font-size: xx-large;
    color: rgba(130,65,16,255);
}

.entityName {
    font-size: x-large;
    color: rgba(130,65,16,255);
}

.entityContact {
    font-size: large;
    color: rgba(130,65,16,255);
}

.entityOtherDetails {
    font-size: medium;
    color: rgba(130,65,16,255);
}

.entityImage {
    width: 120px;
    border-radius: 50%;
    box-shadow: 5px 5px 8px #CCCCCC;
}

.divdashboardCounter {
    font-size: 40px;
    font-weight: lighter;
    color: white;
}

.divdialogbox {
    margin: 10px;
    padding: 10px;
    border: 0.1px solid #ffffff;
    border-radius: 5px;
    box-shadow: 5px 5px 8px Gray;
    background-color:rgba(130,65,16,255);
    border-width: 1px;
    color: white;
}

.divcontainerdatalists {
    padding: 10px 10px;
}

.labelpagename {
    
    color: #ffffff;
    font-size: 35px;
    font-weight: bold;
}

.linkbuttonpagemenu {
    font-size: 25px;
    
    font-weight: bold;
}

    .linkbuttonpagemenu:hover {
        font-size: 25px;
        
        font-weight: bold;
        text-decoration: none !important
    }

.divtoppagemenu {
    padding: 2px;
    border-radius: 5px;
    box-shadow: 5px 5px 20px #F0F0F0;
    background-color: #ffffff;
    border-color: #F0F0F0;
    border-width: 0.5px;
}



.divextra {
    padding: 0px 0px;
}

.desktopmenuicon {
    width: 30px;
}

.divmaincontainer {
    padding: 0px 0px 0px 0px;
}

.dashboardPaymentAmount {
    padding: 20px 2px 2px 2px;
    font-size: 35px;
}

.maincontainerLanding {
    padding: 10px 50px
}

 .journalContent {
        text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

.journalCommendation {
    background-color: #03471e;
    color: #FFFFFF;
	border-radius:3px;
	text-transform:uppercase;
	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.journalWarning {
    background-color: #ff9700;
    color: #000000;
	border-radius:3px;
	text-transform:uppercase;
	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.journalNeutral {
    background: #FFFFFF;
    color: rgba(130,65,16,255);
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
	border-radius:3px;
	text-transform:uppercase;
	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.convesationComment {
    background-color: rgba(255,255,240,255);
    color: rgba(130,65,16,255);
    border-color: rgba(30, 0, 0, 0.25);
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    padding: 5px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}


.convesationReply{
    background-color: rgba(130,65,16,255);
    border-color: rgba(255, 255, 255, 0.25);
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    padding: 5px;
    color: #ffffff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

.mobileReport {
    background: linear-gradient( 0deg, rgba(241,241,241,1) 0%, rgba(255,255,255,1) 15%, rgba(241,241,241,1) 100%);
    color: rgba(130,65,16,255);
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
	overflow:hidden;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


.documents {
    background-color: rgba(130,65,16,255);
    color: #ffffff;
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.otherReportsAndComments {
    padding: 10px;
}

.otherReportsAndCommentsTitle {
    font-size:25px;
}

.mobileSubMenuItems {
    font-size: medium;
    color: #ffffff;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 7px;
    padding-bottom: 2px;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: rgba(255,255,255, 0.25)
}


.desktopSubMenuItems {
    font-size: small;
    color: #ffffff;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 7px;
    padding-bottom: 2px;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: rgba(255,255,255, 0.15);
}

.verticalColumn {
    transform: translate(50%, 0%) rotate(-90deg);
    transform-origin: 0% 100%;
    white-space: nowrap;
}

.horizontalColumn {
    
}

.resultColumn {
    text-align: center;
    padding: 3px;
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    font-weight:bold;
}

.table {

}

.tableheader {
    background-color: #EEEEEE;
    color: rgba(130,65,16,255);
    border-color: rgba(51,51,51, 0.35);
    border-width: 1px;
    border-style: solid;
    text-align: center;
    padding: 3px 8px;
    width: 75px;
    font-size: small;
    text-transform: uppercase;
    white-space:nowrap;
}

.wardChild {
    color: rgba(130,65,16,255);
    background: linear-gradient(0deg, rgba(221,221,221,1) 0%, rgba(255,255,255,1) 5%, rgba(221,221,221,1) 100%);
    font-size: 20px;
    margin-left: 10px;
    margin-top: -75px;
    border-radius: 5px 5px 0px 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-top: 1px solid rgba(0,0,0,0.25);
    border-right: 1px solid rgba(0,0,0,0.25);
    border-left: 1px solid rgba(0,0,0,0.25)
}

.singleWardChild {
    color: rgba(130,65,16,255);
    background: linear-gradient(0deg, rgba(221,221,221,0.3) 0%, rgba(255,255,255,0.6) 5%, rgba(221,221,221,1) 100%);
    font-size: 20px;
    margin-left: 10px;
    margin-top: -75px;
    border-radius: 5px 5px 0px 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 1px solid rgba(0,0,0,0.05)
}

.singleStudentWardHeader {
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,240, 0.65) 100%);
    padding-top: 10px;
    padding-left: 130px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}


.wardChildMenu {
    margin-left: 10px;
    font-size: medium;
    padding: 0px;
    border-radius: 0px 0px 5px 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    background-color: rgba(130,65,16,255);
    color: #FFFFFF;
    text-transform: capitalize
}

.warChildInformation {
    font-size: medium;
    font-weight: bold;
}

.backgroundAccent {
    color: rgba(130,65,16,255);
}

.backgroundBackground {
     background-color: rgba(130,65,16,255);
}

.foregroundAccent {
    color: rgba(255,255,240,255);
}

.foregroundBackground {
     background-color: rgba(255,255,240,255);
}



a {
    text-decoration: none;
    color:rgba(130,65,16,255);
}

.noStyleLink{
    text-decoration: none;
    color:rgba(130,65,16,255);
}

.view {
    margin: auto;
    width: 100%;
}


.table {
    border-collapse: collapse;
}

.wrapper {
    position: relative;
    overflow: auto;
    border: 1px solid rgba(0,0,0, 0.15);
    white-space: nowrap;
    border-radius: 7px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.sticky-col {
    position: -webkit-sticky;
    position: sticky;
    background-color: #EEEEEE;
    padding-left: 5px;
    color: rgba(130,65,16,255);
    border: solid 1px rgba(130,65,16,255);
    box-shadow: 6px 1px 10px 0px rgba(0,0,0,0.2);
}

.first-col {
    min-width: 100px;
    left: 0px;
    text-transform: uppercase;
    padding-left: 5px;
    color: rgba(130,65,16,255);
    border: solid 1px rgba(51,51,51,0.15);
}

.second-col {
    width: 150px;
    min-width: 150px;
    max-width: 150px;
    left: 100px;
}

.tableBody {
    background: linear-gradient( 0deg, rgba(240,240,240,1) 0%, rgba(255,255,255,1) 15%, rgba(240,240,240,1) 100%);
    color: rgba(130,65,16,255);
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.tablePaymentBody {
    background: linear-gradient( 0deg, rgba(240,240,240,1) 0%, rgba(255,255,255,1) 15%, rgba(240,240,240,1) 100%);
    color: rgba(130,65,16,255);
    border-color: #DDDDDD;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



.imgDashboard {
    width: 75%;;
}

.conversationContainer {
    padding: 0px 20px;
    width: 25%;
    position: fixed;
    bottom: 0px;
    right: 0px;
	z-index:200;
}

.commentPalate {
    background-color: #EEEEEE;
    color: rgba(130,65,16,255);
    border-color: rgba(51, 51, 51, 0.35);
    border-width: 1px 1px 0px 1px;
    border-style: solid;
    border-radius: 5px 5px 0px 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.commentButtonLauncher {
    height: 70px;
    width: 70px;
    border-radius: 35px;
    background-color: rgba(255,255,240,255);
    border: solid 1px rgba(255, 255, 255, 0.45);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    position: fixed;
    bottom: 20px;
    right: 10px;
    color: rgba(130,65,16,255);
    transform: scale(0.85, 0.85);
    z-index:200;
}

.pendingAssignmentLauncher {
    height: 70px;
    width: 70px;
    border-radius: 35px;
    background-color: #f2d865;
    border: solid 1px rgba(255, 255, 255, 0.45);
    box-shadow: rgba(0, 0, 0, 0.75) 1px 1px;
    position: fixed;
    bottom: 85px;
    right: 10px;
    transform:scale(0.85, 0.85);
}

.mobileGradeLegendPointer {
    background-color: rgba(130,65,16,255);
    position:fixed;
    bottom:0;
    left:0;
    display:none;
}

.dashboardPointers {
    background-color: rgba(130,65,16,255);
    padding: 0px;
    position: fixed;
    bottom: 0px;
    left: 0px;
    z-index: 30;
    border-radius: 5px 5px 0px 0px;
    box-shadow: rgba(225,225,225, 0.45 ) 0px -2px;
}

.dashboardComments {
    height: 460px;
    overflow-y: auto;
    padding:5px;
}

.dashboardDocuments {
    height: 440px;
    overflow-y: auto;
    padding: 5px;
}

.dashboardJournal {
    height: 400px;
    overflow-y: auto;
    padding: 5px;
}


 .dashboardDocumentHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.dashboardCommentHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
}

.dashboardJournalHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}


.assignmentDefault {
    padding: 2px;
    background-color: #ff0000;
    border-radius: 5px 5px 0px 0px;
    color: #FFFFFF;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-left: 5px;
    border: 0px solid #CCCCCC;
}

.assignmentDefaultHousing {
    padding: 2px;
    background-color: rgba(255,0,0,0.25);
    color: #000000;
    font-weight: bold;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 0px solid #CCCCCC;
}

.assignmentWarning {
    padding: 2px;
    background-color: #f2d865;
    border-radius: 5px 5px 0px 0px;
    color: #000000;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-left: 5px;
    border: 0px solid #CCCCCC;
}


.assignmentWarningHousing {
    padding: 2px;
    background-color: rgba(242,216,101, 0.25);
    color: #000000;
    font-weight: bold;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 0px solid #CCCCCC;
}

.assignmentComplied {
    padding: 2px;
    background-color: #067431;
    border-radius: 5px 5px 0px 0px;
    color: #FFFFFF;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-left: 5px;
    border: 0px solid #CCCCCC;
}


.assignmentCompliedHousing {
    padding: 2px;
    background-color: rgba(6, 116, 49, 0.25);
    color: #000000;
    padding: 5px;
    font-weight: bold;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 0px solid #CCCCCC;
}

.assignmentNeutral {
    padding: 2px;
    background-color: #FFFFFF;
    border-radius: 5px 5px 0px 0px;
    color: #000000;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-left: 5px;
    border: 1px solid #CCCCCC;
}

.assignmentDashboardNoContent {
    padding-top: 120px;
    padding-bottom: 120px;
    text-align: center;
    font-size: x-large;
    width: 100%;
    display: inline-block;
    color: rgba(30,0,0, 0.45);
}


.assignmentDashbordHousing {
    padding: 2px;
    background-color: #FFFFFF;
    color: #000000;
    font-weight: bold;
    padding: 5px;
    border: 1px solid rgba(30,0,0, 0.45);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-radius: 5px;
}

.assignmentDashboardContainer {
    padding: 10px;
    padding-top:0px;
    overflow-x: hidden;
    overflow-y: auto;
    height: 400px;
    text-align: left;
    border-top: solid 1px rgba(0,0,0,0.15)
}


.assignmentNeutralHousing {
    padding: 2px;
    background-color: #FFFFFF;
    color: #000000;
    font-weight: bold;
    padding: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border: 1px solid #CCCCCC;
}

.assignmentActions {
    padding: 2px;
    background-color: #000000;
    border-radius: 0px 0px 5px 5px;
    color: #FFFFFF;
    padding: 10px 5px 5px 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-top: -35px;
    margin-left: 5px;
}


.assignmentButtons
{
    font-size: smaller;
    color: #FFFFFF;
    text-transform:uppercase;
    text-align:center;
    padding:5px;
    border: rgba(255,255,255, 0.25) solid 1px;
}

.button {
    background-color: rgba(130,65,16,255);
    color: #EEEEEE;
    border-color: rgba(255,255,240,255);
    padding: 2px 20px;
    border-style:none;
    border-radius:3px;
}

.acommentHeader {
    padding: 2px;
    background-color: #EFEFEF;
    border-radius: 5px 5px 0px 0px;
    color: rgba(130,65,16,255);
    font-size: medium;
    padding: 10px 5px 5px 5px;
    box-shadow: 0 0px 8px 0 rgba(0, 0, 0, 0.2), 0 0px 20px 0 rgba(0, 0, 0, 0.19)
}

.acommentBox {
    padding: 5px;
    padding-left: 50px;
    border-radius: 5px;
    border: solid 1px rgba(255,255,240,0.75);
    box-shadow: 0 4px 8px 0 rgba(255,255,240, 0.2), 0 6px 20px 0 rgba(255,255,240, 0.19);
    min-height: 100px;
    color:rgba(130,65,16,255);
    background-color: #EFEFEF;
}

.acommentFooter {
    padding: 2px;
    background-color: rgba(130,65,16,255);
    border-radius: 0px 0px 5px 5px;
    color: #FFFFFF;
    font-size: medium;
    padding: 10px 5px 5px 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.resultSummary
{
    padding: 5px;
    font-size:x-large;
}

.resultIndices
{
    border: solid 1px rgba(255,255,240,0.75);
    box-shadow: 0 4px 8px 0 rgba(130,65,16, 0.2), 0 6px 20px 0 rgba(130,65,16, 0.19);
    min-height: 100px;
    color:rgba(130,65,16,255);
    background-color: rgba(255,255,240, 0.1);
    padding: 5px;
    font-size: large;
    border-radius:3px
}

.paymentItem {
    background-color: transparent;
    color: rgba(130,65,16,255);
    border-color: transparent;
    border-width: 0px;
    border-style: none;
    padding-bottom:0px;
    padding-left:0px;
    padding-right:0px;
    padding-top:0px;
}

.tablePaymentLabels {
    font-size: medium;
}

.tableAmountPaymentLabels {
    font-size: medium;
}

.wardHousing
{
    padding:  10px 50px;
}

.tableCell {
    padding: 5px;
    border-bottom-color: #F4F6F8;
    border-bottom-style: solid;
    border-bottom-width:2px;
    background-color:#FFFFFF;
}

.tableMobileRowSeparator {
    padding: 5px;
    display: none;
}


.homeWelcomePanelLeft {
    padding: 15px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.19), 0 0px 0px 0 rgba(0, 0, 0, 0)
}

.homeWelcomePanelRight {
    background-color: #EEEEEE;
    padding: 15px;
    padding-bottom: 50px;
     border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
     border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0), 0 0px 20px 0 rgba(0, 0, 0, 0.19)
}

.journalContentHome {
        text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box ;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

    .activityLabel{
    font-size:small;
    padding:3px;
    text-align:left
}

@media screen and (max-width:1200px) {

.activityLabel{
    font-size:small;
    padding:3px;
    text-align:left
}

 .journalContent {
       text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

.homeWelcomePanelLeft {
    padding: 15px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.19), 0 0px 0px 0 rgba(0, 0, 0, 0)
}

.homeWelcomePanelRight {
    background-color: #EEEEEE;
    padding: 15px;
    padding-bottom: 50px;
     border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
     border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0), 0 0px 20px 0 rgba(0, 0, 0, 0.19)
}




    .warChildInformation {
        font-size: medium;
        font-weight: bold;
    }
    .resultSummary
    {
        padding: 5px;
        font-size:x-large;
    }

    .dashboardComments {
        height: 410px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardDocuments {
        height: 390px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardJournal {
        height: 350px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardPointers {
        background-color: rgba(130,65,16,255);
        padding: 0px;
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 30;
        border-radius: 5px 5px 0px 0px;
        box-shadow: rgba(225,225,225, 0.45 ) 0px -2px;
    }

    .mobileGradeLegendPointer {
        background-color: rgba(130,65,16,255);
        position: fixed;
        bottom: 0;
        left: 0;
        display: none;
    }
    .conversationContainer {
        padding: 0px 20px;
        width: 25%;
        position: fixed;
        bottom: 0px;
        right: 0px;
    }

    .imgDashboard {
        width: 75%;
    }

    .otherReportsAndComments
    {
        padding:20px;
    }

    .dashboardPaymentAmount {
        padding: 20px 2px 2px 2px;
        font-size: 30px
    }

    .divmaincontainer {
        padding: 0px 0px 0px 0px;
    }

    .tdDesktopMenu {
        display: none;
    }

    .tdMobileMenu {
        display: block;
    }

    .divMobileMenu {
        display: block;
    }

    .divcontainerdatalists {
        padding: 10px 10px;
    }

    .linkbuttonitemsindatalist {
        color: black;
        font-size: medium;
        margin: 1px;
        text-transform: none;
        white-space: nowrap;
    }

    .divstudentprofileouter {
        padding: 10px;
    }

    .maincontainerLanding{
        padding: 10px 30px;
    }

    .labelname {
        
        color: black;
        font-size: 25px;
        font-weight: bold;
    }

    .labelnamesmall {
        
        color: black;
        font-size: 15px;
        font-weight: bold;
    }

    .labelnameDataList {
        
        color: rgba(130,65,16,255);
        font-size: 16px;
        font-weight: bold;
    }

    .labelnamesmallDataList {
        
        color: #000000;
        font-size: 14px;
        font-weight: bold;
    }

    .tdnamesessioninfo {
        padding: 10px 10px 10px 10px;
    }


    .divstudentprofile {
        padding: 10px;
    }

    .tdmywardpic {
        padding: 10px, 10px 10px 10px;
    }


    .logopic {
        width: 50px;
        height: 50px;
    }


    .tablestudentdetails {
        top: 75px;
    }

    
}

@media screen and (max-width:992px) {

.activityLabel{
    font-size:small;
    padding:3px;
    text-align:left
}

 .journalContent {
        text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

.homeWelcomePanelLeft {
    padding: 15px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    box-shadow: 0 0px 20px 0 rgba(0, 0, 0, 0.19), 0 0px 0px 0 rgba(0, 0, 0, 0)
}

.homeWelcomePanelRight {
    background-color: #EEEEEE;
    padding: 15px;
    padding-bottom: 50px;
     border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
     border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0), 0 0px 20px 0 rgba(0, 0, 0, 0.19)
}


    .warChildInformation {
        font-size: medium;
        font-weight: bold;
    }
    .resultSummary {
        padding: 5px;
        font-size: large;
    }

    .dashboardComments {
        height: 410px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardDocuments {
        height: 390px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardJournal {
        height: 350px;
        overflow-y: auto;
        padding: 5px;
    }

    .dashboardPointers {
        background-color: rgba(130,65,16,255);
        padding: 0px;
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 30;
        border-radius: 5px 5px 0px 0px;
        box-shadow: rgba(225,225,225, 0.45 ) 0px -2px;
    }

    .mobileGradeLegendPointer {
        background-color: rgba(130,65,16,255);
        position: fixed;
        bottom: 0;
        left: 0;
        display: none;
    }
    .conversationContainer {
        padding: 0px 20px;
        width: 35%;
        position: fixed;
        bottom: 0px;
        right: 0px;
    }

    .imgDashboard {
        width: 80%;
    }

    .otherReportsAndComments {
        padding: 5px 5px 100px 5px;
    }
    .dashboardPaymentAmount {
        padding: 20px 2px 2px 2px;
        font-size: 40px
    }
    .maincontainerLanding {
        padding: 5px 5px;
    }

    .divmaincontainer {
        padding: 0px 0px 0px 0px;
    }

    .divcontainerdatalists {
        padding: 10px 10px;
    }

    .linkbuttonitemsindatalist {
        color: black;
        font-size: medium;
        margin: 1px;
        text-transform: none;
        white-space: nowrap;
    }

    .labelname {
        
        color: black;
        font-size: 25px;
        font-weight: bold;
    }

    .labelnamesmall {
        
        color: black;
        font-size: 15px;
        font-weight: bold;
    }

    .labelnameDataList {
        
        color: black;
        font-size: 16px;
        font-weight: bold;
    }

    .labelnamesmallDataList {
        
        color: black;
        font-size: 14px;
        font-weight: bold;
    }

    .tdnamesessioninfo {
        padding: 10px 10px 10px 10px;
    }



    .divstudentprofile {
        padding: 10px;
    }

    .tdmywardpic {
        padding: 10px, 10px 10px 10px;
    }

    .logopic {
        width: 50px;
        height: 50px;
    }
}

@media screen and (max-width:850px) {

.activityLabel{
    font-size:x-small;
    padding:3px;
    text-align:left
}

 .journalContent {
        text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

.homeWelcomePanelLeft {
    padding: 15px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.homeWelcomePanelRight {
    background-color: #EEEEEE;
    padding: 15px;
    padding-bottom: 50px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

    .warChildInformation {
        font-size: small;
        font-weight: bold;
    }
    .wardHousing {
        padding: 10px;
    }
    .tablePaymentLabels {
        font-size: large;
    }
    .tableAmountPaymentLabels {
        font-size: medium;
    }

    .tablePaymentBody {
        background-color: transparent;
        color: rgba(130,65,16,255);
        border-color: transparent;
        border-width: 0px;
        border-style: none;
        box-shadow: none;
    }

    .paymentItem {
        background: linear-gradient( 0deg, rgba(240,240,240,1) 0%, rgba(255,255,255,1) 15%, rgba(240,240,240,1) 100%);
        color: rgba(130,65,16,255);
        border-color: #DDDDDD;
        border-width: 1px;
        border-style: solid;
        border-radius: 3px;
        padding:5px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

    .resultSummary {
        padding: 5px;
        font-size: large;
    }

    .dashboardComments {
        height: auto;
        overflow-y:auto;
    }

    .dashboardDocuments {
        height: auto;
        overflow-y: auto;
    }

    .dashboardJournal {
        height: auto;
        overflow-y: auto;
    }


    .dashboardPointers {
        background-color: rgba(130,65,16,255);
        padding: 0px;
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 30;
        border-radius: 5px 5px 0px 0px;
        box-shadow: rgba(225,225,225, 0.45 ) 0px -2px;
    }

    .mobileGradeLegendPointer {
        background-color: rgba(130,65,16,255);
        
        position: fixed;
        bottom: 0;
        left: 0;
        display: none;
    }
    .conversationContainer {
        padding: 0px 20px;
        width: 50%;
        position: fixed;
        bottom: 0px;
        right: 0px;
    }

    .imgDashboard {
        width: 85%;
    }
    .otherReportsAndComments {
        padding: 5px 5px 100px 5px;
    }

    .dashboardPaymentAmount {
        padding: 20px 2px 2px 2px;
        font-size: x-large;
    }

    .maincontainerLanding {
        padding: 5px 5px;
    }
    .divmaincontainer {
        padding: 0px 0px 0px 0px;
    }

    .tdDesktopMenu {
        display: none;
    }

    .tdMobileMenu {
        display: block;
    }

    .divcontainerdatalists {
        padding: 10px 10px;
    }

    .linkbuttonitemsindatalist {
        color: black;
        font-size: medium;
        margin: 1px;
        text-transform: none;
        white-space: nowrap;
    }

    .labelname {
        
        color: black;
        font-size: 20px;
        font-weight: bold;
    }

    .labelnamesmall {
        
        color: black;
        font-size: 12px;
        font-weight: bold;
    }

    .labelnameDataList {
        
        color: black;
        font-size: 16px;
        font-weight: bold;
    }

    .labelnamesmallDataList {
        
        color: black;
        font-size: 14px;
        font-weight: bold;
    }

    .tdnamesessioninfo {
        padding: 5px 10px 10px 10px;
    }

    .divstudentprofile {
        padding: 10px;
    }

    .tdmywardpic {
        padding: 10px, 10px 10px 10px;
    }

    .logopic {
        width: 50px;
        height: 50px;
    }
}

@media screen and (max-width:670px){

.activityLabel{
    font-size:x-small;
    padding:3px;
    text-align:left
    }

 .journalContent {
        text-overflow:ellipsis;
        overflow:hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        font-size:small;
        text-transform:none;
    }

.homeWelcomePanelLeft {
    padding: 15px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.homeWelcomePanelRight {
    background-color: #EEEEEE;
    padding: 15px;
    padding-bottom: 50px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.tableCell {
    padding: 5px;
    border-bottom-color: #F4F6F8;
    border-bottom-style: none;
    border-bottom-width:0px;
    background-color:#FFFFFF;
}

.tableMobileRowSeparator {
    padding: 5px;
    display: block;
}
    .assignmentDashboardNoContent {
        padding-top: 120px;
        padding-bottom: 120px;
        text-align: center;
        font-size: x-large;
        width: 100%;
        display: inline-block;
        color: rgba(30,0,0, 0.45);
        display: none;
    }

    .assignmentDashboardContainer {
        padding: 10px;
        overflow-x:hidden;
        overflow-y:auto;
        height: auto;
        text-align: left;
        border-top:  none 1px rgba(0,0,0,0.15)
    }


    .warChildInformation {
        font-size: small;
        font-weight: bold;
    }
    .wardHousing {
        padding: 0px;
    }
    .tablePaymentLabels
    {
        font-size: medium;
    }

    .tableAmountPaymentLabels {
        font-size: xx-large;
    }

    .tablePaymentBody {
        background-color: transparent;
        color: rgba(130,65,16,255);
        border-color: transparent;
        border-width: 0px;
        border-style: none;
        box-shadow:none;
    }

    .paymentItem {
        padding: 10px;
        padding-top: 0px;
        padding-bottom: 0px;
        background-color: #EFEFEF;
        border-radius: 5px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        color: rgba(130,65,16,255);
        border-color: #DDDDDD;
        border-width: 1px;
        border-style: solid;
        border-radius: 3px;
        padding: 10px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

    .resultSummary {
        padding: 5px;
        font-size: medium;
    }

    .dashboardComments {
        height: auto;
        overflow-y: auto;
        padding: 5px;
    }

	.dashboardDocuments {
      height: auto;
      overflow-y: auto;
    padding: 5px;
	}

    
    .dashboardJournal {
        height: auto;
        overflow-y: auto;
        padding: 2px;
    }

	
 .dashboardDocumentHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-left-radius: 0px;
}

.dashboardCommentHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
}

.dashboardJournalHousing {
    background-color: rgba(255,255,240, 0.1);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);    
    border-top-right-radius: 0px;
	border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}


    .dashboardPointers {
        background-color: rgba(130,65,16,255);
        padding: 0px;
        position: fixed;
        bottom: 0px;
        left: 0px;
        z-index: 30;
        border-radius: 5px 5px 0px 0px;
        box-shadow: rgba(225,225,225, 0.45 ) 0px -2px;
    }

    .mobileGradeLegendPointer {
        background-color: rgba(130,65,16,255);
        position: fixed;
        bottom: 0px;
        left: 0px;
        display: block;
        padding:5px;
        border-radius: 3px 3px 0px 0px;
    }

    .conversationContainer {
        padding: 0px 10%;
        width: 100%;
        position: fixed;
        bottom: 0px;
    }
    .imgDashboard {
        width: 100%;
    }
    .otherReportsAndComments {
        padding: 5px 5px 100px 5px;
    }

    .dashboardPaymentAmount {
        padding: 20px 2px 2px 2px;
        font-size: xx-large;
    }

    .maincontainerLanding {
        padding: 5px 5px;
    }
        
    .divmaincontainer {
    }

    .labelpagename {
        
        color: #ffffff;
        font-size: 25px;
        font-weight: bold;
    }

    .paginatordropdown {
        min-width: 100px;
        width: 100%;
        height: 25px;
        background-color: white;
        border-color: #AAAAAA;
        border-style: solid;
        border-width: 1px;
        font-size: 14px;
        
        text-align: left;
        border-radius: 3px;
    }

    .searchTextBox {
        width: 100%;
        height: 25px;
        background-color: white;
        border-color: #AAAAAA;
        border-style: solid;
        border-width: 1px;
        font-size: 17px;
        
        text-align: left;
        border-radius: 5px;
    }

    .checkBoxClass {
        font-size: 25px;
    }

    .paginatorItem {
        font-size: 16px;
        font-weight: bold;
        white-space: nowrap;
    }

    .paginatorimage {
        width: 20px !important;
        height: 20px !important;
    }

    .paginatorbutton {
        padding: 5px;
        font-size: 15px;
        color: #ffffff;
        font-weight: bold;
        background-color: rgba(130,65,16,255);
        border-radius: 2px;
        border-style: none;
        border-width: 1px;
    }

    .toppaginationcontainers
    {
        margin: 5px !important;
    }


    .divextra {
        padding: 10px 0px;
    }


    .linkbuttonpagemenu {
        font-size: 20px;
        
        font-weight: bold;
    }

        .linkbuttonpagemenu:hover {
            font-size: 20px;
            
            font-weight: bold;
            text-decoration: none !important
        }

    .tdDesktopMenu {
        display: none;
        
    }

    .tdMobileMenu {
        display: block;
    }

    .divcontainerdatalists {
        padding: 10px 10px;
    }

    .linkbuttonitemsindatalist {
        color: black;
        font-size: medium;
        margin: 1px;
        text-transform: none;
        white-space: nowrap;
    }

    .divstudentprofileouter {
        padding: 10px 5px;
    }

    .labelname {
        
        color: black;
        font-size: 20px;
        font-weight: bold;
    }

    .labelnamesmall {
        
        color: black;
        font-size: 12px;
        font-weight: bold;
    }

    .labelnameDataList {
        
        color: black;
        font-size: 16px;
        font-weight: bold;
    }

    .labelnamesmallDataList {
        
        color: black;
        font-size: 14px;
        font-weight: bold;
    }

    .tdnamesessioninfo {
        padding: 5px 10px 10px 10px;
    }

    .divstudentprofile {
        padding: 10px;
    }

    .tdmywardpic {
        padding: 0px, 0px 0px 0px;
    }

    .logopic {
        width: 50px;
        height: 50px;
    }


    .tablestudentdetails {
        top: 50px;
    }
}