﻿/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait){
  /* some CSS here */
    #DivPageWidth {
        width:100%;
        margin: 0 auto; 
    }
}

/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape){
  /* some CSS here */
  #DivPageWidth {
        width:100%;
        margin: 0 auto; 
    }
}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-device-width: 640px){
  /* some CSS here */
  #DivPageWidth {
        width:100%;
        margin: 0 auto; 
    }
}

/* #### iPhone 4+ Portrait or Landscape #### */
@media screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
  /* some CSS here */
  #DivPageWidth {
        width:100%;
        margin: 0 auto; 
    }
}

/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px){
  /* some CSS here */
  #DivPageWidth {
      
        width:100%;
        margin: 0 auto; 
    }
}

/* #### Desktops #### */
@media screen and (min-width: 1024px){
  /* some CSS here */
  
  #DivPageWidth {            
        width:1024px;
        margin: 0 auto; 
        
    }
}



     body {
        font-size: 12pt;
        color: #636363;
        font-family: Tahoma;

    }
   


    .clsErrMsg {
        font-weight: bold;
        font-size: 10pt;
        color: red;
    }


.clsTableDefault {
    width:100%;
    padding: 5px 5px 5px 5px;
    border: none;  

}

.clsMenuItem {
    margin:0;
    padding:0;  
    width:300px;
    height:70px;
    border: none;
    border-spacing:0px;
    margin: 0 auto; 
    
    /*border-width:1px;
    border-color: black;  
    
    border-radius: 5px;
    border-spacing:0px;
    -moz-border-radius: 5px;*/

    
    
      
}



.clsMenuItem a:active, a:link, a:visited, a:hover   {
    text-decoration:none;  
}

.clsMenuItem td.icon
{
    border-spacing:0px; 
    width:70px;
    background-color:black;  
    border-color: black;
    border-width:1px;
    border-color: black;  
    
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-spacing:0px;
    -moz-border-top-left-radius: 5px;
    -moz-border-bottom-left-radius: 5px;
    
}

.clsMenuItem td.caption
{
    
    border-spacing:0px;
    padding-left:10px;   
    padding-right:10px;
    vertical-align:middle;  
    background-color:red;
    
    color:white;  
    font-weight:bold;
    font-size:14pt;  
    text-decoration:none;   

    border-color: red;  
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-spacing:0px;
    -moz-border-top-left-radius: 5px;
    -moz-border-bottom-left-radius: 5px;

}


#studInfoPanelTBL 				{ width: 90%; margin-left : auto; margin-right: auto;margin-top:10px;background:#FFFFFF;text-align:center; padding-top:10px  }
#studInfoPanelTable 			{ height: 60px; margin-left : auto; margin-right: auto;      }
#studInfoPanelPhoto 			{ width: 40px; text-align: right; vertical-align: middle; border:solid; border-width:1px; border-color:#d5d5d5}
#studInfoPanelDetail 			{ padding-left: 20px; line-height: 20px; font-weight:bold;font-size: 10px; vertical-align: middle; }
#studInfoPanelDetailTBL 		{ font-size: 12px; }
#studInfoPanelDetailTBL th		{ padding: 2px 5px; width: 100%; text-align: left; color: #4f4f4f }
#studInfoPanelDetailTBL td		{ padding: 2px 5px; width: 100%; text-align: left; color: #4f4f4f  }
#studInfoPanelDetailTBL td+td	{ width: 100%; }

.PageTitle {
    
    /*color: #8b8b8b;  	
    text-shadow: 2px 2px #e6e6e6;
        */

    background-color:#f0f0f0; 
    color: #0089c8;  	
    text-shadow: 2px 2px #e6e6e6;

    
    font-size:18pt;
    font-family: Tahoma , Arial;   
    padding:10px 10px 10px 10px;    
    /*border-bottom: 1px solid #e6e6e6 ;*/
    border: 1px solid #e6e6e6 ;
    margin-top :20px;    
    margin-bottom :20px;    

       border-radius: 8px;
        -moz-border-radius: 8px;
        -khtml-border-radius: 8px;
        -webkit-border-radius: 8px;
}

.PageContent {
    padding-top:10px; 
    padding-left:20px;
    padding-right:20px;
    padding-bottom:10px;
    /*background-color : #FFFFFF;*/
    font-size:10pt; 
}

.PageContent a:before {
    text-decoration:none;  
}

.PageContent a:hover  {
    text-decoration:none;  
}

.PageContent a:visited   {
    text-decoration:none;  
}

.divider-line {
	display: block;
	width: 100%; 
	height: 3px;
 	background:#fff url(images/template1/top_line.jpg) repeat-x scroll center center;
}

/* footer */
.footer {
	width:100%;
	margin:0 auto;
	padding:20px 0;
	color:#888787;
	background: #ffffff;
    font-family:Arial;
    font-size:10px;  
    text-align:center ; 
}

.footer a {
	color:#888787;
	text-decoration:underline;
}
.footer a:hover {
	text-decoration:none;
}
 /*end footer*/

.clsSectionHeader {
    width:100%;
    height:30px; 
    vertical-align:middle;
    padding-left:10px;   
    padding-top:5px;
    padding-bottom:5px;
    padding-right:10px;
    background-color:#0089c9;
    color:#FFFFFF;
    font-weight:bold;  
}

    .clsSectionHeader td {
        width:100%;
    }

/*Style for CPLessSchedule*/
.clsTableCPLessSchedulePanel
{
    
    
    border-spacing:0px 0px;
    width: 100%;
    font-size: 11pt;	
	font-family: Arial;
    border: 0px;
    border-style:none; 
    /*border-color: gray;*/
    padding: 0px 0px 0px 0px; 
    background-color: #b2d2f0; 
    text-align: left;
    /*height:100px; */
    margin-left:auto;  
    margin-right:auto;
     
}

.clsTableCPLessSchedule
{
    
    margin-left:auto;  
    margin-right:auto;
    width: 100%;
    font-size: 10pt;	
	font-family: Arial;
     
    /*border: 1px;
    border-style:solid; 
    
   border-color: #595959;*/
    
    border-spacing:0px 0px;
    text-align: center;
   height:80px; 
     
}

.clsTableCPLessScheduleEmptyTD
{
    width:auto; 
    background-color: #FFFFFF ;
    
}

.clsTableCPLessScheduleTD
{
    border-collapse: collapse;
    width: 25%;
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#e6e6e6;
    padding: 10px 10px 10px 10px;  
     text-align: center ;
}


.clsCPLessScheduleTitle
{
    font-size: 10pt;	
	font-family: Arial;
    line-height:30px; 
    

}

.clsCPLessScheduleDate
{
    font-size: 9pt;	
	font-family: Arial;
    color:  black ;  
    
}
.clsCPLessScheduleTime
{
    font-size: 9pt;	
	font-family: Arial;
    color: black;  
    
}

.clsCPLessScheduleRoom
{
    font-size: 9pt;	
	font-family: Arial;
    color: black;  
    
}


.clsCPLessScheduleTitleAlert
{
    font-size: 10pt;	
	font-family: Arial;
    line-height:30px; 
    color:red; 
    

}

.clsCPLessScheduleDateAlert
{
    font-size: 9pt;	
	font-family: Arial;
    color:  red ;  
    
}
.clsCPLessScheduleTimeAlert
{
    font-size: 9pt;	
	font-family: Arial;
    color: red;  
    
}

.clsCPLessScheduleRoomAlert
{
    font-size: 9pt;	
	font-family: Arial;
    color: red;  
    
}

.clsLessScheduleTab {
    width: 100px;
    height: 20px;
    border: 1px solid #CEDEFF;
    background-color: #009aff;
    font-family: Tahoma;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    color: white; 
    border-radius: 0px 0px 8px 8px;
    padding-top:5px;  
    padding-left:20px;
    padding-right:20px;
    display:inline-block;
    text-align:center;  
}

    .clsLessScheduleTab a {
        text-decoration: none;  
         color: white; 
    }
  
/*End Style for CPLessSchedule*/

     /*devexpress round corner*/
    table.dxeTextBoxSys, table.dxeMemoSys, table.dxeButtonEdit, td.dxeButtonEditButton {
        border-radius: 5px;
        -moz-border-radius: 5px;
        -khtml-border-radius: 5px;
        -webkit-border-radius: 5px;
    }

        table.dxeMemoSys td {
            padding-right: 2px;
        }

    .dxeMemoEditAreaSys {
        display: none;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -khtml-border-radius: 5px;
        -webkit-border-radius: 5px;
    }

    .dxeMemoDiv {
        border-radius: 5px;
        -moz-border-radius: 5px;
        -khtml-border-radius: 5px;
        -webkit-border-radius: 5px;
        overflow: hidden !important;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }

    .dxbButton {
        border-radius: 5px;
        -moz-border-radius: 5px;
    }
    /*End devexpress round corner*/



    
/*Style for CPStudPortalAnnouncePosting*/


.clsTableCPStudPortalAnnouncePosting
{
    border-collapse: collapse;
    width: 100%;
    font-size: 11pt;	
	font-family: Arial;
    border: 1px;
    border-style:none; 
    border-color: gray;
    padding: 10px 10px 10px 10px;  
    text-align: left;
    background-color:white;
     
}



.clsCPStudPortalAnnouncePostingSectionHeader {
    font-size: 13pt;	
	font-family: Arial;
    font-weight:bold;  
    line-height:30px; 
    padding: 10px 10px 10px 10px;  
}

.clsCPStudPortalAnnouncePostingSectionInfo
{
    
    width:100%;
    border-bottom: 1px solid #e6e6e6; 
    padding: 20px 10px 10px 10px;  

}

.clsCPStudPortalAnnouncePostingTitle
{
    color: #20a7e6;
    font-size: 12pt;	
	font-family: Arial;
    font-weight:bold;  
    

}

.clsCPStudPortalAnnouncePostingPostInfo
{
    line-height:30px; 
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
        
}

.clsCPStudPortalAnnouncePostingPostDate
{
    
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
        
}

.clsCPStudPortalAnnouncePostingPostBy
{
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
    
}
/*End Style for CPStudPortalAnnouncePosting*/
    
/*Style for CPStudPortalPosting*/
.clsPanelCPStudPortalPosting  {
    
    border: 1px solid #e6e6e6;
     border-radius: 15px;
        -moz-border-radius: 15px;
        -khtml-border-radius: 15px;
        -webkit-border-radius: 15px;
        padding: 10px 10px 10px 10px;  
        margin-bottom:40px; 


} 


.clsTableCPStudPortalPosting
{
    border-collapse: collapse;
    width: 100%;
    font-size: 10pt;	
	font-family: Arial;
    
    border-style:none; 
    
    padding: 10px 10px 10px 10px;  
    text-align: left;
    background-color:white;
    

    
     
}



.clsCPStudPortalPostingSectionHeader {
    font-size: 13pt;	
	font-family: Arial;
    font-weight:bold;  
    line-height:30px; 
    padding: 10px 10px 10px 10px;  
}

.clsCPStudPortalPostingSectionInfo
{
    
    width:100%;
    border-bottom: 1px solid #e6e6e6; 
    padding: 20px 10px 10px 10px;  
    background-color :#f0f0f0;

    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-spacing:0px;
    -moz-border-top-left-radius: 10px;
    -moz-border-top-right-radius: 10px;
    
}

.clsCPStudPortalPostingTitle
{
    color: #20a7e6;
    font-size: 12pt;	
	font-family: Arial;
    font-weight:bold;  
    

}


.clsCPStudPortalPostingTitle a:before 
{
    color: #20a7e6;
    font-size: 12pt;	
	font-family: Arial;
    font-weight:bold;  
    text-decoration:none; 

}


.clsCPStudPortalPostingTitle a:link 
{
    color: #20a7e6;
    font-size: 12pt;	
	font-family: Arial;
    font-weight:bold;  
    text-decoration:none; 

}

.clsCPStudPortalPostingPostInfo
{
    line-height:30px; 
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
        
}

.clsCPStudPortalPostingPostDate
{
    
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
        
}

.clsCPStudPortalPostingPostBy
{
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
    
}
/*End Style for CPStudPortalPosting*/


.clsFormLabelTD
{
	
	font-size: 10pt;	
	font-family: Arial;
	border-bottom-style : dotted;
	border-bottom-width :1px;
	border-bottom-color: #cbcbcb;
	width:200px!important;	
    line-height:30px; 
}

.clsFormSubHeader
{
	font-weight: bold;
	font-size: 12pt;
	/*color: red!important;*/
	font-family: Arial;	
    line-height:30px;
}

.clsFormUITD 
{
	font-size: 10pt;
	color: #595959;	
	font-family: Arial;
	text-align: left;	 
	width:auto!important;	
	
}

.clsFormLabelCompTD
{
	/*font-weight: bold;*/
	font-size: 10pt;
	/*color: red!important;*/
	font-family: Arial;
	width:200px!important;	
	border-bottom-style : dotted;
	border-bottom-width :1px;
	border-bottom-color: #cbcbcb;
    line-height:30px;
}
.clsPlainText
{
	/*font-weight: bold;*/
	font-size: 10pt;
	/*color: red!important;*/
	font-family: Arial;	
    line-height:22px;
}

.clsErrMsg {
    font-weight: bold;
    font-size: 10pt;
	color: red!important;
}




.ItemContent {
    padding: 10px 10px 10px 10px;  
    font-size: 10pt;	

}



.ItemCategoryHeader{
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
}


.ItemCategoryHeader a:active {
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;  
}

.ItemCategoryHeader a:before  {
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;  
}

.ItemCategoryHeader a:after  {
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;  
}


.ItemCategoryHeader a:visited  {
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;  
}

.ItemCategoryHeader a:hover  {
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;  
}


.ItemHeader{
    padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
}

.ItemHeader a:active {

 padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;   

    }

.ItemHeader a::before {

 padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;   

    }

.ItemHeader a:hover {

 padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;   

}



.ItemHeader a:after {

 padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;   

}



.ItemHeader a:visited {

 padding-left: 0px;   
    border:none;
    font-size:16pt; 
    font-family: Arial;     
    text-decoration-style:solid;  
	color: #4f4f4f;   
    text-shadow: 2px 2px #e6e6e6;
    margin-top:10px; 
    margin-bottom:15px;
    text-decoration:none;   

}


.ItemTotalUpload{
    margin-top: 10px; 
    margin-bottom: 10px; 
    border:none;
    font-size:12px; 
    font-family: Arial;     
	color: #000000;   
    font-weight:bold;     

}

.ItemDownload {
    margin-top: 10px; 
    margin-bottom: 10px; 
    border:none;
    font-size:12px; 
    font-family: Arial;     
	color: #000000;   
    font-weight:bold;     
    text-align:left;  
    background-image:url("/studentportal/images/download.png");
    background-repeat:no-repeat ;
    padding-left:30px;
    line-height: 25px;    
    vertical-align:middle;  
}


.ItemDownload a:before{
    margin-top: 10px; 
    margin-bottom: 10px; 
    border:none;
    font-size:12px; 
    font-family: Arial;     
	color: #000000;   
    font-weight:bold;     
    text-align:left;  
    background-image:url("/studentportal/images/download.png");
    background-repeat:no-repeat ;
    padding-left:30px;
    line-height: 25px;    
    vertical-align:middle;  
}

.ItemDownload a:after{
    margin-top: 10px; 
    margin-bottom: 10px; 
    border:none;
    font-size:12px; 
    font-family: Arial;     
	color: #000000;   
    font-weight:bold;     
    text-align:left;  
    background-image:url("/studentportal/images/download.png");
    background-repeat:no-repeat ;
    padding-left:30px;
    line-height: 25px;    
    vertical-align:middle;  
}

.ItemDivider{
    margin-top: 20px; 
    margin-bottom: 20px; 
	height: 3px;
    /*border-bottom : 1px solid  #e2e0e0;*/
}



.clsTableCPEnrol
{
    
    margin-left:auto;  
    margin-right:auto;
    width: 100%;
    font-size: 10pt;	
	font-family: Arial;
     
    /*border: 1px;
    border-style:solid; 
    
   border-color: #595959;*/
    
    border-spacing:0px 0px;
    text-align: center;
   height:80px; 
     
}

.clsTableCPHeaderEnrolTD
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #4289A9 ;
    color:white; 
    border-color:#e6e6e6;
    padding: 10px 10px 10px 10px;  
    text-align: center ;
    font-weight:bold; 
}

.clsTableCPEnrolTD
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#e6e6e6;
    padding: 10px 10px 10px 10px;  
     text-align: center ;
}




/*Style for CPStudPortalPosting*/
.clsTableCPStudPortalPosting
{
    border-collapse: collapse;
    width: 100%;
    font-size: 11pt;	
	font-family: Arial;
    border: 1px;
    border-style:solid; 
    border-color: gray;
    padding: 10px 10px 10px 10px;  
    text-align: left;
    background-color:white;
     
}

.clsTableCPStudPortalPosting td
{
    border-collapse: collapse;
    width: 100%;
    font-size: 11pt;	
	font-family: Arial;
    /*border: 1px;
    border-style:solid; 
    border-color: gray;*/
    padding: 10px 10px 10px 10px;  
    text-align: left;
}


.clsCPStudPortalPostingSectionHeader {
    font-size: 13pt;	
	font-family: Arial;
    font-weight:bold;  
    line-height:30px; 
}

.clsCPStudPortalPostingTitle
{
    font-size: 12pt;	
	font-family: Arial;
    font-weight:bold;  

}

.clsCPStudPortalPostingPostDate
{
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
    line-height:30px; 
}

.clsCPStudPortalPostingPostBy
{
    font-size: 10pt;	
	font-family: Arial;
    color: gray;  
    font-style: italic; 
 line-height:30px; 
}
/*End Style for CPStudPortalPosting*/



.clsTableAttnStat
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#888787;
    padding: 10px 10px 10px 10px;  
    text-align: center  ;
    width:100%;
}

.clsTableAttnStatTDHeader
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #4289A9 ;
    border-color:#888787;
    padding: 10px 10px 10px 10px;  
    text-align: center ;
    color:white;
    font-weight:bold;
    height:25px;   
}


.clsTableAttnStatTD
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#e6e6e6;
    padding: 10px 10px 10px 10px;  
    text-align: center ;
    height:30px;
}





.clsTableSupport
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#888787;
    padding: 10px 10px 10px 10px;  
    text-align: center  ;
    width:100%;
    vertical-align:top;
}

.clsTableSupportTDHeader
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #4289A9 ;
    border-color:#888787;
    padding: 10px 10px 10px 10px;  
    text-align: center ;
    color:white;
    font-weight:bold;
    height:25px;   
    vertical-align:top; 
}


.clsTableSupportTD
{
    border-collapse: collapse;
    
    font-size: 10pt;	
	font-family: Arial;
    border: 1px;
    border-style: solid ; 
    background-color: #FFFFFF ;
    border-color:#e6e6e6;
    padding: 10px 10px 10px 10px;  
    text-align: center ;
    height:30px;
    vertical-align:top;
}


.clsAnnounceContent img
{
    max-width: 100%;
    height: auto;
    width: 100%;
}	