/*
    Hotel: Hugo
*/

@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Bold.woff2') format('woff2'),
        url('../fonts/Gilroy-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Regular.woff2') format('woff2'),
        url('../fonts/Gilroy-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Medium.woff2') format('woff2'),
        url('../fonts/Gilroy-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

h1, h2, h3 { font-family: 'Gilroy', arial, sans-serif!important; }


header .top_triggers .top_menu > a
{
    font-family: Gilroy!important;
}

.language ul a {
    font-family: Gilroy!important;
}
header .nav_container > ul
{
    font-family: 'Gilroy', arial, sans-serif!important;
}
.big-map-text h4 { font-family: 'Gilroy', arial, sans-serif!important; }
.item-img span { font-family: 'Gilroy', arial, sans-serif!important; }
.roomsize { font-family: 'Gilroy', arial, sans-serif!important; }
.offer-price { font-family: 'Gilroy', arial, sans-serif!important; }
.this-special { font-family: 'Gilroy', arial, sans-serif!important; }
.conference_offers .three-offers-txt h4 { font-family: 'Gilroy', arial, sans-serif!important; }
.roomstyles div p { font-family: 'Gilroy', arial, sans-serif!important; }
.top_detail_price { font-family: 'Gilroy', arial, sans-serif!important; }
.offer_price { font-family: 'Gilroy', arial, sans-serif!important; }
.nav_overlay ul.mobilenav .menu-item-has-children span, .nav_overlay ul.mobilenav .current-menu-parent span {
    font-family: 'Gilroy', sans-serif!important; }
.nav_overlay ul.mobilenav li { font-family: 'Gilroy', arial, sans-serif!important; }

body { font:400 16px/1.6 'Gilroy', arial, sans-serif!important; }
.form-control { font-family: 'Gilroy', arial, sans-serif!important;}
.booking-block select { font-family: 'Gilroy', arial, sans-serif!important;}
.big-background-text h3 { font-family: 'Gilroy', arial, sans-serif;text-transform: none!important; }
.specials-top-select select {    font-family: 'Gilroy', arial, sans-serif!important;}
.simpleform label { font-family: 'Gilroy', arial, sans-serif!important; }
.normalform label { font-family: 'Gilroy', arial, sans-serif!important; }
.normalform input, .normalform textarea {  font-family: 'Gilroy', arial, sans-serif!important;}
.normalform select { font-family: 'Gilroy', arial, sans-serif!; }
.mobile-booking-block select {    font-family: 'Gilroy', arial, sans-serif!important;}
.ui-widget-header {    font-family: 'Gilroy', arial, sans-serif!important;}
.ui-widget-content {   font-family: 'Gilroy', arial, sans-serif!important;}
.ui-datepicker th {    font-family: 'Gilroy', arial, sans-serif!important;}
html .ui-button.ui-state-disabled:active {    font-family: 'Gilroy', arial, sans-serif!important;}

.intro-inner h1 {
    text-transform: unset!important;
}


.intro {
    position: relative;
    height: 100vh;
    overflow: hidden;
    display: block;
}


.intro-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 7;
    display: flex;
    align-items: center;   /* vert center */
    justify-content: center; /* hor center */
}

.subpages .intro-inner { 
    top:auto;
    transform: none;
}

.subpages .nobg .intro-inner { position: relative;bottom:auto;top:auto;transform: none;padding:2rem 0; }
.scroll-down { position: relative;z-index:9;top:30px;text-indent: -9000px;background-image: url('../img/scroll.png');background-repeat: no-repeat;background-position: 0 0;background-size: 100% auto;display: block;width: 38px;height: 42px;}
.scroll-down:hover { top:40px }

#videoWrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

#videoWrapper iframe {

  position: absolute;
    top: 50%;
    left: 50%;
    width: 177.78vh; 
    height: 56.25vw;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    pointer-events: none;

}


h1, h2, h3 {
    text-transform: unset!important;
}
header .nav_container > ul {

    text-transform: unset!important;
}

.features-icons-inner ul li span {
    text-transform: unset!important;
}

a { color: #466477; }
a:hover { color: #000; }

h2, h3, .subpages_content h2, .subpages_content h3 { color: #466477; }

.btn,
.bt2,
.gform_wrapper .gform_footer input.button, 
.gform_wrapper .gform_footer input[type=submit], 
.gform_wrapper .gform_page_footer input.button, 
.gform_wrapper .gform_page_footer input[type=submit]{ background-color: #466477; }

.btn:hover,
.bt2:hover,
.gform_wrapper .gform_footer input.button:hover, 
.gform_wrapper .gform_footer input[type=submit]:hover, 
.gform_wrapper .gform_page_footer input.button:hover, 
.gform_wrapper .gform_page_footer input[type=submit]:hover { background-color: #000000; }


.sub_booking .booking-block:last-child small a
{ color: #466477; }
.book_trigger {
    background: #fff!important;
    color:rgb(70 100 119)!important;
    top: 40px;
}
.book_trigger:hover {
    color:#fff!important;
    background: rgb(70 100 119)!important
}
.book_trigger_shop {
    background: rgb(24,155,33)!important;
    color:#fff!important;
}
.book_trigger_shop:hover {
    color:#fff!important;
    background: #466477!important
}

.page-id-1835 .btm_btn { display: none; }
.page-id-2184 .btm_btn { display: none; }
.page-id-3270 .btm_btn { display: none; }
.page-id-2737 .btm_btn { display: none; }
.page-id-21334 div.btm_btn{ display: none!important; }
.page-id-21335 div.btm_btn{ display: none!important; }
.page-id-21336 div.btm_btn { display: none!important; }
header.header_container.smaller .nav_container .buttons .btn,
.subpage header.header_container .nav_container .buttons .btn { background-color:#189B21!important; color:#fff!important; }
header.header_container.smaller .nav_container .buttons .btn:hover,
.subpage header.header_container .nav_container .buttons .btn:hover { background-color:#466477!important; color:#fff!important; }

.shop_button { float: right!important; top: 36px!important; }
.shop_button:hover { background: #fff!important; color: rgb(70 100 119)!important; }

@media only screen and (max-width: 900px) {
    .shop_button { display: none!important; }

#videoWrapper {
    position: absolute;   /* oluline */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .intro {
    height: 100vh;        /* hoia fullscreen */
  }

  .intro-inner {
    position: absolute;
    height: 100%;
  }
.fluid-width-video-wrapper {
    height: 100%;
}
}
.book_trigger_shop { position:absolute;top:36px;right:25px;z-index: 9; }
.btn.btn-empty:hover { border-color: #000;color: #000; }

.subpage .header_container .logo, .smaller .header_container .logo { width: 300px;  }
.header_container .logo { background-image: url('../img/hestia-hotel-hugo-logo.svg'); width: 310px; height: 36px; }

.language ul a:hover { color:#466477 }
.subpages_content li { font-weight: 400; font-size: 16px; line-height:1.5; }
.subpage .language ul a:hover {color:#000}

.top_triggers a:hover { color:#466477 }
.nav_trigger:hover { color:#466477 }

.subpage .top_triggers a:hover { color: #000; }
.subpage .nav_trigger:hover { color:#000 }

.header_container.smaller .language ul a:hover { color:#000 }
.header_container.smaller .top_triggers a:hover { color:#000 }
.header_container.smaller .nav_trigger:hover { color:#000 }

.offer-price, .offer_price, .top_detail_price { color: rgb(70 100 119); }

.big-bg-aside li::before { color: #466477; }
.subpages_content li::before { color: rgb(70 100 119); }
.aside-content li::before { color: rgb(70 100 119); }
.footer_container { background: #466477; }
.footer_block:nth-child(2), .footer_block:nth-child(3) { background: rgb(70 100 119); }

.subpages_content li ul li::before { top: -50px; }


/*.nav_overlay ul.mobilenav.btm_nav.last { margin-top: 15px;background: #7c878e;padding: 10px 0; }
.nav_overlay ul.mobilenav.btm_nav.last li a { border-left: 5px solid #7c878e;color:#fff; }
.nav_overlay ul.mobilenav.btm_nav.last li a:hover, .nav_overlay ul.mobilenav.btm_nav.last li.active a { color: #fff;border-left: 5px solid #696158; }
*/


.ui-widget-header {
    background: #466477;
    color: #fff;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid rgb(70 100 119);
    background: rgb(70 100 119);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
    border: 1px solid rgb(70 100 119);
    background: rgb(70 100 119);
}

.mobile_links li
{
    width:33.33%!important;
}
.accordion h3.extra, .subpages_content .accordion h3.extra
{
    padding-left:40px!important;
}
.accordion h3.extra::after,
.accordion h3.extra.active::after
{
    right:auto;
    left:0 !important;
}
.accordion h3.extra span.extra
{
    position:absolute;
    right:0;
}
.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-horizontalRow button
{
    background-color:rgb(70 100 119)!important;
}
.language ul li ul { 
    background: #466477;
}
.nav_overlay ul.mobilenav .menu-item-has-children span, .nav_overlay ul.mobilenav .current-menu-parent span { color: #466477; }
img.static-width {width:auto!important; display:block!important; margin-left:auto!important;margin-right:auto!important;}

/***** Acitvity Holiday page *****/

.activity-holiday .three-offers .title-block
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color:rgba(0,0,0,.4);
}
.activity-holiday .three-offers .title-block h3
{
    padding:0 1rem;
    text-align:center;
    color:#fff;
    font-size: 25px;
    line-height: 1.2;
    font-weight: 700;
    font-family: 'Gilroy', arial, sans-serif;
}

/*** Magnific Popup ***/
#modal-wrap .btn
{
  font-size: 1.2rem;
}
#modal-wrap {
    max-width: 750px;
    background-color: #fff;
    margin: 0 auto;
    position: relative;
    color: #000;
}
#modal-wrap.advanced
{
    background:none;
}

.modal-inline {
    /*overflow: hidden;*/
    display: flex;
    display: -ms-flex;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
    -ms-justify-content: center;
}

.modal-content,
.modal-content:before,
.modal-content:after {
    box-sizing: border-box;
}
.popup_top .modal-inline,
.popup_bottom .modal-inline
{
    flex-direction: column;
}
.popup_left .modal-content
{
     /*float: right;*/
     order:1;
}
.popup_left .modal-media
{
     /*float: left;*/
     order:0;
}
.popup_right .modal-content
{
     /*float: left;*/
     order:0;
}
.popup_right .modal-media
{
     /*float: right;*/
     order:1;
}
.popup_top .modal-content
{
    order:1;
}
.popup_top .modal-content,
.popup_top .modal-media,
.popup_bottom .modal-content,
.popup_bottom .modal-media
{
    float:none;
    width:100%;
    display: flex;
    display: -ms-flex;
    -ms-flex-direction: column;
    flex-direction: column;
    /*-ms-align-items: center;*/
    /*align-items: center;*/
    height: 100%;
    width: 100%;
    flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    width: 100%;
    flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
    position: relative;
    justify-content: center;
    -ms-justify-content: center;
}
.modal-content {
    width: 400px;
    /*float: left;*/
    padding: 35px 15px 76px;
    background-image: url('img/popop_logo_transp.png');
    background-repeat: no-repeat;
    background-position: bottom center;
    background:#f1f2f3;
}
.advanced .modal-content
{
    padding:0;
    background:none;
    background-color:rgba(255,255,255,.83);
    position: relative;
    z-index:1;
}
.advanced.popup_right .modal-content
{
    right:-45px;
}
.advanced.popup_left .modal-content
{
    left:-45px;
}
.advanced.popup_top .modal-content
{
    top:-45px;
}
.advanced.popup_bottom .modal-content
{
    bottom:-45px;
}
.advanced.popup_left .mfp-close
{
    left:0!important;
}
.image .modal-inline
{
    min-height:500px;
    overflow:hidden;
    position: relative;
}

.image .modal-content
{
    height: 100%;
    width: 100%;
    z-index: 1;
    padding:0;
    background:none;
}
.image .bg-black
{
    position: absolute;
    top:0;left:0;
    width:100%;height:100%;
    background-color:rgba(0,0,0,.45);
}
.image .modal-media
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:100%;

}
.image .modal-media img
{
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    min-height: 100%;
}

.image .modal-content h2,
.image .modal-content h3,
.image .modal-content h4,
.image .modal-content h5,
.image .modal-content h6,
.image .modal-content p
{
    color:#fff;
}
.modal-content h2 {
    font-size: 35px;
    padding-bottom: 10px;
    line-height: 1
}

.modal-content h3 {
    font-size: 29px;
    padding-bottom: 10px;
}

.modal-content h4 {
    font-size: 25px;
    padding-bottom: 10px;
}

.modal-content p {
    font-size: 20px;
    padding-bottom: 1px;
    display: block;
    text-align: inherit;
    margin-top:0;
}

.modal-content .learn_more {
    padding: 10px 20px;
    margin: 0 10px;
}

.modal-media {
    width: 350px;
    /*float: right;*/
}

.modal-media img {
    max-width: 100%;
    height: auto;
}


/* overlay at start */

.mfp-fade.mfp-bg {
    opacity: 0;

    -webkit-transition: all 0.45s ease-out;
    -moz-transition: all 0.45s ease-out;
    transition: all 0.45s ease-out;
}


/* overlay animate in */

.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8
}


/* overlay animate out */

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}


/* content at start */

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;

    -webkit-transition: all 0.65s ease-out;
    -moz-transition: all 0.65s ease-out;
    transition: all 0.65s ease-out;
}


/* content animate it */

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}

.page-id-742 div.rows {
    margin-top: 45px;
}
/* content animate out */

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}

.mfp-fade .mfp-close {
    color: #000;
    background-color:#fff;
}
.search_overlay.active {
    background:#466477;
}
@media only screen and (max-width: 768px) {
/** Magnific Popup **/
    .mfp-fade .mfp-close
    {
        color:#000;
    }
    .classic .modal-media
    {
        display:none;
    }
    .modal-content
    {
        width:100%;
    }
    .advanced .modal-inline 
    {
        position: relative;
        min-height: 200px;
        overflow: hidden;
        padding: 10%;
    }
    .advanced .modal-content
    {
        right:auto!important;
        left:auto!important;
    }
    .advanced .modal-media
    {
        width: 100%;
        position: absolute;
    }
    .advanced .modal-media img
    {
        width:100%;
    }
    .header_container .logo,
    .subpage .header_container .logo, .smaller .header_container .logo  {
        width: 242px;
        height: 28px;
    }
}
.booking-block .btn {
    background: #189B21;
    color: #fff;
}
.booking-block .btn:hover { background:#000; color: #fff; }

@media only screen and (max-width: 730px) {
    .header_container.smaller {
        padding: 20px 10px;
    }
    }
    @media only screen and (max-width: 768px) {
    .header_container .logo, .subpage .header_container .logo, .smaller .header_container .logo {
        width: 238px;
        height: 28px;
    }
    }
@media only screen and (max-width: 640px) {
  .intro-video .intro-inner {
    bottom: auto;
    top: auto;
    transform: none;
    position: relative;
  }
    .intro-inner { bottom: 0;top: auto; }
  .intro-video .intro-inner {
    bottom: auto;
    top: auto;
    transform: none;
    position: relative;
  }

}


/* --------------------------
  INTRO
-------------------------- */

.subpages .intro { height:270px;max-height: 270px; }
.subpages .intro.nobg { height:auto;max-height: 100%;color:#1A1818; }
.subpages .intro-inner { top:50%;bottom:auto;transform: translateY(-50%);padding:0; }
.subpages .nobg .intro-inner { position: relative;bottom:auto;top:auto;transform: none;padding:2rem 0; }
.intro-inner-box {
    background-color: #f7f7f7f5;
}
.intro h2 {color:#FCBB9A; }
.intro h3 {color:#FCBB9A; }

.scroll-down {
    position: absolute; 
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    
    z-index: 20;
    
    width: 38px;
    height: 42px;
    background-image: url('../img/scroll.png');
    background-repeat: no-repeat;
    background-size: contain;

    text-indent: -9999px;
}

/* -------------------------
  BIG PLANS
--------------------------*/

.bigplans{ padding: 5rem 0;    background-color: #f2f3f4; }

.plans-top{
  text-align: center;
}

.plans-top .btn{
  min-width: 272px;
  margin-top: 1rem;
}

.plans-floors .form-control {
  max-width: 272px;
  margin: 0 auto;
  font-size: 1.2rem;
  height: 60px;
  font-weight: 700;
  padding: 1rem 3rem!important;
  background-color: #ffffff;
}

.plan-wrapper{
  margin: 7rem 0;
  padding: 5rem;
  background: #fff;
}

.plan-wrapper h2,
.plan-wrapper p{
  text-align: center;
}

.plan-wrapper h2{
  margin-bottom:3rem;
}

.outside-views{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.btn-view{
  background-color: transparent;
  background-image: url('../img/icon-view.svg');
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: 70px auto;
  padding: 60px 10px 10px;
  border:0;
  color:#FCBB9A;
}
.btn-view:hover, .btn-view:focus{
  background-color: transparent;
  color: #111;
}

.plan-more-info {
  text-align: center;
  padding-left:5rem;
  margin-bottom:4rem;
}

.plan-more-info img{
  margin-top: 3rem;
}

.plan-street{
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
  width: 120px;
  margin: 0 auto;
}
.plan-street img{
  width: 40px;
  height: auto;
}
.plan-street p{
  margin: 7px 0 0;
}

.plan-side-street{
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
  position: absolute;
  top:calc(50% - 60px);
  right: -100px;
  transform: rotate(90deg);
  width: 120px;
  margin: 0 auto;
}
.plan-side-street img{
  width: 40px;
  height: auto;
}
.plan-side-street p{
  margin: 7px 0 0;
}

.plan{ position: relative;margin: 2rem 0;margin-right:60px; }
.plan .floor-img{ width: 100%; }
.plan a{ display: block; }
.plan a.booked{ background-color: rgba(187, 187, 187, .88); }
.plan a:hover, .plan a.active{ background-color:rgba(252, 187, 154,.6); }
.plan a:hover{ z-index:3!important; }

.plan a .tooltip {
  font-size: 40px;
  padding: 10px 20px;
  font-weight: 400;
  text-align: center;
  pointer-events:none;
  min-width: 100px;
}

.plan a:hover .tooltip {
  transform: translate(-50%, -60px);
  opacity: 1;
  z-index: 9;
}

.plan .tooltip .booked-room{
  display: block;
  font-size: 11px;
  font-style: normal;
  opacity: .6;
  text-transform: uppercase;
}

blockquote{
  border-top: solid 1px #aaa;
  border-bottom: solid 1px #aaa;
  padding-bottom:2rem;
}
.boxes-content-text blockquote p{
  font-style: italic;
  font-size: 24px;
}
.blockquote-footer {
  display: block;
  font-size: 80%;
  color: #6c757d;
}
.blockquote-footer::before {
  content: "\2014 \00A0";
}

table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
  left: 1.3em;
}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
  left: 0.5em;
}

.table-top{
  display: flex;
  align-items: center;
}
.table-top .btn{
  margin-left:auto;
}

.datatable-prices{
  margin: 3rem 0;
}
table.dataTable th,
table.dataTable td {
  width: 25%;
}
.datatable-prices thead {
    background-color: #466477;
    color: #fff;
}

.table td, .table th {
    border-bottom: 1px solid #466477;
    font-size: 18px;
    font-weight: 500;

}
table.dataTable .booked-apt td {
  color:#aaa;
}
.table.dataTable th,
.table.dataTable td {
  padding: 1.5rem 20px 1.5rem 40px;
}
table.dataTable td:last-child {
  font-weight: 700;
}

table.dataTable td .btn-sm {
  font-size: 12px;
  padding: .6rem 2rem;
  margin-left: 30px;
}
table.dataTable td .btn-sm:focus{
  background-color: #1A1818;
  color: #FCBB9A;
  border-color: #1A1818;
}
div.dataTables_wrapper div.dataTables_paginate ul.pagination li{
  display: inline-block;
  font-size: 13px;
}
div.dataTables_wrapper div.dataTables_paginate ul.pagination li a{
  padding: 7px 10px;
}

/*------------------------
	MODALS
------------------------*/

.modal-wrap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  opacity: 0;
  background: #fff;
  overflow: auto;
  transition: .2s;
}
.modal-wrap-inner{
  display: flex;
  justify-content: center;
  align-items: center;
  -ms-flex-align: center;
  min-height: 100%;
}
.modal-content {
  position: relative;
  margin: 50px auto;
  background: #fff;
  max-width: 600px;
  box-shadow: 0 0 20px 0 rgba(54, 0, 0, 0.11);
  transform: scale(0.9);
  transition: transform 0.4s ease;
  padding:40px;
}
.modal-content.flex {
  display: flex;
  padding: 0;
  max-width: 1100px;
}

.modal-content.flex .modal-content-photo {
  flex-basis: 50%;
  max-width: 50%;
  position: relative;
}

.modal-content.flex .modal-content-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.modal-content.flex .modal-content-photo .btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.modal-content-photo .btn-view:hover, .modal-content-photo .btn-view:focus{
  color: #fff;
}

.modal-content.flex .modal-content-text {
  flex-basis: 50%;
  max-width: 50%;
  height: 100%;
  padding:40px;
  position: relative;
}

.modal-content.flex .modal-content-text .btn-book {
  position: absolute;
  top: 60px;
  right: 40px;
}

.modal-content h2, .modal-content h3, .modal-content h4, .modal-content p{
  margin:20px 0;
  padding:0;
}
.modal-content ul {
  margin: 3rem 0;
  list-style: none;
  padding-left: 20px;
}

.modal-content ul li {
  position: relative;
  padding-left: 20px;
}

/* Ionicons icon */
.modal-content ul li::before {
  font-family: "Ionicons";
  content: "\f120";
  font-size: 12px;
  position: absolute;
  left: 0;
  top: 4px;
  color: #466477;
}



.close-modal {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 9;
  
}
.close-modal img{
  width:40px;
  padding: 6px;
  border-radius: 100%;
  background-color: #fff;
}
.close-modal:hover{
  transform: scale(1.05);
}

.modal-wrap.active {
    opacity: 1;
    z-index: 999;
    background: rgba(26, 24, 27, .6);
    transition: opacity .4s;
}
.modal-wrap.active .modal-content {
  transform: scale(1);
  -webkit-transition: transform 0.2s ease;
  -moz-transition: transform 0.2s ease;
  -o-transition: transform 0.2s ease;
  transition: transform 0.2s ease;
}

/* --------------------------
  POPUP Window
-------------------------- */
.modal-page {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  opacity: 0;
  background: #fff;
  overflow: auto;
  transition: .2s;
}
.modal-page.active {
  opacity: 1;
  z-index: 999;
  background: rgba(26, 24, 27, .6);
  transition: opacity .4s;
}
.modal-page .modal-content {
  padding:0;
  width: 100%;
}
.modal-page .close-modal {
  top:15px;right:15px;
}
.modal-page .modal-content .flex {
  display:flex;
}
.modal-page .modal-content .flex .flex-item {
  flex-basis: 50%;
  max-width: 50%;
  position: relative;
}

table.dataTable thead th.sorting:before,
table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:before,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:before,
table.dataTable thead th.sorting_desc:after {
  bottom: auto !important;
  display: inline !important;     /* samale reale */

}

/* Tooltip */
.tooltip {
    font-family: 'Gilroy', arial, sans-serif!important;
    display: block;
    position: relative;
    border: 3px solid #466477;
    text-decoration: none;
    padding: 20px;
    background-color: #FCBB9A;
    color: #466477;
    position: absolute;
    bottom: 56px;
    left: 50%;
    transform: translate(-50%, -80px);
    opacity: 0;
    transition: all .1s ease-in-out .1s;
    white-space: nowrap;
    z-index:5;
    min-width: 200px;
    pointer-events:none;
}
.tooltip:before {
    content: '';
    display: block;  
    position: absolute;
    left: 50%;
    top: calc(100%);
    width: 0;
    height: 0;
    border: 12px solid transparent;
    border-top-color: #1A1818;
    transform: translate(-50%, 0);
}

.tooltip:after {
    content: '';
    display: block;  
    position: absolute;
    left: calc(50%);
    top: calc(100%);
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-top-color: #FCBB9A;
    transform: translate(-50%, 0);
}

.icons-list li:hover .tooltip
{
  transform: translate(-50%, -60px);
  opacity: 1;
  z-index:9;
}
/* =========================
   MODAL – FINAL HUGO STYLE
========================= */

/* wrapper */
.modal-content.flex {
  display: flex;
  max-width: 1100px !important;
  width: 100%;
  margin: 0 auto;
}

/* LEFT – image */
.modal-content.flex .modal-content-photo {
  flex: 0 0 60%;
  max-width: 60%;
  position: relative;
}

/* image full */
.modal-content-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* RIGHT – text */
.modal-content.flex .modal-content-text {
  flex: 0 0 40%;
  max-width: 40%;
  padding: 40px 50px;
}

/* TITLE */
.modal-content-text h2 {
  font-size: 28px;
  margin-bottom: 10px;
}

.modal-content-text h3 {
  display: block;
  width: 100%;

  background: #f2f3f4;
  padding: 12px 16px;

  font-size: 18px;
  font-weight: 600;

  margin: 15px 0 20px;
}

/* text */
.modal-content-text p {
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 10px;
}

/* spacing list */
.modal-content-text ul {
  margin-top: 10px;
  padding-left: 18px;
}

/* close button */
.close-modal {
  position: absolute;
  top: 20px;
  right: 20px;
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .modal-content.flex {
    display: block;
  }

  .modal-content.flex .modal-content-photo,
  .modal-content.flex .modal-content-text {
    max-width: 100%;
    width: 100%;
  }

  .modal-content.flex .modal-content-text {
    padding: 25px;
  }
}
@media only screen and (max-width:600px) {
.table td { padding: 6px 0 10px 40%!important;font-size:14px;line-height: 30px; border: none; }
.table td:before { width: 35% }
.table .text-right { text-align: left;margin-top: 0 }
}

table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting {
  padding-left: 40px;
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before {
  left: 1em;
}
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
  left: 0.5em;
}

.table-top{
  display: flex;
  align-items: center;
}
.table-top .btn{
  margin-left:auto;
}

.datatable-prices{
  margin: 3rem 0;
}
table.dataTable th,
table.dataTable td {
  width: 25%;
}
@media only screen and (max-width:1030px) {
  table.dataTable th,
  table.dataTable td {
    width: auto;border: none;
        left: 50% !important;
    transform: translateX(-50%);
    right: auto !important;
  }
.close-modal {
    right: 40px;
}

.table td { padding: 6px 0 10px 40%!important;font-size:14px;line-height: 30px; border: none; }
.table td:before { width: 35% }
.table .text-right { text-align: left;margin-top: 0 }
}

      .table-top {
        display: block;
        text-align: center;
    }
    .table-top .btn{
  margin-left:auto;
}

.datatable-prices{
  margin: 3rem 0;
}
table.dataTable th,
table.dataTable td {
  width: 25%;
}
}
@media only screen and (max-width: 1100px) {
    .plan-side-street img {
        display: none;
    }
}
@media only screen and (max-width: 500px) {
    .plan-side-street {
        top: calc(50% - 22px);
    }
}
@media only screen and (max-width: 430px) {
    .table-top {
        display: block;
        text-align: center;
    }
}