/* Begin: Button Style */



.btnStyle, .button-round {

    display: inline-block;

    padding: 12px 30px;

    background: var(--primary);

    color: var(--white);

    border: 0;

    border-radius: 100px;

    text-transform: uppercase;

    font-size: 16px;

    font-weight: 500;

}



.btnStyle:hover,

.btnStyle:focus,
.button-round:hover,
.button-round:focus {

    background: var(--primary);

    color: var(--white);

}





/* END: Button Style */



.overlay {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

}





/* Begin: Title CSS */



.title {

    margin-bottom: 3em;

}



.title h2 {

    font-size: 50px;

    text-transform: uppercase;

    color: #030303;

    font-weight: 700;

    margin: 0;

}





/* END: Title CSS */





/* Begin: Star Rating */



.star {

    list-style: none;

    padding: 0;

    margin: 0;

}



.star li {

    display: inline-block;

}



.star li .fa {

    font-size: 12px;

    color: #ffcb00;

}



.star li span {

    margin-left: 10px;

    font-size: 13px;

    color: #6f6f6f;

}





/* END: Star Rating */





/* Begin: Banner */



.inban {

    position: relative;

}



.inban .overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.inban h2 {

    font-size: 6rem;

    color: var(--white);

    margin: 0;

    text-transform: uppercase;

    font-weight: 700;

    line-height: 1;

}





/* END: Banner */





/* Begin: Pagination Style */



.pagiStyle .pagination {

    justify-content: center;

    margin: 0;

}



.pagiStyle .pagination .page-link {

    width: 50px;

    height: 50px;

    text-align: center;

    border-radius: 100px;

    margin: 0 5px;

    background: #ebebeb;

    border: 0;

    color: #737879;

    padding-top: 15px;

}



.pagiStyle .pagination .page-link:hover,

.pagiStyle .pagination .page-link:focus,

.pagiStyle .pagination .active .page-link,

.pagiStyle .pagination .active .page-link:hover,

.pagiStyle .pagination .active .page-link:focus {

    background: #63b247;

    color: #fff;

}





/* END: Pagination Style */





/* Begin: Social Media */



.socialIo {

    margin: 0;

    padding: 0;

    list-style: none;

    display: flex;

    gap: 0 10px;

}



.socialIo li a {

    width: 40px;

    height: 40px;

    display: block;

    background: #f8f8f8;

    border-radius: 100px;

    font-size: 1.2rem;

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

}



.socialIo li a.fb {

    background: #4b69b0;

}



.socialIo li a.insta {

    background: radial-gradient( circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);

}



.socialIo li a.utube {

    background: #e83f3a;

}



.socialIo li a.twitr {

    background: #37b1e1;

}



.socialIo li a.gplus {

    background: #e83f3a;

}



.socialIo li a.linkedin {

    background: #0678b6;

}





/* END: Social Media */





/* Begin: Search */



#search {

    position: fixed;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.7);

    -webkit-transition: all 0.5s ease-in-out;

    -moz-transition: all 0.5s ease-in-out;

    -o-transition: all 0.5s ease-in-out;

    -ms-transition: all 0.5s ease-in-out;

    transition: all 0.5s ease-in-out;

    -webkit-transform: translate(0px, -100%) scale(0, 0);

    -moz-transform: translate(0px, -100%) scale(0, 0);

    -o-transform: translate(0px, -100%) scale(0, 0);

    -ms-transform: translate(0px, -100%) scale(0, 0);

    transform: translate(0px, -100%) scale(0, 0);

    opacity: 0;

}



#search input[type="search"] {

    position: absolute;

    top: 50%;

    width: 100%;

    color: white;

    background: rgba(0, 0, 0, 0);

    font-size: 60px;

    font-weight: 300;

    text-align: center;

    border: 0px;

    margin: 0px auto;

    margin-top: -51px;

    padding-left: 30px;

    padding-right: 30px;

    outline: none;

}



#search .btnStyle {

    position: absolute;

    top: 50%;

    left: 50%;

    margin-top: 61px;

    margin-left: -45px;

    background-color: limegreen;

    border: black;

}



#search .close {

    position: fixed;

    top: 15px;

    right: 15px;

    color: #fff;

    background-color: limegreen;

    border-color: green;

    opacity: 1;

    padding: 10px 17px;

    font-size: 27px;

}



#search.open {

    -webkit-transform: translate(0px, 0px) scale(1, 1);

    -moz-transform: translate(0px, 0px) scale(1, 1);

    -o-transform: translate(0px, 0px) scale(1, 1);

    -ms-transform: translate(0px, 0px) scale(1, 1);

    transform: translate(0px, 0px) scale(1, 1);

    opacity: 1;

}





/* END: Search */