@charset "utf-8";
/* CSS Document */

* {box-sizing: border-box;} 
/*
* {box-sizing: content-box;} 
*/

html{margin:0; padding:0;}

body{margin:0; padding:0; color:#222222; font-family:'Exo 2', Verdana, Arial, Helvetica, sans-serif; background:#eee url(bg.jpg) repeat; font-size:18px;}

body a {color:#35b727; text-decoration:none}
body a:hover {color:#94481a; text-decoration:underline}

.w3-dark-red {color:#900 !important;}

#section1 {width:100%; background-color:#fff; text-align:center;}
.insidesection {margin: 0px auto; max-width:1111px; }
.insidesection img {width:100%;}
#section2 {width:100%; text-align:center; padding: 65px 25px;}
#section3 {width:100%; background-color:#fff; text-align:center; padding: 65px 25px;}
#section4 {width:100%; text-align:center; padding: 65px 25px;}
#section5 {width:100%; background-color:#fff; text-align:left; background: url('home3b.jpg') 30%,50% / cover no-repeat; background-attachment:fixed; color:#fff;}
#section6 {width:100%; text-align:center; padding: 65px 25px;}
#section7 {width:100%; text-align:center; padding: 65px 25px;}
#section8 {width:100%; background-color:#fff; text-align:center; padding: 65px 25px;}
#section9 {width:100%; text-align:center; padding: 65px 25px;}
#section10 {width:100%; text-align:center;}
#section11 {width:100%; background-color:#fff; text-align:center; padding: 65px 25px;}
#section12 {width:100%; text-align:center; padding: 42px 8px;}
.insidesection12 {margin: 0px auto; max-width:1200px; display: flex; flex-wrap: wrap; justify-content: center; }

.polaroid { width:275px; display:inline-block; *display: inline; vertical-align:top; }


.shadow1 {text-shadow: 2px 2px 4px #000, 0px 0px 12px #111;}
.shadow2 {text-shadow: 2px 2px 4px #000, 0px 0px 12px #111, 0px 0px 48px #000, 0px 0px 20px #000, 0px 0px 10px #000, 0px 0px 5px #000;}
.shadow3 {text-shadow: 2px 2px 4px #000, 0px 0px 12px #111, 0px 0px 48px #000, 0px 0px 20px #000, 0px 0px 10px #000;}
.theoverlay {width:100%; height:100%; background-color:rgba(0,0,0,0.30); padding: 65px 25px;}

.headingspecial2 { font-family:"Montserrat-SemiBold", "sans-serif"; letter-spacing: -2px; line-height: 110%; }
.bigicon {font-size: 65px; margin:40px 0px 15px 0px;}
.ddd { box-shadow: none; background-color: transparent;
	transition: box-shadow 3s ease-out, background-color 1s linear; }
.ddd:hover { background-color:#fff; 
	box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; }

.firstliner {font-family:"SofadiOne-Regular", sans-serif; font-size:32px; padding-top: 24px;}
.secondliner {font-family:"Oswald-SemiBold", sans-serif; font-size:32px; margin-top:-16px;}
.thirdliner {font-family:"Montserrat-Black", sans-serif; font-size:42px; color:#555; margin-top: -12px;}
.fourthliner {font-family:"Caveat-Regular", sans-serif; font-size:36px; color:#900; margin-top: 24px; line-height:105%;}
.fifthliner {font-family:"Marcellus-Regular", serif; font-size:24px; line-height:120%;}


/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 15; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #111; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 18px;
  color: #f1f1f1;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #818181;
	font-size: 24px;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
  transition: margin-left .5s;
}

#main2 {
  /* 
  background-color: rgba(0, 0, 0, 0.4);
  background:rgba(255,255,255,0.5);
  */
  opacity:    0.75; 
  filter: alpha(opacity=65);
  -moz-opacity: .65;
  
  background: #000; 
  width:      100%;
  height:     100%; 
  z-index:    10;
  top:        0; 
  left:       0; 
  position:   fixed; 
  display: none;
}

#container { width: 100%; min-height: 400px; margin: 0px auto; } 
#container2 { width: 100%; min-height: 400px; }


/* Style the links inside the sidenav */
#mySidenavhover a {
  position: fixed; /* Position them relative to the browser window */
  right: -80px; /* Position them outside of the screen */
  transition: 0.3s; /* Add transition on hover */
  padding: 15px; /* 15px padding */
  width: 100px; /* Set a specific width */
  text-decoration: none; /* Remove underline */
  font-size: 20px; /* Increase font size */
  color: white; /* White text color */
  border-radius: 5px 0px 0px 5px; /* Rounded corners on the top right and bottom right side */
  border:1px solid #ccc;
  box-shadow: -4px -4px 7px -3px rgba(0,0,0,0.75);
  z-index:9999;
}

#mySidenavhover a:hover {
  right: 0; /* On mouse-over, make the elements appear as they should */
}

/* The about link: 20px from the top with a green background */
#hover1 {
  top: 220px;
  background-color: #764643;
}

#hover2 {
  top: 270px;
  background-color: #205340; 
}

#hover3 {
  top: 320px;
  background-color: #cc4156; 
}

#hover4 {
  top: 370px;
  background-color: #5a6583; 
}





/*For NAVBAR*/
#ytonavbar3 {background-color:#0f1f50 !important;}
#ytonavbar3 .nav-link {color:#e3ed4a;}
#ytonavbar3 .nav-link:hover {color:#fff; text-decoration:none; background-color:#1b1b9f;}
#ytonavbar3 .dropdown-header {color:#fff; background-color:#1b1b9f;}
#ytonavbar3 .dropdown-item:hover {color:#222; text-decoration:none; background-color:#b4c4f5;}
#ytonavbar3 .dropend > .nav-link {color:#000;}
#ytonavbar3 .dropend > .nav-link:hover {color:#fff; text-decoration:none; background-color:#809df1;}
#ytonavbar3 .dropstart > .nav-link {color:#000;}
#ytonavbar3 .dropstart > .nav-link:hover {color:#fff; text-decoration:none; background-color:#809df1;}

.dropdown-menu-end {right:0;left:auto;}


/*FOR OPENING DROPDOWN ON NAVBAR ON HOVER, RATHER THAN ON CLICK*/
/*
.dropdown:hover>.dropdown-menu, 
.dropend:hover>.dropdown-menu, .dropstart:hover>.dropdown-menu {
  display: block;
  margin-top: .1em;
  margin-left: .1em;
}
*/
.dropend:hover>.dropdown-menu, .dropstart:hover>.dropdown-menu {
  display: block;
  margin-top: .1em;
  margin-left: .1em;
}


/*FOR ADDDING TRANSITION ON THE OPENING OF THE DROPDOWN ON THE NAVBAR*/
/*
.dropdown .dropdown-menu {
  -webkit-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
  display: block !important;
  transform: scale(0);
}
.dropdown .dropdown-menu.show{
  transform: scale(1);
}
*/
/*
.dropdown .dropdown-menu {
    display: block;
    opacity:0;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-ms-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
}
.dropdown .dropdown-menu.show {
    opacity: 1;
}
*/

/*For NAVBAR, The End*/





/*For FOOTBAR*/
#footbar {	text-align:left; width:100%; background-color:#1b1b9f; background: url('bkg/a8.jpg') center / cover no-repeat; background-attachment:fixed; color:#fff; font-size:16px; box-shadow:0px -3px 15px #111; }
		#footbar a { color:#f0ff00; }
		#footbar a:hover { color:#ffc000; font-size:18px; }
#footbar2 { background-color:rgba(27,27,159,0.8); width:100%; min-height:300px; padding:20px 20px 20px 25px; }
.foot { padding:5px 0px 0px 0px; }

#footerlast { background-color:#222; color:#ddd; width: 100%; font-size:14px; }
#footerlast a { color:#f0ff00; }
#footerlast a:hover { color:#ffc000; font-size:18px; }
.leftright2 {width:370px;}

#dsocialfoot { padding-top:10px; padding-bottom:10px; }
#dsocialfoot a:hover { opacity: 0.5; filter: grayscale(100%); border:1px solid #fff; }
.bottomimg { padding-left:10px; width:40px; }

.footerheading { font-size:24px; font-weight:bold; letter-spacing:-1px; line-height:100%; }
.footerheading a { color:#000; }
.footer {text-align:left;}


.fordfooter, .fordfooter li {
/*	list-style-type: none;
	list-style-position:inside;
        margin:0;
        padding:0;
*/
}

.fordfooter li {
/*		padding-top:5px;*/
}
.fordfooter .divider {
	border-bottom:1px solid #a45769;
	height:15px;
	margin-bottom:15px;
}
.fordfooter .ddropheader {
  font-weight:bold;
  color:#cd8495;
  text-transform:uppercase;
}
/*For FOOTBAR, The End*/




#fixedboxes { padding:15px 5px; }
#fixedboxespe { padding:20px 15px 45px 15px; background-color:#fff; text-align:center; }
.boxcon { text-align:center; }
.box4 { width:280px; min-height:250px; margin:5px; padding:15px 15px; display:inline-block; *display: inline; vertical-align:top; }
.box3 { width:380px; min-height:150px; margin:5px; padding:15px 15px; display:inline-block; *display: inline; vertical-align:top; }

.gap { line-height:5px; height:5px; }
.gapbreak { clear:both; line-height:1px; height:1px; }
.gapline { clear:both; border-bottom:2px solid #fff; }
.gapline2 { clear:both; border-bottom:2px solid #000; }
.gapline3 { clear:both; border-bottom:2px dotted #1b1b9f; }
.gapline2nobreak { border-bottom:2px solid #000; }

.bindheading { margin:-10px 0px 0px 0px; }
.headingbiggest {font-family:"Marcellus-Regular", serif; font-size:42px; color:#1b1b9f; letter-spacing:-3px; line-height: 100%; }
.headingbigger {font-family:"Oswald-Medium", sans-serif; font-size:32px; color:#900; letter-spacing:-1px; line-height: 120%; }
.headingnormal {font-family:"NanumMyeongjo-ExtraBold", serif; font-size:28px; color:#000; letter-spacing:-1px; line-height: 120%;}




#constraindiv {max-width:1200px; margin:0px auto;}
#contenter { padding:16px; display:flex; width: 100%; }
#mainbar { margin:0px 0px; padding:15px 30px; flex-grow: 1; flex:1; }
#sidebar { width:320px; padding:30px 15px 40px 15px; text-align:center; min-height:250px; background-color:rgba(0,0,0,0.1); }
#mainbar2 { width:100%; padding: 15px 15px; }
.sidebardiv {line-height: 90%; padding: 7px 0px 7px 0px; text-align: left; }





/*For Boxes in Admin Dashboard*/
.boxer1{
width:200px;
padding:20px 20px 20px 20px;
background-color:#FDF0D8;
color:#333;
font-size:24px;
text-align:center;
line-height:110%;

vertical-align: top;
        display: inline-block;
        *display: inline;
        zoom: 1;
		 
margin:15px 15px 15px 15px;

	-moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
	-khtml-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
	
	-moz-border-radius:7px;
    -khtml-border-radius:7px;
    -webkit-border-radius:7px;
border-radius:7px;
}
.boxer1 hr {border:1px solid transparent; border-bottom:1px solid #222}
.boxer1 a {color:#723e11;}
.boxer1 a:hover {color:#d7b785;}
.opbox {color:#C90306; font-size:36px; text-align:center; padding-bottom:5px;}
.opheading {color:#fff; font-size:25px; letter-spacing:-2px; font-family:"Montserrat-SemiBold", sans-serif; text-shadow:1px 1px 4px #111; }
.oparrow {font-size:25px;}
/*End of For Boxes in Admin Dashboard*/


/* Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold, Black */

.toplinker{
color:#ffffff;
	background-color:#606060;
padding:10px 0px 10px 0px;

text-shadow: 2px 2px 2px #222;
	-moz-text-shadow: 2px 2px 2px #222;
	-khtml-text-shadow: 2px 2px 2px #222;
	-webkit-text-shadow: 2px 2px 2px #222;
}
.toplinker a{
color:#ffff00;
text-decoration:none;
}
.toplinker a:hover{
color:#5df202;
text-decoration:overline;
font-weight:bold;
text-shadow:2px 2px 2px #111111;
}

.sidetitle {font-family:"NanumMyeongjo-ExtraBold", serif; color:#94481a;}
.sidelink a{
color:#1e7415;
text-decoration:none;
}
.sidelink a:hover{
color:#35b727;
text-decoration:underline;
font-weight:bold;
text-shadow:1px 1px 2px #111111;
}


/*
COLOURS
92F1C3
1e7415
35b727

94481a
*/


/*FOR HEADINGS AND TYPOGRAPHY*/

.headingstyled {font-family:"Montserrat-SemiBold", sans-serif;}
/* Thin, ExtraLight, Light, Regular, Medium, SemiBold, Bold, ExtraBold, Black */

.headingstyled2 {font-family:"Oswald-SemiBold", sans-serif;}
/* ExtraLight, Light, Regular, Medium, SemiBold, Bold */

.headingstyled3 {font-family:"SofadiOne-Regular", sans-serif;}

.headingstyled4 {font-family:"NanumMyeongjo-Regular", serif;}
/* Regular, Bold, ExtraBold */

.headingstyled5 {font-family:"Marcellus-Regular", serif;}

.headingstyled6 {font-family:"MonikaItalic", sans-serif;}

.headingstyled7 {font-family:"DancingScript-Regular", sans-serif;}
/* Regular, Medium, SemiBold, Bold */

.headingstyled8 {font-family:"Caveat-Regular", sans-serif;}
/* Regular, Medium, SemiBold, Bold */

.headingstyled9 {font-family:"NerkoOne-Regular", sans-serif;}

.headingstyled10 {font-family:"PlaywriteCU-Regular", sans-serif;}
/* Thin, ExtraLight, Light, Regular */

/*FOR HEADINGS AND TYPOGRAPHY, The End*/














@media screen and (max-width: 900px) and (min-width: 601px){
.headingspecial2 {font-size:24px;}
}
@media screen and (max-width: 900px){
	.yto-900 {display: block !important; width:100% !important; }
}
/**********IF ABOVE 601. NOTE IT IS MIN-WIDTH**********/
@media screen and (min-width: 601px) {
  .w3-row.w3-equal {
    display: flex;
	  display: -webkit-flex;
    flex-wrap: wrap;
  }
/*
  .w3-row.w3-equal > [class*='col-'] {
  display: flex;
  flex-direction: column;
  }
*/
}



/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

@media screen and (max-width: 1111px){
	.insidesection {width:100%; }
}

/**********IF 993 AND ABOVE. NOTE IT IS MIN-WIDTH**********/
@media screen and (min-width:993px) {
  .dropend:hover>.dropdown-menu {
    position: absolute;
    top: 0;
    left: 100%;
  }
  .dropend .dropdown-toggle {
    margin-left: .5em;
  }
	
  .dropstart:hover>.dropdown-menu {
    position: absolute;
    top: 0;
    right: 100%;
  }
  .dropstart .dropdown-toggle {
    margin-left: .5em;
  }
}
/**********IF 992 AND BELOW. NOTE IT IS MAX-WIDTH**********/
@media screen and (max-width: 992px){
	.navbar-brand {display: block !important;}
	.navbar-text {display: none !important;}
	.dropend .dropdown-toggle {margin-left: 16px;}
	.dropend:hover>.dropdown-menu { background-color:#ddd; margin:0px 16px 8px 16px; }
	.dropstart .dropdown-toggle {margin-left: 16px;}
	.dropstart:hover>.dropdown-menu { background-color:#ddd; margin:0px 16px 8px 16px; }
}

@media screen and (max-width: 900px){
	#footerlast2 {display:none;}
	.footerlast2 {display:block !important;}
}

@media screen and (max-width: 768px){
	#contenter { display:block; }
	#mainbar { width:100%; margin:30px 0px; }
	#sidebar { width: 320px; margin:0px auto; }
}

 

@media screen and (max-width: 700px){
	.yto-700 {display: block !important; width:100% !important; }
	.firstheading2 {padding-top: 45px;}
	.disappear-700 {display: none !important;}
}

@media screen and (max-width: 600px){
	.firstheading {padding-top: 45px;}
}

@media screen and (max-width: 520px){
.box4 { width:90% !important; display:block; clear:both; float:none; margin-right:auto !important; margin-left:auto !important; }
.box3 { width:90% !important; display:block; clear:both; float:none; margin-right:auto !important; margin-left:auto !important; }

}

	



@media print {
	#title, #social, #dsocial, .dtopmenu {
		display:none;
	}


	#footbar {
		display:none;
			}
			
	#sidebar {
		display:none;
			}		
					
	#navbar {
		display:none;
			}
	.navbar {
		display:none;
			}
			
	#mast {
		display:none;
			}
	#mySidenav, #mySidenavhover, #main2 { display: none; }
	
	.toplinker, .noprint {
		display:none;
			}
	#footerlast {margin-top:5px;}
	
/*	
  h2 { 
    page-break-before: always;
  }
  h3, h4 {
    page-break-after: avoid;
  }
  pre, blockquote {
    page-break-inside: avoid;
  }

	
This code snippet does 3 things:
1. it forces a page-break before all h2 headings (perhaps h2 tags in your document are chapter titles that deserve a fresh page)
2. it prevents page-breaks right after sub-headings because that looks odd
3. it prevents page-breaks inside pre tags and block-level quotes
*/
	
.pagebreak {
    page-break-before: always;
	break-before: always;
}
.keeptogether {
    page-break-inside:avoid;
	break-inside: avoid;
}

}