/* So the HTML5 structural tags work in older browsers */
article, aside, figure, figcaption, footer, header, nav, section {
    display: block;
}

/* brand colors:
#7e5aa5 purple
#199044 green
#FFFFEC  almost white
#fdfbce  pale yellow
#d3f3b4  light green
*/
/* the styles for the elements */
* {
	margin: 0;
	padding: 0;
}
html {
	background-color: #FFFFFEC;
} 

body {
    font-size: 87.5%; /* .875 * 16 px (default) = 14 px */
   /* width: 99%;*/
    margin: 5px;
	position:relative;
	max-width:1000px;
}

p, body, table, li, #blackthorn_expl_div p {
font-family:Arial, Helvetica, sans-serif;
}
 
body:focus > .popup_img {
	visibility:hidden;
}

/* page container and fixes a problem with dynamic margins with IE 10 */
#outerBorderOnly {
	border: 2px solid #199044;
	position:relative;
}

/* for small screen nav only */
.hamburger, .cross{
	visibility:hidden;
  	display:none;
	margin-left:8px;
}

/* prevent images from overflowing their containers */
.clearfix:after {
    content: "";
    clear: both;
    display: table;
} 

.menuBtn {
	position:relative;
	background-color: #4CAF50; /* Green */
    border: 2px solid blue;
    color: white;
    padding: 15px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	width:150px;
	cursor:pointer;
	background:linear-gradient(to top, #4CAF50 80%, white);

}
	
 .menuBtnRadius {
	border-radius: 24px;
 }

#alert {
	background-color:#FFFFEC;
	margin: 0 0  6px 25px;	
	/* background-image:url("images/snowfall_500.gif");  */
	color:#ff0000;
	font-family:Arial, Helvetica, sans-serif;
	/* text-align: center; */
	padding-top: 15px;
	border: 3px solid #7F1F55;
/*	height:35vh;*/
}

/* embedded images for the alert div */
.alert_img {
float:left;position:relative;height:95px;display:block;	top:0;
	-ms-transform:rotate(20deg); /* IE 9 */
	-webkit-transform:rotate(20deg); /* Opera, Chrome, and Safari */
	transform:rotate(20deg);
}
 
#alert_text {
float:left; width:91%;
}

#alert h1, #alert h2 {
	font-size:1.75em;
	color:#7F1F55;
	text-align:center;
/*	border: 3px solid #199044; */
}

#upperHeadline {
	font-size:2.5em;
}

/* center an image and then add text that's 20% down from top and centered */

.imgCentered {
	
	position:relative;text-align:center;color:#D6DB19;width:100%;
}

.imgCenteredTxt {
	position:absolute;
	top:20%;left:50%;
	transform: translate(-50%, -50%);
	font-size:2em;
	border:4px inset #D3C90C;
}

/* special comments counter div - the surrounding text and border*/
#comments_received {
	font-family: Comic Sans,Arial Black,sans-serif; 
	font-size:1.25em;  /* 1.25 * 14 px = 17.5 px */

/*	padding-left: 8px;  */
	padding-right: 8px;
	width:280px; 
	height: 260px; 
	/* if using a graphic underlay 
	height:200px; 	margin: 0 auto;
	position:relative; 	*/
	float: left;

	margin-bottom: 20px; 
	margin-top: 10px;
	 border: 2px groove #93C;
	border: none; 
}

/* special comments counter div - header text */
#comments_received h2 {
	font-size:1.25em;   /* 1.25 * 16 px = 20 px */
	color:black;
}

/* h2_1: first headline of two in comments_received container div, aligned left*/
#h2_1 {
	position:absolute;
	left: -5px;

	top:0px;
	z-index:15;	/* to float over a graphic */
	visibility:hidden;
}

/* 2nd headline of two in comments_received div, aligned right, below counter*/
#h2_2 {
	position:absolute;
	right: 15px;
	top:124px; /* h2_1 ends at 20 px + #value ends at 33px + 24 px = 54px, total = 74 px plus 30 px padding */
	z-index:15;	/* to float over a graphic */
	visibility:hidden;
}

/* animated text banner for header */
#rkidsHeader {
    background-color: black;
    display: flex;
    flex-direction: column;
    justify-content: center;
    letter-spacing: 15px;
    max-width:900px;
    min-width: 400px;
   /* width: 100%;*/
	height:400px;
} 

#picWelcomeNew_cntr1 {
width:100%;
	height:99%;
	height:380px;
	width:95%;height:95%;
top:10px;
}

#welcomeNewPlaceholder {
	height:90%;
	height:380px;
}

#picCead1 {
	position:absolute;
	top:7%;
	left:4px;
	width:95%;
	display:none;
	z-index: -3;
}

#imgCead1 {
	width:92%;
}



/* masked text */
#rkidsHeader h1 {
    display:inline-block;
    font-family: "Arial Black", Impact, Haettenschweiler, "Franklin Gothic Bold",  "sans-serif";
    font-size: 4rem;
    padding:0;
    text-align:center;
    max-width: 800px;
    width:100%;
    color: transparent;
    background: linear-gradient(90deg,
   #169b62  20%, #169b62 28%,
        #FFF 40%, #FFF 65%,
        #FF8200 70%
    );
    -webkit-background-clip: text;
    background-clip: text;
}

#rkid_title_upper  {   
    transform: translateY(0%)  translateX(0%);
    animation:  txtSlideUp 5.5s ease-in-out 2s ;
    animation-fill-mode:forwards;
    animation-direction:normal;
	animation-iteration-count: 5;
}

/* title text dancing */
#rkid_title_lower {   
    transform: translateY(-0%) translateX(5%);
    animation:  txtSlideDown 5.5s ease-in-out 2s;
    animation-fill-mode:forwards;
    animation-direction:normal;
	animation-iteration-count: 5;
	
}       

@keyframes txtSlideUp {
    0% {transform: translateY(0%) translateX(0%);}
    40%  {transform: translateY(-40%) translateX(-10%);}
    60%  {transform: translateY(80%) translateX(-0%);}
    80%  {transform: translateY(-30%) translateX(-12%);}            
    100% {transform: translateY(0%) translateX(0%);}
}

@keyframes txtSlideDown {
    0% {transform: translateY(-0%) translateX(5%);}
    40%  {transform: translateY(-100%) translateX(10%);}
    60%  {transform: translateY(-50%) translateX(0%);}
    80%  {transform: translateY(20%) translateX(12%);}
    100% {transform: translateY(0%) translateX(5%);} 
}

/* special comments counter div - image */
#comments_received img {
	float:none;

	/* use with text-numerals array */	
	/* width:200px;	position:absolute;
	top:-20px;
	left:25%; */
	/* use if just have numerals */
	width: 280px;
	top:-20px;
	left:35%;		
    z-index:5;	
}

/* special comments counter div - the counter value */
#value {
	 color: #199044; 
	 font-size:1.5em; /* 1.5 * 16 px = 24 px */
	 text-shadow: 3px 3px 3px #ACACAC;
/* use with graphic */
	 position:relative; /* to allow centering */
	 text-align:center;	 
	/*  top:33%; 33% * 100 px height = starts at 33 px down from top */
	 top:-165px;
	 z-index:25;	/* to float over a graphic */
	/* border: 2px solid #93C; */
	 /* use with numerals array */	 
	 font-style:normal;	
}

.spacer {
	height:20px;
	background-color:transparent;	
}

.bulletized {
	font-size:125%	
}

.centered {
 /*     width: 150px; */
    margin: 0 auto;	
	text-align:center;
}

/* no class delimiter for figcaption */
figcaption {
	line-height: 1.35;
	text-align:center;
}

/* the styles for the main content section "main" */
#main, .main {
	width: 72%;
	top:0;
	position:relative;
	display:block;
	float:none;
	left: 0;
}

#main p, .main_p {
	margin-bottom: .5em;
	font-size: 1.25em;
	color: #4b4b4b;
	line-height:1.5;
}

#main h1, .main h1 {
	color: #7e5aa5;
	font-size: 150%;
	padding: .5em 0 .25em;
	text-align:left;
	clear: both;
}

/* dark purple heading class comes betweeen h1 and h2 */
.h1a {
	font-size:1.4em;
	font-weight:500;
	color:#280037;
	margin: .5em 0 .25em .75em;
	text-align:left;
	clear: both;
}

.h1a_topBorder {
	border-top:2px solid #ACACAC; padding-top:20px;
	width:75%;margin:0px auto;		
}

#main h2, #main_sub_wrap h2 {
    font-size: 1.25em;
    color: #4b4b4b;
    line-height: 1.5;
    margin-top: .5rem;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0.75rem;
}

/* enlarged h2 for the main div */
#main .biggerH2, #main h2 .biggerH2 {
	font-size: 125%;
	margin-top: 1.3em;}

#main figure {
	float:left; 
	margin-right: 1.5em;
}
 
#main figcaption {
	display:block;
	clear:both;
	font-weight:bold;

	margin-bottom:0.5em; 
	/* margin-left:0.5em; */
	border-bottom:1px solid #199044;
}
 
/* anchors and hyperlinks */
#main a {
	color:#800D26;	
}

#main li {
	padding-bottom: .35em;
	margin-left:.5em;
}

#main blockquote {
	padding: 0 2em;
	font-style: italic;
}

/* triple column set on home page */
#main_sub_wrap {
	display:flex;
	/*align-content:center;*/
	justify-content: space-around;
	background-color:#fdfbce;
/*	width: 100%;*/
	max-width:100%;
	margin-bottom:25px;
	margin-left:10px;
	/* float:left; */
	
/*	padding: 0 1% ;*/
/*	font-size:1em;*/
	max-height:280px;
	overflow:hidden;
}
#main_sub_l {
	background-color:#fdfbce;
/*	border-right: 2px solid #199044;
	padding-left:1%;
	padding-right: 1%;*/ 
	margin-bottom:10px;
	margin-left:0;
	max-height:275px;
	width: 50%; /* when using array of 2 */
/*	width: 30%;   only if using array of 3 */
/*	float:left;*/
} 
#main_sub_m {  /* middle column, used only if in full array of 3 columns*/
	background-color:#fdfbce;		
/*	border-right: 2px solid #199044;
	padding-left:1%;
	padding-right: 1%;*/
	margin-bottom:10px;
	max-height:250px;	

	width: 30%; 
/*	float:left;*/
}
#main_sub_r {
	background-color:#fdfbce;
/*	border-left: 2px solid #199044;
	padding-left:1%;*/
	margin-bottom:10px;

	max-height:275px;
	width: 50%; /* when using array of 2 */	
	/* width: 30%;   only if using array of 3 */
/*	float:left;*/
}

.h2_purpleBG, #main .h2_purpleBG {
	background-color:#7e5aa5;
	color:#fdfbce !important;
	margin-top:25px;
	margin-bottom:20px;
}

.noMarginCollapse {
	clear:both;
	padding:1px 0;
}

.clearBothMargin20 {
	clear:both;margin-top: 20px;
}

/*  prevent embedded content from overflowing a parent div*/
.clearNoOverflow {
	clear:both;
	overflow:hidden;
	/* border:3px solid red; 	*/
	margin:10px 0;
}

/* mainly for Blarney clip art section images*/
#main .img_width, .img_width {
	width:120px;
	border: 4px solid black;
} 

/* Blarney articles */
.BlarneyArticle {
	clear:both;
	float:left;
	margin-bottom:2em;
	margin-top:1.5em;
}

/* gradient box */
.gradientBox {
	border:5px solid #7e5aa5;border-image-source: linear-gradient(darkgreen, #7e5aa5);
    border-image-slice: 20% ;
    margin: 10px 0 40px 10px;
	padding:10px;
	width: 95%;
}

.hr-like:after {
    height:1px;
    background:#ACACAC;
    width:66%;
    display:block;
    content:"";
    margin:24px auto;
}

.hr-like_before:before {
    height:1px;
    background:#ACACAC;
    width:66%;
    display:block;
    content:"";
    margin:24px auto;
}
.wood_floor_bg {
	background-image:url(../images/FloorHerringbone_.66a_2160w.jpg);
	background-repeat:no-repeat;
}

.cal_bg {
	background-image:url(../images/single-month-blank-calendar_0.5alpha.png);
	background-repeat:no-repeat;
}

#schoolMap { /*Google map embed */
width:90%;
}


#TblDances1 table, #TblDances2 table  {
	border:none;
	text-align:center;
}

#TblDances1 td, #TblDances2 td {
	padding: 0;	font-size:.8em;
}

#TblDances1 tr:nth-child(even), #TblDances2 tr:nth-child(even) {
    background-color: #fcefb3;
	color:#199044;
	font-weight:500; 
}

#TblDances1 tr:nth-child(odd), #TblDances2 tr:nth-child(odd){
    background-color: white;
	color:black;
	font-weight:500; 

}

#TblDances1 img, #TblDances2 img {
	width:40px;
	border: none;
	vertical-align:middle;
}


tr {
	 border-style:none;
	vertical-align:top;
}

td {
	border-style:none;
	vertical-align:top;
}

td, td p {
	padding-bottom: .5em;
	font-size:1em;
}

.icon, #rkid_cal .icon, .rkid_cal .icon {
	display:inline;
	border: none;
	width:20px;
	margin-left:1px;
	margin-right:5px;
	margin-top:5px;
}

/* alternating stripe tables */
#rkid_cal table {
	border: 2px solid black;
	text-align:left;
	border-collapse: collapse;
	padding: 10px 0 10px 0;	
}

table.rkid_cal {
	border: 2px solid black;
	text-align:left;
	 border-collapse: collapse;
	padding: 10px 0 10px 0;	
}

#rkid_cal th {
	text-align: center;
	
}

table.rkid_cal th {
	text-align: center;
}

#rkid_cal td { 
	padding:.5rem 0 0 .5rem;
	margin:0 0 5px 0;
	
}

.rkid_cal td  {
	padding:.5rem 0 0 .5rem;
	margin:0 0 5px 0;
}

#rkid_cal tr:nth-child(even), .rkid_cal tr:nth-child(even) {
	background-color:#FFFFFE;
	color:#199044;
	font-weight:500; 
	line-height:1.5;
	padding: inherit;
}

#rkid_cal tr:nth-child(odd), .rkid_cal tr:nth-child(odd) {
    background-color:#D6D6D6;
	color:black; 
	line-height:1.5;
	font-weight:500; 
	padding: inherit;
}

#rkid_cal tr:hover, .rkid_cal tr:hover, #rkid_cal tr:focus, .rkid_cal tr:focus {
/*	font-weight:700; */
	background-color:#DDF1C6;
}

.rkid_cal tr:hover, .rkid_cal tr:focus {
/*	font-weight:700; */
	background-color:#DDF1C6;
}

#rkid_cal th, .rkid_cal th {
	background-color:#fdfbce;
}

#rkid_cal img, .rkid_cal img {
	width:125px;
	border: 4px solid black;
}


/* Blarney table */
#blarney_table {
	display:block;
	float:left;
	width:95%;
	max-width: 800px;
	border: none;
}

.bt_col1 {
	width:20%;
	vertical-align:top;
	padding:.5rem;	
}

.bt_col2 {
	width:80%;
	vertical-align:top;
	padding:.5rem;
}

#blarney_table img {
	width:193px;
	border: 4px solid black;	
}


/* container div for text popup*/
#blackthorn_expl_cntr {
	display:inline-block;
	position:relative;
}

#blackthorn_expl_cntr img {
	width:150px;
}

/* trigger div for explanatory text popup */
#blackthorn_expl_icn {
	display:block;
	width:100%;
	position:relative;
}

#blackthorn_expl_icn_repl {
	display:none; 
	width:90%;	
}

#semesterCal_expl_icn {
	display:block;
	position:relative;
}

#semesterCal_expl_div
{
	display: block;
	visibility:hidden;
	padding:5px;
	
	background-color: #FFFF93 ;
	border: 1px solid black;
	position:absolute;
	top:10px; 
	z-index:50;
	/*height:680px;*/
} 

#semesterCal_expl_div p {
	padding-bottom: 10px;
	font-size:.9em;
}

/* semester calendar popup: selects sibling SemesterCal_expl_div div for pop up on hover/focus */
#semesterCal_expl_icn:hover > #semesterCal_expl_div, #semesterCal_expl_icn:hover ~ #semesterCal_expl_div, 
#semesterCal_expl_icn:hover  #semesterCal_expl_div, 
#semesterCal_expl_icn:focus ~ #semesterCal_expl_div,
#semesterCal_expl_icn:focus  #semesterCal_expl_div
{
	visibility:visible;
}


/* blackthorn explanation popup: selects sibling blackthorn_expl_div div for pop up on hover/focus */
#blackthorn_expl_cntr:hover > #blackthorn_expl_div, #blackthorn_expl_icn:hover ~ #blackthorn_expl_div, 
#blackthorn_expl_icn:hover  #blackthorn_expl_div, 
#blackthorn_expl_icn:focus ~ #blackthorn_expl_div,
#blackthorn_expl_icn:focus  #blackthorn_expl_div,
#blackthorn_expl_cntr:hover > #core_class_expl_div,
#blackthorn_expl_icn:hover ~ #core_class_expl_div,
#blackthorn_expl_icn:hover  #core_class_expl_div,
#blackthorn_expl_icn:focus ~ #core_class_expl_div,
#blackthorn_expl_icn:focus  #core_class_expl_div
{
	visibility:visible;
}

/* contained explanatory text div that pops up on hover or focus of container div */
#blackthorn_expl_div {
	visibility:hidden;
	padding:5px;
	background-color: #FFFF93 ;
	border: 1px solid black;
	position:absolute;
	top: 450px;
	left:-25px;
	z-index:50;
	width:520px;height:225px;
}

#blackthorn_expl_div p {
	padding-bottom: .75em;
	font-size:1.25em;
}

#core_class_expl_div
{
	visibility:hidden;
	padding:15px;
	background-color: #FFFF93 ;
	border: 1px solid black;
	position:absolute;
	width:80%;
	top:10px;
	height:300px;
	overflow-x:hidden;
	overflow-y: auto;   /* scrollable vertically*/
	z-index:50;
	text-align:left; 
} 

#core_class_expl_div p {
	padding-bottom: 10px;
	font-size:.9em;
}
#senesterCal_expl_icn {
	display:block;
	position:relative;
}

#other_dances td {
	border-bottom: 2px solid #199044;
	padding-right: 10px;
	padding-left: 10px;
}

#other_dances th {
	border:none;
	border-bottom: 2px solid #199044;
	text-align:left;
	color:#666;
	padding-left: 10px;
}

#dances th {
	text-align:left;
	color:#666;
}

#dances td {
	vertical-align:middle;
}

#dances td  {
	width:20px;
	margin:0;
	padding: 0;
}

#dances td  img {
	width:20px;
	margin:0;
	padding: 0;
	margin: 2px 0 2px 10px;
}

#dances tr:nth-child(even) {
    background-color: #199044;
	color:white;
}

.white {
	color:white;
}

#intro {
	background-color:#199044;
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	padding: 20px 10px 15px 10px;
	margin: 0px;
	border-right:#199044;
	border-right-style:solid;
	font-size:1.2em;
	line-height:150%;

}

.emphasis_bg_1
{
	background-color:#199044;
	color:#fff;
	text-align: left;
	padding: 6px;
	margin: 0px;
	line-height: 1.8;
	border-right:black;
	border-right-style:solid;
}

#intro_centered {
	background-color:#292929;
	color:#fff;
	font-size:1.25em;
	text-align: center;
	padding: 15px 10px 15px 10px;
	margin: 0px;
	border-right:#199044;
	border-right-style:solid;
	background-image: -moz-linear-gradient(
	    0deg, #199044 0%, #187339 5%, #12582c 10%, #333 15%, #292929 25%, #292929 75%, #333 75%, #12582c 90%, #187339 95%, #199044 100%);
	background-image: -webkit-linear-gradient(
	    0deg, #199044 0%, #187339 5%, #12582c 10%, #333 15%, #292929 25%, #292929 75%, #333 75%, #12582c 90%, #187339 95%, #199044 100%);
	background-image: -o-linear-gradient(
	    0deg, #199044 0%, #187339 5%, #12582c 10%, #333 15%, #292929 25%, #292929 75%, #333 75%, #12582c 90%, #187339 95%, #199044 100%);
	background-image: linear-gradient(
	    0deg, #199044 0%, #187339 5%, #12582c 10%, #333 15%, #292929 25%, #292929 75%, #333 75%, #12582c 90%, #187339 95%, #199044 100%);
}

/*abut the hlinx */
#intro_centered a, #intro a {
margin-left: 0;color:#FFFF93; 
}

#intro img {
	width:250px;
}

#intro  #hairy_eye {
	border:2px solid #199044;width:40px;margin:0;display:inline; position:relative; top:5px;padding:0;
}

a:focus, a:hover, #main a:hover, #main a:focus{
	font-style: italic;
	color:rgba(42,149,249,1.00);
}

/* the styles for the slide show */

.fadein {
/*	position:relative; 
	width:120px;
	height:50px;
	padding: 0 30px 20px 50px;
	*/
}

.fadein img {
	 position:absolute; 
}

/* the styles for the header */
header {
	border-bottom: 5px solid #199044;
    background-color:black; 
	color:#7e5aa5;
	/*padding: 1em 0 2.5em 0;
	background-image: -moz-linear-gradient(
	    20deg, #7e5aa5 0%,  white 30%, #fffded 70%, #7e5aa5 100%);
	background-image: -webkit-linear-gradient(
	    20deg, #7e5aa5 0%,  white 30%, #fffded 70%, #7e5aa5 100%);
	background-image: -o-linear-gradient(
	    20deg, #7e5aa5 0%,  white 30%, #fffded 70%, #7e5aa5 100%);
	background-image: linear-gradient(
	    20deg, #7e5aa5 0%,  white 30%, #fffded 70%, #7e5aa5 100%);*/
}

header h1 {
	color: #199044;
	display:inline-block;
	padding-left: 100px;
	font-size: 3em;

	/* position:absolute; 
	left: 400px;
	top:25px
	*/
}


@keyframes hdRkids {
	0% {color: #199044;}
	25% {color:#BBA2D5;}
	50% {color:#7e5aa5;}
	75% {color:#BBA2D5;}
	100% {color:#199044;}	
}

@-webkit-keyframes hdRkids {
	0% {color: #199044;}
	25% {color:#BBA2D5;}
	50% {color:#7e5aa5;}
	75% {color:#BBA2D5;}
	100% {color:#199044;}	
}

@-moz-keyframes hdRkids {
	0% {color: #199044;}
	25% {color:#BBA2D5;}
	50% {color:#7e5aa5;}
	75% {color:#BBA2D5;}
	100% {color:#199044;}		
}

/* animate the lower case letters in the header h1 text */
.hdLc {
/*	display:inline-block;
	margin:0; padding:0; */
	-webkit-animation: hdRkids 15s 10 alternate;
	-moz-animation: hdRkids 15s 10 alternate;
	-animation: hdRkids 15s 10 alternate;	
}

/* white to black twisted gradient */
.whiteGradBar {
	background-image: -moz-linear-gradient(
	     4deg, white 0%,  #B1B1B1 5%, #2B2B2B 50%,  #B1B1B1 95%);
	background-image: -webkit-linear-gradient(
	    4deg, white 0%,  #B1B1B1 5%, #2B2B2B 50%,  #B1B1B1 95%);
	background-image: -o-linear-gradient(
	     4deg, white 0%,  #B1B1B1 5%, #2B2B2B 50%,  #B1B1B1 95%);
	background-image: linear-gradient(
	  	4deg, white 0%,  #B1B1B1 5%, #2B2B2B 50%,  #B1B1B1 95% );
}

header h1 sub {
	font-size:175%;	
}

header h2 {
	font-style: italic;
	padding-left:7em;
}

.shadow {
	text-shadow: 2px 2px 2px #666;
}

.shadow_dark {
	text-shadow: 1px 2px black;
}

ul.circle {
	list-style-type:none;
	list-style-image:url(../images/ring-of-kerry_inner2_tsp_30x30px.png);
	margin: 0 0 0 1em;

/*		background:url(../images/ring-of-kerry_inner2_tsp_25x25px.png) no-repeat 0 50%; */
}

ul.circle li {
	margin: 1.00em 0 0 1em;
    padding: 0 0 0 0;
}

ul.inner2, .inner2 {
	list-style-type: none;
	padding: 0 0 10px 10px;
}


.inner2 li {
	background:url(../images/ring-of-kerry_inner2_tsp_25x25px.png); 
 	background-repeat: no-repeat; 
    background-position:-3px -2px;
	background-size:25px;
    margin: .75em .25em 0 0;
    padding: 0 0 0 20px;
	font-size:1em;
}

/* Our Mission list */
ul.mission_list {
	list-style-type: none;
	padding: 0 0 10px 10px;
}

ul.mission_list li {
	background:url("../images/bulletpt_woven-tri_tsp.png");
 	background-repeat: no-repeat; 
    background-position:-3px -2px;
	background-size:25px;
    margin: .75em 0 0 0;
    padding: 0 0 5px 30px;
	font-size:125%;
	color:#fff;
}

ul.equipment {
	margin: 0;
	list-style-type:square;	
}


/* all anchors and hyperlinks: no underscores */
a
{
	text-decoration:none;	
}

nav a.current { 
	color: yellow;
	text-decoration:none;
}

/* aside1 is used for medium and wide format screens */
#aside1Trigger {
    display: block;
    position: fixed;
    width: 75px;
    padding: 2px;
    transform: rotate(90deg);
    border-radius: 10px 10px 0 0;
    top: 300px;
    left: -28px;
    text-align: center;
    background-color: #199044;
    z-index: 100;
    color: white;
}

#aside1TriggerWallCal {
	display: block;
	position:fixed;		
	width: 75px;
	padding:2px;
	transform: rotate(90deg);
	border-radius: 10px 10px 0 0 ;
	top: 300px;	
	left: -28px;
	text-align: center;
	background-color:#199044;    
	z-index: 100;
	color:white;
}
	
#aside1 {
display: block;
position:fixed;		
width: 330px;
top: 150px;	
left: -345px;
z-index: 200;
float: none;
background-color:#1B1B1B;
overflow-y: scroll;
max-height:50rem;	
}

#aside1WallCal {
display: block;
position:fixed;		
width: 400px;
top: 250px;	
left: -390px;
z-index: 200;
float: none;
background-color:#1B1B1B;
overflow-y: scroll;
max-height:40rem;
}

#aside1:hover, #aside1WallCal:hover, #aside1:focus, #aside1WallCal:focus{
	left:0;
}

#aside1Trigger:hover ~ #aside1, 
#aside1Trigger:focus ~ #aside1,
#aside1TriggerWallCal:hover ~ #aside1WallCal,
#aside1TriggerWallCal:focus ~ #aside1WallCal 
{
	left:0;
}

/* aside is for supplemental info about the "main" section, for small screens */
aside {
	position:relative;
	width: 28%;
	float: left;
	background-color:#199044;
	background-color:#292929;
	max-width: 250px;
}

aside h1 {
	color: #FFFFFF;
	font-size: 150%;
	padding: .5em 0 .25em;
}

aside h2 {
	font-size: 120%;
	padding-bottom: .25em;
	clear:both;
}

aside a {
	margin-left:1em; 
	margin-bottom:1.5em; 
}

aside img {
/*	padding: .5em 0 .5em 0; */
	display: block;
    margin-left: auto;
    margin-right: auto;
	width: auto;
	max-width:95%;
}

aside a img{
	position:relative; top:-5px;
/*	padding: 0; */
}

/* for welcome new members logo swapping and centering the images --  restore to 185px when Introducing Our New Logo .. is removed*/
aside #logo_swap {
	position:relative;

	height:225px;
	margin:0 auto;
	width:100%;
/*	border-right-style:solid;
	background-color:#199044; */
	background-color: black;
	z-index: 2;
	overflow: hidden;
}

#logo_swap img {
	width:100%; border: none;
}

#picLogo {
	padding: .5em 0 .5em 0; 
	position:relative;width:95%;margin:0 auto;
	display:none; 
}

#picWelcomeNew_cntr{
	position:absolute;display:block;background-color: black; overflow:hidden;
	margin: 0 auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
width:100%;
}

#picWelcomeNew_shell {
	position:relative; display:block;
	z-index:10;
	height:100%;;margin: 0 auto; 
	background-color: black; 
}

#picCead {
	position:absolute;top:7%;left:10px;
	width:90%;
	display:none;
	z-index: -3;
}

#picNames {
	position:absolute; display:block;z-index:-3;margin: 0 auto;right:0;top:70%;
}

aside ul {
	list-style:disc;
	color: #FF9;
	margin-left:10px;
	padding-left:10px;
}

aside li a {
	color: #FF9;
	margin-left: 0;
}

aside p {
	margin: 1em 0 1em 2em;
	font-size:1.0em;
	font-weight:300;
	color:#FFFFFF;
}

.cal_icn {
border:2px solid #199044;width:32px;padding:0; display:inline; position:relative; top:7px;
}

.noborderImg {
	width:60px;border:none;margin:0 20px 0 20px;display:inline; position:relative; top:5px;	
}

#small_gallery {
	margin: 0 50px 0 10px; 
	position:relative;
/* 	background-image:url(../images/BG_gradient_G-g.png); */
	background-color:#FFFFEC;
	border-radius:30px 30px 30px 30px;
	/* border: 1px solid #4F3766; */
	border: none;
	max-width: 640px;
	z-index:5;
	height:400px;
	overflow:hidden;
}

#picOne, #picTwo, #picThree, #picFour, #picFive, #picSix, #picSeven, #picEight, #small_gallery img {
	position:relative;
	display: none;
	margin-top: 5%;
	margin-bottom: 5%;
	width:90%;
	max-width:500px;
	border: 4px groove #199044;
	margin-left:4%;
	z-index:15;
}

#picFive {
	max-width:450px;
}


#ivnPic1 {
	display:block;
	width:auto;
	max-width:500px;
	border: 4px groove #199044;
	margin: 20px auto 20px auto;
/*	position: absolute; */
}

.bgGreenGrad {
	border-bottom: 5px solid #199044;
	border-top: 5px solid #199044;
	padding: 1em 0 2.5em 0;
	background-image: -moz-linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #D6EDD1 100%);	
	background-image: -webkit-linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #D6EDD1 100%);	
	background-image: -o-linear-gradient(
		0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #D6EDD1 100%);	
	background-image: linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #D6EDD1 100%);	
}

.greenFrame {
	position:relative; display:inline; font-size:1.25em;padding:15px; text-align:left;float:left;background-color:#fdfbce;color:#1A4D0B;border:8px solid #246610;margin:0 0 20px 20px;max-width:85%;
}

#greenFrame {
	position:relative; display:inline-block; font-size:1.25em;padding:15px; text-align:left;background-color:#1A4D0B;color:white;border:8px solid #246610;margin:0 0 20px 60px;
}
#greenFrame, .greenFrame a:link { color:#5AEFE3;} /* unvisited */
#greenFrame, .greenFrame a:visited { color:#F4ADAE;}
#greenFrame, .greenFrame a:hover
{color:rgba(42,149,249,1.00);} 
#greenFrame, .greenFrame img {max-width:130px;}

.centered_img {
	padding: 0;
	display: block;
	margin: 0 auto;
 /*   margin-left: auto;
    margin-right: auto;  */
	width: 75%;
	border: 4px solid black;
}

/* for images intended to change border color on hover*/
.flash_border img {
	border:4px solid black;	
}

/* on hover or tap, flash the image border if it's in the flash_border class */
.flash_border:hover, .flash_border:focus
{
	border: 4px solid #199044;	
}


/* for unordered lists */
.square {
	padding: 0 0 .5em .5em;
	list-style:square;
	font-size:75%;
}

.square li {
	background-image:none !important; /* need important to override the ul.inner2 flowdown of the RKID logo bullet point image*/
    margin: 10px 0 2px 20px !important;
    padding: 0 !important;
}

/* bottom_strip for additional information spanning entire page */
#bottom_strip {
	clear:both;	
	border-top: #199044 solid 2px;
	padding: 1em 0 1em 0;
}

#bottom_strip ul {
	margin-left:1.5em;
}

/* the styles for the footer */
footer {
	border-top: 3px solid #199044;
/*	border-bottom: 3px double #800000; */
	clear: both;
	
}

footer p {
	padding: 1em 0;
	text-align: center;
	font-size:12px;
}


/* rounded rectangle div */
.curvykorner {
	background:#d3f3b4;  
	z-index:50; 
	/* max-width: 750px;  min-width:580px; */
	width:80%;
	/*margin: 0 10px 0 30px; */
	margin:0 auto;
	/*padding: 0 5px 0 10px; */
	background-image:url(../images/BG_gradient_G-g.png);
	border-radius:30px 30px 30px 30px;
	border: 1px solid #4F3766; 
}

/* use when images are to be left aligned within curvykorner in large-size browser windows*/
.curvykorner_imgLeft {
float:left;margin-right:20px;;padding:0; display:block;width:60px;top:-5px;
}

/* replacement image for h1 in curvykorner */
.curvykorner_imgHeading {
margin:10px auto; display:block; 
width:262px;border: 1px solid #4F3766;
}

/* restaurant popup: containing div */
.restaurant_cntr {
	position:relative;
	top:-23px;left:40px;
	width:40px; height:35px;
}

/* restaurant popup: contained restaurant div that pops up on hover/focus*/
.restaurant
 {
	visibility:hidden;
	background-color: #FFFF93 ;
	border: 2px solid black;
	position:relative;
	z-index:50;
	width:230px;height:80px;
	font-size:.8em;
}

/* restaurant popup: icon */
#rkid_cal #icn_restaurant, .rkid_cal #icn_restaurant {
	display:inline;
	border: none;
	width:20px;
	margin-left:1px;
	margin-right:5px;
	margin-top:25px;
}

/* image div popup container */
.popup_cntr_img {
	position:relative;
	display:block;
	border: none;
	width:160px;
	margin-bottom:0.75em;
	margin-left: 20px;
}

/* image div popup: contained image div that pops up on hover/focus of the container's image */
.popup_img {
	visibility:hidden;
	background-color: #FFF;
	border: 4px solid black;
/*	position:relative;top:-115px;left:-130px; */
	position:absolute;top:5px;left:-30px;
	z-index:50;
	width:400px;
}

/* img set for classes within ID blarney_table, override img for blarney_table */
#blarney_table .popup_img img, #blarney_table .popup_cntr_img img{
	width:100%;
}

.restaurant_cntr:hover > .restaurant, .restaurant_cntr:focus > .restaurant 
{
	visibility:visible;
}


/* pop up larger version of image when container is hovered-over, gets focus, or is tapped/clicked.  Latter selector is necessary for older iPhones. Image should revert to hidden when loses focus/hover/unclicked */
.popup_cntr_img:hover > .popup_img, .popup_cntr_img:focus > .popup_img {
	visibility:visible;
}


/*
#icn_restaurant:hover + #restaurant {
	visibility:visible;
} */

/* rotate an image */
.rotamatic
{
	-ms-transform:rotate(7deg); /* IE 9 */
	-webkit-transform:rotate(7deg); /* Opera, Chrome, and Safari */	margin:2em;float:left;
	transform:rotate(7deg);
}

#Syllabus_Thinker {
	margin:10px 20px 0 20px;float:left;height:220px; border:2px solid #7e5aa5;visibility:hidden;
}

/* three columns of adjacent list items as image containers */
/* First, the overall DIV container. Turn border off for small format devices  */
#TriCol {
	border:1px solid black;margin:2px;
}

/* Second, the class for the DIV-contained LI elements  */
.TriCol {
	float:left; width:30%; padding:1%; display:inline-block;
}

/* Last, for the images in the LI elts  */
.TriCol img {
width:100%;
}

.boxL {
	position:relative;
	float:left;
	border: 1px solid rgba(6,183,4,1.00) ;margin-right:5%;
	margin-bottom: 30px;
	font-size:1.2em;
	width:45%;
	padding-left:8px;
}
 
.greenBG {
 background-color:#d3f3b4;
 margin-left:-5px;
}

.boxR {
	position:relative;
	float:left;
	border: 1px solid rgba(6,183,4,1.00) ;
	margin-bottom: 30px;
	font-size:1.2em;
	width:45%;	
	padding-left:8px
}

.boxImg {
float:right;width:30px;padding:0;position:relative;top:-25px;
margin-bottom:-25px;
}


/* images for a table */
.tblImgRight, #TblDances1 .tblImgRight, #TblDances2 .tblImgRight {
	width:50px;
	margin-left:15px;
}

.tblImgLeft, #TblDances1 .tblImgLeft, #TblDances2 .tblImgLeft {
	width:50px;
	margin-right:15px;
}


/* for YouTube iframe widths */
.YT_iframe {
width:400px; height:250px;
}

/*  for rotating through x images  */
#rotating-item-wrapper {
    position: relative;
    width: 130px;
    height: 168px;
}
.rotating-item {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}

/* border and shadow around award images */ 
.citation-shadow {
	width: 95%;margin-left:23%;
    padding: 0px 2px 0px 0px;
    border: 1px solid #BFBFBF;
    background-color: white;
	-webkit-box-shadow: inset 10px 10px 5px #aaaaaa;
    -moz-box-shadow: inset10px 10px 5px #aaaaaa;
   -ms-box-shadow: inset 10px 10px 5px #aaaaaa;
    -o-box-shadow: inset 10px 10px 5px #aaaaaa;	
    box-shadow: 10px 10px 5px #aaaaaa;
}

/* search button rollover */
#srchRoll  {
	display:block;
	margin:0 auto;
	background-image: url("/images/magGlassShamrock3_roll.png");
	background-repeat:no-repeat;
	width:100%; 

	/* text-indent:-15000px; */
	overflow:hidden;
	line-height:31px;
}

#srchRoll:hover {
	background-position: 0 -31px;
}

.textOverImage {
display:block;
width:75%;padding:10px;	
margin-left:10%;
text-align:center;
}

/* make anchors or other elements stand out against surrounding text */
.superA
{
	font-size:110%;font-weight:bold; color:#245BBD;
}

/* accordion control wrapper and enclosed iframes */
#accWrapper {
width:600px;height:570px;
}

/*accordion header font */
#accCurriculum h3, #accCurriculumCurrent h3, #acc1 h3, #acc2 h3 {
	font-size:2em; float:left;width:95%;margin-top: 2px;
}

/* small italicized trailing text for accordion h3 header */
.accSmall {
	display:inline-block;font-size:.7em;font-style:italic;margin-left:5px;margin-top:15px;
}	

/* jQuery accordion styling */
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin: 2px 0 0 0;
	padding: .3em .5em .5em .5em;
	min-height: 0; /* support: IE7 */
	font-size: 100%;
    border:1px solid #FDF8E4;
    background-color: #F4D096;
    color:#7e5aa5;
    border-radius:15px;
}

.ui-accordion .ui-accordion-content {
	padding: 1em .5em;
	overflow: auto;
    background:#FDF8E4;
    border: 1px solid black;
    border-top: 0;
    border-radius:8px;
    width:95%;
    margin-left:2px;
}

.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	position: absolute;
	left: .5em;
	top: 50%;
	margin-top: -8px;
}

.ui-accordion .ui-accordion-icons {
	padding-left: 2em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
	padding-left: 2em;
}
 
.ifrm {
width:97%; height:580px;
}

/* circle, one use is to insert face images in the accordion control */	
.circleFace {
	display:inline-block;
	border-radius: 50%;
	width: 45px;
	height: 45px; 
	border:3px solid #199044;float:right;overflow:hidden;margin-top:0px; margin-bottom: -5px; margin-left:5px;z-index: 15;
	/* width and height can be anything, as long as they're equal */
}

.circleFace img {
	display:block;width:80%;margin-left:5px;
}

.shoesOverIframe {
	position:absolute;z-index: 10;margin-top:-540px;margin-left:-16px;
}


.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 150; /* Sit on top */

    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;

    width: 100%; /* Full width */
	max-width: 800px;
    height: 100%; /* Full height */
    overflow:hidden; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
}

/* auto-animate the modal content */
@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  50% {
    transform: translateX(30%);
  }	
  100% {
    transform: translateX(0);
  }
}

@keyframes shrink {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}

/* Modal Content */
.modal-content {
    margin: auto;
    padding: 20px;
    border: 10px solid #4CAF50;
    width: 81%;

	/* two chained animations, first one uses slideInFromLeft keyframes for 2s duration, ease-out, 0.5s delay, 1 iteration, name of keyframes group, second one uses shrink keyframes group, delayed by 18s.  In the HTML, setTimeout allows 20s total for this animation sequence before the parent div is hidden.
    animation: 6s ease-out 0s 1 slideInFromLeft, 2s ease-out 18s 1 shrink; 
	*/
/*
	background-color: #4CAF50;
 	color:#171516;
	background-image: -moz-linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #4CAF50 100%);	
	background-image: -webkit-linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #4CAF50 100%);	
	background-image: -o-linear-gradient(
		0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #4CAF50 100%);	
	background-image: linear-gradient(
	    0deg, #D6EDD1 0%,  #9EC991 30%, #bEF1B9 70%, #4CAF50 100%);
    text-align: center;
	*/
     border-radius: 24px;
	
	background-image: url('/images/FloorHerringbone1200w.jpg');
	
}

.modal-content h1 {
	text-align: center;
	font-size:300%;
	 /* font-style: italic; */
}

.modal-content h2 {
	text-align: center;
	font-size:200%;
	/* font-style: italic; */
	margin-top:15px;
}

/* The Close Button */
.close {
    color: #B5B5B5;
    float: right;
    font-size: 28px;
    font-weight: bold;
	margin-right:10px;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

/* elliptical button frames */
.ellipBtn1 {
	position:relative;width:40%;text-align:center;margin:15px 8px 25px 8px;padding:0px 5px 0px 5px; color:white; border: 4px solid green; border-radius: 50px;
	background:linear-gradient(to top, #4CAF50 80%, white);
}

.ellipBtn1Text {
	font-size:75%;font-weight: 600; background-color:#4CAF50;color:#FFFFEC;border:none;position:relative;display:inline-block;margin:10px 0 10px 0;
}

/* visible container for the Add to Outlook info div, pops it  up onhover or onfocus	*/	
.outlook_cntr {	

	left:5px;	
	position:relative;
	width:30px; height:30px;	
	}

.outlook_cntr:hover > .outlook_info, .outlook_cntr:focus > .outlook_info
{
	visibility:visible;
}	

/* popup with with Add to Outlook Calendar info */
.outlook_info 
 {
	visibility:hidden;
	text-align: center;
 	width:200px;	 
	background-color: #FFFF93 ;
	border: 1px solid black;
	position:relative;
	z-index:50;
	
	font-size:.76em;
	top:-10px;
	left:70px;
	padding:5px;
}


/* Add to Outlook calendar button */
.printBtn {  
	background-color: #4CAF50; /* Green */
    border: 2px solid blue;
    color: white;
	top:-40px;
    padding: 5px;
    text-align: center;
    text-decoration: none;
    display: block;
    font-size: 0.7em;
	width: 125px;
}
 .printBtnRadius {
		  border-radius: 24px;
 }

/* Apply These Changes button */
#btnApplyChanges {
	background-color:#e4e4d4;
	cursor:pointer;
	color:black;
	padding:5%;
	margin-top:20px;
}

/* Apply These Changes Power On image button */
#btnApplyChangesPowerOn {
	position:relative;
	left:-10px;
	margin:10px 0 20px 0;
	width:100%;
}

.search-box,.close-icon,.search-wrapper {
	position: relative;
	padding: 10px;
}
.search-wrapper {
	width: 90%;
	margin: 20px 0 15px 5px;
}
.search-box {
	width: 60%;
	border: 1px solid #ccc;
  outline: 0;
  border-radius: 15px;
	float:left;
}
.search-box:focus {
	box-shadow: 0 0 15px 5px #b0e0ee;
	border: 2px solid #bebede;
}

/* close button */
.close-icon {
	position: relative;
	float:left;
	vertical-align: middle;
  	outline: 0;
 
	display: inline-block;
	width: 25px;
	height: 25px;
	
	background-color: #FA9595;
	z-index:5;
	margin-left: 10px;
	top: 0px;
	bottom: 0;

	padding: 2px;
	border-radius: 50%;
	text-align: center;
	color: white;
	font-weight: normal;
	font-size: 12px;
	box-shadow: 0 0 2px #E50F0F;
	cursor: pointer;
}
.close-icon:after {
	content: "X";  /* plop in the close button text after the styling is done or it won't appear */
}

/* for site search control on home page */
.siteSearchButton {
	float:left;width:25px;margin:0 5px 0 5px;top:3px;	
}

/* image fade in */
	.fade-in {
  animation: fadeIn ease 20s;
  -webkit-animation: fadeIn ease 20s;
  -moz-animation: fadeIn ease 20s;
  -o-animation: fadeIn ease 20s;
  -ms-animation: fadeIn ease 20s;
}
@keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-moz-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

/* happening soon slider */
.sliDiv {margin:0 0 25px 0;overflow:hidden;} .sliDiv li {background:none;clear:both;margin-bottom:30px;padding:5px;}
.sliDiv li {background:none;padding:0 0 15px 0;clear:both;margin-bottom:30px;}
.sliDiv li img {max-height:80px;margin-right:10px;float:left;max-width:30%;}