@charset "utf-8";
/* CSS Document */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css');
body { font-family: 'Georgia Regular'; font-size:20px; margin:0; padding:0; line-height:1.2; font-weight:400; color:#000; background:#fff; }
/*Basic Styles*/
select:focus { box-shadow:none !important;}
ul { margin:0; padding:0;}
li { line-height:30px; list-style:none; list-style-position:inside;}
iframe, embed, object { width:100%; display:block;}
textarea { resize:vertical;}
p {font-family: 'Georgia Regular'; font-size: 20px; font-weight:400; line-height:1.2;}
.text-black { color:#000;}
.text-black a{ color:#000;}
.text-light a{ color:#fff;}
.text-light { color:#fff !important;}
.bg-black { background:#000; color:#fff;}
.text-black { color:#000;}
.text-dark {color:#373737 !important;}
*:hover { text-decoration:none !important;}
.bg-light { background-color:#e9e9e9 !important;}
.bg-grey { background-color:#999 !important;}
h1, h2, h3, h4, h5, h6 {font-family: 'Georgia Regular'; text-transform:none; line-height:normal;}
h1 { font-size:60px;}
h2 { font-size:60px; color:#181e58}
h3 { font-size:48px;}
h4 { font-size:36px;}
h5 { font-size:30px; line-height:1.6}
.bg-primary { background-color:#181e58 !important;}
.text-primary { color:#181e58 !important;}
.btn-primary { background:#181e58 !important; }
.btn-link { background:url(../images/link-arrow.jpg) no-repeat right; color: #181e58 !important; display:inline-block; padding-right:45px; line-height:32px}
.btn-primary:hover {background:#00376d !important;}
.btn { white-space: nowrap; cursor:pointer; letter-spacing:0;border-radius:0; color:#fff !important; padding:20px 40px;font-family: 'Georgia Regular' !important; font-size:14px;  border:none;}
input:focus, input:active { box-shadow:none !important;}
textarea:focus, textarea:active { box-shadow:none !important;}
.container-fluid {max-width:1860px;}
/* =================================  website Css ================================= */
/****************************************************************************/
/* MENU */
.sidenav { height: 100%; width:0px; position: fixed; z-index: 50; top: 0; right: 0px; background-color: #181e58; overflow-x: hidden; transition: 0.5s; padding-top: 60px; z-index:99999}
.side-nav img { cursor:pointer !important; max-width:100%;}
.sidenav a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; color: #fff; display: block; transition: 0.3s; white-space:nowrap}
.sidenav a:hover { color: #f1f1f1;}
.sidenav .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px;}
.sidenav .fa-envelope,.sidenav .fa-linkedin { color: #181e58 !important; display:inline-block !important; font-size:20px; margin-top:15px !important; border-radius: 32px; background: #fff; height: 40px; padding:10px 0px 0px 0px !important; text-align:center; width: 40px;}
.sidenav .fa-envelope { margin-left:32px;}
.welcome, .services, #home-sectors { background:#fff}
.welcome p:last-child { margin-bottom:0px}
.welcome strong { font-size:105%;}
.welcome > div div { width:65%;}
/* --------------------------------- Header CSS ------------------------------*/
.header{ background:#fff}

@media (max-width: 992px){ 
.welcome > div div { width:100%; }
}

@media screen and (max-height: 450px) { .sidenav {padding-top: 15px;} .sidenav a {font-size: 18px;}}
/* End MENU */
/********** Back To Top Button ***************************************************************************************************/
#scroll {background:rgba(0, 0, 0, 0.35); position:fixed; right:10px; bottom:10px; z-index:99999; cursor:pointer; width:50px; height:50px; text-indent:-9999px; display:none; webkit-border-radius:60px; -moz-border-radius:60px; border-radius:60px}
#scroll span {position:absolute; top:50%; left:50%; margin-left:-8px; margin-top:-12px; height:0; width:0; border:8px solid transparent; border-bottom-color:#ffffff;}
#scroll:hover {background-color:#000; opacity:1;filter:"alpha(opacity=100)"; -ms-filter:"alpha(opacity=100)";}

/* --------------------------------- body CSS ------------------------------*/
.carousel-caption { z-index:0; bottom:0; padding-bottom:0;}
.services h2 { font-size:18px; }
.square-box { padding-bottom: 100%; position: relative; overflow: hidden; }
.services .row .square-box > div {position: absolute !important; top: 50%; left: 50%; transform: translate(-50%,-50%); width:100%}

.services .row .square-box .icon-image img { height:90px !important; width:auto !important}
.service-list .service-icon { display: flex; justify-content: center; align-items: center; height:150px; width:150px;}
.service-list .service-icon img { height: 75px !important; width: auto !important;  vertical-align: middle;}

.icon-txt { padding:120px 0;}
.action-btn { position:absolute; right:0px; bottom:0px; z-index:2;}
.sectors .img-wrap {background:url(../images/hd-bg.png) repeat-x bottom center; width:100%; height:100%; z-index:999 }
.sectors h3 { position:absolute; left:45px; bottom:20px; right:30px; z-index:2; font-size:42px; text-align:right }

.projects .row > div { position:relative; overflow:hidden}
.projects .row > div p { background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);position:absolute; left:00px; right:00px; bottom:00px; text-shadow:10px 10px 10px rgba(0,0,0,0.4); padding:30px 38px 30px 37px; margin:0; z-index:999; position:absolute; bottom:0px; left:4px; right:4px; text-align:right; font-size:38px;transition-duration:0.5s; transition-timing-function: linear;}
/* --------------------------------- projects hover
.projects .row > div img:hover + p, .projects .row > div img + p:hover{ padding:30px 38px 50px 37px; }
.sectors .projects .row > div img:hover + p, .sectors .projects .row > div img + p:hover{ padding:30px 38px 30px 37px; }
 ------------------------------*/

.contact-details a{ border-radius:32px; background:#fff; height:40px; padding-top:10px; width:40px;}
.list {list-style-type: disc; margin:0px 20px;}
.cms .carousel-inner { height:400px}
.cms .carousel-inner .title { background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); position:absolute; left:00px; right:00px; bottom:00px; z-index:999;width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}

.cms .carousel-inner .title { background:none}
/*****************
.cms .carousel-inner .title { background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); position:absolute; left:00px; right:00px; bottom:00px; z-index:999;width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}
**************/
.cms .carousel-inner .title h1 { font-family: 'Georgia Regular'; font-weight:400; max-width:1860px; width: 100%; padding:15px 0px 10px 0px; margin:auto}

.contact-form form .form-group .form-control { padding:25px 15px}
.contact-form form .textarea-Message .form-control { height:96px}
.contact-form form .form-group .btn-link { color:#181e58 !important; font-size:20px; padding:0px 50px 0px; margin-top:15px !important;}

.title-link, .title-link:hover { color:#181e58 !important;}

/* --------------------------------- Footer CSS ------------------------------*/
footer li { display:inline-block; }
footer li a { font-size:18px; color:#19335e;}

.footer .nav-link { font-weight:700; padding:0 1rem!important; line-height:1}
.footer .nav-item:first-child .nav-link { padding-left:0 !important}
.copyright { font-size:16px; color:#19335e;}

.zonec .zone-header h3 { margin-top:25px;}

@media (min-width: 1850px) {.cms .carousel-inner .title h1 { font-family: 'Georgia Regular'; font-weight:400; max-width:1860px; width: 100%; padding:15px 0px 10px 15px; margin:auto}}
@media (min-width: 1200px) {	
.dropdown:hover .dropdown-menu {display: block;}
}
@media (max-width: 1199.98px) {	
h1 { font-size: 54px;}
	}
@media (min-width: 768px) and (max-width: 1279.98px) {.service-list .details p { font-size:0.95rem} }
@media (min-width: 992px) and (max-width: 1199.98px) {}
@media (min-width: 768px) and (max-width: 991.98px) {}
@media (max-width: 991.98px) {
.navbar-light .navbar-nav .nav-link	{ margin-bottom:5px; color:#000; display:block;  text-align:center;}
.navbar-light .navbar-nav .nav-link	{padding-left: 15px !important; padding-top: 10px; padding-bottom: 10px;background: #f5f5f5;}
.navbar-nav { background:#fff; padding:20px; margin-top:15px !important;}
.navbar { background:transparent!important;}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:active {color: #fff; background:#1ea8aa;}
.navbar-light .navbar-nav li.active .nav-link { color: #fff; background:#1ea8aa;}
.container { max-width:100%;}
.navbar-light .navbar-nav .nav-item:not(:last-child) { margin-right:0;}
}
@media (max-width: 768px) {
.navbar-light .navbar-nav .dropdown-toggle[aria-expanded="false"]:after {content: "\f107";color: #d93100; position: absolute; right: 15px; font-size: 20px;font-family: 'FontAwesome'; display: block; top:15px;}
.navbar-light .navbar-nav .dropdown-toggle[aria-expanded="true"]:after { content: "\f106";color: #d93100; position: absolute; right: 15px; font-size: 20px;font-family: 'FontAwesome'; display: block; top:15px;}
.dropdown-item {padding: 17px 25px; font-size:11px;}
.sectors h3 {font-size:30px;}
.projects .row > div p { padding:15px; bottom:0px; left:0px; right:4px; font-size:28px;}
.cms .carousel-inner h1 { bottom:0px;  padding:15px; margin:0; z-index:999}
.footer .nav-item:first-child .nav-link { padding-left:1rem !important}
}
@media (max-width: 767px) {	
.logo { width:280px !important;}
.carousel-caption { position:relative; left:0; background:#000; top:0; bottom:0; transform:translateY(0); padding:50px 0;}
.zone-acc { float:none}
.zone-header {margin-bottom:2px;}
.h-block-content { padding:0px}
.zone-acc .zone-header h3 { margin-top:0px !important;}
}

.block-text {  position:absolute; top:0px; left:0px; bottom:0px; right:0px; display:none; line-height:1.7;  -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; -o-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; z-index:1 }
.action-btn:hover + .block-text { background:#181e58; padding:15px 20px; color:#fff; font-size:20px; width:100%; height:100%; display:block; top:0px; bottom:0px; left:0px; right:0px; -webkit-transition:color .2s ease-in;}
.height-80vh { height:80vh;}

.home-Banner .container-fluid {position:relative; height:650px}
aside { position: absolute; top: 0; right: 15px; bottom:0;  background: none; transform: rotate(90deg); width:650px;}
aside h3{ margin-bottom:0; padding-left:30px; text-align:left;font-size:48px; z-index:20;letter-spacing:1px; line-height:2; text-transform:lowercase; border-bottom:2px solid #fff; position:relative; z-index:9999 }
aside h3.town{background-color: background: rgb(24,30,88); background: linear-gradient(90deg, rgba(24,30,88,1) 0%, rgba(24,30,88,0) 100%);}
aside h3.retail{ background-color: background: rgb(24,30,88); background: linear-gradient(90deg, rgba(24,30,88,1) 0%, rgba(24,30,88,0) 100%);}
aside h3.repurpose{background-color: background: rgb(24,30,88); background: linear-gradient(90deg, rgba(24,30,88,1) 0%, rgba(24,30,88,0) 100%);}

.top-banner { background:url('http://kashyap74.dev.wcukdev.co.uk/cpw-planning/website/wp-content/uploads/2020/08/main-bnr.jpg') no-repeat; background-size:cover}
.top-banner img { max-height:100%}

.our-clients{ font-size:18px;}
.our-clients .carousel-inner .carousel-item > div { margin-bottom:10px;}
.carousel-inner .carousel-item { line-height:1}
.carousel-inner .carousel-item > ul > li { margin:0px 80px 0 0}
.carousel-control-prev-icon { background: url(../images/clients-lf-arrow.png) no-repeat;}
.carousel-control-next-icon { background: url(../images/clients-rt-arrow.png) no-repeat;}
.carousel-control-next-icon, .carousel-control-prev-icon { display: inline-block; width: 32px; height: 32px;}
.carousel-control-next, .carousel-control-prev { opacity:1 !important; width:auto !important; border:1px solid red }
.carousel-indicators li { background-color: #181e58;}


/************
@media (max-width: 1899.98px) {	
	.our-clients .row > div { width:100% !important; flex: 0 0 100% !important; max-width: 100% !important;}
	.our-clients .carousel-inner .carousel-item .list-inline .list-inline-item { float:none !important; text-align:left; width:100% !important}
	.our-clients .title { margin-bottom:15px;}
}

*****/
@media (max-width: 1366px) {	
	.carousel-inner .carousel-item > ul > li, .carousel-inner .carousel-item.active > ul > li { float:left; margin: 0px; line-height:2; width:50%;}
	.carousel-inner .carousel-item > ul > li * { vertical-align:middle }
	.carousel-control-next { display:none}
}

@media (max-width: 1279.98px) {	
.cms .carousel-inner { height:auto}
}

@media (min-width: 1279.98px) and (max-width: 1599.98px){ 
.action-btn:hover + .block-text { padding:20px; font-size:16px; line-height:1.4 }
}

@media (max-width: 1279px){ 
.action-btn:hover + .block-text { font-size:15px; line-height:1.5 }
}

@media (min-width: 1199.98px) {	
.footer .carousel .carousel-inner { display:block; }
}


@media (max-width:1024px){ 
	.home-Banner {background: url("../images/main-bnr-md.jpg") no-repeat top center; background-attachment:fixed; -webkit-background-attachment:fixed; -moz-background-attachment:fixed;
	-o-background-attachment:fixed; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; height:250px !important; overflow:visible}
	.home-Banner .container-fluid {position:relative; height:250px}
	.home-Banner aside {width:250px;}
	.home-Banner aside h3 { font-size:24px;}

}

@media (max-width:767.98px){ 
	.carousel-inner .carousel-item > ul > li, .carousel-inner .carousel-item.active > ul > li { display:block; float:none; margin: 0px; line-height:2; width:100%;}
}

@media (max-width: 575.98px){ 
	h1 { font-size:42px;}
	.logo { width:240px !important;}
	#menu-top-menu li { display: block; margin-bottom: 15px; }
}
.contact-image { position:relative;}
.contact-image p { margin:0}
.contact-image .details { color:#fff; position:absolute; text-align:right; font-size: 1rem; bottom:20px; left:0px; right:30px; line-height:30px; z-index:9999}
.contact-image .details *{ color:#fff !important;}

@media (max-width: 812px){ 
.contact-image .details { font-size: 0.8rem !important; right:20px; }
}

/* --------------------------------- 16 Oct 2020 ------------------------------*/

.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
-webkit-transform: translate3d(0, 0, 0)!important;
        transform: translate3d(0, 0, 0)!important;
 }
 .carousel-item-next,
 .active.carousel-item-right {
   -webkit-transform: translate3d(-100%, 0, 0)!important;
        transform: translate3d(-100%, 0, 0)!important;
 }
 .carousel-item-prev,
 .active.carousel-item-left {
 -webkit-transform: translate3d(100%, 0, 0)!important;
        transform: translate3d(100%, 0, 0)!important;
 }