/* vim: set shiftwidth=4 */
/*
    CSS screen media for Leo Dumon
    Copyright Mathijs Dumon - 2010-2011
*/


/*
    DEFAULTS:
*/

    *                   {   margin: 0px;
                            padding: 0px;
                            border: 0px;
                            font-family: Verdana, Arial, sans-serif;
                            font-size: 13px;
                            text-align: justify;
                            font-weight: 400 }
            
    html, body          {   height: 100%; }
    
    ul                  {   list-style-type: none; }
    
    a                   {   text-decoration: none;
                            color: #500;
                            font-weight: 700; }
                            
    a:hover             {   text-decoration: underline; }
    a:active            {   color: #900 }
    
    strong, b           {   font-weight: 700 }
    em                  {   color: #A00 }
    
    
    .f_left             {   float: left }
    .f_right            {   float: right }
    .c_left             {   clear: left }
    .c_right            {   clear: right }
    .c_both             {   clear: both }
    
    .evn                {   background-color: #EED; }
    .odd                {   background-color: #f6f9ee; }
    
/*
    BASE LAYOUT:
*/

    body            {   background: #EEE none; } 

	#bambu          {   z-index: 0;
	                    position: absolute;
	                    top: 0px;
	                    left: 0px;
	                    display: block;
	                    height: 590px;
	                    width: 358px;	                    
	                    background: transparent url('home_back_fade.png') no-repeat left top;
	                    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader; }

    div.header      {   background: transparent url('leo_dumon_small.png') no-repeat 3% 75px;
                        width: auto;
                        height: 150px }
     
     div.wrapper    {   position: relative;
                        display: block;
                        margin: 0 auto;
                        width: 75%;
                        min-width: 800px; }
          
    
                        
    div.header h1      {   display: none }

    div.column_mask {   display: block;
                        clear: both;
                        width: 100%;
                        min-width: 800px; }

            .right_col, .left_col 
                        {   float: left; }

            .right_col  {   width: 73%;
                            min-width: 600px }   
                      
            .left_col   {   display: block;
                            background: transparent none;
                            width: 25%;
                            min-width: 200px }
             #content   {   display: block;
                            position: relative;
                            padding: 0 0 0 1.5em }
        
        .footer         {   background: transparent none;
                            display: block;
                            clear: both;
                            width: 100%;
                            height: 2.5em; }
                        
                     
/* 
    MENU LAYOUT:              
*/
   
        #menu       {   background: transparent none;
                        display: block; }

        #menu li    {   display: block;
                        margin: 0 0 0.5em 1em   }
        
        #menu li ul {   margin-top: 0.5em }

        #menu li a          {   background: #FFF none;
                                border: solid 1px #800;
                                text-decoration: none;
                                display: block;
                                background: transparent url('nav_gradient.gif') repeat-x left bottom;
                                width: 100%;
                                text-align: center;
                                padding: 0.15em 0 }
                         
        #menu li a:hover        {   color: #900;
                                    text-decoration: none }
        #menu li a:active       {   color: #C00 }
        
        #menu li.selected       {   background: #EFD url('nav_gradient_active.gif') repeat-x left bottom;
                                      }
                                    
        #menu li.selected a     {   background: transparent url('nav_indent.gif') no-repeat left center;
                                    border-left: solid 0px transparent; }
    
/*
    CONTENT LAYOUT:
*/

        #content h2 {   font-size: 1.3em;
                        color: #8b0000;
                        margin: 0 0 1em 0 }
                            
        #content h3 {   font-size: 1em;
                        font-weight: bold;
                        color: #000;
                        margin: 0 0 0.2em 0.5em }
                        
        #content p  {   margin: 0 0 1em 1em }
        
        #content ul {   margin: 0 1em 1em 1.5em; }
                        
        #content li {   background: transparent url('icons/list_bullet.gif') no-repeat left 4px;
                        padding-left: 15px; }
     
        #content .fixed_width
                    {   float: left;
                        display: block;
                        width: 10em;
                        clear: left }               
                        
/*
    FORM LAYOUT:
*/
        #content form           {   border-left: solid 1px #DCC;
                                    padding-left: 2em;
                                    margin-bottom: 1em }

        #content form div       {   margin: 0 0 1em 0;
                                    clear: left; }
       
        #content form label     {   display: block;
                                    float: left;
                                    width: 11em }
        #content form input     {   background-color: #FEFEFE;
                                    display: block;
                                    width: 10em }
                                        
        #content form #str_inline input {   display: inline }
        #content form #str_inline label {   display: inline;
                                            width: auto;
                                            float: none }

        #content form img.captcha       {   float: left;
                                            clear: right;
                                            margin-left: 2em }
                     
        #content form input.captcha     {   float: left }
                                    
        #content form input.text        {   border: solid 1px;
                                            border-color: #CAA #CAA #C77 #C77 }

        #content form input.short       {   width: 4em; }
        #content form input.long        {   width: 16em; }
                                        
        #content form input.button      {   clear: left;
                                            color: #800;
                                            font-weight: bolder;
                                            padding: 0.1em;
                                            text-align: center;
                                            cursor: pointer;
                                            background-color: #FFF;
                                            border: solid 1px;
                                            border-color: #CAA #CAA #C77 #C77 }
                                        
        #content form textarea          {   border: solid 1px;
                                            border-color: #CAA #CAA #C77 #C77 }                                        

        #content form p.errors          {   font-style: italic }
        #content form .errors input, #content form .errors textarea
                                        {   background-color: #FF6666 }
        #content form .errors           {   color: #A33; }
        #content form p.errors, #content form .errors label, #content form .required label
                                        {   font-weight: bolder }
                        
        
/*
    BEGELEIDER LIST LAYOUT:
*/
        #content .begeleider    {   background-color: #EED;
                                    display: block;
                                    width: 100%;
                                    border-top: solid 1px #500;
                                    border-bottom: solid 1px #500;
                                    margin-bottom: 2em; }
        #content .avatar        {   margin: 1em;
                                    width: 33%;
                                    border: solid 1px #500 }
                                    
        #content .begeleider h3 {   margin: 1em 0 0.5em 0.5em }
        
        #content .begeleider dl, #content .begeleider p
                                {   padding: 0 2em 1em 1em }
        
        #content .begeleider dt {   font-weight: bold;
                                    display: block;
                                    width: 10em }
    
/*
    AGENDA LAYOUT:
*/
    
    #content table.agenda       {   width: 100%;
                                    border-top: solid 1px #500;
                                    border-bottom: solid 1px #500;
                                    padding: 0.2em 0.5em;
                                    text-align: center;
                                    border-collapse: collapse; }
    
    #content .agenda tr.header  {   background-color: #bfdd81; }
    
    #content .agenda tr         {   position: relative;
                                    left: 0 }
    
    #content .agenda .header th {   font-weight: bolder;
                                    color:  #800;
                                    padding: 0.5em }
                                    
    #content .agenda .date, #content .agenda .lctn
                                {   position: absolute;
                                    display: block;
                                    text-align: right;
                                    padding: 0.5em;
                                    right: 0;
                                    width: 30%;
                                    font-weight: bold }
    #content .agenda .lctn      {   width: 30%;
                                    right: 30% }
                                    
    #content .agenda .header th.info, #content .agenda .info
                                {   width: 100%;
                                    float: left;
                                    border-bottom: solid 1px #500; }
                                    
    #content .agenda .header th.info
                                {   padding: 0.5em 0 }
    #content .agenda .indent    {   padding: 0 2em 0 1em }

    #content .agenda .e_date *, #content .agenda .e_lctn *
                                {   text-align: right }
    #content .agenda .e_lctn a  {   float: right; }

    #content .agenda .e_date, #content .agenda .e_lctn
                                {   padding-bottom: 0.5em;
                                    width: 14.5em;
                                    text-align: right }
                                    
    #content .agenda .expander  {   cursor: pointer;
                                    margin-bottom: 0;
                                    padding: 0.3em 0;
                                    z-index: 300  }
    #content .agenda .expand    {   margin-top: 0.5em }
    #content .agenda td.empty_agenda    {   text-align: center;
                                            padding: 1em;
                                            font-weight: bold }
    
                 
/*
    FOOTER LAYOUT:
*/
    div.footer          {   z-index: 30 }
    div.footer_right, div.footer_left
                        {   position: relative;
                            display: inline;
                            padding: 0.5em 1em }
    div.footer_right    {   float: right }
    div.footer_left     {   z-index: 30;
                            float: left }                
                        
    div.disclaimer_popup    {   float: left;
                                position: relative; }
        div.disclaimer      {   display: none;
                                background: #FFF;
                                border: solid 1px #500;
                                position: absolute;
                                top: -23em;
                                left: 5em;
                                padding: 1em;
                                height: 20em;
                                width: 35em;
                                overflow: scroll;
                                overflow-x: hidden; }
        div.disclaimer h2   {   padding: 0.5em 0 }                     
        div.disclaimer p    {   padding: 0 1em }
        
        div.disclaimer a.close  {   margin: -0.75em 0 0 -0.75em;
                                    position: relative;
                                    top: -1em }
    
    
    
    .coded_by       {   font-size: 60% }
    .a_dusti       {    background: transparent url('sm_dusti.png') no-repeat 0 0;
                        display: block;
                        width: 40px;
                        height: 23px;
                        float: left;
                        margin-right: 5px }
    
    

