.elementor-596 .elementor-element.elementor-element-69ce7ad8{--display:flex;}.elementor-596 .elementor-element.elementor-element-69ce7ad8.e-con{--flex-grow:0;--flex-shrink:0;}@media(min-width:768px){.elementor-596 .elementor-element.elementor-element-69ce7ad8{--width:98.145%;}}/* Start custom CSS for text-editor, class: .elementor-element-260f4620 */* { box-sizing: border-box; } .timeline { overflow:hidden; position:relative; max-width:1200px; min-height:555px; background-color:#CCC; background-image:url('http://2130.wp.greekly.io/wp-content/uploads/sites/41/2020/02/timeline-background.png'); margin:0 auto; padding: 1em 0; border:7px solid #ffaa00; border-radius: 33px; box-shadow:inset 3px 7px 3px rgba(0,0,0,0.33), 7px 12px 7px rgba(0,0,0,0.33); color:black;} /* The actual timeline (the vertical ruler) */ .timeline:after { content: ''; position: absolute; width: 6px; background-color: black; top: 0; bottom: 0; left: 31px; margin-left: -3px;}/* The actual timeline (the vertical ruler) */ .timeline-container { padding: 10px 40px; position: relative; background-color: transparent; width: 50%;} /* timeline-container around timeline-content */ .timeline-container:after { content: ''; position: absolute; width: 25px; height: 25px; right: -17px; background-color: #0046ad; border: 4px solid #ffaa00; top: 15px; border-radius: 50%; z-index: 1;}/* The circles on the timeline */ .timeline-container:nth-child(odd) { left: 0;}/* Place the timeline-container to the left */ .timeline-container:nth-child(even) { left: 50%;}/* Place the timeline-container to the right */ .timeline-container:nth-child(odd):before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; right: 30px; border: medium solid white; border-width: 10px 0 10px 10px; border-color: transparent transparent transparent white;}/* Add arrows to the left timeline-container (pointing right) */ .timeline-container:nth-child(even):before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; left: 30px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent;}/* Add arrows to the right timeline-container (pointing left) */ .timeline-container:nth-child(even):after { left: -16px;}/* Fix the circle for timeline-containers on the right side */ .timeline-content { padding: 20px 160px 20px 30px; background-color: white; position: relative; border-radius: 6px;}/* The actual timeline-content */ .timeline-content img {display:block; position:absolute; right:1px; top:1px; border-radius: 6px;} .timeline-content h2 {color:#0046ad;} /* Media queries - Responsive timeline on screens less than 600px wide */ .timeline:after { left: 31px; }/* Place the timelime to the left */ .timeline-container { width: 100%; padding-left: 70px; padding-right: 25px; }/* Full-width timeline-containers */ .timeline-container:nth-child(odd):before, .timeline-container:nth-child(even):before { left: 60px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; }/* Make sure that all arrows are pointing leftward */ .timeline-container:nth-child(odd):after, .timeline-container:nth-child(even):after { left: 15px; }/* Make sure all circles are at the same spot */ .timeline-container:nth-child(even) { left: 0%; }/* Make all right timeline-containers behave like the left ones */

@media only screen and (max-width: 767px){
    
    * { box-sizing: border-box; } .timeline { overflow:hidden; position:relative; max-width:1200px; min-height:555px; background-color:#CCC; background-image:url('http://2130.wp.greekly.io/wp-content/uploads/sites/41/2020/02/timeline-background.png'); margin:0 auto; padding: 1em 0; border:7px solid #ffaa00; border-radius: 33px; box-shadow:inset 3px 7px 3px rgba(0,0,0,0.33), 7px 12px 7px rgba(0,0,0,0.33); color:black;} /* The actual timeline (the vertical ruler) */ .timeline:after { content: ''; position: absolute; width: 6px; background-color: black; top: 0; bottom: 0; left: 31px; margin-left: -3px;}/* The actual timeline (the vertical ruler) */ .timeline-container { padding: 10px 40px; position: relative; background-color: transparent; width: 50%;} /* timeline-container around timeline-content */ .timeline-container:after { content: ''; position: absolute; width: 25px; height: 25px; right: -17px; background-color: #0046ad; border: 4px solid #ffaa00; top: 15px; border-radius: 50%; z-index: 1;}/* The circles on the timeline */ .timeline-container:nth-child(odd) { left: 0;}/* Place the timeline-container to the left */ .timeline-container:nth-child(even) { left: 50%;}/* Place the timeline-container to the right */ .timeline-container:nth-child(odd):before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; right: 30px; border: medium solid white; border-width: 10px 0 10px 10px; border-color: transparent transparent transparent white;}/* Add arrows to the left timeline-container (pointing right) */ .timeline-container:nth-child(even):before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; left: 30px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent;}/* Add arrows to the right timeline-container (pointing left) */ .timeline-container:nth-child(even):after { left: -16px;}/* Fix the circle for timeline-containers on the right side */ .timeline-content { padding: 20px 20px 20px 30px; background-color: white; position: relative; border-radius: 6px;}/* The actual timeline-content */ .timeline-content img {display:block; position:static; right:1px; top:1px; border-radius: 6px;} .timeline-content h2 {padding-top: 10px;color:#0046ad; font-size:1.3em;} /* Media queries - Responsive timeline on screens less than 600px wide */ .timeline:after { left: 31px; }/* Place the timelime to the left */ .timeline-container { width: 100%; padding-left: 70px; padding-right: 25px; }/* Full-width timeline-containers */ .timeline-container:nth-child(odd):before, .timeline-container:nth-child(even):before { left: 60px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; }/* Make sure that all arrows are pointing leftward */ .timeline-container:nth-child(odd):after, .timeline-container:nth-child(even):after { left: 15px; }/* Make sure all circles are at the same spot */ .timeline-container:nth-child(even) { left: 0%; }/* Make all right timeline-containers behave like the left ones */
}/* End custom CSS */