@import url('normalize.css');
@import url('global.css');
@import url('sport.css');
@import url('hotel.css');

/* ============== */
/*  GLOBAL CLASSES  */
/* ============== */
body { margin:0px; padding:0px; width:100%; font:120% 'Roboto', sans-serif; color:#040707; line-height:1.5em; }
p,ul { margin:15px 0px 15px 0px; }
b { font-weight:700; }
img { max-width: 100%; height: auto; }

.very-big-text { font-size:280%; }
.big-text { font-size:200%; }
.medium-text { font-size:140%; }
.text { font-size:100%; }
.small-text { font-size:85%; }
.very-small-text { font-size:75%; }

.no-padding { padding:0px !important; }
.no-margin { margin:0px !important; }

.my-6 { margin-top:4rem !important; margin-bottom: 4rem !important; }

.text-yellow { color:#FFBF00 }

/* ============== */
/*  FORM CLASSES  */
/* ============== */

/* ================= */
/*  MODULES CLASSES  */
/* ================= */
.lastminute-thumb {}
.lastminute-thumb .lastminute-thumb-title { font-family:'Roboto Condensed', sans-serif; font-size:200%; text-align: center; margin-bottom:20px; text-transform:uppercase; font-weight:700; }
.lastminute-thumb .lastminute-thumb-image { position: relative; }
.lastminute-thumb .lastminute-thumb-image img { width:100%; }
.lastminute-thumb .lastminute-thumb-footer { position: absolute; left:0px; bottom:0px; padding:10px 15px; background:rgba(140,233,41,0.8); width:100%; color:#FFF; }

/* ================= */
/*  THEME  CLASSES   */
/* ================= */
.title { font-family:'Roboto Condensed', sans-serif; font-size:270%; text-align: center; letter-spacing:-1px; margin-bottom:10px; text-transform:uppercase; font-weight:700; }
.subtitle { font-family:'Roboto Condensed', sans-serif; font-size:160%; text-align: center; margin-bottom:20px; text-transform:uppercase; font-weight:700; }

.btn-custom { background-color:#8ce929 !important; color:#FFF !important; border-radius:0px; padding:12px 20px; text-transform:uppercase; font-weight: bold; text-align:center; white-space: normal; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
.btn-custom:hover { background-color:#7cd31f !important; color:#FFF !important; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
.btn-custom-2 { background-color:#FFF !important; color:#8ce929 !important; border:2px solid #FFF; border-radius:0px; padding:12px 20px; text-transform:uppercase; font-weight: bold; text-align:center; white-space: normal; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
.btn-custom-2:hover { background-color:transparent !important; color:#FFF !important; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }

.bg-custom { background:#ededed; }
.bg-custom-2 { background-color:#8ce929; color:#FFF; }
.bg-custom-2 .title, .bg-custom-2 .subtitle { color:#FFF; }
.bg-custom-2 ul { list-style-image:url('/images/icon-list-white.png'); }

.icon-white .icon-circle { border:4px solid #FFF; color:#FFF; }
.icon-white .icon-circle:hover { color:#8ce929; background:#FFF; }

.slick-dots { bottom: -35px !important; }
.slick-dots li button::before { background-color:#333; height:18px; width:18px; border-radius:22px; border:none; color:transparent !important; }
.slick-dots li.slick-active button::before { background-color:#333; color:transparent !important; }

ul { list-style-image:url('/images/icon-list.png'); }
ul li { margin:4px 0px; }

.lg-backdrop { z-index:10010; }
.lg-outer { z-index:10020; }

/* ================= */
/*  EFFECT  CLASSES  */
/* ================= */
.parallax { background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; }

/* ================ */
/*  HEADER CLASSES  */
/* ================ */
#sticky-wrapper { background-color:#FFF; position:relative; width:100%; padding:0px; z-index:10000; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
#sticky-wrapper.sticky { position:fixed; top:0px; padding:0px; z-index: 9999; border-bottom:1px solid #ededed; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
#sticky-wrapper.sticky .logo { padding:10px 0; }

#page-header .logo { padding:20px 0; }

#language-menu { text-align: right; }
#language-menu .btn { background-color:transparent; color:#040707; line-height:1; font-weight: bold; }
#language-menu .btn span { display:block; }
#language-menu .dropdown-menu { margin-left:-24px; min-width:4rem; text-align: center; text-transform:uppercase; font-weight: bold; font-size:80%; }
#language-menu .dropdown-menu a { color:#040707; }
#language-menu ul li { margin:0px; }

.language-menu { font-size:80%; text-transform: uppercase; border-bottom:1px solid #CCC; }
.language-menu ul { padding-left:0px; margin:0px; }
.language-menu ul li { color: #040707; list-style-image:none; list-style-type:none; display:inline-block; padding:3px 8px 0px; }
.language-menu a { font-size:100%; }
/*
#language-menu { margin:0px; position: relative; z-index: 100000; text-transform: uppercase !important; }
#language-menu .btn { background-color:transparent; color:#FFF; border: none; border-radius: 0px; }
#language-menu ul { padding: 0px; margin:0px; }
	#language-menu .dropdown .dropdown-menu { position: absolute; background:#FFF !important; min-width:80px; left:-40px; text-align:center; max-height: 0; display: block; overflow: hidden; opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
	#language-menu .open > .dropdown-menu a { color:#494949 !important; padding:5px; }
	#language-menu .dropdown.open .dropdown-menu { max-height: 200px; opacity: 1; font-size: 80%; }
	#language-menu .btn-group.open .dropdown-toggle { box-shadow: none; }
*/
#carousel { position:relative; width:100%; min-height:100%; }
#carousel img { width:100%; }
#carousel .caption { position:absolute; top:25%; left:5%; max-width:850px; font-size:570%; color:#FFF; font-weight:900; text-transform:uppercase; text-shadow: 0px 0px 10px black; line-height:0.9em; letter-spacing:-4px; }

/* === STYLES MENU === */
#page-header .menu { margin:0px; border-top:1px solid #e9e9e9; font-family:'Roboto Condensed', sans-serif; text-align:center; font-size:90%; font-weight:700; text-transform:uppercase; }
#page-header .menu a { text-align: center; color: #040707; padding:20px 6px 15px; border-bottom:5px solid #FFF; vertical-align: middle; display: inline-block; line-height:1em; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
#page-header .menu a:hover { text-decoration:none; padding:20px 6px 15px; border-bottom:5px solid #8ce929; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
#page-header .menu li { display: inline; }

/* Menù mobile */
.menu-mobile {  }
.navbar-toggler { background-color:#040707; padding:0px 5px; margin-right:-15px; float:right; height:85px; border-radius:0; }
.navbar-toggler-icon { background:#FFF; display: block; height:3px; margin:5px 0px; width:45px; }

/* ================== */
/*  CONTENTS CLASSES  */
/* ================== */
#page-contents { margin-top:45px; }

#main-sport .header-box-main-sport { height:80px; width:100%; margin:0; overflow-x: hidden; transform: matrix(1, -0.2, 0, 1, 0, 0); -ms-transform: matrix(1, 0.15, 0, 1, 0, 0); -moz-transform: matrix(1, 0.15, 0, 1, 0, 0); -webkit-transform: matrix(1, 0.15, 0, 1, 0, 0); -o-transform:matrix(1, 0.15, 0, 1, 0, 0); }
#main-sport .box-main-sport { height:800px; padding:566px 0px 0px !important; }
#main-sport .box-main-sport .title { height:190px; width:100%; margin-top:-36px; padding:50px 5px 30px; text-align: center; color:#FFF; line-height:1em; }

#other-sport { background:url('/images/bg-altri-sport.jpg') no-repeat; background-size:cover; color:#FFF; padding:80px 0; text-align: center; }
.slick-carousel-icon .slick-carousel div { margin:0 auto 15px !important; }
.slick-carousel-icon .slick-dots { bottom: -25px !important; }
.icon-white .slick-dots li button::before { background-color:#FFF; }
.icon-white .slick-dots li.slick-active button::before { background-color:#FFF; }

.icon-circle { padding:25px; margin:10px auto; border:4px solid #040707; color:#040707; border-radius:50%; width:175px; height:175px; display: block; }
.icon-circle span[class^="sport-"]::before, .icon-circle span[class^="hotel-"]::before { font-size:600%; line-height:1em; }
.icon-circle:hover { color:#8ce929; background:#FFF; border-color:#8ce929; }

.hotels .slick-slide { position: relative; }
.hotels .subtitle { background:rgba(0,0,0,0.8); padding:10px; text-align: left; font-size:200%; color: #FFF; width:100%; position: absolute; bottom: 0; left:0; margin:0px; }
.hotels .subtitle span { font-size:50%; vertical-align: bottom; }

/* === STYLE CAROUSEL === */
#page-contents .slick-carousel { width:96%; margin-left: auto; margin-right: auto; }
	#page-contents .slick-carousel div { margin:0 20px 0px 10px; }
	#page-contents .slick-carousel div img { width:100%; margin: auto; }
	#page-contents .slick-carousel .caption { text-align: center; margin-top:10px; font-size:90%; }
	#page-contents .slick-carousel .slick-prev::before, .slick-carousel .slick-next::before { font-size:35px; color:#FFF; font-family: 'global'; opacity:1; }
	#page-contents .slick-carousel .slick-prev::before { content: "\f188"; }
	#page-contents .slick-carousel .slick-next::before { content: "\f187"; }
	#page-contents .slick-carousel .slick-next { right:-15px !important; width: 50px; height: 50px; background:#293591; border-radius:50%; z-index:100; }
	#page-contents .slick-carousel .slick-prev { left:-15px !important; width: 50px; height: 50px; background:#293591; border-radius:50%; z-index:100; }

.list-icon { list-style-type:none; margin-top:0px; }
.list-icon li { display:block; margin:10px; }
.hotel span[class^="hotel-"]::before { color:#62a31d; font-size:160%; padding:10px; margin:0px 5px 0px 0px; border:1px solid #62a31d; border-radius:50%; width:55px; height:55px; display: inline-block; }
.hotel img { width:100%; }
.hotel ul.row { margin-top:5px; padding-left:15px;  }
.hotel ul.row li { padding:0px; margin:10px 30px 0; }

/* ================= */
/*  FOOTER  CLASSES  */
/* ================= */
#page-footer { font-size:80%; margin-top:40px; }
#page-footer .logo { width:300px; }
#page-footer a { color:#333; }
#page-footer span[class^="global-"]::before { font-size:200%; }
#newsletter, #newsletter .subtitle { text-align: right; }
#brand-group { background:#545454; text-align: center; color:#FFF; }
#brand-group ul li { margin:5px 10px; }

/* ============= */
/*  MEDIA QUERY  */
/* ============= */
@media only screen and (max-width: 1200px) {
#page-header .logo { padding:10px 0; }
#carousel .caption { font-size:500%; }
.list-icon { padding-left:0px; margin-top:20px; }
.list-icon li { display:inline-block; margin:10px; }
}

@media only screen and (max-width: 1024px) {
#carousel .caption { display: none; }
.parallax { background-attachment: scroll; }

}

/* For Ipad */
@media only screen and (max-width: 992px) {
	#main-sport .header-box-main-sport { height:70px; width:100%; margin:0; overflow-x: hidden; transform: matrix(1, -0.2, 0, 1, 0, 0); -ms-transform: matrix(1, 0.15, 0, 1, 0, 0); -moz-transform: matrix(1, 0.15, 0, 1, 0, 0); -webkit-transform: matrix(1, 0.15, 0, 1, 0, 0); -o-transform:matrix(1, 0.15, 0, 1, 0, 0); }
	#main-sport .box-main-sport { height:680px; padding:496px 0px 0px !important; }
	#main-sport .box-main-sport .title { height:150px; width:100%; margin-top:-36px; padding:50px 5px 30px; font-size:200%; }

	#newsletter, #newsletter .subtitle { text-align: left; }
}

@media only screen and (max-width: 769px) {
	body { font-size:110%; }
	.title { font-size:160%; }
	.subtitle { font-size:130%; }
	.title-service { font-size:130%; }
	.btn-lg { font-size: 1.0rem !important; }

	.navbar-toggler { height:80px; }

	.icon-circle { padding:15px; width:125px; height:125px; }
	.icon-circle span[class^="sport-"]::before, .icon-circle span[class^="hotel-"]::before { font-size:400%; }

	.hotels .subtitle { padding:6px; font-size:160%; }

}

@media only screen and (min-width: 480px) and (max-width: 769px) { }

@media only screen and (max-width: 480px) {
	.navbar-toggler { height:65px; }
}


/* ========================= */
/*  FULLSCREEN MOBILE MENU'  */
/* ========================= */
.overlay {
		/* Height & width depends on how you want to reveal the overlay (see JS below) */
		height: 100%; /* 100 o 0 a seconda di come deve comparire */
		width: 0; /* 100 o 0 a seconda di come deve comparire */
		position: fixed; /* Stay in place */
		z-index: 1000000; /* Sit on top */
		left: 0;
		top: 0;
		background-color: rgba(255,255,255,0.9); /* Black w/opacity */
		overflow-x: hidden; /* Disable horizontal or vertical scroll (a seconda di come deve comparire) */
		transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
		position: relative;
		top:40px; /* 25% from the top */
		height: 100%; /* 100% width o height a seconda di come deve comparire */
		text-align: center; /* Centered text/links */
		margin-top:0px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
		padding: 4px;
		margin-top:2px;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 110%;
		color: #666;
		display: block; /* Display block instead of inline */
		transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
		color: #FFF !important;
		background-color: #333 !important;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
		position: absolute;
		right: 20px;
		font-size: 60px;
		line-height:40px;
		color: #666;
}

/* When the height of the screen is less than 450 pixel, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
		.overlay a { font-size: 20px; }
		.overlay .closebtn {
				font-size: 40px;
				top: 15px;
				right: 35px;
		}
}
