/*---------------------------------------------------------------------------------
    
    Template Name: MESAGNE - Mesagne WebApp CSS + Bootstrap5 Template
    Version: 1.0

    In compliance with accessibility guidelines: https://www.w3.org/TR/WCAG20/
    
-----------------------------------------------------------------------------------
    
    [Table of contents] 
	
    1. WebApp Main Colors
    2. Text area style
    3. Header area style
    4. Footer area style 
    5. Slider area style
    6. Product area style (content) 
    7. Brand area style (partner logo)
    8. ???
    9. Other elements' area style
    10. Home Page style

    
-----------------------------------------------------------------------------------*/

/*-----------------------
   1. WebApp Main Colors
------------------------*/

/*mesagne color*/
.dark-green {
    color: #19652D;
}

/*san-donaci color*/
.yellow {
    color: #FADB00;
}

/*villa-castelli color*/
.blue {
    color: #175492;
}

/*torre-s-susanna color*/
.brown {
    color: #69170E;
}

/*other logo colors*/
.dark-grey {
    color: #222222
}

.light-blue {
    color: #5982C2;
}

/*THEME colors*/
.theme-color {
    color: #175492;
}

.blue-bg-color {
    background-color: #051726;
}

.white-bg-color {
    background-color: #FFFFFF;
}

/*ACCESSIBILITY: bg-color:fg-color AAA level for Luminosity Contrast Ratio */
.grey-bg-color {
    background-color: #F2F2F2;
}

.text-color {
    color: #222222;
}

.light-text-color {
    color: #FFFFFF;
}

/*ACCESSIBILITY: bg-color:accent-color AA level for Luminosity Contrast Ratio */
.accent-color {
    color: #175492;
}

.blue-accent-color {
    color: #034b86;
}

/*---------------------
    2. TEXT style Area
-----------------------*/

/*BASELINE: 8px -> padding and margin must be multiple of this */

body {
    font-family: 'Titillium Web', serif;
    font-weight: 400;
    /*normal value*/
    font-style: normal;
    font-size: 18px;
    color: #222222;
    text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a {
    font-family: 'Titillium Web', serif;
    font-weight: 500;
    color: #222222;
}

h1 {
    font-size: 48px;
}

h2 {
    font-size: 40px;
}

h3 {
    font-size: 32px;
}

h4 {
    font-size: 28px;
}

h5 {
    font-size: 24px;
}

h6 {
    font-size: 20px;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #222222;
}

p {
    font-weight: normal;
    font-size: 18px;
    line-height: 24px;
    /*margin-bottom: 16px;*/
    text-align: left;
}

/*-----------------------
    3. HEADER Area style
-------------------------*/

/*main menu */
.main-menu ul li {
    padding-right: 24px;
}

.main-menu ul li a {
    color: #222222;
    font-family: 'Lora', serif;
    font-size: 18px;
    text-transform: capitalize;
}

.main-menu ul li:hover>a,
.main-menu ul li:focus>a,
.main-menu ul li:active>a {
    color: #175492;
}

/*accessibility: hover action must be indicated at least in two different ways*/
.main-menu ul li a:hover,
.main-menu ul li a:focus,
.main-menu ul li a:active {
    color: #175492;
    text-decoration: underline;
}

/*sub-menu*/
.main-menu ul li ul li a {
    color: #222222;
    font-family: 'Lora', serif;
    font-size: 16px;
}

.main-menu ul li ul li a:hover,
.main-menu ul li ul li a:focus,
.main-menu ul li ul li a:active {
    color: #175492;
}

.main-menu nav>ul>li>ul.submenu:hover,
.main-menu nav>ul>li>ul.submenu:focus,
.main-menu nav>ul>li>ul.submenu:active {
    color: #175492;
}

.main-menu ul li.top-hover ul li>a::before {
    /*square next selected item*/
    background: #175492 none repeat scroll 0 0;
}

/*current language*/

.header-currency {
    padding: 0 0 0 20px;
}

.header-currency .digit {
    color: #222222;
    font-family: 'Lora', serif;
    font-size: 18px;
    padding: 0px 8px 0 0;
}

.header-currency .digit:hover {
    color: #175492;
}

.header-currency::after {
    content: none;
}

/*select*/
.digit select {
    font-family: 'Lora', serif;
    font-size: 16px;
    color: #222222;
    font-weight: bold;
}

.digit select option{
    background: #ffffff !important;
    border: none;
    color:#222222 !important;
    padding-left: 10px;
    font-family: 'Lora', serif;
    font-size: 16px;
}

.digit select option:hover,
.digit select option:focus,
.digit select option:active,
.digit select option:checked {
    background: #ffffff !important;
    color:#175492 !important;
    outline: none;
}

.dollar-submenu ul li a {
    color: #222222;
    font-family: 'Lora', serif;
    font-size: 16px;
}

.dollar-submenu ul li a:hover,
.dollar-submenu ul li a:focus,
.dollar-submenu ul li a:active {
    color: #175492;
    text-decoration: underline;
}

/*arrow icon*/
.fa-sort-desc {
    content: "\f0dd";
    font-size: 18px;
}

.header-bottom-right {
    justify-content: flex-end;
}

/*social icons*/

.header-cart {
    /*padding: 0 0 0 16px;*/
    /*padding: 0 16px 0 16px;
    margin-right: 40px;*/
    padding: 0 12px 0 12px;
    margin-right: 36px;
}

/*touch target:48x48 (icon container size) */
.header-cart>a .cart-icon i {
    color: #222222;
    font-size: 28px;
    /* 24 px is icon size for accessibility*/
}

.header-cart>a .cart-icon i:hover,
.header-cart>a .cart-icon i:focus,
.header-cart>a .cart-icon i:active {
    color: #175492;
}

.icon-space {
    padding: 0 16px 0 0;
}

/*-----------------------
    4. Footer Area style
-------------------------*/

.footer-title>h4 {
    font-family: 'Lora', serif;
    font-size: 28px;
    color: #175492;
}

/*contacts*/

.footer-contact li strong {
    font-size: 18px;
}

.footer-contact li {
    font-size: 16px;
}

.footer-contact li a:hover,
.footer-contact li a:focus,
.footer-contact li a:active {
    color: #175492;
    text-decoration: underline;
}

/*quick links*/
.footer-content li a:hover,
.footer-content li a:focus,
.footer-content li a:active {
    color: #175492;
    text-decoration: underline;
}

/*social icons: general*/
.footer-content .fa-facebook-square,
.footer-content .fa-instagram,
.footer-content .fa-youtube-play,
.footer-content .fa-rss {
    color: #051726;
    font-size: 48px;
}

.footer-content .fa-facebook-square:before,
.footer-content .fa-instagram:before,
.footer-content .fa-youtube-play,
.footer-content .fa-rss {
    color: #051726;
    font-size: 48px;
}

.footer-content .icon-space {
    padding-right: 16px;
}


/*facebook*/
.footer-content .fa-facebook-square:hover,
.footer-content .fa-facebook-square:focus,
.footer-content .fa-facebook-square:active {
    color: #175492;
}

/*instagram*/
.footer-content .fa-instagram:hover,
.footer-content .fa-instagram:focus,
.footer-content .fa-instagram:active {
    color: #175492;
}

/*youtube*/
.footer-content .fa-youtube-play:hover,
.footer-content .fa-youtube-play:focus,
.footer-content .fa-youtube-play:active {
    color: #175492;
}

/*rss feed*/
.footer-content .fa-rss:hover,
.footer-content .fa-rss:focus,
.footer-content .fa-rss:active {
    color: #175492;
}

/*copyright*/
.copyright p {
    color: #051726;
}

.copyright .company-name {
    color: #051726;
}

.copyright .company-name:hover,
.copyright .company-name:focus,
.copyright .company-name:active {
    color: #175492;
    text-decoration: underline;
}


/*-----------------------
    5. Slider Area style
-------------------------*/

/*point of interest slider button*/
.slider-btn {
    background: #175492;
    color: #ffffff;
    border-radius: 24px;
    font-size: 18px;
    font-weight: 500;
    padding: 0px 16px;
    height: 40px;
    line-height: 40px;
    box-shadow: 5px 10px 10px 0px #00000021;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 80%;
    left: 35%;
}

.slider-btn:hover,
.slider-btn:focus,
.slider-btn:active {
    /*
    background: #cadeeb;
    color: #051726;
    border: 1px solid #051726;
    */
    background-color: #051726;
    color: #ffffff;
}
/*text*/
a:hover {
    color: #333;
    text-decoration: underline;
}

/*------------------------
    6. PRODUCT Area style
--------------------------*/

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    border-radius: 24px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

.product-img {
    border: none;
}

.product-img img {
    width: 100%;
}

/*product title*/
.product-title {
    margin: 16px;
}
/*product-text (city,library)*/
.product-list-details a {
    color:#175492;
}

.product-title h3>a,
.product-title h5>a {
    text-transform: none;
}

.product-title h3>a:hover,
.product-title h5>a:hover {
    text-decoration: underline;
}

/*----------------------
    7. BRAND Area style
 -----------------------*/

.brand-logo-active.owl-carousel .owl-item img {
    border-radius: 40px;
}

.brand-layout {
    padding: 32px;
    margin: 0;
    text-align: left;
}

/*----------------------
    8. ??? Area style
 -----------------------*/

/*--------------------------------
    9. Other elements' Area style
 ---------------------------------*/

/*------------------
   Scroll Up Style
--------------------*/
#scrollUp {
    background: #222222 none repeat scroll 0 0;
    border-radius: 4px;
    bottom: 12px;
}

#scrollUp:hover,
#scrollUp:focus,
#scrollUp:active {
    background: #175492 none repeat scroll 0 0;
}

/*button behaviour*/
.btn-check:checked+.btn, 
.btn.active, .btn.show, 
.btn:first-child:active, 
:not(.btn-check)+.btn:active {
    background-color: #051726;
    color: #ffffff;
    border-color:transparent;
}

/*space*/
.line-space {
    padding: 8px;
}

/*breadcrumb background*/
.bg-breadcrumb-img {
    background-color: #F2F2F2;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;

}

/*partner slider*/
.partner-layout {
    padding: 32px;
    margin: 0;
    text-align: left;
}

/************************
        Margin
*************************/

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

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

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

.mb-8 {
    margin-bottom: 8px;
}

.mb-16 {
    margin-bottom: 16px;
}

.mb-24 {
    margin-bottom: 24px;
}

.mse-8 {
    margin-left: 8px;
    margin-right: 8px;
}

.mse-16 {
    margin-left: 16px;
    margin-right: 16px;
}


/************************
        Padding
*************************/

.pb-72 {
    padding-bottom: 72px;
}


.ptb-16 {
    padding: 16px 0;
}

.ptb-24 {
    padding: 24px 0;
}

.ptb-48 {
    padding: 48px 0;
}

.ptb-160 {
    padding: 160px 0;
}

.p-16 {
    padding: 16px;
}

.pse-12 {
    padding-left: 12px;
    padding-right: 12px;
}

.pse-8 {
    padding-left: 8px;
    padding-right: 8px;
}

/*-----------------------
    10. HOME Page style
-------------------------*/

.home-title {
    padding: 32px;
    margin: 0;
    text-align: left;
}

/*video*/
#video-section {
    padding: 0;
}

#video-box {
    padding: 0;
    max-width: 100%;
}

/*project*/

/*image*/
#project-info .overview-img.text-center img {
    border-radius: 24px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

/*text*/
#project-info .overview-content-2>h2 {
    color: #222222;
    font-size: 40px;
    font-family: 'Lora', serif;
    margin-bottom: 24px;
    margin-top: 24px;
}

#project-info .overview-content-2>h4 {
    color: #222222;
    font-size: 28px;
    margin-bottom: 16px;
}

/*button*/
.custom-btn {
    background: #175492;
    color: #ffffff;
    border: none;
    border-radius: 24px;
    font-size: 18px;
    padding: 0px 16px;
    height: 40px;
    line-height: 40px;
    box-shadow: 5px 10px 10px 0px #00000021;
    text-transform: capitalize;
}
.custom-btn:hover,
.custom-btn:focus,
.custom-btn:active {
    background-color: #051726;
    color: #ffffff;
}

/*event*/
.event-info .product-title h5,
.event-info .product-title h6,
.event-info .product-title p,
.event-info .product-title a {
    color: white !important;
}

#event-style .owl-carousel .owl-item img {
    display: block;
    width: 100%;
    border-radius: 24px;
    box-shadow: none !important;
}

/*partner area*/
#home-partner-area {
    background-color: #F2F2F2;
}

/*--------------------------
    10. CONTACTS Page style
----------------------------*/
.contacts-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

/*contact-form*/
.small-title>h4 {
    color: #222222;
    text-transform: uppercase;
}

.small-title p {
    font-size: 18px;
}

/*contact-info*/
.contact-information h5 {
    color: #175492;
}

.contact-information p {
    font-size: 18px;
}

.contact-information>p a:hover,
.contact-information>p a:focus,
.contact-information>p a:active {
    color: #175492;
}

/*contact-form-style*/
.contact-form-style input,
.contact-form-style textarea {
    background: transparent;
    border: 1px solid #F2F2F2;
    color: #555;
    font-size: 16px;
    border-radius: 4px;
}

input:focus {
    background: transparent;
    /*border: 2px solid #4FC1F0;*/
    border: 2px solid #5982C2;
}

/*submit-button*/
#contact-submit {
    display: inline-block;
    background: #175492;
    color: #ffffff;
    border: none;
    border-radius: 16px;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    box-shadow: 5px 10px 10px 0px #00000021;
    padding: 0px 16px;
    text-transform: capitalize;
}

#contact-submit:hover,
#contact-submit:focus,
#contact-submit:active {
    background-color: #051726;
}

/*------------
    Map Area
-------------*/
.map-area a {
    color: #051726;
    font-size: 16px;
}

.map-area a:hover {
    color: #175492;
    text-decoration: underline;
}

/*open street map*/
.map-area iframe {
    width: 100%;
    height: 100%;
    display: block;
    display: flex;
    flex-wrap: wrap;
    filter: none;
    -webkit-filter: none;
    border-radius: 12px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

/*--------------------------
    11. LIBRARY Page style (product details e blog)
----------------------------*/

/*list*/
.libraries-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}


/*image*/
.library-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

.product-details img {
    border-radius: 24px;
    width: 100%;
    height: 600px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

/*title*/
.product-details-content>h3 {
    color: #175492;
    font-size: 32px;
}

/*text*/
.product-details-content>p {
    color: #222222;
}

.social-icons ul li {
    display: inline-block;
    margin-left: 0px;
}

.social-icons .blog-dec-social ul li i {
    padding-right: 18px;
    font-size: 32px;
    vertical-align: bottom;
}

/*pro-dec-feature*/
.pro-dec-feature {
    padding: 24px 0 16px;
}

.pro-dec-feature li {
    color: #222222;
}

.pro-dec-feature li span {
    color: #175492;
    font-size: 20px;
    font-family: 'Lora', serif;
}

.pro-dec-feature>p {
    color: #222222;
    font-size: 18px;
    font-family: 'Lora', serif;
}

/*categories*/
.pro-dec-categories li a {
    color: #222222;
}

.pro-dec-categories li a:hover,
.pro-dec-categories li a:focus,
.pro-dec-categories li a:active {
    color: #175492;
}


/*Tabs*/
.tab-content.description-review-bottom {
    border-top: 1px solid #c5c5c5;
    border-bottom: 1px solid #c5c5c5;
    padding: 48px 0px 64px;
}

/*title*/
.description-review-topbar a {
    color: #222;
    font-size: 20px;
}

.description-review-topbar a.active {
    border-bottom: 2px solid #175492;
    color: #175492;
    font-size: 20px;
}

/*description text*/
.product-description-wrapper>p {
    color: #222222;
    font-size: 18px;
}

.product-description-wrapper li {
    color: #222222;
    font-size: 18px;
}

/*other tab text*/
.product-anotherinfo-wrapper>p {
    color: #222222;
    font-size: 18px;
    line-height: 30px;
    margin-bottom: 30px;
}

.product-anotherinfo-wrapper>.product-info-title {
    color: #175492;
    font-family: 'Lora', serif;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 30px;
}

.product-anotherinfo-wrapper li {
    color: #222222;
    font-size: 18px;
}


/*--------------------------
    12. PROJECT Page style (about us)
----------------------------*/

.project-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

.overview-img.text-center img {
    max-width: 100%;
    border-radius: 24px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

/*text*/
.overview-content-2>p.peragraph-blog {
    font-size: 16px;
    /*margin: 24px;*/
}

.p-h5-size {
    font-size: 24px;
    font-family: 'Lora', serif;
    text-transform: uppercase;
}

.p-h6-size {
    font-size: 20px;
    font-family: 'Lora', serif;
}

/*social action icons*/
.team-action a {
    font-size: 24px;
    height: 48px;
    width: 48px;
    line-height: 48px;
}

.team-action a.youtube {
    background-color: #f01616;
    border: 1px solid #f01616;
}

/*--------------------
    Testimonial Area
----------------------*/

/*image*/
.testimonial-active.owl-carousel .owl-item img {
    display: inline-block;
    width: 20%;
}

.testimonial-img>img {
    border: 1px solid #ddd;
    border-radius: 16px;
    width: 100%;
}

/*text*/
.single-testimonial>p {
    color: #222222;
    font-size: 18px;
    font-style: normal;
    /*italic*/
}

.single-testimonial>h5 {
    color: #222222;
    font-size: 24px;
    margin: 0;
    font-family: 'Lora', serif;
    font-weight: 600;
    text-transform: uppercase;
}

/*partner banner*/
#project-partner-banner {
    background-color: #ffffff;
}

.owl-stage {
    height: 100px;
}

/*---------------------
    Project-count Area
------------------------*/
.count-title h2 {
    color: #034b86;
    font-size: 40px;
    font-weight: 800;
    letter-spacing: 0.2px;
    margin: 0 0 12px;
    padding: 0 0 16px;
    position: relative;
}

.count-title>span {
    color: #222222;
    font-size: 22px;
    font-weight: 500;
    text-transform: capitalize;
}

/*--------------
    Team Area
----------------*/
.team-img {
    border-top-right-radius: 24px;
    border-top-left-radius: 24px;
}

/*team-content*/
.team-content {
    border-bottom-right-radius: 24px;
    border-bottom-left-radius: 24px;
}

.team-content>h4 {
    color: #034b86;
    font-size: 28px;
    margin: 0 0 8px;
}

.team-content>span {
    color: #222222;
    font-size: 18px;
}

/*--------------------------
    13. CITY Page style (blog no sidebar + blog details gallery)
----------------------------*/
.city-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

/*--------------
    Blog details
----------------*/
.single-blog-wrapper p {
    color: #222222;
    font-weight: normal;
    font-size: 18px;
    line-height: 24px;
    text-align: left;
}
/*text*/
.single-blog-wrapper .blog-content h3 a {
    font-size: 32px;
    color: #175492;
}
.single-blog-wrapper .blog-content h4 a {
    font-size: 28px;
    color: #175492;
}
.blog-content>h4 {
    color: #175492;
    text-transform: none;
}
.blog-content>p {
    color: #222222;
    font-size: 18px;
    margin-bottom: 24px;
}

/*quote*/
.importent-title {
    display: flex;
    justify-content: center;
    align-items: end;
}

.importent-title>h3 {
    color: #175492;
}

/*image*/
.highlights-img>img {
    width: 120px;
}

.highlights-img {
    margin-right: 2px;
    margin-top: 8px;
}

/*social*/
.blog-widget {
    border-bottom: 2px solid #F2F2F2;
}

.blog-widget>h5 {
    text-transform: none;
    color: #222222;
}

.blog-sidebar-social li a:hover,
.blog-sidebar-social li a:focus,
.blog-sidebar-social li a:active {
    color: #175492;
}

.blog-widget-title {
    color: #222222;
    font-size: 24px;
    font-weight: 500;
    text-transform: capitalize;
}

.blog-sidebar-social li a {
    color: #222222;
    font-size: 32px;
}

.blog-instagram li a::before {
    background-color: #222222;
}

/*tags*/
.blog-tags ul>li a {
    color: #222222;
    text-transform: capitalize;
}

/*gallery*/
#gallery img {
    box-shadow: none;
}

.blog-gallery-slider .owl-nav div:hover,
.blog-gallery-slider .owl-nav div:focus,
.blog-gallery-slider .owl-nav div:active {
    color: #175492;
}

/*administrator container*/
.administrator-wrapper {
    border-bottom: 2px solid #F2F2F2;
}

.administrator-img img {
    border-radius: 24px;
    box-shadow: 5px 10px 10px 0px #00000021;
}

.administrator-content>h5 {
    color: #222222;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 19px;
}

/*-----------------------------------
    11. POINT OF INTEREST Page style (product details)
-------------------------------------*/
/*image*/
.interest-point-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

/*--------------------------
    ??. ATTRACTION ListView (Shop List)
----------------------------*/


/*---------------------------
    ??. CITY LIST Page style 
-----------------------------*/

/*list image*/
.cities-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}
/*title*/
.page-title {
    padding: 16px 8px 16px 8px;
}
.page-title strong {
    color: #175492;
}

/*city text*/

/*------------------
    Shop Page Area
---------------------*/

/*image*/
.grid-list-product-wrapper .product-img img{
    border-radius: 12px;
}
/*shop categories*/
h4.shop-sidebar-title {
    font-size: 22px;
}

.shop-catigory ul > li a {
    color: #242424;
    font-size: 20px;
}
.shop-catigory ul li:hover > a,
.shop-catigory ul li:focus > a,
.shop-catigory ul li:active > a {
    color: #175492;
}

.shop-catigory ul > li ul li a {
    color: #222222;
}
.shop-catigory ul li:hover > a,
.shop-catigory ul li:focus > a,
.shop-catigory ul li:active > a {
    color: #175492;
}
/*tags*/
.shop-tags a {
    border: 1px solid #ebebeb;
    border-radius: 12px;
    color: #222222;
    font-size: 20px;
}
.shop-tags a:hover {
    border: 1px solid #175492;
    background-color: #175492;
    color: #fff;
}
/*sidebar*/
.sidebar-list-style ul li a {
    color: #242424;
    font-size: 20px;
}
.sidebar-list-style ul li a:hover,
.sidebar-list-style ul li a:focus,
.sidebar-list-style ul li a:active {
    color: #175492;
}

/*view*/
.view-mode li a {
    font-size: 24px;
}
.view-mode li.active a {
    color: #175492;
}
/*icon*/
.fa-list-ul:hover {
    color:#175492;
}
.fa-th:hover {
    color:#175492;
}
/*listview bar*/

.shop-topbar-left > p {
    font-size:16px;
}
.shorting-style > label {
    color: #222222;
    font-size: 16px;
}

/*grid view*/
.product-grid h6 {
    font-size: 22px;
}
.product-grid span {
    font-size: 20px;
}

.product-grid h6 a:hover,
.product-grid h6 a:focus,
.product-grid h6 a:active {
    color: #175492;
}
.product-grid span a:hover,
.product-grid span a:focus,
.product-grid span a:active {
    color: #175492;
}
/*list view*/
.product-list-details h6 {
    font-size: 22px;
}
.product-list-details span {
    font-size: 20px;
}

.product-list-details h6 a:hover,
.product-list-details h6 a:focus,
.product-list-details h6 a:active {
    color: #175492;
}
.product-list-details span a:hover,
.product-list-details span a:focus,
.product-list-details span a:active {
    color: #175492;
}

/*select*/
.shorting-style select {
    font-size: 16px;
}
/*pagination*/
.pagination-total-pages {
    display: flex;
    justify-content: center;
}
/*buttons*/
.pagination-style li a:hover, 
.pagination-style li a.active, 
.pagination-style li a.next:hover, 
.pagination-style li a.next:active, 
.pagination-style li a.next:focus {
    background-color: #175492;
    color: #fff;
}

/*--------------------------
    ??. EVENT Page 
----------------------------*/
/*image*/
.event-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}


/*--------------------------
    ??. ARTICLE Page 
----------------------------*/
/*image*/
.article-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

/*--------------------------
    ??. NEWS/EVENTS View 
----------------------------*/
.events-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

.news-img {
    background-image: url("../../assets/img/bg/breadcrumb.jpg");
}

.dec-img > img {
    border-radius:12px;
}

.blog-dec-social ul li i {
    padding-right: 18px;
    font-size: 24px;
    vertical-align: bottom;
}
.administrator-content a:hover {
    color: #034b86;
    text-decoration: none;
}
/*-----------------------
        Blog details 
-------------------------*/

/*BLOG DETAILS STANDERD*/

.blog-social ul li a:hover, 
.blog-btn > a:hover, 
.blog-author > h4 a:hover, 
.news-form > button:hover, 
.blog-categori ul li a:hover, 
.blog-tags ul > li a:hover, 
.blog-sidebar-social li a:hover, 
.link-content > h3 a:hover, 
.blog-content > h2 a:hover,
.blog-content > h3 a:hover,
.blog-content > h4 a:hover,
.blog-content > h5 a:hover {
    color: #034b86;
}
/*image*/
.blog-img img {
    border-radius: 12px;
}
/*CONTENT*/
.blog-content h3 a {
    font-size: 32px;
    color: #222222;
}
.blog-content h4 a {
    font-size: 28px;
    color: #222222;
}

/*date*/
.blog-date-categori li {
    color: #222222;
    font-size: 20px;
    font-style: normal;
}
/*admin*/
.blog-date-categori ul li a::before {
    background-color: #034b86;
}
.blog-date-categori ul li a {
    color: #034b86;
}
/*read more*/
.blog-btn > a {
    color: #242424;
}
.blog-btn > a:hover::before {
    background-color: #034b86;
}

/*QUOTE POST*/
.quote-post {
    background-color: #034b86;
    border-radius: 12px;
}
.quote-content > h3 a {
    color: #ffffff;
}
.quote-content h6 {
    color: #fff;
    font-size: 18px;
}

/*colorfull social icons*/
/*SOCIAL*/
.blog-dec-tags ul li a:hover,
.blog-dec-tags ul li a:focus,
.blog-dec-tags ul li a:active,
.blog-dec-social ul li a:hover,
.blog-dec-social ul li a:focus,
.blog-dec-social ul li a:active {
    color: #175492;
}
/*social*/
.pro-dec-social span {
    color: #222222;
    font-size: 20px;
}

.pro-dec-social ul {
    margin: 8px 0;
    padding: 0px;
}

.pro-dec-social li a {
    text-align: center;
    font-size: 24px;
    color: #fff;
    display: inline-block;
    line-height: 1;
    border-radius: 50%;
    margin-right: 12px;
}

/*email*/
.pro-dec-social li a.mail {
    background-color: #69170E;
    padding: 12px;
}

.pro-dec-social li a.mail:hover,
.pro-dec-social li a.mail:focus,
.pro-dec-social li a.mail:active {
    background-color: transparent;
    border: 1px solid #69170E;
    color: #69170E;
}

/*instagram*/
.pro-dec-social li a.follow {
    background-color: #C13584;
    padding: 12px 14px;
}

.pro-dec-social li a.follow:hover,
.pro-dec-social li a.follow:focus,
.pro-dec-social li a.follow:active {
    background-color: transparent;
    border: 1px solid #C13584;
    color: #C13584;
}

/*youtube*/
.pro-dec-social li a.youtube {
    background-color: #ce1f21;
    border: 1px solid transparent;
    padding: 12px;
}

.pro-dec-social li a.youtube:hover,
.pro-dec-social li a.youtube:focus,
.pro-dec-social li a.youtube:active {
    background-color: transparent;
    border: 1px solid #ce1f21;
    color: #ce1f21;
}

/*facebook*/
.pro-dec-social li a.share {
    padding: 12px 16px;
}

/*twitter*/
.pro-dec-social li a.tweet {
    padding: 12px;
}
/*---------------------------------------------------------------------------------
    
    Template Name: MESAGNE - Mesagne WebApp CSS + Bootstrap5 Template
    Version: 1.0
    In compliance with accessibility guidelines: https://www.w3.org/TR/WCAG20/

                        MEANMENU --- Mobile Menu
    
-----------------------------------------------------------------------------------*/

.mean-container a.meanmenu-reveal {
    color: #222222;
    font-family: 'Lora', serif;
    height: 24px;
    line-height: 24px;
    top: -70px;
    width: 24px;
    padding: 4px 16px 4px 16px;
    border: none;
}

.mean-container .mean-nav ul li a:hover,
.mean-container .mean-nav ul li a:focus,
.mean-container .mean-nav ul li a:active {
    color: #034b86;
    text-decoration: underline;
}

/*menu icon*/
.mean-container a.meanmenu-reveal span {
    background: #222222;
    height: 3px;
    margin-top: 2px;
    margin-bottom: 5px;
    border-radius: 2px;
}

/*open menu*/
.mean-container .mean-nav ul li a {
    background: #F8F8F8 none repeat scroll 0 0;
    color: #222222;
    font-size: 16px;
}

/*open sub-menu*/
.mean-container .mean-nav ul li li a {
    color: #222222;
}
/*sub menu style*/
.main-menu ul li ul li a {
    text-transform: none;
}

/*close icon*/
.fa-times {
    color: #222222;
    line-height: 24px;
}

/*sub-menu style*/
.mean-container .mean-nav ul li a.mean-expand {
    width: 24px;
    height: 24px;
    margin-top: 8px;
    padding: 8px 12px !important;
}

/*plus and minus icons*/
.fa-plus,
.fa-minus {
    font-size: 16px;
    color: #222222;
}


/*View plugins.js for behaviour details*/

/*---------------------------------------------------------------------------------
    
    Template Name: MESAGNE - Mesagne WebApp CSS + Bootstrap5 Template
    Version: 1.0
    In compliance with accessibility guidelines: https://www.w3.org/TR/WCAG20/

                        RESPONSIVE Style
    
-----------------------------------------------------------------------------------*/

@media (max-width: 316px) {

    .header-cart,
    #logo {
        display: none;
    }

    .header-bottom-right {
        justify-content: flex-start;
    }

    .footer-content .fa-facebook-square:before,
    .footer-content .fa-instagram:before,
    .footer-content .fa-youtube-play,
    .footer-content .fa-rss {
        font-size: 32px !important;
    }
}

@media (max-width: 767px) {

    .product-area {
        padding: 0 0 36px;
    }

    .brand-logo-area {
        padding-bottom: 48px;
        padding-top: 48px;
    }

}

/*desktop mode*/
@media (min-width:1360px){
    /*TODO: reduce sx and dx padding and margin*/
}

/*---------------------------------------------------------------------------------
    
    Template Name: MESAGNE - Mesagne WebApp CSS + Bootstrap5 Template
    Version: 1.0
    In compliance with accessibility guidelines: https://www.w3.org/TR/WCAG20/

                        LORA SERIF FONT
    
-----------------------------------------------------------------------------------*/
/* latin */
@font-face {
    font-display: optional;
    /*using with preload*/
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lora/v26/0QI6MX1D_JOuGQbT0gvTJPa787weuxJBkq0.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
    font-display: optional;
    /*using with preload*/
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lora/v26/0QI6MX1D_JOuGQbT0gvTJPa787weuxJPkq1umA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lora/v26/0QI6MX1D_JOuGQbT0gvTJPa787weuxJMkq1umA.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lora/v26/0QI6MX1D_JOuGQbT0gvTJPa787weuxJFkq1umA.woff2) format('woff2');
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family: 'Lora';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lora/v26/0QI6MX1D_JOuGQbT0gvTJPa787weuxJOkq1umA.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}