/* 
 * !UP DESIGN GLOBAL CSS STYLES
 */


/**********************************************
 * BASIC PAGE ELEMENTS
 **********************************************/
*
{
	margin: 0;
	padding: 0;
	font-family: Arial, Verdana, sans-serif;
}

#default_body
{
	background-color: #006633;
	text-align: center;
	margin: 0 auto;
}

a, a:link, a:visited
{
	color: #006635;
    outline: none;
}

a:hover, a:active
{
	color: #00994F;
    outline: none;
}

h2
{
    color: #00994F;
    font-size: 18px;
    margin-bottom: 10px;
    border-bottom: 1px dotted #8ECF97;
}

h2 div
{
    float: right;
    font-size: 9pt;
    font-weight: normal;
    margin-top: 5px;
}

p
{
	padding-bottom: 10px;
}

img
{
    border: 0;
}


.intro_p
{
	color: #333333;
	font-weight: bold;
}

.quote
{
	font-family: Georgia, Times New Roman, serif;
	font-size: 11pt;
	color: #666666;
	margin-bottom: 10px;
}

.quote_author
{
	font-family: Georgia, Times New Roman, serif;
	color: #666666;
	text-align: right;
	padding: 3px;
	font-style: italic;
	font-size: 10pt;
}

/**********************************************
 * HELPER CLASSES
 **********************************************/

.clear                      { clear: both; }
.align-bottom               { vertical-align: bottom; }
.req                        { color: red; }
.small-text                 { font-size: 8pt; }
.italic-text                { font-style: italic; }
.unbold                     { font-weight: normal; }
.input_field .input-error   { background-color: #FFE5E5; }
.input_field input.datepick { width: 75px; }

/**********************************************
 * FORM ELEMENTS
 **********************************************/

.input_wrap
{
	margin-bottom: 10px;
}

.input_label
{
	float: left;
	width: 125px;
	margin-right: 10px;
	color: #00994F;
	font-weight: bold;
}

.input_field
{
    
}

.input_field input, .input_field select
{
	width: 275px;
    border: 1px solid #006633;
    background: url(../images/input_bg.png) top left repeat-x;
    background-color: #FFFFFF;
    padding: 3px;
    font-size: 10pt;
}

.input_field input[type=radio], .input_field input[type=checkbox]
{
    width: 25px;
}

.input_field input:focus, .input_field textarea:focus, .input_field select:focus
{
    border-color: #00CC66;
}

.input_field textarea
{
    border: 1px solid #006633;
    background: url(../images/input_bg.png) top left repeat-x;
    background-color: #FFFFFF;
    padding: 3px;
    font-size: 10pt;
    width: 385px;
    height: 150px;
}

.input_field select
{
    font-size: 10pt;
}

.submit_wrap
{
    padding: 10px;
    background-color: #D3EED8;
    margin-top: 20px;
	text-align: center;
    font-size: 10pt;
}

.submit_wrap input
{
	width: 125px;
    font-size: 10pt;
}


/**********************************************
 * NOTIFICATION MESSAGES
 **********************************************/

.success_wrap
{
	margin-bottom: 20px;
	padding:4px;
	font-size: 10pt;
	background:#B3FFCC;
	border:1px solid #009933;
}

.success_head
{
	color: #FFF; 
	padding-left: 20px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 2px;
	background: #00B359 url(../images/icon_tick.png) 2px center no-repeat;
	font-weight: bold;
	margin-bottom: 4px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.error_wrap
{
	margin-bottom: 20px;
	padding:4px;
	font-size: 10pt;
	background:#FBD1C1;
	border:1px solid #CD0A0A;
}

.error_head
{
	color: #FFF; 
	padding-left: 20px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: 2px;
	background: #F64646 url(../images/icon_exclamation.png) 2px center no-repeat;
	font-weight: bold;
	margin-bottom: 4px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}


/**********************************************
 * HEADER
 **********************************************/

#header
{
    background-color: #004D28;
	color: #FFFFFF;
	height: 125px;
	padding-top: 25px;
    min-width: 870px;
}

#header_content
{
	width: 850px;
	margin: 0 auto;
	text-align: left;
}

#logo
{
	float: left;
	position: relative;
}

#home_hover
{
	display: none;
	position: absolute;
	top: 25px;
	left: 320px;
	background: transparent url(../images/home_hover.png) center center no-repeat;
	width: 15px;
	height: 15px;
	z-index: 50;
}

#logo_img
{
    width: 430px;
    height: 100px;
}


/**********************************************
 * NAVIGATION MENU
 **********************************************/

#menu
{
	float: right;
    width: 363px;
    margin-top: 92px;
    list-style: none;
}

#menu li
{
	float: left;
}

#menu a
{
    display: block;
    float: left;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 12px;
    color: #FFFFFF;
    background-color: #006635;
    background: -moz-linear-gradient(bottom, #00532C, #006635 20%);
    text-decoration: none;
    text-align: center;
    width: 90px;
    font-weight: bold;
    outline: none;
    text-shadow: #004D28 -1px -1px 0px;
}

#menu a:hover
{
    background: #008042;
    background: -moz-linear-gradient(bottom, #00532C, #008042 20%);
    outline: none;
}

#menu_home, #menu_work, #menu_about
{
    border-right: 1px solid #004826;
}

#menu img
{
    vertical-align: bottom;
    width: 16px;
    height: 16px;
}


/**********************************************
 * CONTENT
 **********************************************/

#content_wrap
{
	background-color: #FFFFFF;
    background-image: url(../images/sun_rays.gif);
    background-repeat: no-repeat;
    background-position: bottom left;
    border-bottom: 10px solid #8ECF97;
    min-width: 870px;
}

#content
{
    background-image: url(../images/bg_trans80.png);
    background-color: transparent;
    padding-top: 20px;
	padding-bottom: 40px;
    padding-left: 10px;
	padding-right: 10px;
	margin: 0 auto;
	text-align: left;
	width: 830px;
	font-size: 10pt;
    min-height: 375px;
}

#left_col
{
    width: 600px;
}

#right_col
{
    float: right;
    width: 210px;
    margin-left: 20px;
}

#right
{
	float: right;
	margin-left: 20px;
    width: 450px;
}


/**********************************************
 * RIGHT COLUMN MENU
 **********************************************/
 
.right_menu
{
	list-style: none;
}

.right_menu li
{
	margin-bottom: 2px;   
}

.right_menu li a, .admin_submenu a
{
	display: block;
	background-color: #E5F5E8;
    background-image: url(../images/right_menu_bg.png);
    background-repeat: repeat-y;
    background-position: top left;
	border-bottom:1px dotted #8ECF97;
	text-decoration: none;
	color: #00994F;
	font-weight: bold;
	padding-left: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
}

.admin_submenu a
{
    background-color: #C1E7C8;
    background-image: url(../images/right_menu_bg_over.png);
}
 
.right_menu li a:hover
{
	background-color: #C1E7C8;
    background-image: url(../images/right_menu_bg_over.png);
}
 
.menu_icon
{
	display: block;
	float: left;
	width: 16px;
	height: 16px;
	margin-right: 8px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: left center;
	filter: alpha(opacity=50);
	-moz-opacity: 0.50;
	opacity: 0.50; 	
}
 
.right_menu li a:hover .menu_icon
{
	filter: alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0; 	
}

.admin_submenu
{
    display: none;
    margin-bottom: 5px;
}

.menu_admin_add     { background-image: url(../images/icon_add.png); }
.menu_admin_add_web { background-image: url(../images/icon_world_add.png); }
.menu_admin_add_art { background-image: url(../images/icon_palette_add.png); }
.menu_admin_web     { background-image: url(../images/icon_world.png); }
.menu_admin_art     { background-image: url(../images/icon_palette.png); }
.menu_admin_logout  { background-image: url(../images/icon_lockopen.png); }
.menu_admin_ga      { background-image: url(../images/icon_ga.png); }
.menu_admin_mt      { background-image: url(../images/icon_mt.png); }

.menu_contact_fb    { background-image: url(../images/contact_facebook.png); }
.menu_contact_tw    { background-image: url(../images/contact_twitter.png); }
.menu_contact_li    { background-image: url(../images/contact_linkedin.png); }
.menu_contact_aim   { background-image: url(../images/contact_aim.png); }
.menu_contact_da    { background-image: url(../images/contact_deviantart.png); }
.menu_contact_xbl   { background-image: url(../images/contact_xbox.png); }
.menu_contact_psn   { background-image: url(../images/contact_psn.png); }
.menu_contact_wii   { background-image: url(../images/contact_wii.png); }

.menu_work_back		{ background-image: url(../images/icon_back.png); }

.menu_ext_chrome    { background-image: url(../images/icon_chrome.png); }

/**********************************************
 * IMAGE SLIDER - (/HOME)
 **********************************************/

#slider_wrap
{
    float: right;
    width: 438px;
    height: 250px;
    padding: 5px;
    border: 1px solid #8ECF97;
    margin-bottom: 10px;
    background-color: #FFF;
    text-align: center;
}

#slider
{
	width: 438px;
    height: 250px;
}

#slider a
{
	display: none;
	width: 438px;
	height: 250px;
	text-decoration: none;
}

#slider a.first
{
	display: block;
}

#slider a div
{
    display: none;
	margin-top: 225px;
	height: 20px;
	padding-top: 5px;
	padding-left: 10px;
	background-color: #000000;
	opacity: .7;
	color: #FFFFFF;
	text-align: left;
	font-weight: bold;
}

#slider_nav a 
{
	display: block;
	float: left; 
	text-align: center;
	width: 77px;
	height: 77px;
    padding: 3px;
	background: #FFF; 
    border: 1px solid #8ECF97;
	text-decoration: none; 
	margin-left: 5px; 
}

#slider_nav a img
{
	height: 77px;
	width: 77px;
}

#slider_nav a:first-child
{
    margin-left: 2px;
}

#slider_nav a.activeSlide 
{ 
	background: #006633;
    border: 1px solid #006633;
}


/**********************************************
 * FOOTER
 **********************************************/
 
#footer
{
	margin: 0 auto;
	text-align: left;
	width: 850px;
	color: #FFFFFF;
	font-size: 8pt;
	padding-top: 10px;
	margin-bottom: 50px;
}

#foot_copyright
{
	float: left;
}

#foot_menu
{
	float: right;
}

#foot_menu a, #foot_copyright a
{
	color: #FFFFFF;
}

#foot_menu a:hover, #foot_copyright a:hover
{
	text-decoration: none;
}


/**********************************************
 * TWITTER (/HOME)
 **********************************************/

#twitter_wrap
{
    width: 334px;
    padding: 8px;
    background-color: #D7EEDB;
    background-image: url(../images/twitter_bg.png);
    background-position: 300px 5px;
    background-repeat: no-repeat;
    min-height: 55px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    color: #008040;
}

#twitter_wrap ul
{
    list-style: none;
}

.twitterTime, .twitterStatus
{
    display: block;
    color: #008040;
}

.twitterStatus
{
    padding-bottom: 3px;
    min-height: 34px;
    font-weight: bold;
}

.twitterTime
{
    font-style: italic;
    font-size: 8pt;
    text-align: right;
    padding: 3px;
    background-color: #C6E7CB;
    opacity: .75;
    -moz-border-radius: 0px 0px 3px 3px;
    -webkit-border-radius: 0px 0px 3px 3px;
}



/**********************************************
 * WORK PAGES
 **********************************************/
 
.artitem_wrap
{
    float: left;
    text-decoration: none;
    padding: 3px;
    border: 1px solid #8ECF97;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.artitem_wrap img
{
    width: 100px;
    height: 100px;
    opacity: .85;
}

.artitem_wrap:hover img
{
    opacity: 1.0;
}


.website_description
{
	min-height: 110px;
	width: 350px;
	float: left;
}

.website_date
{
	float: right;
	font-style: italic;
	color: #666666;
	font-family: Georgia, Times New Roman, serif;
	font-size: 12pt;
	
}

.website_screen img
{
	width: 225px;
	height: 125px;
    opacity: .85;
}

#projimg_wrap
{
	margin-bottom: 20px;
}

#projimg_wrap img
{
	width: 600px;
	height: 400px;
}

.work_descrip
{
	float: left;
	width: 300px;
	margin-right: 20px;
	height: 130px;
}

.work_skills
{
	float: left;
	width: 270px;
	height: 75px;
}

.work_url
{
	float: left;
	width: 270px;
	height: 50px;
}

.ext_subhead
{
    font-size: 12pt;
    margin-bottom: 10px;
    color: #00994F;
}

/**********************************************
 * LOGIN PAGE
 **********************************************/

#login_page
{
    font-size: 10pt;
	text-align: center;
	margin: 0 auto;
	padding-top: 75px;
	background-color: #006633;
	background-image: url(../images/login_bg.png);
	background-attachment: fixed;
	background-repeat: repeat-x;
	background-position: bottom left;
}

#login_logo
{
	margin: 0 auto;
	margin-bottom: 10px;
	width: 113px;
	height: 90px;
	background: transparent url(../images/login_logo.png) center center no-repeat;
}

#login_wrap
{
	margin: 0 auto;
	text-align: left;
	width: 380px;
	-moz-box-shadow: 0px 0px 10px #18263E;
	-webkit-box-shadow: 0px 0px 10px #18263E;
}

#login_head
{
	padding: 5px;
	font-weight: bold;
	color: #FFFFFF;
	background: #49AB56;
}

#login_body
{
	background-color: #FFFFFF;
	padding: 10px;
}

.login_label
{
	color: #32763B;
	font-weight: bold;
}

.login_field
{
	padding-top: 3px;
	padding-bottom: 3px;
}

.login_field input
{
	width: 350px;
	padding: 2px;
	background-color: #D7EEDB;
	border: 1px solid #32763B;
}

#login_page .submit_bar
{
	margin-top: 10px;
}

#login_submitbtn
{
	float: right;
	width: 100px;
}

#reset_submit
{
    width: 125px;
}

#login_page .login_error
{
	margin-bottom: 10px;
	padding:2px;
	font-size: 12px;
	font-weight: bold;
	background:#FBD1C1;
	border:1px solid #CD0A0A;
	color:#CD0A0A;
}

.login_error img
{
	vertical-align: middle;
}


/**********************************************
 * MISC
 **********************************************/
 
 #error_404
{
    height: 405px;
    width: 610px;
    border: 2px solid #333333;
    background: transparent url(../images/404_error.gif) center center no-repeat;
    opacity: 0.9;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 115px;
}

.icon_dim
{
	width: 16px;
	height: 16px;
}

.mushroom
{
    position: absolute;
    display: none;
    width: 16px;
    height: 14px;
    background: transparent url(../images/1up_small.png) center center no-repeat;
}

.mario
{
    position: absolute;
    display: none;
    width: 16px;
    height: 32px;
    background: transparent url(../images/mario_big.png) center center no-repeat;
}

.triangle_up
{
	background-color: #FFFFFF;
    margin-left: 20px;
    font-size: 0px;
    width: 0px; 
	line-height: 0%; 
    border-left: 10px solid transparent;
	border-bottom: 10px solid #D7EEDB;
	border-right: 10px solid transparent;
}

#captcha_img
{
    width: 150px;
    height: 50px;
}

.tooltip
{
	display:none;
	background:transparent url(../images/tt_green_arrow2.png) top center no-repeat;
	font-size:11px;
	height:40px;
	width:154px;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 23px;
	color:#E5F0E7;
	text-align: left;
}
