﻿
.contentRowBlank
{
    width:93%; 
    min-height:50px; 
     margin:0px;
    display:block; 
    text-align:center;
    padding:0px;
    float:left;    
}

.contentRowBlank h1 h4 
{
    margin:0px;   
    padding: 20px 0px 0px 0px;
}

.contentColumnThreeL,.contentColumnThreeC,.contentColumnThreeR,.contentColumnTwoL,.contentColumnTwoR
{
        display: block;
    float: none;
    width: 100%;
    /* height: 30%; */
    text-align: center;
   
    padding-bottom: 23px;
 }

 

 
.contentColumnL
{
   display: block;
  float: left;
  width: 45%;
  height: 100%;
  border-right: 1px solid #e9e9e9;
  padding-right: 25px;
  padding-left: 0px; 
    
 }
 .contentColumnBarL
{
   display: block;
  float: left;
  width: 40%;
  height: 100%;
  border-right: 1px solid #e9e9e9;
  padding-right: 25px;
  padding-left: 0px; 
    
 }

/* .border-marker
{   
    z-index:100;    
    margin-top:-13px;    
    height:8px;
    width:222px; 
    float:right;
    text-align:right;
    position:fixed;
       
}*/
 .border-marker
{   
	z-index:999;
	float:right;
	line-height:0;
	position:fixed;
	text-align:left;
	top:0;
	
       
}

.border-marker-fullwidth
{   
    z-index:100;    
    margin-top:-13px;    
    height:13px;
    width:100%; 
    float:left;
    text-align:left;
    position:fixed;
    background-color:#0065ae;
}
 
 .attendance-textoverview
 {     
     height:auto;
     }
 .attendance-textoverview h3,h2
    {
        z-index:100;
        margin:0;
        /*green 00a140
                00984e
        blue: 0065ae*/
        color:#00984e;
        margin-top:-87px;
        
        padding-bottom:16px;
        
}
.attendance-textoverview h1{    margin-top:5px; color:#0065ae; font-size:40px;}
.attendance-textoverview sup { font-size:12px;color: #00984e ;}
 .contentColumnTop
{
    display:block;
    text-align: center;
    float:left;
    width:100%;
    height:50%;
    border-bottom: 1px dotted #e9e9e9;   
    
 }

 .contentColumnTop h1
 {    
    padding:30px 0px 30px 0px;
   color:#0065ae;      
    
 }
 .contentColumnBottom
{
    display:block;
    float:left;
    width:100%;
    height:50%;     
          
    
 }
 .contentColumnBottom h1
{
    padding:30px 0px 30px 0px;color:#0065ae; 
    }
    .contentColumnBottom h4
{
    padding:40px 0px 0px 0px;
    }
    
 .contentColumn
{
    display:block;
    float:left;
    width:45%;
    height:100%;
    border-right: 1px dotted #e9e9e9;
 }
 .contentColumn3to1L
{
    width: 67%;
    height: 100%;    
    
    padding: 0px;
    padding-right: 23px;
    display: block;
    float: left;
    border-right: 1px solid #e9e9e9;
 }
 .contentColumn3to1R
{
    width:25.9%; 
    height: 100%; 
    display: block;
    float:left;
    padding-left: 26px;
    border-left: 1px solid #e9e9e9;    
    margin-left:-1px;
 }
 
 .contentColumn1to3L
{
    display: block;
    float: none;
    width: 100%;
    /* height: 30%; */
    text-align: center;
    border-right: 1px solid #e9e9e9;
    padding-bottom: 23px;
 }
 .contentColumn1to3R
{
    display: block;
    float: none;
    width: 100%;
    /* height: 30%; */
    text-align: center;
    border-right: 1px solid #e9e9e9;
    padding-bottom: 23px;    
 } 
 
.contentColumnR
{
    display: block;
  float: left;
  margin-left: -1px;
  margin-right: -26px;
  padding-left: 27px;
  border-left: 1px solid #e9e9e9;
  width: 48%;
  height: 100%;
  padding-right: 0px;   
    
}
.contentColumnBarR
{
    display: block;
  float: left;
  margin-left: -1px;
  margin-right: -26px;
  padding-left: 27px;
  border-left: 1px solid #e9e9e9;
  width: 40%;
  height: 100%;
  padding-right: 0px;   
    
}
.contentColumnL h1, .contentColumnBarL h1, .contentColumn1to3L h1, .contentColumn3to1L h1
{
    margin:0px; /*padding:30px 0px 30px 0px; */color:#0065ae; 
    
}
.contentColumnR h4, contentColumnBarR h4, .contentColumn1to3L h4, .contentColumn3to1L h4
{
    margin:0px; 
    
}



/********************
*   Tablet Styles   *
********************/


@media only screen and (max-width: 1140px) 
{
    
      .border-marker{
        margin-left: -22px;        
        width: 200px;
        }
    
 /* page content */
   .contentRowLevel1,.contentRowLevel2,.contentRowLevel3, .contentRowLevel4
   {
        padding: 20px;
        margin: 0 -20px;
       
       }
       .contentColumnL
       {
           height:100%;
           width:43%;
           padding-right:20px;
           }
           
       
 
       .contentColumnR
       {
           overflow:visible;
           padding-left:20px;
           margin-right:0px;
             padding-right:0px;
             width:43%;
             
             
           }
           

 .contentColumn3to1L
{
   
   padding-right: 15px;
}
.contentColumn3to1R
{
   width:26.4%;
   padding-left: 15px;
}
.contentColumn1to3L
{
      
     padding-right:15px;
   
 }
 .contentColumn1to3R
{
      
    padding-left: 15px; 
    
 }
}
   /********************
*   Mobile Styles   *
********************/


@media only screen and (max-width: 718px) 
{
    .border-marker{
        margin-left: -5px;        
        width: 200px;
        }
        
        .contentColumn3to1R {
        width: 25.6%;
        }

 /* page content */
 
     
    
   .contentRowLevel1,.contentRowLevel2,.contentRowLevel3, .contentRowLevel4
   {
        padding: 20px;
        margin: 0 -20px;
       
       }

 
       
       
 .contentColumnL{
    float: left;
    width: 100%;
    height: 100%;
    border-right:none;
    border-bottom: 1px solid #e9e9e9;
    padding-right: 0px;
    padding-bottom: 15px;
    padding-left: 0px;
}

.contentColumnR{
    float: left;
    width: 100%;
    height: 100%;
    border-left:none;
    
    padding-right: 0px;
    padding-top: 15px;
    padding-left: 0px;
    margin-top:-1px;
}

    .contentColumnThreeL,.contentColumnThreeC, .contentColumnThreeR {
    display: block;
    float: left;
    width: 33%;
    }
    
    


    .contentColumn1to3R {
    display: block;
    float: left;
    width: 65%;
    margin-left: -1px;

    }
     
 
       
 
       
 .contentColumn3to1L
{
   
   padding-right: 15px;}
   
 }
   
   
   /********************
*   Mobile Styles vertical mode  *
********************/


@media only screen and (max-width: 480px) {
.contentColumn3to1L{  
     width: 100%;   
     border-right: none;
   }
   
  .contentRowLevel1,.contentRowLevel2,.contentRowLevel3, .contentRowLevel4
   {
        padding: 20px;
        margin: 0 -20px;
   }
   
   .contentColumn3to1R
   {
       border-left:none;
       border-top:1px solid #e9e9e9;
       padding-top: 15px;
       padding-left:0px;
       width: 100%;
       
    }
       
    .contentColumn1to3L {        width: 100%;
                                 border-right:none;
                                 
        }
        
    .contentColumn1to3R {    border-left:none;
       border-top:1px solid #e9e9e9;
       padding-top: 15px;
       padding-left:0px;
       width: 100%;
    }
    
     
       
       contentColumnThreeL
       {
           width:100%;
           }
       
       
   
   
   
   
 }
   