/* start of text styles */
body {
font-size: 18px;
 }
h1 {
color: #01aaad;
 }
h2 {
color: #006565;
 }
h3 {
color: #01aaad;
 }
h4 {
color: #006565;
 }
/* end of text styles */

/* start of class styles */
.eventsLink {
color: #01aaad;
font-weight: bold;
text-decoration: none;
 }
.eventsHeadline {
color: #006565;
font-weight: bold;
font-size: 1.1em;
text-decoration: none;
 }
.newsLink {
color: #01aaad;
font-weight: bold;
text-decoration: none;
 }
.newsHeadline {
color: #006565;
font-weight: bold;
font-size: 1.1em;
text-decoration: none;
 }
.tabMenu {
color: #006565;
font-weight: bold;
text-decoration: none;
 }
.title1 {
text-decoration: none;
 }
.title2 {
text-decoration: none;
 }
.sponsor {
background-color: #eeeeee;
font-size: 0.9em;
text-decoration: none;
 }
.pageFooter {
background-color: #b3f3f5;
 }
/* end of class styles */

/* start of id styles */
#topNav {
color: #e5ac29;
background-color: #006565;
 }
#topNav a {
color: #e5ac29;
 }
#bodyCenter {
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
 }
#pageBottom2 {
color: #e5ac29;
background-color: #006565;
font-size: 0.85em;
text-align: center;
padding-top: 10px;
padding-bottom: 10px;
border-top: 5px solid #e5ac29;
border-bottom: 5px solid #e5ac29;
 }
#pageBottom2 a {
color: #e5ac29;
border-top: 5px solid #e5ac29;
border-bottom: 5px solid #e5ac29;
 }
#pageBottom3 {
border-top: 5px solid ;
border-bottom: 5px solid ;
 }
/* end of id styles */

/* start of standard styles */
body {margin: 0;}
#pageTop1, #pageTop2, #topNav, #mainBody, #pageBottom1, #pageBottom2, #pageBottom3 {
clear: both;
}
#leftNav {
float: left;
}
#rightNav {
float: right;
}
.tabMenu {
background-repeat: round;
}
.sponsor {
border: thin;
}
#bodyCenter {
margin-left: auto;
margin-right: auto;
}
.centerElement {
margin-left: auto;
margin-right: auto;
width: fit-content;
}
#rightNav {
margin: 0 auto;
}
#pageBottom2 {
vertical-align: middle;
}
#topNav {
vertical-align: top;
}
.productCard {
    padding: 20px;
    border: 1px solid lightgray; 
    border-radius: 5px;
}
/* end of standard styles */


/* add the background color */
body {
    background-color: #ffffff;
}


#bodyCenter {
   margin-left:0px !important;
}


#bodyCenter {
    margin-right:0px !important;
}

.sponsorclearAll {
    clear: both;
}


/* add style changes for when club banner is used */
#pageTop1 {
    width: auto; 
    height: auto; 
    clear: both;
}

.bodyContent {
	display: flex;
	flex-direction: row;
}
#bodyCenter {
	flex-grow: 1;
	order: 20;
	width: 1200px
}


/* responsive styles */

/* make all images and objects device responsive */
img, object, video, embed {
    max-width: 100%;
    height: auto;
}

.iframe-container {
  position: relative;
  height: 0;
  overflow: hidden;
}
 
/* 16x9 Aspect Ratio */
.iframe-container-16x9 {
  padding-top: 25px;
  padding-bottom: 56.25%;
}
 
/* 4x3 Aspect Ratio */
.iframe-container-4x3 {
  padding-bottom: 75%;
}
 
.iframe-container iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* handle really long links */
a {
	word-wrap: break-word;
}

/* table responsive code starts here */
.table-full {
    display: table;
    margin: auto;
    width: 100%;
}

.table-half {
    display: table;
    margin: auto;
    width: 50%;
}

.table-third {
    display: table;
    margin: auto;
    width: 33%;
}

.table-row {
    display: table-row;
}

.table-body {
    display: table-row-group;
}

.table-cell, .table-cell-left, .table-cell-middle, .table-cell-right, .table-head, .table-head-left, .table-head-middle, .table-head-right {
    display: table-cell;
    padding: 10px;
}

.table-head, .table-head-left, .table-head-middle, .table-head-right {
    font-weight: bold;
}

.table-heading {
    display: table-header-group;
    font-weight: bold;
}

.table-footing {
    display: table-footer-group;
    font-weight: bold;
}

.table-cell-left, .table-head-left {
    text-align: left;
}

.table-cell-middle, .table-head-middle {
    text-align: center;
}

.table-cell-right, .table-head-right {
    text-align: right;
}
/* table responsive code ends here */

#pageBottom2 {
    height: auto;
}

.mobileShow {
	display: none;
}

/* phone sized devices */
@media only screen
and (min-width : 320px)
and (max-width : 480px) {
    body {
        padding: 0;
        margin: 0;
        width: 320px;
    }
}

/* phones and tablet sized devices */
@media only screen and (max-width: 768px) {
	.mobileShow {
		display: block;
	}
	.mobileHide {
		display: none;
	}
}

@media only screen and (min-width: 768px)
and (max-width: 1024px) {
    body {
        width: 495px;
    }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width: 768px)
and (max-width: 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
    body {
        width: 495px;
    }

}

/* start of styles for responsive grid rows */
.grid-2-column5050 {
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 10px;
    padding: 10px;
}

.grid-2-column3070 {
    display: grid;
    grid-template-columns: 30% auto;
    grid-gap: 10px;
    padding: 10px;
}

.grid-2-column7030 {
    display: grid;
    grid-template-columns: 70% auto;
    grid-gap: 10px;
    padding: 10px;
}
/* end of styles for responsive grid rows */



		.contentContainer {
			max-width: 1200px;
			margin-left: auto;
			margin-right :auto;
		}
		@media only screen and (max-width: 1200px) {
			.contentContainer {
			  width: 100%;
			  margin-left: auto;
			  margin-right: auto;
			  display: flex;
			  flex-direction: column;
			}
		}


	@media only screen and (max-width: 1200px) {
	   body {
		  width: 100%;
		  margin-left: auto;
		  margin-right: auto;
		  padding: 0;
	   }

		/*#mainBody {
			   Setup Flexbox 
			flex-direction: column-reverse;
			align-items: flex-start;
		}*/

		#bodyCenter {
			display: block;
			width: auto;
			  float: left;
			position: relative;
			clear: both;
			margin-left: 0;
			margin-right: 0;
			order: 10;
		}

		#leftNav {
			display: block;
			  float: left;
			clear: left;
			  border-right: 0px;
			  border-top: 1px solid #cccccc;
			overflow:visible;
			margin-left: auto;
			margin-right: auto;
			order: 20;
		}

		#rightNav {
			display: block;
			  float: left;
			clear: left;
			  border-left: 0px;
			  border-top: 1px solid #cccccc;
			overflow:visible;
			margin-left: auto;
			margin-right: auto;
			order: 30;
		}
		
		.bodyContent {
			flex-direction: column;
		}

		.table, .table-row {
			display: block;
		}
		.table-cell {
			display: inline-block;
		}
	}

           
/* Mobile first layout SmartMenus Core CSS (it's not recommended editing these rules)
   You need this once per page no matter how many menu trees or different themes you use.
-------------------------------------------------------------------------------------------*/

.sm{position:relative;z-index:9999;}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:not-allowed;}
.sm:after{content:"\00a0";display:block;height:0;font:0px/0 serif;clear:both;visibility:hidden;overflow:hidden;}
.sm,.sm *,.sm *:before,.sm *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
\n\n
/* simple menu styles*/
.sm-simple {
  /* border: 1px solid #bbbbbb;
  background: #367FB6; */
  /*-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
}
.sm-simple a, .sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active {
  padding: 13px 20px;
  /* make room for the toggle button (sub indicator) */
  padding-right: 58px;
  /* color: white; */
  font-family: "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  line-height: 17px;
  text-decoration: none;
}
.sm-simple a.current {
  /* background: #367FB6;
  color: white; */
}
.sm-simple a.disabled {
  /* color: #367FB6; */
}
.sm-simple a span.sub-arrow {
  position: absolute;
  top: 50%;
  margin-top: -17px;
  left: auto;
  right: 4px;
  width: 34px;
  height: 34px;
  overflow: hidden;
  font: bold 14px/34px monospace !important;
  text-align: center;
  text-shadow: none;
  /* background: rgba(0, 0, 0, 0.08); */
}
.sm-simple a span.sub-arrow :hover{
	
}
.sm-simple a.highlighted span.sub-arrow:before {
  display: block;
  content: "-";
}
.sm-simple li {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}
.sm-simple > li:first-child {
  border-top: 0;
}
.sm-simple ul {
  /* background: rgba(179, 179, 179, 0.1); */
}
.sm-simple ul a, .sm-simple ul a:hover, .sm-simple ul a:focus, .sm-simple ul a:active {
  font-size: 14px;
  border-left: 8px solid transparent;
}
.sm-simple ul ul a,
.sm-simple ul ul a:hover,
.sm-simple ul ul a:focus,
.sm-simple ul ul a:active {
  border-left: 16px solid transparent;
}
.sm-simple ul ul ul a,
.sm-simple ul ul ul a:hover,
.sm-simple ul ul ul a:focus,
.sm-simple ul ul ul a:active {
  border-left: 24px solid transparent;
}
.sm-simple ul ul ul ul a,
.sm-simple ul ul ul ul a:hover,
.sm-simple ul ul ul ul a:focus,
.sm-simple ul ul ul ul a:active {
  border-left: 32px solid transparent;
}
.sm-simple ul ul ul ul ul a,
.sm-simple ul ul ul ul ul a:hover,
.sm-simple ul ul ul ul ul a:focus,
.sm-simple ul ul ul ul ul a:active {
  border-left: 40px solid transparent;
}

/* code for hamburger menu */
.main-menu-btn {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 28px;
  text-indent: 28px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* hamburger icon */
.main-menu-btn-icon, .main-menu-btn-icon:before, .main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #bbb;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}
.main-menu-btn-icon:before {
  content: "";
  top: -7px;
  left: 0;
}
.main-menu-btn-icon:after {
  content: "";
  top: 7px;
  left: 0;
}
/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* hide menu state checkbox offscreen (so it stays visible to screen readers) */
#main-menu-state {
  position: absolute;
  top: -99999px;
}
/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}
#main-menu-state:checked ~ #main-menu {
  display: block;
}




	@media (min-width: 1196px) {
	  /* Switch to desktop layout
	  -----------------------------------------------
		 These transform the menu tree from
		 collapsible to desktop (navbar + dropdowns)
	  -----------------------------------------------*/
	  /* start... (it's not recommended editing these rules) */
	  .sm-simple ul {
		position: absolute;
		width: 12em;
	  }

	  .sm-simple li {
		float: left;
	  }

	  .sm-simple.sm-rtl li {
		float: right;
	  }

	  .sm-simple ul li, .sm-simple.sm-rtl ul li, .sm-simple.sm-vertical li {
		float: none;
	  }

	  .sm-simple a {
		white-space: nowrap;
	  }

	  .sm-simple ul a, .sm-simple.sm-vertical a {
		white-space: normal;
	  }

	  .sm-simple .sm-nowrap > li > a, .sm-simple .sm-nowrap > li > :not(ul) a {
		white-space: nowrap;
	  }

	  /* ...end */

	  .sm-simple a, .sm-simple a:hover, .sm-simple a:focus, .sm-simple a:active, .sm-simple a.highlighted {
		padding: 11px 20px;
	  }
	  .sm-simple a.has-submenu {
		padding-right: 32px;
	  }
	  .sm-simple a span.sub-arrow {
		top: 50%;
		margin-top: -8px;
		right: 20px;
		width: 8px;
		height: 16px;
		font: 14px/16px monospace !important;
		background: transparent;
	  }
	  .sm-simple a.highlighted span.sub-arrow:before {
		display: none;
	  }
	  .sm-simple > li {
		border-top: 0;
		border-left: 1px solid #eeeeee;
	  }
	  .sm-simple > li:first-child {
		border-left: 0;
	  }
	  .sm-simple ul {
		border: 1px solid #bbbbbb;
		/*-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
		-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
		box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);*/
	  }
	  .sm-simple ul a {
		border: 0 !important;
	  }
	  .sm-simple ul a.has-submenu {
		padding-right: 20px;
	  }
	  .sm-simple ul a span.sub-arrow {
		right: auto;
		margin-left: -12px;
	  }
	  .sm-simple ul > li {
		border-left: 0;
		border-top: 1px solid #eeeeee;
	  }
	  .sm-simple ul > li:first-child {
		border-top: 0;
	  }
	  .sm-simple span.scroll-up,
	  .sm-simple span.scroll-down {
		position: absolute;
		display: none;
		visibility: hidden;
		overflow: hidden;
		height: 20px;
	  }
	  .sm-simple span.scroll-up-arrow, .sm-simple span.scroll-down-arrow {
		position: absolute;
		top: -2px;
		left: 50%;
		margin-left: -8px;
		width: 0;
		height: 0;
		overflow: hidden;
		border-width: 8px;
		border-style: dashed dashed solid dashed;
		border-color: transparent transparent #555555 transparent;
	  }
	  .sm-simple span.scroll-down-arrow {
		top: 6px;
		border-style: solid dashed dashed dashed;
		border-color: #555555 transparent transparent transparent;
	  }
	  .sm-simple.sm-rtl a.has-submenu {
		padding-right: 20px;
		padding-left: 32px;
	  }
	  .sm-simple.sm-rtl a span.sub-arrow {
		right: auto;
		left: 20px;
	  }
	  .sm-simple.sm-rtl.sm-vertical a.has-submenu {
		padding: 11px 20px;
	  }
	  .sm-simple.sm-rtl.sm-vertical a span.sub-arrow {
		right: 20px;
		margin-right: -12px;
	  }
	  .sm-simple.sm-rtl > li:first-child {
		border-left: 1px solid #eeeeee;
	  }
	  .sm-simple.sm-rtl > li:last-child {
		border-left: 0;
	  }
	  .sm-simple.sm-rtl ul a.has-submenu {
		padding: 11px 20px;
	  }
	  .sm-simple.sm-rtl ul a span.sub-arrow {
		right: 20px;
		margin-right: -12px;
	  }
	  .sm-simple.sm-vertical a span.sub-arrow {
		right: auto;
		margin-left: -12px;
	  }
	  .sm-simple.sm-vertical li {
		border-left: 0;
		border-top: 1px solid #eeeeee;
	  }
	  .sm-simple.sm-vertical > li:first-child {
		border-top: 0;
	  }
	}

	@media (min-width: 1196px) {
	  /* hide the button in desktop view */
	  .main-menu-btn {
		position: absolute;
		top: -99999px;
	  }
	  /* always show the menu in desktop view */
	  #main-menu-state:not(:checked) ~ #main-menu {
		display: block;
	  }
	}

#bannerContainer {
	text-align: center;
}

/* change banner to logo on smaller widths */
#bannerContainerName {
   display: none;
}

@media only screen and (max-width: 480px) {
   div[id=bannerContainer] {
      display: block;
      content: url('https://ennismorecurlingclub.com/data/135/style/curling logo enhanced.jpg');
      margin: auto;
      max-width: 100%;
      width: auto;
      max-height: 100%;
      height: auto;
      content: url('https://ennismorecurlingclub.com/data/135/style/curling logo enhanced.jpg');
      margin: auto;
      max-width: 100%;
      width: auto;
      max-height: 100%;
      height: auto;
   }

   img[id=bannerImage] {
      display: none !important;
   }

}


/* sticky menu styles*/
@media only screen and (min-width: 1196px){
.stickyNav {
    position: fixed;
    top: 0;
    z-index: 1000;
}}


/* this is to style the forms */
input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="checkbox"], input[type="radio"], textarea, select, option {
    border-radius: 4px;
    border: 1px solid #ACB0B5;
    font-size: 12px;
    margin:0 auto;
    padding: 4px;
}

input[type="submit"], input[type="reset"], input[type="button"], button {
    border-radius: 4px;
    border: 1px solid #ACB0B5;
    font-size: 12px;
    margin:0 auto;
    padding: 4px;
}

fieldset {
    border-radius: 4px;
    border: 1px solid #ACB0B5;
    font-size: 12px;
    margin:0 auto;
    padding: 4px;
}
.regLegend {
    font-weight: bold;
    font-size: 1.25em;
}
.regFieldset {
    border-width: 2px;
}
div.waiver_clause {
   width:95%;
   height:200px;
   border:1px solid #ccc;
   background:#f2f2f2;
   padding:6px;
   overflow:auto;
}
table.scm-wideScoreboard, table.scm-wideScoreboard th, table.scm-wideScoreboard td {
	border: 1px solid lightgray;
	border-collapse: collapse;
	padding: 3px;
}
table.scm-narrowScoreboard, table.scm-narrowScoreboard th, table.scm-narrowScoreboard td {
	border: 1px solid lightgray;
	border-collapse: collapse;
	padding: 5px;
}

#mainBody {
	display: flex;
	flex-direction: column;
}

nav {
	max-width: 100vw;
}


/* start of styles for stackable responsive block rows */
.rowOfBlocks {
    padding: 0.5em 0 0.5em 0;
}
.rowOfBlocksPlain {
}
    
.twoBlockRows {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
    grid-gap: 1em;
}
    
.twoBlockRowsPlain {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
    
.threeBlockRows {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
    grid-gap: 1em;
}

.fourBlockRows {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
    grid-gap: 1em;
}

.oneSectionBlock {
    border: thin solid lightgray;
    border-radius: 0.75em;
    grid-column: span 1;
    padding: 1em;
}

.oneSectionBlockPlain {
    grid-column: span 1;
}

.twoSectionBlock {
    border: thin solid lightgray;
    border-radius: 0.75em;
    grid-column: span 2;
    padding: 1em;
}

.threeSectionBlock {
    border: thin solid lightgray;
    border-radius: 0.75em;
    grid-column: span 3;
    padding: 1em;
}

@media only screen and (max-width: 767px) {     
    .twoBlockRows, .threeBlockRows, .fourBlockRows {
        grid-template-columns: 1fr;
    }

    .twoSectionBlock {
        grid-column: span 1;
    }

    .threeSectionBlock {
        grid-column: span 1;
    }
}
/* end of styles for stackable responsive block rows */



/* image caption style starts */
figure.image {
  display: inline-block;
  border: 1px solid gray;
  margin: 0 2px 0 1px;
  background: #f5f2f0;
}

figure.align-left {
  float: left;
}

figure.align-right {
  float: right;
}

figure.image img {
  margin: 8px 8px 0 8px;
}

figure.image figcaption {
  margin: 6px 8px 6px 8px;
  text-align: center;
}
/* image caption style ends */


.skipNavLink {
padding: 0.5rem;
position: absolute;
transform: translateY(-120%);
transition: transform 400ms ease-in;
background-color: #ffffff;
color: #808080;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
}
.skipNavLink:focus {
transform: translateY(0);
}

.practiceSchedule {
	 max-width: 100vw;
	 }
	 
	 @media only screen and (max-width: 768px){
	 
	 .practiceSchedule {
	 
	 overflow: scroll;
	 }
	 }