/* ### DEFAULT per tutti i menu ### */

nav {}

nav div {}

nav img {}

nav ul {}

nav li {}

nav a {}

nav a:hover {}

nav li.selected {}

nav a.selected {}

nav a.selected:hover {}

nav li.active {}

nav a.active {}

nav a.active:hover {}

nav a span {}


nav a:hover span {}

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

#MenuMain {}

#MenuMain div {}

#MenuMain img {}

#MenuMain ul {}

#MenuMain li {}

#MenuMain a {}

#MenuMain a:hover {}

#MenuMain li.selected {}

#MenuMain a.selected {}

#MenuMain a.selected:hover {}

#MenuMain li.active {}

#MenuMain a.active {}

#MenuMain a.active:hover {}

#MenuMain .sep {}

#MenuMain .lev1 {}

#MenuMain .lev1 li {}

#MenuMain .lev1 a {}

#MenuMain .lev1 a:hover {}

#MenuMain .lev1 li.selected {}

#MenuMain .lev1 a.selected {}

#MenuMain .lev1 a.selected:hover {}

#MenuMain .lev1 li.active {}

#MenuMain .lev1 a.active {}

#MenuMain .lev1 a.active:hover {}

#MenuMain .lev2 {}

#MenuMain .lev2 .active {}

#MenuMain .lev2 li {}

#MenuMain .lev2 a {}

#MenuMain .lev2 a:hover {}

#MenuMain .lev2 li.selected {}

#MenuMain .lev2 a.selected {}

#MenuMain .lev2 a.selected:hover {}

#MenuMain .lev2 li.active {}

#MenuMain .lev2 a.active {}

#MenuMain .lev2 a.active:hover {}


/* ### MENU (DI RIEPILOGO) FONDO PAGINA ### */

#MenuFoot {}

#MenuFoot div {}

#MenuFoot img {}

#MenuFoot ul {}

#MenuFoot li {}

#MenuFoot a {}

#MenuFoot a:hover {}

#MenuFoot li.selected {}

#MenuFoot a.selected {}

#MenuFoot a.selected:hover {}

#MenuFoot li.active {}

#MenuFoot a.active {}

#MenuFoot a.active:hover {}

#MenuFoot .sep {}

#MenuFoot .lev1 {}

#MenuFoot .lev1 li {}

#MenuFoot .lev1 a {}

#MenuFoot .lev1 a:hover {}

#MenuFoot .lev1 li.selected {}

#MenuFoot .lev1 a.selected {}

#MenuFoot .lev1 a.selected:hover {}

#MenuFoot .lev1 li.active {}

#MenuFoot .lev1 a.active {}

#MenuFoot .lev1 a.active:hover {}

#MenuFoot .lev2 {}

#MenuFoot .lev2 li {}

#MenuFoot .lev2 a {}

#MenuFoot .lev2 a:hover {}

#MenuFoot .lev2 li.selected {}

#MenuFoot .lev2 a.selected {}

#MenuFoot .lev2 a.selected:hover {}

#MenuFoot .lev2 li.active {}

#MenuFoot .lev2 a.active {}

#MenuFoot .lev2 a.active:hover {}


/* ### MENU AGGIUNTIVO 1 ### */

#MenuSide1 {}

#MenuSide1 div {}

#MenuSide1 img {}

#MenuSide1 ul {}

#MenuSide1 li {}

#MenuSide1 a {}

#MenuSide1 a:hover {}

#MenuSide1 li.selected {}

#MenuSide1 a.selected {}

#MenuSide1 a.selected:hover {}

#MenuSide1 li.active {}

#MenuSide1 a.active {}

#MenuSide1 a.active:hover {}

#MenuSide1 .sep {}

#MenuSide1 .lev1 {}

#MenuSide1 .lev1 li {}

#MenuSide1 .lev1 a {}

#MenuSide1 .lev1 a:hover {}

#MenuSide1 .lev1 li.selected {}

#MenuSide1 .lev1 a.selected {}

#MenuSide1 .lev1 a.selected:hover {}

#MenuSide1 .lev1 li.active {}

#MenuSide1 .lev1 a.active {}

#MenuSide1 .lev1 a.active:hover {}

#MenuSide1 .lev2 {}

#MenuSide1 .lev2 li {}

#MenuSide1 .lev2 a {}

#MenuSide1 .lev2 a:hover {}

#MenuSide1 .lev2 li.selected {}

#MenuSide1 .lev2 a.selected {}

#MenuSide1 .lev2 a.selected:hover {}

#MenuSide1 .lev2 li.active {}

#MenuSide1 .lev2 a.active {}

#MenuSide1 .lev2 a.active:hover {}


/* ### MENU AGGIUNTIVO 2 ### */

#MenuSide2 {}

#MenuSide2 div {}

#MenuSide2 img {}

#MenuSide2 ul {}

#MenuSide2 li {}

#MenuSide2 a {}

#MenuSide2 a:hover {}

#MenuSide2 li.selected {}

#MenuSide2 a.selected {}

#MenuSide2 a.selected:hover {}

#MenuSide2 li.active {}

#MenuSide2 a.active {}

#MenuSide2 a.active:hover {}

#MenuSide2 .sep {}

#MenuSide2 .lev1 {}

#MenuSide2 .lev1 li {}

#MenuSide2 .lev1 a {}

#MenuSide2 .lev1 a:hover {}

#MenuSide2 .lev1 li.selected {}

#MenuSide2 .lev1 a.selected {}

#MenuSide2 .lev1 a.selected:hover {}

#MenuSide2 .lev1 li.active {}

#MenuSide2 .lev1 a.active {}

#MenuSide2 .lev1 a.active:hover {}

#MenuSide2 .lev2 {}

#MenuSide2 .lev2 li {}

#MenuSide2 .lev2 a {}

#MenuSide2 .lev2 a:hover {}

#MenuSide2 .lev2 li.selected {}

#MenuSide2 .lev2 a.selected {}

#MenuSide2 .lev2 a.selected:hover {}

#MenuSide2 .lev2 li.active {}

#MenuSide2 .lev2 a.active {}

#MenuSide2 .lev2 a.active:hover {}


/* ### MENU AGGIUNTIVO 3 ### */

#MenuSide3 {}

#MenuSide3 div {}

#MenuSide3 img {}

#MenuSide3 ul {}

#MenuSide3 li {}

#MenuSide3 a {}

#MenuSide3 a:hover {}

#MenuSide3 li.selected {}

#MenuSide3 a.selected {}

#MenuSide3 a.selected:hover {}

#MenuSide3 li.active {}

#MenuSide3 a.active {}

#MenuSide3 a.active:hover {}

#MenuSide3 .sep {}

#MenuSide3 .lev1 {}

#MenuSide3 .lev1 li {}

#MenuSide3 .lev1 a {}

#MenuSide3 .lev1 a:hover {}

#MenuSide3 .lev1 li.selected {}

#MenuSide3 .lev1 a.selected {}

#MenuSide3 .lev1 a.selected:hover {}

#MenuSide3 .lev1 li.active {}

#MenuSide3 .lev1 a.active {}

#MenuSide3 .lev1 a.active:hover {}

#MenuSide3 .lev2 {}

#MenuSide3 .lev2 li {}

#MenuSide3 .lev2 a {}

#MenuSide3 .lev2 a:hover {}

#MenuSide3 .lev2 li.selected {}

#MenuSide3 .lev2 a.selected {}

#MenuSide3 .lev2 a.selected:hover {}

#MenuSide3 .lev2 li.active {}

#MenuSide3 .lev2 a.active {}

#MenuSide3 .lev2 a.active:hover {}


/* ### MENU AGGIUNTIVO 4 ### */

#MenuSide4 {}

#MenuSide4 div {}

#MenuSide4 img {}

#MenuSide4 ul {}

#MenuSide4 li {}

#MenuSide4 a {}

#MenuSide4 a:hover {}

#MenuSide4 li.selected {}

#MenuSide4 a.selected {}

#MenuSide4 a.selected:hover {}

#MenuSide4 li.active {}

#MenuSide4 a.active {}

#MenuSide4 a.active:hover {}

#MenuSide4 .sep {}

#MenuSide4 .lev1 {}

#MenuSide4 .lev1 li {}

#MenuSide4 .lev1 a {}

#MenuSide4 .lev1 a:hover {}

#MenuSide4 .lev1 li.selected {}

#MenuSide4 .lev1 a.selected {}

#MenuSide4 .lev1 a.selected:hover {}

#MenuSide4 .lev1 li.active {}

#MenuSide4 .lev1 a.active {}

#MenuSide4 .lev1 a.active:hover {}

#MenuSide4 .lev2 {}

#MenuSide4 .lev2 li {}

#MenuSide4 .lev2 a {}

#MenuSide4 .lev2 a:hover {}

#MenuSide4 .lev2 li.selected {}

#MenuSide4 .lev2 a.selected {}

#MenuSide4 .lev2 a.selected:hover {}

#MenuSide4 .lev2 li.active {}

#MenuSide4 .lev2 a.active {}

#MenuSide4 .lev2 a.active:hover {}


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

.MenuGeneric {}

.MenuGeneric div {}

.MenuGeneric img {}

.MenuGeneric ul {}

.MenuGeneric li {}

.MenuGeneric a {}

.MenuGeneric a:hover {}

.MenuGeneric li.selected {}

.MenuGeneric a.selected {}

.MenuGeneric a.selected:hover {}

.MenuGeneric li.active {}

.MenuGeneric a.active {}

.MenuGeneric a.active:hover {}

.MenuGeneric .sep {}

.MenuGeneric .lev1 {}

.MenuGeneric .lev1 li {}

.MenuGeneric .lev1 a {}

.MenuGeneric .lev1 a:hover {}

.MenuGeneric .lev1 li.selected {}

.MenuGeneric .lev1 a.selected {}

.MenuGeneric .lev1 a.selected:hover {}

.MenuGeneric .lev1 li.active {}

.MenuGeneric .lev1 a.active {}

.MenuGeneric .lev1 a.active:hover {}

.MenuGeneric .lev2 {}

.MenuGeneric .lev2 .active {}

.MenuGeneric .lev2 li {}

.MenuGeneric .lev2 a {}

.MenuGeneric .lev2 a:hover {}

.MenuGeneric .lev2 li.selected {}

.MenuGeneric .lev2 a.selected {}

.MenuGeneric .lev2 a.selected:hover {}

.MenuGeneric .lev2 li.active {}

.MenuGeneric .lev2 a.active {}

.MenuGeneric .lev2 a.active:hover {}


/* Circle Hover Effects per menu */

.menu-ch-grid {
    padding: 0;
    list-style: none;
    display: block;
    text-align: center;
    width: 100%;
    margin: 0 auto;
    padding-top: 12%;
}

.menu-ch-grid:after,
.menu-ch-item:before {
    content: '';
    display: table;
}

.menu-ch-grid:after {
    clear: both;
}

.menu-ch-grid li {
    width: 220px;
    height: 220px;
    margin-top: 18px;
    margin-right: 30px;
    margin-bottom: 18px;
    margin-left: 30px;

    display: inline-block;
}

.menu-ch-item {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    border-radius: 50%;
    background-size: 100% 100%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

/* width + 2*top = .menu-ch-grid li width */
/* height + 2*left = .menu-ch-grid li height */
/* box-shadow: 0 0 0 10px = top = left */
.menu-ch-info-wrap {
    width: 180px;
    height: 180px;
    top: 20px;
    left: 20px;
    box-shadow:
        0 0 0 20px rgba(255, 255, 255, 0.2),
        inset 0 0 3px rgba(115, 114, 23, 0.8);
    background: #f9f9f9;

    position: absolute;
    border-radius: 50%;
    -webkit-perspective: 800px;
    -moz-perspective: 800px;
    -o-perspective: 800px;
    -ms-perspective: 800px;
    perspective: 800px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

/* width = .menu-ch-info-wrap width */
/* height = .menu-ch-info-wrap height */
.menu-ch-info {
    width: 180px;
    height: 180px;

    position: absolute;
    border-radius: 50%;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.menu-ch-info > div {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-size: 100% 100%;
    background-position: center center;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #FFFFFF;
}

.menu-ch-info > div > img {
    display: none;
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-size: 100% 100%;
    background-position: center center;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #FFFFFF;
}

.menu-ch-info .menu-ch-info-back {
    -webkit-transform: rotate3d(0, 1, 0, 180deg);
    -moz-transform: rotate3d(0, 1, 0, 180deg);
    -o-transform: rotate3d(0, 1, 0, 180deg);
    -ms-transform: rotate3d(0, 1, 0, 180deg);
    transform: rotate3d(0, 1, 0, 180deg);
    background: #000;
    display: block;
}

.menu-ch-img-1 {
    background-image: url('../immagini_/concorso.jpg');
}

.menu-ch-img-2 {
    background-image: url('../immagini_/iscrizioni.jpg');
}

.menu-ch-img-3 {
    background-image: url('../immagini_/stampa.jpg');
}

.menu-ch-info h3 {
    color: white;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 20px;
    margin: 0 15px;
    padding: 70px 0 0 0;
    height: 90px;
    font-family: 'Open Sans', Arial, sans-serif;
    text-shadow:
        0 0 1px #fff,
        0 1px 2px rgba(0, 0, 0, 0.3);
}

.menu-ch-info p {
    color: #fff;
    padding: 10px 5px;
    font-style: italic;
    margin: 0 30px;
    font-size: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.5);
}

.menu-ch-info p a {
    display: block;
    color: #fff;
    color: rgba(255, 255, 255, 0.7);
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 9px;
    letter-spacing: 1px;
    padding-top: 4px;
    font-family: 'Open Sans', Arial, sans-serif;
}

.menu-ch-info p a:hover {
    color: #fff222;
    color: rgba(255, 242, 34, 0.8);
}

.menu-ch-item:hover .menu-ch-info-wrap {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8),
        inset 0 0 3px rgba(115, 114, 23, 0.8);
    display: block;
}

.menu-ch-item:hover .menu-ch-info {
    -webkit-transform: rotate3d(0, 1, 0, -180deg);
    -moz-transform: rotate3d(0, 1, 0, -180deg);
    -o-transform: rotate3d(0, 1, 0, -180deg);
    -ms-transform: rotate3d(0, 1, 0, -180deg);
    transform: rotate3d(0, 1, 0, -180deg);
}