﻿.cd-timeline{
    display:none!important;
}
.wp {
    opacity: 0;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: none;
}
    .wp.activeWp { opacity: 1; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
#timelineheader { position: relative; }
    #timelineheader:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: url(/images/masterafter.png) no-repeat 0 bottom; }
.half { width: 50%; }
.full { width: 100%; }
.timelinecontent { position: absolute; top: 0; right: 0; }
#timelineheader .timelinecontent { top: 10%; width: 100%; z-index: 9; }
.timeline { }
    .timeline.wrapRight { width: 40%; margin-right: 6%; float: right; text-align: center; position: relative; height: 100%; }
        .timeline.wrapRight:after { content: ""; position: absolute; height: 103%; width: 5px; top: 170px; background: #fff; border-radius: 10px; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
    .timeline .item { }
.timeline-item.ust { position: relative; }
    .timeline-item.ust:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; bottom: -60px; left: calc(50% - 10px); }
    .timeline-item.ust:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; bottom: -56px; left: calc(50% - 6px); }
.year { font-size: 48px; color: #fff; }
    .year span { font-size: 26px; }
.timeline-item .text { color: #fff; font-size: 20px; }
.timeline-item.left { float: left; }
.timeline-item.right { float: right; }
.timeline-item.left,
.timeline-item.right { width: 30%; position: relative; }
    .timeline-item.left:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; bottom: 128px; right: -55px; }
    .timeline-item.left:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; bottom: 132px; right: -51px; }
    .timeline-item.left .imgwhite:after { position: absolute; content: ""; width: 77px; height: 5px; border-radius: 6px; top: 50%; right: -41.5%; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
.imgwhite { background: url(/images/whitebg.png) no-repeat; padding: 40px 0 0; width: 251px; height: 302px; position: relative; }
    .imgwhite .img-responsive { margin-left: -14px; }
.imgwhite-yatay { background: url(/images/imgwhite-yatay.png) no-repeat; padding: 40px 0 0; width: 311px; height: 264px; position: relative; margin: auto; }
    .imgwhite-yatay .img-responsive { margin-left: 45px; }
    .imgwhite-yataybos {  padding: 40px 0 0; width: 311px; height: 264px; position: relative; margin: auto; }
    .imgwhite-yataybos .img-responsive { margin-left: 45px; }
.timeline-item.left .imgwhite { top: 9px; left: 15px; }
.timeline-item.right .imgwhite { top: 9px; right: 45px; }
.timeline-item.right.second { top: 100px; }
    .timeline-item.right.second .year { margin-top: -50px; width: 260px; text-align: center; margin-left: -55px; }
        .timeline-item.right.second .year span { display: block; font-size: 14px; }
.timeline-item.right:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; top: 141px; left: -51px; }
.timeline-item.right:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; top: 145px; left: -47px; }
.timeline-item.right .imgwhite:after { position: absolute; content: ""; width: 77px; height: 5px; border-radius: 6px; top: 47%; left: -36.5%; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
.timeline-item.left.third { float: none; background: #f7971c; padding: 30px; display: inline-block; position: absolute; left: 0; top: 100%; width: 310px; border-radius: 8px; }
    .timeline-item.left.third:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; bottom: 127px; right: -13px; }
    .timeline-item.left.third:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; bottom: 131px; right: -9px; }
.timeline-item.left .noimg { position: relative; }
    .timeline-item.left .noimg:after { position: absolute; content: ""; width: 30px; height: 5px; border-radius: 6px; top: 50%; margin-top: 75px; right: -36.5%; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
.timeline-item.left.third .year { }
    .timeline-item.left.third .year span { display: block; font-size: 20px; }
.timelineone { margin: 144px 0 0; }
    .timelineone .wrapper { margin: 0 0 0 15%; padding: 100px 0 0; position: relative; }
        .timelineone .wrapper .yeartext { font-size: 204px; color: #e2e2e2; position: absolute; top: -40px; z-index: -1; font-weight: 700; }
    .timelineone img.img-responsive.di { width: 100%; }
    .timelineone p { color: #484646; font-size: 20px; line-height: 45px; text-align: justify; padding-right: 25px; }
        .timelineone p.title { color: #000; font-weight: 600; text-align: right; }
.timelinemain { margin: 77px 0 0; position: relative; }
    .timelinemain .yil { font-size: 48px; color: #000; margin-top: 100px; }
        .timelinemain .yil span { display: block; font-size: 20px; color: #474747; margin: 15px 0 0; }
.timecenter { background: url(/images/timebg.png) no-repeat; background-size:cover; height: 600px; margin: 100px 0 50px; position: relative; }
    .timecenter.withPicSa { background: url(/images/timebg-sa.jpg) no-repeat center; height: 600px; margin: 100px 0 50px; position: relative; }
    .timecenter.withPicUf { background: url(/images/timebg-ufficiale.jpg) no-repeat center; height: 600px; margin: 100px 0 50px; position: relative; }

    .timecenter:after { content: ""; position: absolute; left: calc(50% - 2.5px); right: calc(50% - 2.5px); height: calc(100% + 80px); width: 5px; top: -40px; background: #fff; border-radius: 10px; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
    .timecenter .year span { display: block; font-size: 20px; }
.timelinemain-item .imgwhite-yatay:after { position: absolute; content: ""; width: 63%; height: 5px; border-radius: 6px; top: 47%; right: -63.5%; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
.timelinemain-item.left.first { margin-top: -90px; }
    .timelinemain-item.left.first .year { position: absolute; text-align: center; width: 80%; left: 20%; top: 78%; }
    .timelinemain-item.left.first .imgwhite-yatay { margin: 0 0 0 45%; }
    .timelinemain-item.left.first:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; top: 26px; right: 23%; }
    .timelinemain-item.left.first:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; top: 30px; right: 23.4%; }
.timelinemain-item.right.second .imgwhite-yatay:after { left: -29%; width: 24%; }

.timelinemain-item.right.second .imgwhite-yatay { background: url(/images/imgwhite-yatay.png) no-repeat; padding: 40px; width: 640px; height: 480px; position: relative; margin: 24px 0 0 20%; }
    .timelinemain-item.right.second .imgwhite-yatay .img-responsive { margin: 0; }

    .timelinemain-item.right.second .imgwhite-yatay::after { }

.timelinemain-item.right.bonus.second .year { position: absolute; text-align: left; width: 20%; top: 48%; }
.timelinemain-item.right.second .year { position: absolute; text-align: center; width: 80%; top: 48%; }
.timelinemain-item.left.first .noimg:before {
    position: absolute;
    content: "";
    width: 188px;
    height: 5px;
    border-radius: 6px;
    top: 35px;
    right: 15px;
    background: #fff;
    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58);
}
.yil1978:after {
    content: "";
    position: absolute;
    left: calc(50% - 2.5px);
    right: calc(50% - 2.5px);
    height: 60px;
    width: 5px;
    background: #fff;
    margin-top: 23px;
    border-radius: 10px;
    box-shadow: 0px 3px 10px 0px rgb(0, 0, 0);
}
.tusiadlogo:after {
    width: 100%;
    height: 45px;
    background: url(/images/timeline/tusiadlogo.png) center center no-repeat;
    content: '';
    display: block;
    position: absolute;
    z-index: 0;
    opacity: 0.2;
    background-size: contain;
    left: 0;
    top: 265px;
}
.timelinemain-item.right.second .year {
    position: relative;
    text-align: center;
    width: 80%;
    top: 48%;
}
.asagi2009{
    padding-top: 200px;
}
.asagi2009 .year:before {
    top: 238px!important;
}.asagi2009 .year:after {
    top: 230px!important;
}
.timelinemain-item.right.second .noimg:after {
    position: absolute;
    content: "";
    width: 150px;
    height: 5px;
    border-radius: 6px;
    margin-top: 0;
    left: 0;
    background: #fff;
    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58);
}
.timelinemain-item.left.third { position: absolute; right: 8%; top: 300px; width: 310px; text-align: center; background: #f0951e; border-radius: 8px; }
    .timelinemain-item.left.third .year { padding: 40px 0 50px; }
        .timelinemain-item.left.third .year span { font-size: 20px; }
    .timelinemain-item.left.third .noimg { position: relative; }
        .timelinemain-item.left.third .noimg:after { position: absolute; content: ""; width: 45px; height: 5px; border-radius: 6px; margin-top: 25%; right: -20.5%; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
    .timelinemain-item.left.third:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; top: 69px; right: -11px; }
    .timelinemain-item.left.third:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; top: 73px; right: -7px; }
.timelinetwo { margin-top: 100px; }
    .timelinetwo img.img-responsive { width: 100%; }
    .timelinetwo .wrapper { margin: 0 0 0 10%; padding: 100px 0 0; position: relative; }
        .timelinetwo .wrapper .yeartext { font-size: 204px; color: #e2e2e2; position: absolute; top: -40px; z-index: -1; font-weight: 700; }
    .timelinetwo p { color: #484646; font-size: 20px; line-height: 45px; text-align: justify; padding-right: 25px; }
        .timelinetwo p.title { color: #000; font-weight: 600; text-align: right; }
.timefoot,
.timehead { position: relative; }
.timefoot { padding-top: 20px; }
.timehead:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; bottom: -48px; left: calc(50% - 12px); }
.timehead:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; bottom: -44px; left: calc(50% - 8px); }
.timefoot:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; top: 2px; left: calc(50% - 12px); }
.timefoot:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; top: 6px; left: calc(50% - 8px); }
.martop { margin-top: 100px; }
.timecenter.lasttime { padding: 40px 0; height: 320px; }
    .timecenter.lasttime.withPicSa { padding: 40px 0; height: 660px; background-size:cover;}
    .timecenter.lasttime.withPicUf {
        padding: 40px 0;
        height: 660px;
        background-size: cover;
    }

    .timecenter.lasttime .timelinemain-item.left.third { top: 200px; }
    .timecenter.lasttime .first:before { position: absolute; content: ""; width: 45px; height: 5px; border-radius: 6px; top: 40px; right: 15px; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
    .timecenter.lasttime .first:after { top: 33px; right: 75px; border: solid 3px #f0951e; width: 20px; height: 20px; }

    .timecenter.lasttime .timelinemain-item.left.first { margin-top: 0; }
    .timecenter.lasttime .timelinemain-item.right.second { top: 100px; position: absolute; width: 90%; }
    .timecenter.lasttime.withPicSa .timelinemain-item.right.second { top: 300px; position: absolute; width: 90%; }

    .timecenter.lasttime.withPicUf .timelinemain-item.left.first { margin-top: 0; }
    .timecenter.lasttime.withPicUf .timelinemain-item.right.second { top: 300px; position: absolute; width: 90%; }

    .timecenter.lasttime .right:before { position: absolute; content: ""; width: 45px; height: 5px; border-radius: 6px; top: 40px; left: 0; background: #fff; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
    .timecenter.lasttime .right:after { top: 33px; left: 52px; border: solid 3px #f0951e; width: 20px; height: 20px; }
    .timecenter.lasttime .timelinemain-item.right.second .year { top: 0; }

#family h3 { font-size: 48px; color: #000; margin-bottom: 50px; }
.timelinemaster #footer { margin: 0; }

.alan1998 .year {
    background: #f0951e;
    border-radius: 8px;
    max-width: 680px;
    top: 450px !important;
}
.alan1998:before {
    top: 500px!important;
}.alan1998:after {
    top: 493px!important;
}
 .alan2017 .year {
    background: #f0951e;
    border-radius: 8px;
    max-width: 680px;
    top: 250px !important;
}
.alan2017:before {
    top: 300px !important;
}
.alan2017:after {
    top: 293px !important;
    right: 51px !important;
}

@media(min-width:1300px) and (max-width: 1400px) {
    body { overflow-x: hidden; }
    .timeline.wrapRight { width: 50%; }
        .timeline.wrapRight::after { height: 70%; }
    .timeline-item.left .imgwhite::after { right: -27.5%; width: 68px; }
    .timeline-item.right .imgwhite::after { left: -31.5%; width: 68px; }
    .timeline-item.left .noimg::after { right: -33.5%; margin-top: -18px; width: 35px; }
    .timeline-item.left.third { padding: 20px 30px 30px; top: 86%; left: -30px; }
    .timelinemain-item.left.third .noimg::after { width: 32px; right: -15.5%; }
    .timelinemain-item .imgwhite-yatay::after { right: -50px; width: 18%; }
    .timelinemain-item.right.second .imgwhite-yatay::after { left: -53%; width: 50%; }
    .timelinemain-item.right.second .year { width: 90%; }
    .timelinemain-item.left.first .year { width: 70%; left: 32%; top: 78%; }
    .timelinemain-item.left.first::after { right: 10.5%; }
    .timelinemain-item.left.first::before { right: 10%; }
}

/*Chrome Max 1400 support */
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:1400px) {
    .timelinemain-item.right.second:after { top: 66.9%; left: 26.6%; }
    .timelinemain-item.right.second:before { top: 66%; left: 26%; }
    .timelinemain-item.left.first::before { right: 11.7%; top: 16%; }
    .timelinemain-item.left.first:after { top: 18.3%; right: 12.3%; }
    .timelinemain-item.left.first .year { width: 60%; left: 36%; top: 70%; }
}

/* Not:root for chrome */
@media(min-width:1800px) {
    /*.timelinemain-item.left.first:not(*:root):before { top: 15%; right: 24%; }
    .timelinemain-item.left.first:not(*:root):after { top: 17%; right: 24.4%; }*/
}


.timecarousel .imgwhite-yatay .img-responsive { margin-left: 0; }
.timecarousel .imgwhite-yatay { width: 500px; height: auto; }
    .timecarousel .imgwhite-yatay.nobg, .timelinehead .imgwhite-yatay.nobg, .timelinemain-item.right.second.orga .imgwhite-yatay.nobg { background: none; }

.withPicSa .right .year { background: #f0951e; border-radius: 8px; left: 62px; width: 70%; }
.withPicSa .year span { margin-bottom: 15px; }
.withPicUf .timelinemain-item.left.first .year { background: #f0951e; border-radius: 8px; right: 84px; width: 70%; left: unset; }
.withPicUf .year span { margin-bottom: 15px; }

.netherlands img { height: 300px; width: 100%; object-fit: cover; margin-left: 0 !important; }
.netherlands .yil { margin-top: 20px; }

/*.net .yil{margin-top:80px}*/

.timecenter.orgachem { height: 300px; }

    .timecenter.orgachem .timelinemain-item.right.second { top: 0; }
    .timecenter.orgachem .timelinemain-item.left.first { margin-top: 10%; }
    .timecenter.orgachem .orga.timelinemain-item.right.second .imgwhite-yatay { margin-top: 100px; }
        .timecenter.orgachem .orga.timelinemain-item.right.second .imgwhite-yatay::after { display: none; }
.orga.netherlands img { height: 400px; }

.timelinemain-item.right.bonus.second { position: relative; padding-top: 18%; }
    .timelinemain-item.right.bonus.second .year { width: 70%; position: relative; text-align: center; top: -46px; }
    .timelinemain-item.right.bonus.second:after { top: -6px; }
/*.timelinemain-item.right.bonus.second .year:before{top:-10px}*/

.timelinemain-item.right.second .year:after { content: ""; width: 15px; height: 15px; background: #fff; border-radius: 100%; position: absolute; top: 42px; left: 25.6%; }
.timelinemain-item.right.second .year:before { content: ""; width: 23px; height: 23px; background: #f0951e; border-radius: 100%; position: absolute; top: 38px; left: 25%; }

.timecenter.lasttime .right::before { width: 150px; top: 47px; }

.timelinemain .yil:before { content: ""; position: absolute; left: calc(50% - 2.5px); right: calc(50% - 2.5px); height: 60px; width: 5px; top: -70px; background: #fff; border-radius: 10px; box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58); }
.timecenter.orgachem .orga.timelinemain-item.right.second .imgwhite-yatay { margin: 0; padding: 0; height: 400px; }

.timecenter.lasttime .right.orga::before { top: 90%; }
.timecenter.orgachem .timelinemain-item.left.first .year { top: 0; }

.timecenter.lasttime .timelinemain-item.left.first .year { top: 0; }

.withPicSa .timelinemain-item.left.first .year { top: 100px; }
.withPicSa .timelinemain-item.right.second .year { width: 70%; left: 176px; }
    .withPicSa .timelinemain-item.right.second .year:before { left: -10px; }
    .withPicSa .timelinemain-item.right.second .year:after { left: -6px; }

.timecenter.lasttime.lastoftime { height: 300px; margin-bottom: 100px; }

.timelinehead .imgwhite-yatay { }
    .timelinehead .imgwhite-yatay .owl-nav { text-align: left; margin: 0; position: absolute; left: 0; bottom: 0; }
        .timelinehead .imgwhite-yatay .owl-nav .owl-next, .timelinehead .imgwhite-yatay .owl-nav .owl-prev { padding: 10px; font-size: 24px; line-height: 1; margin: 0; border-radius: 0; background: #b63333; margin-right: 1px !important; }
    .timelinehead .imgwhite-yatay .owl-next:hover, .timelinehead .imgwhite-yatay .owl-prev:hover { background: #2a2a2a; }
.netherlands .imgwhite-yatay { height: 340px; }

.timelinemain-item .imgwhite-yatay { }
    .timelinemain-item .imgwhite-yatay .owl-nav { text-align: left; margin: 0; position: absolute; left: 0; bottom: 0; }
        .timelinemain-item .imgwhite-yatay .owl-nav .owl-next, .timelinemain-item .imgwhite-yatay .owl-nav .owl-prev { padding: 10px; font-size: 24px; line-height: 1; margin: 0; border-radius: 0; background: #b63333; margin-right: 1px !important; }
    .timelinemain-item .imgwhite-yatay .owl-next:hover, .timelinemain-item .imgwhite-yatay .owl-prev:hover { background: #2a2a2a; }

.timecenter.lasttime.lastimg { height: 440px; }

.timecenter.withPicPiu { background: url(/images/timebg-piu.jpg) no-repeat center; height: 600px; margin: 100px 0 50px; position: relative; }
.withPicPiu .timelinemain-item.right.second .year { width: 70%; left: 176px; }
    .withPicPiu .timelinemain-item.right.second .year:before { left: -10px; }
    .withPicPiu .timelinemain-item.right.second .year:after { left: -6px; }
.timecenter.lasttime.withPicPiu .timelinemain-item.right.second { top: 360px; position: absolute; width: 90%; }
.withPicPiu .timelinemain-item.right.second .year { background: #f0951e; border-radius: 8px; left: 62px; width: 85%; padding-bottom: 10px; }

.orgachem .timelinemain-item.right.second .imgwhite-yatay { width: 80%; }
.timecenter.lasttime.lastoftime.orgachem {
    height: 600px;
    background-size: cover !important;
}
.timecenter.lasttime.lastoftime .timelinemain-item.right.second.orga { top: 120px; width: 70%; left: 3%; }
.timecenter.lasttime.lastoftime .right.orga:before { top: -83px; left:0; display:none; }
.timecenter.lasttime.lastoftime .ov .year{width:75%}
.timecenter.lasttime.lastoftime .ov .year:after { top: 30px; left: 190px; background:#fff; border: solid 3px #f0951e; border-radius:50%; width: 20px; height: 20px; position:absolute; content:'' }
.timecenter.lasttime.lastoftime .ov .year:before {
    position: absolute;
    content: "";
    width: 165px;
    height: 5px;
    border-radius: 6px;
    top: 38px;
    left: 15px;
    background: #fff;
    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.58);
}
.gorsel_2017{
    display:block;
    margin-top: -20px;
}
.timecenter.lasttime.lastoftime .year {
    text-align: center;
    display: block
}
.bg2017 {
    background: url(/images/timeline/bg_2017.jpg) center center no-repeat!important;
}
.orgachem .timelinemain-item.right.second .imgwhite-yatay {
    width: 100%;
}
.timecenter.lasttime.lastoftime .timelinemain-item.left.first { padding-top: 50%; position: relative; }
