/* Default CSS */
/* Generated by the CoffeeCup HTML Editor - www.coffeecup.com */
/* For R&BGS Website 2015 Version 1.0 */

/* body { background-position:center; background-attachment:fixed; background-repeat:no-repeat; background-size: cover; font-family:verdana, arial, sans-serif;} */



.indexpage { background-image:url('../images/bkg/view1bkg.jpg');}

.genpages {background-image:url('../images/bkg/stonetexture1greybkg.jpg'); }

.sixtysix {background-image:url('../images/bkg/crownbkg.jpg');}

.historybkg {background-image:url('../images/bkg/oldschoolbkg.jpg'); }

.triviabkg {background-image:url('../images/bkg/triviabkg.jpg');}

.staffbkg {background-image:url('../images/bkg/staffbkg.jpg'); }

/* MAIN part of page -------------------------- */

#facebook {width:50px; height:50px; padding:0px; float:left; }

/*nav {width:720px; height:52px; margin: 10px auto;}*/


/* classes to control text and elements on the page */

.centerbox {display:block; margin-left:auto; margin-right:auto;}

.boxbdr {border:2px solid #000; }

.biggutter {
margin-top::10px;
margin-bottom::10px;
}

.pad10 {padding:10px; }

.bluetext {color:#2933A8;}

.browntext {color:#620000;}

.greentext {color:#2AA81C;}

.greytext {color:#514C4B;}

.orangetext {color:#FFA124;}

.redtext {color:#970D0D;}

.whitetext {color: #FFF; }

.blktxt {color:#000;}

/* ---------------------- */

.text12 {font-size:1.2em; }
.text50 {font-size: 50%;}
.text75 {font-size: 75%;}

.centered {text-align:center; }

.uline {text-decoration:underline; }

.lefty {float:left; margin:10px;}
.righty {float:right; }

/* ---------------------- */

.bluebkg {background-color:#2933A8;}

.brownbkg {background-color:#620000;}

.greenbkg {background-color:#2AA81C;}

.greybkg{background-color:#514C4B; }

.orangebkg {background-color:#ffe0bb;}

.redbkg {background-color:#970D0D;}

.whitebkg {background-color: #FFFFFF;}

.yellbkg {background-color:#f5ffbf; }

.pilksbkg {background-color:#8fb1ff; }
.holmesbkg {background-color:#8fff82; }
.queensbkg {background-color:#ff8a94; }

.sixtybkg {background-image:url('../assets/img/bkg/60ssm.png'); background-repeat:repeat; }
.seventybkg {background-image:url('../assets/img/bkg/70ssm.png'); background-repeat:repeat; }

/* Different areas for Info / Image Maps etc. */

.infoblock {
width:100%;
background-image:url('../img/bkg/paperbkgtr.png');
border:ridge;
padding:10px;
box-sizing: border-box;
}

.infoblock p, li {
font-size:1.0em;
font-weight:bold;
}

.infoblock img {vertical-align:top; border:solid; margin:10px;}

.wide100 {width:100%; }

.contributor {width:900px; height:170px; float: right; margin:10px; padding:0px; border:solid;}

.photoblock {width:100px; height:100px; float:left; padding:0px; position: relative;}

.textblock {width:300px; height:100px; float:right; padding: 0px 10px 5px 10px; box-sizing: border-box; background-color:#FFFF80; border-radius: 10px; position:relative; border:ridge; margin: 20px;
}

/* FIGURE box settings ---------------------------- */

figure { margin:20px; padding:0px;}

.slideshow {width:520px; height:650px; margin:20px auto; padding:0px;}

/* ------------------------------------------------- */


.centrebox {display:block; margin-left:auto; margin-right:auto;}

.rightimg {object-position: right center;}
.leftimg {object-position: left center; }

.fullbox {width:960px; height:auto; margin: 10px auto;}

.halfbox {width: 50%; height:auto;}

.quartbox {width:25%; height:auto; }

.rightbox {float:right; margin-right:20px;}

.leftbox {float:left; margin-left:20px;}


/* General puropose TEXT area font settings */

#infoblock li {
font-family: verdana, arial, sans-serif;
font-size:0.8em;
font-weight:bold;
 }
 
#tablebox {max-width:720px; height:auto; margin:20px auto; border:ridge;}
table { border: 10px solid white; background-color: #000; cell-spacing:2px;}
table th {background-color:#FFFFC1; text-align:center; }
/* table td {text-align:center; font-size: 0.8em; border:14px; background-color:#E3D1A3; font-weight:bold; color:#000;} */

#tablebox2 {max-width:796px; height:auto; margin:20px auto;}
#tablebox2 table {border-collapse:collapse; padding:0px;}
#tablebox2 img {margin:0px; padding:0px; }



.col1 {width:10%; background-color: #FFFF80; }
.col2 {width:45%; background-color:#FFFFFF; }
.col3 {width:45%; background-color:#D3D3D3; }
.col33 {width:260px; }
.col160 {width:160px; }
.col120 {width:120px; }
.col25p {width:20%; }

.tdwhite {background-color:white; }

.width100 {width:100%; border: 10px solid green; box-sizing: border-box;}

/* --------- Setup for big photos and Class Lists -----------  */

.bigphoto {width:882px; height:auto; margin:20px auto; padding:0px; background-color: #000; border:solid;}

#vidbox {display:block; width:774px; height:auto; margin-left:auto; margin-right:auto; object=position:50% 50%;}

#extrabox {width:400px; height:auto; margin:20px; padding:25px; float:right; font-size:1.0em;}

/* gallery stuff */


div.gallery {
  border: 1px solid #ccc;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  height: auto;
}

div.desc {
  padding: 15px;
  text-align: center;
}

* {
  box-sizing: border-box;
}

.responsive {
  padding: 0 6px;
  float: left;
  width: 24.99999%;
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/* body {
  background: #f4f4f4;
}*/

.banner {
  background: #a770ef;
  background: -webkit-linear-gradient(to right, #a770ef, #cf8bf3, #fdb99b);
  background: linear-gradient(to right, #a770ef, #cf8bf3, #fdb99b);
}

#btn-back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: none;
}

  .icon::before {
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
  }
  
 .image-gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.image-gallery > li {
  flex-basis: 350px; /* width: 350px; */
}

.image-gallery li img {
  object-fit: cover;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border-radius: 5px;
}

.image-gallery::after {
  content: "";
  flex-basis: 350px;
}
  
  