/* CSS Document */

/* ----------------------------------------------------------------------------------------------------
GLOBAL
---------------------------------------------------------------------------------------------------- */
html 								{ overflow-y: scroll }

body								{ background-image:url(../images/body_bg.gif); background-repeat:repeat-x; background-position:top }

ul									{ margin:0; padding:0; list-style:none; list-style-image:none; list-style-type:none }

li									{ margin:0; padding:0; list-style:none; list-style-image:none; list-style-type:none }

.left								{ float:left }
.right							{ float:right }

.wrap								{ width:1000px; margin:0 auto }

.column_background					{ background-image:url(../images/column_bg.gif); background-repeat:repeat-x; background-position:bottom; background-color:#F7F7F7; min-height:100px; border-width:1px; border:1px; border-color:#cccccc; border-style:solid }

.column_text						{ padding: 24px 30px 24px 30px; float:left }

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

                 
/* Makes all 'clickable' elements respond as links on :hover */
input[type=submit], button,select,.pointer { cursor:pointer; } 


/* ----------------------------------------------------------------------------------------------------
HEADER
---------------------------------------------------------------------------------------------------- */
#header { height:80px; width:1000px }

#navigation {
  width:1000px; 
  height:40px; 
  background-color:#7bc143; 
  margin:0; 
  padding:0; 
  margin-bottom:10px;
  text-align:center;
  }

#navigation ul { 
  height:40px; 
  padding:0; 
  width:100%;  
  list-style:none; 
  list-style-image:none;
  margin:0 auto ; 
  }

#navigation ul li { 
  display:inline; 
  margin:0;
  padding:0; 
  float:left; 
  }
           
#navigation a,#navigation a:visited {
    color:#fff;
     font:bold 14px Arial;
    text-transform:uppercase;
    text-decoration:none;
    margin-right:20px;
    line-height:40px;
    padding-bottom:5px;
  }
  
#navigation a:hover {
  border-bottom:6px solid #7E7F81;
}

#navigation { width:1000px; height:40px; background-color:#7bc143; margin:0; padding:0; margin-bottom:10px }

#navigation ul { height:40px; padding:0; width:617px; list-style:none; list-style-image:none; margin:0 auto }

#navigation ul li { display:inline; margin:0; padding:0; float:left }


/* ----------------------------------------------------------------------------------------------------
FOOTER
---------------------------------------------------------------------------------------------------- */
#footer								{ height:20px; width:1000px; background-color:#7bc143; margin-top:10px; float:left }

#footer_text						{ float:right; margin:4px 6px 4px 6px }


/* ----------------------------------------------------------------------------------------------------
HOME
---------------------------------------------------------------------------------------------------- */
#slideshow							{ width:1000px; height:300px; background-color:#F7F7F7; float:left }

#twitter							{ float:left; position:relative; width:198px; height:268px; margin-top:10px; background-image:url(../images/column_bg.gif); background-repeat:repeat-x; background-position:bottom; background-color:#F7F7F7;border-width:1px; border:1px; border-color:#dddddd; border-style:solid }

#introduction						{ float:left; clear:none; background-color:#FFFFFF; margin:15px 0 5px;font: 18px/1.2 Arial, sans-serif; padding: 0 0px; color: #444; line-height: 1.4; }

#want-work							{ float:left; width:388px; background-image:url(../images/column_bg.gif); background-repeat:repeat-x; background-position:bottom; background-color:#F7F7F7;border-width:1px; border:1px; border-color:#dddddd; border-style:solid; margin-top:10px }

#need-hire							{ float:left; width:388px; background-image:url(../images/column_bg.gif); background-repeat:repeat-x; background-position:bottom; background-color:#F7F7F7;border-width:1px; border:1px; border-color:#dddddd; border-style:solid;  margin-left:10px;margin-top:10px }

#twitter {  margin-left:10px; display: inline; float: left; height: 244px;}

#twitter-header						{ background-image:url(http://wunderlandgroup.com/images/twitter_header.gif); width:198px; height:40px; float:left }

#twitter-content					{ width:198px; height:180px; float:left }

#twitter_update_list				{ padding:8px 10px 0px 10px; list-style:square; list-style-position:inside; height:180px; overflow:hidden; float:left }

#twitter_update_list li				{ margin-bottom:12px }

a #twitter-link						{ float:left; height:16px; background-color:#7bc143; width:120px; position:absolute; bottom:10px; left:10px; padding:4px; text-align:center }

a:hover #twitter-link				{ background-color:#807F83 }


/* ----------------------------------------------------------------------------------------------------
ABOUT US
---------------------------------------------------------------------------------------------------- */
#about-content		{ width:1000px; float:left; margin-bottom:10px }

.portrait					{ float:left; width:100px; height:100px }

.portrait-image		{ border:1px; border-style:solid; border-color:#cccccc; float:left }

#judi							{ width:493px; float:left }

#brian						{ width:493px; float:left; margin-left:10px }

.portrait-text		{ float:left; margin-left:10px }



/* ----------------------------------------------------------------------------------------------------
WHAT WE DO
---------------------------------------------------------------------------------------------------- */
#what-we-do							{ width:998px; float:left }

#job-titles							{ width:998px; float:left; margin-top:10px }

#what-buttons						{ float:left; width:100px; margin-right:10px }

#what-content						{ width:790px; float:left }

.job-positions-left			{ width:464px; float:left; clear:right }

.job-positions-right		{ width:464px; float:right; clear:right }


/* ----------------------------------------------------------------------------------------------------
CAREER
---------------------------------------------------------------------------------------------------- */
#digital-bootcamp					{ width:998px; float:left }

#digital-bootcamp-content	{ width:434px; margin-right:30px; float:left }

#career-groups						{ width:998px; float:left; margin-top:10px }


/* ----------------------------------------------------------------------------------------------------
EVENTS
---------------------------------------------------------------------------------------------------- */
#event-list							        { width:617px; float:left; display: inline;}

#event-list	.column_text        { width: 557px;}

#meetups 					              { width:369px; float:left; display: inline; margin-left:10px }

#event-list	.column_text iframe { width: 309px !important;}

/* ----------------------------------------------------------------------------------------------------
CONTACT
---------------------------------------------------------------------------------------------------- */
#contact-form					{ float:left; width:326px; height:100px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; position: relative; }

#contact-information	{ float:left; clear:none; width:662px; margin-left:10px }

#judi-contact,
#brian-contact				{ float: left; width:286px; }

#locations						{ float:left; clear:both; width:324px; height:475px; margin-top:10px }

#map								  { background-color:#99b3cb; background-image:url(http://maps.google.com/maps/api/staticmap?&zoom=10&size=662x475\&markers=color:0x7bc143|42.027319,-88.079763&markers=|color:0x7bc143|41.830049,-88.031559\&markers=|color:0x7bc143|42.133189,-87.788495&markers=|color:0x7bc143|41.878417,-87.634475&sensor=false&key=ABQIAAAAcpAHh0dNpZ12XYOGwfuGhBT9RmVRbpGl4RKzpR6j66EUNadhzhTsKW_dUxAVQAFkiN39pNMvqKLYfQ); background-repeat:no-repeat; width:662px; margin-top:10px; margin-left:10px; height:475px; float:left; clear:none; padding:0; border-width:1px; border:1px; border-color:#cccccc; border-style:solid }




/* contact form
------------------------------ */

#contact { border: none;}

#contact fieldset { border: none; }

#contact ol { list-style: none; margin: 0; padding: 0; width: 150px; }

#contact li {display: block; margin: 0 0 .3em; padding: 0; position: relative;}

#contact label,
#contact label small { font-size: 11px; display: block; font-weight: 500; text-transform: uppercase;}

#contact label small { font: italic 10px/1 georgia, serif; text-transform:none; margin-bottom: 2px;}

#contact input { width: 145px; }


#contact input, 
#contact textarea { font-style: italic; font-size: 90%; background: #efefef; border: none; padding: 2px 4px; outline: none; width: 130px;}

#contact textarea { width: 155px; height: 100px; }


#contact input:focus, 
#contact textarea:focus { background: #e6ffd3; outline: none; }

#contact button { border: none; background: #ffdd59; right: -15px; position: relative;}
#contact button:active {top: 1px; }

.notice, .success { position: absolute; background: #fff; border: 1px solid; top: -10px; width: 306px; padding:2px 4px; left: 10px; z-index: 10; 	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);}

.notice { border-color: #ffdd59;}

.success { border-color: #7ac143;  background: #e6ffd3; }

/*  blog posts
------------------------------ */

.post { padding-bottom: 5.4em; }
a:hover { text-decoration: none !important; }

.twitter-link,
.linkdin-link { display: block;  height: 25px; width: 25px; text-indent: -9999px; float: left; margin-right: 10px;}

.twitter-link { background: url(http://wunderlandgroup.com/images/icon_twitter.gif) no-repeat; }

.linkdin-link { background: url(http://wunderlandgroup.com/images/icon_linkedin.gif) no-repeat; }