html {
    scroll-behavior: smooth;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 1rem;
}

.mt-50{
    margin-top: 50px;
}

.centered{
    text-align: center;
}

#site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    -webkit-box-shadow: 0 1px 0 0 rgba(34, 46, 58, .1);
    box-shadow: 0 1px 0 0 rgba(34, 46, 58, .1);
    background: #fff;
}

#site-header .logo{
    margin-right: 20px;
}

#site-header .container {
    height: 56px;
}

#site-header #main-menu {
    display: inline-block;
    border-left: 1px solid #33333329;
    height: 40px;
    padding-top: 10px;
    margin-top: 10px;
    padding-left: 20px;
}

#site-header #main-menu ul li:not(:last-child) {
    margin-right: 25px;
}

#site-header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

#site-header ul a {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.2px;
    color: #222e3a;
}

#site-header a,#site-header a:hover,#site-header a:focus{
    font-weight: 700;
    text-decoration: none;
    -webkit-transition: all .5s;
    transition: all .5s;
}
#site-header a:hover {
   color: #178a9e !important;
}

.main{
    min-height: 100vh;
    margin-top: 56px;
}

#footer {
    position: relative;
    background: #222e3a;
    min-height: 200px;
    color: #fff;
}

#footer .copyright{
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
#footer hr{
    border-color: #8e8e8e;
}

.bg-gradient {
    background-image: linear-gradient(246deg,#1f3c6a,#178a9e 50%,#1bb4b7);
    /*height: 600px;*/
    color: #fff;
}

.first{
    background: url("../img/first.svg");
    height:550px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.pre_title{
    margin: 10px 10px 50px 10px;
    text-align: center;
}

.occasions{
    margin-right: -5px;
    margin-left: -5px;
    margin-bottom: 50px;
    margin-top: 30px;
    text-align: center;
}

.occasions .occasion{
    display: inline-block;
    margin: 10px 5px;
    width: auto;
    border-radius: 20px;
    border: 2px solid #fff;
    padding: 5px 10px;
    font-size: 16px;
    font-weight: 500;
    transition: 100ms ease-in;
}

.occasions a{
    text-decoration: none;
}

.occasions a .occasion {
    text-decoration: none;
    color: #fff;
}

.occasions .occasion:hover{
    background-color: #fff;
    color: #197791;
    cursor: pointer;
    transition: 100ms ease-out;
}

.arrow{
    width: 40px;
    height: 40px;
    background: url("../img/down-arrow.svg");
    background-size: contain;
    margin:  0 auto;
    margin-bottom: 50px;
}

.wishes-page #occasion{
    margin-top: 50px;
}

.wishes-page .wishes{
    margin:50px 0;
}

.wishes-page .wishes .wish{
    /*border: 2px solid #197791;*/
    color: #197791;
    padding: 10px 20px;
    display: inline-block;
    border-radius: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: normal;
    text-align: center;
    width: 100%;
}

.wishes-page .wishes .wish a{
    color: inherit;
    text-decoration: none;
}

.wishes-page .wishes .wish-delimiter hr{
    border: none;
    background: url("../img/delimiter.svg");
    width: 200px;
    height: 15px;
    display: block;
    margin: 0 auto;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.8;
}

.no-decorate{
    color: inherit;
    text-decoration: none;
}

.wish-page{
    min-height: 300px;
}

#wish-cover{
    background: url("../img/smile.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 290px;
}

#wish{
    font-size: 18px;
    padding-top: 100px;
    font-weight: 500;
}

.wish-page{
    padding-top: 20px;
    padding-bottom: 20px;
}

.occasions .occasion.active{
    background-color: #fff;
    color: #197791;
    cursor: pointer;
    transition: 100ms ease-out;
}

.footer-menu{
    padding-top: 20px;
}

.footer-menu h3{
    text-align: left;
    padding-left: 20px;
    color: #d3d3cd;
}

.footer-menu nav ul{
    list-style: none;
    padding-left: 25px;

}

.footer-menu nav ul li a{
    color: #d3d3cd;
    text-decoration: none;
    padding: 10px 0;
}

.navbar-toggler i{
    font-size: 28px;
    padding-top: 10px;
}

.navbar-collapse{
    margin-top: 50px;
    background: #fff;
    height: calc(100vh - 50px);
}

.navbar-collapse.colapsing{
    animation-duration: 0.11s;
    transition-duration: 0.11s;
}

.navbar-collapse ul{
    display: block!important;
}

.navbar-light{
    margin: 0 -16px;
}

.navbar-collapse ul li{
    text-align: center;
}

#site-header .navbar-collapse ul li a{
    font-size: 20px;
    padding: 15px;
}

.wish i.fa{
    font-size: 24px;
    color: #fff;
}

.wish .copy-block{
    width: auto;
    max-width: 500px;
    margin:  0 auto;
    text-align: center;
    background: rgba(25, 119, 145, 0.53);
    border-radius: 15px;
    padding: 10px;
    margin-top: 20px;
    transition-property: background;
    transition-duration: 0.25s;
    box-shadow: 2px 2px 8px rgba(128, 128, 128, 0.39);
}

.wish .copy-block:hover{
    background: rgba(25, 119, 145, 1);
    transition-property: background;
    transition-duration: 0.25s;

}

.wish .copy-block a{
    margin: 10px;
    cursor: pointer;
}

.wish .copy-block a:hover .fa{
    opacity: 0.9;
}

.wish .copy-block .likes{
    color: #fff;
    margin-left: 5px;
}

.link-wish{
    color:#fff!important;
}

.f-head{
    font-size: 20px;
    text-align: left;
    margin-left: 25px;
    color: #fff;
}

.category-description{
    font-size: 16px;
    text-align: center;
    font-weight: 500;
    margin-top: 50px;
}

@media screen and (max-width: 768px){
    .wish .copy-block{
        width: auto;
    }

    .first {
        height: 250px;
    }

    #wish{
        padding-top: 20px;
    }
}

@media screen and (min-width: 768px){
    .navbar-collapse.collapse{
        display: none!important;
        visibility: hidden !important;
    }

    .navbar-collapse.collapse.in{
        display: block!important;
        visibility: visible !important;
    }
}




/*cookie*/


/*coockie*/

.info-wrap {
    height: 75px;
    background-color: white;
    -webkit-box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999999;
}

@media only screen and (max-width:900px){
    .info-wrap{height:140px!important;}
    .info-wrap .elem-wrap {height:70px !important;}

}

.info-wrap-notify {
    height: auto;
    background-color: #f6f6f6;
    -webkit-box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 21px -5px rgba(0,0,0,0.3);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999999;
}
.elem-wrap-btn{
    padding-bottom: 10px;
}

.info-wrap .elem-wrap ,.info-wrap-notify .elem-wrap{
    height: 80px;
    display: block;
    align-items: center;
    justify-content: flex-start;
    font-weight: 500;
    font-stretch: condensed;
    color: #595756;
    text-align: center;
    margin: 0 auto;
    padding-top: 20px;
    position: relative;
}

.info-wrap .btn {
    width: 125px;
    height: 46px;
    padding: 10px 32px;
    cursor:pointer;
}

.elem-wrap a{
    color: #00b3ee;
}

.hidden{
    display: none!important;
}

.copy-block button{
    border: none;
    background: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
}
.wishes-page .tags{
    margin-bottom: 50px;
    margin-top: 30px;
    text-align: center;
}
.wishes-page .tags p{
    display: inline-block;
    margin: 5px;
}

.relative{
    position: relative;
}

.right-sidebar{
    width: 300px;
    min-height: 300px;
    position: relative;
    box-shadow: 0 5px 27px rgba(51, 51, 51, 0.16);
    padding: 15px;
    border-radius: 15px;
}

.right-menu{
    padding-top: 15px;
    padding-bottom: 15px;
}

.right-menu ul{
    list-style: none;
    padding-left: 0px;
}

.right-menu ul li{
    padding-left: 0px;
    margin-bottom: 10px;
}
.right-menu ul li a{
    color: #333;
    font-size: 14px;
    text-decoration: none;
}

.right-menu ul li a img{
    width: 50px;
    height: auto;
    vertical-align: top;
    margin-right: 10px;
    display: inline-block;
}

.right-menu ul li a span{
    display: inline-block;
}

.blog-content h1{
    color: #197791;

    /*color: #000;*/
    margin-bottom: 50px;
}

.blog-content p,.blog-content li{
    color: #333944;
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
}

.blog-content p img{
    width: auto;
    height: auto;
    margin-bottom: 25px;
    margin-top: 25px;
    margin-right: auto;
    margin-left: auto;
    display: block;
    max-width: 100%;
}

.blog-items .blog-item{
    text-align: center;
    margin-bottom: 50px;

}

.blog-items .blog-item img{
    display: block;
    width: 100%;
    transition: all ease-in 150ms;
    border-radius: 8px;
}

.wishes .wish-item img{
    display: block;
    width: 100%;
    transition: all ease-in 150ms;
    border-radius: 8px;
}

.blog-items .blog-item a{
    text-decoration: none;
    width: 100%;
    overflow: hidden;
}

.blog-items .blog-item a:hover img{
    transform: scale(1.025);
    transition: all ease-in 150ms;

}

.wishes .wish-item a:hover img{
    transform: scale(1.025);
    transition: all ease-in 150ms;
}

.wishes .blog-item span{
    display: block;
    font-size: 18px;
    color: #197791;
    text-decoration: none;
    margin-top: 25px;
}
.row.blog-heading{
    margin-bottom: 50px;
    margin-top: 50px;
}

.menu-categories a span{
    color: #197791;
}

.w-sidebar{
    /*position: fixed;*/
}

.w-sidebar.top{
    top:50px;

}

.sticky{
    position: sticky;
    top:50px;
}

.right-menu ul li span{
    max-width: 70%;
}

.picture-item{
    margin-bottom: 50px;
}

.share-container span a{
    color: #fff;
    z-index: 999;
}

.fancybox-toolbar.tool2{
    visibility: visible!important;
    opacity: 1!important;
}

.fancybox-toolbar.tool2 .share-container{
    background: #fff;
    width: 400px;
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    padding: 15px;
    display: block;
    margin: 0 auto;
    box-shadow: 0 10px 15px #33333363;
    text-align: center;
    padding-top: 30px;
}


.fancybox-toolbar.tool2{
    width: 100%;
}


.fancybox-toolbar.tool2 .share-container i{
    /*width: 30px;*/
    /*height: 30px;*/
    /*display: inline-block;*/
    /*vertical-align: middle;*/
    /*margin-right: 5px;*/
    /*background-repeat: no-repeat;*/
    /*background-size: contain;*/
    /*background-position: center;*/
    /*border-radius: 5px;*/
}

.fb i{
    background-image: url(../img/fb.svg);
}

.ms i{
    background-image: url(../img/ms.svg);
}

.fancybox-toolbar.tool2{
    bottom: -225px;
    left: 0;
    top:auto;
    right: auto;
    transition: all ease-in 500ms;
}

.fancybox-toolbar.tool2.top{
    bottom: 25px;
    transition: all ease-in 500ms;
}

.clickable{
    cursor: pointer;
}

.button i{
    background-size: contain!important;
    display: inline-block;
    height: 15px;
    width: 15px;
    background-repeat: no-repeat!important;
    background-position: center!important;
    margin: 0 auto;
    vertical-align: middle;
    line-height: 20px;
    margin-right: 5px;
}

.share-container .share-head{
    font-size: 16px;
    position: absolute;
    top: 5px;
    left: 0;
    width: 100%;
    text-align: center;
    font-weight: 500;
}

.share-container button{
    display: inline-block;
    line-height: 25px;
    padding-right: 25px;
    padding-left: 25px;
    border-radius: 6px;
    margin: 5px 10px;
    background: #333;
    border: none;
    color: #fff;
    font-weight: 500;
    width: 150px;
    font-size: 12px;
}

button.viber i {
    background-image: url(../img/viber.svg);
}

button.telegram i {
    background-image: url(../img/telegram.svg);
}

button.whatsapp i {
    background-image: url(../img/watsup.svg);
}

button.messenger i {
    background-image: url(../img/messenger.svg);
}

button.facebook i {
    background-image: url(../img/facebook.svg);
}

.button.messenger{
    background-image: linear-gradient(180deg, #00B1FF 0%, #006DFE 100%);
}

.button.facebook{
    background-color: #3161d3;
}

.button.whatsapp{
    background-image: linear-gradient(180deg, #60FD7C 0%, #07B825 100%);
}

.button.viber{
    background-image: linear-gradient(180deg, #8760FD 0%, #4C389D 100%);
}

.button.telegram{
    background-image: linear-gradient(180deg, #00AEFA 0%, #0983C5 100%);
}

.wish-type{
    text-align: center;
    padding-bottom: 25px;
}

.wish-type hr{
    width: 350px;
}

.wish-type a span{
    display: inline-block;
    margin: 10px 5px;
    width: auto;
    border-radius: 20px;
    border: 2px solid #fff;
    padding: 5px 30px;
    font-size: 16px;
    font-weight: 500;
    transition: 100ms ease-in;
    color: #fff;
}

.wish-type span:hover,.wish-type span.active {
    background-color: #fff;
    color: #197791;
    cursor: pointer;
    transition: 100ms ease-out;
}


.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #333;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}

@media screen and (min-width: 768px){

    .info-wrap .col-md-9{
        display: inline-block;
        width:75%;
    }
    .info-wrap .col-md-3{
        display: inline-block;
        width:24%;
    }
    .el-wrap{
        padding-top: 0!important;
        position: absolute!important;
        top: 20px;
    }
}

@media screen and (max-width: 768px){
    .elem-wrap .btn{
        display: block;
        position:relative;
        margin: 0 auto;
        margin-top: 2px;
    }
}

@media screen and (max-width: 480px){
    .fancybox-toolbar.tool2{
        bottom: -200px;
    }
    .fancybox-toolbar.tool2.top{
        bottom: 5px;
    }
    .fancybox-toolbar.tool2 .share-container{
        background: #fff;
        width: 500px;
        max-width: 100%;
        height: auto;
        border-radius: 10px;
        padding: 5px;
        display: block;
        margin: 0 auto;
        box-shadow: 0 10px 15px #33333363;
        text-align: center;
        padding-top: 25px;
    }
    .share-container button{
        display: inline-block;
        line-height: 35px;
        border-radius: 6px;
        margin: 5px 10px;
        background: #333;
        border: none;
        color: #fff;
        font-weight: 500;
        width: 150px;
    }

}