@charset "utf-8";
@-ms-viewport{ width: device-width;, zoom: 1.0}
@-o-viewport{ width: device-width; zoom: 1.0}
@viewport{ width: device-width; zoom: 1.0}

@media screen, projection {
  /*
  Copyright (c) 2008, Yahoo! Inc. All rights reserved.
  Code licensed under the BSD License:
  http://developer.yahoo.net/yui/license.txt
  version: 2.5.1
  */
  body{font:13px/1.231 helvetica,arial,clean,sans-serif;*font-size:small;*font:x-small;}table {font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
  html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
  h1,h2,h3,h4,h5,h6,strong{font-weight:bold;}abbr,acronym{border-bottom:1px dotted #000;cursor:help;}em{font-style:italic;}ol li{list-style:decimal outside;}ul li{list-style:disc outside;}th{font-weight:bold;}caption{margin-bottom:.5em;text-align:center;}abbr{border:none;cursor:default;}

  a                                             {text-decoration:none; color:#2C77BB;}
  a:hover                                       {text-decoration:underline;}
  a:focus                                       {outline:none;}
  p                                             {margin:0 0 20px;}

/**
 * Style Chunks
 */
  html                                          {background:#DFE4EC url(focused/background.png) repeat-x top left;}
  body                                          {font:11px/1.5 "Lucida Grande", Tahoma, Arial, sans-serif; color:#667;}
  div#wrapper                                   {display: flex; flex-direction: column; width:780px; min-height: 100vh; margin:0 auto;}
  div#header                                    {height:135px; background:url(focused/icon.jpg) no-repeat top right; margin:0 70px;}
  div.single div#header                         {margin:0 185px;}
  div#header h1                                 {height:135px; width:320px; text-indent:-9999px; background:url(focused/harmony.jpg) no-repeat -5px 0; margin:0; padding:0;}

  div#content                                   {flex-grow: 1;padding:40px 70px; width:640px; float:left; background:url(focused/shadow.png) no-repeat top left;}
  div.single div#content                        {padding:40px 185px; width:400px;}
  div#main                                      {width:400px; float:left;}
  div#error                                     {position:absolute; width:300px; padding:18px 20px 1px; left:50%; margin:-100px 0 0 -170px; top:50%; background:rgba(0,0,0,0.05); -webkit-border-radius:6px; -moz-border-radius:6px;}

  h2                                            {height:30px; text-indent:-9999px; margin:0 0 25px;}
  h2.sign_up                                    {width:100px; float:left; height:30px; text-indent:-9999px; background:url(focused/text_sign_up.png) no-repeat; margin:0 20px 25px 0;}
  h2.create_account                             {background:url(focused/text_create_account.png) no-repeat;}
  h2.create_profile                             {background:url(focused/text_create_profile.png) no-repeat;}
  h2.your_invitation                            {background:url(focused/text_your_invitation.png) no-repeat;}
  h2.sign_in                                    {background:url(focused/text_sign_in.png) no-repeat;}
  h2.reset_password                             {background:url(focused/text_reset_password.png) no-repeat;}
  h2.check_email                                {background:url(focused/text_check_email.png) no-repeat;}
  h2.set_password                               {background:url(focused/text_set_password.png) no-repeat;}
  h2.file_not_found                             {background:url(focused/text_file_not_found.png) no-repeat;}
  h2.enter_password                             {background:url(focused/text_enter_password.png) no-repeat;}
  h2.thanks_sign_up                             {background:url(focused/text_thanks_sign_up.png) no-repeat;}
  h2.error-500                                  {background:url(focused/text_500.png) no-repeat;}
  h2.error-maintenance                          {background:url(focused/text_maintenance.png) no-repeat;}
  h2.signup_code_invalid                        {background:url(focused/text_invalid_code.png) -2px 0 no-repeat;}
  h2.error-404                                  {background:url(focused/text_404.png) no-repeat;}
  h2.timed-out                                  {background:url(focused/text_timed_out.png) no-repeat;}
  h2.lets_get_started                           {background:url(focused/text_lets_get_started.png) no-repeat;}
  h2.delete_comment                             {background:url(focused/text_delete_comment.png) no-repeat;}
  h2.comment_deleted                            {background:url(focused/text_comment_deleted.png) no-repeat;}

  h3                                            {height:30px; text-indent:-9999px; margin:0 0 25px;}
  div.explore h3                                {background:url(focused/text_explore_harmony.png) no-repeat;}
  div.new_site h3                               {background:url(focused/text_start_new_site.png) no-repeat;}
  div.learn_harmony h3                          {background:url(focused/text_harmony_101.png) no-repeat;}

  div.explore,
  div.new_site                                  {width:200px; float:left; margin:0 20px 0 0;}
  div.learn_harmony                             {width:200px; float:left;}

  div.explore a,
  div.new_site a,
  div.learn_harmony a                           {width:200px; height:50px; display:block; overflow:hidden; text-indent:-9999px;}

  div.explore a                                 {background:url(focused/button_start_exploring.png) no-repeat;}
  div.new_site a                                {background:url(focused/button_create_my_site.png) no-repeat;}
  div.learn_harmony a                           {background:url(focused/button_learn_harmony.png) no-repeat;}

  p.checkboxes label                            {margin-bottom:8px;}

  p.rel-1                                       {width:190px; margin-right:20px; float:left; clear:left;}
  p.rel-2                                       {width:190px; float:left;}

  #comment_moderation p.text                    {font-size:12px; line-height:1.6;}

  p.text strong                                 {color:#222; display:inline-block; width:50px;}

  form                                          {clear:both;}
  p                                             {margin:0 0 25px;}
  label                                         {text-transform:uppercase; color:#999; font-weight:bold; display:block;}

  input:focus {outline:none; -webkit-box-shadow:#06C 0 0 6px;}

  p.link                                        {margin:0;}
  p.submit a                                    {display:block; margin:5px 0;}
  em                                            {color:#999;}

  span.error label                              {color:#911;}
  p span.error input                            {border-color:#911;}

  div.noticeExplanation                          {margin:0 0 25px; color:#468847; background:#ecf1e8; border:1px solid #7d9e5d; padding:10px 15px; -webkit-border-radius:6px; -moz-border-radius:6px;}
  div.noticeExplanation h2                       {display:none;}
  div.noticeExplanation li                       {list-style:none;}
  div.noticeExplanation p                        {margin-bottom:10px;}

  div.errorExplanation                          {margin:0 0 25px; color:#911; background:#FCECED; border:1px solid #EDD7D7; padding:10px 15px; -webkit-border-radius:6px; -moz-border-radius:6px;}
  div.errorExplanation h2                       {display:none;}
  div.errorExplanation li                       {list-style:none;}
  div.errorExplanation p                        {margin-bottom:10px;}

  p.text input                                  {font-size:20px; width:378px; padding:8px 10px; border:1px solid #d9d9d9; -webkit-border-radius:6px; -moz-border-radius:6px;}
  p.rel-1 input,
  p.rel-2 input                                 {width:168px;}
  p.subdomain                                   {clear:both;}
  p.subdomain span#availability                 {display:block; color:#999; margin:5px 0 0;}
  span#availability span#harmony_url            {color:#999;}
  span#availability span#subdomain_preview      {color:#666;}
  span#subdomain_preview .taken                 {color:#911;}
  span#subdomain_preview .available             {color:#161;}
  p.submit                                      {margin-bottom:0;}
  p.submit input                                {width:auto;}
  p.remember input.submit                       {float:left; margin:0 20px 0 0;}
  p.remember label                              {display:inline;}

  div#aside ul li                               {list-style:none;}

  div#aside                                     {width:180px; float:right;}
  div#footer                                    {clear:both; padding:25px 70px; background:url(focused/shadow.png) no-repeat;}
  div.single div#footer                         {padding:25px 185px;}
  div.have-account                              {text-align: center; font-size: 14px; margin-top: 10px;}
}

@media screen and (max-width: 780px), projection and (max-width: 780px) {
  div#wrapper {
    width: 100%;
    max-width: 440px;
  }
  div.single div#header {
    margin: 0 20px;
  }
  div#content,
  div#footer {
    background-position: center top;
    background-size: 100% auto;
  }
  div.single div#content {
    position: relative;
    float: none;
    width: auto;
    padding: 40px 20px;
  }
  div.single div#footer {
    padding: 25px 20px;
  }
  p.remember input.submit {
    float: none;
    display: block;
    margin-bottom: 2em;
  }
  p.text input {
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    font-size: 16px;
  }
}

@media
projection and (max-width: 480px),
screen and (max-width: 480px) {
  div#header {
    height: 90px;
    background-position: 220px 0;
    background-size: auto 90px;
  }
  div#header  h1 {
    width: 213px;
    height: 90px;
    background-position: 0 0;
    background-size: 100%;
  }
  h2.sign_in {
    height: 20px;
    background-size: auto 20px;
  }
}
@media
projection and (max-width: 350px),
screen and (max-width: 350px) {
  h2.enter_password {
    background: none;
    font-size: 18px;
    text-indent: 0;
  }
}

@media 
only screen and (-webkit-min-device-pixel-ratio: 2), 
only screen and (min-resolution: 192dpi) {
  body {
    -webkit-text-size-adjust: none;
  }
  p.submit input[type=image] {
    width: 133px;
  }
}

