body, html{overflow-x: hidden;color: #666666; font-family: "Open Sans", sans-serif; background: none; }
body.body-of-page-index,html.body-of-page-index{background: linear-gradient(45deg, #1dadc0, #1dc8cd, #1a428a);}

#header {background: linear-gradient(45deg, #1dadc0, #1dc8cd, #1a428a); padding: 20px 0; }
#header #logo{position: absolute; }
#header.header-fixed #logo{width: 60px !important; margin-top: -15px; }
.topLink.active a[page]{ letter-spacing: 0.8px; font-weight: bold; }
.topLink.github-topLink .fa-github{ font-size: 24px; position: absolute; }
.topLink.github-topLink p{margin-bottom: 0px;}
/*.topLink img{ width: 20px; margin-right: 6px; margin-top: -4px; }*/
.aLink{ color: #FFF !important; text-decoration: underline; }
.aLink:hover{ text-decoration: underline !important; }
.section-header .section-divider{width: 140px !important;}
.parag{text-align: justify;}

.section-header {margin-bottom: 30px;}

section#intro{padding-bottom: 50px;}
#publications .publicationsList ul {list-style: none;	padding: 0; }
#publications .publicationsList ul li { padding-bottom: 10px;}
#publications .publicationsList i { font-size: 20px; padding-right: 4px; color: #1dc8cd; }
#publications .publicationsList a{ text-decoration: underline; }
#publications .publicationsList .text{ margin-left: 26px; }
#publications .publicationsList .text.authors{ margin-top: 6px; }
#publications .publicationsList .year-text{ margin-top: 20px; text-align: center; }

#games {  background: linear-gradient(rgba(29, 200, 205, 0.65), rgba(29, 205, 89, 0.2)), url(../img/call-to-action-bg.jpg) fixed center center;  background-size: cover;  padding: 80px 0;}
#games .cta-title {  color: #fff;  font-size: 28px;  font-weight: 700;}
#games .cta-text {  color: #fff;}@media (min-width: 769px) {  
#games .cta-btn-container {    display: flex;    align-items: center;    justify-content: flex-end;  }}
#games .link-button {  font-family: "Montserrat", sans-serif;  font-weight: 500;  font-size: 16px;  letter-spacing: 1px;  display: inline-block;  padding: 8px 30px;  border-radius: 25px;  transition: background 0.5s;  margin: 10px;  border: 2px solid #fff;  color: #fff; margin: auto; cursor: pointer;}
#games .cta-btn:hover {  background: #1dc8cd;  border: 2px solid #1dc8cd;}

.gameSection .features-row {  padding: 60px 0 30px 0;}
.gameSection h2 {  font-size: 26px;  font-weight: 700;  color: #000;}
.gameSection h3 {  font-size: 16px;  line-height: 24px;  font-weight: 400;  font-style: italic;  color: #999;}
.gameSection p {  line-height: 24px;  color: #777;  margin-bottom: 30px;}
.gameSection i {  color: #666666;  font-size: 64px;  transition: 0.5s;  float: left;  padding: 0 15px 0px 0;  line-height: 1;}
.gameSection i:before {  background: #1dc8cd;  background: linear-gradient(45deg, #1dc8cd 0%, #55fabe 100%);  background-clip: border-box;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}
.gameSection .advanced-feature-img-right {  max-width: 100%;  float: right;  padding: 0 0 10px 30px;}
.gameSection .advanced-feature-img-left {  max-width: 100%;  float: left;  padding: 0 30px 30px 0;}
#faq-list a[data-toggle=collapse]{font-size: 30px; text-decoration: underline;}
#faq-list a.collapsed{ font-size: 22px; }
#faq-list ul{margin-bottom: 20px;}
.aContent a{display: inline !important; margin: 0px !important; padding: 0px !important; font-size: inherit !important;}

#downloads {  background: #fff; }
#downloads .row {padding-bottom: 30px;}
#downloads .features-img {  text-align: center;  padding-top: 20px;}
#downloads .features-img img {  max-width: 100%;}
#downloads .box {  margin-bottom: 15px;  text-align: center;}
#downloads .icon {  margin-bottom: 10px;}
#downloads .icon i {  color: #666666;  font-size: 40px;  transition: 0.5s;}
#downloads .icon i:before {  background: #1dc8cd;  background: linear-gradient(45deg, #1dc8cd 0%, #55fabe 100%);  background-clip: border-box;  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}
#downloads .title {  font-weight: 300;  margin-bottom: 15px;  font-size: 22px;}
#downloads .title a {  color: #111;}
#downloads .description {  font-size: 14px;  line-height: 24px;  margin-bottom: 10px;}
#downloads .section-description {  padding-bottom: 10px;}

#team .bioText{ display: none; }

.contact-about .social-link{ display: block; line-height: 28px; font-size: 14px; }
.contact-about .social-link i{ font-size: 32px; color: #1dc8cd; float: left; line-height: 1; }
.contact-about .social-link p{ color: #888; font-family: "Montserrat", sans-serif; margin-left: 36px; margin-top: 12px; }
.form #sendmessage {  color: #1dc8cd;  border: 1px solid #1dc8cd;  display: none;  text-align: center;  padding: 15px;  font-weight: 600;  margin-bottom: 15px;}
.form #errormessage {  color: red;  display: none;  border: 1px solid red;  text-align: center;  padding: 15px;  font-weight: 600;  margin-bottom: 15px;}
.form #sendmessage.show,  .form #errormessage.show,  .form .show {  display: block;}
.form .validation {  color: red;  display: none;  margin: 0 0 20px;  font-weight: 400;  font-size: 13px;}
.form input,  .form textarea {  border-radius: 0;  box-shadow: none;  font-size: 14px;}
.form button[type="submit"], .formButton {  background: linear-gradient(45deg, #1de099, #1dc8cd);  border: 0;  border-radius: 20px;  padding: 8px 30px;  color: #fff;}
.form button[type="submit"]:hover, .formButton:hover {  cursor: pointer;}
	
/*FOOTER*/
#footer { width: 100%;}
#footer .footer-links{ margin-top: 30px; margin-bottom: 30px; }
#footer:not(.footer_index) .footer-logos { display: none;}
#footer .footer-logos { text-align: center; padding: 20px;}
#footer .footer-logos img{ height: 60px; border-left: 1px solid #000; padding-left: 5px; padding-right: 5px; }
#footer .footer-logos a:first-child img{ border: none; padding-left: 0px; }
#footer .footer-logos a:last-child img{ padding-right: 0px; }
/*END FOOTER*/

/* READ MORE */
.aReadMore .theContent{ overflow: hidden; text-align: justify;}
.aReadMore .readMoreButton{ color: #1dc8cd; margin-top: 5px; cursor: pointer; text-decoration: underline; font-size: 18px; }
/* END READ MORE */

@media (min-width: 769px) {
	#main { margin-top: 66px; min-height: -moz-calc(100% - 154px);min-height: -webkit-calc(100% - 154px); min-height: -o-calc(100% - 154px); min-height: calc(100% - 154px); }
	/* HEADER */
	#header {min-height: 66px;}
	#header #logo{width: 120px; margin-left: 12px; margin-top: -13px;}
	#header.header_index{ background: none; padding: 0px; padding-top: 20px;}
	#nav-menu-container { position: absolute; right: 20px; max-width: calc(100% - 188px); max-width: calc(100% - 188px); max-width: calc(100% - 188px); max-width: calc(100% - 188px); }
	#nav-menu-container .topLink{ border-right: 1px solid #FFF; }
	#nav-menu-container .topLink:last-child{ border: none;}
	#nav-menu-container .topLink a{ padding: 2px 11px 3px 2px; }
	#nav-menu-container .topLink.hasChild{ padding-right: 13px; }
	.topLink.github-topLink .fa-github{ top: 0px; }

	.sf-arrows .sf-with-ul:after { right: 8px !important; }
	/* END HEADER */
	
	/*INTRO*/
	/*#intro{background: linear-gradient(45deg, #1dadc0, #1dc8cd, #1a428a) !important;}*/
	section#intro{background: none;}

	.universityLogoes{ height: 8vh; margin: auto; margin-top: 10vh; }
	.universityLogoes .logoQMUL{ height: 100%; padding-right: 1%; margin-left: 7vh; }
	.universityLogoes .logoEssex{ height: 100%; border-left: 1px solid #FFF; padding-left: 1%; }
	
	.introTitle{font-size: 44px !important; margin-top: 15vh !important;}
	.funderText{text-align: center;}
	
	/*END INTRO*/
	
	/*PROJECT*/
	#about { padding-left: 40px; padding-right: 40px; }
	.projectDescriptionDivider{display: none; }
	/*END PROJECT*/

	/*GAMES*/
	#games .container{min-height: 400px;}
	.gameSection .gameImage{float: right; width: 60%; margin-bottom: 36px; }
	.gameSection .gameText{float: left; width: 38%; }
	.gameSection .image-caption{margin-top: 7px; color: #777; font-style: italic; text-align: right; }
	/*END GAMES*/
	
	/*DOWNLOADS*/
	#downloads .features-img {    padding-top: 120px;    margin-top: -200px;  }
	/*END DOWNLOADS*/
	
	/*TEAM*/
	#teamReadMore{display: none;}
	.teamBioPopup {border: 2px solid #1dc8cd; box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.15); padding: 20px; position: absolute; width: 500px; top: 0px; left: 0px; z-index: 200; background: #FFF; text-align: justify;display: none;padding-top: 23px; padding-bottom: 20px;}
	.member .popupTeamPic{ position: absolute; z-index: 300; box-shadow: 0px 0px 30px rgba(73, 78, 92, 0.35);}
	.teamBioReadMore{display: none !important;}
	/*END TEAM*/
	
	/*CONTACT*/
	#contact {  box-shadow: none; }
	/*END CONTACT*/
	
	/*FOOTER*/
	#footer.footer_index {position: fixed; bottom: 0px; background: white; width: 100%;}
	#footer.footer_index .footer-links{ display: none; }
	#isMobile{width: 100px;}
	/*END FOOTER*/
}
@media screen and (min-width: 769px) and (max-height: 770px) {
	#footer.footer_index {position: unset; }
}

@media (max-width: 768px) {
	#main { margin-top: 66px; padding-bottom: 40px; min-height: -moz-calc(100% - 154px);min-height: -webkit-calc(100% - 154px); min-height: -o-calc(100% - 154px); min-height: calc(100% - 154px); }

	/* HEADER */
	#header #logo{width: 90px; margin-left: 12px; margin-top: -13px; transition: unset;}

	#nav-menu-container .topLink{ border-right: 1px solid #FFF; }
	#nav-menu-container .topLink:last-child{ border: none;}
	#nav-menu-container .topLink a{ padding: 2px 11px 3px 2px; }
	#nav-menu-container .topLink.hasChild{ padding-right: 13px; }
	.topLink.github-topLink .fa-github{ top: 9px; }

	.sf-arrows .sf-with-ul:after { right: 8px !important; }

	#header{padding: 20px 0; height: 66px;}
	/* END HEADER */
	
	/*INTRO*/
	/*#intro{background: linear-gradient(45deg, #1de099, #1dc8cd, #1a428a) !important;}*/
	section#intro {background: none; overflow: auto; padding-bottom: 0px;}

	.universityLogoes{width: 100%; margin: auto; margin-top: 110px;}
	.universityLogoes .logoQMUL{display:block; width: 180px; margin: auto;}
	.universityLogoes .logoEssex{display:block; width: 210px; margin: auto; margin-top: 20px;}
	
	.introTitle{font-size: 28px !important; margin-top: 48px !important; line-height: 6.4vh !important;}
	.funderText{width: 90%; margin: auto; margin-top: 6vh;}
	/*END INTRO*/
	
	/*PROJECT*/
	.projectDescriptionDivider{margin-top: 20px; }
	/*END PROJECT*/
	
	/*GAMES*/
	#games .advanced-feature-img-right, #games .advanced-feature-img-left { max-width: 100%; float: none; padding: 0px; }
	.gameSection .advanced-feature-img-right{padding: 0px;}
	.gameSection .gameImage{ margin-bottom: 36px !important; display: block; overflow: auto;}
	.gameSection .image-caption{margin-top: 7px; color: #777; font-style: italic; text-align: center; }
	/*END GAMES*/
	
	/*TEAM*/
	.teamBioPopup {display: none !important;}
	.member .pic{ cursor: default !important; }
	.member .popupTeamPic{ display: none !important; }
	.teamBioReadMore {margin-top: 10px;}
	/*END TEAM*/
	
	/*CONTACT*/
	#contact { margin-bottom: 100px; }
	#contact .container{ margin-bottom: 20px;}
	/*END CONTACT*/

	/*FOOTER*/
	#footer .footer-links{ margin-top: 6px; margin-bottom: 10px;}
	#footer.footer_index .footer-links{ margin: 0px; }
	#footer .footer-links a{ padding-left: 8px; font-size: 12px; line-height: 40px; }
	#isMobile{width: 1px;}
	/*END FOOTER*/

	.mobile-hidden {display: none;}
}