@import "fonts.css";

/* HTML5 Boilerplate
 * ==|== normalize ==========================================================
 */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a {color: #00e;}
a:visited { color: #8e9298; }
a:hover { color: #06e; text-decoration:none; }
a:focus { outline:none; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
.modal-backdrop.show {opacity:.9 !important;}

body, html {font-family: 'Raleway', sans-serif; height: 100%; margin: 0; overflow:scroll; -webkit-overflow-scrolling: touch;}

a.navbar-brand {margin:7px 0 11px 10px; background:url("../img/logo.png") no-repeat; background-size:cover; width:82px; height:90px; display:block; text-indent:-9999px; cursor:pointer;}
a.navbar-brand-mb {display:none}

header#header {position:relative; background-image: url("../img/home.jpg"); height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover;}

header#header.ekibimiz {background-image: url("../img/ekibimiz.jpg");}
header#header.contact-us {background-image: url("../img/contact-us.jpg");}
header#header.vekalet {background-image: url("../img/vekalet.jpg");}
header#header.deneyimler {background-image: url("../img/bg-contact-us.jpg");}
header#header.hakkimizda {background-image: url("../img/hakkimizda.jpg");}
header#header.vizyonumuz {background-image: url("../img/vizyonumuz.jpg");}
header#header.misyonumuz {background-image: url("../img/misyonumuz.jpg");}
header#header.calisma-alanlarimiz {background-image: url("../img/calisma-alanlarimiz.jpg");}

.navbar {border-bottom:1px solid rgba(255, 255, 255, 0.3); padding:0 !important;}
#navbarResponsive .navCol {margin:0 auto; border-left:1px solid rgba(255, 255, 255, 0.3); border-right:1px solid rgba(255, 255, 255, 0.3);}
#navbarResponsive .navCol .navbar-nav {margin:0 auto;}
.navbar-nav li {}
.navbar-nav li a{font-family: 'Raleway', sans-serif; font-weight:600; font-size:0.75em; display:inline-block; padding:20px 22px !important; color:#fff !important; cursor:pointer; letter-spacing:2px; border-right:1px solid rgba(255, 255, 255, 0.3); border-bottom:1px solid rgba(255, 255, 255, 0.3);}
.navbar-nav li:last-child a{border-right:none;}
.navbar-nav li a:hover,
.navbar-nav li.selected a {background:rgba(38, 48, 60, 0.63);}
.lang-nav {padding:14px 22px; display:block;}
.lang-nav li{display:inline-block;}
.lang-nav li a{font-family: 'futura_normal_trnormal'; font-size:10px; color:#fff; border:none; display:inline-block; float:left; padding:0px 15px 0px 0 !important;}
.lang-nav li a.selected {text-decoration:underline;}
#phone {font-family: 'Raleway', sans-serif; color:#fff; float:right; font-size:14px; margin:-40px 20px 0;}

.navbar .col ul.social {padding-top:25%; margin-top:-12px;}
.navbar .col ul.social li {display:inline-block; padding-right:10px; color:#fff;}
.navbar .col ul.social li a {color:#fff; font-size:16px;}

#homeSlide {color:#fff;}
#homeSlide .slogan01{font-size:18px; text-align:center; display:block; letter-spacing:.5em; font-weight:100; margin:30px auto 15px;}
#homeSlide .slogan02{font-size:60px; text-align:center !important; display:block; letter-spacing:.6em; font-weight: 300; margin:0 auto;}

#homeSlide .sloganRefika01{font-size:42px; text-align:center !important; display:block; letter-spacing:.5em; font-weight: 300; margin:0 auto 30px;}
#homeSlide .sloganRefika02{font-size:16px; text-align:center; display:block; letter-spacing:0.5px; font-weight:100; margin:0 auto 15px;}


a#page-down {width:59px; height:59px; border:1px solid #fff; font-size:20px; font-weight:600; color:#fff; cursor:pointer; border-radius:50%; display:inline-block; position:absolute; left:50%; margin-left:-30px; bottom:40px; text-align:center; padding:15px 0; text-decoration:none;}
a#page-down:hover {background-color:#fff; color:#04172e; font-weight:bold;}

.reservation {height:100px; background:#04172e; color:#fff;}
.reservation form {height:100%;}
.reservation label {color:#525964; font-size:12px;}
.reservation button.btn-rev {font-size:12px; background:#fff; width:100%; height:100%; display:block; cursor:pointer; border-radius:0; margin:0 -15px 0 15px;}
.reservation input {background:transparent; border:1px solid #1e2f43; border-radius:0; padding-left:14px; color:#fff; width:100px !important;}
.reservation input:focus {background:transparent; border:1px solid #1e2f43; border-radius:0; color:#fff; width:100px !important; outline:none; box-shadow: none;}
.input-group-addon.btn-plus { position: absolute; right: 50px; top: 2px; z-index: 10; color:#8e9298;}
.input-group-addon.btn-minus { position: absolute; right: 30px; top: 2px; z-index: 10; color:#8e9298;}
.input-group-addon.btn-plus:hover,
.input-group-addon.btn-minus:hover {color:#fff; text-decoration:none;}

.icon-bar { width: 22px; height: 2px; background-color: #B6B6B6; display: block; transition: all 0.3s; margin-top: 4px }
.navbar-toggler { border: none !important; background: transparent !important; outline:none !important; }
.navbar-toggler .top-bar { transform: rotate(45deg); transform-origin:15% 10%; }
.navbar-toggler .middle-bar { opacity: 0; }
.navbar-toggler .bottom-bar { transform: rotate(-45deg); transform-origin:15% 85%; }
.navbar-toggler.collapsed .top-bar { transform: rotate(0); }
.navbar-toggler.collapsed .middle-bar { opacity: 1; }
.navbar-toggler.collapsed .bottom-bar { transform: rotate(0); }
button.navbar-toggler,
button.navbar-toggler.collapsed { border-left: 1px solid rgba(255, 255, 255, 0.3) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; padding:26px; margin-top:-1px; border-radius: 0; float: right; }
.navbar-dark .navbar-toggler {color: rgba(255,255,255,.5); border-left: 1px solid #000 !important; border-bottom: 1px solid #000 !important;}
button.navbar-toggler {   margin:5px -11px -1px 0;}
button.navbar-toggler.collapsed { margin:5px -11px 0 0;}
.icon-bar { width: 32px; height: 2px; background-color: #fff; display: block; transition: all 0.3s; margin-top: 6px; }
a.res{display:none;}

#roomsContent {padding:30px 0;}
#experienceContent {}
#activityContent01,
#activityContent02,
#activityContent03,
#activityContent04{padding:30px 0; background:#f7f7f7; min-height:400px;}

.descCol {min-height:463px; margin:60px auto; display:block;}
.descCol h1 {font-family: 'Raleway', sans-serif; font-size:50px; display:block; width:100%; margin-bottom:15px; padding-right:60px;}
.descCol p.desc {font-family: 'Raleway', sans-serif; font-size:16px; margin-bottom:30px; font-weight:bold;  display:block; width:100%; color:#484848; padding-right:60px;}
.descCol p {font-family: 'Raleway', sans-serif; font-size:16px;  display:block; width:100%; color:#484848; padding-right:60px;}
.descCol a.moreinfo{font-size:11px; color:#fff; background-color:#000; padding:18px 30px; margin:21px 0 0 0px; display:inline-block; }
.descCol a.moreinfo:hover{color:#fff; background-color:#0471A6; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}

.activityTitle {padding-top:30px; font-size:18px; color:#000;}
.activityCol {padding:15px; background:transparent;}
.activityCol h2 {font-family: 'Raleway', sans-serif; font-size:30px; color:#171717; margin:0 0 30px;}
.activityCol .descCol {background:#fff; padding:30px;}
.activityCol img {margin-bottom:30px;}
.activityCol p{margin-bottom:0px;}

.descCol2 ul.activity {margin:100px -4px 0px -0px; display:block; width:100%; padding:0;}
.descCol2 ul.activity li {list-style:none; display:inline-block; width:25%; height:74px; color:#000; border:1px solid #dedede; margin:0 0 0 -1px; float:left;}
.descCol2 ul.activity li a{display:block; height:100%; text-align:center; color:#000; font-size:11px; cursor:pointer;}
.descCol2 ul.activity li a i {font-size:20px; display:inline-block; margin:10px auto 8px;}
.descCol2 ul.activity li a.active {background-color:#04162d; color:#fff !important; margin:0;  display:block;}
.descCol2 ul.activity li a:hover {display:block; color:#fff; margin:0; background-color:#04162d; cursor:pointer; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}
a#allYearActivity {padding:50px 0; background:#b3b3b3; color:#fff; font-family: 'Raleway', sans-serif;  font-weight:600; letter-spacing:2px; text-align:center; display:block; text-decoration:none;}
a#allYearActivity:hover {background:#4d4d4d;}

.rNumber {font-family: 'Raleway', sans-serif; font-size:12px; color:#acacac; margin-bottom:30px;}
.rNumber span.line{width:32px; height:1px; background:#000; display:inline-block; margin:5px 20px 5px 0;}
.rNumber span.active{color:#000;}
.textCol {min-height:463px; margin:60px auto; display:block; border-top:1px solid #ccc;}
.textCol h2 {font-family: 'Raleway', sans-serif; font-size:36px; display:block; width:100%; margin-bottom:15px; padding-right:60px;}
.textCol p {font-family: 'Raleway', sans-serif; font-size:16px;  display:block; width:100%; color:#484848; padding-right:60px;}
.textCol a.moreinfo{font-size:11px; color:#fff; background-color:#000; padding:18px 30px; margin:21px 0 0 0px; display:inline-block; }
.textCol a.moreinfo:hover{color:#fff; background-color:#282828; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}

div.zoom {position:absolute; z-index:10; right:15px; top:0; padding-top:6px; width:40px; height:40px; background:rgba(0,0,0,0.3); text-align:center; color:#fff;}
div.note {font-family: 'Raleway', sans-serif; font-size:16px; font-style:italic; font-weight:600; text-align:right; padding-right:45px; position:relative; top:-90px;}


#experience {margin:15px 0 0; font-family: 'Raleway', sans-serif; color:#fff;}
#experience .textCol{margin:15px 0px 15px 60px; min-height:666px; color:#000;}
#experience .textCol h2 {font-size:41px; display:block; width:100%; margin-bottom:60px; padding-right:60px;}
#experience .textCol p {font-size:16px;  display:block; width:100%; color:#484848; padding-right:60px;}
#experience .aboutCol{margin:15px 15px 15px 0px; background:url("../img/about.jpg.jpg") no-repeat; background-size:cover; min-height:666px;}



#rooms {font-family: 'Raleway', sans-serif; color:#fff;}
#rooms .roomsCol{margin:15px 0 15px 15px; background:url("../img/ekibimiz.jpg") no-repeat; background-size:cover; min-height:538px;}
#rooms .roomsCol h2{padding:280px 0 20px 45px; margin:0; font-size:28px; letter-spacing:8px;}
#rooms .roomsCol p.desc{font-size:16px; margin:0; padding:0 0 0 45px; display:block;}
#rooms .roomsCol a.moreinfo{font-size:11px; color:#191919; background-color:#fff; padding:12px 21px; margin:21px 0 0 45px; display:inline-block; }
#rooms .roomsCol a.moreinfo:hover,
#kitchen .kitchenCol a.moreinfo:hover{color:#fff; background-color:#04172e; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}
#rooms .experienceCol{margin:15px 15px 15px 0px; background:url("../img/work.jpg") no-repeat; background-size:cover; min-height:538px;}
#rooms .experienceCol h2{padding:280px 0 20px 45px; margin:0; font-size:28px; letter-spacing:8px;}
#rooms .experienceCol p.desc{font-size:16px; margin:0; padding:0 45px; display:block;}
#rooms .experienceCol ul.activity {margin:20px 0px 5px; padding:0 45px;}
#rooms .experienceCol ul.activity li {list-style:none; display:inline-block; width:25%; height:84px; border:1px solid #fff; margin:0; float:left; margin:0 0 0 -1px;}
#rooms .experienceCol ul.activity li a{display:block; height:100%; text-align:center; color:#fff; font-size:11px; cursor:pointer;}
#rooms .experienceCol ul.activity li a i {font-size:20px; display:inline-block; margin:10px auto 8px;}
#rooms .experienceCol ul.activity li.selected {background-color:#fff; color:#000 !important;}
#rooms .experienceCol ul.activity li.selected a {color:#000;}
#rooms .experienceCol ul.activity li a:hover {color:#191919; background-color:#fff; cursor:pointer; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}
#rooms .experienceCol .all-activity {color:#fff; font-size:12px; display:block; margin:0px auto; text-decoration:underline; width:220px; text-align:center; padding:10px 0;}

#kitchen {font-family: 'Raleway', sans-serif; color:#fff;}
#kitchen .kitchenCol{margin:15px 0 30px 15px; background:url("../img/vekalet.jpg") no-repeat; background-size:cover; min-height:270px;}
#kitchen .kitchenCol h2{padding:45px 0 20px 45px; margin:0; font-size:28px; letter-spacing:8px;}
#kitchen .kitchenCol p.desc{font-size:16px; margin:0; padding:0 0 0 45px; display:block;}
#kitchen .kitchenCol a.moreinfo{font-size:11px; color:#191919; background-color:#fff; padding:12px 21px; margin:21px 0 0 45px; display:inline-block; }
#kitchen .instagramCol{margin:15px 0 30px; background:url("../img/instagram-bg.jpg") no-repeat; background-size:cover; min-height:270px; padding:45px;}
#kitchen .instagramCol h3.author{}
#kitchen .instagramCol p.desc{font-size:16px;}
#kitchen .instagramCol{}
#kitchen .twitterCol{margin:15px 15px 30px 0; min-height:270px; background-color:#836a52; font-family: 'Raleway', sans-serif; font-size:16px; color:#fff; padding:30px 45px 45px;}
#kitchen .twitterCol p.desc{margin:0px; display:block;}
#kitchen .twitterCol .author{font-family: 'Raleway', sans-serif; font-weight:600; font-size:16px; color:#433d37; padding-top:10px; display:block;}
#kitchen .twitterCol .icon-quote {color:#c1b5a9; font-size:44px; margin:0 0px 0 -13px;}

.slideCol {min-height:480px; margin:10px auto; display:block; border-top:none;}
.slideCol h2 {font-size:30px;}
.slideCol a.seeall {font-family: 'Raleway', sans-serif; font-size:12px; text-decoration:underline; color:#000; margin-bottom:20px;}
.slideCol .rNumber {margin:30px 0 20px;}
.slider01 {width:100%;}
.slider01 .item {width:450px; height:450px; display:inline-block;}
.slider02 .item {width:450px; height:450px; display:inline-block;}
.slider03 .item {width:450px; height:450px; display:inline-block;}

#contact {}
#contact .map{padding-top:30px;}
#contact span.line{width:20px; height:1px; background:#000; display:inline-block; margin:5px 31px 5px -56px;}
#contact ul.contactList {margin: 0 0 60px; padding: 0;}
#contact ul.contactList li{list-style: none; padding-left: 66px; margin:18px -4px 18px 4px;}
#contact ul.contactList li strong.phone {text-decoration:underline;}
#contact ul.contactList li strong.phone2 {text-decoration:underline; margin-left:-4px;}
#contact ul.contactList li.last {line-height:30px;}
#contact h2{font-family: 'Raleway', sans-serif; font-size:44px; padding:40px 0 30px; margin-bottom:30px; border-bottom:1px solid #ccc;}
#contact h3{font-family: 'Raleway', sans-serif; font-size:16px; font-weight:600; letter-spacing:2.4px; margin-bottom:40px;}
#contact h3 i{font-size: 28px; margin-right:16px;}
#contact .icon-car {width: 30px; display: inline-block; margin-right: 18px; margin-left: 10px;}
#contact .icon-helicopter {margin-right: 18px; margin-left:5px;}
#contact p{font-family: 'Raleway', sans-serif; font-size:16px;}

.bx-wrapper .bx-pager.bx-default-pager a.active{ background: #fff; border-radius: 0px; width: 20px; height: 1px; margin-bottom: 4px; }

footer#footer {background:#000; min-height:200px; position:relative; }
footer a {display:inline-block;}
footer .fcol01 {margin:40px; width:100%;}
footer .flogo   {padding-right:70px;}
footer .flogo .logo-footer {width:145px; height:159px; display:block; margin:0 auto 34px;}
footer .fmap .btn-map {width: 210px; height: 48px; display: block; border: 1px solid #fff; padding: 10px 14px; font-size: 16px; color: #fff; text-decoration: none; margin:0 auto;}
footer .fmap .btn-map:hover {background-color:#fff; color:#04172e; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out;}
footer h2 {font-family: 'Raleway', sans-serif; display:block; font-size:18px; letter-spacing:3px; color:#fff; width:100%; margin:46px 0 20px;}
footer ul {margin:0 0 46px; padding:0; display:block;}
footer ul li {list-style:none; display:block; margin-bottom:10px;}
footer ul li a {font-family: 'Raleway', sans-serif; display:inline-block; color:#8e9298; font-size:16px; text-decoration: none;}
footer ul li a:hover {color:#fff; text-decoration:none;}
footer ul li.selected a {color:#fff; text-decoration:none;}
footer ul.social li {display:inline-block; padding-right:10px;}
footer #page-up {width:59px; height:59px; border:1px solid #262626; font-size:18px; color:#fff; cursor:pointer; border-radius:50%; display:inline-block; position:absolute; right:30px; bottom:80px; text-align:center; padding:15px 0;}
footer #page-up:hover {color:#04172e; background-color:#fff; border:1px solid #fff; cursor:pointer; -webkit-transition: background-color 0.5s ease-out; -moz-transition: background-color 0.5s ease-out; -o-transition: background-color 0.5s ease-out; transition: background-color 0.5s ease-out; text-decoration:none;}


@media all and (-webkit-min-device-pixel-ratio: 1.5) {
    a.navbar-brand {background:url("../img/logo@2x.png") no-repeat; background-size:cover;}
    a.navbar-brand-mb {background:url("../img/logo-mb@2x.png") no-repeat; background-size:cover;}

    header#header {
        /* The image used */
        background-image: url("../img/home@2x.jpg");

        /* Full height */
        height: 100%;

        /* Center and scale the image nicely */
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }
    header#header.ekibimiz {background-image: url("../img/ekibimiz@2x.jpg");}
    header#header.contact-us {background-image: url("../img/contact-us@2x.jpg");}
    header#header.ofisimiz {background-image: url("../img/ofisimiz@2x.jpg");}
    header#header.vekalet {background-image: url("../img/vekalet@2x.jpg");}
    header#header.deneyimler {background-image: url("../img/bg-contact-us@2x.jpg");}
    header#header.hakkimizda {background-image: url("../img/hakkimizda@2x.jpg");}
    header#header.vizyonumuz {background-image: url("../img/vizyonumuz@2x.jpg");}
    header#header.misyonumuz {background-image: url("../img/misyonumuz@2x.jpg");}
    header#header.calisma-alanlarimiz {background-image: url("../img/calisma-alanlarimiz@2x.jpg");}

    #experience .aboutCol{background:url("../img/about@2x.jpg") no-repeat; background-size:cover;}

    #rooms .roomsCol{background:url("../img/ekibimiz@2x.jpg") no-repeat; background-size:cover;}
    #rooms .experienceCol{background:url("../img/work@2x.jpg") no-repeat; background-size:cover;}
    #kitchen .kitchenCol{background:url("../img/vekalet@2x.jpg") no-repeat; background-size:cover;}
    #kitchen .instagramCol{background:url("../img/instagram-bg@2x.jpg") no-repeat; background-size:cover;}
}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
    body {overflow-x:hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    header#header {background-position:left top; position:relative;}
    a.navbar-brand {margin:10px 0 10px 0px; background:url("../img/logo@2x.png") no-repeat; background-size:cover; width:82px; height:90px; display:block; text-indent:-9999px; cursor:pointer;}
    a.navbar-brand-mb {margin:22px 0 26px 20px; background:url("../img/logo-mb.png") no-repeat; background-size:cover; width:120px; height:60px; display:block; text-indent:-9999px; cursor:pointer;}

    a.res {
        display: block;
        width: 86px;
        height: 78px;
        color: #fff;
        font-size: 24px;
        border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
        padding: 22px 26px 30px;
        position: absolute;
        right: 86px;
        top: -77px;
    }
    a.res:active,
    a.res:hover {color:#fff;}

    button.navbar-toggler.collapsed { position: absolute; right: 0; padding:26px;}
    /*#navContainer {display:none !important;}*/
    #navContainer .collapse.show {display:block !important;}
    button.navbar-toggler {   margin:5px -22px -1px 0;}
    button.navbar-toggler.collapsed { margin:5px 0px 0 0;}

    button.navbar-toggler {
        position: absolute;
        right: 20px;
        top: -82px;
        z-index: 10;
        color:#000;
    }
    button.navbar-toggler.collapsed .icon-bar {background-color:#fff !important;}
    button.navbar-toggler .icon-bar {background-color:#000 !important;}
    div#navbarResponsive {

        color:#000 !important;
        position:fixed;
        width: 100%;
        margin-left: -16px;
        top:0;
        height:100%;
        z-index: 9;
    }

    .navbar-collapse.collapsing {
        height: auto;
        -webkit-transition: right 0.3s ease;
        -o-transition: right 0.3s ease;
        -moz-transition: right 0.3s ease;
        transition: right 0.3s ease;
        right: -100%;
    }
    .navbar-collapse.show {
        right: 0;
        -webkit-transition: right 0.3s ease-in;
        -o-transition: right 0.3s ease-in;
        -moz-transition: right 0.3s ease-in;
        transition: right 0.3s ease-in;
    }

    div#navbarResponsive a{color:#000 !important;}
    div#navbarResponsive a:hover{background:transparent;}
    ul#social-xl {display:none !important;}
    #homeSlide .slogan01{font-size:10px; text-align:center; display:block; letter-spacing:.3em; font-weight:100; margin:0 auto 15px;}
    #homeSlide .slogan02{font-size:30px; text-align:center !important; display:block; letter-spacing:.2em; font-weight: 300; margin:0 auto;}

    #experience .textCol { border:none; margin: 15px 0 0; min-height:180px; color: #000; text-align: center; }
    #experience .aboutCol {min-height: 430px; margin:0;}
    #experience .textCol h2 {font-size: 24px; display: block; width: 100%; margin-bottom: 30px; padding: 0; text-align:center;}
    #experience .textCol p { font-size: 14px; display: block; width: 100%; color: #484848; padding: 0; text-align:center; margin-bottom: 0;}

    #homeSlide .sloganRefika01 {font-size:22px; letter-spacing:.2em;}


    #rooms .roomsCol{margin:15px -15px;}
    #rooms .experienceCol{margin:15px -15px;}
    #kitchen .kitchenCol{margin:15px -15px;}
    #kitchen .instagramCol{margin:35px 0px 15px 0px; }
    #kitchen .twitterCol{margin:0px 0px 50px 0px;}
    footer .flogo .logo-footer {margin:0 0 34px;}
    footer .fmap .btn-map {margin:0;}
    footer .fcol01,
    footer .fcol02,
    footer .fcol03,
    footer .fcol04 {margin:30px; width:100%;}
    footer h2 {margin:0px 0 20px;}
    footer ul {margin:0;}
    footer #page-up {bottom:40px;}
}

/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) {
    body {overflow-x:hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    header#header {background-position:left top; position:relative;}
    a.navbar-brand {margin:10px 0 10px 0px; background:url("../img/logo@2x.png") no-repeat; background-size:cover; width:82px; height:90px; display:block; text-indent:-9999px; cursor:pointer;}
    a.navbar-brand-mb {margin:22px 0 26px 20px; background:url("../img/logo-mb.png") no-repeat; background-size:cover; width:120px; height:60px; display:block; text-indent:-9999px; cursor:pointer;}
    /*#navContainer {display:none !important;}*/
    #navContainer .collapse.show {display:block !important;}

    a.res {
        display: block;
        width: 86px;
        height: 78px;
        color: #fff;
        font-size: 24px;
        border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding: 22px 26px 30px;
        position: absolute;
        right: 86px;
        top: -76px;
    }
    a.res:active,
    a.res:hover {color:#fff;}
    button.navbar-toggler.collapsed {
        margin: 39px -10px 0 0;
    }
    button.navbar-toggler {
        position: absolute;
        right: 10px;
        top: -115px;
        z-index: 10;
        color:#000;
    }
    button.navbar-toggler.collapsed .icon-bar {background-color:#fff !important;}
    button.navbar-toggler .icon-bar {background-color:#000 !important;}
    div#navbarResponsive {

        color:#000 !important;
        position:fixed;
        width: 100%;
        margin-left: -16px;
        top:0;
        height:100%;
        z-index: 9;
    }

    .navbar-collapse.collapsing {
        height: auto;
        -webkit-transition: right 0.3s ease;
        -o-transition: right 0.3s ease;
        -moz-transition: right 0.3s ease;
        transition: right 0.3s ease;
        right: -100%;
    }
    .navbar-collapse.show {
        right: 0;
        -webkit-transition: right 0.3s ease-in;
        -o-transition: right 0.3s ease-in;
        -moz-transition: right 0.3s ease-in;
        transition: right 0.3s ease-in;
    }

    div#navbarResponsive a{color:#000 !important;}
    ul#social-xl {display:none !important;}
    #homeSlide .slogan01{font-size:16px; text-align:center; display:block; letter-spacing:.5em; font-weight:100; margin:0 auto 15px;}
    #homeSlide .slogan02{font-size:36px; text-align:center !important; display:block; letter-spacing:.5em; font-weight: 300; margin:0 auto;}
    #header a#page-down {bottom:40px !important;}

    #experience .textCol { border:none; margin: 15px 0px 15px 60px; min-height:180px; color: #000; text-align: center; }
    #experience .aboutCol {min-height: 430px;}
    #experience .textCol h2 {font-size: 24px; display: block; width: 100%; margin-bottom: 30px;}
    #experience .textCol p { font-size: 14px; display: block; width: 100%; color: #484848; padding-right: 60px; margin-bottom: 0;}

    #homeSlide .sloganRefika01 {font-size:34px;}

    #rooms .roomsCol{margin:15px -15px;}
    #rooms .experienceCol{margin:15px -15px;}
    #kitchen .kitchenCol{margin:15px -15px;}
    #kitchen .instagramCol{margin:35px 15px 15px 15px; }
    #kitchen .twitterCol{margin:15px 15px 50px 15px;}
    footer .flogo .logo-footer {margin:0 0 34px;}
    footer .fmap .btn-map {margin:0;}
    footer .fcol01,
    footer .fcol02,
    footer .fcol03,
    footer .fcol04 {margin:30px; width:100%;}
    footer h2 {margin:0px 0 20px;}
    footer ul {margin:0;}
    footer #page-up {bottom:50px;}
}

/*  Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) {
    body {overflow-x:hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    #homeSlide .slogan01{font-size:16px; text-align:center; display:block; letter-spacing:.5em; font-weight:100; margin:0 auto 15px;}
    #homeSlide .slogan02{font-size:22px; text-align:center !important; display:block; letter-spacing:.6em; font-weight: 300; margin:0 auto;}
    #header a#page-down {bottom:40px !important;}
    body {overflow-y:auto;}
    header#header {background-position:left top; position:relative;}
    a.navbar-brand {margin:10px 0 10px 0px; background:url("../img/logo@2x.png") no-repeat; background-size:cover; width:82px; height:90px; display:block; text-indent:-9999px; cursor:pointer;}
    a.navbar-brand-mb {margin:22px 0 26px 20px; background:url("../img/logo-mb.png") no-repeat; background-size:cover; width:120px; height:60px; display:block; text-indent:-9999px; cursor:pointer;}
    /*#navContainer {display:none !important;}*/
    #navContainer .collapse.show {display:block !important;}

    a.res {
        display: block;
        width: 86px;
        height: 78px;
        color: #fff;
        font-size: 24px;
        border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        padding: 22px 26px 30px;
        position: absolute;
        right: 86px;
        top: -3px;
    }
    a.res:active,
    a.res:hover {color:#fff;}
    button.navbar-toggler.collapsed {
        margin: 39px -10px 0 0;
    }
    button.navbar-toggler {
        position: absolute;
        right: 10px;
        top: -115px;
        z-index: 10;
        color:#000;
    }
    button.navbar-toggler.collapsed .icon-bar {background-color:#fff !important;}
    button.navbar-toggler .icon-bar {background-color:#000 !important;}
    #navContainer .collapse.show {display:block !important;}

    button.navbar-toggler {
        position: absolute;
        right: 10px;
        top: -115px;
        z-index: 10;
        color:#000;
    }
    button.navbar-toggler.collapsed .icon-bar {background-color:#fff !important;}
    button.navbar-toggler .icon-bar {background-color:#000 !important;}
    button.navbar-toggler.collapsed {
        margin: 6px -10px 0 0;
        top: -8px;
    }
    button.navbar-toggler {
        position: absolute;
        right: 10px;
        top: -8px;
        z-index: 10;
        color: #000;
    }
    div#navbarResponsive {
        color:#000 !important;
        position:fixed;
        width: 100%;
        margin-left: -16px;
        top:0;
        height:100%;
        z-index: 9;
    }

    .navbar-collapse.collapsing {
        height: auto;
        -webkit-transition: right 0.3s ease;
        -o-transition: right 0.3s ease;
        -moz-transition: right 0.3s ease;
        transition: right 0.3s ease;
        right: -100%;
    }
    .navbar-collapse.show {
        right: 0;
        -webkit-transition: right 0.3s ease-in;
        -o-transition: right 0.3s ease-in;
        -moz-transition: right 0.3s ease-in;
        transition: right 0.3s ease-in;
    }

    div#navbarResponsive a{color:#000 !important;}
    ul#social-xl {display:none !important;}

    #rooms .roomsCol{margin:15px;}
    #rooms .experienceCol{margin:15px;}
    #kitchen .kitchenCol{margin:15px 15px 15px 15px;}
    #kitchen .instagramCol{margin:15px 0px 30px 15px; }
    #kitchen .twitterCol{margin:15px 15px 30px 0px;}

    footer .flogo .logo-footer {margin:0 0 34px;}
    footer .fmap .btn-map {margin:0;}
    footer .fcol01,
    footer .fcol02,
    footer .fcol03,
    footer .fcol04 {margin:30px; width:100%;}
    footer h2 {margin:0px 0 20px;}
    footer ul {margin:0;}
    footer #page-up {bottom:50px;}
}

/*  Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
    body {overflow-x:hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    .navbar-nav li a{font-size:8px;}
    #header a#page-down {bottom:40px !important;}
    #kitchen .twitterCol p.desc {
        margin: 0px;
        display: block;
        max-height: 100px;
        overflow: hidden;
    }
    footer #page-up {bottom:50px;}

}

/*  Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    body {overflow-x:hidden; overflow-y:scroll; -webkit-overflow-scrolling: touch;}
    #header a#page-down {bottom:40px !important;}
    footer #page-up {bottom:50px;}

}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    footer .flogo .logo-footer {margin:0 0 34px;}
    footer .fmap .btn-map {margin:0;}
    footer .fcol01,
    footer .fcol02,
    footer .fcol03,
    footer .fcol04 {margin:30px; width:100%;}
    footer h2 {margin:0px 0 20px;}
    footer ul {margin:0;}

}