
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}


@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Roboto Slab'), url('https://www.rossbrown.co.uk/wp-content/themes/rb2025-c2/fonts/robotoslab300.woff2') format('woff2');
 }
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: local('Roboto Slab'), url('https://www.rossbrown.co.uk/wp-content/themes/rb2025-c2/fonts/robotoslab600.woff2') format('woff2');
}

:root {
  --bluegrey: rgba(37,52,71,1);
  --bluegrey90: rgba(37,52,72,0.9);
  --bluegrey80: rgba(37,52,72,0.8);
  --bluegrey75: rgba(37,52,72,0.75);
  --bluegrey50: rgba(37,52,72,0.5);
  --bluegrey25: rgba(37,52,72,0.25);

  --pink: rgba(201,27,100,1);
  --pinktint: rgba(201,27,100,0.7);
  --pinklight: rgba(201,27,100,0.2);
  --pinkhex: #C91B64;
  --angle1: polygon(100% 0%, 0% 0%, 0% 100%, 100% 83%);
  --angle2: polygon(100% 0%, 0% 13%, 0% 100%, 100% 100%);
  
  --green: rgba(12,108,0,1);
  --red: rgba(255,19,1,1);
  
  }

/* Setup
_________________________________________________ */

html {}

body {width: 100%; overflow: visible; background: var(--bluegrey); float: left;}

.clearer, .clearer00, .clearer10, .clearer20, .clearer30, .clearer40, .clearer50, .clearer60, .clearer70, .clearer80, .clearer90, .clearer100
{clear: both; height: 1px; width: 100% !important;}

.clearer10 {height: 1vw;} .clearer20 {height: 2vw;} .clearer30 {height: 3vw;} .clearer40 {height: 4vw;} .clearer50 {height: 5vw;}


p, a, li, h1, h2, h3, h4, label {
		font-family: 'Roboto Slab', Helvetica, Arial, serif;
	}

p, li, label, .contactform label,
.contactform textarea, .contactform input, .contactform select
	{
	font-size: 1.4vw;
	line-height: 150%;
	font-weight: 300;
	margin-bottom: 2vw;}
  
p.heading {color: var(--pink);}  
	
a {text-decoration: none !important; line-height: inherit; font-weight: inherit; color: inherit;}

li {list-style-type: disc; list-style-position: outside; margin-left: 20px; margin-bottom: 0; break-inside: avoid;}
	
p strong, strong, b {font-weight: 600;}

h1, h3, h4 {font-size: 2vw; color: #f2f2f2}

h1 {
	color: var(--pink); 
	position: relative;
  }

h4 {font-size: 1.2vw;
  color: #fff;
  background: var(--pink);
  border-radius: 20px;
  padding: 0.3vw 1vw;
  display: inline-block;
  margin: 1vw 0;
}

.container {float: left; width: 75%; margin-left: 12.5%;}

p.home {text-align: center;}
img.home {width: 3vw; height: auto; text-align: center;}

button {padding: 0.3vw 1vw;
  background: var(--pink);
  border-radius: 10px;
  color: #fff;
  border: 0;
  font-size: 1vw;}

#dashboard {display: flex; width: 100%; flex-wrap: wrap;}

#dashboard > div {flex: 1;
  text-align: center;
  margin: 1vw;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  padding-bottom: 2vw;}
  
#dashboard.hp > div {flex: 1;
min-width: calc(20% - 2vw);
max-width: calc(20% - 2vw);
}  

#dashboard > div.wide {flex: 4;
  text-align: center;
  margin: 1vw;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  padding-bottom: 2vw;
}
  
#dashboard > div.fw {flex: 2;
  min-width: 100%;
  text-align: center;
  margin: 1vw;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  padding-bottom: 2vw;
}
  
#dashboard > div.fw > div {
  float: left;
  width: 47%;
}    

#dashboard > div.div > div:nth-of-type(even) {
  float: right;
}    


  
#dashboard.single > div {border-bottom: 0 !important;}  

#dashboard.single > div > section {width: 25%; max-width: 10vw; float: left;}  

#dashboard.single > div > h4 {display: block !important;}

#dashboard img.siteIcon {background: #fff;}

#dashboard > div img.icon,
#dashboard > div img.icon2 {
  margin-bottom: 0;
  width: 1.5vw;
  height: auto;
  padding: 0.3vw;
  border-radius: 50%;}

#dashboard > div img.icon2 {background: none !important; padding: 0 !important; vertical-align: middle;}

#dashboard > div h3 {color: var(--pink); font-size: 1.2vw}

#dashboard > div p {color: #fff; font-size: 1.1vw;}

#dashboard > div p.category {display: inline-block; padding: 0.3vw 1vw; border-radius: 20px;}

#dashboard > div p.BZ {background: #a2c; color: #fff;}
#dashboard > div p.RB {background: #8f6; color: #000;}
#dashboard > div p.SLMC {background: #0af; color: #fff;}

#dashboard > div > aside {
  /* display: flex; */
  width: 75%;
  margin-left: 12.5%;}

#dashboard > div > aside > span {/* flex: 1; */
  text-align: center;
  width: 33%;}
		
/* Warning Blobs
_________________________________________________ */	

.blob {width: 1.5vw;
  height: 1.5vw;
  border-radius: 50%;
  display: inline-block;
  color: #fff;
  padding: 0.5vw}

.blobwarning {background: var(--red);}
.blobcoolio {background: var(--green);}

.icons {width: 100%; position: relative; height: 150px;}

/* Footer
_________________________________________________ */	

footer {clear: both; float: left; width: 100%;}

