@charset "UTF-8";
/* CSS Document */

@import url('css/satoshi.css');
@font-face {
    font-family: 'Amazing-Slab-Black';
    src: url('fonts/Amazing-Slab-Black-trial.ttf') format('truetype');
         font-weight: 900;
         font-display: swap;
         font-style: normal;
  }

:root {
    --color_txt: #272727;
    --color_txta: #1AA1E3;
    --color_bg: #052555;
	--color_bg1: #1AA1E3;
	--color_bg2: #2D75B2;
    --color_bg3: #283D4F;
    --color_bg4: #194484;
    --color_btn: #1AA1E3;
	--color_btnh: #2D75B2;

    --space: 20px;
    --corner: 10px;
}

html, body {
	width: 100%;
    height:100%;
	margin: 0px;
	padding: 0px;
    display: flex;
    flex-direction: column;
	font-family: 'Satoshi-Variable';
	font-weight: 400;
    font-size: 100%;
    letter-spacing: 0.5px;
    color: var(--color_txt);
    background-color: var(--color_bg);
    /* scroll-behavior: smooth; */
}
*:focus { outline: none !important; } 
img { width: 100%; }
p { margin: 0 0 20px 0; }
a { text-decoration: none; color: var(--color_txta); }

.hidden { display: none; }
.flex { display: flex; }
.align-center { align-items: center; }
#main_container {
    display: flex;
    flex-direction: column;
    flex-grow: 2;
}
.content-container {
    flex-grow: 2;
    /* background-color: var(--color_bg1); */
}
.container {
    position: relative;
    /* width: 100%; */
    max-width: 1000px;
    margin: 0 auto;
    /* display: flex; */
    padding: 0 15px;
    box-sizing: content-box;
}
.btn {
    background-color: var(--color_bg1);
    color: white;
    font-size: 1em;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 4px;
    margin: 20px;
}

/* ########################## HEADER ########################## */

#header {
    /* width: 100%; */
    background-color: var(--color_bg1);
    padding: 10px;
    transition: all 0.2s ease-in-out;
    z-index: 100;
}
#header.fixedToTop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}
#header.fixedToTop + #main_container{
    margin-top: 102px;
}
.container.menu {
    display: flex;
    align-items: center;
}
.header_icons {
    display: flex;
}
.header_icon {
    display: flex;
    justify-content: center;
}
.header_icon img {
    width: 25px;
    height: 25px;
    margin: 0 0 0 15px;
}

/* ########################## MENU ########################## */

#header_hamburger_x {
    display: none;
}
#menu {
    flex-grow: 2;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.menu_btn {
    display: inline-block;
    font-size: 1em;
    color: white;
    padding: 10px;
    margin: 0 0 0 10px;
    font-weight: 500;
}
.menu_btn:hover,
.menu_btn.active {
    background-color: rgba(255, 255, 255, 0.16);
    border-radius: 4px;
    color: white;
}
.menu_btn.edit {
    background-color: lightcoral;
    border-radius: 4px;
    color: white;
    margin: 0 0 0 20px;
}
.menu_btn.edit:hover {
    background-color: #FF0000;
}
.menu_btn.dropdown {
    padding: 0px;
}
.menu_btn_title {
    position: relative;
    /* cursor: pointer; */
    background-image: url(images/menu_freccia.svg);
    background-repeat: no-repeat;
    background-position: right 8px center;
    padding: 8px 28px 8px 8px;
}
.menu2_content {
    display: none;
    position: absolute;
    /* margin: 8px 0 0 -8px; */
    min-width: 186px;
    background-color: var(--color_bg2);
    /* box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
    z-index: 1;
    border-radius: 0 0 4px 4px;
    text-align: left;
}
.menu_btn.dropdown:hover {
    border-radius: 4px 4px 0 0;
}
.menu_btn.dropdown:hover .menu2_content {
    display: block;
}
.menu2_btn {
    display: block;
    padding: 8px;
    color: white;
}
.menu2_btn:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
}
.menu2_btn.active,
.menu2_btn:hover {
    background-color: #26325E;
}





/* ########################## ITEMS ########################## */

.item_container {
    margin-bottom: 60px !important;
}
.item_container.testo {
    margin-bottom: 40px !important;
}
.item_content {
    display: flex;
}
.item_content.wrap {
    flex-wrap: wrap;
}

/* ########################## TESTO ########################## */

.item_content_center {
    width: 100%;
    flex-shrink: 2;
}
.item_content_center.left,
.item_content_center.left h2 {
    text-align: left;
}
.item_content_center.right,
.item_content_center.right h2 {
    text-align: right;
}
.item_content_center.left h2,
.item_content_center.right h2 {
    margin: 0 0 20px 0;
}
.item_content_sx {
    max-width: 500px;
    width: 30%;
    margin: 0 var(--space) 0 0;
}
.item_content_sx.solo,
.item_content_dx.solo {
    background-size: cover;
    background-position: center center;
    width: 30%;
}
.item_content_dx {
    max-width: 500px;
    width: 30%;
    margin: 0 0 0 var(--space);
}
.item_content_img.top {
    margin: 0 0 var(--space) 0;
}
.item_content_img.bottom {
    margin: var(--space) 0 0 0;
}



.item_all {
    color: white;
    padding: 6px 20px;
    background-color: var(--color_btn);
    border-radius: var(--corner);
    margin: 0 var(--space) var(--space) 0;
}
.item_all.right {
    margin: 0 0 var(--space) var(--space);
}
.item_all i { padding: 0 10px 0 0; }
.item_all:hover {
    background-color: var(--color_btnh);
}
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    /*padding-top: 25px;*/
    width: 100%;
    height: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.item_content.allegati.right {
    justify-content: end;
}

/* ########################## SLIDER ########################## */

.slider_container {
    background-size: cover !important;
    background-position: center center !important;
    position: relative;
}
.slider_content {
    position: absolute;
    bottom: 0px;
    padding: 0 0 40px 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;   
}
.slick-dots li button:before {
    color: var(--color_bg1) !important;
    font-size: 12px !important;
    line-height: 40px !important;
}
.slider_titolo {
    font-family: 'Amazing-Slab-Black';
    font-size: 2rem;
    letter-spacing: 0.02rem;
    font-weight: 900;
    color: white;
    margin-top: 50px;
    padding: 0 15px;
}

/* ########################## TESTO ########################## */

.item_container h2 {
    font-family: 'Amazing-Slab-Black';
    color: var(--color_bg1);
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
}
.item_content.testo,
.item_content.testo p {
    font-size: 1em;
    color: white !important;
}
#ot-sdk-cookie-policy-v2.ot-sdk-cookie-policy table {
    background-color: white;
}
.item_content.testo.home {
    text-align: center;
    font-size: 1.2em;
}

/* ########################## IMMAGINE ########################## */

.divFixedHeight {
    width: 100%;
    background-size: cover;
    background-position: center center;
}

/* ########################## BOXES ########################## */

.container.boxes {
    width: calc(100% - 30px);
} 
.box_container {
    background-color: var(--color_bg4);
    margin: 10px;
    border-radius: 4px;
}
.box_img {
    height: 184px;
    width: 100%;
    background-size: cover;
    background-position: center center;
    border-radius: 4px 4px 0 0;
}
.box_content {
    padding: 20px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
}
.box_titolo {
    font-family: 'Amazing-Slab-Black';
    color: white;
    font-weight: 700;
    font-size: 1.2em;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}
.box_testo {
    color: white;
    font-weight: 500;
    font-size: 0.8em;
    flex-grow: 2;
}
.box_btn {
    display: block;
    width: 100%;
    color: white;
    font-size: 0.8em;
    font-weight: 700;
    text-align: right;
    background-image: url(images/link_arrow_right.png);
    background-repeat: no-repeat;
    background-position: right;
    margin: 20px 0 6px 0;
    padding: 0 30px 0 0;
    box-sizing: border-box;
}

/* ########################## MODULO IMG DX ########################## */

.modulo_img_container {
    display: flex;
    width: 100%;
    background-color: var(--color_bg4);
    justify-content: flex-end;
}
.modulo.img {
    width: 50%;
    background-size: cover;
    background-position: center center;
}
.modulo.testo {
    width: 50%;
    padding: 40px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}
.modulo.testo.sx {
    align-items: flex-end;
    text-align: right;
}
.modulo.testo.sx .box_testo {
    font-size: 1em;
}
.btn.modulo_img {
    margin: 30px 0px 20px;
}

/* ########################## LIBRI ########################## */

.libro_container {
    display: flex;
    margin: 0 0 20px 0;
}
.libro_img {
    width: 40%;
}
.libro_content {
    display: flex;
    flex-direction: column;
    padding: 20px;
    color: white;
    justify-content: center;
    align-items: flex-start;
}
.libro_titolo {
    font-family: 'Amazing-Slab-Black';
    color: white;
    font-weight: 700;
    font-size: 1.4em;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}
.libro_testo {
    color: white;
    font-weight: 500;
    font-size: 1em;
}
.btn.libro_btn {
    margin: 30px 0 20px;
}

/* ########################## LOGIN ########################## */

.container.login {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.container.login h1,
.container.login h2 {
    color: white;
}
.container.login .LoginForm {
    width: 100%;
    max-width: 300px;
}
.container.login .Inputfield {
    margin: 0px !important;
    padding: 0px !important;
    border: 0px !important;
    background: transparent !important;
}
.container.login .Inputfield input {
    width: 100%;
    padding: 10px;
    border: 0px;
    font-size: 1em;
    margin: 0 0 20px 0;
    box-sizing: border-box;
}
.container.login .btn.submit {
    margin: 0px;
    border: 0px;
    cursor: pointer;
}
ul.LoginRegisterLinks {
    list-style-type: none;
    margin: 0px;
    margin-block-start: 0px;
    margin-inline-start: 0px;
    padding-inline-start: 0px;
}
ul.LoginRegisterLinks li {
    display: inline-flex;
}
.container.login .link {
    margin: 30px 0px;
    color: var(--color_bg2);
    font-size: 0.9em;
}
.container.login .link:hover {
    color: white;
    text-decoration: underline;
}
.container.login .description {
    font-size: 1em;
    color: white;
    margin: 0 0 15px 0;
}
.LoginRegisterNotice {
    width: 100%;
}
.LoginRegisterError {
    background-color: red;
    color: white !important;
}
.LoginRegisterMessage {
    background-color: green;
    color: white !important;
}

/* ########################### FOOTER ########################## */

.footer_container {
    background-color: var(--color_bg3);
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    padding: 15px;
    line-height: 18px;
}
.footer_sx {
    flex-grow: 2;
}
.footer_dx {
    text-align: right;
}
.footer_container a { color: var(--color_bg1); }
.footer_container a:hover { color: var(--color_bg2); }


/* ########################### SPECIFICHE X PLUGIN ########################## */

/*Mediaboxes*/
.media-boxes-no-more-entries { display: none; }
/*FrontEnd*/
.mfp-iframe-holder .mfp-content { max-width: 100% !important; }