.hide { display: none !important; }
.swal2-popup { font-size: 14px; }
.btn-circle { background-color: #0b583e; color: #ffffff !important; width: 40px; height: 40px; border-radius: 50%; display: flex; justify-content: center; align-items: center; padding: 0; }
.btn-circle:hover { background-color: #0f2e23; color: #ffffff; }
.btn-normal { color: #ffffff !important; border: 0; }
.btn-giftno { background-color: #0b583e !important; color: #ffffff !important; }
.btn-giftno:hover,
.btn-giftno:focus { background-color: #0f2e23; }
.btn-giftno[disabled] { background-color: #0b583e !important; opacity: .6 !important; cursor: not-allowed; }
.tooltip { font-size: 12px; }

.max-width-100 { max-width: 100% !important; }

.giftno .modal { padding: 0 !important; }
.giftno .modal-dialog.v-center { min-height: calc(100vh - 100px); display: flex; flex-direction: column; justify-content: center; overflow-y: auto; overflow-x: hidden; }
.giftno .modal-dialog.v-center .modal-header { padding: 15px; display: flex; align-items: center; }
.giftno .modal-dialog.v-center .modal-header .modal-title { font-size: 16px; }
.giftno .modal-dialog.v-center .modal-header button { font-size: 24px; padding: 0 20px; }
.giftno .modal-dialog.v-center .modal-body { padding: 15px; }
.giftno .modal-dialog.v-center .modal-footer button { border: 0; color: #ffffff; }

.giftno #page-title { text-align: center; position: relative; padding: 30px 0 50px; background-color: #f3f7ff; }
.giftno #login { margin: 30px 0; }

.giftno .giftno-form { max-width: 460px; margin: 0 auto; padding: 0 20px; }
.giftno .giftno-form .error { color: red; margin-bottom: 5px; }
.giftno .giftno-form .button { color: #ffffff; margin: 15px 0; font-size: 16px; font-weight: 700; letter-spacing: 0; padding: 13.5px 35px; line-height: 1em; transition: ease-in 0.2s color, ease-in 0.2s background; }
.giftno .giftno-form input[type="text"], 
.giftno .giftno-form input[type="email"], 
.giftno .giftno-form input[type="url"], 
.giftno .giftno-form input[type="password"], 
.giftno .giftno-form input[type="search"], 
.giftno .giftno-form input[type="number"], 
.giftno .giftno-form input[type="tel"], 
.giftno .giftno-form input[type="range"], 
.giftno .giftno-form input[type="date"], 
.giftno .giftno-form input[type="month"], 
.giftno .giftno-form input[type="week"], 
.giftno .giftno-form input[type="time"], 
.giftno .giftno-form input[type="datetime"], 
.giftno .giftno-form input[type="datetime-local"], 
.giftno .giftno-form input[type="color"], 
.giftno .giftno-form textarea { -webkit-backface-visibility: hidden; background: #fff; border: solid 1px #ccc; box-sizing: border-box; outline: none; padding: 0.36rem 0.66rem; -webkit-appearance: none; outline-offset: 0; border-radius: 0; width: 100%; margin: 10px 0; }
.giftno .giftno-form button,
.giftno .giftno-form input,
.giftno .giftno-form select,
.giftno .giftno-form optgroup,
.giftno .giftno-form textarea { color: #000; font-weight: 400; line-height: 1.8; text-rendering: optimizeLegibility; }
.giftno .giftno-form textarea { height: 150px; resize: none; }
.giftno .giftno-form p { margin: 0; }
.giftno .giftno-form .button { background-color: #0b583e; }
.giftno .giftno-form .button:hover { background-color: #0f2e23; color: #ffffff; }


#giftno-profile #profiling { position: relative; }
#giftno-profile #profiling .cover-photo { position: relative; background-size: cover; height: 312px; background-position: center; background-repeat: no-repeat; }
#giftno-profile #profiling .cover-photo .overlay { height: 312px; background-image: linear-gradient( to top, rgba(60, 60, 60, 0.70196) 0%, rgba(0, 0, 0, 0) 80%); }
#giftno-profile #profiling .cover-photo .btn-edit-cover { position: absolute; bottom: 10px; right: 10px; z-index: 1; }
#giftno-profile #profiling .cover-photo #cover-photo { display: block; margin: auto; max-width: 100%; width: auto; }

#giftno-profile #profiling .profile { position: relative; margin: auto; margin: -130px 0 0 20px; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; }
#giftno-profile #profiling .profile .photo { position: relative; width: 180px; height: 180px; }
#giftno-profile #profiling .profile .photo img { background-color: #ffffff; width: 180px; height: 180px; border-radius: 50%; border-width: 5px; border-style: solid; border-color: rgba(255, 255, 255, 0.5); border-image: initial; object-fit: cover; }
#giftno-profile #profiling .profile .photo .btn-edit-photo { position: absolute; bottom: 15px; right: 10px; z-index: 1; }
#giftno-profile #profiling .profile .info { position: absolute; left: 200px; bottom: 32%; max-width: 450px; font-size: 24px; line-height: 1.2; font-weight: 600; color: white; }
#giftno-profile #profiling .profile #profile-photo { display: block; margin: auto; max-width: 100%; width: auto; }

#giftno-profile #profiling .navigations ul li a { background: #0b583e; color: #fff; border-radius: 0; padding: 10px 20px; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; }
#giftno-profile #profiling .navigations ul li a:hover { background: #122d26; }
@media (max-width: 767px) {
    #giftno-profile #profiling .cover-photo, #giftno-profile #profiling .cover-photo .overlay { height: 230px; }
    #giftno-profile #profiling .profile { margin: -90px 0 0 0; justify-content: center; flex-direction: column; align-items: center; }
    #giftno-profile #profiling .profile .photo { display: flex; }
    #giftno-profile #profiling .profile .photo img { margin: auto; }
    #giftno-profile #profiling .profile .info { position: relative; left: 0; bottom: 0; color: #000000; margin: 15px 0; }
}

#giftno-profile #profiling .navigations { position: absolute; bottom: 0; width: 100%; margin: 1.5% 0; }
#giftno-profile #profiling .navigations ul { list-style: none; padding: 0; margin: 0; text-align: right; }
#giftno-profile #profiling .navigations ul li { display: inline-block; padding: 0 15px; border-right: 1px solid black; }
#giftno-profile #profiling .navigations ul li:first-of-type { padding-left: 0; }
#giftno-profile #profiling .navigations ul li:last-of-type { padding-right: 0; border-right: 0; }
@media (max-width: 767px) {
    #giftno-profile #profiling .navigations { position: relative; }
    #giftno-profile #profiling .navigations ul { text-align: center; }
}

#giftno-raffles { margin: 50px 0; }
#giftno-raffles .card .card-body img { width: 120px; }

#giftno-raffle-single .giftno-raffle-data { max-width: 280px; overflow: hidden; margin: 50px auto; }
#giftno-raffle-single .giftno-raffle-data::before { background: rgba(0,0,0,0) url(../images/laptop.png) no-repeat scroll 0 0; content: ""; display: block; width: 320px; background-repeat: no-repeat; background-size: 100% auto; border: 0; height: 0; left: 50%; margin: 0; padding-top: 550px; pointer-events: none; position: absolute; top: 50%; transform: translate3d(-50%,-50%,0); transition: ease all .3s; }
#giftno-raffle-single .giftno-raffle-data:not(.animated) .greet { opacity: 0; transform: scale(0); }
#giftno-raffle-single .giftno-raffle-data .giftno-confetti { position: absolute; left: 0; z-index: 9999; height: 100%; }
#giftno-raffle-single .giftno-raffle-data .greet { text-align: center; font-size: 28px; font-weight: bold; transition: cubic-bezier(.59, .11, .21, 1.28) all 0.8s; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout { position: relative; top: 10px; left: 5px; z-index: 1; display: flex; align-items: center; justify-content: center; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout td { padding: 10px; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout td .roller { position: relative; height: 300px; width: 250px; box-shadow: 0 0 5px 0 black; background-repeat: no-repeat; background-size: cover; background-position: top; text-align: center; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout td .roller .name { background-image: linear-gradient( to top, rgba(0,0,0,0.70196) 0%, rgba(0,0,0,0) 100%); color: white; position: absolute; bottom: 0; width: 100%; padding: 10px; font-weight: bold; }
#giftno-raffle-single .giftno-raffle-data #btn-giftno-roll { width: 150px; display: block; margin: auto; color: #ffffff; z-index: 9999; position: relative; }

/*temporary*/
.single-giftno-raffle { padding: 0 !important; }
.single-giftno-raffle #header { position: relative !important; }
.single-giftno-raffle #page-title { display: none; }
#giftno-raffle-single .giftno-raffle-data { max-width: 440px !important; }
#giftno-raffle-single .giftno-raffle-data::before { width: 90% !important; top: 50% !important; height: 100%; padding: 0 !important; }
#giftno-raffle-single .giftno-raffle-data .greet { margin-top: 10px !important; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout td .roller { height: 400px !important; width: 420px !important; }
#giftno-raffle-single .giftno-raffle-data #raffle-table #loadout td .roller .name { font-size: 26px; }
/*temporary*/

.default-list { margin: 20px 0; }
.default-list .entry { margin: 10px 0; }
.default-list .entry .card-body { padding: 16px; }
.default-list .entry .card-body img { width: 120px; }
.default-list .entry .card-body .card-title { font-size: 14px; margin: 6px 0; height: 50px; }
.default-list .entry .card-body .links { display: flex; align-items: center; justify-content: center; }
.default-list .entry .card-body .links a,
.default-list .entry .card-body .links button { margin: 0 10px; }

/*.giftno-searchbox { position: relative; margin: 0; padding: 0; max-width: 262px; }*/
.giftno-searchbox { position: relative; margin: 0; padding: 0; }
.giftno-searchbox input { font-weight: 600 !important; background-color: #1d222c !important; color: #fff !important; width: 100% !important; padding: 10px 48px 10px 18px !important; border: 0 !important; border-radius: 42px !important; }
.giftno-searchbox button { background-color: transparent; padding: 0; position: absolute; font-size: 14px; top: 50%; transform: translateY(-50%); transition: ease-in 0.15s all; right: 20px; color: #ffffff !important; }
.giftno-searchbox button:hover { color: #5cc7f2; transform: translateY(-50%) scale(1.5); }
.giftno-searchbox.with-clear input { padding-right: 60px !important; }
.giftno-searchbox.with-clear button#search { right: 35px; }
.giftno-searchbox.with-clear button#clear { right: 15px; }

.btn-group-fab { position: fixed; width: 50px; height: auto; right: 10px; bottom: 20px; z-index: 999; }
.btn-group-fab .btn { position: absolute; bottom: 0; border-radius: 50%; margin-bottom: 4px; width: 40px; height: 40px; margin: 4px auto; }
.btn-group-fab .btn-main { width: 50px; height: 50px; right: 50%; margin-right: -25px; z-index: 9; padding: 0; background-color: #0f6fb8; color: #ffffff !important; }
.btn-group-fab .btn-sub { bottom: 0; z-index: 8; right: 50%; margin-right: -20px; -webkit-transition: all 2s; transition: all 0.5s; padding: 0; }
.btn-group-fab.active .btn-sub:nth-child(2) { bottom: 60px; }
.btn-group-fab.active .btn-sub:nth-child(3) { bottom: 110px; }
.btn-group-fab.active .btn-sub:nth-child(4) { bottom: 160px; }
.btn-group-fab .btn-sub:nth-child(5) { bottom: 210px; }


/*custom checkbox and radio button*/
.checkbox .cr,
.radio .cr { position: relative; display: inline-block; border: 1px solid #a9a9a9; border-radius: .25em; width: 1.4em; height: 1.2em; float: left; margin-right: .5em; }
.radio .cr { border-radius: 50%; }
.checkbox .cr .cr-icon,
.radio .cr .cr-icon { position: absolute; font-size: .8em; line-height: 0; top: 50%; left: 20%; }
.radio .cr .cr-icon { margin-left: 0.04em; }
.checkbox label, .radio label { padding-left: 0; display: flex; align-items: center; cursor: pointer; }
.checkbox label input[type="checkbox"],
.radio label input[type="radio"] { display: none; }
.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon { transform: scale(3) rotateZ(-20deg); opacity: 0; transition: all .3s ease-in; }
.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon { transform: scale(1) rotateZ(0deg); opacity: 1; }
.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr { opacity: .5; }
.radio label input[type="radio"] + img { border: 0; opacity: 1; }
.radio label input[type="radio"] + img:hover,
.radio label input[type="radio"]:checked + img { border: 1px solid white; opacity: 0.6; }

/*EMPTY STATES*/
.giftno-empty-state { display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 50px 0; text-align: center; }
.giftno-empty-state .empty-icon { font-size: 40px; }