@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700);
body                        {font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; margin: 0; padding: 0;}
svg                         {margin: 0 0 10px 10px}
.container                  {margin: 15px auto; max-width:600px;}
.wrapper                    {background-color: #f5f5f5; padding: 25px; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;}
h1                          {color:#29343B; font-weight:normal; font-size: 18px; margin: 0 0 15px;}
p,
#spinner                    {color:#505E67; font-size: 14px; margin:0 0 15px;}
ul                          {float: left; margin: 0 0 15px; padding: 0 0 0 25px;}
ul li                       {color: #505E67; font-size: 14px; margin: 0 0 8px;}
strong                      {color:#0175C6;}

.fields                     {clear: both; height:50px; margin:0 0 15px;}
.field-wrap                 {display: block; float:left; height: 50px; position:relative; width:270px;}
.field-wrap:first-child     {margin-right:10px;}
label                       {color: #0175C6; display:block; font-size:12px; left: 5px; position: absolute; top: 5px; text-transform: uppercase;}
input[type="text"],
input[type="password"]      {border:1px solid #c8c8c8; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-sizing: border-box; font-size: 18px; height:50px; padding:22px 5px 5px; margin: 0 0 15px;  width:100%; -webkit-appearance: none;}
.buttons-cell               {clear: both; float: left; width: 100%; margin: 0 0 15px;}
textarea                    {border:1px solid #c8c8c8; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-sizing: border-box; font-size: 18px; height:50px; padding:5px; margin: 0 0 15px;  width:100%; -webkit-appearance: none; height:85px;}


input[type="submit"]        {border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius: 4px; border:none;box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; color:#fff; cursor: pointer; padding:10px; text-decoration:none; font-size:16px; height:42px; -webkit-appearance: none;}

.permissions-policy         {clear: both; display: block; font-size:14px; color:#505E67; text-align: right;}

#allow                      {background: #00B478; margin-right:10px;}
#allow:hover                {background: #1E7457;}

#deny                       {background: transparent; color:#000; text-decoration: underline;}

#error                      {margin:-10px 0 15px; clear:both; }
#error-header               {color:#BB0613; font-size:12px;}

/* TEMP STYLES */
#extended-permissions p     {color: #505E67;}


@media (max-width: 600px)   {
svg                         {height:30px; width: 145px;}
.wrapper                    {padding: 15px;}
h1                          {font-size: 16px;}
.fields                     {height: 115px;}
input[type="text"],
input[type="password"],
.field-wrap                 {width: 100%; margin-bottom:10px;}
.field-wrap:first-child     {margin-right:0;}
textarea                    {height:160px;}

}