﻿/* NECESSITIES */
body {
    background-color: #ededed;
}

a#systemdropdown-hb::after {
	display: none;
}

#frpcreatepage {
	font-size: 16px;
}

.transition {
        transition:all 0.4s;
    -moz-transition:all 0.4s;
    -o-transition:all 0.4s;
    -ms-transition:all 0.4s;
    -webkit-transition:all 0.4s;
}

.overlay {
    background: rgba(0,0,0,0.6);
    position: fixed;
    z-index: 20;
    display: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.relative {
    position:relative;
}

.clear{
    clear:both;
}

.bariolreg{
    font-family:"bariolreg";
}

.bariolbold{
    font-family:'bariolbold';
}

.center{
    text-align:center;
}


/* SEARCH */
.search-banner {
    padding: 20px 10px;
    background:#fff;
}

.frpcreate-search-wrap {
    max-width: 550px;
    margin: 0 auto;
    margin-top: 25px;
}

.searchbox {
    float: left;
    position: relative;
}

#frpcreatepage input#search-field {
    font-family: 'bariolbold';
    color: #667f90;
    padding: 12px;
    border-radius: 5px;
    box-shadow: none;
    border: 1px solid #d8d8d8;
    width: 100%;
    display: inline-block;
    vertical-align: middle;
}

.searchbox > span.fa-search:hover {
    background: #f47d32;
    color: #fff;
    transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    -o-transition:all 0.4s;
    -webkit-transition:all 0.4s;
}

.searchbox > span {
    font-size: 20px;
    display: inline-block;
    padding: 15px 15px;
    color: #333;
    top: 0;
    right: 15px;
    position: absolute;
    cursor: pointer;
    border-left: 2px solid #ececec;
    border-top-right-radius:5px;
    border-top-left-radius:5px;
    text-align: center;
    transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    -o-transition:all 0.4s;
    -webkit-transition:all 0.4s;
}

.searchbox {
    position: relative;
}

.refine {
    cursor:pointer;
    float: left;
    padding: 12px 0 !important;
    color: #333;
    font-family: 'bariolbold';
    text-align: center;
    border-radius: 5px;
    background: #ededed;
    border-bottom: 2px solid #dedede;
}
.refine > span {
    display: inline-block;
    vertical-align: middle;
}

.refine > span.fa {
    font-size: 9px;
    margin-left: 5px;
}

.frpcreate-search-wrap:after {
    clear: both;
    content: '';
    display: block;
}

.joincreate-wrap {
    text-align: center;
    margin: 30px auto 0;
    background: #f2f2f2;
    border-radius: 50px;
    max-width: 450px;
    border: 1px solid #f2f2f2;
}

.joincreate-wrap button.join-event {
    background: #f47d32;
    color: #fff;
    z-index: 2;
}

.joincreate-wrap button {
    padding: 10px 0;
    font-size: 16px;
    font-family: 'bariolbold';
    border-radius: 50px;
    position: relative;
    width: 49%;
    background:#f2f2f2;
}

.joincreate-wrap button.create-event {
    color: #1a3a49;
}


#charity-cause{

}

#join-create{
    display:none;
}





/* PAGINATION */

#frpcreatepage.ec-set div#completion {
    top: 10%;
    background: #f1f1f1;
}

#frpcreatepage .ec-o {
    background: #f5f5f5;
}

.pagination p.cause span,
#completion p.cause span {
    /*width: 10px;
    height: 13px;
    background: url(../../Content/images/cause-sprite.png) no-repeat;*/
    display: inline-block;
    background-position:0 0;
}

.pagination p.event span,
#completion p.event span {
    /*width: 9px;
    height: 11px;
    background: url(../../Content/images/event-sprite.png) no-repeat;*/
    display: inline-block;
    background-position:0 0;
}

#completion .toggles button.active {
    color: #f47d32;
    background: #fff;
}
#completion .toggles button {
    width: 49.5%;
    padding: 5px;
    font-size: 15px;
    font-family: 'bariolreg';
    color: #999;
    background: #e8e8e8;
}
#completion > div.content:after {
    clear: both;
    content: '';
    display: block;
}
#completion .content {
    background: #fff !important;
    margin-top:20px;
}

.pagination p.complete, .pagination p.pag-gap {
    cursor:default;
}
.pagination p.complete > span {
    font-size: 15px;
}
.pagination p > span {
    font-size: 13px;
    vertical-align: middle;
    margin-top: -3px;
    margin-right: 2px;
}
.pagination p.complete span {
    /*width: 12px;
    height: 12px;
    background: url(../../Content/images/done-sprite.png) no-repeat;*/
    display: inline-block;
    background-position:0 0;
}

.pagination p.event-has-id {
    color: #f47d32;
    pointer-events: none;
}
.pagination p.event-has-id span {
    display: inline-block;
    background-position: 0 -11px;
}
.pagination p.cause-has-id {
    color: #f47d32;
    pointer-events: none;
}
.pagination p.cause-has-id span {
    display: inline-block;
    background-position:0 -13px;
}

.pagination p.cause.active span {
    background-position:0 -13px;
}

.pagination p.event.active span {
    background-position:0 -11px;
}

.pagination p.complete.active span {
    background-position:0 -12px;
}
.pagination p.active {
    color: #f47d32;
}
.pagination {
    text-align: center;
    margin-bottom: 20px;
    max-width: 400px;
    margin: 0 auto 20px;
    border-bottom: 1px solid #ededed;
}
.pagination p {
    display: inline-block;
    font-family: 'bariolbold';
    padding: 5px;
    font-size: 16px;
    color: #1a3a49;
    height: 45px;
    cursor: pointer;
    border-bottom: 3px solid transparent;
}

.pagination p.cause:hover, .pagination p.event:hover {
    border-bottom: 3px solid #ccc;
}
div#frpcreatepage.cause-view p.cause {
    border-bottom: 3px solid #1a3a49 !important;
}

div#frpcreatepage.event-view p.event {
    border-bottom: 3px solid #1a3a49 !important;
}

.pagination p.current {
    border-bottom: 3px solid #1a3a49;
}

.pagination p.pag-gap {
    color:#d8e6f0;
}

.pagination p.disabled span {
    color: #bbbaba;
    opacity: 0.4;
}
.pagination p.disabled {
    color: #bbbaba;
}


#main-create-content {
    background:#ededed;
}

#main-create-content li{
   display:block;
}

/*CAUSE LIST*/
.cause-list {
    max-width: 1200px;
    /*min-height:500px;*/
    margin: 0 auto;
    position:relative;
}

.box {
    background: #fff;
    font-family: 'bariolreg';
    text-align: center;
    border-radius: 5px;
    margin: 10px 0 10px 0;
    cursor:pointer;
}

.box img {
    display: block;
    margin: 0 auto;
    width: auto;
    float: none;
    padding: 35px 15px;
    max-height: 100px;
}

.box span {
    padding: 15px;
    background: #f7f7f7;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

span.ch-name {
    padding: 0;
}

.suggested {
    padding: 20px;
    background: #91a4b3;
    display:block;
}

.suggested:after {
    clear: both;
    content: '';
    display: block;
}

div#cause-wrapper {
    padding: 20px;

}

h3.section-title {
    font-family: 'bariolbold';
    color: #fff;
    margin: 0 0 15px;
    font-size: 16px;
}

#event-list {

}
.k-listview {
    min-height: 650px;
}
.k-listview.endoflist {
    min-height: 0;
}
#event-list, .list-wrapper {
    margin:0 auto;
    max-width:1200px;
    padding:20px;
}

div#event-list:after {
    clear: both;
    display: block;
    content: '';
    border: 0;
}

div#events-by-charity-selected {
    border: 0;
}

/* COMPLETION */
div#completion > div {
    text-align: center;
    padding: 0;

}
div#completion {
    width: 100%;
    max-width: 385px;
    position: absolute;
    top: 5%;
    left: 50%;
    background: #f5f5f5;
    z-index: 100;
    border-radius: 5px;
    font-family: 'bariolbold';
    transform: translate(-50%,0);
    display:none;
}

#completion > div > p {
    padding: 5px 10px;
    color: #1a3a49;
}

#completion .item {
    padding: 0;
    background: #fff;
    margin: 0 0 10px 0;
}
.selected-charity .item {
    border-right: 1px solid #f0f0f0;
}


.item-img-wrap {
    min-height: 110px;
    max-height: 110px;
    position: relative;
}


#completion .item img {
    width: 80%;
    display: block;
    margin: 0 auto;
    padding: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

#completion .item p, #completion .item > span {
    background: #ffffff;
    padding: 10px;
    font-size: 16px;
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
}

.item-img-wrap {
    min-height:110px;
}

#completion .item-img-wrap {
    min-height: auto;
    max-height: none;
    position: relative;
    padding-top: 20px;
}

#completion .box-image {
    background-repeat: no-repeat;
    width: 85%;
    height: 120px;
    background-size: contain;
    background-position: center;
    margin: 0 auto 20px;
}

li#select-event {
    padding-bottom: 70px;
}


.refine.active {
    position: relative;
    z-index: 100;
}

.overlay.active {
    display:block;
}

.refine-filters p {
    text-align: center;
    margin-bottom: 20px;
}
.refine-filters h4 {
    text-align: center;
    font-family: 'bariolbold';
    color: #f47d32;
    padding: 15px 0;
    border-top: 1px dashed #f47d32;
    border-bottom: 1px dashed #f47d32;
    margin-bottom: 15px;
}
ul#search-results {
    position: absolute;
    z-index: 9999;
    top: 110%;
    color: #666363;
    background: #ededed;
    width: 94%;
    font-family: 'bariolreg';
    list-style-type: none;
    left: 50%;
    transform: translateX(-50%);
    max-height: 250px;
    overflow: auto;
    border-radius:0;

    display:none;
}

ul#search-results.search-border {
    border: 1px solid #cac7c7;
}
#search-results li {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
    background: #f6f6f6;
    transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -webkit-transition: all 0.4s;
}
#search-results li:last-child {
    border-bottom: 5px solid #ddd;
}

#search-results li:hover {
    background: #c1c1c1;
    color: #fff;
    transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -webkit-transition: all 0.4s;
}
ul#search-results.populated {
    border-top: 1px solid #c1c1c1;
    border-bottom: 5px solid #e8e5e5;

    display:block;
}



/* REFINE */
.refine-filters:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20px 20px 20px;
    border-color: transparent transparent #ffffff transparent;
    content: '';
    display: block;
    position: absolute;
    top: -6px;
    right: 25px;
}
.refine-filters {
    position: absolute;
    top: 125%;
    background: #fff;
    border-radius: 5px;
    z-index: 100;
    padding: 30px 30px;
    width: 100%;
    margin-top:0;
    display:none;
    font-family:"bariolreg";
}

.toggle h3 span {
    display:inline-block;
    vertical-align:middle;
}

.toggle.active {
    color:#f47d32;
}
.refine-filters.active {
    display:block;
}

.toggle span.fa {
    font-size: 8px;
    display: inline-block;
    vertical-align: middle;
}
.toggle {
    font-family: 'bariolbold';
    color: #1a3a49;
    padding:10px 0;
    cursor:pointer;
}

refine-filters > div {
    padding: 0;
}

.refine-filters > div > div {
    padding:10px 0;
}

.search-location span {
    position: absolute;
    top: 13px;
    right: 10px;
}
.search-location {
    position: relative;
}
input#refine-location {
    padding-right: 25px;
    padding: 10px 35px 10px 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
    width: 100%;
}
.refine-filters .year {
    margin-bottom: 10px;
}
.refine-filters button {
    background: transparent;
    border: 1px solid #dbdcde;
    font-family: 'bariolbold';
    padding: 5px 10px;
    border-radius: 50px;
    min-width: 80px;
    color: #395f6c;
    margin: 5px;
    cursor: pointer;
}


.charity-name span {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
    display: block !important;

    transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
}

.ch-name:hover{
    white-space:no-wrap;
    transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;

}

.box {
    border: 2px solid transparent;
    transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
}

.box:hover {
    border: 2px solid #f47d32;
    transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
}

div#charityList:after {
    clear: both;
    content: '';
    display: block;
}
div#charityList, 
div#event-list, 
#charities-by-event-selected,
#charities-by-event-selected {
    background: transparent;
    /*padding-bottom: 150px;*/
    padding-bottom:50px;
    border: 0;
}
#charities-by-event-selected:after {
    clear: both;
    content: '';
    display: block;
}
div#charities-by-event-selected {
    padding-bottom: 0;
}

.charity-item.col-md-3.col-sm-3.k-state-selected.selected {
    color: initial;
    background: none !important;
}

.charity-item,
.event-item {
    margin-top:0;
    opacity:1;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    transition: all 0.5s;
}

button#fbconnect img {
    display: inline-block;
    vertical-align: middle;
    margin-left: 2px;
    margin-top: -4px;
}
button#fbconnect {
    background: #3b5a9a;
    font-family: 'bariolbold';
    color: #fff;
    padding: 10px 20px;
    border-radius: 50px;
    margin: 20px 0;
    width: 75%;
    font-size: 16px;
}
div#signup-buttons {
    margin-bottom: 20px;
    margin-top: 20px;
}
div#signup-buttons button {
    width: 35%;
    margin: 5px;
    padding: 10px 10px;
    border-radius: 50px;
    font-family: 'bariolbold';
    font-size: 15px;
}
button#btnCreate {
    color: #fff;
    background: #f47d32;
    position: relative;
}

button#btnCreate.in-progress span, button#btnLoginCreate.in-progress span, button#btnRegisterCreate.in-progress span {
    color: #fff !important;
    position: relative;
}

button#btnCreate .save-progress {
    display: none;
    width: 15px;
    position: absolute;
    margin-top: 3px;
    margin-left: 5px;
}

button#btnCreate.in-progress .save-progress {
    display: inline;
}

#btnCancel {
    background: #e8e8e8;
}
#btnCancel span {
    color: #415d6e;
}
button[type="submit"] {
    background: #F47D32;
    color: #fff;
}
.or span.line {
    height: 1px;
    background: #989898;
    display: inline-block;
    width: 40%;
    border-bottom: 0;
    margin: 0;
    padding: 0;
}

#completion ul {
    margin: 15px 0 15px 0;
}
#completion input {
    width: 70%;
    border: 1px solid #dcdcdc;
    padding: 7px;
    font-family: 'bariolreg';
    font-size: 15px;
    border-radius: 5px;
    margin: 3px 0;
}

.or span {
    padding: 5px;
    display: inline-block;
    vertical-align: middle;
}
.or {
    width: 70%;
    margin-bottom:10px;
    margin:0 auto;
}

.box-image{
    background-repeat: no-repeat;
    width: 85%;
    height: 120px;
    background-size: contain;
    background-position: center;
    margin: 20px auto;
}

#frpcreatepage #completion p.cause, #frpcreatepage #completion p.event {
    border-bottom: 0 !important;
}

/*
#charityList .charity-item {
    display:none;
}*/


@media screen and (max-width:600px){


    .pagination p.cause {
    border-right: 1px solid #e4e4e4;
}
.pagination p {
    width: 48%;
}
.pagination p.complete {
    display: none;
}
.pagination p.pag-gap {
    display: none;
}


    .searchbox {
        padding-right: 10px !Important;
        padding-left: 0 !important;
        width:100% !important;
    }
}


@media screen and (max-width:767px){
    div#cause-wrapper {
        padding: 20px 15px;
    }
        #event-list, .list-wrapper {
        padding: 15px;
    }

    .suggested {
        padding:0;
    }
	
    .charity-item {
        margin: 5px 0 0 0 0;
        padding:5px !important;

    }

    .event-item {
        margin: 0px 0px;
        padding:5px !important;
    }

    .charity-name span {
        white-space: no-wrap;
        text-overflow: ellipsis;
        max-width: 100%;
        overflow: hidden;
        display: block !important;
    }

    #completion .item img {
        width: 80%;
        display: block;
        margin: 0 auto;
        padding: 20px;
        position: relative;
        top: 0;
        left: 0;
        transform: translate(0%,0%);
    }
    #completion .item-img-wrap {
        max-height: none;
    }
    div#completion {
        width: 90%;
        max-width: 600px;
        position: absolute;
        top: 5%;
        left: 50%;
        background: #f0f0f0;
        z-index: 100;
        border-radius: 5px;
        font-family: 'bariolbold';
        transform: translate(-50%,0%);
        display: none;
    }
}


.btt {
    position: fixed;
    bottom: 15px;
    right: 15px;
    font-size: 15px;
    padding: 10px;
    background: #f47d32;
    color: #fff;
    border-radius: 50px;
    width: 40px;
    text-align: center;
    cursor: pointer;
}

.k-loading-image {
    background: url(/Content/images/loader-orange.gif) 0 0 no-repeat !important;
    width: 25px;
    height: 25px;
    background-size: cover !important;
    background-color: transparent;
    position:absolute;
    left:50%;
    transform:translate(-50%,0);
}

.k-loading-color {
    background:transparent !important;
}
.k-state-selected .box {
    border-color: #f47d32 !important;
}

.k-state-selected {
    border-color: #f47d32 !important;
    background: transparent !important;
    color: #333 !important;
}

.lazy-loader {
    clear:both;
    opacity:0;
    width: 25px;
    height: auto;
    position: relative;
    left: 50%;
    margin-left: -12.5px;
    margin-top: 15px;
    margin-bottom: 15px;
}
    .lazy-loader img {
        width: 25px;
    }

.initial {
    margin-top:20px;
    opacity:0;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    transition: all 0.5s;
}
.initial-display{
    display:none;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    transition: all 0.5s;
}

.transition {
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    transition: all 0.5s;
}
/* --------------------------- 
    popup overlay
--------------------------- */
.popupoverlay {
    position: fixed;
    z-index: 9999999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
}

.overlay-message a#close-overlay-btn {
    margin: 20px auto 0;
    display: block;
    color: #006dff;
    text-decoration: underline;
    cursor: pointer;
    max-width: 100px;
}

.overlay-message a#continue-overlay-btn {
    color: #f47d32;
    text-decoration: none;
    display: block;
    margin: 30px auto;
    padding: 7px;
    border-radius: 50px;
    border: 1px solid #f47d32;
    max-width: 100px;
    text-align: center;
    background:transparent;

    transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    -webkit-transition:all 0.4s;
    -o-transition:all 0.4s;
}

.overlay-message a#continue-overlay-btn:hover {
    color: #fff;
    background:#f47d32;

    transition:all 0.4s;
    -moz-transition:all 0.4s;
    -ms-transition:all 0.4s;
    -webkit-transition:all 0.4s;
    -o-transition:all 0.4s;
}

.overlay-message img {
    display: block;
    margin: 0 auto;
}

.overlay-message {
    font-family: 'bariolreg';
    color: #fff;
    max-width: 400px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 15px;
}

@media screen and (max-width:360px){
    /*.charity-item, 
    .event-item {
        width: 100% !important;
        padding: 0 !important;
    }*/

    .charity-name span {
        /*white-space: normal;*/
        white-space:nowrap;
    }


}

div#coming-soon h4 {
    font-family: 'bariolbold';
    text-transform: uppercase;
    margin-top: 20px;
    font-size: 30px;
    color: #ffffff;
    max-width: 570px;
    margin: 0 auto;
    padding: 20px 0;
    border-top: 2px dashed #ccc;
    border-bottom: 2px dashed #ccc;
}

div#coming-soon p {
    font-family: 'bariolreg';
    font-size: 17px;
    margin-top: 10px;
    color: #fff;
    margin: 20px auto;
    max-width: 570px;
}

div#coming-soon {
    text-align: center;
    padding: 35px;
    background: #90a4b2;
    border-top: 1px solid #e0e0e0;
    min-height: 500px;
}
.joincreate-wrap.coming-soon .join-event {
    background: #ddd;
    color: #333;
}

.joincreate-wrap.coming-soon .create-event {
    background: #f47d32;
    color: #fff;
}

div#events-by-charity-selected:after{
    clear:both;
    display:block;
    content:'';
}

div#events-by-charity-selected{
background:transparent;
}

.event-item {
    min-height: 184px !important;
}

.charity-item {
    min-height: 184px !important;
}

div#all-events:after {
    clear: both;
    content: '';
    display: block;
}

.nav-overlay {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    z-index: 9;
}


.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    color: #797979;
    font-family: 'bariolreg';
}


#frpcreatepage.ec-set div#completion {
    top: 10%;
    z-index: 18;
    background: #f1f1f1;
}

#frpcreatepage.ec-set .nav-overlay.event-o, #frpcreatepage.ec-set .nav-overlay.system-o {
    z-index: 19;
    opacity: 0.5;
    background: rgb(0,0,0);
}

#frpcreatepage.ec-set .frpcreate-header {
    z-index: 20;
}
#completion.logged .content {
    background: #f1f1f1 !important;
    margin-top: 0;
}
#completion.logged button#btnCancel span {
    color: #929292;
}
#completion.logged #btnCancel {
    background: #fff;
    color: #f1f1f1;
}

p.notification-error {
    display: none;
    color: #f00 !important;
    font-family: 'bariolreg';
    width: 80%;
    margin: 5px auto;
    font-size: 15px;
}

/*div.gfr-state-error,
div.gfr-state-success {
    display:none !important;
}*/
div.gfr-state-success {
    display: none !important;
}

div.gfr-state-error .ui-icon, 
div.gfr-state-error .ui-widget-content .ui-icon {
    background-image: url(images/ui-icons_ffffff_256x240.png);
}

.ec-set #btnCancel {
    display: none;
}

.input-error {
    border-color: #ff464c !important;
}


@media screen and (max-width:410px) {
    #completion .toggles button {
        width: auto;
        padding: 10px 15px;
    }
}


div#frpcreatepage.event-set p.cause {
    cursor: auto;
    border-bottom: 3px solid transparent !important;
}

div#frpcreatepage.charity-set p.event {
    cursor: auto;
    border-bottom: 3px solid transparent !important;
}

#charity-search-result,
#event-search-result {
    padding:20px;
}

#charity-search-result, #event-search-result {
    height:100vh;
}

.clearing:after {
    clear: both;
    content: '';
    display: block;
}


.cancel-search {
    padding: 0px 15px 15px 15px;
    border-bottom: 1px dashed #a9a9a9;
    margin-bottom: 20px;
    font-family: 'bariolreg';
    font-size: 15px;
    color: #7d7d7d;
    cursor: pointer;
}

.cancel-search:hover {
    color:#f47d32;
}

.error-search {
    font-family: 'bariolreg';
    color: #1a3a49;
    text-align: center;
    font-size: 17px;
}

.charity-item,
.event-item {
    position:relative;
}

#frpcreatepage.ch-selected .charity-item.selected:hover::before,
#frpcreatepage.ev-selected .event-item.selected:hover::before{
    font-family:'icomoon';
    content:"\e773";
    display:block;
    position:absolute;
    top:25px;
    right:25px;
    font-size: 20px;
    color:#f47d32;
}

#frpcreatepage.ch-selected .charity-item:hover::before,
#frpcreatepage.ev-selected .event-item:hover::before {
    font-family:'icomoon';
    content:"\e65e";
    display:block;
    position:absolute;
    top:25px;
    right:25px;
    font-size: 20px;
    color:#f47d32;
}

 .charity-item:hover::before,
 .event-item:hover::before{
    font-family:'icomoon';
    /*content:"\eb4a";*/
    content: "\ee1e";
    display:block;
    position:absolute;
    top:25px;
    right:25px;
    font-size: 20px;
    color:#f47d32;
}

 .search-helper {
    font-family: 'bariolreg';
    padding: 10px 25px 0;
    color: #949494;
    font-size: 14px;
    display: none;
}

 .searchbox img.search-loader {
    position: absolute;
    top: 13px;
    right: 80px;
    width: 20px;
    display: none;
}


div#charityList.endoflist:after,
div#eventList.endoflist:after,
div#charity-search-result.endoflist:after,
div#event-search-result.endoflist:after,
div#event-list.endoflist:after {
    clear: both;
    content: 'End of list';
    display: block;
    text-align: center;
    font-family: 'bariolreg';
    border-top: 1px dashed #ccc;
    padding: 10px;
    border-bottom: 1px dashed #ccc;
}



@media screen and (max-width:420px){
    .search-helper {
        display:none !important;
    }


    li#select-charity {
        height: 100vh;
    }

    li#select-event {
        height: 100vh;
    }
}


input[type="date"] {
  -webkit-appearance: none;
  -moz-appearance: none;
}

li.forgot-pw-link {
    padding-top: 5px;
}

#completion li.error-text {
    margin-left: 0px !important;
}


body.ios #completion input#DateOfBirth,
body.android #completion input#DateOfBirth {
    background: #fff;
    min-height: 39px;
    color: #777;
    -webkit-appearance:none;
}

body.android #completion input#DateOfBirth:after {
    content: attr(placeholder) !important;
    color: #aaa;
    margin-left: -2em;
    display: inline;
}

body.ios #completion input#DateOfBirth:after {
    content: attr(placeholder) !important;
    color: #aaa;
    margin-left:-1em;
    display: inline;
}


body.android .overlay,
body.ios .overlay {
    height:200%;
}


.logged-in-as {
    padding: 15px 25px 0;
}
.logged-in-as p {
    font-family: 'bariol_regularregular';
    display: inline-block;
    font-size: 15px;
}
.logged-in-as span.sia {
    font-weight: bold;
}
.logged-in-as a.notyou {
    text-transform: lowercase;
    color: #f47d32;
    font-weight: bold;
}

.clist-error {
    font-family: 'bariolreg';
    color: #1a3a49;
    text-align: center;
    font-size: 17px;
    display:none;
}

div#charityList *, div#event-list *, 
#charities-by-event-selected *, 
#charities-by-event-selected * {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}