/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

@font-face {
    font-family: 'right-serif-mono';
    src: url('http://localhost/tainam/assets/font/PPRightSerifMono-RegularItalic.woff2') format('woff2');
    font-weight: 300;
}
.wpcf7-response-output {
    color: #fff;
}


body>*,
input,
button,
select,
textarea {
    font-family: 'right-serif-mono', monospace, serif;
    font-weight: 300;

}

.dark .nav-vertical li li.menu-item-has-children>a,
.dark .nav-vertical-fly-out>li>a,
.dark .nav-vertical>li>ul li a,
.dark .nav>li.html,
.dark .nav>li>a,
.nav-dark .is-outline,
.nav-dark .nav>li>a,
.nav-dark .nav>li>button,
.nav-dropdown.dark .nav-column>li>a,
.nav-dropdown.dark>li>a {
    color: #fff;
}

.header-main .nav>li>a {
    font-weight: 600;
    font-size: 20px;
}

#masthead .header-inner {
    align-items: center;
}

#masthead .flex-right .header-nav {
    flex-direction: column;
    align-items: flex-end;
}

#masthead .flex-right .header-nav>li {
    margin-left: 0;
    margin-bottom: 4px;
}

#masthead .flex-right .header-nav>li>a {
    padding: 0px 0;
    line-height: 1.3;
    text-align: right;
}

.transparent #logo img {
    max-height: 120px !important;
}


.btn-reservation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 0;
    letter-spacing: 1px;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-bottom: 15px !important;
}

.btn-reservation span {
    text-align: left;
}

.btn-reservation::after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.slider-img .slider-style-focus .flickity-slider>:not(.is-selected) {
    transform: unset;
}

.slider-img .slider-style-container .flickity-slider>:not(.is-selected),
.slider-img .slider-style-focus .flickity-slider>:not(.is-selected),
.slider-img .slider-style-shadow .flickity-slider>:not(.is-selected) {
    opacity: 1;
}

.custom-cf7-form p {
    margin: 0;
    padding: 0;
}

.custom-cf7-form .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.custom-cf7-form .form-row {
    margin-bottom: 12px;
}

.custom-cf7-form .two-cols {
    display: flex;
    gap: 12px;
}

.custom-cf7-form .two-cols .col {
    flex: 1;
    width: 50%;
    padding: 0px;
}

.custom-cf7-form input[type="text"],
.custom-cf7-form input[type="email"],
.custom-cf7-form input[type="tel"],
.custom-cf7-form select,
.custom-cf7-form textarea {
    width: 100%;
    height: 42px;
    background-color: #ffffff;
    color: #000000;
    border: none;
    border-radius: 0;
    padding: 0 12px;
    margin: 0;
    font-size: 13px;
    box-shadow: none;
    box-sizing: border-box;
}

.custom-cf7-form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="%23333333" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 30px;
}

.custom-cf7-form textarea {
    height: 140px;
    padding-top: 10px;
    resize: none;
}

.custom-cf7-form input::placeholder,
.custom-cf7-form textarea::placeholder {
    color: #888888;
    opacity: 1;
}

.custom-cf7-form input[type="submit"] {
    background-color: #f2f2f2;
    color: #000000;
    border: none;
    border-radius: 0;
    padding: 4px 30px;
    height: auto;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    box-shadow: none;
    margin: 0px;
    width: 50%;
    text-transform: unset;
}

.footer-primary.pull-left {
    float: right;
}
.text-align h4 {
    text-align: justify;
}
@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/
div#logo {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin: 0px;
}

}