/* ------------------------------------------------ TIMELINE HISTORY VERTICAL */
.box-storia {
    display: block;
    width: 100%;
    height: 1800px;
    position: relative;
}
.box-storia-linea {
    display: block;
    width: 50%;
    height: 100%;
    position: relative;
    border-right: 1px solid #999999;
}
.box-storia-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 25px;
    right: 0;
    margin-right: -70px;
    color: #000000;
    font-weight: 600;
    font-size: 40px;
    background-color: #ffffff;
}
.box-storia-circleino {
    display: block;
    position: absolute;
    width: 24px;
    height: 24px;
    border-radius: 5px;
    top: 145px;
    left: 58px;
    z-index: 5;
    margin-right: -12px;
    background: linear-gradient(90deg, rgba(215,225,0,1) 0%, rgba(135,209,0,1) 100%);
}
.box-storia-circleino-linea {
    display: block;
    position: absolute;
    width: 140px;
    height: 1px;
    top: 11px;
    left: 24px;
    z-index: -5;
    border-bottom: 1px solid #999999;
}
.box-storia-circleino-square {
    display: block;
    position: absolute;
    background-color: #FFFFFF;
    width: 400px;
    top: -40px;
    left: 80px;
    border-radius: 30px;
    -moz-box-shadow:    3px 3px 5px #ccc;
    -webkit-box-shadow: 3px 3px 5px #ccc;
    box-shadow:         3px 3px 5px #ccc;
}
.box-storia-circleino-square-img {
    display: block;
    width: 400px;
    height: 250px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    -moz-border-radius-topleft: 30px;
    -moz-border-radius-topright: 30px;
    background-size: cover;
    background-position: center center;
}
.box-storia-circleino-square-tit {
    font-weight: 600;
    color: #000000;
}
.box-storia-circleino-square-txt {
    display: block;
    position: relative;
    color: #000000;
    font-weight: 300;
    font-size: 14px;
    padding: 15px;
}
.box-storia-circleino-linea.sx { left: -140px; top: 11px; }
.box-storia-circleino-linea .dx {}
.box-storia-circleino-square.sx { left: -350px; }
.box-storia-circleino-square .dx {}
/* posizioni e colori pallini */
.box-storia-circle:nth-child(1) { top: 0px; background-color: #ffffff; }
.box-storia-circle:nth-child(2) { top: 370px; background-color: #ffffff; }
.box-storia-circle:nth-child(3) { top: 740px; background-color: #ffffff; }
.box-storia-circle:nth-child(4) { top: 1110px; background-color: #ffffff; }
.box-storia-circle:nth-child(5) { top: 1480px; background-color: #ffffff; }
.box-storia-circle:nth-child(6) { top: 1850px; background-color: #ffffff; }
.box-storia-circle:nth-child(7) { top: 2220px; background-color: #ffffff; }
.box-storia-circle:nth-child(8) { top: 2590px; background-color: #ffffff; }
.box-storia-circle:nth-child(9) { top: 2960px; background-color: #ffffff; }
.box-storia-circle:nth-child(10) { top: 3330px; background-color: #ffffff; }
.box-storia-circle:nth-child(11) { top: 3700px; background-color: #ffffff; }
.box-storia-circle:nth-child(12) { top: 4070px; background-color: #ffffff; }
.box-storia-circle:nth-child(13) { top: 4440px; background-color: #ffffff; }
.box-storia-circle:nth-child(14) { top: 4810px; background-color: #ffffff; }

.box-storia-circle:nth-child(1) .box-storia-circleino:nth-child(1) { background: linear-gradient(90deg, rgba(215,225,0,1) 0%, rgba(135,209,0,1) 100%); }
.box-storia-circle:nth-child(2) .box-storia-circleino:nth-child(1) { background: linear-gradient(90deg, rgba(215,225,0,1) 0%, rgba(135,209,0,1) 100%); }
.box-storia-circle:nth-child(3) .box-storia-circleino:nth-child(1) { background: linear-gradient(90deg, rgba(149,190,13,1) 0%, rgba(0,149,58,1) 100%); }
.box-storia-circle:nth-child(4) .box-storia-circleino:nth-child(1) { background: linear-gradient(90deg, rgba(149,190,13,1) 0%, rgba(0,149,58,1) 100%); }
.box-storia-circle:nth-child(5) .box-storia-circleino:nth-child(1) { background: linear-gradient(90deg, rgba(129,206,10,1) 0%, rgba(143,195,224,1) 100%); }
.box-storia-circle:nth-child(6) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(7) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(8) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(9) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(10) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(11) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(12) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(13) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }
.box-storia-circle:nth-child(14) .box-storia-circleino:nth-child(1) { background-color: #ffffff; }

.box-storia-circle:nth-child(1) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(2) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(3) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(4) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(5) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(6) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(7) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(8) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(9) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(10) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(11) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(12) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(13) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
.box-storia-circle:nth-child(14) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #999999; }
/* originale PROCOS
.box-storia-circle:nth-child(1) { top: 0px; background-color: #7AB8D7; }
.box-storia-circle:nth-child(2) { top: 370px; background-color: #5897B3; }
.box-storia-circle:nth-child(3) { top: 740px; background-color: #5293A9; }
.box-storia-circle:nth-child(4) { top: 1110px; background-color: #39777F; }
.box-storia-circle:nth-child(5) { top: 1480px; background-color: #5293A9; }
.box-storia-circle:nth-child(6) { top: 1850px; background-color: #5897B3; }
.box-storia-circle:nth-child(7) { top: 2220px; background-color: #7AB8D7; }
.box-storia-circle:nth-child(8) { top: 2590px; background-color: #5897B3; }
.box-storia-circle:nth-child(9) { top: 2960px; background-color: #5293A9; }
.box-storia-circle:nth-child(10) { top: 3330px; background-color: #39777F; }
.box-storia-circle:nth-child(11) { top: 3700px; background-color: #5293A9; }
.box-storia-circle:nth-child(12) { top: 4070px; background-color: #5293A9; }
.box-storia-circle:nth-child(13) { top: 4440px; background-color: #5897B3; }
.box-storia-circle:nth-child(14) { top: 4810px; background-color: #7AB8D7; }

.box-storia-circle:nth-child(1) .box-storia-circleino:nth-child(1) { background-color: #7ab8d7; }
.box-storia-circle:nth-child(2) .box-storia-circleino:nth-child(1) { background-color: #5897b3; }
.box-storia-circle:nth-child(3) .box-storia-circleino:nth-child(1) { background-color: #5293a9; }
.box-storia-circle:nth-child(4) .box-storia-circleino:nth-child(1) { background-color: #39777F; }
.box-storia-circle:nth-child(5) .box-storia-circleino:nth-child(1) { background-color: #5293A9; }
.box-storia-circle:nth-child(6) .box-storia-circleino:nth-child(1) { background-color: #5897B3; }
.box-storia-circle:nth-child(7) .box-storia-circleino:nth-child(1) { background-color: #7AB8D7; }
.box-storia-circle:nth-child(8) .box-storia-circleino:nth-child(1) { background-color: #5897B3; }
.box-storia-circle:nth-child(9) .box-storia-circleino:nth-child(1) { background-color: #5293A9; }
.box-storia-circle:nth-child(10) .box-storia-circleino:nth-child(1) { background-color: #39777F; }
.box-storia-circle:nth-child(11) .box-storia-circleino:nth-child(1) { background-color: #5293A9; }
.box-storia-circle:nth-child(12) .box-storia-circleino:nth-child(1) { background-color: #5897B3; }
.box-storia-circle:nth-child(13) .box-storia-circleino:nth-child(1) { background-color: #7AB8D7; }
.box-storia-circle:nth-child(14) .box-storia-circleino:nth-child(1) { background-color: #5897B3; }

.box-storia-circle:nth-child(1) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #7ab8d7; }
.box-storia-circle:nth-child(2) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5897b3; }
.box-storia-circle:nth-child(3) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5293a9; }
.box-storia-circle:nth-child(4) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #39777F; }
.box-storia-circle:nth-child(5) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5293A9; }
.box-storia-circle:nth-child(6) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5897B3; }
.box-storia-circle:nth-child(7) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #7AB8D7; }
.box-storia-circle:nth-child(8) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #39777f; }
.box-storia-circle:nth-child(9) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5293A9; }
.box-storia-circle:nth-child(10) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #39777F; }
.box-storia-circle:nth-child(11) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5293A9; }
.box-storia-circle:nth-child(12) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #39777F; }
.box-storia-circle:nth-child(13) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5293A9; }
.box-storia-circle:nth-child(14) .box-storia-circleino:nth-child(1) .box-storia-circleino-linea:nth-child(1) { border-bottom: 1px solid  #5897B3; }
*/
/* -- quando le dimensioni sono SUPERIORI a 600px -- */
@media (min-width: 600px) {
}

/* ************************************************************************** */
/* MEDIA QUERY
/* ************************************************************************** */
/* SCHERMO più piccolo della larghezza del sito, data da fixwidth [1400px] */
@media screen and (max-width: 1400px) {
}
/* ************************************************************************** */
/* SCHERMO più piccolo della larghezza del sito, data da fixwidth [1200px] */
@media screen and (max-width: 1200px) {
}
/* ************************************************************************** */
/* SCHERMO più piccolo della larghezza del sito, data da fixwidth [960px] */
@media screen and (max-width: 960px) {
}
/* ************************************************************************** */
/* IPAD mini verticale 768 x 1024 */
@media screen and (max-width: 768px) {
}
/* ************************************************************************** */
/* IPHONE 8 plus 414 x 736 */
@media screen and (max-width: 460px) {
    /* STORIA */
    .box-storia {height: 4500px;}
    .box-storia-linea {width: 20%;}
    .box-storia-circle {
        width: 140px;
        height: 140px;
        border-radius: 70px;
    }
    .box-storia-circleino-linea.sx { display: block;
        position: absolute;
        width: 140px;
        height: 1px;
        top: 11px;
        left: 12px;
        z-index: -5;
        border-bottom: 1px solid #999999; }
    .box-storia-circleino-square.dx {width: 200px; top: -80px;}
    .box-storia-circleino-square.sx { display: block;
        position: absolute;
        background-color: #FFFFFF;
        width: 200px;
        top: -80px;
        left: 80px;
        -moz-box-shadow:    3px 3px 5px #ccc;
        -webkit-box-shadow: 3px 3px 5px #ccc;
        box-shadow:         3px 3px 5px #ccc;
    }
    .box-storia-circleino-square-img {
        display: block;
        width: 200px;
        height: 200px;
        background-size: cover;
        background-position: center center;
    }
    .box-storia-circleino-square-tit {
        font-size: 16px;
        font-weight: 600;
        color: #000000;
    }
    .box-storia-circleino-square-txt {
        display: block;
        position: relative;
        color: #000000;
        font-weight: 300;
        font-size: 14px;
        padding: 15px;
    }
}
/* ************************************************************************** */
/* IPHONE 8 plus 375 x 667 */
@media screen and (max-width: 375px) {
}
/* ************************************************************************** */
/* IPHONE SE 320 x 568 */
@media screen and (max-width: 320px) {
}