html, body{
    margin: 0;
    padding: 0;
}

#cc-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: white url('../resources/rolling.gif') no-repeat scroll center center;
}

.card.messages{
    margin-bottom: 40px;
}

#christmascard-template #container {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #ffffff url('../resources/kc_christmas_bg.jpg') no-repeat scroll 0 0;
    background-size: cover;
}

#christmascard-template #video-player {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1;
    min-width: 100%;
    min-height: 100%;
    max-width: none;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
}



#christmascard-template #greeting{
    display: block;
    position: absolute;
    width: 60%;
    top: 50%;
    left: 20%;
    z-index: 99;
    text-align: center;
}

#christmascard-template #greeting #name, #christmascard-template #greeting #from{
    color: #75787b;
    font-size: 5vmin;
    line-height: 8vmin;
    font-family: "Franklin Gothic Demi", Arial;
}

#christmascard-template.arial #greeting #name, #christmascard-template.arial #greeting #from{
    font-family: Arial, sans-serif;
}

#christmascard-template #greeting #message{
    color: #f71c1c;
    font-size: 12vmin;
    line-height: 1.1;
    text-transform: uppercase;
    font-family: "Franklin Gothic Heavy", "Arial Black", Arial, sans-serif;
}

#christmascard-template.arial #greeting #message{
    font-family: "Arial Black", Arial, sans-serif;
}

#christmascard-template #greeting #logo{
    margin-bottom: 100px;
}

#christmascard-template #logo img{
    max-width: 260px;
    position: relative;
    z-index: 99;
}

#christmascard-template #border{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    border: 40px solid white;
    box-sizing: border-box;
}

#christmascard-template #edge{
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 0;
    height: 0;
    z-index: 99;
    border-bottom: 100px solid white;
    border-right: 100px solid transparent;
}

#christmascard-template a.back-link{
    position: absolute;
    top: 60px;
    right: 60px;
    padding: 5px 10px;
    font-size: 20px;
    color: white;
    background: #75787b;
    text-transform: uppercase;
    z-index: 990;
}

#christmascard-template #controls .audio{
    position: absolute;
    bottom: 60px;
    right: 60px;
    width: 32px;
    height: 32px;
    z-index: 990;
    cursor: pointer;
}

#christmascard-template #controls .audio.on{
    background: url('../resources/soundon_basic.png') no-repeat scroll 0 0;
    background-size: cover;
}

#christmascard-template #controls .audio.on:hover{
    background: url('../resources/soundon_hover.png') no-repeat scroll 0 0;
    background-size: cover;
}

#christmascard-template #controls .audio.off{
    background: url('../resources/muted_basic.png') no-repeat scroll 0 0;
    background-size: cover;
}

#christmascard-template #controls .audio.off:hover{
    background: url('../resources/muted_hover.png') no-repeat scroll 0 0;
    background-size: cover;
}

.kc-christmas-card-settings .invitation .form-item textarea{
    height: auto;
}

.kc-christmas-card-settings .form-wrapper{
    margin-bottom: 50px;
}

.kc-christmas-card-settings .form-wrapper#edit-controls-submit{
    margin-top: 50px;
}

.kc-christmas-card-settings .form-wrapper .form-wrapper{
    margin-bottom: 0px;
    padding: 0px;
}

.kc-christmas-card-settings .form-wrapper input.form-submit{
    margin: 20px 20px 0 0;
}

body.not-logged-in.page-configure-seasons-greetings .messages {
    display: block;
}