How to Add the Sussex Events Calender to your Website

If you would like to add the Sussex Game Nights, Game Days & Conventions calender to your website or blog for the benefit of your own community of avid gamers simply add the following code to the HTML section of a new page on your site. This HTML code is formatted correctly to display as a Monthly View for desktop users and as an Adaptive Agenda View for mobile users. If you would like to change any of the parameters to meet your own personal needs you may do so. Please always make sure to back up your website before adding, removing or altering code.

<div class="responsive-iframe-container big-container"><iframe src="https://calendar.google.com/calendar/embed?height=800&amp;wkst=2&amp;bgcolor=%23fdc740&amp;ctz=Europe%2FLondon&amp;showTz=0&amp;showCalendars=0&amp;showTabs=1&amp;showNav=1&amp;mode=MONTH&amp;showTitle=1&amp;hl=en_GB&amp;showPrint=1&amp;src=NWM0YTNlZDhhYTBkOWI4MWNkMDY5ZjhiYWIyZDVhMTVmYTEwOGVmYzM4NzljNzc0ZDBmOTY4NjZmN2FjMDNiM0Bncm91cC5jYWxlbmRhci5nb29nbGUuY29t&amp;src=ZW4tZ2IudWsjaG9saWRheUBncm91cC52LmNhbGVuZGFyLmdvb2dsZS5jb20&amp;color=%239E69AF&amp;color=%230B8043" style="border-width: 0;" scrolling="no" width="800" height="800" frameborder="0"></iframe></div>
<div class="responsive-iframe-container small-container"><iframe src="https://calendar.google.com/calendar/embed?height=800&amp;wkst=2&amp;bgcolor=%23fdc740&amp;ctz=Europe%2FLondon&amp;showTz=0&amp;showCalendars=0&amp;showTabs=0&amp;showNav=1&amp;mode=AGENDA&amp;showTitle=1&amp;hl=en_GB&amp;showPrint=0&amp;src=NWM0YTNlZDhhYTBkOWI4MWNkMDY5ZjhiYWIyZDVhMTVmYTEwOGVmYzM4NzljNzc0ZDBmOTY4NjZmN2FjMDNiM0Bncm91cC5jYWxlbmRhci5nb29nbGUuY29t&amp;src=ZW4tZ2IudWsjaG9saWRheUBncm91cC52LmNhbGVuZGFyLmdvb2dsZS5jb20&amp;color=%239E69AF&amp;color=%230B8043" style="border-width: 0;" scrolling="no" width="800" height="800" frameborder="0"></iframe></div>
<style><!--
@media (max-width: 550px) {
   .big-container {
       display: none;
   }
}
@media (min-width: 550px) {
   .small-container {
       display: none;
   }
}
/* Responsive iFrame */
.responsive-iframe-container {
   position: relative;
   padding-bottom: 130%;
   padding-top: 30px;
   height: 0;
   overflow: hidden;
}
.responsive-iframe-container iframe,   
.responsive-iframe-container object,  
.responsive-iframe-container embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
--></style>