/*
 Theme Name:   AltspaceVR
 Theme URI:    https://generatepress.com
 Description:  Custom AltspaceVR theme
 Author:       Alicia St Rose
 Author URI:   https://altvr.com
 Template:     generatepress
 Version:      0.1
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Varela Round", sans-serif;
  color: #137D80;
}
h1 {
  font-size: 2.75rem;
}
h2 {
  font-size: 2.3125rem;
}
h3 {
  font-size: 1.6875rem;
}
a:hover {
	text-decoration: underline;
}
.inside-top-bar.grid-container {
  max-width: 1024px;
}
#mobile-header {
	background-color: #282828;
}
#mobile-menu-control-wrapper .menu-toggle {
	font-size: 30px;
}
#masthead .has-inline-mobile-toggle {
	position: fixed;
}
#mobile-menu #menu-primary-navigation-1 {
	background: #333;
}
.nav-float-left .mobile-menu-control-wrapper {
	margin-left: auto;
}

.button,
.nav-button a {
	padding: .3em 1em;
	font-family: "Varela Round",vag-bold,Helvetica,Helvetica,Arial,sans-serif;
	transition: all 250ms ease;
	color: #fff;
	border-radius: 60px;
}
.nav-button a {
	padding: .4em .3em;
    background-color: #137d80;
	border-radius: 60px;
	text-transform: none;
	box-shadow: none;
}
.nav-button a:hover,
.main-navigation a:hover,
.sign-in-link a:hover,
a.button:hover,
a.wp-block-button__link:not(.has-background):hover {
	text-decoration: none;
}
.main-navigation .main-nav ul li.nav-button a:hover,
.main-navigation .main-nav ul li.nav-button[class*="current-menu-"] > a {
	background-color: #29A2A6;
	color: #fff;
	text-decoration: none;
}

.button.outline {
	border: 2px solid #fff;
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}
.button.outline:hover {
    background: rgba(205, 205, 205, 0.3);
    color: #fff;
}
.button.round {
    border-radius: 1000px;
}

.site-logo:hover {
	opacity: .6;
}
.site-logo {
	transition: opacity .2s ease-in-out
}
.sign-in-link {
	display: inline-block;
	position: relative;
	padding-left: 1.75em;
}
.sign-in-link a::before {
    content: '';
    background-image: url('https://altvr.com/wp-content/uploads/2021/10/user.png');
	position: absolute;
	top:0px;
    left:0px;
    background-size: cover;
	width: 21px;
    height: 24px;
}
.sign-in-link a:hover::before {
	background-image: url('https://altvr.com/wp-content/uploads/2021/10/user-hover.png');
}

.sign-in-link a {
	font-family: "Varela Round", sans-serif;
	color: #fff;
}
.sign-in-link a:hover {
	color: #29e0e7;
}
.nav-float-left #site-navigation {
    margin-right: auto;
    order: 0;
}
.hero-heading,
.header-image-title {
    text-shadow: 0 0 6px #000;
}
.device-banner a img {
    opacity: 1;
	transition: opacity .2s ease-in-out;
}

.device-banner a img:hover {
    opacity: .6;
}

/*-------- CONTENT -------*/
.page-hero {
	background-repeat: repeat;
}
.page-header {
	margin-bottom: 0;
}
/*#content {
	padding: 2em 0;
}*/
.home #content,
.page-id-3769 #content,
.page-id-12848 #content,
.page-id-11911 #content,
.page-id-3769 .one-container .container {
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}
.page-id-3769 #content {
	margin-bottom: 40px;
}
.home .entry-content > [class*="wp-block-"]:not(:last-child) { /*maybe specific to Homepage*/
	margin-bottom: 0;
}
/*-------- WIDGETS -------*/

#left-sidebar .widget-title {
	color: #303030;
}
.footer-widgets {
	padding: 2em 0 2.5em;
}

#nav_menu-2 {
  order: 1;
}
.footer-widgets .widget-title {
	color: #f7f7f7;
}
.inline-list li {
  	margin-left: 0.5em;
	font-size: 1rem;
}
.widget ul li {
    margin-bottom: 1.1em;
	font-size: 15px;
}
#left-sidebar .widget ul li {
	margin-bottom: .5em;
}
#left-sidebar .widget-title {
	font-size: 1.5rem;
}
#left-sidebar li.current-menu-item a {
	color: #303030;
}
.inline-list li img,
#footer-widgets a {
  opacity: 0.7;
}
.inline-list li img:hover {
  opacity: 1;
}
.DiscordIcon img {
  width: 32px;
}
/*-------- FOOTER MENU -------*/

.flex-footer-container {
	display: flex;
	max-width: 1024px;
	margin: 0 auto;
	/*padding-bottom: 2em;*/
}
.flex-container {
	display: flex;
}
.footer-logo {
	max-width: 50px;
	margin-right: .5em;
}
.footer-menu {
	width: 100%;
	padding-bottom: 2rem;
	background-color: #000;
}
.footer-menu .flex-footer-container {
	display: flex;
	justify-content: space-between;
}
.footer-menu ul {
	margin-left: 0;
	margin-bottom: 0;
	padding-left: 0;
}
.footer-menu ul li {
	display: inline-block;
	margin-right: .5em;
}
.footer-menu .divsocial_sec ul li {
	margin-left: .4em;
	margin-right: 0;
}
.divsocial_sec ul li img {
	width: auto;
	height: 23px;
}
.footer-menu ul li a {
	color: #fff;
	font-family: "Varela Round", sans-serif;
	font-size: 15px;
}
.footer-menu ul li a:hover {
	color: #33c7cc;
}
#menu-primary-navigation-1 .nav-button a,
#menu-primary-navigation-2 .nav-button a{
	color: #fff;
	background: #137D80;
	text-transform: none;
	font-size: 15px;
	font-weight: normal;
	border-radius: 60px;
	padding: .4em 1em;
}
#menu-primary-navigation-1 .nav-button a:hover,
#menu-primary-navigation-2 .nav-button a:hover{
	background: #29A2A6;
}
#mobile-menu #menu-primary-navigation-1 .nav-button a {
	border-radius: 0;
}
.site-info {
	text-align: right;
}
.inside-site-info {
	align-items: normal;
	border-top: 1px solid #fff; 
}
.copyright-text {
	display: inline-block;
	/*margin-right: 1.5em;*/
}
.footer-language {
	position: relative;
	padding-left: 1.6em;
}
.footer-language::before {
    content: '';
    background-image: url('https://altvr.com/wp-content/uploads/2021/10/globe.png');
	position: absolute;
	top:0px;
    left:0px;
    background-size: cover;
	width: 19px;
    height: 19px;
}

/*-------- CUSTOM TEMPLATES/PAGES -------*/
/*-------- BLOG --------*/
.generate-columns .inside-article {
    padding: 2em;
    background: #fff;
    border-radius: 20px;
}

body.page-id-2546,
body.page-id-11911,/*Device download page*/
body.page-id-12358,/*Business Page*/
.page-id-11911.one-container .site-content,
.page-id-2546.one-container .site-content,
.page-id-12358.one-container .site-content,
.page-id-11911.one-container .container {
   	background-color: #1a1a1a!important;
	color: #fff;
}
.home.one-container .container,
.page-id-12358.one-container .container,
.page-id-11911 .one-container .container{
	padding-top: 0;
	padding-bottom: 0;
}
.page-id-12358.one-container .container {
	padding-left: 0;
	padding-right: 0;
}

.page-id-11911 .site-header,
.page-id-12358 .site-header
{
	background-color: transparent;
}
body.page-id-11911,
body.page-id-12358 {
	color: #fff;
}

.page-id-11911 h1,
.page-id-11911 h2,
.page-id-11911 h3,
.page-id-12358 h1,
.page-id-12358 h2,
.page-id-12358 h3{
	color: #fff;
}

.page-id-11911 .entry-title,
.page-id-12358 .entry-title {
	margin-bottom: .5;
	text-align: center;
}
.page-id-11911 .entry-content { 
	margin-top: .5em;
}
.page-id-11911 article a,
.page-id-12358 article a {
	color: #29e0e7;
}
.page-id-11911 article a:hover,
.page-id-12358 article a:hover{
	color: #fff;
}

/******* DOWNLOAD PAGE *******/
.device-button a.wp-block-button__link {
	position: relative;
	/*padding-right: 30px;*/
}
.device-button a.wp-block-button__link:after {
	margin-left: 8px;
	vertical-align: middle;
	display: inline-block;
}
.device-button.microsoft-button a.wp-block-button__link:after {
	content: '';
	margin-top: -5px;
	background: url('https://altvr.com/wp-content/uploads/2021/10/microsoft-icon-27px.png') no-repeat;
	background-size: cover;
    width: 18px;
	height: 18px;
}
.device-button.oculus-button a.wp-block-button__link:after {
	content: '';
	margin-top: -4px;
	background: url('https://altvr.com/wp-content/uploads/2021/10/oculus-icon-27px.png') no-repeat;
	background-size: cover;
    width: 23px;
    height: 18px;
}
.device-button.steam-button a.wp-block-button__link:after {
	content: '';
	margin-top: -4px;
	margin-left: 3px;
	background: url('https://altvr.com/wp-content/uploads/2021/10/steam-icon-1x.png') no-repeat;
	background-size: cover;
    width: 26px;
    height: 26px;
}
.device-button.mac-button a.wp-block-button__link:after {
	content: '';
	margin-top: -5px;
	margin-left: 3px;
	background: url('https://altvr.com/wp-content/uploads/2021/10/apple-icon-22px.png') no-repeat;
	background-size: cover;
    width: 21px;
    height: 21px;
}
/******* BLOCKS *******/
/*---- COVER ----*/
.wp-block-cover__inner-container {
  	max-width: 1024px;
}

/*---- BUTTON ----*/
.wp-block-button .wp-block-button__link {
    padding: .3em 1em;
	transition: color .1s ease-in-out;
}

.wp-block-button .wp-block-button__link:hover {
	background-color: #29A2A6;
}

/****** MEDIA QUERIES ******/
@media screen and (max-width: 768px) {
	
	.footer-language,
	.copyright-text {
		margin: 0;
	}
	/****** BLOCKS ******/
	/*---- COLUMNS ----*/
	.wp-block-columns .wp-block-column {
		margin-bottom: 2.5em;
	}
	.wp-block-media-text .wp-block-media-text__content {
		padding-left: 3.5%;
		padding-right: 3.5%;
	}
}
@media screen and (max-width: 850px) {
	#mobile-header .inside-navigation {
		padding-right: 3.5%;
		padding-left: 3.5%;
	}
	
	.footer-menu-container {
		visibility: hidden;
	}
	.divsocial_sec ul {
		text-align: center;
		margin: 0 auto;
	}
	#menu-footer-menu {
		text-align: center;
	}
	.site-info {
		text-align: center;
	}
	/****** BLOCKS ******/
	/*---- MEDIA TEXT ----*/
	/*.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media,
	.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
		padding-left: 3.5%;
		padding-right: 3.5%;
	}*/
}
@media screen and (max-width: 920px) {
	.footer-menu-container {
		visibility: hidden;
		display: none;
	}
	.divsocial_sec {
		margin: 0 auto;
	}
	.divsocial_sec ul li:first-child {
		margin-left: 0;
	}
}
@media screen and (max-width: 1024px) {
	.main-navigation.navigation-stick.has-sticky-branding .inside-navigation.grid-container,
	.page-hero .inside-page-hero.grid-container {
		padding-left: 3.5%;
		padding-right: 3.5%;
	}
	.main-navigation.has-branding .menu-toggle, .main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
		padding-right: 3.5%;
	}
	.inside-header {
		padding: 20px 3.5%;
	}
	.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation, .inside-page-header, .one-container .container, .site-main .wp-block-group__inner-container {
		padding: 40px 3.5%;
	}
	
	.home.one-container .container {
		padding-left: 0;
		padding-right: 0;
	}
	#help-section {
		padding: 0 3.5%;
	}
	.footer-widgets-container {
		padding: 40px 3.5%;
	}
	.footer-menu .flex-footer-container {
		padding: 0 3.5%
	}
	.footer-bar {
		display: block;
	}
	#menu-footer-menu ul li {
		display: inline-block;
	}
	.inside-site-info {
		margin-left: 3.5%;
		margin-right: 3.5%
	}
	.site-info span.rights {
		display: block;
	}
}
@media screen and (min-width: 769px) {
	
	.header-wrap,
	.site-header {
	  background: linear-gradient(to top, transparent 0%, black 100%);
	}
	.page-id-11911 article {
		padding-top: 7em;
	}
	/****** BLOCKS ******/
	/*---- MEDIA CONTENT ----*/
	.wp-block-media-text .wp-block-media-text__content {
	  padding-right: 0;
	}
	.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
	  padding-left: 0;
	}
	.device-banner .wp-block-columns {
		flex-wrap: nowrap;
	}
}
@media screen and (min-width: 600px) and (max-width: 850px) {
	.wp-block-buttons>.wp-block-button.has-custom-font-size .wp-block-button__link {
		font-size: 1.12rem;
	}
}
@media screen and (min-width: 851px) {
	.wp-block-buttons>.wp-block-button.has-custom-font-size .wp-block-button__link {
		font-size: 1.5rem;
	}
}
@media screen and (min-width: 1025px) {
	
	.separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation, .inside-page-header, .one-container .container, .site-main .wp-block-group__inner-container {
		max-width: 1024px;
		padding: 40px 0;
	}
	.page-id-3769.one-container .container {
		padding-top: 0;
	}
	#help-section {
		max-width: 1024px;
		margin: 0 auto;
	}
	.footer-bar {
		display: flex;
	}
}
/********** PAGE HEADER BACKGROUND IMAGE ADJUSTMENTS **********/
/*-------- 
 * 8 = Home Page
 * 12848 = Beginners Guide Overview
 * 12358 = Altspace for Business
 * 12841 = Get Started Guide Section
 * 12846 = Get Your Bearings Section
 * 12858 = Get Going Section
 * 12859 = Get Social Section
 * 12860 = Build Events Section
 * 12861 = Build Worlds Section
 --------*/ 
@media screen and (max-width: 320px) {
	.page-id-8 .page-hero {
    	background-position: -350px top;
	}
	.page-id-12848 .page-hero {
    	background-position: -275px center;
	}
}
@media screen and (min-width: 321px) and (max-width: 375px) {
	.page-id-12848 .page-hero {
    	background-position: -250px center;
	}
}

@media screen and (max-width: 425px) {
	.postid-12858 .page-hero {
		background-position:  -390px top;
	}
	.postid-12859 .page-hero {
		background-position:  -200px top;
	}
}

@media screen and (min-width: 321px) and (max-width: 425px) {
	.page-id-8 .page-hero {
    	background-position: -250px top;
	}
}
@media screen and (min-width: 1300px) {
	.postid-12846 .page-hero {
		background-position: center center;
	}
}
@media screen and (min-width: 1401px) {
	.page-id-8 .page-hero {	
		background-position: center -100px;
		padding-top: 380px;
    	padding-bottom: 100px;
	}
}
@media screen and (min-width: 1601px) {
	.page-id-12358 .page-hero {
		background-position: center -200px;
	}
}
@media screen and (min-width: 2000px) {
	.page-id-12358 .page-hero {	
		background-position: center -300px;
	}
	.page-id-12848 .page-hero {	
		padding-top: 550px;
    	padding-bottom: 100px;
	}
	.postid-12841 .page-hero {	
		background-position: center -225px;
	}
	.postid-12858 .page-hero {	
		background-position: center -210px;
	}
	.postid-12859 .page-hero {	
		background-position: center -150px;
	}
	.postid-12860 .page-hero {	
		background-position: center -200px;
	}
	.postid-12861 .page-hero {	
		background-position: center -100px;
	}
	    
}
@media screen and (min-width: 2100px) {
	.postid-12858 .page-hero {
		background-position: center -285px;
	}
}
@media screen and (min-width: 2224px) {
	.postid-12841 .page-hero {	
		background-position: center -300px;
	}
	.postid-12859 .page-hero {	
		background-position: center -200px;
	}	
}
@media screen and (min-width: 2560px) {
	.page-id-12358 .page-hero {	
		background-position: center -400px;
		padding-top: 500px;
	}
	.page-id-8 .page-hero {
    	background-position: center -150px;
	}
}