@import url(reset.css);
@import url(tools.css);

/*  = INFO
/*  -------------------------------------------------------- */
  /*

    project:          BaltimoreACTS - Haiti Relief
    file:             bmoreacts.css
    creator:          Ben Kutil <ben@make-things.com>
    creation date:    Sat Jan 30 21:20:44 EST 2010
    copyright:        (c) 2010 - Make Things Studio, LLC
                      All rights reserved.      

    info:             Baltimore ACTS landing page css
    
    TOC:              

  */
/*  -------------------------------------------------------- */
/*  = [end] INFO */

@media only screen and (max-device-width:480px) { 
  body { -webkit-text-stroke:0 black; }
}

/*  = Typography
      Because Typography is the interface
/*  -------------------------------------------------------- */
    
    @font-face {
    	font-family: 'QuicksandBook';
    	src: url('../fonts/Quicksand_Book.eot');
    	src: local('Quicksand Book'), local('QuicksandBook-Regular'), url('../fonts/Quicksand_Book.woff') format('woff'), url('../fonts/Quicksand_Book.otf') format('opentype'), url('../fonts/Quicksand_Book.svg#QuicksandBook-Regular') format('svg');
    }

    @font-face {
    	font-family: 'LeagueGothicRegular';
    	src: url('../fonts/League_Gothic.eot');
    	src: local('League Gothic Regular'), local('LeagueGothic'), url('../fonts/League_Gothic.woff') format('woff'), url('../fonts/League_Gothic.otf') format('opentype'), url('../fonts/League_Gothic.svg#LeagueGothic') format('svg');
    }

    @font-face {
    	font-family: 'GraublauWebBold';
    	src: url('../fonts/GraublauWebBold.eot');
    	src: local('Graublau Web Bold'), local('GraublauWeb-Bold'), url('../fonts/GraublauWebBold.woff') format('woff'), url('../fonts/GraublauWebBold.otf') format('opentype'), url('../fonts/GraublauWebBold.svg#GraublauWeb-Bold') format('svg');
    }

    @font-face {
    	font-family: 'GraublauWebRegular';
    	src: url('../fonts/GraublauWeb.eot');
    	src: local('Graublau Web Regular'), local('GraublauWeb-Regular'), url('../fonts/GraublauWeb.woff') format('woff'), url('../fonts/GraublauWeb.otf') format('opentype'), url('../fonts/GraublauWeb.svg#GraublauWeb-Regular') format('svg');
    }
    
    @font-face {
    	font-family: 'BebasRegular';
    	src: url('../fonts/BEBAS___.eot');
    	src: local('Bebas Regular'), local('Bebas'), url('../fonts/BEBAS___.woff') format('woff'), url('BEBAS___.ttf') format('truetype'), url('../fonts/BEBAS___.svg#Bebas') format('svg');
    }

    
    
    body { font-family: "GraublauWebRegular","Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; line-height: 18px; }

    h1,h2,h3,h4,h5,h6 { margin: 0; font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; }

    p, pre, address, abbr, li {}
    code, kbd, samp, small, var {}
    ul, ol, dl, dialog { }
    li ul, li ol, ul ul, ol ol {}
    li h1,li h2,li h3, li h4,li h5,li h6, li p{}
    
    img { display: block; }
    
    a:link,
    a:visited,
    a:active { text-decoration: none; color: #1499db; }
    a:hover { text-decoration: underline; color: red;}
    
/*  -------------------------------------------------------- */
/*  = [end] Typography */

@media screen {
  
  /*  = Baseline Typography
  /*  -------------------------------------------------------- */

      h1,h2,h3,h4,h5,h6 { font-family: "GraublauWebRegular"; line-height: 18px; font-weight: normal; }
      h2 { margin: 0; font-size: 24px; line-height: 30px; color: #ae0001; }
      
      
      p { margin: 0 0 9px; font-size: 15px; line-height: 24px; }
      
      li h3 { font-size: 15px; font-family: "GraublauWebBold"; color: #3f5058; }
      li p { font-size: 12px; line-height: 18px; }
      
      legend { display: none; }
  /*  -------------------------------------------------------- */
  /*  = [end] Baseline Typography */
  
  /*  = Viewport
  /*  -------------------------------------------------------- */

      body { text-align: center; background: url(../images/_s/bg-body.jpg) left top repeat; }
      #wrap { width: 970px; margin: 0 auto; background: url( ../images/_s/bg-content.jpg) left 43em no-repeat; }

  /*  -------------------------------------------------------- */
  /*  = [end] Viewport */
  
  /*  = Constants
  /*  -------------------------------------------------------- */

      .nav, .nav li { margin: 0; padding: 0; list-style: none;  }
      .nav a,
      .btn a { display: block; }
      
      .inline li { display: inline; float: left; }

  /*  -------------------------------------------------------- */
  /*  = [end] Constants */
  
  /*  = Header
  /*  -------------------------------------------------------- */

      #header {
	position: relative;
	z-index: 1;
	display: inline;
	float: left;
	width: 100%;
	min-height: 430px;
	margin: 0;
	padding: 0;
	text-align: left;
	background: url(../images/_s/bg-header2.jpg) left bottom no-repeat;
}
      #branding-logo { position: relative; z-index: 2; display: inline; float: left; width: 137px; margin: 0 0 0 68px; }
      #site { position: relative; z-index: 2; display: inline; float: right; width: 690px; margin: 28px 60px 0 0; }
        #site li { position: relative; z-index: 2; display: inline; float: right; width: 130px; margin: 0 10px 0 0;}
        #site a:link,
        #site a:active,
        #site a:visited { position: relative; z-index: 2; padding: 3px 5px; font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; font-size: 15px; font-weight: bold; text-decoration: none; color: #fff; border-top: 5px solid red; }
        #site a:hover { background: red; }
        #site #site-give { padding: 10px; border: 0; color: #ae0001; background: #fff -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#b5b5b5));}
      #promo { position: absolute; bottom: 0; left: 70px; z-index: 1; width: 830px; height: 345px; }
        #promo #images { position: absolute; left: 0; bottom: 0; z-index: 1; width: 635px; height: 355px; overflow: hidden; }
        #promo .info { display: inline; float: right; width: 270px; color: #fff; }
          #promo h2 { margin: 0; font-size: 15px; line-height: 22px; color: #fff; }
          #promo h2 span { margin-left: -6px; padding: 3px 6px; font-family: 'LeagueGothicRegular'; font-weight: normal; letter-spacing: 4px; text-transform: uppercase; color: #ccc; background: #6e0501; }
          #promo h3 { margin: 0; font-family: 'LeagueGothicRegular'; font-size: 48px; line-height: 54px; text-transform: uppercase; }
          #promo p { font-size: 18px; line-height: 22px; font-weight: lighter; }
          #promo h4 { font-size: 21px; line-height: 24px; font-family: 'GraublauWebBold'; }
          #promo h4 span { font-size: 18px; font-family: 'GraublauWebRegular';}
          #btn-purchase { margin-left: -9px; }
          #btn-purchase,
          #btn-purchase span { width: 218px; height: 71px; }
          #btn-purchase span { background: url(../images/_s/btn-purchase.gif) left 0px no-repeat; }
          #btn-purchase:hover span { background-position: left -71px; }

  /*  -------------------------------------------------------- */
  /*  = [end] Header */
  
  /*  = Content
  /*  -------------------------------------------------------- */

      #content { width: 850px; margin: 0 auto; text-align: left; }
        .section { display: inline; float: left; width: 100%; margin: 0 0 30px;}
            
          .article { display: inline; float: left; width: 530px; margin: 0 20px 0 0;}

          .aside { position: relative; display: inline; float: left; width: 270px; margin: 0 0 0 5px; }
            .aside ul { margin-top: 2px; }
          .partners { display: inline; float: left; width: 270px; }
        
        
        #newsletter { margin: 10px 0; padding: 5px 0; background: url( ../images/_s/bg-news.gif) left top repeat; }
          #newsletter h2 { display: inline; float: left; width: 210px; margin: 5px 0 0 15px; font-family: 'LeagueGothicRegular'; font-size: 36px; text-transform: uppercase; letter-spacing: 2px; color: #0c8697; }
          #newsletter p { margin: 0; font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; font-size: 11px; line-height: 18px; }
          #newsletter .info { display: inline; float: left; width: 343px; }
          #newsletter form { display: inline; float: left; width: 270px; }
            #newsletter fieldset { display: inline; float: left; width: 206px; margin: 0; padding: 0; } 
            #newsletter #fld-submit_form { display: inline; float: left; margin-top: 2px; width: 59px; }
            #ctl-newsemail { position: relative; display: inline; float: left; width: 206px; }
            #ctl-newsemail label { position: absolute; left: 10px; top: 12px; }
            #ctl-newsemail .req { color: red; }
            #ctl-newsemail label,
            #ctl-newsemail input { font-size: 15px; line-height: 1; color: #9ecfd5; }
            #ctl-newsemail input { width: 194px; padding: 8px 6px; border: 1px solid #bcd3d8; background: url(../images/_s/bg-inp-text.gif) left top repeat-x; }
            #btn-emailsubmit { display: block; width: 59px; height: 36px; padding: 0; border: none; background: url(../images/_s/btn-email.gif) left top no-repeat; }
            #btn-emailsubmit:hover { background-position: left -36px; }
        
          .article { margin-left: 15px ; }
          
          .support { display: inline; float: left; width: 100%; }
          .support p { display: inline; float: right; width: 210px; }
          #list-support li { margin-right: 10px; }
          
          #nav-social { position: absolute; top: 0; right: 0; width: 70px; }
          #nav-social li,
          #nav-social a,
          #nav-social span { width: 29px; height: 29px; }
          #nav-social li { margin: 0 6px 0 0; }
          
          #nav-social span { background: url(../images/_s/btn-social.gif) left top no-repeat; }
          #nav-facebook span { background-position: -29px top; }
          
          
          .tweet_avatar { display: inline; float: left; width: 44px; padding: 3px; border: 1px solid #d7dae2; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: #fff; }
          .tweet_list p { display: inline; float: left; width: 205px; margin-left: 10px; font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; font-size: 10px; line-height: 15px; color: #3f5058 ;}
          .tweet_list a { color: #000; }
          .tweet_list span { color: #aaa; }
          
          
          #founding { margin-top: 30px; }
          .partners ul { margin-top: 9px; }
          .partners li { font-size: 15px; }
          
        #btn-donate { display: inline; float: left; width: 349px; padding: 6px 6px; font-family: "GraublauWebBold"; font-size: 12px; letter-spacing: 1px;  color: #fff; background: url(../images/_s/btn-donate-txt.gif) left top no-repeat; }
        #btn-donate:hover { text-decoration: none; }
        
  /*  -------------------------------------------------------- */
  /*  = [end] Content */
  
  /*  = Footer
  /*  -------------------------------------------------------- */

      #siteinfo { width: 850px; margin: 0 auto; text-align: left; background: url(../images/_s/sep-siteinfo.gif) left top repeat-x; }
        .vcard { display: inline; float: left; width: 300px; margin: 9px 0 0 15px; font-size: 12px; color: #5a6567; }

  /*  -------------------------------------------------------- */
  /*  = [end] Footer */
  
}

@media print {
  
}