/**
 * Copyright (c) 2006 Encore Research Group, University of Toronto
 * 
 * This library is free software; you can redistribute it and/or
 * modify it under the terms of the GNU Lesser General Public
 * License as published by the Free Software Foundation; either
 * version 2.1 of the License, or (at your option) any later version.
 *
 * This library is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU Lesser General Public
 * License along with this library; if not, write to the Free Software
 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
 *
  
/* CSS FOR THE MAIN HOME PAGE*/

.showcase {
	position:relative;
	color:#FFFFFF;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida San Unicode", "Gill Sans", Helvetica, Arial;
	margin-block:6rem
}

#projectHeader {
	position:absolute;
	top:-42px;
	right:218px;
}

span.featureContent {
	background-color: #fdf9eb;
	background-color: rgba(255, 255, 255, .7);
	padding: 0.5em;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	color: #F97F6E !important;
	font-size:1.25em;
}

a.projectsLink {
	padding: 0.5em;
	font-size:1em;
	margin-left:.5em;
}
#createAccountButton{
	height:auto;
	width: 100px;
}


#about, #news {
	/* height:621px; */
}

#about {
	/* width: 1002px; */
	/* background-color: #d6c6af; */
	/* background: url('../images/home/intro_slider_bg.png') no-repeat center center; */
	/* background-size: contain; */
}

.panelHead {
	line-height: 34px;
	height:34px;
	padding: 18px 24px 4px;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida San Unicode", "Gill Sans", Helvetica, Arial;
	font-size: 1.3em;
	font-weight:bold;
}

.panelHead span {
	color:#404040;
	font-weight:bold;
}

.panelLink {
	float: right;
	line-height: 30px;
	font-size: .8em;
	color: #FFF;
	font-weight:normal;
}

.homePanelContent {
	margin: 14px 26px;
}

/* Info Showcase Slider Styles */

#showcaseSlider {
    position:relative;
    width:100%; /* Change this to your images width */
    height:auto; /* Change this to your images height */
    background:url('../images/home/loading.gif') no-repeat 50% 50%;
	margin: 0 auto;
    
}
#showcaseSlider img {
	width: 100%;
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}

/* News box styles */

#news {
	width:375px;
	position:absolute;
	top:0;
	right:0;
	background: url('../images/home/news_bg.png') no-repeat center center;
}

#newsContent {
	position:relative;
	margin: 10px 26px;
	overflow:auto;
	height:155px;
}

#newsContent p {
	margin-bottom:3px;
	margin-right:18px;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida San Unicode", "Gill Sans", Helvetica, Arial;
}

#newsContent a {
	color:#FFFFFF;
}

p.newsTitle {
	font-size:.95em;
}

span.newsDate {
	float:right;
	color:#DCF2EA;
	margin-right:4px
}

p.newsSnippet {
	color:#DCF2EA;
	margin-bottom:10px !important;
	font-size:.8em;
	line-height:1.4em;
}

#news #socialLinks {
	padding: 7px 26px;
    text-align: right;
}

#news #socialLinks img {
	margin:3px;
}

#news #socialLinks > a:hover img {
	box-shadow:0 0 5px #FFFFFF;
	-moz-box-shadow:0 0 5px #FFFFFF;
	-webkit-box-shadow:0 0 5px #FFFFFF;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}

/* Project Showcase Accordion Styles */
#projectShowcase {
	background: url('../images/home/project_showcase_bg.png') no-repeat center center;
	width:670px;
	float:right;
}

#features {
	padding: 0 20px;
	/*background: url('../images/home/features_bg.png') no-repeat center center;*/
	width:270px;
	float:left;
}

#featureHeader {
	text-align: center;
}

#featuresContent {
	padding: 1em;
	margin: 1.5em .5em 0;
	background-color:#fdf9eb;
	background-color: rgba(255, 255, 255, .7);
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}

#featuresContent p {
	font-size: 1em;
	margin-bottom:1em;
}

#checkCompatibility {
	margin-bottom: 0 !important;
}

#checkCompatibility a {
	color:#007391;
}

#features, #projectShowcase {
	height:250px;
}

.libraryProject {
	height:100%;
	position:relative;
}

div.projectDetails {
	font-size: 1.25em;
	font-family:Arial;
	margin:0 20px 0 85px;
}

.projectDetails p {
	margin-bottom:5px;
	font-size:.7em;
}

p.name {
	color: #007391;
	font-weight: bold;
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida San Unicode", "Gill Sans", Helvetica, Arial;
	font-size:.9em;
}

p.metadata {
	color: #FF563F;
}

div.projectLink {
	background-color: #F7F2EA;
    bottom: 0;
    padding-left: 85px;
    padding-top: 2px;
    position: absolute;
    width: 100%;
    -moz-box-shadow: -5px -6px 5px #F7F2EA;
    -webkit-box-shadow: -5px -6px 5px #F7F2EA;
    -o-box-shadow: -5px -6px 5px #F7F2EA;
    box-shadow: -5px -6px 5px #F7F2EA;
}

div.projectLink a {
	color: #585F0C !important;
	margin-right: 1em;
	font-family: Arial;
	font-size: .9em;
}

/* Tiny Carousel Styles (Project Showcase - In-subject Scrolling) */

.tinycarousel { height: 200px; overflow:hidden; }
.tinycarousel .viewport { float: left; width: 329px; height: 200px; overflow: hidden; position: relative; border-right:1px solid #d6c6af;}
.tinycarousel .buttons { display: block; margin: 0; position:absolute; right:10px; text-decoration:none !important; font-size:1.25em; }
.tinycarousel .next {bottom:8px;}
.tinycarousel .prev {top:8px;}
.tinycarousel .disable { color:#ddd !important; }
.tinycarousel .overview { list-style: none; padding: 0; margin: 0;  position: absolute; left: 0; top: 0; }
.tinycarousel .overview li{ margin: 0; padding: 0; height: 200px; width: 329px; overflow:hidden; position:relative; }

.tinycarousel .pager { overflow: hidden; list-style: none; margin: 2px 0; width: 20px; position: absolute; top: 30px; bottom: 30px; right: 9px; }
.tinycarousel .pager li {  }
.tinycarousel .pagenum { text-decoration: none; text-align: center; padding: 2px 0 2px 1px; font-weight: normal; display: block; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; margin-bottom: 1px; font-size: .8em; font-family:Arial;}
.tinycarousel .active { color: #fff !important; background-color: #A8906B; }

/* More Info Panel Section */
.panelSection {
	width:310px;
	height:250px;
	float:left;
	margin-right:36px;
}

.panelSection:hover, .panelSection span:hover {
	color:#404040 !important;
}

.panelSection .panelHead {
	line-height: 32px;
	height:32px;
	color:#FFFFFF;
}

.panelSection .panelLink {
	margin-right:.5em;
	color:#404040;
}

.panelSection .panelContent {
	text-align:center;
	padding: 10px 18px 6px 14px;
}

.panelSection .panelContent img {
	padding-top: 0.5rem;
	width: 160px;
	height: 160px;
}

#wiseAdvantage {
	background: url('../images/home/wise-in-action_bg.png') no-repeat center center;
	
}
a#wiseAdvantage{
	cursor: default;
}
a#wiseAdvantage:hover{
	cursor: default;
	text-decoration: none;
}
#wiseInAction {
	background: url('../images/home/wise-tech_bg.png') no-repeat center center;
}
a#wiseInAction {
	cursor: default;
}
a#wiseInAction:hover{
	cursor: default;
	text-decoration: none;
}
#researchTech {
	background: url('../images/home/wise-research_bg.png') no-repeat center center;
	margin:0 -3px 0 0;
	float:right;
	display:block;
}
a#researchTech {
	cursor: default;
}
a#researchTech:hover{
	cursor: default;
	text-decoration: none;
}



#bottomLinks {
	height:75px;
}

#telsLink {
	height: 70px;
	width: 200px;
	position: absolute;
	left: 5px;
	top: 5px;
}

#telsLinkLabel {
	color: #007391;
	position: absolute;
	left: 225px;
	top: 17px;
	font-size: 1.25em;
	width: 210px;
}

#telsLink img {
	vertical-align:top;
}

#openSourceHeader {
	position:absolute;
	top:5px;
	right:5px;
}

#openSourceContent {
	position: absolute;
	right: 5px;
	top: 45px;
	width: 490px;
	text-align: right;
	color: #745A33;
}
#showcurse .title-text{
	display: flex;
	
	margin-bottom: 1rem;
}
#showcurse .title-text h4{
	line-height: 1.5;
	font-size: 1.5rem;
	color:#404040;
	font-weight: bold !important;
}
#showcurse .title-text a{
	text-decoration:underline ;
	margin-right: 3rem;
	font-size: 1.25rem;
	color:#404040;
	font-weight: bold !important;
}
#showcurse .card-group{
display: flex;
justify-content: space-evenly;
}
#showcurse .card-group .card{
	width:25%;
	text-align: center;
	margin-top: 1rem;
	margin-bottom: 1rem;
}
#showcurse .card-group .card .pic{
	
}
#showcurse .card-group .card>h5{
	color: #404040;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	margin-top: 0.5rem;
}

.curse-category{
	display: flex;
	justify-content: center;

}