100ish lines of scss that drive the worldmap page for http://scoutmob.com

worldmap.scss

@import "vendor/960";
@import "shared/position_and_dimensions";

$cities-sprite-dimensions: true;
@import "worldmap/cities/*.png";
@include all-cities-sprites;

$links-sprite-dimensions: true;
@import "worldmap/links/*.png";
@include all-links-sprites;

body {
  background-color:#0f1415;
  margin: 0;
}

a {
  position: absolute;

  span { display: none; }
}

.worldmap_container {
  @include grid-container;

  .worldmap {
    background-image: image-url("worldmap/map_background.jpg");
    @include dimensions(1125px, 739px);
    margin-left:-80px;
  }

  .links {
    position: relative;

    .mobile {
      position: absolute;
      background-image: image-url("worldmap/get_the_app.png");
      @include position(200px, 410px);
      @include dimensions(203px, 166px);

      .iphone {
        @include position(0px, 100px);
        @include dimensions(101px, 66px);
      }

      .android {
        @include position(101px, 100px);
        @include dimensions(101px, 66px);
      }
    }

    .links-bermuda_triangle { @include position(875px, 423px); }
    .links-one_eyed_willie  { @include position(586px, 460px); }
    .links-cut_line         { @include position(655px, 606px); }
    .links-east_edge        { @include position(860px, 579px); }
    .links-school_of_mermen { @include position(370px, 600px); }
    .links-west_edge        { @include position(108px, 585px); }
  }

  .cities {
    position: relative;

    .cities-atlanta       { @include position(685px, 330px); }
    .cities-nashville     { @include position(585px, 254px); }
    .cities-austin        { @include position(409px, 341px); }
    .cities-boston        { @include position(839px, 124px); }
    .cities-chicago       { @include position(591px, 166px); }
    .cities-dallas        { @include position(490px, 304px); }
    .cities-denver        { @include position(411px, 208px); }
    .cities-los-angeles   { @include position(143px, 279px); }
    .cities-new-york      { @include position(815px, 175px); }
    .cities-san-francisco { @include position(181px, 234px); }
    .cities-seattle       { @include position(186px, 122px); }
    .cities-washington-dc { @include position(795px, 219px); }
    .cities-portland      { @include position(188px, 175px); }
    .cities-san-diego     { @include position(246px, 341px); }
    .cities-phoenix       { @include position(380px, 270px); }
    .cities-houston       { @include position(510px, 373px); }
    .cities-minneapolis   { @include position(504px, 123px); }
    .cities-philadelphia  { @include position(645px, 210px); }
    .cities-charlotte     { @include position(761px, 268px); }
    .cities-miami         { @include position(692px, 419px); }
  }

  #catfish {
    display: none;
    text-align: left;
    color: #fff;
    background-image: url("http://cloud.scoutmob.com/others/catfish/images/popover_bkg.png");

    p {
      font-size: 13px;
      font-family: Georgia, serif;
      line-height: 135%;
      color: #3b3b3b;
      margin: 24px 15px 5px 120px;
    }

    a#catfish-close {
      position: absolute;
      top:108px;
      left:128px;
      display:inline-block;
      width:38px;
      height:15px;
    }

    a#catfish-close span {
      display:none;
    }
  }
}