/* UTF-8 */
/* 2015 © Planet Wide City */
/* 2018 © Kirklands Business Solutions */
body {font-size: 14pt;color: #373735;} /* was 14px */

/* CG 2018 - removing, make more specific: 
blockquote { color:#1371b8; } ** dark blue, "compliance"
*/
.main-content-section h2, .main-content-section h3, .main-content-sectionn h4 {
	color:#009fe3;
} /* dark blue, "AML audit / quality review" */
blockquote { font-style: italic;}
blockquote footer { font-style: italic; } /* this usage as per HTML5(.1?) spec. */
blockquote footer cite { font-style: normal; font-weight: bold; } /* this usage as per HTML5(.1?) spec. */

/* Links */
a{color:inherit;}
a:hover{color:inherit;}
a.readmore{color:#009fe3;}
a.showlink{color:#009fe3; background-color: #FFFFFF; } /* Coloured link - default not */

/* Images */
.full-img{min-width:100%;}

/* Margins */
.top0 {margin-top: 0;}
.top10 {margin-top: 10px;}
.top15 {margin-top: 15px;}
.top20 {margin-top: 20px;}
.top30 {margin-top: 30px;}
.top40 {margin-top: 40px;}
.top50 {margin-top: 50px;}

.btm0 {margin-bottom: 0;}
.btm10 {margin-bottom: 10px;}
.btm15 {margin-bottom: 15px;}
.btm20 {margin-bottom: 20px;}
.btm30 {margin-bottom: 30px;}
.btm40 {margin-bottom: 40px;}
.btm50 {margin-bottom: 50px;}

/* Table for e.g. AML Academy / training */
/* Some space and a rule between items, heading cells top-aligned. */
table.aml-roles tr { border-bottom: 1px solid #ddd; }
table.aml-roles tr th { vertical-align: top; padding-left: 1em; }
table.aml-roles tr th, table.aml-roles tr td { padding-bottom: 10px; padding-top: 10px;}

/** Owl Carousel Theme for AML 
CG 2018 - changed since bootstrap update
.owl-theme .owl-controls{position:absolute;right:0;left:0;bottom:0;margin-top:0;}
.owl-pagination{position: relative;padding-top: 14px;padding-bottom: 8px;background:#000;opacity:0.25;}
.owl-theme .owl-controls .owl-page.active span{background-color: #fff;}

** Carousel **
#carousel{position:relative;}
.control{position: absolute;z-index: 1;top: 35%;padding: 3px;}
.control:hover{color: #757575;cursor:pointer;}
.control.prev{left:5%;}
.control.next{right:5%;}
.carousel-caption{color: #373735;font-weight: bold;font-size: 40px;left: 13%;padding: 20px;right: 48%;top: 0;text-align: left;}
**/

/** Navbar **/
/*
.navbar-default{border-radius: 0;border-bottom: 1px solid #1371b8;margin-bottom: 0;}
** CG 2018 remove: next*
.navbar-nav{text-transform: uppercase;}
** CG 2018 remove: next*
.navbar-brand{background: url('/images/aml_logo.png') no-repeat;padding: 42px 160px;margin: 5px 0;}

.dropdown-menu{border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
@media (min-width: 768px) {
    .navbar-nav > li > a {padding-top: 8px;padding-bottom: 8px;}
}
** CG 2018 remove: next*
@media (max-width: 767px){
    .navbar-brand{background-size:contain;background-position: center;width:100%;padding:0 15px;margin-bottom: 15px;}
    #carousel{display: none;}
}
.navbar-bottom > .navbar-nav > li > a,.dropdown-menu > li > a{font-weight: bold;letter-spacing: -1px;background:none;}
.dropdown-menu > li > a{color: #777;}
.navbar-top{margin:10px 0;height: 32px;}
.navbar-top li{float:left;margin-right: 10px;}
.navbar-icon{background-color:#555;color:#fff;height:30px;width:30px;text-align:center;padding:0!important;margin-bottom: 10px;display: none!important;}
@media (min-width: 768px){.navbar-inner{float:right;}.navbar-icon{margin-bottom: 0;}}
.navbar-icon > i{line-height:29px;padding:0 2px;font-size:22px;}
.navbar-icon > span{display: none;font-size: 16px;vertical-align: text-bottom;padding-right:10px;}
.navbar-icon > input{display: none;width:auto;position: relative;top: -4px;margin-right:2px;border-radius: 0;}
.navbar-icon.social{background-color:#777;}
#nav-search{width:100%;margin-bottom: 15px;}
@media (min-width: 768px){#nav-search{max-width:215px;margin-bottom: 0;}.navbar-icon{display: block!important;}}
*/
/* CG Required as this would normally require navbar-light as ancestor */
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
/** Generic sections **/
.content-section > .container{padding-bottom: 15px;padding-top: 15px;}
.content-section:not(.no-border) > .container{border-bottom: 1px solid #777;}

/** Generic section with offset 2 **/
.sidebar h3{text-transform: uppercase;margin-top: 0;}
.sidebar .more-arrows{font-size:17px;color:#009fe3;padding-left: 6px;}

/** Sidebar footer **/
.sidebar-footer{margin-bottom: 30px;padding:35px 18px 15px;word-spacing: -1px;color:#fff;background: #c6c6c6;}
.sidebar-footer h4{font-size: 14px;text-transform: uppercase;font-weight: bold;}
.sidebar-footer h4.title{color:#373735;}

/** Homepage AML Products **/
.product{display:block;margin-bottom: 30px;padding:50px 25px 15px;word-spacing: -1px;color:#fff;background: #c6c6c6;}
.product h4,a:hover.product{color: #fff;}
.sidebar .product{padding: 35px 18px 15px;}
@media (min-width: 768px){.product{min-height: 200px;margin-bottom: 15px;}.sidebar .product{min-height: 165px;}}
.product h4{font-weight: bold;text-transform: uppercase;}
.product.compliance{background: #012B7F; /* Was #1371b8, then #0069b3 */}
.product.bespoke{background:#599205; /* #3ba936;*/}
.product.academy{background:#e84e1c;}
.product.audit{background:#009fe3;}
.product.inactive{opacity:0.5;}

/** Homepage Next steps **/
.next-step{background:#c6c6c6;padding:15px;margin-bottom: 15px;color:#fff; min-height: 150px;/*max-height: 150px;*/}
.next-step h4{font-weight: bold;word-spacing: -1px;}
.next-step h4.title{color:#373735;}

/** left / right panels **/
.panel-left-side .panel-right-side { width: 50%; }
.panel-left-side { float:left; }
.panel-right-side { float:right; }
.panel-left-right-content:after { clear:both; }

/** AML Pillars */
/* .aml-pillar  (if using float / clearfix) */
.aml-pillar-video { width: 320px; display: inline-block; margin-right: 1em; vertical-align: top; }
.aml-pillar-text { width: 550px; display: inline-block; vertical-align: top; }

/** Re-styling Bootstrap tabs **/
/* active: .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover */
.nav-tabs > li > a {
color: #555;
background-color: #fff;
border: 1px solid #ddd;
}

/* Restyling Bootstrap non-selected tabs */
nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: #eee;
    border: 1px solid #ddd;
}
/* Restyling Bootstrap selected tabs */
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border: 1px solid #ddd;
    color: #fff;
    cursor: default;
    background-color: #009fe3;
}
/** Re-styling Bootstrap collapse item headings **/
div.panel-heading h3.panel-title { font-size: 16pt; font-weight: bold;}

/** Patch to add expand / collapse to left / right to Bootstrap - transition **/
.collapse.width {
    height: auto;
    -webkit-transition: width 0.35s ease;
    -moz-transition: width 0.35s ease;
    -o-transition: width 0.35s ease;
    transition: width 0.35s ease;
}

/* Modal popups */
/* Outer */
.popup {
    width:100%;
    height:100%;
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    background:rgba(0,0,0,0.75);
}
 
/* Inner */
.popup-inner {
    max-width:700px;
    width:90%;
    padding:20px;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    box-shadow:0px 2px 6px rgba(0,0,0,1);
    border-radius:3px;
    background:#fff;
}
 
/* Close Button */
.popup-close {
    width:30px;
    height:30px;
    padding-top:4px;
    display:inline-block;
    position:absolute;
    top:0px;
    right:0px;
    transition:ease 0.25s all;
    -webkit-transform:translate(50%, -50%);
    transform:translate(50%, -50%);
    border-radius:1000px;
    background:rgba(0,0,0,0.8);
    font-family:Arial, Sans-Serif;
    font-size:20px;
    text-align:center;
    line-height:100%;
    color:#fff;
}
 
.popup-close:hover {
    -webkit-transform:translate(50%, -50%) rotate(180deg);
    transform:translate(50%, -50%) rotate(180deg);
    background:rgba(0,0,0,1);
    text-decoration:none;
}


/**************************************/
/**     Event / conference styles    **/
/**************************************/
.purchasehighlight {text-align:right; /* when available add: color:#009fe3; background-color: #FFFFFF; */}
.sessionNote {font-weight: bold; }
.sessionTimes { text-align: center; }
.sessionTitle { font-weight: bold; }
.sessionSpeaker { font-style: italic; }
table.programme { border: 1px solid black; }
.programme th, .programme td { border: 1px solid black; padding: 0.5em; }
/* The following will start centring again if we use more than two columns.
*  One solution is to build a big list of alignment classes and alignments:
* e.g. .tr1 td:nth-child(1), .tr1 th:nth-child(1),
.tr2 td:nth-child(2), .tr2 th:nth-child(2) { text-align:right }
* ...then just set these classes on the table e.g. <table class="tr2 tc3">
*/
.programme td {vertical-align: top; text-align: center; }
.programme th {vertical-align: top; text-align: center; }
.programme td + th {vertical-align: center; text-align: left; }
.programme td + td {vertical-align: center; text-align: left; }

/** Biographies */
.biogImageBlock { float:left; }
.biogImage { margin-right:0.5em; }
.biogText { width: 80%;}
.biogLogoBlock {float:left;  margin-right:0.5em;}
.biogOrgText { width: 80%;}

/** Footer **/
.footer{
	margin-top:30px;color:#fff;background:url('/images/grey.png');background-size: cover;
/* CG 2018 was 50px*/
padding-bottom: 20px;padding-top:15px;
}
abbr[title], abbr[data-original-title]{border-color: #ffffff;}
.form-control-feedback{top:0;color:#555;}

/** General Page Title **/
.page-title{background-color:#ccc;padding:10px;font-size:17px;}

/** Contact Page **/
.maps-frame{width: 100%;max-width:100%;padding:20px;background:#c6c6c6;border:none;height:500px;}

/*********************************/
/** Conference / Events / Flier **/
/*********************************/
/* AML @ Botanics 2017           */

/** Botanics navbar **/
/* .navbar-vertical-expand .navbar-toggle { border: 1px solid black; color: lightgray; background-color: transparent; } */
.navbar-brand-aml-botanics{background: url('/images/aml_at_botanics_logo.png') no-repeat;padding: 42px 160px;margin: 5px 0; display: block;}
.navbar-vertical-expand div.container { width:initial; }
@media (min-width: 768px) {
	.navbar-vertical-expand .navbar-nav {
		float: none;
	}
	.navbar-vertical-expand .navbar-inner { float: none; }
	.navbar-vertical-expand .navbar-nav > li { float: none; }
}

body.amlbotanics {
	background-color: #fff;
	color: #042D7A;
	color: rgba(4, 45, 122, 1);
	font: 14pt Helvetica Neue, roboto, arial, sans-serif;
}
/* background blue: 1C73B6 (28, 115, 182), text blue 042D7A (4, 45, 122) */
.amlbotanics .main p, .main h1, .main h2, .main h3, .main h4, .main ul, .main ol, .main dl, .main table { text-align: center; }
.amlbotanics .firstline {
	margin-top:0px;
	padding-top:0px;
}
.amlbotanics .lastline {
	margin-bottom:0px;
	/*padding-bottom:0px;*/
}
.amlbotanics .main dt { font-weight: bold; }
.amlbotanics .main dd { padding-bottom: 8pt; }

.amlbotanics div.main {
	width: 100%; /* responsive image */
    max-width: 800px;
    margin-left: auto;
	margin-right: auto;
}
.amlbotanics div.glasshouseBackdrop {
	background-image: url("/site-login/resources/inviteTop800px.png"); /* 800 x 681 aspect y:x 85.13% */
	background-repeat: no-repeat;
    background-color: #fff;
    background-position: center top;
    background-size: 100%; /* can do this since we've max-sized main*/
}
/* Will move this after first text reflow (see later) */
.amlbotanics #reserveStart {
	width: 100%;
    padding-bottom: 52.5%;
    position: relative;
}

.amlbotanics div.opaquemask
{
    background: rgba(255, 255, 255, 0.7);
    /*opacity: .7;*/
    padding: 10px;
}

.amlbotanics .blockcenter {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 0px;
	margin-bottom: 0px;
	padding-top: 0px;
	margin-top: 0px;
}
.amlbotanics div.opaquemask h1 {
	color: rgba(0, 0, 150, 1);
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}
.amlbotanics #spaceIntro {
	width: 100%;
    padding-bottom: 10%;
    position: relative;
}
/* Just before first text reflow, allow the margins to shrink */
@media only screen and (max-width: 755px) {
	.amlbotanics div.opaquemask h1 {
		width:90%;
	}
}
.amlbotanics div.introText {
	width: 80%;
}
.amlbotanics div.bluepage {
	background:#1C73B6;
	/*background: rgb(28, 115, 182);*/
	color: #fff
}
.amlbotanics div.blueimg img { border: lightblue solid 5px; }
.amlbotanics div.flashTop {
	background-image: url("/site-login/resources/inviteToBookTop800px.png"); /* 800 x 53 */
	background-repeat: no-repeat;
    background-color: #fff;
    background-position: center top;
    /* width: 100%; - not using as looks better if we don't rescale*/
}
.amlbotanics div.flashTopReserve {
	width: 100%;
    padding-bottom: 4.38%; /* 35px / 800 */
    position: relative;
}
.amlbotanics .fi-left { width:30%; }
.amlbotanics .fi-middle { width:25%; }
.amlbotanics .main ul {
	list-style: none;
}
/*
a { text-decoration: none; }
*/


/*  SECTIONS  (e.g. botanics) */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.sec-col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.sec-col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}

/*  GRID OF THREE  */
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	width: 66.1%;
}
.span_1_of_3 {
	width: 32.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.sec-col { margin: 1% 0 1% 0%;}
	.span_3_of_3, .span_2_of_3, .span_1_of_3, .fi-right { width: 100%; }
}

/* Latest styles / overrides */
.background-medblue {  background: #0069b3; }
.background-darkblue { background: #012B7F; /* #1371b8; */ }
.background-darkgreen { background: #599205; /* #009E16; */ }
.background-lightblue { background: #009fe3; }
.background-lightblue-kbs { background: #68A9FD; }
.background-lightgreen { background: #97C11F; /*#3BA936;*/ }
.background-redorange { background: #e84d1a; }
.background-white { background: #FFFFFF; }
.background-medgrey {  background: #C0C0C0; }
.background-black { background: #000000; }
.background-compliance{background: #012B7F; /* Was #0069b3 */ }
.background-bespoke{background:#599205;}
.background-academy{background:#e84d1a;}
.background-audit{background:#009fe3;}
.background-inactive{opacity:0.5;}
/* Experimental opaque background styles */
.background-medblue-op-7 { background-color: rgba(0, 105, 179, 0.7); }
.background-darkblue-op-7 { background-color: rgba(1, 43, 127, 0.7); }
.background-darkgreen-op-7 { background-color: rgba(89, 146, 5, 0.7); }
.background-lightblue-op-7 { background-color: rgba(0, 159, 227, 0.7); }

.background-lightgreen-op-7 { background-color: rgba(151, 193, 31, 0.7); }
.background-redorange-op-7 { background-color: rgba(232, 77, 26, 0.7); }
.background-white-op-7 { background-color: rgba(255, 255, 255, 0.7); }
.background-medgrey-op-7 {  background-color: rgba(192, 192, 192, 0.7); }
.background-black-op-7 { background-color: rgba(0, 0, 0, 0.7); }
.opacity-7 { opacity: .7;}
/* Foreground */
.colour-medblue {  color: #0069b3; }
.colour-lightblue { color: #009fe3; }
.colour-darkblue { color:  #012B7F; /* #1371b8; */ }
.colour-darkgreen { color:  #599205; /* #009E16; */ }
.colour-lightgreen { color: #97C11F; /*#3BA936;*/ }
.colour-lightblue-kbs { color: #68A9FD; }
.colour-redorange { color: #e84d1a; }
.colour-white { color: #ffffff; }
.colour-medgrey { color: #C0C0C0; }
.colour-black { color: #000000; }
.colour-compliance{color: #012B7F; /* Was #0069b3 */ }
.colour-bespoke{color: #599205;}
.colour-academy{color: #e84d1a;}
.colour-audit{color: #009fe3;}
.colour-inactive{opacity:0.5;}

/* Set squares so that they have appropriate max value (and reflow) at bootstrap xs, s, md, lg, xl sizes - take max size from the size _above_ */
.squareblock2 {
	box-sizing: border-box; width: 100%; max-width: 540px; padding: 25px;
}
/* To two columns at m - 768px */
/*@media (min-width: 576px) { .squareblock2 { box-sizing: border-box; width: 100%; max-width: 340px; padding: 15px; } }*/
@media (min-width: 768px) { .squareblock2 { box-sizing: border-box; width: 100%; max-width: 440px; padding: 20px; } }
@media (min-width: 992px) { .squareblock2 { box-sizing: border-box; width: 100%; max-width: 580px; padding: 30px; } }
@media (min-width: 1200px) { .squareblock2 { box-sizing: border-box; width: 100%; max-width: 700px; padding: 35px; }  }
/** Homepage AML Products - altered so this is now wrapped in coloured square **/
.product-square {color:#fff;background: #c6c6c6; width: 100%;}
.product {display:block; margin-bottom: 30px;padding:50px 25px 15px;word-spacing: -1px;}
.product h4,a:hover.product{color: #fff;}
@media (min-width: 768px){.product{min-height: 200px;margin-bottom: 15px;}.sidebar .product{min-height: 165px;}}
.product h4{font-weight: bold;text-transform: uppercase;}
.product-square.compliance{background: #012B7F; /* Was #0069b3 */ }
.product-square.bespoke{background:#599205;}
.product-square.academy{background:#e84d1a;}
.product-square.audit{background:#009fe3;}
.product-square.inactive{opacity:0.5;}

/* Override bootstrap padding to space social media icons more closely at full navbar */
/* was ul.socialmedia li { padding-left: 6px; padding-right: 6px; list-style: none; } * also added list-style: none always* */
.socialmedia .social { padding-left: 0.2rem; padding-right: 0.2rem;}

@media (min-width: 970px) {
  .socialmedia .social { padding-left: 0.5rem; padding-right: 0.5rem; }

  /* ul.socialmedia li { padding-left: 5%; padding-right: 5%; } -- doesn't matter whether we use % or rem, size won't change */
}
/*@media (max-width: 767px) {
  .socialmedia { display: none; }
  * ul.socialmedia li { padding-left: 5%; padding-right: 5%; } -- doesn't matter whether we use % or rem, size won't change *
}
*/
/* use CSS variables to colour social media on xs / sm sizes*/
/* can't use css variables with media queries e.g. not var(--breakpoint-md, 576px) */
/* Was: @media (max-width: 991.98px) - changed to match navbar switch point 766px (ish) */
/*@media (max-width: 767px) {
  .socialmedia-mobile { background: #0069b3; padding: 0px;
  }
  * ul.socialmedia li { padding-left: 5%; padding-right: 5%; } -- doesn't matter whether we use % or rem, size won't change *
}
*/
.socialmedia-mobile { background: #009fe3; padding: 0px; }
/*
@media (min-width: 767.9px) {
  .socialmedia-mobile { display: none;
  }
  * ul.socialmedia li { padding-left: 5%; padding-right: 5%; } -- doesn't matter whether we use % or rem, size won't change *
}
*/
/* centred within blocks for mobile */
.socialmedia-mobile .diy-col {
	text-align: center;
	/* copy bootstrap col */
	position: relative;
	width: 100%;
	min-height: 1px;
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
	box-sizing: border-box;
}
/* hack - pad the nav bar items a bit*/
.nav-item, .nav-link {
	padding-left: 1rem;
	padding-right: 1rem;
}
/* make the main bit of navbar wider to counteract the flex region next to it.*/
.navbar-collapse { width: 60%; }
/*@media (min-width: 576px) {
	* override container-fluid to make these appear to left*
	.social { width: 25% !important; }
}*/

/* Large quotes before / after */
blockquote.largequotes {
    position: relative;
    /*font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";*/
    /* background: #ddd; */
}

blockquote.largequotes:before {
  position: absolute;
  content: '“';
  content: open-quote;
  font-family: Arial, Georgia, serif;
  font-style: normal;
  font-size: 4em;
  margin-left: -0.6em;
  margin-top: -0.4em;
}
blockquote.largequotes:after {
  position: absolute;
  content: '”';
  content: close-quote;
  font-size: 4em;
  font-family: Arial, Georgia, serif;
  font-style: normal;
  bottom: 0;
  right: 0;
  margin-right: -0.6em;
  margin-bottom: -0.8em;
}
blockquote.largequotes p {
  display: inline;
}

.testimonial footer {
	margin-top: 2ex;
}


/* new layout style - indented fullwidth block */
.fullwidth-indent { margin-left:2em; margin-right:2em; }

@media (max-width: 480px) { .fullwidth-indent { margin-left:1em; margin-right:1em; } }
@media (min-width: 576px) { .fullwidth-indent { margin-left:2em; margin-right:2em; } }
@media (min-width: 768px) { .fullwidth-indent { margin-left:4em; margin-right:4em; } }
@media (min-width: 992px) { .fullwidth-indent { margin-left:6em; margin-right:6em; } }
@media (min-width: 1200px) { .fullwidth-indent { margin-left:9em; margin-right:9em; }  }