@charset "utf-8";  
/*
==============================================
* Filename: styles.css
* Version: 1.0.0 (2009-08-14) YYYY-MM-DD
* Website: http://flowfoundation/
* Author: Umut Ahmet
* Description: Main site styles.

============================================== 
== STRUCTURE: ================================
* Page width: 960 px
* Number of columns: 1/2

==============================================
== INDEX: ====================================
_colours
_defaults
_globals

_frame : Site Frame
_header : Site Header
_content : Site Content
_footer : Site Footer

==============================================
== _colours: =================================

* Black - #050505
* Silver - #DADADA
* Off White - #F9F9F9
* Light Grey - #F5F5F5   
* Green - #418950
* Yellow - #FEB100
* Blue - #00457c
============================================== 
== _defaults: ==============================*/

*, html { 
    margin: 0; 
    padding: 0;
    }
    body {
        /*font: font-style (italic/normal) font-variant (small-caps) font-weight font-size/line-height font-family; */
        font: normal 12px/18px Helvetica, Verdana, Tahoma;
        color: #050505;   
        text-align: center; 
        background: white;
        }
        h1, h2, h3, h4, h5, h6 {
            font: normal 12px/18px Helvetica, Verdana, Tahoma;
            color: #050505;
        }
        h1 { display: none; }
        h2 { font-size: 26px; line-height: 29px; margin-bottom: 29px; font-weight: bold; }
        h3 { font-size: 22px; line-height: 25px; margin-bottom: 22px; }
        h4 { font-size: 16px; line-height: 21px; margin-bottom: 18px; font-weight: normal; font-family: Myriad Pro, Helvetica ;}
        h5 { font-size: 14px; line-height: 18px; margin-bottom: 14px; }
        h4 a { text-decoration: none; font-family: Myriad Pro, Helvetica ; } 
        a {
            color: #00457C; 
            text-decoration: underline;      
            -moz-outline-style: none;
            }
            a:hover {
                text-decoration: none; 
            }
        p { 
            margin-bottom: 18px; 
            text-align: justify;
        }
        img { 
            border: none; 
        }
        
        input, textarea {
            font: normal 14px "lucida grande", Tahoma, Verdana, Arial, sans-serif; 
            padding: 2px;
            }
            input#signup_sb, input#refer_sb{
                cursor: pointer;
            }
        .default_frm {
            margin-top: 20px;
            }
            .default_frm ul {
                padding: 0;
            } 
            .default_frm label { 
                display: block; 
                float: left; 
                width: 7em;      
                margin-right: 1em;
            }
            .default_frm textarea {
                font: normal 12px/18px "lucida grande", Tahoma, Verdana, Arial, sans-serif; 
                padding: 2px; 
                width: 380px;
                height: 100px; 
            }
            .default_frm .su_right {
                display: block;
                float: left;
                width: 380px;
            }
            .default_frm li {
                list-style: none;
                margin-bottom: 10px;
            }
            .default_frm li.split {
                margin-bottom: 30px;
            }
                                                                                                    
/*
============================================
== _globals: ===============================
*/ 
.wrapper {
    width: 960px;
    margin: 0 auto;
    text-align: left;
}
.inner { 
    padding: 10px;
}
.clr_fix { 
    display: block; 
    clear: both;
}
.center {
    text-align: center;
}
.small {
    font-size: 10px;
}
.wrap {
    margin-bottom: 2em;
}
.bt { 
    padding-top: .5em; margin-top: .5em; border-top: 1px solid #DADADA; 
}
.bb { 
    padding-bottom: .5em; margin-bottom: .5em; border-bottom: 1px solid #DADADA; 
}
.loader_sml {
    height: 30px;
    line-height: 30px; 
    background: url(../assets/loader_sml.gif) center left no-repeat;
}

#nav li a {
    -webkit-border-radius: 2px;  
    -moz-border-radius: 2px;  
    -khtml-border-radius: 2px;  
    border-radius: 2px;
} 

.left { float: left; }
.right { float: right; }
/*
==========================================
== _header: ==============================
*/
#header {
    height: 140px; 
    }
    #flow_link {                
        position: relative;
        top: 0;
        left: 0;                
        }
        #flow_link a {
            background: url(../assets/ff_logo.gif) left top no-repeat; 
            height: 125px; 
            width: 225px; 
            float: left;
        }
    #nav {
        height: 25px;
        float: right;
        margin-top: 100px;
        list-style: none;
        font: bold 14px Arial, Helvetica, Verdana, Tahoma;                           
        }
        #nav li { 
            float: left;
            margin-left: 25px;
        }
        #nav li a {
            height: 25px;
            text-decoration: none;
            color: #315b7d;
            display: inline-block;
            line-height: 25px;
            padding: 0 8px;
            }
            #nav li a:hover, #nav li a:active {
                color: white;
                background: #00447c;
            }
            #nav li a.nav_on {
                color: white; 
                background: #00447c;
            }

    #page_head {
        background: #FFDD00;
        }
        .ph_home { height: 200px; }
        .ph_sub { height: 150px; } 
        
        #page_head h2 {
            margin-bottom: 10px;
        }

    #ph_home_left, #ph_sub_left {
        float: left;
        width: 385px;
        }
        #ph_home_left_inner {
            padding-top: 30px;
            }     
            #ph_home_left p {
                font: bold 14px/24px Arial, Helvetica, Verdana, Tahoma; 
            }
        #ph_sub_left_inner {
            padding-top: 50px;
        }
        #ph_sub_left_inner_stm {
            padding-top: 10px;
        }
        #ph_sub_left p {
            font: bold 12px/18px Arial, Helvetica, Verdana, Tahoma; 
        }
    #ph_img {
        position: relative;
        float: right;
        width: 570px;
        }  
        #ph_img img {
            position: absolute;
            top: 0;
        }

/*  
==========================================
== _content: =============================
*/
#content {
    margin: 30px 0;
    position: relative;
    }
    
    #content ul {
        list-style: disc;
    }
    #content ul, #content ol {
        padding: 5px 20px;
        margin-bottom: 18px;
    } 
    #content ul li ul, #content ol li ol {
        margin-bottom: 0;
        list-style: circle;
    } 
    
    #admin_bar {
        font-size: 11px;                  
        padding-bottom: 10px;
        border-bottom: 1px solid #dadada;
        width: 960px;
	    margin: 15px auto;
	    text-align: left;
	    position: relative;
        }
        #admin_bar ul {
            float: right;       
            list-style: none; 
            }
            #admin_bar li {                                                        
                float: left; 
                display: inline-block;
            }
            #admin_bar li.seperator {
                margin: 0 10px;    
            }
            
    #alpha {
        float: left;
        width: 260px;
        }
        #alpha ul {
            margin: 10px 0 25px 0;
            padding: 0;
        }
        .subnav_bg {
            background: url(../assets/subnav_bg.gif) top left repeat-y; 
        }
        #subnav li {
            height: 43px;
            list-style: none;
        }
        #subnav li.on {
            background: url(../assets/subnav_on.gif) top left no-repeat;                    
            }
            #subnav li.on a {
                color: white;
            }
            #subnav li.on a:hover {
                text-decoration: none;
            }
        #subnav li a {
            color: black;
            font-size: 16px;
            text-decoration: none;
            display: block;
            padding: 10px;
            }
            #subnav li a:hover {
                text-decoration: underline;                          
            }
        
    #alpha_home {
        float: left;
        width: 440px;
        padding-right: 40px;
        border-right: 1px solid #dadada;
        }
        #alpha_home p#intro {
            font: normal 16px/24px Arial, Helvetica, Verdana, Tahoma;      
        } 
    #beta {
        float: right;
        width: 700px;
    }
    #beta_home {
        float: right;
        width: 420px;
        }
    	.home_news {
    		border: 0px solid #dadada; 
    		}
            .tw_body {
                height: 255px;
                background: url(../assets/front/home_beta.gif) left bottom no-repeat;    
                padding: 0 5px;
                }
                .tw_head {
                	background: #00457c;
                    color: white;
                    height: 30px;
                    font-size: 1.2em; 
                    line-height: 1.2em; 
                    font-family: Myriad Pro, Helvetica ;
                }
                .tw_head a {
                    color: white;
                    display: inline-block;
                    width: 200px; 
                    height: 30px; 
                    line-height: 30px; 
                    padding: 0 10px;
                    text-decoration: none;
                }
                .tw_item {
                    padding: 5px 10px;
                    border: 1px solid #dadada;
                    }
                    .tw_item_head {
                        font-weight: bold;
                    }
                    .tw_item_copy {
                        
                    }
                    .tw_seperator {
                        border-bottom: 0px solid #DADADA;
                    }
    .updates {
    		margin: 0 0 10px 0;
    		border-bottom: 1px solid #DADADA;
    	} 
    	.updates h3 a { color: #00457c; }
    	
    .copy_img {
        float: right;
        width: auto;
        height: auto;
        margin: 10px 10px 0 25px;
        }
        .globe {
            height: 150px;
        }
    #get_involved_btn { 
        width: 116px;
        height: 31px;
        background: url(../assets/get_involved.gif) top left no-repeat;
        text-decoration: none;
        display: block;
        }
        #get_involved_btn span {
            visibility: hidden;
        }
    #members_gallery {
        padding-top: 10px;
        border: 1px solid #dadada;       
        border-bottom-width: 0px;
        }
    #members_list {
        margin-bottom: 20px;
            border: 1px solid #dadada;       
            border-top-width: 0px;
        }
        #members_list p {
            margin-bottom: 5px;
        }
        .bio {       
            visibility: hidden;                     
        }
    #flow_form_wrapper {
        margin-top: 40px;
        }
        #flow_form_right, #flow_gallery {
            float: right;
            width: 48%;
            padding-left: 1%;
            border-left: 1px solid #dadada;
            }
            #flow_vid {
                margin-bottom: 20px;
            }
        #flow_form_left, #our_plan {
            float: left;
            width: 48%;
            }
            #flow_gallery ul, #flow_form ul {
                padding: 0;
            } 
            .response_status {
                margin-top: 10px;
                }
                .response_status p {
                    margin: 0;
                    font-size: 14px;
                    font-weight: bold;
                }
                .notice { 
                    height: 40px; 
                    line-height: 30px; 
                    padding-left: 35px;
                    background-color: white;
                    color: #666666; 
                    }
                    .n_good { background: transparent url(../assets/accepted.gif) no-repeat 5px 50%; }
                    .n_bad { background: transparent url(../assets/warning.gif) no-repeat 5px 50%; } 
        #signup_frm {
            border-bottom: 1px solid #dadada;
            margin-bottom: 10px;
        }
	.blue_button {
	    background: #00457c;
	    border: 1px solid #00457c;
	    text-decoration: none;
	    padding: 3px 10px;    
	    color: white;
	    font-weight: normal;
	    line-height: 25px;
		font-family: Myriad Pro, Helvetica ;
	    }
	    .but2:hover  { 
	        background-color: white;
	        color: #00457c;
	        border-color: #00457c;
	        }
        
/*
==========================================
== _accordion (mootools): ================
*/
	
	#accordion {
		margin: 20px 0px;
		height: auto; 
		}	
		div.toggler {
			cursor: pointer;
			border: 1px solid #dadada;
			border-right-color: #ccc;
			border-bottom-color: #ccc;
			/* background: #D2E0E6; */
			margin: 0 0 4px 0;
			padding: 5px;
		}
		
		div.toggler_text {
			width: 60%;

		}
		
		div.toggler_logo {
			float: right;
			padding: 5px;
		}
		
		div.element p, div.element h4 {
			margin: 0;
			padding: 4px;
		}
		
		blockquote {
			padding:5px 20px;
		}

		.directory_subtext { 
			border: 1px solid #dadada;
			margin-top: 5px;
			cursor: pointer;
			padding: 10px;
			}
			.directory_subtext li {
				list-style: none;
			}
			.vertical_status { float: right; }

/*
==========================================
== _footer: ==============================
*/
#footer {
    clear: both;
    display: block;
    color: #666;
    font-size: 10px;
    border-top: 1px solid #dadada;  
    padding-top: 10px;
    }
    #footer_left {
        width: 300px;
        float: left;
    }
    #footer_right {
        width: 600px;
        float: right;
    }
    #footer_right p {
        text-align: right;
    }
