/* webfonts in use */
/* OpenSans, OpenSansBT, OpenSansSBT, OpenSansIT, OpenSansEBIT, OpenSansSBIT */
/* FontAwesome:
   Brands: font-family:"Font Awesome 5 Brands";font-style:normal;font-weight:normal;
   Light: font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:300;
   Reg: font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:400;
   Bold: font-family:"Font Awesome 5 Pro"; font-style:normal; font-weight:900; 
*/


#main {padding-bottom:0;}

.specialbg {background:url(/typo3conf/ext/ff_sitepackage_c2c/Resources/Public/Images/organisation-bg.png) no-repeat #ececed; background-size: cover;}
.specialbg h2 {margin-bottom:80px;}

.cols-2-inner {margin-bottom:40px;}
#contentmain .cols-2-inner .ce-gallery figure {margin-top:0;}

.contact .ce-textpic {position:relative;}
.contact .ce-gallery {margin-bottom:0 !important; margin-right:2%;}
.contact .ce-bodytext {margin-top:120px; padding:0 0 0 15px;}
.contact .ce-bodytext p {margin:0;}

/* timeline */
#timeline {display:flex; flex-wrap:wrap; margin:50px 0 100px;}
.timecard {position:relative; width:26.666666%; background-color:#fff; padding:14px; border:solid 1px #195a82;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15);
  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15);
}
.timecard span {display:block; text-align:center; font-size:32px; font-size:3.2rem; line-height:34px; color:#195a82; font-family:OpenSansBT, sans-serif;}
.timecard p {margin:10px 0 0 0; text-align:justify; font-size:16px; font-size:1.6rem; line-height:20px;}


.timecard:nth-child(3n) {margin-right:0;}

.seperater {position:relative; width:10%; height:10px; align-self: center; background-color:#195a82; text-align:center;}
.seperater .fa-caret-left,
.seperater .fa-caret-right {position:absolute; z-index:999; bottom:-75%; line-height:28px; font-size:48px; font-size:4.8rem; color:#195a82;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #fff;
}

.seperater-vert-right {display:flex; width:100%; height:80px; padding-right:12%; flex-direction: row-reverse;}
.seperater-vert-right div {position:relative; width:10px; height:80px; background-color:#195a82; text-align:center;}
.seperater-vert-right .fa-caret-up {position:absolute; top:35%; left:-9px; z-index:999; line-height:28px; font-size:48px; font-size:4.8rem; color:#195a82;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #fff;
}

.seperater-vert-left {display:flex; width:100%; height:80px; padding-left:12%;}
.seperater-vert-left div {position:relative; width:10px; height:80px; background-color:#195a82; text-align:center;}
.seperater-vert-left .fa-caret-up {position:absolute; top:35%; left:-9px; z-index:999; line-height:28px; font-size:48px; font-size:4.8rem; color:#195a82;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #fff;
}


@media only screen and (max-width: 1440px) {
.contact {padding:50px 15px;}
.slider-caption {left:15px;}
}

@media only screen and (max-width: 1280px) { 
.contact .ce-textpic {display:flex; flex-wrap:wrap;}
.contact .ce-intext .ce-gallery {float:none; margin-right:0; width:50%;}
.contact .ce-intext .ce-gallery img {width:100%; height:auto;}
.contact .ce-bodytext {width:50%; margin-top:80px;}
}


@media only screen and (max-width: 1024px) { 
.contact h4 {font-size:18px; font-size:1.8rem; line-height:22px;}
.contact .ce-bodytext p {font-size:16px; font-size:1.6rem; line-height:20px;}
.contact .ce-intext .ce-gallery {width:45%;}
.contact .ce-bodytext {width:55%; margin-top:50px;}
}

@media only screen and (max-width: 768px) { 
#c85 .col {margin-bottom:0;}

.specialbg {margin-bottom:50px;}
.specialbg h2 {margin-bottom:35px;}

.timecard {width:100%; margin-bottom:15px;}
.timecard span {font-size:24px; font-size:2.4rem; line-height:28px;}
.seperater-vert-left,
.seperater-vert-right,
.seperater {display:none;}
#card15 {order:1;}
#card14 {order:2;}
#card13 {order:3;}
#card1 {order:4;}
#card2 {order:5;}
#card3 {order:5;}
#card6 {order:4;}
#card5 {order:6;}
#card4 {order:6;}
#card7 {order:7;}
#card8 {order:8;}
#card9 {order:9;}
#card12 {order:10;}
#card11 {order:11;}
#card10 {order:12;}



.contact .col {margin-bottom:25px;}
.contact .ce-intext .ce-gallery {width:35%;}
.contact .ce-bodytext {width:65%;}
}


@media only screen and (max-width: 640px) { 

}

@media only screen and (max-width:480px) { 
.contact .ce-bodytext {margin-top:25px;}
}

