﻿/*---------------------------------------------
SINGLE COLUMN LAYOUT FOR CLEARBREEZEDESIGN.COM
---------------------------------------------*/


body 
{
    background-color: #ffffff;
    color: #333333
}



h1  
{
    margin-bottom: 30px;
    padding-bottom: 0;
    margin-top: 20px;
    font-weight: normal
}

/* home page h2 */

div#wholepage div#sitethemes h2, div#wholepage div#articles h2  
{
    font-weight: bold;
    color: #333333
}


h2  
{
    margin-bottom: 0;
    padding-bottom: 0;
    margin-top: 0;
    font-weight: normal;
    color: #b5b4b4
}

h2.midtext  
{
    margin-top: 30px;
    margin-bottom: 10px;
}

h3  
{
    color: #999999
}

p.first 
{
    margin-top: 0;
    padding-top: 0
}

em.home 
{
    font-style: normal;
    font-weight: bold;
}

a   
{
    text-decoration: none
}



/* page layout */

div#wholepage   
{
    margin-right: 20px;
    margin-left: 20px;
}



/* topbanner */

div#wholepage div#topbanner 
{
    background-position: top left;
    background-repeat: no-repeat;
    background-image: url('../images/logo.gif');
    height: 250px;
}


/* accessibility help link */

div#wholepage div#topbanner p#accesshelp    
{
    
}

    div#wholepage div#topbanner p#accesshelp a  
    {
        color: #999999;
        text-decoration: none;
        border-bottom: 1px dashed #cccccc
    }


/* top level menu */

div#wholepage div#topbanner ul  
{
    list-style: none;
    background-image: none;
    margin-top: 80px;
}

    div#wholepage div#topbanner ul li   
    {
        background-position: top right;
        background-repeat: no-repeat;
        padding-bottom: 10px;
        padding-right: 15px;
        padding-top: 2px;
    }
    
    div#wholepage div#topbanner ul li#last  
    {
        background-image: none
    }
    
    div#wholepage div#topbanner ul li#selected a  
    {
        color: #ffffff
    }
    
        div#wholepage div#topbanner ul li a 
        {
            color: #333333;
            text-decoration: none;
            border-bottom: 0
        }
        
        div#wholepage div#topbanner ul li a:hover   
        {
            border-bottom: 1px dashed #333333
        }



/* main content */  

div#wholepage div#maininfo  
{
}

    div#wholepage div#maininfo ul   
    {
        margin-left: 10px;
        padding-left: 10px;
    }

    /* articles list */
    
    div#wholepage div#maininfo ul.articles    
    {
        margin-left: 10px;
        padding-left: 10px
    }

        div#wholepage div#maininfo ul.articles li 
        {
            padding-bottom: 5px;
        }
        
            div#wholepage div#maininfo ul.articles li a 
            {
                text-decoration: none;
            }
            
/* code */

.code
{
	background-color:InfoBackground;
	font-family:Courier New, Monospace;
	margin-top: 20px
}

    .full   
    {
        
    }

.code p
    {
	    margin-top: 0;
	    margin-bottom: 0
    }
    
    .code span.blue   
    {
        color: blue
    }
    
    .code span.green  
    {
        color: #2b91af
    }
    
    .code span.comment    
    {
        color: green
    }
    
    .code span.red  
    {
        color: red
    }
    
    .code span.maroon  
    {
        color: #a31515
    }


/*---------------------------
PORTFOLIO 
---------------------------*/

div#wholepage div#maininfo div.thumbnail  
{
    margin-top: 10px;
}

    div#wholepage div#maininfo div.thumbnail img  
    {
        
    }
    
    div#wholepage div#maininfo div.thumbnail img.noborder  
    {
        border: none
    }

div#wholepage div#maininfo div.caption    
{
    border-top: 1px solid #cccccc;
    padding-left: 5px;
    padding-bottom: 5px;
    padding-top: 3px;
    padding-right: 5px;
    margin-top: 40px;
}

    div#wholepage div#maininfo div.caption h2 
    {
        margin-top: 3px;
        margin-bottom: 0;
        padding-bottom: 3px;
        border-bottom: 2px solid #ffffff;
        color: #666666
    }
    
    div#wholepage div#maininfo div.caption p  
    {
        margin-top: 3px;
        margin-bottom: 5px;
        padding-bottom: 3px;
    }
    
    div#wholepage div#maininfo div.caption a  
    {
        padding-right: 17px;
        text-decoration: none;
        background-position: right;
        background-repeat: no-repeat
    }
    
    div#wholepage div#maininfo div.caption a:hover    
    {
        
    }
    

div#wholepage div#maininfo p.portdesc 
{
    margin-top: 0;
    padding-top: 0;
    margin-top: 10px;
    margin-bottom: 30px
} 


/*---------------------------
TABLE ON ACCESS KEYS PAGE 
---------------------------*/

table tr th 
{
   text-align: left;
   border-bottom: 2px solid #999999;
   padding-top: 2px;
   padding-bottom: 2px;
   padding-right: 10px;
}

table tr td 
{
    border-bottom: 1px solid #999999;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-right: 10px;
}

table   
{
    margin-bottom: 20px;
    margin-top: 10px;
}


/*---------------------------
GAMES GRAPHICS PAGE    
---------------------------*/

div#wholepage div#maininfo ul.gameslist   
{
    list-style: none;
    margin-left: 0;
    padding-left: 0
}

    div#wholepage div#maininfo ul.gameslist li 
    {
        padding-right: 15px;
        padding-bottom: 12px
    }
    
        div#wholepage div#maininfo ul.gameslist li a  
        {
            text-decoration: none;
            border-bottom: 0
        }
        
        div#wholepage div#maininfo ul.gameslist li a img 
        {
            border: 1px solid #a6a6a6
        }





/* article list home page */

div#wholepage div#articles  
{
    
}

    div#wholepage div#articles ul   
    {
        list-style: none;
        margin-bottom: 30px;
    }
    
        div#wholepage div#articles ul li  
        {
            padding-bottom: 6px;
            background-position: bottom left;
            background-repeat: no-repeat
        }
        
            div#wholepage div#articles ul li a    {
                text-decoration: none;
                border-bottom: 0
            }
            
            div#wholepage div#articles ul li a:hover    
            {
                color: #000000
            }
            
    div#wholepage div#articles h2   
    {
        background-position: top left;
        background-repeat: no-repeat;
        padding-bottom: 14px;
    }
    
    div#wholepage div#articles h2#twitter   
    {
        background-position: top left;
        background-repeat: no-repeat;
        padding-bottom: 16px;
        margin-top: 20px;
    }
    
    div#wholepage div#articles div#twitter_div  
    {
        background-image: none;
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 5px;
        border-bottom: 1px solid #d5eeca;
        border-left: 1px solid #d5eeca;
        border-right: 1px solid #d5eeca;
        margin-top: 0;
        margin-bottom: 0
    }
    
        div#wholepage div#articles div#twitter_div a    
        {
            border-bottom: 0
        }
        
        div#wholepage div#articles div#twitter_div ul   
        {
            margin-bottom: 0;
            padding-bottom: 0
        }
    
            div#wholepage div#articles div#twitter_div ul li  
            {
                background-image: none
            }
    
    
    
    
/* callouts */
    
div#wholepage div#callouts  
{
    margin-top: 57px;
    padding-top: 0;
    padding-right: 10px;
}

    div#wholepage div#callouts p    
    {
        font-style: italic;
        color: #666666;
        margin-top: 0;
        border-left: 1px dotted #cccccc;
        padding-left: 5px;
    }


/* portfolio navigation */

div#wholepage div#portnav  
{
    width: 220px;
    padding-top: 0;
    padding-right: 10px;
    border-top: 1px solid white;

}


/* site themes home page */

div#wholepage div#sitethemes    
{
    background-position: top left;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}

    div#wholepage div#sitethemes ul 
    {
        list-style: none
    }
    
        div#wholepage div#sitethemes ul li  
        {
            background-image: url('../images/themelistbg.gif');
            background-position: bottom left;
            background-repeat: no-repeat;
            padding-bottom: 2px;
        }
        
            div#wholepage div#sitethemes ul li#summertheme a  
            {
                background-image: url('../images/themelist_summer.gif');
            }
            
            div#wholepage div#sitethemes ul li#autumntheme a 
            {
                background-image: url('../images/themelist_autumn.gif');
            }
            
            div#wholepage div#sitethemes ul li#standardtheme a  
            {
                background-image: url('../images/themelist_standard.gif');
                padding-top: 8px;
                padding-bottom: 12px;
            }
            
            div#wholepage div#sitethemes ul li#singlecoltheme a  
            {
                background-image: url('../images/themelist_singlecol.gif');
                padding-top: 8px;
                padding-bottom: 12px;
            }
        
            div#wholepage div#sitethemes ul li a    
            {
                text-decoration: none;
                display: block;
                background-position: left;
                background-repeat: no-repeat;
                padding-top: 10px;
                padding-bottom: 10px;
                padding-left: 50px;
                border-bottom: 0
            }
            
    div#wholepage div#sitethemes h2    
    {
        background-position: top left;
        background-repeat: no-repeat;
        padding-bottom: 14px;
    }
    div#wholepage div#sitethemes p  
    {
        margin-top: 0;
        margin-bottom: 0
    }
    


/* latest work */

div#latestworkcontainer 
{
    background-position: top left;
    background-repeat: no-repeat;
    margin-left: 20px;
    margin-top: 30px;
    border-top: 1px solid #ffffff;
}

    div#latestworkcontainer h2  
    {
        margin-bottom: -30px;
        padding-bottom: 0;
        margin-top: 10px;
        font-weight: normal;
    }

    div#latestworkcontainer div#latestwork  
    {
        
    }
    
        div#latestworkcontainer div#latestwork ul   
        {
            list-style: none;
            margin-top: 0;
            padding-top: 50px;
        }
        
            div#latestworkcontainer div#latestwork ul li    
            {
                padding-right: 10px;
                vertical-align: top;
                margin-bottom: 20px;
            }
            
                div#latestworkcontainer div#latestwork ul li a  
                {
                    border-bottom: 0
                }
            
            
/* article list on subsequent pages */

div#wholepage div#submenu    
{
    margin-top: 54px;
}

    div#wholepage div#submenu ul    
    {
        list-style: none;
        margin-left: 0;
        padding-left: 0
    }
    
        div#wholepage div#submenu ul li 
        {
            background-position: bottom left;
            background-repeat: no-repeat;
            padding-left: 10px;
            padding-bottom: 5px;
            padding-top: 3px
        }
        
            div#wholepage div#submenu ul li a   
            {
                text-decoration: none;
                padding-right: 10px;
                border-bottom: 0
            }



/* footer */

div#footer  
{
    padding-top: 10px;
    padding-bottom: 20px;
    background-image: url('../images/footerbg.gif');
    background-position: top left;
    background-repeat: no-repeat;
    padding-top: 40px;
    margin-top: 20px;
    margin-left: 20px;
}