@font-face {
    font-family: Morsal;
    src: url(Morsal.ttf);
}

@font-face {
  font-family: Candara;
  src: url(Candara_Bold.ttf);
  font-weight: bold;
}

@font-face {
  font-family: Candara;
  src: url(Candara.ttf);
}

@font-face {
  font-family: Candara;
  src: url(Candara_Italic.ttf);
  font-style: italic;
}



a {
   color:inherit;
}

a:hover {
   text-style: underline;
   color: inherit;
}

#wpadminbar {
   display:none !important;
}


/*PALETTE*/

:root {
  --black: #333;
  --lightgrey: #e3e3e3;
  --lightblue: #009ee3;
}


/*BARRA SUPERIORE*/

.sup-bar {
   height:50px;
   font-weight: 700;
   line-height: 50px;
   font-family: 'Candara';
   position:fixed;
   background-color: transparent ;
   top:0;
   z-index: 10;
}

.sup-bar a, .schedule-sup-bar a {
   color: var(--lightgrey) ;
   font-size: 14px !important;
}

.sup-bar a:hover {
   text-decoration:underline;
}


@media screen and (max-width: 400px) {
#site-title {
   font-size: 21px !important;
   }
}

.navbar-nav, .navbar-nav li {
   display: inline-block !important;
}

.nav-link {
   padding-top: 0px !important;
   padding-bottom: 0px !important;
   padding-right: 19px !important;
}


/*UTILS*/
.some-little-space {
   margin-top: 20px;
}

.some-little-padding {
   padding-top: 20px;
}

.some-little-padding-bottom {
   padding-bottom: 20px;
}

.some-padding {
   padding-top: 50px;
}



.inflater {
   margin-top: 50px;
}


.full-height {
   height:100%;
}


/*GENERAL TEXT*/

h1 {
   font-family: 'Morsal';
}




/*HOME*/

.welcome-section {
   height: calc(100vh);
   color: var(--black);
   position:relative;
   
}

.wel-sec-content {
	z-index:10;
}


.home-bg {
   background-image:url('https://dev.coralivarazze.it/wp-content/uploads/2023/03/1-scaled.jpg');
   background-position: center;
   background-size:cover;

}

.header-shadow {
    height: 100%;
    width: 100%;
    position: absolute;
    background: rgba(0,0,0,0.55);
}

.welcome-section-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.welcome-section-text > h1 {
   color: var(--lightblue);
   font-size: 76px;
}

.welcome-section-text > h2 {
   font-family: Candara;
   font-style: normal;
   font-size: 36px;
   color: var(--lightgrey);
}

.welcome-section-text > p {
 font-family: Candara;
font-style: normal;
font-weight: 500;
font-size: 24px;
}



/*MENU LATERALE*/


.hamburger {
  cursor: pointer;
  display: flex;
    flex-direction: column;
    align-self: center;
}

.bar1, .bar2, .bar3 {
  width: 35px;
  height: 2px;
  background-color: var(--lightgrey);
  margin: 3px 0;
  transition: 0.4s;
}

.hamburger {
   margin-top:5px;   
}

.icon-nav {

	cursor: pointer;

}

#nav {
      	position: fixed;
      	width: 100%;
      	height: calc( 100% - 80px);
      	right: -100%;
         top:50px;
      	z-index: 110;
      	transition: all 0.7s;
      	background: var(--black);
      	overflow: auto;
         display:flex;
         color: var(--lightgrey);
         flex-direction: column;
        justify-content:center;
        align-items: center;
        font-family: 'Candara', sans-serif;
}

#nav li {
   list-style-type:none;
   margin: 0.75rem 0;
   line-height: 1.7;
}
#nav a {
    color: #FFF !important;
        font-size: 16px !important;
        font-weight: 900 !important;
}


  #nav.active {
      	right: 0px;
      }
      
      
.icon-con {
   width: 40px;
   height: 40px;
}


/*SECTIONS*/

.box-black {
    background-color: var(--black);
    color: var(--lightgrey);
    padding: 50px 0px;
}

.box-gray {
    background-color: var(--lightgrey);
    color: var(--black);
    padding: 50px 0px;
}

@media screen and (min-width: 768px) {
	.box-gray, .box-black{
    	padding: 25px 0px;
	}
}
	

h3.title-sec {
	font-size: 20px;
	font-family: 'Morsal';
	color: var(--lightblue);
	margin-bottom: -5px;
}

h4.title-sec {
	font-size: 20px;
	font-family: 'Candara';
}

.text-sec {
    font-size: 16px;
    line-height: 24px;
    font-family: 'Candara';
    text-align: center;
    padding: 0.5rem 2rem;
}

@media screen and (min-width: 768px) {
	.img-sec {
		padding: 0 2rem;
	}
}

@media screen and (max-width: 767px) {
	.img-sec {
		margin-top: 1rem;
	}
}
	

.main-cta {
	background-color: var(--lightblue);
	display:inline-block;
	color: var(--lightgrey) !important;
	border-radius:10px;
	font-size: 14px;
	padding: 6px 22px;
	
}

.box-black h4.title-sec {
	color: var(--lightgrey);
}

.box-gray h4.title-sec {
	color: var(--black);
}


/*PAGE*/


/*pagine secondo livello*/
.header-sec {
   height:65vh;
   width:100%;
   background-size: cover;
   position:relative;
   display: flex;
   background-position: center;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: var(--lightgrey);
}

.entry-header {
	z-index: 1;
}

.header-shadow {
    height: 100%;
    width: 100%;
    position: absolute;
    background: rgba(0,0,0,0.55);
    top: 0;
    left: 0;
}

.content-sec {
   margin: 4em 0;
   color: var(--lightgrey);
}

.menu-title {
	font-size: 30px;
	font-family: 'Morsal';
	color: var(--lightblue);
	margin-top: 50px;
}

.dish-cont {
	padding: 30px 0;
}

.box-black .dish-cont {
	border-bottom: 1px dashed rgba(227,227,227,0.10);
}

.box-gray .dish-cont {
	border-bottom: 1px dashed rgba(51,51,51,0.10);
}

.dish-name {
	font-size: 24px;
	font-family: 'Candara';
	font-weight: bold;
}

.dish-desc {
	font-size: 16px;
	font-family: 'Candara';
}

.dish-price {
	font-size: 32px;
	font-family: 'Candara';
}


/* Tooltip container */
.tooltip0 {
  position: relative;
  display: inline-block;
}

.footer-icon {
	margin: 0px 10px;
}

/* Tooltip text */
.tooltip0 .tooltiptext {
  visibility: hidden;
  width: 110px;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  word-break: break-all;
  margin:5px;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip0 .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip0:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.social-cont-footer {
	margin-top: 25px;
}
@media screen and (min-width: 768px) {
	.social-cont-footer{
		text-align: right;
		margin-top: 0;
	}
}