﻿
@media only screen and (min-width : 120px) and (max-width : 1023.999px) 
{
	.header {
		display: none;
		box-shadow: 0 0 6px rgba(0,0,0,.25);
		/*height: 11%;*/
	}

		.header .logo {
			display: none;
		}

	.menu-bar-mobile {
		position: fixed;
		height: 80px;
		border-bottom: solid 1px #dddddd; /*background-image: url('/img/logo-IBI.svg?v=1.0'); background-repeat: no-repeat; background-position: 15px center; background-size: auto 60px;*/
		left: 0;
		right: 0;
		top: 0;
		z-index: 99;
		background-color: #fff;
	}

		.menu-bar-mobile .open-menu {
			background-color: #fff;
			width: 50px;
			position: absolute;
			top: 0;
			bottom: 0;
			right: 10px;
			cursor: pointer;
			background-image: url('/img/icons/menu.svg?v=1.0');
			background-repeat: no-repeat;
			background-size: 35px;
			background-position: center;
		}

		.menu-bar-mobile .open-search {
			background-color: #fff;
			width: 50px;
			position: absolute;
			top: 0;
			bottom: 0;
			right: 70px;
			cursor: pointer;
			background-image: url('/img/icons/magnify.svg?v=1.0');
			background-repeat: no-repeat;
			background-size: 35px;
			background-position: center;
		}

		.menu-bar-mobile a img {
			height: 80%;
			width: auto;
			margin: 1%;
		}
	/**/
	.top-menu {
		padding: 10px;
	}

		.top-menu a {
			margin: 20px 10px;
			display: block;
		}


	/**/
	.middle-menu {
		height: 90px;
		padding: 10px;
		background-image: url('/img/logo-IBI.svg?v=1.0');
		background-repeat: no-repeat;
		background-position: 15px center;
		background-size: 98px 80px;
		display: none;
	}
	/**/
	.bottom-menu {
		padding: 10px; /*background-color: #fff;*/
	}

		.bottom-menu a {
			margin: 20px 10px;
			display: block;
		}
		/**/
		.bottom-menu .sub {
			margin: 0 10px;
			display: inline-block;
			cursor: pointer;
			margin-bottom: 4px;
		}

		.bottom-menu img.sub {
			display: none;
		}

		.bottom-menu .submenu {
			position: relative;
			text-align: left;
			display: block;
		}

			.bottom-menu .submenu a {
				display: block;
				margin: 20px 0 15px 10px;
			}
	/**/
	.barCommercianti {
		position: fixed;
		top: 80px;
		left: 50%;
		transform: translate(-50%,0);
		padding: 5px 20px;
		background-color: #ff0000;
		color: #fff;
		text-align: right;
		display: inline-block;
		z-index: 9999;
	}

	.whatsapp {
		background-image: url('/img/icons/social/005-whatsapp.svg?v=1.0');
		padding-left: 20px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: 0 center;
	}

	.phone {
		background-image: url('/img/icons/phone.svg?v=1.0');
		padding-left: 20px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: 0 center;
	}

	.email {
		background-image: url('/img/icons/mail.svg?v=1.0');
		padding-left: 20px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: 0 center;
	}

	.fb {
		background-image: url('/img/icons/social/004-facebook.svg?v=1.0');
		padding-left: 20px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: 0 center;
	}

	.ig {
		background-image: url('/img/icons/social/003-instagram.svg?v=1.0');
		padding-left: 20px;
		background-size: 22px;
		background-repeat: no-repeat;
		background-position: 0 center;
	}

	.bottom-footer {
		display: none;
	}
	/**/
	.sub {
		position: relative;
	}

		.sub .opensub-lista {
		}

		.sub .submenu-lista {
			position: relative;
			background-color: #fff;
			padding: 10px 5px;
			display: none;
			left: 0;
			right: 0;
		}

			.sub .submenu-lista a {
				margin: 10px 0;
				display: block;
			}

		.sub:hover .submenu-lista {
			display: block;
			font-size: 12px
		}
}

@media only screen and (min-width : 1024px) and (max-width: 1025px) {
	.header {
		background: rgba(255,255,255,.95);
		box-shadow: 0 0 10px rgba(0,0,0,.5);
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9999;
		/*height: 11%;*/
	}

	.hamburger-menu {
		cursor: pointer;
		position: relative;
	}

	.menu-bar-mobile {
	}
	/**/
	.top-menu {
		padding: 10px;
		border-bottom: solid 1px #dddddd;
	}

		.top-menu a {
			margin: 0 10px;
		}
	/**/
	.middle-menu {
		height: 100px;
		padding: 10px;
	}

		.middle-menu a.logo {
			display: inline-block;
			position: relative;
		}

			.middle-menu a.logo img {
				display: block;
				position: inherit;
				height: 100px;
				width: auto;
			}

		.middle-menu .box {
			display: inline-block;
			position: relative;
			height: 80px;
			text-align: right;
			line-height: 1;
			float: right;
			color: #003e7e;
		}
	/**/
	.bottom-menu {
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 999;
	}

		.bottom-menu a:hover {
			color: #ccc;
		}


	/*footer*/
	.bottom-footer {
		padding: 10px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		z-index: 999;
		box-shadow: 0px 1px 4px rgba(0, 0, 0,0.25);
	}

	.bottom-menu a {
		margin: 0 10px;
	}
	/**/
	.bottom-menu .sub {
		display: block;
		cursor: pointer;
	}

	.bottom-menu .submenu {
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 999;
		background-color: #eee;
		text-align: left;
		padding: 10px;
		border-top: solid 1px #808080;
		border-bottom: solid 1px #808080;
		display: none;
	}

		.bottom-menu .submenu a {
			display: block;
			margin: 15px 0;
			white-space: nowrap;
		}
	/**/
	.barCommercianti {
		position: fixed;
		top: 0;
		left: 50%;
		transform: translate(-50%,0);
		padding: 5px 20px;
		background-color: #ff0000;
		color: #fff;
		text-align: right;
		display: inline-block;
		z-index: 9999;
	}
	/**/
	.sub {
		position: relative;
	}

		.sub .opensub-lista {
		}

		.sub .submenu-lista {
			position: absolute;
			background-color: #fff;
			padding: 10px 5px;
			display: none;
			left: 0;
			right: 0;
		}

			.sub .submenu-lista a {
				margin: 10px 0;
				display: block;
			}

		.sub:hover .submenu-lista {
			display: block;
			font-size: 12px
		}
}

@media only screen and (min-width : 1026px) and (max-width: 1299.999px) {
	.header {
		background: rgba(255,255,255,.95);
		box-shadow: 0 0 10px rgba(0,0,0,.5);
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9999;
	/*	height: 12%;*/
	}

	.hamburger-menu {
		cursor: pointer;
		position: relative;
	}

	.menu-bar-mobile {
		display: none;
	}
	/**/
	.top-menu {
		padding: 10px;
		border-bottom: solid 1px #dddddd;
	}

		.top-menu a {
			margin: 0 10px;
		}
	/**/
	.middle-menu {
		height: 100px;
		padding: 10px;
	}

		.middle-menu a.logo {
			display: inline-block;
			position: relative;
		}

			.middle-menu a.logo img {
				display: block;
				position: inherit;
				height: 100px;
				width: auto;
			}

		.middle-menu .box {
			display: inline-block;
			position: relative;
			height: 80px;
			text-align: right;
			line-height: 1;
			float: right;
			color: #003e7e;
		}
	/**/
	.bottom-menu {
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 999;
	}

		.bottom-menu a:hover {
			color: #ccc;
		}


	/*footer*/
	.bottom-footer {
		padding: 10px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		z-index: 999;
		box-shadow: 0px 1px 4px rgba(0, 0, 0,0.25);
	}

	.bottom-menu a {
		margin: 0 10px;
	}
	/**/
	.bottom-menu .sub {
		display: block;
		cursor: pointer;
	}

	.bottom-menu .submenu {
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 999;
		background-color: #eee;
		text-align: left;
		padding: 10px;
		border-top: solid 1px #808080;
		border-bottom: solid 1px #808080;
		display: none;
	}

		.bottom-menu .submenu a {
			display: block;
			margin: 15px 0;
			white-space: nowrap;
		}
	/**/
	.barCommercianti {
		position: fixed;
		top: 0;
		left: 50%;
		transform: translate(-50%,0);
		padding: 5px 20px;
		background-color: #ff0000;
		color: #fff;
		text-align: right;
		display: inline-block;
		z-index: 9999;
	}
	/**/
	.sub {
		position: relative;
	}

		.sub .opensub-lista {
		}

		.sub .submenu-lista {
			position: absolute;
			background-color: #fff;
			padding: 10px;
			display: none;
			left: 50%;
			border-top: solid 1px black;
			border-bottom: solid 1px black;
			width: auto;
			transform: translateX(-50%);
		}

			.sub .submenu-lista a {
				margin: 10px 0;
				display: block;
			}

		.sub:hover .submenu-lista {
			display: block;
			font-size: 12px
		}
}

@media only screen and (min-width : 1300px) and (max-width: 1900px) {
	.header {
		background: rgba(255,255,255,.95);
		box-shadow: 0 0 10px rgba(0,0,0,.5);
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9999;
		/*height: 16%;*/
	}

	.hamburger-menu {
		cursor: pointer;
		position: relative;
	}

	.menu-bar-mobile {
		display: none;
	}
	/**/
	.top-menu {
		padding: 10px;
		border-bottom: solid 1px #dddddd;
	}

		.top-menu a {
			margin: 0 10px;
		}
	/**/
	.middle-menu {
		height: 100px;
		padding: 10px;
	}

		.middle-menu a.logo {
			display: inline-block;
			position: relative;
		}

			.middle-menu a.logo img {
				display: block;
				position: inherit;
				height: 100px;
				width: auto;
			}

		.middle-menu .box {
			display: inline-block;
			position: relative;
			height: 80px;
			text-align: right;
			line-height: 1;
			float: right;
			color: #003e7e;
		}
	/**/
	.bottom-menu {
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 999;
	}

		.bottom-menu a:hover {
			color: #ccc;
		}


	/*footer*/
	.bottom-footer {
		padding: 10px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		z-index: 999;
		box-shadow: 0px 1px 4px rgba(0, 0, 0,0.25);
	}

	.bottom-menu a {
		margin: 0 10px;
	}
	/**/
	.bottom-menu .sub {
		display: block;
		cursor: pointer;
	}

	.bottom-menu .submenu {
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 999;
		background-color: #eee;
		text-align: left;
		padding: 10px;
		border-top: solid 1px #808080;
		border-bottom: solid 1px #808080;
		display: none;
	}

		.bottom-menu .submenu a {
			display: block;
			margin: 15px 0;
			white-space: nowrap;
		}
	/**/
	.barCommercianti {
		position: fixed;
		top: 0;
		left: 50%;
		transform: translate(-50%,0);
		padding: 5px 20px;
		background-color: #ff0000;
		color: #fff;
		text-align: right;
		display: inline-block;
		z-index: 9999;
	}
	/**/
	.sub {
		position: relative;
	}

		.sub .opensub-lista {
		}

		.sub .submenu-lista {
			position: absolute;
			background-color: #fff;
			padding: 10px;
			display: none;
			left: 50%;
			border-top: solid 1px black;
			border-bottom: solid 1px black;
			width: auto;
			transform: translateX(-50%);
		}

			.sub .submenu-lista a {
				margin: 10px 0;
				display: block;
				font-size: 12px
			}

		.sub:hover .submenu-lista {
			display: block;
		}
}


@media only screen and (min-width : 1901px) {
	.header {
		background: rgba(255,255,255,.95);
		box-shadow: 0 0 10px rgba(0,0,0,.5);
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9999;
	}

	.hamburger-menu {
		cursor: pointer;
		position: relative;
	}

	.menu-bar-mobile {
		display: none;
	}
	/**/
	.top-menu {
		padding: 10px;
		border-bottom: solid 1px #dddddd;
	}

		.top-menu a {
			margin: 0 10px;
		}
	/**/
	.middle-menu {
		height: 100px;
		padding: 10px;
	}

		.middle-menu a.logo {
			display: inline-block;
			position: relative;
		}

			.middle-menu a.logo img {
				display: block;
				position: inherit;
				height: 100px;
				width: auto;
			}

		.middle-menu .box {
			display: inline-block;
			position: relative;
			height: 80px;
			text-align: right;
			line-height: 1;
			float: right;
			color: #003e7e;
		}
	/**/
	.bottom-menu {
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 999;
	}

		.bottom-menu a:hover {
			color: #ccc;
		}


	/*footer*/
	.bottom-footer {
		padding: 10px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #fff;
		z-index: 999;
		box-shadow: 0px 1px 4px rgba(0, 0, 0,0.25);
	}

	.bottom-menu a {
		margin: 0 10px;
	}
	/**/
	.bottom-menu .sub {
		display: block;
		cursor: pointer;
	}

	.bottom-menu .submenu {
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 999;
		background-color: #eee;
		text-align: left;
		padding: 10px;
		border-top: solid 1px #808080;
		border-bottom: solid 1px #808080;
		display: none;
	}

		.bottom-menu .submenu a {
			display: block;
			margin: 15px 0;
			white-space: nowrap;
		}
	/**/
	.barCommercianti {
		position: fixed;
		top: 0;
		left: 50%;
		transform: translate(-50%,0);
		padding: 5px 20px;
		background-color: #ff0000;
		color: #fff;
		text-align: right;
		display: inline-block;
		z-index: 9999;
	}
	/**/
	.sub {
		position: relative;
	}

		.sub .opensub-lista {
		}

		.sub .submenu-lista {
			position: absolute;
			background-color: #fff;
			padding: 10px;
			display: none;
			left: 50%;
			border-top: solid 1px black;
			border-bottom: solid 1px black;
			width: auto;
			transform: translateX(-50%);
		}

			.sub .submenu-lista a {
				margin: 10px 0;
				display: block;
			}

		.sub:hover .submenu-lista {
			display: block;
			font-size: 12px
		}
}


.preferiti {
	background-size: 21px;
	background-repeat: no-repeat;
	background-position: 3px center;
}

.stampa {
	background-image: url('/img/icons/print.svg');
	padding-left: 27px;
	background-size: 21px;
	background-repeat: no-repeat;
	background-position: 3px center;
}

.condividi {
	background-image: url('/img/icons/condividi.svg');
	padding-left: 27px;
	background-size: 21px;
	background-repeat: no-repeat;
	background-position: 3px center;
}

.whatsapp {
	background-image: url('/img/icons/social/005-whatsapp.svg?v=1.0');
	padding-left: 20px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 0 center;
}

.phone {
	background-image: url('/img/icons/phone.svg?v=1.0');
	padding-left: 20px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 0 center;
}

.email {
	background-image: url('/img/icons/mail.svg?v=1.0');
	padding-left: 20px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 0 center;
}

.fb {
	background-image: url('/img/icons/social/004-facebook.svg?v=1.0');
	padding-left: 20px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 0 center;
}

.ig {
	background-image: url('/img/icons/social/003-instagram.svg?v=1.0');
	padding-left: 20px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 0 center;
}
