@charset "UTF-8";

@import url("font-awesome.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');

/*--Colours--*/
.darky {color:#232323;}
.orangy {color:#e87324;}
.darky2 {color:#2d2d2c;}


body {font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size:14px; line-height:1.5em; color:#2d2d2c; height:100%; -webkit-animation:fadeIn 1s; animation:fadeIn 1s; text-align:left;}
@media (min-width: 768px) { body {font-size:15px;} }
@media (min-width: 992px) { body {font-size:15.5px;} }
@media (min-width: 1200px) { body {font-size:16px;} }
@media (min-width: 1600px) { body {font-size:16.5px;} }

h1, h2, h3, h4, h5 {margin-top:0; margin-bottom:20px; padding:0; text-align:left; line-height:1.3em; font-weight:700;}

h1 {font-size:2.3em; color:#e87324; line-height:1.0em; margin:0 0 20px 0; text-transform:none; font-weight:900; }
@media (min-width: 480px) { h1 {font-size:2.6em;} }
@media (min-width: 768px) { h1 {font-size:2.8em;} }
@media (min-width: 992px) { h1 {font-size:3.0em;} }
@media (min-width: 1200px) { h1 {font-size:3.5em;} }
@media (min-width: 1600px) { h1 {font-size:4.0em;} }

h2 {font-size:2.0em; color:#2d2d2c; text-transform:none; line-height:1.2em;  }
@media (min-width: 480px) { h2 {font-size:2.1em;} }
@media (min-width: 768px) { h2 {font-size:2.3em;} }
@media (min-width: 992px) { h2 {font-size:2.5em;} }
@media (min-width: 1200px) { h2 {font-size:2.8em;} }
@media (min-width: 1600px) { h2 {font-size:3.0em;} }

h3 {font-size:1.7em; color:#e87324; margin:0 0 20px 0; font-size:2em; font-weight:900;}
h4 {font-size:1.5em; color:#e87324; }
h5 {font-size:1.2em; color:#2d2d2c; }
h6 {font-size:1em; line-height:1.3em; margin-bottom: 0}

p {margin: 0 0 1.3em 0; font-size:1.1em; line-height:1.6em; color:#2d2d2c;}
p.lead {display:block; padding:0 0 0; font-size:1.3em; line-height:1.6em; margin:0 0 1.2em 0; font-weight:700; color:#2d2d2c;}
@media (min-width: 480px) { p.lead {font-size:1.2em;} }
@media (min-width: 768px) { p.lead {font-size:1.2em;} }
@media (min-width: 992px) { p.lead {font-size:1.2em;} }
@media (min-width: 1200px) { p.lead {font-size:1.2em;} }

p.descriptor {font-style:italic; font-size:0.9em; line-height:1.2em;}

ul{margin:0 0 1em 10px; padding:0;}
ul ul,
ul ol,
ol ol,
ol ul{margin:10px 0 1em 0em; }
li {list-style:disc; margin:0 0 0.5em 0; font-size:1.1em; } 
ol li {list-style:decimal !important;}
li:before,
ol li ul li:before{background:none; font-family:'FontAwesome'; font-size:0.6em; position: absolute; left:0; top:0; content:"";  color:#9bc42b; }
li ul li{margin:0 0 0.5em 20px;}

/*--DL list--*/
dl {}
dt {
    color: #865121;
    font-weight: bold;
    line-height: 1.3em;
    margin: 0 0 0 0;
    padding: 10px 0 0.3em 0;
    font-style: italic;
	border-top: 1px dotted #CCC;}
dd {margin: 0 0 0.0em 0;
padding:0px 0 5px 8%;
border-top: 0px dotted #CCC;}

ul{margin:0.3em 0 1em 15px; }

a {color:#2d2d2c; text-decoration:none; cursor:pointer;}
a:hover{color:#000;}
a:hover, a:active, a:focus{outline: none}
strong{color: #555555}
hr{clear:both; height:2px; padding:5px 0; margin:0 0 18px 0; border:none; border-bottom:2px dotted #ccc;}

img {}
img.img-center {display:block; margin:0 auto 40px auto;}

.mr-auto, .mx-auto {margin-right: auto !important; margin-left: auto !important;}
.img-fluid {width:auto; max-width:100% !important; height:auto;}

/*--Buttons--*/
.btn {padding:5px 12px 5px 12px; text-decoration:none !important; text-transform:uppercase; font-family:"DIN-Regular", Arial, Helvetica, sans-serif !important; border-radius:0; -webkit-transition:transform 0.2s ease; transition:transform 0.2s ease;}
.btn:hover {transform:scale(1.05);}

.btn-primary {color:#fff; background:#865121; border:0px solid #d58c16; line-height:1.25em; padding:6px 12px 6px; font-size:0.8em;	-webkit-transition:background-color 0.2s ease; transition:background-color 0.2s ease;}

.btn-primary:hover {color:#fff; background:#000 !important; border:0px solid #ffffff}

.btn-default {background:#999; border:0 solid #b2b2b2; text-transform:uppercase; color:#fff; line-height:1.25em; padding:6px 10px 6px; font-size:0.75em; margin-bottom:0.5em; border-radius:0px; -webkit-transition:background-color 0.2s ease; transition:background-color 0.2s ease;}
.btn-default:hover {color:#fff; background:#865121;}


/*--Menu--*/
.menu {}

.nav-link .mbr-iconfont {
  margin-right: 0.5rem;
}

.navbar {padding-top:40px; padding-right:0px; background-image: linear-gradient(to bottom, rgba(0,0,0,0.4), rgba(0,0,0,0.0));
}
@media (min-width: 768px) { .navbar {padding-top:30px; padding-right:30px; } }
@media (min-width: 992px) { .navbar {padding-top:50px; padding-right:40px; } }

.navbar-expand-md .navbar-collapse {justify-content:flex-end; align-items:flex-end !important; padding-right:0px; }
@media (min-width: 992px) { .navbar-expand-md .navbar-collapse {} }

/*--Links--*/
.menu ul.navbar-nav {justify-content:flex-end; align-items:flex-end !important; padding:20px 10px 20px 20px; background:rgba(0,0,0,0.5); }
@media (min-width: 768px) { .menu ul.navbar-nav {padding:0 20px 0 0; background:rgba(0,0,0,0.0); } }

.menu .navbar-nav li {line-height:1em; margin:0 !important; list-style:none !important; }
.menu .navbar-nav li a {margin:0 10px !important; padding:10px 10px !important; line-height:1em; font-size:1.1em; font-weight:500; -webkit-transition:transform 0.2s ease; transition:transform 0.2s ease; color:#fff !important; text-shadow:2px 2px 10px rgba(0,0,0,0.5);}
.menu .navbar-nav li a:hover {transform:scale(1.05);}
.menu .navbar-nav li.btn-contact {}
.menu .navbar-nav li.btn-contact a {background:#e87225; color:#fff !important; text-shadow:2px 2px 10px rgba(0,0,0,0);}
.menu .navbar-nav li.btn-contact a:hover {background:#fff; color:#e87225 !important; box-shadow:2px 2px 10px rgba(0,0,0,0.3);}


.navbar-collapse {
  -webkit-flex-basis: auto;
  -webkit-flex-grow: 1;
  -webkit-align-items: flex-end !important;
    flex-basis: auto;
    flex-grow:1;
    align-items:flex-end !important;
}

.navbar-dropdown {background:transparent;}

.nav-dropdown .link {}

.navbar-toggler,
.navbar-dark .navbar-toggler {border:2px solid #fff; border-color:rgba(255,255,255,1);}

.navbar-dark .navbar-toggler-icon {
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1' stroke-linecap='round' stroke-miterlimit='10' stroke-width='4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e);
}

.navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {flex-flow: column wrap; align-items:flex-end;}

@media (min-width: 992px) { .navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl  {flex-flow: row wrap; align-items:center;} }

/*--Sections--*/
section {display:block; width:100%; margin:0; padding:0;}

section.section-main {padding:50px 0; min-height:500px;}


/*--Home banner--*/
.home-banner {width:100%; height:950px; background:url(../images/home-banner.jpg) center top no-repeat; margin:0; padding:60px 2% 20px 2%; background-position:-1000px top; background-size:cover;}
@media (min-width: 480px) { .home-banner {background-position:-1000px top; background-size:cover; padding:60px 2% 20px 2%;} }
@media (min-width: 768px) { .home-banner {background-position:right top; background-size:cover; padding:100px 2% 20px 2%;} }
@media (min-width: 992px) { .home-banner {background-position:center top; background-size:cover; padding:150px 2% 20px 2%;} }
@media (min-width: 1200px) { .home-banner {background-position:center top; background-size:cover; padding:150px 2% 20px 2%;} }

.home-banner .dl-logo {padding:0 15px 20px 20px; text-align:right;}
.home-banner .dl-logo img {display:inline-block; float:right; width:100%; max-width:600px !important;}
.home-banner .dl-content {}

.home-banner .text-wrapper {display:block; margin-top:0px; padding:10px 0 10px 40px; border-left:1px solid #2d2d2c;}
@media (min-width: 768px) { .home-banner .text-wrapper {margin-top:50px;} }
@media (min-width: 992px) { .home-banner .text-wrapper {margin-top:50px;} }
@media (min-width: 1200px) { .home-banner .text-wrapper {margin-top:50px;} }
@media (min-width: 1600px) { .home-banner .text-wrapper {margin-top:50px;} }

.home-banner h1 {color:#2d2d2c;}
.home-banner p {color:#2d2d2c;}


/*--What we do--*/
section.what-we-do {width:100%; background:#fff; margin:0; padding:75px 2%; text-align:center;}

.what-we-do h1 {color:#e87324; text-align:center;}
.what-we-do p.lead {color:#232323; text-align:center; font-weight:300; font-size:2em;}
.what-we-do p.lead strong {font-weight:700;}


/*--Evolution--*/
section.evolution {width:100%; background:#232323; margin:0; padding:65px 2%; text-align:center;}

.evolution h1 {color:#fff; text-align:center;}
.evolution h3 {color:#fff; text-align:center; margin-bottom:0.3em; }
.evolution p {color:#fff; text-align:center; }

.numcontent {text-align:center; padding:20px; position:relative;}
.numicon {display:block; width:70px; height:70px; margin:0 auto 20px auto; padding:24px; border-radius:35px; color:#fff; background:#e87324; text-align:center; font-size:2.4em; font-weight:500;}

.numcontent:after {display:none; width:45px; height:29px; background:url(../images/arrow.svg) center top no-repeat; background-size:100% auto; position:absolute; right:-40px; top:50px; z-index:1000; content:'';}
@media (min-width: 768px) { .numcontent:after {right:-20px;} }
@media (min-width: 992px) { .numcontent:after {display:block; right:-30px;} }
@media (min-width: 1200px) { .numcontent:after {right:-40px;} }

.numcontent.last:after {display:none;}


/*--Evolution--*/
section.value-proposition {width:100%; background:#fff; margin:0; padding:65px 2%; text-align:center;}

.value-proposition h1 {color:#e87324; text-align:center;}
.value-proposition h3 {color:#2d2d2c; text-align:center; margin-bottom:0.3em; }
.value-proposition p {color:#2d2d2c; text-align:center; font-weight:500; }

.vp-content {text-align:center; padding:20px; border:none;}
 
img.vp-icon {display:block; width:135px; height:119px; margin:0 auto 20px auto; text-align:center; font-size:2em; }

/*--Evolution--*/
section.get-in-touch {width:100%; background:#e87324; margin:0; padding:50px 2%; text-align:center;}

.get-in-touch h2 {color:#fff; text-align:center; margin-bottom:0.6em;}
.get-in-touch p {text-align:center; color:#fff;}
.get-in-touch .btn-primary {display:block; width:170px; height:70px; border-radius:35px; padding:25px; color:#fff; background:#2d2d2c !important; text-align:center; font-weight:700; margin:0 auto 2.5em auto; font-size:1em; }
.get-in-touch .btn-primary:hover {background:#fff !important; color:#2d2d2c;}


/*--About banner--*/
section.page-banner {width:100%; height:220px; background-image: linear-gradient(to bottom, rgba(0,0,0,45), rgba(0,0,0,0.2)); margin:0; padding:50px 2% 20px 5%;}
@media (min-width: 992px) { section.page-banner {padding:70px 2% 20px 2%;} }

.page-banner h1 {margin:15px 0 0; color:#fff;}
@media (min-width: 992px) { .page-banner h1 {margin:50px 0 0;} }

.card-wrap {padding:10px 5px 10px 5px;margin:15px 0 0; color:#fff;}

/*--Social icons--*/
.soc-item {display:block; width:40px; height:40px; position:relative; background:url(../images/btn-linkedin.svg) center 2px no-repeat; background-size:28px; -webkit-transition:transform 0.2s ease; transition:transform 0.2s ease;  box-shadow:2px 2px 10px rgba(0,0,0,0.2);
    text-align: center;
    border-radius: 50%;
    margin-right: 0.6rem;
    margin-bottom: 1rem;
    padding: 0.5rem;
    border: 2px solid #e8711f;
}
.soc-item:hover {transform:scale(1.05); box-shadow:2px 2px 10px rgba(0,0,0,0.5);}
/*
.soc-item:before {display:block; width:40px; height:40px;
		font-family:'FontAwesome';
		font-size:1.2em;
		position: absolute;
		left:0px; top:6px;
		content:"\f054";  
		color:#e87324; 
} */

img.team {width:100%; max-width:350px; max-height:300px; border:2px solid #ccc; margin-bottom:20px;}

/*--Footer Menu--*/
ul.footer-menu {text-align:center; margin:15px auto 0 auto; }
ul.footer-menu li {list-style:none; display:inline-block; vertical-align:top; margin:0 10px 15px 0; padding:0 10px 0 0; border-right:1px solid white; color:#fff;}
ul.footer-menu li a {display:block; color:#fff; padding:0.5rem;}
ul.footer-menu li a:hover {color:#000;}
ul.footer-menu li:before {display:none;}
ul.footer-menu li:last-child {border:none;}
ul.footer-menu li span {display:block; color:#fff; padding:0.5rem; margin:0 10px 0 0;}