/******************************************************************
  Template Name: Hiroto
  Description:  Hiroto Hotel HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Service Section
6.  Home Room Section
7.  Testimonial Section
8.  Latest Blog Section
9.  Contact
10.  Footer Style
-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap");


/*---------------------
  Header
-----------------------*/

.header__top__widget {
    padding: 14px 0 12px;
}

    .header__top__widget li {
        font-size: 15px;
        color: #19191A;
        display: inline-block;
        margin-right: 50px;
        list-style: none;
    }

        .header__top__widget li:last-child {
            margin-right: 0;
        }

        .header__top__widget li span {
            color: #E9AD28;
            margin-right: 5px;
        }

.header__top__right {
    text-align: right;
}

.header__top__auth {
    display: inline-block;
    margin-right: 0px;
    padding: 12px 0 14px;
}

    .header__top__auth ul li {
        display: inline-block;
        list-style: none;
        margin-right: 25px;
        position: relative;
    }

        .header__top__auth ul li:last-child {
            margin-right: 0;
        }

            .header__top__auth ul li:last-child::after {
                display: none;
            }

        .header__top__auth ul li::after {
            position: absolute;
            right: -16px;
            top: 0;
            width: 1px;
            height: 20px;
            background: #e5e5e5;
            content: "";
        }

        .header__top__auth ul li a {
            font-size: 15px;
            color: #19191A;
        }

.header__top__language {
    display: inline-block;
    padding: 12px 0 12px;
    position: relative;
    cursor: pointer;
}

    .header__top__language:hover ul {
        opacity: 1;
        top: 45px;
        visibility: visible;
    }

    .header__top__language img {
        display: inline-block;
        margin-right: 6px;
    }

    .header__top__language span {
        display: inline-block;
        font-size: 15px;
        color: #1d1c1c;
    }

    .header__top__language i {
        display: inline-block;
        font-size: 15px;
        color: #1d1c1c;
        font-weight: 500;
    }

    .header__top__language ul {
        position: absolute;
        left: 13px;
        top: 65px;
        width: 80px;
        background: #ffffff;
        text-align: left;
        z-index: 9;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all, 0.3s;
        -o-transition: all, 0.3s;
        transition: all, 0.3s;
    }

        .header__top__language ul li {
            font-size: 15px;
            color: #19191A;
            padding: 5px 10px;
            list-style: none;
            cursor: pointer;
        }

.header__nav__option {
    background: #1a1a1a;
}

.header__nav {
    text-align: right;
    padding: 20px 0 20px;
}

.header__logo {
    padding: 20px 0;
}

    .header__logo a {
        display: inline-block;
    }

.header__menu {
    display: inline-block;
}

    .header__menu ul li {
        list-style: none;
        display: inline-block;
        margin-right: 60px;
        position: relative;
    }

        .header__menu ul li.active a {
            color: #E9AD28;
        }

        .header__menu ul li:hover a {
            color: #E9AD28;
        }

        .header__menu ul li:hover .dropdown {
            top: 36px;
            opacity: 1;
            visibility: visible;
        }

        .header__menu ul li .dropdown {
            position: absolute;
            left: 0;
            top: 56px;
            width: 150px;
            background: #E9AD28;
            text-align: left;
            padding: 2px 0;
            z-index: 9;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: all, 0.3s;
            -o-transition: all, 0.3s;
            transition: all, 0.3s;
        }

            .header__menu ul li .dropdown li {
                display: block;
                margin-right: 0;
            }

                .header__menu ul li .dropdown li a {
                    font-size: 14px;
                    color: #ffffff;
                    font-weight: 400;
                    padding: 8px 20px;
                    text-transform: capitalize;
                }

                    .header__menu ul li .dropdown li a:after {
                        display: none;
                    }

        .header__menu ul li a {
            font-size: 18px;
            color: #ffffff;
            display: block;
            padding: 5px 0;
            -webkit-transition: all, 0.5s;
            -o-transition: all, 0.5s;
            transition: all, 0.5s;
        }

            .header__menu ul li a:hover {
                color: #E9AD28;
            }

.header__nav__widget {
    display: inline-block;
}

    .header__nav__widget a {
        display: inline-block;
        font-size: 16px;
        color: #1d1c1c;
        letter-spacing: 2px;
        background: #ffffff;
        padding: 13px 20px 11px;
    }

        .header__nav__widget a span {
            font-size: 20px;
            color: #E9AD28;
            position: relative;
            top: 4px;
        }
