/* ==================================
C-C-C Family Assn. - 3rd generation website
-------------------------------------
Fonts: Raleway & Open Sans
-------------------------------------
Colors:
Tan Hide:       	#f79256
Raw Sienna:			#c86e41
Colonial White:		#fee9ba
Water Leaf:			#a5edde
Patina:				#5ea089
Baby Blue:			#deffff
Hippie Blue:		#6590b5
White:				#fff
Black:				#000
====================================*/
.w3-tan-hide {
	color:#f79256!important;
}
.w3-raw-sienna {
	color:#c86e41!important;
}
.w3-dark-unk {
	color:#99492b!important;
}
.w3-colonial-white {
	color:#fee9ba!important;
}
.w3-water-leaf  {
	color:#a5edde!important;
}
.w3-patina {
	color:#5ea089!important;
}
.w3-baby-blue {
	color:#deffff!important;
}-2
.w3-hippie-blue {
	color:#6590b5!important;
}
.w3-blue-unk {
	color:#12316a!important;
}
/*===================================*/
/*       New color definitions
/*===================================*/
.w3-theme {
	color: #000 !important;
	background-color: #fcc687 !important;
}
.w3-theme-light {
	color: #000 !important;
	background-color: #ffe585 !important;
}
.w3-theme-dark {
	color: #fff !important;
	background-color: #994926 !important;
}
.w3-theme-2 {
	color: #000 !important;
	background-color: #a5edde !important;
}
.w3-theme-2light {
	color: #000 !important;
	background-color: #bdfff6 !important;
}
.w3-theme-2dark {
	color: #fff !important;
	background-color: #3f725b !important;
}
.w3-theme-3 {
	color: #000 !important;
	background-color: #96bdde !important;
}
.w3-theme-3light {
	color: #fff !important;
	background-color: #deffff !important;
}
.w3-theme-3dark {
	color: #fff !important;
	background-color: #0f2860 !important;
}
/* ==================================
html, body
====================================*/
html,
body {
	height: 100%;
}
body {
	color: #212226;
}
h1{
	font-family: "Open Sans", sans-serif;
	text-align: center;
	font-weight:500;
	
}

h2,
h3,
h4,
h5,
h6 {
	font-family: "Raleway", sans-serif;
	text-align: center;
}
.w3-lobster {
	font-family: "Lobster", Sans-serif;
}
.citation {
	font-family: "Marcellus SC", small caps;
	font-weight: 700;
	font-size: 17px;
}
.figcap-heading {
	margin:0px 0px 0 -70px;
}
.figcaption {
	font-family: "Marcellus SC", small caps;
	font-weight: 700;
	font-size: 18px;
	text-align: center;
	background-color: #fbd1a2;
	max-width: 400px;
	padding:15px;
	margin:0 auto 20px auto;
	border-radius:5px;
}
.figcaption {
	font-family: "Marcellus SC", small caps;
	font-weight: 700;
	font-size: 18px;
	text-align: center;
	background-color: #fbd1a2;
	max-width: 750px;
	padding:15px;
	margin:0 auto 20px auto;
	border-radius:5px;
}
.figcaption-nl {
	font-family: "Marcellus SC", small caps;
	font-weight: 600;
	font-size: 15px;
	text-align: center;
	background-color: #deffff;
	max-width: 750px;
	padding:15px;
	margin:0 auto 20px auto;
	border-radius:5px;
}
#cite,
.cite {
	font-family: "Marcellus SC", small caps;
	font-size: 20px;
	font-weight: 700;
	font-style: normal;
}
.ul-hdg {
	text-decoration: none;
}
.font90 {
	font-size:90%;
}
.mr35 {
	margin-right: 55px;
}
.mt15 {
	margin-top:15px;
}
p {
	text-align: justify;
	font-size: medium;
}
hr.med-green {
	border-top: 3px solid #5ea089;
	background-color: #fff;
	width: 100%;
	padding: 0;
	margin-left: -15px;
	margin-right: 15px;
	margin-top: 0px;
	z-index: 10;
}
.center-text {
	text-align: center;
	margin-left: -30px;
}
.center-object {
	margin:0 auto 0 auto;
}
.p125 {
	font-size: medium;
}
p.p125::first-letter {
	font-size: 125%;
}
.p150 {
	font-size: medium;
}
p.p150::first-letter {
	font-size: 150%;
}
.underline {
	text-decoration:underline;
}
/*===================================*/
/*          Grid Setup
/*===================================*/
.grid-container {
	grid-template-columns:250 auto 250;
	grid-template-rows: 60 27 27 120 auto auto auto; 
	grid-template-areas: 
	'header header header'
	'menu1  menu1  search'
	'breadcrumb breadcrumb search'
	'slider slider slider'
	'left-nav article1 article1'
	'left-nav .         .'
	'.       pagination  .'
	'footer footer footer';
}
.header {
	grid-column:1 /span3;
	grid-row:1;
	grid-area:header;
}
.menu1 {
	grid-column:1 /span2;
	grid-row:2;
	grid-area:menu1;
}
.search {
	grid-column:3;
	grid-row:2 /span2;
	grid-area:search;
}
.breadcrumb {
	grid-column:1 /span2;
	grid-row:3;
	grid-area:breadcrumb;
}
.slider{
	grid-column:1 /span3;
	grid-row:4;
	grid-area:slider;
}
.left-nav {
	grid-column:1;
	grid-row:5 /span2;
	grid-area:left-nav;
}
.article1 {
	grid-column:2 /span2;
	grid-row:5;
	grid-area:article1;
	display:grid;
	grid-template-columns:3fr 1fr 3fr;
	grid-template-rows: repeat(6, auto);
	grid-template-areas: 
	'title1 title1 title1'
	'text1 text1 text1'
	'title-poem title-poem title-poem'
	'poem-col-1 flower poem-col-2'
	'.         author     .'
	'text2   text2    text2';
	
}
.pagination {
	grid-column:2;
	grid-row:7;
	grid-area:pagination;
}
.footer {
	grid-column:1 /span3;
	grid-row:8;
	grid-area:footer;
	display:grid;
	grid-template-columns:1fr 2fr 1fr;
	grid-template-rows: auto auto;
	grid-template-areas:
	'hor-rule     hor-rule      hor-rule'
	'footer-col-1 footer-col-2 footer-col-3';
	grid-gap:2px;
}
.footer .hor-rule {
	grid-column:1 /span3;
	grid-row:1;
	grid-area:hor-rule;
	margin:0 0 0 15px;
}
.footer .footer-col-1 {
	grid-column:1
	grid-row:2;
	grid-area:footer-col-1;
}
.footer .footer-col-2 {
	grid-column:2;
	grid-row:2;
	grid-area:footer-col-2;
}
.footer .footer-col-3; {
	grid-column:3;
	grid-row:2;
	grid-area:footer-col-3;
}

/* ==================================
Preloader
====================================*/
#preloader {
	background-color: white;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9999;
}
#status {
	background-image: url("../images/preloader/preloader.gif");
	background-repeat: no-repeat;
	width: 70px;
	height: 70px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -35px;
	margin-left: -35px;
}
/*====== Main Container ===================*/
#main-container {
	background-color: white;
}
#main-container-third-gen {
	background-color: #fdd091;
}
#main-container-fourth-gen {
	background-color: #94ffff;
}
#4-gen {
	background-color: #94ffff;
	border: 5px solid blue;
}
#back-btn-fourth,
#back-btn-fourth:hover {
	text-decoration: none;
	-webkit-transition:all .5s ease-in-out;
	transition-duration:all .5s ease-in-out;
}
#5-gen {
	background-color: #fee9ba;
}
#main-container-fifth-gen {
	background-color: #fee9ba;
}
#main-container-sixth-gen {
	background-color: #a5edde;
}
#6-gen {
	background-color: #a5edde;
}
#7-gen {
	background-color: #25c5d7;
}
.history {
	background-color: #fdd091;
	background-repeat: repeat;
}
#archives {
	background-color: #f89c80;
}
#memorabilia {
	background-color: #fbd1a2;
}
/*=========================================
/*     Title Bar at Top
/*=========================================*/
#title-panel{
	position: fixed;
	grid-area:header;
	display: grid;
	grid-template-columns:130px 1fr;
	grid-template-areas:"logo title";
	background-image:url('../images/ccc.jpg');
	background-repeat: yes;
	height: 70px;
	width: 100%;
	/*float:left;*/
	border:3px #5ea089 solid;
	background: cover;
	color: #5ea089;
	text-align: center;
	padding: 0;
	margin-left:0px;
	margin-top:0;
	z-index:25;
}
#ccc-logo {
	grid-area:logo;
	height:56px;
	width:auto;
	border:3px solid #5ea089;
	margin: 5px 0 0 5px;
	/*float: left;*/
	}
#title-bar-2 {
	grid-area:title;
	font-family: "Perpetua", "Times New Roman", serif;
	font-size: 3.6vw;
	line-height: 35px;
	font-weight: 500;
	margin-top:10px;
	text-align: center;
	z-index: 30;
}
/*=========================================*/
/*     Breadcrumb
/*=========================================*/
.container-breadcrumb-lw {
	position:  fixed;
	/*grid-area: breadcrumb;*/
	background-color: #fdd091;
	border:1px solid black;
	height:27px;
	display:flex;
	flex-direction:row;
	margin-top:97px;
	margin-left: 0px;
	/*float:left;*/
	width: 87%;
	/*max-width:1100px;*/
	/*padding-bottom:2px;*/
	/*border-bottom:1px black solid;*/
	z-index: 15;
}
.container-breadcrumb-lw-a1 {
	position: fixed;
	/*grid-area:breadcrumb;*/
	background-color: #deffff;
	height:25px;
	/*font-size: 18px;*/
	margin-top: 97px;
	width:87%;
	/*max-width:1100px;*/
	padding-bottom:2px;
	border-bottom:1px black solid;
	z-index: 49;
}
.container-breadcrumb-lw-a2 {
	position: fixed;
	grid-area:breadcrumb;
	background-color: #deffff;
	height:25px;
	/*font-size: 18px;*/
	margin-top: 98px;
	margin-left: 0px;
	width: 87%;*/
	/*max-width:1100px;*/ 
	padding-bottom:2px;
	border-bottom:1px black solid;
	z-index: 10;
}
.bc-bar {
	/*list-style-type: none;*/
	/*background-color: #deffff;*/
	display:flex;
	flex-direction:row;
	/*background-color: none;*/
	margin:0px 0 0 -28px;
	/*padding:3px 3px 0 0;
	/*margin-left: 0px;*/
	z-index: 8;
}
.bc-btn {
	/*style="float:left; padding-right: 3px; margin-left: 3px; margin-right: 3px;"*/
	list-style-type: none;
	text-decoration:none;
	display: flex;
	flex-direction:row;
	color: white;
	background-color: #deffff;
	margin:-7px 10px 0 -2px;
	font-size: 12px;
	height: 22px;
	border:1px solid black;
	border-radius: 5px;
	padding: 0px 8px 5px 3px;
	text-decoration: none;
	z-index: 15;
}


.bc-btn:hover{
	color: white;
	
	background-color: #c86e41;
}
.bc-btn,
.bc-btn:hover{	
	-webkit-transition: all .5s;
	transition: all .5s;
}
/*=========================================*/
/*     Menu Bar
/*=========================================*/
#nav-bar {
	position: fixed;
	grid-area: menu;
	/*display: flex;
	flex-direction:row;*/
	border: 1px black solid;
	background-color: #fbd1a2;
	color: #38cfde;
	height: 27px;
	margin-top:70px;
	margin-left:1px;
	/*margin-right: 20px;*/
	width: 87%;
	z-index: 10;
}
.nav-btns{
	list-style-type: none;
	display: flex;
	flex-direction:row;
	margin-left:10px;
	margin-top: -27px;
}
#nav-bar-w3-abt1 {
	position: fixed;
	border-bottom: 1px black solid;
	background-color: #94ffff;
	height: 27px;
	margin-top: 3px;
	margin-left:0px;
	margin-right: 20px;
	margin-bottom: 4px;
	z-index: 30;
}
.button-home {
	margin:1px 0 0 4px;
	font-size: 12px;
	display: flex;
	background-color: aliceblue;
	border:1px solid black;
	border-radius:5px;
	font-weight:400;
	color: #006477;
	padding: 3px;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.button1 {
	list-style-type: none;
	display: flex;
	flex-direction: row;
	color: #006477;
	text-decoration: none;
	font-size:12px;
	background-color: aliceblue;
	border-radius:5px;
	border:1px solid black;
	margin-top:1px;
	padding: 3px;
	margin-left:6px;
	font-weight: 400;
	-webkit-transition: all .5s;
	transition: all .5s;
}

.button-home:hover,
.button1:hover {
	color: white;
	background-color: #006477;
	text-decoration: none;
	-webkit-transition: all .5s;
	transition: all .5s;
}

#menu-bars {
	margin-right:230px;
	padding-bottom: 20px;
	overflow-y: hidden;
	z-index:100;
}
#menu-bars-button {
	position: fixed;
	border: 1px black solid;
	background-color: aliceblue;
	margin-top:-24px;
	margin-left:56px;
	margin-right: 20px;
	width:27px;
	padding:3px;
	height: 22px;
	-webkit-transition: all .5s;
	transition: all .5s;
	z-index: 50;
}
#menu-bars:hover {
	color: bisque;
}
.w3-overlay {
	position: fixed;
	display: block;
	width: 100%;
	height: 40%;
	top: 135px;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.6);
	z-index: 30;
	cursor: pointer;
}
#vertical-btns {
	background-color: none;
	width: 30%;
	/*height: 100%;*/
	position: fixed;
	top: 150px;
	left: 0;
	-webkit-transition: all .5s;
	transition: all .5s;
	z-index: 30;
}
.w3-bar-block > vertical-btns  a:hover,
.w3-bar-block > vertical-btns  a:focus{
	background-color:bisque;
	text-decoration: none;
	color:black;
	-webkit-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
	
}
/*=========================================*/
/*    Search Box
/*=========================================*/
.sb-container {
	border:1px solid black;
	/*background-attachment: fixed;*/
	position: fixed;
	border-radius: 5px;
	width:245px; 
	height: 54px;
	background-color: #fff8c9;
	padding-left:7px;
	padding-top:6px;
	right:0;
	
	margin-top:70px;
	/*overflow-y: hidden;*/
	z-index: 50;
}
#sb-container-abt2 {
	border:1px black solid;
	/*background-attachment: fixed;*/
	position: fixed;
	border-radius: 5px;
	width:245px; 
	height: 54px;
	background-color: #fff8c9;
	padding:4px; 
	/*margin-right:-1500px;*/
	margin-left:1470px;
	float:right;	
	margin-top:70px;
	/*overflow-y: hidden;*/
	z-index: 60;
}
#search-form {
	margin-top: 0px;
	z-index: 60;
}
#search-box {
	
	margin-top:-4px;
	margin-right:0px;
	padding-right: 0px;
	/*border: 2px blue solid;*/
}
.sbtext1 {
	color: #13bcd1;
	font-size: 10px;
}
.sbtext3 {
	color: #c86e41;
	font-size: 10px;
}
.sbcolor60 {
	font-family: "Raleway", sans-serif;
	text-transform: uppercase;
	font-size: 10px;
	color: #c86e41;
}
.sbfont3 {
	font-family: "Raleway", sans-serif;
	text-transform: uppercase;
	font-size: 10px;
	color: #c86e41;
}
#search-btn:hover,
#search-btn:focus {
	background-color: #a5edde;
	color: black;
	font-weight: 400;
	/*-webkit-transition: all 300ms linear;
	transition: all 300ms linear;*/
}
#search-btn:hover,
#search-btn:focus {
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
/*=========================================*/
/*    Portions of the text...
/*=========================================*/
/*#portions .container-fluid {
	margin-top: 10px;
	margin-left:300px;
	margin-right:100px;
}*/

.item5 p {
	/*margin-top:10px; 
	margin-left: 0px;
	margin-right:45px;*/
	z-index: 11;
}
/*=========================================*/
/*   Animated Heading
/*=========================================*/
.animate__animated.animate__slideInLeft {
	--animate-delay:2sec;
}
#anim-hdg {
	
}
#slide-in {
	background-color: #fdd091;
	z-index: 10;
}
.vertical-heading-abt1,
.vertical-heading {
	margin-top:170px;
	font-size: 20px;
}
#vert-hdng-about1 {
	margin:0px 0 0 0;
	
}
.vertical-heading h5 {
	color: #b05b36;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	word-spacing: 9px;
	display: inline-block;
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	position: relative;
	margin-top: 40px;
	margin-left: 200px;
}
.vertical-heading h2 {
	text-align: left;
	margin-left: 280px;
	margin-top: -50px;
}

/*=========================================*/
/*  Left Nav Column
/*=========================================*/
#left-nav-col-2 {
	display:block;
	/*flex-wrap: wrap;*/
	position: relative;
	width: 220px;        /* This one controls the overall width of the menu  */
	margin-top: 130px;
	margin-left:  10px;
	z-index: 2;
}
#left-nav-col-2-abt1 {
	position: sticky;
	width: 220px;
	margin-top: 350px;
	margin-left: 40px;
	z-index: 5;
}
	#left-nav-container-abt1 {
		width: 230px;
		margin-top: 350px;
		z-index: 5;
}
#left-nav-container {
	width: 260px;       /* Controls the width of a container.  */
	margin-left: 0px;
	z-index: 8;
}
#left-column-bkgnd {
	position: sticky;
	background-color: #fee9ba;
	padding: 8px;
	/*max-width: 100%; */
	/*float: left; */
	/*margin-top: 10px; */
	border: 3px solid #5ea089;
	z-index: 8;
}		
#crest-box {
	position: sticky;
	/*width: 250px;*/
	max-height: 250px;
	z-index: 8;
}
#crest {
	position: sticky;
	margin: 15px 0px 0 10px;
	z-index: 8;
}
#crest:hover {
	opacity: 0.5;
}
/*=================================*/
/*transition: 500ms; */
/*=================================*/
#crest {
	-webkit-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}
#left-col-text {
	position:sticky;
	width: 205px;
	margin-left: 10px;
}
#left-col-text-abt1 {
	margin-left: 0px;
	width: 205px;
}
.center-font110pct {
	margin: 0 auto 0 auto;
	font-size: 20px;
}
.x-small {
	font-size: 13px;
	line-height: 16px;
}
/*=========================================*/
/*  Article 1
/*=========================================*/

.article1 .title1 {
	margin-top:-100px;
}
.article1 .title-poem {
	font:w3-lobster;
	font-size:40px;
	margin-left:-500px;
	text-align:center;
}
.article1 .text1 {
	margin:30px 25px 0 25px;
}
#poem-col-1 { 
	margin-left:20px;
	font-size:18px;
	font-weight:700;
	background-color:#fdd091;
}
.p-col1 {
	grid-area:p-col1;
	width:440px;
	margin-top:60px;
	
}
.flower {
	grid-area:flower;
	width:200px;
	margin:-1200px auto 0 450px;
}
#poem-col-2 {
	font-size:18px;
	font-weight:700;
	background-color:#fdd091;
}
.p-col2 {
	grid-area:p-col2;
	width:480px;
	/*border:2px solid yellow;*/
	margin-left:650px;
	margin-top:-680px;
}
.poem-title {
	font-size:40px;
	margin-left:-400px;
}
.article1 .author {
	margin-left: 400px;
}
.article1 .text2 {
	margin:20px 25px 0 -100px;
}
.pre {
	grid-area:pre;
	margin:-1200px 30px 0 260px;
}
.post {
	margin-left:-150px;
	margin-right: 100px;
}
.title {
	grid-area:title;
	margin:-500px 30px 0 600px;
}
#art-1{
	grid-area:art-1;
	margin: 20px 250px 0 15px;
}
#pic-1 {
	grid-area:pic-1;
	margin-right: 50px;
}
#pic-2 {
	grid-area:pic-2;
	margin:20px;
}
#para-2 {
	grid-area:para-2;
	margin-right: 30px;
}
#commemorations {
	grid-area:article-1;
	margin-left:60px;
}
#commemorations p {
	margin-left:20px;
}
#gen-four-article-2 {
	margin:40px 300px 0 -80px;
	position: relative;
	display: flex;
	flex-direction:column;
	/*border:2px dotted blue;*/
	width:70%;
	flex: 1 1 50%;
}
.p-slideshowinst {
	border:thin black solid;
	border-radius:2px;
	text-align:center;
	font-size:x-small;
	max-width:550px;
	padding:5px;
}
.ml25 {
	margin-left: 25px;
}

/*.mw325-centered {
	max-width:325px;
	margin:0 auto 0 auto;
}*/
.w325-b-b-hover {
	width:325px;
	border:thin black solid;
	box-shadow:2px 2px 3px 2px gray;
	border-radius:10px;
}
.w325-b-b-hover:hover {
	background-color: rgba(0,0,0,0.6);
	opacity:0.65;
}
.w325-b-b-hover:hover {
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.mw325-b-b-hover {
	max-width:325px;
	border:thin black solid;
	box-shadow:2px 2px 3px 2px gray;
	border-radius:10px;
}
.mw325-b-b-hover:hover {
	background-color: rgba(0,0,0,0.6);
	opacity:0.65;
}
.mw325-b-b-hover:hover {
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.mw500-centered-b-b {
	max-width: 500px;
	margin:0 auto;
	border:thin black solid;
	box-shadow:2px 2px 3px 2px #000;
	border-radius:10px;
}
.w300-b-b-center {
	width:300px;
	box-shadow:2px 2px 3px 2px black;
	border-radius:10px;
	margin:0 auto;
}
.center-b-b-hover {
	margin:0 auto 0 auto;
	border:thin black solid;
	box-shadow:2px 2px 3px 2px gray;
	border-radius:10px;
}
.center-b-b-hover:hover {
	background-color: rgba(0,0,0,0.6);
	opacity:0.65;
}
.center-b-b-hover:hover {
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.pic-overlay {
	position: fixed;
	display: block;
	width: 100%;
	height: 40%;
	top: 135px;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.6);
	z-index: 30;
	cursor: pointer;
}
.p125cap-centered {
	font-family: "Marcellus SC", small caps;
	font-size:normal;
	text-align:center;
/*	margin-top:0px;         */
	margin-bottom:10px;
}
p.p125cap-centered::first-letter {
	font-size:125%;
}
#row-1 {
	display: inline-block;
	width: 100%;
	height: auto;
}
.row-2 {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 100%;
}
.art-1 {
	flex: 60%;
	flex-direction: row;
	/*border: 2px solid red;*/	
	flex-shrink: 2;
}
.pix-1 {
	flex: 40%
	margin-left: 40px;
	border: 2px solid yellow;
	flex-shrink: 1;
}
#crislip-medal {
	float: left;
}
#medal-crislip {
	display: flex;
	margin:0  0 0 50px;
	max-width: 250px;
	flex-direction: column;
	/*border: 2px solid blue;*/
	
}
/*=========================================*/
/*  Newsletter article
/*=========================================*/
#newsletter {
	margin:30px 30px 0 40px;
}
.item8-nl .title-nl {
	margin-top:25px;
	margin-left:30px;
	margin-right:30px;
	height:60px;
	text-align:center;
	border:2px solid yellow;
}
.article-nl {
	margin-top:190px;
	margin-right:350px;
	margin-left:-530px;
}
.pic-nl {
	max-width:350px;
	margin-top: 140px;
	margin-right:20px;
} 
.article-nl {
	margin-top:100px;
}
#jl-archive {
	margin-top:1000px;
}
/*=========================================*/
/*  Slide-show
/*=========================================*/
.mh600-br10-centered {
	max-height:500px;
	border-radius:10px;
	margin:0 auto 0 auto;
}
.mh750-centered-b-b {
	max-height:750px;
	border:thin black solid;
	box-shadow:2px 2px 3px 2px gray;
	border-radius:10px;
	margin:0 auto 0 auto;
}
.carousel-indicators {
	bottom: 0;
	max-width: 400px;
	margin-bottom: -30px;
	background-color: #f79256;
}
.carousel-indicators .active {
	background-color: #5de2eb;
}
.carousel-indicators.li {
	background-color: #111;
}
.container-caption {
	height: 250px;
	width:600px;
}
/*=========================================*/
/*  article-2
/*=========================================*/
#about-article2 {
	margin:0 100px 0 0px;
}
#ul-margin {
	margin-left: 100px;
	margin-right: 50px;
}
#pagination-about1 {
	margin-left: 75px;	
}
/*=========================================*/
/*  footer-3 parts
/*=========================================*/
.footer {
	clear: both;
	background-color: white;
	/*position: relative; */
	text-align: center;
	margin-top: 0px;
	margin-left: 0px;
	padding: 0;
	width: 100%;
	z-index: 8;
}
.footer .hor-rule {
	width:100%;
}

.footer-motto {
	font-size: 30px;
	font-family: serif;
	text-align: center;
	font-style: italic;
	margin-top: 0;
	color: #000;
}
.footer-update {
	text-align: center;
	font-size: 14px;
	margin-left: 14px;
	color: black;
}
.footer .footer-col-1 {
	margin:0px 15px 0 0px;
}
.footer .footer-col-1 .trees {
	margin-left:0px;
}
.footer .footer-col-2 {
	margin:40px 0 0 0px;
}
.fineprint {
	font-size:x-small;
	font-style:normal;
	margin:0 auto 0 auto;
	margin-top:-5px;
}
	.center-object{
		margin:0 auto 0 auto;
	}
.footer .footer-col-3 {
	margin:10px auto 0 auto;
}
/*============================*/
/*			Back to Top
/*============================*/
#back-to-top {
	position: fixed;
	background-color: #f79256;
	color: #fff;
	top: 92%;
	left: 95%;
	padding 5px;
	width: 40px;
	height: 40px;
	z-index: 13;
}
/*================ Modal =====================*/
#modal-close-button {
	background-color:#fbd1a2;
	-webkit- transition:all .5s ease-in-out;
	transition:all .5s ease-in-out;
}
#modal-close-button:hover {
	background-color:#2f5a44;
	color:#fff;
	-webkit- transition:all .5s ease-in-out;
	transition:all .5s ease-in-out;
}
#back-to-top:hover {
	background-color: #6590b5;
	color: #f79256;
}
#back-to-top,
#back-to-top:hover {
	-webkit-transition: all 400ms ease-in-out;
	transition: all 400ms ease-in-out;
}
	/*============================*/
	/*			Media Queries
	/*============================*/
@media only screen and (max-width: 1800px){	
	.article1 .title-poem {
		margin-left:-400px;
	}
}
@media only screen and (max-width: 1700px){
	.article1 .title-poem {
		margin-left:-300px;
	}
}
@media only screen and (max-width: 1600px){
	.article1 .title-poem {
		margin-left:-200px;
	}
}
@media only screen and (max-width: 1500px){
	.article1 .title-poem {
		margin-left:-100px;
	}
}
@media only screen and (max-width: 1400px){
	.article1 .title-poem {
		margin-left:-230px;
	}
	.article1 .flower {
		display:none;
	}
	.article1 .p-col2 {
		margin-left:450px;
		margin-top:-1130px;
	}
	.article1 .author {
		margin-left:330px;
	}
	.article1 .text2 {
		margin-right:100px;
	}
}
@media only screen and (max-width: 1200px){
	.grid-container {
	grid-template-columns:250 auto 250;
	grid-template-rows: 60 27 27 120 auto auto auto auto; 
	grid-template-areas: 
	'header header header'
	'menu1  menu1  search'
	'breadcrumb breadcrumb search'
	'slider slider slider'
	'article1 article1 article1'
	'left-nav .         .'
	'.       pagination  .'
	'footer footer footer';
	}
	.article1 {
		grid-column:1 /span3;
		grid-row:5;
		grid-area:article1;
		margin-top:-2500px;
		margin-left:-230px;
	}
	.left-nav {
		grid-column:1;
		grid-row:6;
		grid-area:left-nav;
		margin-left:15px;
		margin-top:2700px;
	}
	.footer {
		margin-top:20px;
	}
	.pagination {
		margin-top:720px;
		margin-left:100px;
	}
	.article1 .text2 {
		margin-left:15px;
	}
}
	@media only screen and (max-width: 1100px){
		.left-nav {
			margin-top:2900px;
		}
		.article1 {
		grid-column:1 /span3;
		grid-row:5;
		grid-area:article1;
		margin-top:-2650px;
		margin-left:-230px;
	}
}
	@media only screen and (max-width: 992px){
		.nav-btns {
			display:none;
		}	
}
	@media only screen and (max-width: 950px){
		.pre .title1 {
			margin-right:50px;
		}
		.article1 .text1 {
			margin-right:80px;
		}
	.article1 {
	grid-column:2 /span2;
	grid-row:5;
	grid-area:article1;
	display:grid;
	grid-template-columns:1fr;
	grid-template-rows: repeat(7, auto);
	grid-template-areas: 
	'title1'
	'text1'
	'title-poem'
	'poem-col-1'
	'poem-col-2'
	'author'
	'text2';
	}
		.article1 .title1 {
			grid-column:1;
			grid-row:1;
			grid-area:title1;
			margin:0 60px 0 20px;
		}
		.article1 .text1 {
			grid-column:1;
			grid-row;2;
			grid-area:text1;
			margin:0 60px 0 20px;
		}
		 .title-poem {
			grid-column:1;
			grid-row:3;
			grid-area:title-poem;
			margin-left:-200px;
		}
		 .poem-col-1 {
			grid-column:1;
			grid-row:4;
			grid-area:poem-col-1;
			margin-left:10px;
		}
		 .poem-col-2 {
			grid-column:1;
			grid-row:5;
			grid-area:poem-col-2;
			margin-left:10px;
			margin-top:800px;
		}
		.author {
			grid-column:1;
			grid-row:6;
			grid-area:author;
			margin-left: 50px;
			margin-top:800px;
		}
}