/** text **/

h1,h2,h3,h4,h5,h6 {
font-family: 'Roboto Condensed', sans-serif;
color: #111111; line-height: 1.5;  
}
 
h1{
font-size:34px; margin-bottom: 6px; 
}
  
h2 {  
 font-size:30px; 
} 
 
body, .ArticleBody p {font-family: 'Roboto', sans-serif; color: #222222; font-size:18px; font-weight: 400; line-height: 1.4;}

.logo_text a {
 font-size:40px; text-decoration: none; font-family: 'Roboto Condensed', sans-serif;
color: #000000; } 


.bx-wrapper .bx-caption span {font-size: 1.3em; color: #000000; font-family: 'Roboto', sans-serif; text-align: center; }
  
@media only screen and (max-width: 1400px) {

  .bx-wrapper .bx-caption span {display: none;}
}

  
/** make logo bigger **/

.logo_image img {
    height: 180px; max-width: 100%;
}


hr {
border: 0;
color: #f28888;
background-color: #f28888;
height: 1px;
width: 100%;
text-align: left;
}  
 

/** adjust spacing at the top of the site **/
  
#header { padding-bottom: 12px;} 

.logo, #header .social {margin-top: 12px; }

  
#nav { background-color: #f28888; margin-top: 0px; margin-bottom: 0px; padding-top: 6px !important; padding-bottom: 6px !important;}
  
  #nav li > a {color: #ffffff;}  

#main .content { margin-top: 18px;
      }
  
 
/** not unless I change the hover   
  
#nav li > a {padding-left:0px; padding-right: 32px;}  **/
  
  
/** restrict hero image maximum size **/

.jb-homepage-hero img {width: 90%; max-width: 1200px; margin-top: 18px; margin-bottom: 12px; min-height: 200px; object-fit: cover;}
.jb-homepage-hero {background-color: #F4F4F4;}
  

#footer {background-color: #5c5c5c;  padding-top: 10px; padding-bottom: 12px; 
  margin-top: 10px; margin-left: 0px; margin-right: 0px;
}  
  
#footer a { color: #ffffff;} 
  
#main {background-color: #ffffff; margin-top: 0px;}
  
.boxed { padding: 16px; background-color:#ffffff; border:1px solid #eeeeee; margin-bottom: 20px;  } 
  
/** make images no larger than 100% wide so it's responsive **/

#main .content img {max-width: 100%;}


/** style of columns **/


#main .col{width: 47%; margin-top: 6px; padding: 12px 12px; background-color:#ffffff; border:3px solid #eeeeee;  }
  
#main .col p { font-size:19px;}

#main .col img {margin-top: 20px;}

#main .col a.btn {    color: #111111;    }

#main .col a.btn:hover {   color: #444444;}

  
  @media only screen and (max-width: 1024px){

   #main .col{width: 100%;padding: 0 20px;}
   } 
  
#main .col h3 {  font-size:30px; color: #111111; margin-bottom: 4px;
   } 
 
#main .col h3.highlight, .recentMediaSpeaker, .recentMediaDate, .upcomingEvents div > div:first-child a, .latestNews a, #main .col a, .admin_btns .small
  {color: #111111; font-size:17px; line-height: 20px; font-weight: normal;}



/**
.login .btn:hover{background: #0B6FA6 url(../images/icon_user.png) 10px center no-repeat;} 
**/  
  
.visitor-info {
    color: #111111;
    font-size: 18px;
    text-decoration: none;
    display: block;
 /**   
    max-width: 310px;

    background: url("/Images/Content/1620/Templates/40870/images/icon_info.png") no-repeat scroll 12px center #EDEFEA;
    border: 1px solid #E3E3E3;
**/  
    padding: 8px 5px 8px 45px;
    margin-top: 12px;
} 
  
.visitor-info a {
  color:   #849bbd;}

/** the style of the what's on and more projects links - to match the visitor info one **/

#main .col .whats-on {
    color: #111111;
    font-size: 18px;
    text-decoration: none;
    display: block;
    background: #edefea url(../images/icon_calendar.png) 12px center no-repeat;
    padding-left: 45px;
    border: 1px solid #e3e3e3;
    padding: 8px 5px 8px 58px;
}

#main .col .whats-on:hover {
    border-color: #cacaca;
    background: #e4e5e1 url(../images/icon_calendar.png) 12px center no-repeat;
}

#main .col .see-media {
    color: #111111;
    font-size: 18px;
    text-decoration: none;
    display: block;
    background: #edefea url(../images/videostream.jpg) 12px center no-repeat;
    padding-left: 45px;
    border: 1px solid #e3e3e3;
    padding: 8px 5px 8px 58px;
}

#main .col .see-media:hover {
    border-color: #cacaca;
    background: #e4e5e1 url(../images/videostream.jpg) 12px center no-repeat;
}
 


#main .col .we-support {
    color: #111111;
    font-size: 18px;
    text-decoration: none;
    display: block;
    background: #edefea;
    border: 1px solid #e3e3e3;
    padding: 8px 5px 8px 12px;
}

#main .col .we-support:hover {
    border-color: #cacaca;
    background: #e4e5e1;
}

  
/** centre the slider images **/  
  
.bx-wrapper img {margin: 0px auto;}
  
/** change the colour of the slider image numbers **/  
  
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
    background: none repeat scroll 0% 0% #f28888;
   
}
   
.bx-wrapper .bx-caption {
  background: rgba(255, 255, 255, 0.80); }
  
.bx-wrapper .bx-viewport {
    background: #f7f7f7;
}
  

/** layout of article summaries **/

.articleThumbnail {float: left;}
.articleText {clear: both;}


/** style of calendar module used in What's On page **/ 

.buckby_whats_on {border: solid 1px #e0e0e0;} 

.buckby_whats_on td {border-bottom: solid 1px #e0e0e0; padding:6px;}

/** a bit of padding for tables **/

td {padding-left: 4px; }