body {
   font-family: 'DM Sans', serif;
    background: #fff;
	font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: #454342;
	overflow-x:hidden;	
}

p {
    font-family: 'DM Sans', serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	color:#454342;
}
.lead {
    font-size: 1.2rem;
    font-weight: 400;
}

section{overflow-x:hidden;}
a{
 
    text-decoration: none;
    transition: all 0.3s;
	color:#000;
}
a:hover{color:#666666;text-decoration:underline;}
h1, h2, h3, h4, h5{color:#000;}
h1{font-style: normal;font-weight:700;text-transform:uppercase;margin-bottom:15px;}
h2{font-style: normal;
font-weight:700;text-transform:normal;font-size:1.4em;margin-bottom:25px;}
h3{font-style: normal;
font-weight: 400;}
.nopad{padding:0;margin:0;}
.header{background:transparent;transition: all .3s ease-in-out;}
ul.top-nav-menu{display:block-inline;list-style: none;text-align:center;padding:25px 0px;margin:0;}
ul.top-nav-menu>li{display: inline;padding:5px 10px;}
ul.top-nav-menu>li>a{font-size:15px;font-weight:400;text-transform:uppercase;color:#666;}
ul.top-nav-menu>li>a:hover{text-decoration:none;}

ul.nav-list-menu{display:block-inline;list-style: none;text-align:right;padding:10px 0px 0px 0px;margin:0;}
ul.nav-list-menu>li{display: inline;padding:0px 10px;}
ul.nav-list-menu>li>a{font-size:16px;font-weight:600;text-transform:uppercase;color:#009640;}
ul.nav-list-menu>li>a:hover{text-decoration:none;color:#005625;}

ul.nav-list-menu-lang{display:block-inline;list-style: none;text-align:right;padding:0px 0px 0px 0px;margin:0;}
ul.nav-list-menu-lang>li{display: inline;padding:0px 10px;}
ul.nav-list-menu-lang>li>a{font-size:16px;font-weight:600;text-transform:uppercase;color:#000;}
ul.nav-list-menu-lang>li>a:hover{text-decoration:none;color:#000;}
ul.nav-list-menu-lang>li>a.lang-active{color:#000;text-decoration:underline;}

.text-muted{color:#dcdbdb!important;}
.navbar {
    padding: 15px 10px;
    background: #fff;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

.alert {
    position: relative;
    padding: .75rem 1.25rem;
        padding-right: 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    border-radius: 0rem;
	text-align:center;
}
.alert-info {
    color: #fff;
    background-color: #00a1af;
    border-color: #00a1af;
}
.alert-info>a{color:#fff;text-decoration:underline;}
.alert-info>a:hover{color:#fff;}


.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    padding: 12px 32px;
	margin: 30px 0 0;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-primary {
    color: #0d2131;
    background-color: transparent;
    border-color: #0d2131;
	text-transform:uppercase;
	border-radius:0;
}
.btn-primary:hover, .btn-primary:hover.active {
    color: #fff;
    background-color: #0d2131;
    border-color: #000;
	text-decoration:none;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #0d2131;
    border-color: #0d2131;
}

/**/
#header{ position:fixed;width:100%;background:#fff;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);z-index:999;padding: 0;}
#prenota{border:0px solid red;padding:25px 0px;}
/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

#sidebar {
    width: 360px;
    position: fixed;
    top: 0;
    left: -360px;
    height: 100vh;
    z-index: 9999;
    background: #fff;
    color: #000;
    transition: all 0.3s;
    overflow-y: scroll;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

#sidebar.active {
    left: 0;
}

#dismiss {

    line-height: 35px;
    text-align: center;
    background: #fff;
    position: absolute;
	color:#000;
    top: 10px;
    left: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;

	z-index: 1031;
}

#dismiss:hover {
    
}
#lng-header{text-align:right;padding:15px;}

.overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1031;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.overlay.active {
    display: block;
    opacity: 1;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #e71f68;
}

#sidebar ul.components {
    padding: 20px 0;
  
}

#sidebar ul p {
    color: #000;
    padding: 10px;
}

#sidebar ul li a {
    padding: 8px 15px;
    font-size: 1.6em;
	font-weight:300;
    display: block;
	color:#000;
	text-decoration:none;
}

#sidebar ul li a:hover {
    color: #000;
	text-decoration:underline;
    
}

#sidebar ul li.active>a {
    color: #000;
    
}
#sidebar ul li.active>a[aria-expanded="true"] {
    color: #000;
    background: #c01151;
}

a[data-toggle="collapse"] {
    position: relative;
}

#sidebar ul li.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #c01151;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

a.download {
    background: #fff;
    color: #e71f68;
}

a.article,
a.article:hover {
    background: #6d7fcc !important;
    color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
.breadcrumb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 2rem 0rem;
    list-style: none;
    background-color: #fff;
    border-radius: .25rem;
	
}
#slide{position:relative;width:100%;height:100%;overflow:hidden;}
#slide span.ttitle{font-size:1.5em;color:#fff;text-transform:uppercase;}
#slide span.htitle{font-size:4em;color:#fff;}
#slide span.btitle{color:#fff;font-size:1.2em;}


#slide img{}
#page{padding-top:15px;padding-bottom:60px;}

#content {
    width: 100%;
    min-height: 100vh;
    transition: all 0.3s;
    position: absolute;
    top: 0;
    right: 0;
}
.head-title{font-size: 48px;
line-height: 56px;}
.head-subtitle{color: #3e3d48;margin:25px 0px;}

.nav-item{padding:0;margin:5px 10px;}
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0;
    padding-left: 0;
}
.navbar {
    padding: 15px 0px;
    background: #fff;
    border: none;
    border-radius: 0;
	margin-bottom:0;
    box-shadow: none;
}

.hbuger{margin:5px;cursor:pointer;}
.nav-link{font-size:16px!important;font-weight:600;text-transform:uppercase;}
.bg-light{background-color:#fff!important;padding:0px 0px!important;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);}



#slider{}

 .swiper-container {
      width: 100%;
      max-height: 600px
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
	.swiper-text-container {
  position: absolute;
  z-index: 991;
  top: 45%;
  transform: translate(0, -50%);
  width: 100%;
  text-align: center;
  color: #fff;
  z-index: 100;
}
.swiper-text-container h2 {
  font: bold 80px/1 sans-serif;
  margin: 20px;
  color:#fff;
}
.swiper-text-container p {
  max-width: 780px;
  margin: 0 auto;
  font-size: 20px;
  line-height: 1.4;
}

#focus1{background-color:#f9f5ee;}
#focus2{}
#focus3{background-color:#f9f5ee;}
#about{padding:100px 0px;}
#footer{padding:100px 0px;background:#001b31;color:#fff;}
#footer a{color:#fff;}
#footer p{color:#fff;}
#contact{padding:100px 0px;background:#fafafa;}
#service{padding:100px 0px;}

.box{border:1px solid #e8e8e8}
#mblock{display:none;}
#dblock{display:block;}

.btn-custom{padding:0;
margin:0;
border:0;color: #454342;}

/* Extra small devices (portrait phones, less than 576px) */
/* No media query since this is the default in Bootstrap*/

/* Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) { 
.swiper-text-container h2{
	font: bold 30px/1 sans-serif;
  margin: 10px;
}
.swiper-text-container p {
  max-width: 360px;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1.4;
  display:none;
}

#mblock{display:block;}
#dblock{display:none;}
 }


/* Large devices (desktops, 992px and up)*/
@media (max-width: 992px) { 
#mblock{display:block;}
#dblock{display:none;}


}



.link {

	cursor: pointer;
	display: inline-block;
	position: relative;
	margin-bottom: 0.5em;
}

.link.anim-destination {
	display: inline-block;
	overflow: hidden;
	padding-right: 0.5em;
	font-size: 2em;
}

.link.anim-destination span {
	position: relative;
	display: inline-block;
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
}

.link.anim-destination span::before {
	position: absolute;
	white-space: nowrap;
	top: 100%;
	content: attr(data-hover);
	font-weight: 500;
}

.link.anim-destination:hover span,
.link.anim-destination:focus span {
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
}

.link.anim-test {
	font-weight: 400;
	color: #ddd;
}

.link.anim-test:after {
	position: absolute;
	content: attr(data-hover);
	color: black;
	top: 0em;
	display: block;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.link.anim-test:hover:after {
	opacity: 0;
	-webkit-transform: scale(0.8);
	transform: scale(0.8);
}

.link.anim-iamhere {
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.link.anim-iamhere:hover {
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	color: blue;
}

.link.anim-classic {
	border-bottom: 3px solid transparent;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.link.anim-classic:hover {
	border-bottom: 3px solid blue;
}

.link.anim-classicsub {
	border-top: 3px solid transparent;
	border-bottom: 3px solid transparent;
	-webkit-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}

.link.anim-classicsub:hover {
	border-top: 3px solid blue;
	border-bottom: 3px solid blue;
}

.link.anim-fancysub:after {
	content: "";
	position: absolute;
	top: -0.6em;
	display: block;
	width: 100%;
	height: 2em;
	border-top: 0.1em solid transparent;
	border-bottom: 0.1em solid transparent;
	background: transparent;
	transition: all 0.5s ease;
}

.link.anim-fancysub:hover:after {
	border-top: 0.1em solid blue;
	border-bottom: 0.1em solid blue;
	top: -0.1em;
	height: 1.2em;
}

.link.anim-fancywrench:after {
	content: "";
	position: absolute;
	top: 0em;
	left: -33%;
	display: block;
	width: 150%;
	height: 1em;
	border-right: 0.1em solid transparent;
	border-left: 0.1em solid transparent;
	background: transparent;
	transition: all 0.5s ease;
}

.link.anim-fancywrench:hover:after {
	border-right: 0.1em solid blue;
	border-left: 0.1em solid blue;
	left: -4%;
	width: 104%;
}

.link.anim-lefttoright:after {
	content: "";
	display: block;
	width: 0;
	height: 3px;
	background: blue;
	transition: all 0.5s ease;
}

.link.anim-lefttoright:hover:after {
	width: 100%;
}

.link.anim-righttoleft:after {
	content: "";
	display: block;
	position: absolute;
	right: 0;
	width: 0;
	height: 3px;
	background: blue;
	transition: all 0.5s ease;
}

.link.anim-righttoleft:hover:after {
	width: 100%;
}

.link.anim-middleout:after {
	content: "";
	display: block;
	width: 0;
	height: 3px;
	background: #005625;
	margin: auto;
	transition: all 0.5s ease;
}

.link.anim-middleout:hover:after {
	width: 100%;
}


.scroll{background:#fff;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);transition: all .3s ease-in-out;}


.btn-custom{color:#fff;}
.btn-custom:hover{color:#fff;}

.menu-white>a{color:#fff;}
.menu-white>.btn-custom{color:#fff;}

.menu-white>li>a{color:#fff!important;}


@media (max-width: 976px) { 
      #hamburger-black{
    display: initial !important;
}
.scroll-nav{position:relative!important;}
.header{position:relative!important;}
.logo-black{display:block!important;max-width:150px;}
.logo-white{display:none;}
.h-white{display:none!important;}
.h-black{display:block!important;}
.scroll-nav .h-white{display:none!important;}
.scroll-nav .h-black{display:block!important;}
.scroll-nav .logo-white{display:none;}
.scroll-nav .logo-black{display:block!important;}


#LogoHeader{
    content:url(https://demo.costakairsperlonga.it/assets/images/logo-riso-amaro.png);
}

#slide span.ttitle{font-size:1em;color:#fff;text-transform:uppercase;font-weight:bold;}
#slide span.htitle{font-size:2.5em;color:#fff;}
#slide span.btitle{color:#fff;font-size:1em;line-height:1.6em;}
#LogoHeader{max-width:150px;}

}
  
.zoom{
   
    transform: scale(1.8);
}

.zoom-out{
    -webkit-transition: all 8s ease;
    -moz-transition: all 8s ease;
    -ms-transition: all 8s ease;
    transition: all 8s ease;
    transform: scale(1);
}
  
  
  .scroll-nav {
  background: #fff;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  transition: all .3s ease-in-out;

}
.logo-black{display:none;}

.scroll-nav .logo-white{display:none;}
.scroll-nav .logo-black{display:block!important;}