:root { --primary-color: #000000; --dark-green: #285A47; --deep-green: #066666; --light-green: #027C66; --green: #00AA69; --dark-blue: #094F63; --deep-blue: #264972; --navi-blue: #0B1E60; --grey: #1B1A1A; --off-white: #f4f5f9; }

body { color: var(--primary-color); font-family: 'new-frank', sans-serif, Arial, Helvetica; font-weight: normal; }
body,html { overflow-x:hidden; }
a, a.js-load-more {transition: .3s ease all;display: inline-flex;align-items: center;}
a, a:hover { text-decoration: none; }
a>i.ti-arrow-right{ margin-right:10px!important; }
a:focus { outline: none; }
*:focus { outline: none; }
button:active, button:focus, .btn:active, .btn:focus { box-shadow: none !important; outline: none !important; }
.img-responsive, .navbar-brand > img { display: inline-block; }
img { display: inline-block; height: auto; max-width: 100%; }
h1, h2, h3, h4, h5, h6 { color: var(--primary-color); font-family: 'new-frank', sans-serif; font-weight: 300; text-transform: uppercase; }
h2 { font-size: 42px; }
h3 { font-size: 28px; }
p, li, ol { color: var(--grey); font-family: 'new-frank', sans-serif; font-size: 15px; font-weight: normal; overflow-wrap: break-word; word-wrap: break-word; }
.clearfix { clear: both; margin: 0px; padding: 0px; }
.center { text-align: center; }
.plyr {margin-top: 5%;margin-bottom: 5%;}
.spinner-border {border: .15em solid currentColor;border-right-color: transparent;border-radius: 50%;}
.cs-20 {letter-spacing: .02em;}
.bold-p-17 {font-weight: 400;font-size: 17px;line-height: 22px;}
.bold-p-20 {font-weight: 500;font-size: 20px;line-height: 26px;letter-spacing: .01em;}

.abs-link-container {position: relative;}
.abs-link-container a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 100;opacity: 1;}
.abs-link-container a:before {content: "";display: block;left: 0;top: 0;width: 100%;height: 100%; background-color: #094f63;opacity: .7;transform: scale(0,1);transform-origin: center;transition: transform 0.6s ease;}
.abs-link-container a:hover::before {transform: scale(1,1);}
.color-theme-1 .abs-link-container a:before {background-color: #094F63;}
.color-theme-2 .abs-link-container a:before {background-color: #066666;}
.color-theme-3 .abs-link-container a:before {background-color: #027C66;}
.color-theme-4 .abs-link-container a:before {background-color: #264972;}
.color-theme-5 .abs-link-container a:before {background-color: #285a47;}

.link-arrowed:before {content: "\e628";font-family: 'themify';speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 27px;margin-right: 8px;vertical-align: middle;}

.container { position: relative; }
.container-fluid { max-width: 1680px; }

.hamburger{display:inline-block;cursor:pointer;transition-property:opacity,filter;transition-duration:.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}
.hamburger:hover{opacity:.7}
.hamburger.is-active:hover{opacity:.7}
.hamburger.is-active .hamburger-inner,.hamburger.is-active .hamburger-inner::before,.hamburger.is-active .hamburger-inner::after{background-color:#000}
.hamburger-box{width:24px;height:20px;display:inline-block;position:relative}
.hamburger-inner{display:block;top:50%;margin-top:-2px}
.hamburger-inner,.hamburger-inner::before,.hamburger-inner::after{width:24px;height:1px;background-color:#000;border-radius:0;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}
.hamburger-inner::before,.hamburger-inner::after{content:"";display:block}
.hamburger-inner::before{top:-10px}
.hamburger-inner::after{bottom:-10px}

.hamburger--spring .hamburger-inner{top:2px;transition:background-color 0s .13s linear}
.hamburger--spring .hamburger-inner::before{top:10px;transition:top .1s .2s cubic-bezier(0.33333,0.66667,0.66667,1),transform .13s cubic-bezier(0.55,0.055,0.675,0.19)}
.hamburger--spring .hamburger-inner::after{top:20px;transition:top .2s .2s cubic-bezier(0.33333,0.66667,0.66667,1),transform .13s cubic-bezier(0.55,0.055,0.675,0.19)}
.hamburger--spring.is-active .hamburger-inner{transition-delay:.22s;background-color:transparent!important}
.hamburger--spring.is-active .hamburger-inner::before{top:0;transition:top .1s .15s cubic-bezier(0.33333,0,0.66667,0.33333),transform .13s .22s cubic-bezier(0.215,0.61,0.355,1);transform:translate3d(0,10px,0) rotate(45deg)}
.hamburger--spring.is-active .hamburger-inner::after{top:0;transition:top .2s cubic-bezier(0.33333,0,0.66667,0.33333),transform .13s .22s cubic-bezier(0.215,0.61,0.355,1);transform:translate3d(0,10px,0) rotate(-45deg)}

.navbar { background-color: var(--bs-white); padding: 0px 0px; height: 115px; }
.navbar h4 { color: #066666; float: left; font-size: 24px; line-height: 30px; font-weight: 300; margin: 5% 0px 0px; max-width: 324px; }
.navbar-brand > img { max-width: 217px;height: auto; }

.navbar-toggler { border: none; margin: 40px 0px 0px; }
.navbar-toggler-icon { background: url(../images/toggle.png) no-repeat left top; height: 20px; width: 24px; }
.navbar-toggler-icon:hover { background-position: left -20px; }
.navbox { float: left; display: block !important; height: 115px;  text-align: center; width: 100px; }

.navbar .navbar-nav .nav-item { border-bottom: 1px solid var(--bs-white); }
.navbar .navbar-nav .nav-link { color: var(--bs-white); font-size: 15px; font-weight: normal; padding: 2rem 0.5rem 2rem 25%; text-transform: uppercase; width: 100%; }
.navbar .navbar-nav .nav-link:hover { background-color: rgba(255, 255, 255, 0.2); }

.dropdown-toggle::after { background: url(../../mfss/images/menu-arw.svg) no-repeat right center / 20px; border: 0px;  display: block; height: 17px; position: absolute; z-index: 1; right: 15%; top:30px; width: 20px; }
.dropdown-toggle.show::after {
    transform: rotate(180deg);
}
.dropdown-menu {
    background-color: transparent;
    border: 0px;
    border-radius: 0px;
    box-shadow: none;
    margin: 0px 0px;
    padding-bottom: 20px;
}
.dropdown-item {
    background-color: transparent;
    color: var(--bs-white);
    font-size: 15px;
    font-weight: 300;
    padding: 0.5rem 0.5rem 0.5rem 25%;
    text-transform: uppercase;
}
.navbar .navbar-nav .dropdown-menu .nav-item {
    border-bottom: 0;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: var(--bs-white);
    background-color: rgba(255, 255, 255, 0.2);
}
.dropdown-item.active, .dropdown-item:active {
    background-color: rgba(255, 255, 255, 0.2);
}

#ModalNavbar { background: rgba(0, 0, 0, 0.5); }
#ModalNavbar .modal-dialog { background-color: var(--navi-blue); margin: 0 0 0 auto; max-width:500px; min-height:100%; }
#ModalNavbar .modal-content { background-color: transparent; border: none; }
.nav-close { background-color: var(--navi-blue); border-bottom: 1px solid var(--bs-white); text-align: left; padding: 2.5rem 0.5rem 2.5rem 25%; }
.nav-close a { color: var(--bs-white); display: inline; }
.nav-close a:hover { color: var(--green); }

.searchbox { border-left: 1px solid rgba(0, 91, 91, 0.5); border-right: 1px solid rgba(0, 91, 91, 0.5); float: left; height: 115px; padding: 45px 0px 0px; text-align: center; width: 100px; }
.searchbox a { color: var(--navi-blue); font-size: 22px; }
.searchbox a:hover { color: var(--green); }
.social { font-size: 20px; padding: 0.95rem 0.5rem 0.95rem 25%; }
.social a { color: var(--green); margin: 0px 7px; }
.social a:hover { color: var(--bs-white); }

.modal-backdrop { background-color: rgba(0,0,0,.0001) !important; }

#ModalSearch { background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 115px, rgba(0,0,0,0.55) 115px, rgba(0,0,0,0.5) 100%) !important; }
.modal-content { background-color: transparent; border: none; }
.modal-content .search { background-color: var(--bs-white); position: relative }
.modal-content .form-control { background-color: var(--bs-white); border: none; border-bottom: 1px solid var(--navi-blue); border-radius: 0px; color: var(--navi-blue); font-size: 15px; font-weight: normal; margin: 10px 0px; padding: .375rem 0rem; }
.modal-content .form-control::placeholder { color: var(--navi-blue); text-transform: uppercase; }
.modal-content .form-control:focus { box-shadow: none; }
.modal-content .btn-srch { background: url("../images/lens.png") no-repeat center / 23px 23px; height: 35px; position: absolute; opacity: 0.5; right: 0px; top: 10px; width: 35px; }
.modal-content .btn-srch:hover { opacity: 1; }
.modal-content .close { background-color: var(--bs-white); border: none; padding: 16px 15px 14px; }
.modal-content .close:hover { color: var(--green); }
.modal-content .lft-spc { margin-right: 128px; }

footer { background-color: var(--navi-blue); clear: both; margin: 0px auto; padding: 7% 0px 40px; max-width: 1680px; width: 100%; }
footer .flogo { margin-bottom: 5%; }
footer h4 { color: var(--bs-white); font-size: 20px; margin-top: 25%; }
footer ul { list-style: none; margin: 1% 0px 5%; padding: 0px; }
footer ul li { color: var(--bs-white); display: inline-block; font-size: 15px; font-weight: normal; padding: 0px 1.8rem 0px 0px; text-transform: uppercase; }
footer ul li a { color: var(--bs-white); }
footer ul li a:hover { color: var(--green); }
footer p { color: var(--bs-white); font-size: 15px; font-weight: 300; }
footer .dpart {margin-bottom: 25px;align-items: flex-end;}
footer .dpart p { font-size: 12px; margin-top: 15px; margin-bottom: -2px; }
footer .dpart:nth-of-type(2) p {margin-bottom: 2px;}
footer .follow { margin-top: 10%; }
footer .follow .fa { color: var(--green); font-size: 27px; margin-right: 14px; }
footer .follow .fa:hover { color: var(--bs-white); }
footer .form-control { background: none; border: none; border-bottom: 1px solid #00AA69; border-radius: 0px; color: var(--green); font-size: 15px; font-weight: normal; padding: .375rem 0rem; }
footer .form-control::placeholder { color: var(--green); }
footer .form-control:focus { background: transparent; border-color: var(--green); box-shadow: none;color: var(--green); }
footer .btn-submit { color: var(--green); font-size: 18px; margin: 0px; padding: 0px; position: absolute; right: 0px; top: 7px; z-index: 1; }
footer .btn-submit:hover { color: var(--green); }
footer .subscribe { position: relative; }
footer label { color: var(--bs-white); font-size: 12px; font-weight: 300; margin-top: 10px; }

footer .form-control-parent {max-width: 100%;}
footer .form-control-parent input[type="email"], footer .form-control-parent input[type="text"] {background: none; border: none; border-bottom: 1px solid #00AA69; border-radius: 0px; color: var(--green); font-size: 15px!important;font-weight: normal;padding: .375rem 0rem!important;}
footer .form-control-parent input[type="email"]::placeholder, footer .form-control-parent input[type="text"]::placeholder { color: var(--green); }
footer .form-control-parent input[type="email"]:focus, footer .form-control-parent input[type="text"]:focus { background: transparent; box-shadow: none;}

footer .gform_wrapper.gravity-theme .gform_fields {grid-column-gap: 10px;}
footer .gform_wrapper.gravity-theme .gform_footer {position: relative;max-width: 360px;padding: 0;margin: 0;}
footer .gform_wrapper.gravity-theme .gform_footer button {position: absolute;top: -30px;}
footer .gform_wrapper.gravity-theme .gfield {display: flex;flex-direction: column;}
footer .ginput_container {order:2;}
footer .validation_message {order: 1;}

.copy { clear: both; color: var(--green); font-size: 12px; font-weight: 300; margin-top: 4%; text-transform: uppercase; width: 100%; }
.copy p {color: inherit;font-size: inherit;font-weight: inherit;margin: 0;}
.copy a { color: var(--green); margin-left: 10px; }
.copy a:hover { color: var(--bs-white); }
.copy .col:last-child a { margin: 0px; }

.bread-crumb { background-color: rgba(11, 30, 96, 0.1); clear: both; margin: 0px auto; padding: 15px 0px; max-width: 1680px; width: 100%; }
.breadcrumb { margin: 0px; }
.breadcrumb li { color: rgba(11, 30, 96, 0.5); font-size: 12px; text-transform: uppercase; }
.breadcrumb li a, .breadcrumb-item.active { color: rgba(11, 30, 96, 0.5); }
.breadcrumb li a:hover { color: var(--navi-blue); }
.breadcrumb-item+.breadcrumb-item::before, .breadcrumb li+li::before { color: var(--green); content: "\e649"; font-family: 'themify'; font-size: 11px; }
.breadcrumb li+li {padding-left: .5rem;}
.breadcrumb li+li::before {float: left;padding-right: .5rem;}

.heading { background-color: rgba(2, 124, 102, 0.05); clear: both; margin: 0px auto; padding: 35px 0px 25px; max-width: 1680px; width: 100%; }
.heading h2 { color: var(--light-green); }
.heading p { color: var(--light-green); font-weight: 300; }
.heading .search { margin: 0px; position: relative; }
.heading .form-control { background-color: transparent; border: none; border-bottom: 1px solid #00705B; border-radius: 0px; color: var(--light-green); font-size: 15px; font-weight: normal; margin: 0px 0px; padding: .375rem 0rem; }
.heading .form-control::placeholder { color: var(--light-green); text-transform: uppercase; }
.heading .form-control:focus { box-shadow: none; }
.heading .btn-srch { color: var(--light-green); font-size: 20px; font-weight: normal; padding: 0px; position: absolute; right: 0px; top: 3px; width: 30px; z-index: 1; }
.heading .btn-srch:hover { color: var(--green); }
.heading .btn-srch .spinner-border {width: 20px;height: 20px;display: none;}
.heading .btn-srch.loading i {display: none;}
.heading .btn-srch.loading .spinner-border {display: block;}

p.not-found { padding: 10%; text-align: center; font-size: 30px; }

.edate, .spotlight .edate, .forum article p.edate { margin-bottom:10px!important; }
.edate > span, .spotlight .edate > span, .forum article p.edate > span { font-size: 17px;
    font-weight: 300;
    margin: 0px;
    opacity: 0.8; text-transform:uppercase; }
	
footer .gform_confirmation_message { color:#00aa69; }

.forum .thumbnail-holder:after, .news .abs-link-container:after, .projects .thumbnail-holder:after { display:none; content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(2, 124, 102, 0.4); }
.forum .thumbnail-holder, .news .abs-link-container, .projects .thumbnail-holder, .projects .thumbnail-holder { background-color:#027c66; background-blend-mode:hard-light; background-size:cover; background-position:center; min-height:200px; max-height:200px; }
.news .abs-link-container img { opacity:0; }

#ModalNavbar { padding-right:0!important; }

a.flexbtn { display: flex!important; line-height: 1; }
a.flexbtn:hover>i { left: 3px; }
a.flexbtn>i { transition:all 0.3s ease-in-out; position: relative; left:0; }
a.flexbtn>i.ti-arrow-right { font-size:25px; }

.mejs-overlay-button {
    background-image: url(https://ttf.uk.net/wp-content/themes/ttf/assets/images/MfSS_Video_Play_icon.svg)!important;
    background-size: contain!important;
    background-position: center!important;
	transition:all 0.3s ease-in-out;
}
.mejs-overlay:hover>.mejs-overlay-button { background-position: center; background-size:100%; transform: scale(1.2); }

.top_mini_bar_div {
	max-width: 1680px;
	margin:auto;
}
.top_mini_bar {
	display:flex;
    margin: auto;
	list-style-type:none;
	justify-content: space-between;
    padding: 0;
	align-items:center;
	align-items: stretch;
}
.top_mini_bar a {
	font-size:15px;
	letter-spacing: 1px;
	color:white;
	display: block;
    padding: 6px;
	text-transform:uppercase;
	font-weight:300;
	text-align:center;
	width:100%;
}
.top_mini_bar>li {
	width:auto;
	flex:1;
	display: flex;
    align-items: center;
	transition:0.3s ease-in-out;
	flex: 1 1 auto;
}

/*-------------------
    Media Query
---------------------------*/

@media only screen and (max-width: 767px) {
	h2 { font-size: 30px; }
	h3 { font-size: 22px; }
	p { font-size: 14px; }
	.col{ flex-basis: auto;}
	.navbar-brand { width: 150px; }
	.navbar { height: 80px; }
	.navbar-brand > img { max-width: 100%; }
	.navbar h4 { display: none; }
	.searchbox { height: 80px; padding-top: 25px; width: 50px; }
	.navbox { height: 80px; width: 40px; }
	.navbar-toggler { margin-top: 20px; }
	#ModalSearch { background: rgba(0, 0, 0, 0.5) !important; }
	#ModalSearch .col{ flex-basis: 0;}
	#ModalSearch .justify-content-end { justify-content: center !important; }
	.modal-content .search { width: 63.3333%; }
	.modal-content .col-md-1 { width: 16.6666%;}
	.modal-dialog { margin: 1rem auto; }
	.modal-content .lft-spc { margin: 0px; }
	footer .flogo { width: 200px; }
	footer h4 { margin-top: 8%; }
	footer ul li { padding-right: 0.4rem; }
	footer .dpart { margin-bottom: 10px; }
	footer .dpart p, footer .dpart:nth-of-type(2) p {margin-bottom: 1rem;}
	.edate > span { font-size: 14px; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	h2 { font-size: 30px; }
	h3 { font-size: 22px; }
	p { font-size: 14px; }
	.navbar-brand { width: 150px; }
	.navbar-brand > img { max-width: 100%; }
	.navbar { height: 80px; }
	.navbar h4 { font-size: 20px; max-width: 255px; }
	.navbar-collapse { margin-left: -24px; top: 80px; }
	.searchbox { padding: 28px 0px 0px; height: 80px; width: 80px; }
	.navbar-toggler { margin-top: 20px; }
	.navbox { height: 80px; width: 80px; }
	.modal-dialog { margin: 1rem auto; }
	.modal-content .lft-spc { margin: 0px 25px 0px 10px; }
	#ModalSearch { background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 80px, rgba(0,0,0,0.55) 80px, rgba(0,0,0,0.5) 100%) !important; }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	h2 { font-size: 38px; }
	h3 { font-size: 24px; }
	.modal-content .search { width: 40.333%; }
	.modal-content .lft-spc { margin: 0px 60px 0px 20px; }
}

@media (min-width: 1399px) {
	.modal-content .lft-spc { margin: 0px 38px 0px 10px; }
}

@media only screen and (max-width: 600px) { 
	.top_mini_bar_div { background:none!important; scroll-behavior: smooth; }
	.top_mini_bar { overflow-x: auto; }
	.top_mini_bar>li { flex:none; flex-shrink: 0; width:auto; }
	.top_mini_bar a { padding:6px 20px;}
}