@charset "UTF-8";
/* CSS Document */

body{
	margin:0;
	padding:0;
}

html{ 
    font-size: calc(0.75em + 0.3vw);
}

/* BOOTSTRAP OVERIDES */

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

/* BORDERS */

.br-dotted {
    border-right: thin dotted #666666;
}

.bl-dotted {
    border-left: thin dotted #666666;
}

.bb-dotted {
	border-bottom: thin dotted #666666;
}

.bb{
	border-bottom: thin solid #333333;
}

.rounded-small{
	border-radius: 20px;
}

.bb-grey {
    border-bottom: thin solid #D5D6D3;
}

.br-grey {
    border-right: thin solid #D5D6D3;
}

.br-100{
	border-radius: 60px !important;
}

.br-top-100{
	border-top-right-radius: 60px !important;
	border-top-left-radius: 60px !important;
}

.bbl-100{
	border-bottom-left-radius: 20px;
}

.bbr-100{
	border-bottom-right-radius: 20px;
}

.bl-grey {
    border-left: thin solid #D5D6D3;
}

.blr-grey{
	border-right: thin solid #D5D6D3;
	border-left: thin solid #D5D6D3;
}

.b-grey {
    border: thin solid #D5D6D3;
}

.btb-grey {
    border-top: thin solid #D5D6D3;
	border-bottom: thin solid #D5D6D3;
}

.tb{
	border: thin solid #CC0000;
}

.no-margin-bottom{
    margin-bottom: 0 !important;
}

.header-100{
	min-height: 100vh !important;
}

.header-80{
	min-height: 80vh !important;
}

.header-60{
	min-height: 60vh !important;
}

/* CAROUSEL */

.carousel-indicators li {
  background-color: #949494 !important;
  background-color: rgba(70, 70, 70, 0.25) !important;
}

.carousel-indicators .active {
  background-color: #363535 !important;
}

.carousel-item{
	max-height:600px !important;
}

/* COLOURS */

.cb-primary{
	color: #FFFFFF !important;
}

.cb-secondary{
	color: #FFFFFF !important;
}

.c-secondary{
	color: #1c2b2b !important;
}

.c-primary{
	color: #415b5c !important;
}

.bg-secondary{
	background-color: #1c2b2b !important;
}

.bg-primary{
	background-color:#415b5c !important;
}

button.bg-primary:hover,button.bg-primary:focus,button.bg-primary:visited,button.bg-primary:active{
	background-color: #1c2b2b !important;
	transition: 0.7s;
}

.c-link{
	color: #415b5c !important;
}

.c-white{
	color: #ffffff !important;
}

a.c-white, a.c-white:active, a.c-white:hover, a.c-white:visited{
    color: #ffffff !important;
}

.c-grey{
	color: #54565b !important;
}

.c-lt-grey{
	color: #9B9B9B !important;
}

.c-red{
	color: #FF0004 !important;
}

.bg-lt-grey{
	background-color: #F0F0F0 !important;
}

.bg-md-grey{
	background-color: #C2C2C2 !important;
}

.bg-grey{
	background-color: #666666 !important;
}

.bg-white{
    background-color: #FFFFFF !important;
}

.bg-black{
    background-color: #000000 !important;
}

/* SPINNER */

@keyframes spinner-border {
  to { transform: rotate(360deg); }
} 

.spinner-border{
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: .25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

.spinner-border-sm{
    height: 1rem;
    border-width: .2em;
}

/* IMAGES */

.home-cover{
	background-image: url("../images/bromley/bromley-2.jpg");
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: cover !important;
	width: 100vw !important;
	height: 100vh !important;
	position: fixed;
	z-index: -1;
}

.home-survey{
	background-image: url("../images/bromely/bromley-2.jpg");
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: cover !important;
	width: 100vw !important;
	height: 100vh !important;
	position: fixed;
	z-index: -1;
}

.image-scale{
	max-width:100%;
    height:auto;
    object-fit:contain;
}

.img-fill{
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: cover !important;
	min-height: 300px;
}

.img-contain{
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-size: contain !important;
	min-height: 300px;
}

.img-square{
	min-height:35vh !important;
	background-repeat: no-repeat;
}

.thumb-holder{
	min-height:360px;
	border: thick solid #FFFFFF;
}

.banner-hero-large{
	width:100vw;
	height:100vh;
	position:fixed;
	z-index:-10;
	left:0;
	top:0;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

.img-base{
	height: 60vh;
	background-image: url("../images/template/img-base.png");
	background-position: bottom center;
	background-repeat: no-repeat;
}

.img-base-sm{
	height: 30vh;
	background-image: url("../images/template/img-base.png");
	background-position: bottom center;
	background-repeat: no-repeat;

}

.line-break{
	background-image: url("../images/template/line-break.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	min-height: 90px;

}

/* LAYOUT */

.fixed-w{
	width: 100%;
	max-width: 1920px !important;
}

.fixed-ws{
	max-width: 1080px !important;
}

.button-right{
	max-height: 100px !important;
}

.hide-row{
	visibility: hidden;
}

.active{
	display: block;
}

.in-active{
	display:none;
}

/* BUTTONS */

.block-button{
    height:auto;
    width:auto;
	min-width: 180px !important;
	background-color: #415b5c;
	color: #FFFFFF;
	line-height:40%;
    border: none;
	cursor: pointer;
	padding: 5px;
	border-radius: 30px;
}

.block-button-large{
	
    height:auto;
    width:auto;
	background-repeat: none;
	background-color: #415b5c;
	color: #FFFFFF;
	line-height:40%;
    border: none;
	cursor: pointer;
	padding: 30px !important;
	border-radius: 10px;
	
}

.block-button-small{
	
    font-family: M-Regular,Arial, Helvetica, sans-serif !important;
	font-size:1em !important;
	font-weight:normal;
    height:auto;
    width:auto;
	background-color:#363d4c;
	color: #FFFFFF;
	line-height:40%;
    border: none;
	cursor: pointer;
	padding: 10px;
	border-radius: 5px;
	
}

.block-button-small-secondary{
    font-family: M-Regular,Arial, Helvetica, sans-serif !important;
	font-size:1em !important;
	font-weight:normal;
    height:auto;
    width:auto;
	background-color:#666666;
	color: #FFFFFF;
	line-height:40%;
    border: none;
	cursor: pointer;
	padding: 10px !important;
	border-radius: 5px;
}

.block-button-secondary{
    font-family: M-Regular,Arial, Helvetica, sans-serif !important;
	font-size:1.1em !important;
	font-weight:normal;
    height:auto;
    width:auto;
	background-color:#363d4c;
	color: #FFFFFF;
	line-height:40%;
    border: none;
	cursor: pointer;
	padding: 15px;
	border-radius: 10px;
}

.no-button{
    
    background: rgba(0, 0, 0, 0);
    border: none;
    cursor: pointer;
	padding: 5px !important;
	margin: 0;
	
}

.h-button{
	border: none;
    cursor: pointer;
	margin: 0;
	background-color: #ff5c35;
	color: #FFFFFF;
}

.h-active{
	border-top: thick solid #C68C27;
	background-color: #FFFFFF !important;
	color: #343E47 !important;
}

.no-button{
    background: rgba(0, 0, 0, 0);
    border: none;
    cursor: pointer;
	padding: 5px !important;
	margin: 0;
}

.no-button:focus {
  outline: none;
  box-shadow: none;
}

.rating-button{
	
	min-height: 60px;
	min-width: 60px;
	width: auto;
	border: thick solid #FFFFFF;
	border-radius: 15px;
	cursor: pointer;
	
}

.multiple-button{
	min-height: 60px;
	width: 100%;
	max-width: 800px;
	border: thick solid #FFFFFF;
	border-radius: 15px;
	cursor: pointer;
	outline: none;
  	box-shadow: none;
}

.b-active{
	background-color: #1c2b2b !important;
	outline: none;
    box-shadow: none;
}

/* SURVEY ELEMENTS */

.s-header{
	color: #666666 !important;
}

.s-nav-inactive{
	color: #666666 !important;
	background-color: #CCCCCC !important;
}

.s-nav-active{
	color: #333333 !important;
	background-color: #f3f328 !important;
}

.s-button{
	color: #FFFFFF !important;
	background-color: #f3f328 !important;
}

/* MOBILE DEVICES */

/* DEVICE PORTRAIT */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
    
    html{
        font-size: 1em;
    }
	
    .b-regular{
        font-size: 1.5em;
	}
	
	.nav-link{
		font-size: 1em !important;
	}
	
	a.nav-link, a.nav-link:active, a.nav-link:hover, a.nav-link:visited {
    font-size: 1em !important;
	}
	
	h1{
    	font-size:2.5em !important;
	}
	
	.bbl-100{
		border-bottom-left-radius: 0px;
	}

	.bbr-100{
		border-bottom-right-radius: 0px;
	}
}

/* DEVICE LANDSCAPE */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
    
     html{
        font-size: 1em;
    }
	
    .b-regular{
        font-size: 1em;
	}
	
	.nav-link{
		font-size: 1em !important;
	}
	
	a.nav-link, a.nav-link:active, a.nav-link:hover, a.nav-link:visited {
    font-size: 1em !important;
	}
	
	h1{
    	font-size:2.5em !important;
	}
	
	.img-base{
		height: 80vh !important;
	}
	
}

/* MOBILE LANDSCAPE */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px)
and (orientation : landscape) {
    
    html{
        font-size: 1em;
    }
	
    .b-regular{
        font-size: 1em;
	}
	
	.nav-link{
		font-size: 1em !important;
	}
	
	a.nav-link, a.nav-link:active, a.nav-link:hover, a.nav-link:visited {
    font-size: 1em !important;
	}
	
	h1{
    	font-size:2em !important;
	}

	h3{
		font-size: 2em !important;
	}
	
	.img-base{
		height: 80vh !important;
	}
	
	.bbl-100{
		border-bottom-left-radius: 0px;
	}

	.bbr-100{
		border-bottom-right-radius: 0px;
	}

}

/* MOBILE PORTRAIT */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px)
and (orientation : portrait) {
    
     html{
        font-size: 1em;
    }
	
    .b-regular{
        font-size: 1em;
	}
	
	.nav-link{
		font-size: 1em !important;
	}
	
	.br-dotted {
    	border-right: none !important;
	}

	.bl-dotted {
		border-left: none !important;
	}
	
	.img-base{
		height: 80vh !important;
	}
	
	a.nav-link, a.nav-link:active, a.nav-link:hover, a.nav-link:visited {
    font-size: 1em !important;
	}
	
	h1{
    	font-size:2em !important;
	}

	h3{
		font-size: 2em !important;
	}
	
	.bbl-100{
		border-bottom-left-radius: 0px;
	}

	.bbr-100{
		border-bottom-right-radius: 0px;
	}
}