/* normalize 3.0.2 and skeleton 2.0.4 */

img,legend{border:0}
h1,h2,h3{letter-spacing:-.1rem}
pre,textarea{overflow:auto}
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent;color:#1EAEDB}
a:active,a:hover{outline:0}
abbr[title]{border-bottom:1px dotted}
b,optgroup,strong{font-weight:700}
dfn{font-style:italic}
h1{margin:.67em 0}
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-.5em}
sub{bottom:-.25em}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
body,h6{line-height:1.6}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}
input[type=search]{-moz-box-sizing:content-box;-webkit-box-sizing:content-box}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid silver;margin:0 2px}
legend{padding:0}
table{border-collapse:collapse;border-spacing:0}
.container{position:relative;width:100%;max-width:960px;margin:0 auto;padding:0 20px;box-sizing:border-box}
ol,p,ul{margin-top:0}
.column,.columns{width:100%;float:left;box-sizing:border-box}
@media (min-width:400px){.container{width:85%;padding:0}
}
html{font-size:62.5%}
body{font-size:1.5em;font-weight:400;font-family:Raleway,HelveticaNeue,"Helvetica Neue",Helvetica,Arial,sans-serif;color:#222}
h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:2rem;font-weight:300}
h1{font-size:4rem;line-height:1.2}
h2{font-size:3.6rem;line-height:1.25}
h3{font-size:3rem;line-height:1.3}
h4{font-size:2.4rem;line-height:1.35;letter-spacing:-.08rem}
h5{font-size:1.8rem;line-height:1.5;letter-spacing:-.05rem}
h6{font-size:1.5rem;letter-spacing:0}
@media (min-width:550px){.container{width:80%}
.column,.columns{margin-left:4%}
.column:first-child,.columns:first-child{margin-left:0}
.one.column,.one.columns{width:4.66666666667%}
.two.columns{width:13.3333333333%}
.three.columns{width:22%}
.four.columns{width:30.6666666667%}
.five.columns{width:39.3333333333%}
.six.columns{width:48%}
.seven.columns{width:56.6666666667%}
.eight.columns{width:65.3333333333%}
.nine.columns{width:74%}
.ten.columns{width:82.6666666667%}
.eleven.columns{width:91.3333333333%}
.twelve.columns{width:100%;margin-left:0}
.one-third.column{width:30.6666666667%}
.two-thirds.column{width:65.3333333333%}
.one-half.column{width:48%}
.offset-by-one.column,.offset-by-one.columns{margin-left:8.66666666667%}
.offset-by-two.column,.offset-by-two.columns{margin-left:17.3333333333%}
.offset-by-three.column,.offset-by-three.columns{margin-left:26%}
.offset-by-four.column,.offset-by-four.columns{margin-left:34.6666666667%}
.offset-by-five.column,.offset-by-five.columns{margin-left:43.3333333333%}
.offset-by-six.column,.offset-by-six.columns{margin-left:52%}
.offset-by-seven.column,.offset-by-seven.columns{margin-left:60.6666666667%}
.offset-by-eight.column,.offset-by-eight.columns{margin-left:69.3333333333%}
.offset-by-nine.column,.offset-by-nine.columns{margin-left:78%}
.offset-by-ten.column,.offset-by-ten.columns{margin-left:86.6666666667%}
.offset-by-eleven.column,.offset-by-eleven.columns{margin-left:95.3333333333%}
.offset-by-one-third.column,.offset-by-one-third.columns{margin-left:34.6666666667%}
.offset-by-two-thirds.column,.offset-by-two-thirds.columns{margin-left:69.3333333333%}
.offset-by-one-half.column,.offset-by-one-half.columns{margin-left:52%}
h1{font-size:5rem}
h2{font-size:4.2rem}
h3{font-size:3.6rem}
h4{font-size:3rem}
h5{font-size:2.4rem}
h6{font-size:1.5rem}
}
a:hover{color:#0FA0CE}
.button,button,input[type=button],input[type=reset],input[type=submit]{display:inline-block;height:38px;padding:0 30px;color:#555;text-align:center;font-size:11px;font-weight:600;line-height:38px;letter-spacing:.1rem;text-transform:uppercase;text-decoration:none;white-space:nowrap;background-color:transparent;border-radius:4px;border:1px solid #bbb;cursor:pointer;box-sizing:border-box}
.button:focus,.button:hover,button:focus,button:hover,input[type=button]:focus,input[type=button]:hover,input[type=reset]:focus,input[type=reset]:hover,input[type=submit]:focus,input[type=submit]:hover{color:#333;border-color:#888;outline:0}
.button.button-primary,button.button-primary,input[type=button].button-primary,input[type=reset].button-primary,input[type=submit].button-primary{color:#FFF;background-color:#33C3F0;border-color:#33C3F0}
.button.button-primary:focus,.button.button-primary:hover,button.button-primary:focus,button.button-primary:hover,input[type=button].button-primary:focus,input[type=button].button-primary:hover,input[type=reset].button-primary:focus,input[type=reset].button-primary:hover,input[type=submit].button-primary:focus,input[type=submit].button-primary:hover{color:#FFF;background-color:#1EAEDB;border-color:#1EAEDB}
input[type=email],input[type=text],input[type=tel],input[type=url],input[type=password],input[type=number],input[type=search],select,textarea{height:38px;padding:6px 10px;background-color:#fff;border:1px solid #D1D1D1;border-radius:4px;box-shadow:none;box-sizing:border-box}
input[type=email],input[type=text],input[type=tel],input[type=url],input[type=password],input[type=number],input[type=search],textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none}
textarea{min-height:65px;padding-top:6px;padding-bottom:6px}
input[type=email]:focus,input[type=text]:focus,input[type=tel]:focus,input[type=url]:focus,input[type=password]:focus,input[type=number]:focus,input[type=search]:focus,select:focus,textarea:focus{border:1px solid #33C3F0;outline:0}
label,legend{display:block;margin-bottom:.5rem;font-weight:600}
fieldset{padding:0;border-width:0}
input[type=checkbox],input[type=radio]{display:inline}
label>.label-body{display:inline-block;margin-left:.5rem;font-weight:400}
ul{list-style:circle inside}
ol{list-style:decimal inside}
ol,ul{padding-left:0}
ol ol,ol ul,ul ol,ul ul{margin:1.5rem 0 1.5rem 3rem;font-size:90%}
.button,button,li{margin-bottom:1rem}
code{padding:.2rem .5rem;margin:0 .2rem;font-size:90%;white-space:nowrap;background:#F1F1F1;border:1px solid #E1E1E1;border-radius:4px}
pre>code{display:block;padding:1rem 1.5rem;white-space:pre}
td,th{padding:12px 15px;text-align:left;border-bottom:1px solid #E1E1E1}
td:first-child,th:first-child{padding-left:0}
td:last-child,th:last-child{padding-right:0}
fieldset,input,select,textarea{margin-bottom:1.5rem}
blockquote,dl,figure,form,ol,p,pre,table,ul{margin-bottom:2.5rem}
.u-full-width{width:100%;box-sizing:border-box}
.u-max-full-width{max-width:100%;box-sizing:border-box}
.u-pull-right{float:right}
.u-pull-left{float:left}
hr{margin-top:3rem;margin-bottom:3.5rem;border-width:0;border-top:1px solid #E1E1E1}
.container:after,.row:after,.u-cf{content:"";display:table;clear:both}


/* Gifty CSS - general */

.container {
    margin-top: 3rem;
}

button {
    padding: 0 1.5rem;
    font-size: 1.5rem;
    background-color: white;
}

.button-subtext {
    color: #888;
}

button.button-primary {
    background-color: #b21972;
    border-color: #b21972;
}

button.button-primary:hover,
button.button-primary:focus
{
    background-color: #77114c;
    border-color: #77114c;
}

a {
    color: #b21972;
}

a:hover {
    color: #77114c;
}

li {
    text-indent: -3rem;
    padding-left: 3rem;
}

blockquote {
    margin: 0 2rem;
}

input[type=text]:focus,
input[type=password]:focus,
select:focus,
textarea:focus {
    border: 1px solid #b21972;
}

form {
    margin: 0 0 0.5rem 0;
}

.form-error {
    margin-top: -2rem;
    color: red;
}

.input-error {
    margin: -1rem 0 1rem 0;
    color: red;
}

label {
    margin-bottom: 0.2rem;
}

.label-subtext {
    color: #aaa;
    float: right;
}

label.checkbox-label {
    display: inline;
    margin-left: 0.5rem;
}

form button {
    margin-top: 1rem;
}

p {
    margin: 1.2rem 0;
}

textarea {
    margin-bottom: 0.7rem;
}

.input-close {
    color: #ddd;
    text-decoration: none;
    float: right;
    margin-top: -2.5rem;
}

.input-close:hover {
    color: #f0f0f0;
}

.beside-button {
    padding-left: 1rem;
}

h2 {
    margin-top: 3rem;
}

.desktop {
    display: none;
}
.mobile {
    display: inline;
}

img.solo {
    margin-top: 1.5rem;
}


/* homepage */

body.home {
    background-position: -275px 0;
    background-size: 743px 300px;
    background-repeat: no-repeat;
}

.home h1 {
    margin: 4rem 0 -1rem 0;
    font-size: 6rem;
    color: white;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.9);
    min-height: 14.5rem;
}

.home h1,
.home h2,
.home .hero .subtitle,
.home .hero .column,
.home .bottom-action {
    text-align: center;
}

.bottom-action {
    margin-top: 5rem;
}

.home .subtitle {
    margin: 3rem 0 0 0;
    font-size: 2.3rem;
    color: white;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.9);
    min-height: 7.5rem;
}

.hero {
    margin-bottom: 7rem;
}

.hero-actions {
    margin: 5.3rem auto 0 auto;
    width: 27rem;
    height: 6rem;
    padding: 1.5rem 0;
    background: #eee;
    border-radius: 3px;
}

.hero .create-registry {
    text-align: center;
}

.hero .create-registry .button-subtext {
    margin-top: -0.5rem;
    color: #888;
    font-weight: bold;
}

.hero .find-registry {
    margin: 3rem 0 0 0;
    text-align: center;
}

#description {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.home .fb-like {
    position: absolute;
    top: 0.7rem;
    left: 0.9rem;
    z-index: 60;
}

.main-sign-in {
    position: absolute;
    top: 0.7rem;
    right: 0.9rem;
    z-index: 60;
}

.scroll-down-arrow {
    display: none;
}

.scroll-down-arrow img {
    width: 5rem;
}


/* footer */

.footer-line {
    border-top: 1px solid #ddd;
    margin-top: 3rem;
}

.footer {
    font-size: 1.2rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.footer ul {
    float: right;
    margin: 0;
}

.footer li {
    display: inline;
    list-style-type: none;
}

.footer a {
    text-decoration: none;
}

.footer a:hover {
    text-decoration: underline;
}

.logo {
    float: left;
    margin: -7px 0 -10px 0;
    width: 32px;
    line-height: 32px;
    font-size: 30px;
    text-align: center;
    color: white;
    background-color: #ddd;
    border-radius: 3px;
}

.logo:after {
    content: 'G';
}

.how-it-works-diagram {
    border: solid 1px #ddd;
    border-radius: 3px;
}

/* flashed messages */

.flash-message {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 1.5rem;
    z-index: 101;
    background-color: #a6c46d;
    color: #f8fcf8;
    font-size: 110%;
    font-weight: bold;
    text-align: center;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    transition: opacity 0.5s;
}

.flash-message .inner {
    margin: 0 auto;
    max-width: 60rem;
}

.flash-message.error {
    background-color: #f00;
}

.flash-message.hidden {
    opacity: 0;
}


/* modal popups */

.modal-background {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 99;
    overflow: auto;
}

.modal {
    position: relative;
    border-radius: 3px;
    background: white;
    margin: 0.5rem;
    padding: 1.5rem 2rem 0.5rem 2rem;
    z-index: 5;
}

.modal-wide .container {
    padding: 0;
}

.modal h2 {
    margin-top: 0;
}

.modal .container {
    width: 100%;
    margin: 0;
}

.modal-close {
    color: #ddd;
    font-size: 18px;
    line-height: 28px;
    position: absolute;
    text-align: center;
    right: 6px;
    top: 6px;
    width: 28px;
    text-decoration: none;
    z-index: 500;
}

.modal-close:hover {
    color: #f0f0f0;
}


/* registry and gifts */

.registry-main {
    margin-top: 0;
}

.category {
    font-size: 2.5rem;
    font-weight: bold;
    color: #b21972;
    border-bottom: solid 1px #aaa;
}

.gift-name {
    font-weight: bold;
}

.gift-name a, .gift-name a:hover, .gift-name a:visited {
    text-decoration: none;
    color: #222;
}

.gift-quantity {
    color: #aaa;
    font-weight: bold;
}

.gift-price {
    padding-left: 2rem;
}

.gift-link {
    padding-left: 2rem;
}

.gift p {
    margin: 0 0 1.5rem 0;
}

.registry-message {
    margin: 3rem 0;
    font-style: italic;
}

.bought {
    color: #aaa;
    text-decoration: line-through;
}

.bought a {
    color: #aaa;
}

.bought-by {
    float: right;
    text-decoration: none;
    color: #222;
    font-style: italic;
}

.category-crossed {
    color: #aaa;
}

.registry-add-gift,
.registry-image button,
.registry-message button,
.gift-button,
.undo-button,
.main-sign-in button
{
    font-size: 1rem;
    padding: 0 1rem;
    line-height: 1rem;
    height: 2.3rem;
}

.gift-button {
    float: right;
    margin-left: 1rem;
}

.undo-button {
    float: right;
    border: none;
    color: #888;
    padding-right: 0;
}

.undo-button:hover {
    color: #333;
}

.registry-top {
    position: relative;
}

.registry-manage {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 50;
    margin: -2rem -1.2rem 0 0;
    width: 65px;
    height: 15px;
    padding: 3px 10px;
    color: #555;
    background-color: white;
    text-align: right;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .1rem;
    text-transform: uppercase;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
    white-space: nowrap;
    transition: width 0.25s, height 0.25s;
}

.registry-manage:hover {
    color: #333;
    border-color: #888;
}

.registry-manage .registry-manage-menu {
    transition: opacity 0.25s;
}

.registry-manage.closed .registry-manage-menu {
    opacity: 0;
    display: none;
}

.registry-manage.open {
    height: 11.8rem;
    width: 14.2rem;
}

.registry-manage.open .buttonText:after {
    content: ' ▲';
}

.registry-manage.closed .buttonText:after {
    content: ' ▼';
}

ul.registry-manage-menu {
    list-style-type: none;
    text-transform: none;
    font-size: 110%;
    font-weight: normal;
    margin: 0;
    padding: 0;
}

ul.registry-manage-menu li {
    margin: 0.75rem 0;
    padding: 0;
    text-indent: 0;
}

ul.registry-manage-menu li a {
    text-decoration: none;
}

ul.registry-manage-menu li a:hover {
    text-decoration: underline;
}

.registry-image {
    position: relative;
    margin-top: 2rem;
}

.registry-image button {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}

.registry-add-gift {
    float: right;
}


/* media CSS min-width overrides */

@media (min-width:400px) {

body.home {
    background-position: -195px 0;
}

.container {
    width: 100%;
    padding: 0 20px;
}

.home h1 {
    margin: 2rem 0 -1rem 0;
    font-size: 7rem;
}

}  /* end @media (min-width: 400px) */


@media (min-width: 518px) {

.home h1 {
    font-size: 7.5rem;
}

}  /* end @media (min-width: 518px) */


@media (min-width: 550px) {

.desktop {
    display: inline;
}
.mobile {
    display: none;
}

body.home {
    background-position: top;
    background-size: 1920px 775px;
}

.home h1 {
    margin: 4rem 0 2rem 0;
    font-size: 12rem;
}

.home .subtitle {
    margin: -1rem 0 10rem 0;
    font-size: 3.3rem;
}

.hero {
    margin-bottom: 20rem;
}

.hero-actions {
    margin: 11rem auto 0 auto;
    width: 56rem;
    height: 6rem;
    background: rgba(255, 255, 255, 0.6);
}

.hero .create-registry {
    margin: 0 0 0 1.3rem;
    float: left;
    text-align: center;
}

.hero .find-registry {
    float: right;
    margin: 0 1.3rem 0 0;
}

.hero .create-registry .button-subtext {
    color: #555;
}

.registry-admin button {
    margin-bottom: 4rem;
}

button {
    padding: 0 3rem;
}

.modal {
    width: 30rem;
    margin: 5% auto;
}

.modal-wide {
    width: 60rem;
}

.registry-image {
    margin: 0;
}

.scroll-down-arrow {
    display: block;
    position: absolute;
    left: 50%;
    bottom: -0.5rem;
    margin-left: -2.5rem;
    opacity: 0.6;
}

.registry-manage {
    margin: 0 0.8rem 0 0;
}

}  /* end @media (min-width: 550px) */


@media (min-width: 869px) {

.hero {
    margin-bottom: 35rem;
}

}  /* end @media (min-width: 870px) */


/* browser-specific fixes */

input:-ms-input-placeholder {
    color: #bba9a9;
}

textarea:-ms-input-placeholder {
    color: #bba9a9;
}
