/**
 * Place your custom styles here.
 
 colours - 	Primary colour #c0c0c0 c0c0c0
			White = #FFFFFF
 */

 /*Make whole page Flex Column*/
 .html {display:flex; flex-direction:column;}
 
 /*move whole page down from sticky header*/
/*.row {margin-top: 2%;}*/
.navbar  {background-color:#c0c0c0 !important; /*opacity:0.8;*/ background-image: none; border: 0px;
}
.navbar-default .navbar-nav > li > a {color:#000000; padding-top: 19.5px; text-decoration:none; font-size:20px;}


/*MENU CHANGES*/

.navbar-default .navbar-nav > li > a:hover {background-color: #000000; color:#FFFFFF}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {background-color: #FFFFFF; color:#000000 !important;}


body {background-color:#FFFFFF; color:#000000;}
.well {background-color:#c0c0c0;}
.region-footer {background-color:#c0c0c0; padding:10px; /* border: 2px solid #c0c0c0; border-radius: 15px;*/ box-shadow: 5px 5px 15px #c0c0c0; }
.footer {border-top:0px; margin-top:20px !important;}

/*----------------------START CALL TO ACTION AREA-----------------*/


.region-custom-region, .region-custom-regiona, .region-custom-regionb  {text-align:left; background-color:#c0c0c0; min-height:360px; margin-top:50px; padding:0px 20px 20px 20px!important; box-shadow: 5px 5px 15px #c0c0c0; 
}
/*.region-custom-regiona li {text-align:left; padding-left:20px; list-style-position: inside;}*/
.region-custom-regionb img {max-width:75%;}

.region-banner {margin-bottom:10px;}
.region-banner img {width:100%;}
.dialog-off-canvas-main-canvas {margin-top:175px;}

.region-content {background-color:#e6e6e6; padding:10px;  /*border: 2px solid #c0c0c0; border-radius: 15px;*/ box-shadow: 5px 5px 15px #c0c0c0; margin-top: 30px;
}

.path-frontpage .region-content {margin-top:0px !important; padding-bottom: 25px;}


.blocktick {content:url(/sites/default/files/pictures/bfs-tick3.png); position: absolute; top:50px; left: 50%; transform: translate(-50%, -50%);}

p.button1 {margin:30px 0px 30px 0px;     position:absolute;                  
                bottom:0;                          
              left: 50%; 
    min-width: 200px;
    margin-left: -100px;
    }

	
.button1 {text-align:center !important; bottom:0px;}
.button1 a {background: rgba(0, 0, 0, 0.3); color:#FFFFFF;  /*border-left:5px solid #FFFFFF; border-right:5px solid #FFFFFF;*/  box-shadow: 5px 5px 15px #c0c0c0; padding:10px;}

.button1 a:hover {background-color:#000000;}

.user-logged-in .blocktick {top:0px;}

.user-logged-in p.button1 {margin:30px 0px 30px 0px;     position:absolute; left: 50%; 
    min-width: 200px;
    margin-left: -100px;
    bottom:-100px;}
	
	
.region-custom-region h2, .region-custom-regiona h2, .region-custom-regionb h2 {text-align:center;}
.region-custom-region li, .region-custom-regiona li, .region-custom-regionb li {color:#000000; font-size:16px;}
h3, .h3 {font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
  font-size: 25px;
  padding-bottom: 20px;
  text-align: left;
  text-rendering: optimizeLegibility;
  color:#000000;
    letter-spacing: .15em;
  	  }

/*----------------------END CTA AREA-----------------*/
.page-header {border-bottom: 0px !important;}

.region-sidebar-second {background-color:#c0c0c0; padding:10px;  border: 2px solid #FFFFFF; /*border-radius: 15px;*/ /*margin-top:50px;*/ box-shadow: 5px 5px 15px #c0c0c0;}


/*
.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
*/


/*----------------LOGO-----------------*/

/*.pull-left {max-width:50px;}*/
.logo img {
height: auto;
max-width: 80%; /* this could be 100% but for me it goes outside the header background at tablet */
}

/*----------Text-------------*/
/* SPECIAL PAGE HEADING 1s*/
p {color:#000000; font-size:16px;}
.region-content p {font-size:20px;}
ul li {font-size:18px;}
a {color:#000000; text-decoration:underline;}
a:hover {color:#FFFFFF}
h1, .h1 {font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
  font-size: 35px;
  padding: 20px;
  text-align: center;
  /*text-transform: uppercase;*/
  text-rendering: optimizeLegibility;
  color:#000000;
   /* background-color: #e7e5e4;*/
    letter-spacing: .15em;
	  }

	  
h2, .h2 {font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
  font-size: 30px;
  padding-bottom: 20px;
  text-align: left;
  text-rendering: optimizeLegibility;
  color:#000000;
    letter-spacing: .15em;
  	  }
	  


/* Nav Bar layout changes*/
nav#block-mainnavigation {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.navbar-header {width:100%;}
/*a.logo.navbar-btn.pull-left {
    width: 100%;*/
}
a.logo.navbar-btn.pull-left img  {display: block;
  margin-left: auto;
  margin-right: auto;
  /*width: 50%;*/}

  .navbar-default .navbar-toggle {border-color:#FFFFFF;}
  .navbar-default .navbar-toggle .icon-bar {background-color:#FFFFFF;}
  
.slide--caption--center .slide__caption, .slide--caption--center-top .slide__caption {
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
    top: 43%;
}

.slide__caption p {color:#FFFFFF; font-size:20px; }
.slide__caption a {color:#FFFFFF; font-size:20px; }
.slide__caption {width:auto !important;}
.slide__description {background: rgba(0, 0, 0, 0.3); border-left:5px solid #c0c0c0; border-right:5px solid #c0c0c0;  box-shadow: 5px 5px 15px #c0c0c0; padding:20px;}
.slide__description:empty {display:none;}


/*---------Services page images----------*/

.page-node-4 .content img {max-width:150px; float:right; 
 /* margin-left: auto;
  margin-right: auto;
  width: 50%;*/
  }

 


/*MEDIA SCREEN CSS  */
   
@media screen and 	(max-width: 992px){
			.region-custom-region, .region-custom-regiona, .region-custom-regionb  {min-height:420px}

	.page-node-2 .juxtapose {height:550px; width:100%;}
	
}
	
	
@media screen and 	(max-width: 767px){
.table-responsive .table thead tr th, .table-responsive .table tbody tr th, .table-responsive .table tfoot tr th, .table-responsive .table thead tr td, .table-responsive .table tbody tr td, .table-responsive .table tfoot tr td {white-space: normal;}
.dialog-off-canvas-main-canvas {margin-top:100px;}
/*.navbar-is-fixed-top {margin-top:100px;}*/
.navbar  {background-color:#c0c0c0; /*opacity:0.8;*/ background-image: none; border: 0px; }
/*.view-slideshow {margin-top:50px; margin-bottom:25px;  position: relative !important;}*/
/*#block-searchform {margin-bottom:25px;}*/
.slide--caption--center .slide__caption, .slide--caption--center-top .slide__caption {
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
    top: 10% !important;}
	.slide__caption p {color:#FFFFFF; font-size:15px !important;}
	.blocktick {content:url(/sites/default/files/pictures/bfs-tick3.png); position: absolute; top:0px !important; left: 50%; transform: translate(-50%, -50%);}
	.region-content {margin-top:0px !important;}
		.region-custom-region, .region-custom-regiona, .region-custom-regionb  {min-height:350px}

	.page-node-2 .juxtapose {height:475px; width:100%;}
		
		}

/* make caption over slider appear nearer top on smaller screens*/
@media screen and (max-width: 590px){
	.slide--caption--center .slide__caption, .slide--caption--center-top .slide__caption {
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
    top: 10% !important;}
	.slide__caption p {color:#FFFFFF; font-size:15px !important;}
	.slide__caption a {color:#FFFFFF; font-size:15px !important; }
	.region-content {margin-top:0px !important;}
	.region-custom-region, .region-custom-regiona, .region-custom-regionb  {min-height:350px}
	.page-node-2 .juxtapose {height:400px; width:100%;}

}


@media screen and (max-width: 500px){
.navbar-is-fixed-top {margin-top:100px;}
.navbar  {background-color:#c0c0c0; background-image: none; border: 0px;}
.logo img {height: auto; max-width: 250px;}
.navbar-toggle {padding: 9px 10px; margin-right: -20px;}
.page-node-4 .main-container img {max-width:75px;}
.page-node-2 .juxtapose {max-height:280px; width:100%;}
}  

@media screen and (max-width: 350px){
.page-node-2 .juxtapose {max-height:225px; width:100%;}
}

#slick-views-slick2-block-1-1 ul, li{
    list-style-type: none;
    margin: 0;
    padding: 0 0 5px 0;
}

