@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

:root {
	--gg-dark-blue: rgb(0, 20, 90);
	--gg-cl-blue: rgb(198, 217, 218);
	--gg-energy-blue: rgb(29, 87, 251);
	--gg-grey: rgb(102, 102, 102);

	--gg-border-radius: 1rem;
}

/*THEME OVERRIDES*/
.btn[class]
{
	border-radius: var(--gg-border-radius);
	background-color: var(--gg-dark-blue);
	border-color: var(--gg-dark-blue);
}

.form-control {
	border-radius: var(--gg-border-radius);
}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

* {
	font-family: 'Lato', sans-serif;
}

html, body {
	height: 100vh;
	overflow-y: auto !important;
}

.user-page {
	/*background-color: #efefef;*/
	background-color: #fff;
}

.user-page header {
	background-color: #efefef;
}

#wrap {
	min-height: 100%;
	height: auto;

}

#main {
	overflow: auto;
	padding-bottom: calc(100vw / 10.666);
	/* this needs to be bigger than footer height*/
	padding-top: 50px;
}

img.head {
	width: 100vw;
	max-width: 100%;
}

#push {
	/*height: 180px;*/
	height: calc(100vw / 10.666);
}

#footer {
	position: relative;
	height: 50px;
	background-color: var(--gg-dark-blue);
	width: 100vw;
	max-width: 100%;
	margin-top: -50px;
	clear: both;
}

#footer.footerlogin:before {
	content: "";
	/*background: url(../img/imgfoot.png);*/
	background-size: contain;
	height: calc(100vw / 5.647);
	width: 100vw;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	position: absolute;
	bottom: 0;
	/* right: 0; */
	/* left: 0; */
	margin: 0 auto;
	display: block;
}

.mlogin {
	background: url('../img/mondo.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 50% 50%;
}

#prefooter {
	height: calc(100vw / 10.666);
	background: #fff;
	margin-top: calc(100vw / -10.666);
}

.leftbox,
.rightbox {
	color: #fff;
	position: relative;
	border-radius: var(--gg-border-radius);
}

.leftbox {
	background-color: var(--gg-dark-blue);
}

.rightbox {
	background-color: var(--gg-cl-blue);
}

/*.leftbox:before{
	content: '';
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 30px solid var(--gg-dark-blue);

}*/



/*.rightbox:before{
	content: '';
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 30px solid #0baec4;
}*/

.goback .fa {
	margin-right: 10px;
}

.goback {
	margin-top: 20px;
	flex: 1 1 100%;
}

.flex-break {
	flex-basis: 100%;
	height: 0;
}

.gap-default {
	gap: 10px;
}

a.mbox {
	color: #fff;
	width: 100%;
	font-weight: bold;
	font-size: 26px;
}

.Nazioni .m-menu {
	display: none;
}

.main-menu {
	flex: 1;
}

.m-menu {
	flex-direction: row;
	text-transform: uppercase;
	height: 100%;
}

.m-menu li {
	padding: 0 20px;
	display: flex;
	align-items: center;
}

.m-menu li a {
	margin: 0 !important;
}

.m-menu .dropdown:hover .dropdown-menu {
	display: block;
	opacity: 1;
	pointer-events: auto;
}

.m-menu .dropdown .dropdown-menu {
	display: none;
	pointer-events: none;
	position: absolute;
	transition: 300ms;
	opacity: 0;
	margin: 0;
}

.m-logout a.btn {
	background-color: transparent;
	color: var(--gg-dark-blue);
	border: none;
}

.m-logout a.btn:hover {
	background-color: var(--gg-dark-blue);
	color: #fff;
}

a {
	color: var(--gg-dark-blue);
}

h2.title {
	color: var(--gg-dark-blue);
}

.richiesto {
	color: red;
}

.nascondi {
	display: none;
}

.red {

	color: red;
}

#embed {
	border: none;
	margin: 30px 0;
}

input[value="@"] {
	font-size: 25px;
	text-align: center;
}

.boxes {
	flex: 0 0 50%;
}

@media (max-width: 500px) {
	.boxes {
		flex: 0 0 100%;
	}

	.flex-direction {
		flex-direction: column;
	}

	a.mbox {
		margin: 30px auto !important;
	}

	.mlogout {
		display: none;
	}
}

body.world .m-menu li[data-id="16"],
body.world .boxes:nth-child(3) {

	display: none !important;
	pointer-events: none !important;

}

.align-buttons {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}

.align-buttons a {
	margin-left: 1rem;
}

/* nicpaola 07-2020 */
img.socialImage {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 37px;
}

/* Add switch css from bootstrap-4 custom-forms.scss */
.custom-switch {
    padding-left: 2.25rem;
}
.custom-control {
    position: relative;
    z-index: 1;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
    margin-left: 1.5rem;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}
.custom-control-input {
    position: absolute;
    left: 0;
    z-index: -1;
    width: 1rem;
    height: 1.25rem;
    opacity: 0;
}
.custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
}

.custom-switch .custom-control-label::before {
    left: -2.25rem;
    width: 1.75rem;
    pointer-events: all;
    border-radius: 0.5rem;
}

.custom-control-label::before, .custom-file-label, .custom-select {
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.custom-control-label::before {
    position: absolute;
    top: 0.25rem;
    left: -1.5rem;
    display: block;
    width: 1rem;
    height: 1rem;
    pointer-events: none;
    content: "";
    background-color: #fff;
    border: #adb5bd solid 1px;
}

.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-2.25rem + 2px);
    width: calc(1rem - 4px);
    height: calc(1rem - 4px);
    background-color: #adb5bd;
    border-radius: 0.5rem;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out;
    transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out;
}

.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-2.25rem + 2px);
    width: calc(1rem - 4px);
    height: calc(1rem - 4px);
    background-color: #adb5bd;
    border-radius: 0.5rem;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out;
    transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-transform .15s ease-in-out;
}
.custom-control-label::after {
    position: absolute;
    top: 0.25rem;
    left: -1.5rem;
    display: block;
    width: 1rem;
    height: 1rem;
    content: "";
    background: 50%/50% 50% no-repeat;
}
.custom-switch .custom-control-input:checked~.custom-control-label::after {
    background-color: #fff;
    -webkit-transform: translateX(0.75rem);
    transform: translateX(0.75rem);
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #007bff;
    background-color: #007bff;
}

/* Fix: Bootstrap 3 JS + Bootstrap 4 CSS mismatch
   BS3 JS aggiunge .in invece di .show, quindi il modal resta opacity:0 */
.modal.in {
    opacity: 1;
    display: block;
}
.modal-backdrop.in {
    opacity: 0.5;
}