@import url(https://fonts.googleapis.com/css?family=Open+Sans&subset=latin,latin-ext);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css);
*:focus {outline-color: transparent!important;}
.main {min-height: calc(100vh - 8.8rem - 8.8rem);}
.button--medium {border-radius: 0.4rem}
a{
    text-decoration: none;
    color:#ff8e8e;
}
.email_info {
    color: #a6a6a6;
    text-align: center;
    display: block;
    font-size: 13px;
    margin-bottom: 20px;
}
h1 {
    text-align: center;
}
.finished_share {
    margin-top: 65px;
    margin-bottom: -30px;
}

button[disabled]{
    cursor:not-allowed;
}
.szabadelocsolni {
    display: block;
    text-align: center;
    color: #e86362;
    font-size: 3rem;
    font-weight: bold;
}
label {
    display: block;
    margin-bottom: 15px;
}

span.errmsg {
    color:red;
    display: none;
}

.has_error span.errmsg {
    display: block;
}

.sprinkled {
    margin-top: 4.2rem;
    display: none;
    text-align: center;
}

.responses {
    overflow: hidden;
    margin-top: 30px;
    margin-left: -10px;
}

.response textarea {
    width: 100%;
    height: 70px;
}

.response {
    margin-top: 4.2rem;
}

.response .intro__subtitle {
    margin-bottom: 2rem;
}

.response button {
    margin-top: 2rem;
}

.responses .list {
    float: left;
    width: 170px;
    margin-right: 20px;
    max-height: 540px;
    overflow: hidden;
    overflow-y: scroll;
    padding-right: 20px;
}

.response_holder {
    background: #f6c1c0;
    padding: 5px;
    cursor: pointer;
    margin-bottom: 10px;
    border-radius: 0.8rem;
    line-height: 1.2;
    text-align: center;
    overflow: hidden;
    color: #fff;
}

@media (max-width: 560px){
    .responses .list {
        width: 100%;
        max-height: initial;
        overflow: auto;
        padding: 0;
        margin: 0;
        float: none;
    }
    .details {
        display: none!important;
    }
    .responsedisplay.show {
        display: block;
        width: calc(100% - 0px);
        margin-bottom: 30px;
        padding: 0px 20px;
        float: none;
        overflow: hidden;
    }

}
.response_holder.active {
    background-color: #e86362;
}

.response_holder.is_new {
    /*font-weight: bold;*/
}

.response_holder .message, .response_holder .poem, .response_holder .attachment {
    display: none;
}

.response_holder .name {
    font-weight: bold;
    word-break: break-word;
}
.response_holder .created {
    font-size: 1.3rem;
}

.responsedisplay {
    display: none;
    float: left;
    width: 330px;
}
.responsedisplay .name {
    color: #e86362;
    font-weight: bold;
    word-break: break-word;
    display: block;
    font-size: 3rem;
}
.responsedisplay .created {
    display: block;
    color: #A6A7A6;
    margin-bottom: 10px;
}
.responsedisplay .poem {
    display: block;
    font-family: "DancingScript", serif;
    word-break: break-word;
    font-weight: 700;
    font-size: 2.4rem;
    line-height: 1.5;
    color: #2e76b9;
    margin-top: 0;
    margin-bottom: 1.2rem;
}
.responsedisplay .message {
    color: #e86362;
    word-break: break-word;
    font-size: 2rem;
}
.responsedisplay .attachment {
     max-width:100%
}
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}
.preview_img {
    max-width: 100%;
    max-height: 130px;
    margin: 0 auto;
    border: 0.2rem solid #f6c1c0;
    border-radius: 0.8rem;
    margin-bottom: 15px;
}
#img_selected {
    margin-bottom: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border:0;
    height: 100%;
}
.share_options {
    display: none;
    text-align: center;
}
.shareurl {
    background: #e86362;
    border-color: #e86362;
    font-size: 15px;
    color: white;
    text-align: center;
    margin-bottom: 15px;
    cursor: pointer;
    padding: 10px 0;
}
.shareurl:after {
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f0c5";
    color: white;
    margin-left: 7px;
}
.btw_branches {text-align: center;}
@media (max-width: 460px){
    .btw_branches {
        margin-left: -15px;
        margin-right: -15px;
    }
}
.btw_branches .inner {
    display: inline-block;
    margin: 0 10px;
    vertical-align: top;
    padding-top: 19px;
    max-width: calc(100% - 150px);
    overflow: hidden;
}
.btw_branches .inner .intro__title {
    word-break: break-word;
}
.btw_branches:before {
    background: url(../img/leaf_left.png);
}
.btw_branches:after {
    background: url(../img/leaf_right.png);
}
.btw_branches:before, .btw_branches:after {
    content: " ";
    width: 60px;
    height: 103px;
    background-size: 100%;
    top: 0;
    display: inline-block;
}
.smallintro .intro__subtitle {font-size: 2rem;}
.smallintro .intro__title{
    margin-bottom: 0;
    padding-bottom: 0.5rem;
    font-size: 3rem;
}
.own_poem {
    margin-left: 10px;
}
span.uploadinfo {
    /*color: #a7a7a9;*/
    color: #a6a6a6;
    font-size: 1.3rem;
    margin-bottom: 10px;
}
.smallintro .intro__title::after {display: none;}
.allow_button {text-align: center;}
.fieldset.read_poem .decor, .allow_button .decor {display: block;}
.blink_fast {
  animation: blinker .5s linear infinite;
}
@keyframes blinker {
    50% {
        background: #64586E;
    }
}
textarea[name=poem]{
    max-height: 350px;
}
.charcounter{
    text-align: center;
    color: #e86362;
    margin-top: 30px;
}
.read_poem {
    text-align: center;
}
.read_poem p {
    font-family: "DancingScript", serif;
    word-break: break-word;
    font-weight: 700;
    font-size: 2.4rem;
    line-height: 1.5;
    color: #2e76b9;
    margin-top: 0;
    margin-bottom: 4.2rem;
}
.attachment_img {
    margin: 0 auto;
    border: 0.2rem solid #f6c1c0;
    margin-bottom: 2rem;
    border-radius: 0.8rem;
    max-width: 100%;
    max-height: 310px;
}
.intro__subtitle {font-size: 2.4rem;}
.btw_branches img {
    border-radius: 100%;
    width: 102px;
    margin: 0px 30px;
}

.ui-widget {font-size: 1.6rem!important;}
.ui-datepicker-buttonpane {display: none;}
.dataTables_wrapper {font-size: 1.1rem;}
table.dataTable, .dataTables_scrollHeadInner {width: 100%!important;}
table.dataTable thead th {text-align: left;}
#gif-list {
    list-style: none;
    display: block;
    background-color: #2c2c34;
    overflow-y: auto;
    max-height: 300px;
    padding: 8px 0px 0px 0px;
    margin: 0;
    width: 400px;
    text-align: center;
    border: 0.2rem solid #f6c1c0;
    border-radius: 0.8rem;
    overflow: hidden;
    overflow-y: auto;
    margin-top: 0.8rem;
    width: 100%;
    background: white;
}

#gif-list li {
    width:120px;
    display:inline-block;
}

#gif-list li img {
    width: 107px;
    height: 74px;
    cursor: pointer;
}

#gif-list li a {
    text-align: center;
    display: block;
}


.fieldset--backdrop{
    position:relative;
}
.confirm-layer{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background: rgba(255,142,142,0.9);
    color: #fff;
    border-radius: 10px;
    z-index: 100;
    font-size: 2.4rem;
    padding: 25% 10px;
}
.cblabel {
    color: #a6a6a6;
    display: block;
    font-size: 15px;
    display: inline-block;
    padding-right: 10px;
    white-space: nowrap;
}
.cblabel input, .cblabel span {
    vertical-align: middle;
}
.irokmegegyet {
    display: block;
    margin: 0 auto;
    margin-top: 3rem;
}

.progress-bar {
    display: none;
}
p.shareinfo {
    font-size: 1.5rem;
    line-height: 1.25;
    color: #a6a6a6;
    margin-top: -1rem;
}
.besociallink {
    display: block;
    color: white;
    margin: 0 auto;
    width: 100px;
    text-align: center;
    margin-bottom: 20px;
}
.button--outline {
    vertical-align: bottom;
    background: white;
    border: 2px solid #e54d4c;
}
.button--outline .button__label {
    color: #e86362;
}
.button--outline:hover {
    background-color: #ffefe7;
}

/* MODAL */
.remodal-bg.remodal-is-opening,.remodal-bg.remodal-is-opened{-webkit-filter:blur(3px);filter:blur(3px)}.remodal-overlay.remodal-is-opening,.remodal-overlay.remodal-is-closing{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.remodal-overlay.remodal-is-opening{-webkit-animation-name:remodal-overlay-opening-keyframes;animation-name:remodal-overlay-opening-keyframes}.remodal-overlay.remodal-is-closing{-webkit-animation-name:remodal-overlay-closing-keyframes;animation-name:remodal-overlay-closing-keyframes}.remodal-wrapper{padding:10px 10px 0}.remodal{-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;margin-bottom:10px;padding:35px;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);color:#2b2e38;background:#fff}.remodal.remodal-is-opening,.remodal.remodal-is-closing{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.remodal.remodal-is-opening{-webkit-animation-name:remodal-opening-keyframes;animation-name:remodal-opening-keyframes}.remodal.remodal-is-closing{-webkit-animation-name:remodal-closing-keyframes;animation-name:remodal-closing-keyframes}.remodal,.remodal-wrapper:after{vertical-align:middle}.remodal-close{position:absolute;top:0;left:0;display:block;overflow:visible;width:35px;height:35px;margin:0;padding:0;cursor:pointer;-webkit-transition:color .2s;transition:color .2s;text-decoration:none;color:#95979c;border:0;outline:0;background:transparent}.remodal-close:hover,.remodal-close:focus{color:#2b2e38}.remodal-close:before{font-family:Arial,"Helvetica CY","Nimbus Sans L",sans-serif !important;font-size:25px;line-height:35px;position:absolute;top:0;left:0;display:block;width:35px;content:"\00d7";text-align:center}.remodal-confirm,.remodal-cancel{font:inherit;display:inline-block;overflow:visible;min-width:110px;margin:0;padding:12px 0;cursor:pointer;-webkit-transition:background .2s;transition:background .2s;text-align:center;vertical-align:middle;text-decoration:none;border:0;outline:0}.remodal-confirm{color:#fff;background:#81c784}.remodal-confirm:hover,.remodal-confirm:focus{background:#66bb6a}.remodal-cancel{color:#fff;background:#e57373}.remodal-cancel:hover,.remodal-cancel:focus{background:#ef5350}.remodal-confirm::-moz-focus-inner,.remodal-cancel::-moz-focus-inner,.remodal-close::-moz-focus-inner{padding:0;border:0}@-webkit-keyframes remodal-opening-keyframes{from{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}}@keyframes remodal-opening-keyframes{from{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}}@-webkit-keyframes remodal-closing-keyframes{from{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(0.95);transform:scale(0.95);opacity:0}}@keyframes remodal-closing-keyframes{from{-webkit-transform:scale(1);transform:scale(1);opacity:1}to{-webkit-transform:scale(0.95);transform:scale(0.95);opacity:0}}@-webkit-keyframes remodal-overlay-opening-keyframes{from{opacity:0}to{opacity:1}}@keyframes remodal-overlay-opening-keyframes{from{opacity:0}to{opacity:1}}@-webkit-keyframes remodal-overlay-closing-keyframes{from{opacity:1}to{opacity:0}}@keyframes remodal-overlay-closing-keyframes{from{opacity:1}to{opacity:0}}@media only screen and (min-width:641px){.remodal{max-width:700px}}.lt-ie9 .remodal-overlay{background:#2b2e38}.lt-ie9 .remodal{width:700px}
.remodal-is-locked{overflow:hidden;-ms-touch-action:none;touch-action:none}.remodal,[data-remodal-id]{display:none}.remodal-overlay{position:fixed;z-index:9999;top:-5000px;right:-5000px;bottom:-5000px;left:-5000px;display:none}.remodal-wrapper{position:fixed;z-index:10000;top:0;right:0;bottom:0;left:0;display:none;overflow:auto;text-align:center;-webkit-overflow-scrolling:touch}.remodal-wrapper:after{display:inline-block;height:100%;margin-left:-0.05em;content:""}.remodal-overlay,.remodal-wrapper{-webkit-backface-visibility:hidden;backface-visibility:hidden}.remodal{position:relative;outline:0;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}.remodal-is-initialized{display:inline-block}
.remodal-confirm, .remodal-cancel {height: auto;}
.remodal-neutral {padding: 0 30px!important;color: #555!important;font-size: 11px!important;font-weight: 600!important;line-height: 38px!important;background-color: rgba(0, 0, 0, 0)!important;border: 1px solid #bbb!important;}
.remodal-neutral:hover {color: #333!important;border-color: #888!important;}
.remodal-blur {-webkit-filter: blur(3px);filter: blur(3px);}
.remodal-failure {color:#c94e50!important;}
.remodal-success {color:#4DC65D!important;}
.remodal-overlay{background:rgba(43,46,56,0.9)}