@charset "utf-8";
/* CSS Document */
@import "https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";

@import url('https://fonts.googleapis.com/css?family=Montserrat');

:root {
--main-color : #FD4049; /*#e33508;*/
--main-color-hover : #d4363e;

--main-color-1 : #FD4049; /*#e33508;*/
--main-color-hover-1 : #d4363e;

--main-color-2 : #FBA12E;
--main-color-2-hover : #f19b2c;
}

body{
margin:0;
padding:0;
background-color:#222;
font-family: 'Montserrat', sans-serif;
}

#c{
  background-color:black;
  border:1px solid red;
}

.post_button_image{
  cursor:pointer;
  background:url("../img/icon_image_unselected.png");
  background-size:contain;
  width:64px;
  height:64px;
}
.post_button_image:hover,.post_button_image.active{
  background:url("../img/icon_image_selected.png");
  background-size:contain;
}

.post_button_video{
  cursor:pointer;
  background:url("../img/icon_video_unselected.png");
  background-size:contain;
  width:64px;
  height:64px;
}
.post_button_video:hover, .post_button_video.active{
  background:url("../img/icon_video_selected.png");
  background-size:contain;
}

.post_button_audio{
  cursor:pointer;
  background:url("../img/icon_audio_unselected.png");
  background-size:contain;
  width:64px;
  height:64px;
}
.post_button_audio:hover, .post_button_audio.active{
  background:url("../img/icon_audio_selected.png");
  background-size:contain;
}
.form-control-label{
  font-size:1em;
  color:white;
  margin-top:10px;
  width:100%;
}
#form_login input .error,  #form_register input .error{
  border: 2px solid red !important;
}

.mobile_menu{
		height:auto;
		transition:height .2s ease-in;
	}
.hamburger {
	display:none !important;
	}

.whole_page{
	height:100vh;
	width:100vw;
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.browse_button{
  font-size: 0.85em;
  border-bottom: 1px solid white;
  border: 2px solid white;
  padding: 10px 25px;
  border-radius: 50px;
  font-weight: bolder;
}
.browse_button:hover{
  background-color:white;
  color:var(--main-color);
}
.center{
	margin:0 auto;
}
.separator{
	height:20px;
	border-bottom:1px dotted #444;
	margin-bottom:20px;
}
a{
	color:#fff;
	text-decoration:none;
}
a:hover{
	text-decoration:none;
	color:var(--main-color);
}
h2{
	color:#FFF;
	padding-top:10px;
	padding-bottom:10px;
}
h5{ color:#fff;}

.logo{
	width:250px;
}
.circle{
	background-color:#fff;
	color:#222;
	padding:1px 5px;
	border-radius:100px;
	font-style:italic;
}
.hidden{
  display:none;

}
.red-circle{
	background-color:var(--main-color);
	color:#fff;
	width:100px;
  height:100px;
	border-radius:100px;
	font-style:italic;
}

input:checked + .slider.round2 {
    background-color: var(--main-color);
}

a:hover > .circle{
	background-color:#F00;
	color:#fff;
}
a:active > .circle{
	background-color:#F00;
	color:#fff;
}

.container-fluid {
	padding:0;
}

.highlight{
	border:thin solid white;
	min-height:45px;
}
/* start form login ==================================================================*/

.login{
	background-color:var(--main-color-2);
	padding:5px 40px;
	border-bottom-left-radius:5px;
	border-top-left-radius:5px;
	display:inline-block;
	min-width:150px;
	box-shadow:0px 0px 1px #333;
}
.register{
	background-color:var(--main-color);
	padding:5px 40px;
	border-bottom-right-radius:5px;
	border-top-right-radius:5px;
	display:inline-block;
	min-width:150px;
	box-shadow:0px 0px 1px #333;
}
.login:hover{
	background-color:var(--main-color-2-hover);
	color:white;
	cursor:pointer;
}
.register:hover{
	background-color:var(--main-color-hover);
	color:white;
	cursor:pointer;
}
.or{
	background:url(../img/or.png);
	background-size:contain;
	width:24px;
	height:24px;
	z-index:888;
	margin:0 auto;
	left:50%;
	top:50%;
	margin-left:-12px;
	margin-top:-12px;
	position:absolute;
}
.form_login_div, .form_register_div, .register_msg_div{
	height:0px;
	transition:height 2s ease;
	overflow:hidden;
	width:500px !important;
	margin:0 auto;

}
#form_login, #form_register{
	width:500px !important;
	height:auto;
	margin:0 auto;
	visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s linear;
	display:none;
	padding:10px;
	float:left;
	margin-left:-250px;
	position:relative;
	left:50%;
	 transition:opacity 2s ease;
	 transition:visibility 2s ease;
	 transition:display 2s ease;

}
#form_login input,  #form_register input{
	padding:10px;
	border-radius:2px;
	border:thin solid white;
	margin:0 auto;
	margin-top:25px;
	clear:both;
	display:inline-block;
}
#form_login button,  #form_register button{
	padding:10px 40px;
	border-radius:2px;
	border:thin solid white;
	margin-top:25px;
}
#form_login button:hover,  #form_register button:hover{
	background-color:var(--main-color);
	cursor:pointer;
	border:thin solid var(--main-color);
	color:white;
}
/* end form login ==================================================================*/


/* header ==========================================================================*/

.sidemenu_ad{
  background-image: url(../samples/google_ad_square_1.jpg);
  width: 100%;
  height: 150px;
  background-size: contain;
  float: left;
  position: relative;
  margin: 0 auto;
  margin-top: 0px;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: 50px;
}

.icon_gear{
  float:right;
  display:inline;
  height:45px;
  width:45px;
  margin-left:10px;
  background:url(../img/settings_white_192x192.png);
  background-size:26px 26px;
  background-repeat: no-repeat;
  background-position: center center;


}
.icon_gear:hover{
  cursor:pointer;
}
.help-block{
  color:red;
}
.has-error{
  border:1px solid red;
}
.ad_creator{
  width:200px;
  margin:0 auto;
  margin-top:45px;
  padding:20px;
  background-color:var(--main-color);
  color:white;
  font-size:1.1em;
  font-weight:bold;
  border:2px solid var(--main-color-hover);
}
.ad_creator:hover{
  cursor:pointer;
  background-color:var(--main-color-hover);
}

.settings_div{
  display:none;
  background-color:var(--main-color-2);
  width:100px;
  height:auto;
  border:none;
  z-index:999;
  position: absolute;
  top: 45px;
  right: 0;
  padding: 0px;
}
.settings_div a{
  color:#222;
  text-decoration:none;
  font-size:0.85em;
  font-weight:400;
  text-align:left;
}
.settings_div a div{
  width:100%;
  padding:10px;
}
.settings_div a div:hover{
  background-color:var(--main-color-2-hover);

}
.settings_div a:first-child{
  border-bottom:1px solid var(--main-color);
}
.top_header{
	width:100%;
	height:45px;
	background-color:var(--main-color);
	margin:0 auto;
}

.linkbackbutton{
  padding: 5px;border: 2px solid white;position: relative;float: left;margin: 2px;border-radius: 50px;
  color:white;
  font-weight:bold;
  margin-top:3px;
}
.linkbackbutton:hover{
  background-color:#fff;
  color:black;
}

.chat_text{
  width:100%;
  height:4.5em;
  border:none;
  line-height: 1em;
  background-color: #303030;
  padding:10px;
  color:#fff;
  font-size:1em;
  display:inline-block;
}
.chat_button{
  display:inline-block;
  width:auto;
  float:right;
}

.header_logo{
	width:100px;
	margin:0 auto;
	float:right;
	padding:10px;
}

.logged_in_user_newsfeed_profile_img{
	width:100px;
	height:100px;
	position:relative;
	float:left;
	border:4px solid #242424;
	left:50%;
	margin-left:-50px;
	margin-top:20px;
	border-radius:100px;
	overflow:hidden;
	background-size:contain !important;
	z-index:1;
}

.logged_in_user_newsfeed_profile_title{
	position:relative;
	float:left;
	width:100%;
	display:block;
	text-align:center;
	color:#fff;
	font-size:0.75em;
}
.logged_in_user_newsfeed_profile_badges{
  position:relative;
  float:left;
  width:100%;
  display:block;
  text-align:center;
  color:#fff;
  font-size:0.75em;
}
.logged_in_user_newsfeed_profile_badges:after{
  content: "";
  display: block;
  border-bottom: 1px solid #444;
  padding-top: 10px;
  width: 25%;
  margin: 0 auto;
  }

.logged_in_user_side_menu, .logged_in_workshop_side_menu{
	position:relative;
	float:left;
	width:100%;
	display:block;
	text-align:center;
	color:#fff;
	font-size:0.75em;
	z-index:1300;
}
.logged_in_user_side_menu ul, .logged_in_workshop_side_menu ul{
	list-style:none;
	padding:0;
	margin:0 auto;
	width: 120px;
}
.logged_in_user_side_menu ul li, .logged_in_workshop_side_menu ul li{
	width: 130px;
	text-align:left;
	padding:5px;
	line-height:1.5em;
}


.logged_in_user_side_menu ul li:before, .logged_in_workshop_side_menu ul li:before {
      background-color: #900;
      content: '';
      height: 1.5em;
      position: absolute;
      transition: width .2s ease-in;
      width: 0px;
      z-index: -1;
	  margin-right:10px;
	  padding-top:5px;
	  padding-botom:5px;
    }
.logged_in_user_side_menu ul li:hover:before, .logged_in_workshop_side_menu ul li:hover:before  {
        transition: width .2s ease-in;
        width: 100px;
      }
.logged_in_user_side_menu ul li:hover,.logged_in_workshop_side_menu ul li:hover{
		color:#fff !important;
		transition: color .2s ease-in;
}
.logged_in_user_side_menu ul li a, .logged_in_workshop_side_menu ul li a{
	text-decoration:none;
	padding-left:45px;
}

.logged_in_user_newsfeed_profile_title p::after{
		content:"";
		display:block;
		border-bottom:1px solid #444;
		padding-top:10px;
		width:25%;
		margin:0 auto;
	}

  .logged_in_user_newsfeed_profile_badges p::after{
  		content:"";
  		display:block;
  		border-bottom:1px solid #444;
  		padding-top:10px;
  		width:25%;
  		margin:0 auto;
  	}
.backmenu{
	border-bottom:1px dashed #fff
}

/* newsfeed ==========================================================================*/
.newsfeed{
	width:100%;
	height:100vh;
	margin:0 auto;
}

.newsfeed_scroll{
	padding:20px;
}

.button_sponsored_post{
  border:2px solid var(--main-color-hover);
  background-color:var(--main-color);
  color:white;
  font-weight:bolder;
  font-size:0.75em;
  padding:10px 40px;
  cursor:pointer;
}

.button_sponsored_post:hover{
  background-color:var(--main-color-hover);
}
/* posts ==========================================================================*/

.post{
	width:100%;
	height:auto;
	position:relative;
	float:left;
	left:0;
	margin-bottom:45px;
	border:1px solid #373737;
	background:#272727;
	min-height:45px;
}

.post_header{
	width:100%;
	padding:10px;
	height: 70px;
}
.post_header p{
	color:#ccc;
	margin-left:15px;
	position:relative;
	float:left;
	margin-top:10px;
}
.post_header_profile{
	width:50px;
	height:50px;
	position:relative;
	float:left;
	border-radius:100px;
	overflow:hidden;
	background-size:contain !important;
	display:inline-block;
}
.post_content{
	width:100%;
	padding:0px;
	min-height: 70px;
}

.post_comments{
	width:100%;
	padding:10px;
	min-height: 70px;
}
.post_actions{
	margin:0 auto;
  height: 45px;
  position: relative;
  float: left;
  width: 100%;
}
.post_action_star{
	background-image:url(../img/star_open.png);
	background-size:90%;
	height:20px;
	width:20px;
	background-repeat:no-repeat;
	margin:10px;
	display:inline-block;
}
.post_action_star:hover{
	cursor:pointer;
}
.post_action_heart{
	background-image:url(../img/heart_closed.png);
	background-size:90%;
	height:20px;
	width:20px;
	background-repeat:no-repeat;
	margin:0px;
	display:inline-block;
  float: left;
}
.post_action_heart.active{
  background-image:url(../img/heart_closed.png);
}
.post_action_heart:hover{
	cursor:pointer;
}
.post_action_heart_text{
  display:inline-block;
  color:white;
  font-size:0.85em;
  float: left;
  margin:0px;
  margin-left:10px
}

.post_like_block{
  display:inline-block;
  float: left;
  width:auto;
  padding:5px;
  margin:10px;
  background-color:#ccc;
  border-radius: 5px;
}
.post_like_block.active{
  background-color:var(--main-color);
}

.post_like_block:before{
  content: '\25b2';
  position:absolute;
  left:15px;
  top:-5px;
  color:#ccc;
}
.post_like_block.active:before{
  color:var(--main-color);
}
.post_action_subscribe{
	display:inline-block;
	position:relative;
	float:right;
	margin:4px;
	background-color: var(--main-color);;
    color: #fff;
    font-size: 0.75em;
    border: 2px solid var(--main-color);;
	height: 30px;
}
.post_action_subscribe:hover{
	background-color: var(--main-color-hover);
	border: 2px solid var(--main-color-hover);
	cursor:pointer;
}

.post_description{
	width:100%;
	padding:10px;
	min-height: 70px;
	color:#fff
}
.notification{
  display:none;
  position:fixed;
  width:300px;
  height:300px;
  left:50%;
  top:50%;
  margin-left:-150px;
  margin-top:-150px;
  background-color:var(--main-color-2);
  text-align:center;
  color:#111;
}
.notification p{
  padding:10px;
}
.notification.active{
  display: block;
  position:fixed;
  left:50%;
  top:50%;
  margin-left:-150px;
  margin-top:-200px;
}


.hashtag_highlight{
  font-weight:700;
  color:var(--main-color);
  cursor:pointer;
}
.hashtag_highlight:hover{
  color:var(--main-color-hover);
}
.post_description:after, .post_comments:after{
	content:"";
	width:90%;
	display: block; /* This will put the pseudo element on its own line. */
    margin: 0 auto;
	border-bottom:1px solid #555;
	padding-top:20px;
}

.post_comments{
	width:100%;
	padding:20px;
	min-height: 70px;
	color:#fff;
}
.post_comment_action{
	width:100%;
	padding:10px;
	min-height: 70px;
	color:#fff;
	padding-top:0;
}
.post_comment_action input{
	width:100%;
	padding:10px;
	background-color:#272727;
	border:none;
	color:#fff;
}

.carousel-inner {
	height:400px !important;
	background: #222;
}
.tier-carousel{
	height:300px !important;
	background: #222;
}

.carousel-inner .carousel-item img {
	max-height:400px !important;
	width:auto !important;
	margin:0 auto;
	z-index:999;
	max-width: 100%;
}
.tier-carousel .carousel-item img {
	max-height:300px !important;
	width:auto !important;
	margin:0 auto;
	z-index:999;
	max-width: 100%;
}

.carousel-item.active{
	background: #222;
	display: flex !important;
	height:400px;
	vertical-align:center;
}
.tier-carousel .active{
	background: #222;
	display: flex !important;
	height:300px;
	vertical-align:center;
}

.carousel-inner .carousel-item{

}

.level_post_flag{
  position: absolute;
  right: 0;
  padding: 10px;
  background-color: var(--main-color);
  border-radius: 10px 0px 0px 10px;
  min-width: 100px;
  max-width: 200px;
  text-align: center;
  color: #fff;
  font-size: 0.85em;
  font-weight: bolder;
}

.backdrop{
	position: fixed;
  	left: 0;
  	right: 0;
	height:400px;
	width:100%;
	z-index:1;
	opacity:0.1;
	 -webkit-filter: blur(5px);
 	 -moz-filter: blur(5px);
  	-o-filter: blur(5px);
  	-ms-filter: blur(5px);
  	filter: blur(5px);
  	border-top:1px solid #111;
    border-bottom:1px solid #111;
}

.tier{
	position: fixed;
  	left: 0;
  	right: 0;
	height:300px;
	width:100%;
	z-index:1;
  	border-top:1px solid #111;
    border-bottom:1px solid #111;
}

.tier-thumbs{
	width:20%;
	position:relative;
	float:left;
	top:0;
	left:0;
	color:white;
	padding:20px;

	margin:2.5%;
	height:72%;
	display:inline-block;
	margin-top:5%;
  font-size:0.9em !important;
}
.tier-thumbs-vertical{
  width:95%;
  position:relative;
	float:left;
	top:0;
	left:0;
	color:white;
	padding:20px;

	margin:2.5%;
	height:auto;
	display:inline-block;
	margin-top:5%;
  font-size:0.9em !important;
}

.tier-thumbs ul{

  font-size:0.8em !important;
}

.chat_list_people{


}

.chat_list_people:hover{
  cursor:pointer;
  background-color:#111;
}

.unlock{
  font-size:1em;
  font-weight:bolder;

}
#waveform{
	position: relative;
	float: left;
	width: 100%;
}

#waveform_btn{
	width:32px;
	height:32px;
	left:0;
	bottom:0;
	margin:10px;
	padding:2px;
	position:absolute;
	z-index:10;
	background-color:rgba(0,0,0,0.65);
}
#waveform_btn:hover{
	opacity:1;
	cursor:pointer;
}
#waveform_label{
	height:32px;
	background-color:rgba(0,0,0,0.65);
	color:white;
	font-size:0.75em;
	line-height:2.5em;
	position:absolute;
	z-index:11;
	left:0;
	bottom:0;
	margin:10px;
	padding-left:10px;
	padding-right:10px;
	margin-left:42px;
}

wave{
	border:none !important;
}

/* === profile =================================*/
.frm_profile{
  width:100%;
}
.frm_profile label{
  color:white;
}

#profile_img_gallery{
  padding:10px;
  width:220px;
  background-color:#121212;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
#profile_img_gallery img{
  width:200px;
  border-radius:100px;
  height:200px;
}

#profile_cover_gallery{
  padding:10px;
  width:100%;
  background-color:#121212;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
#profile_cover_gallery img{
  width:100%;
  height:auto;
}

.right_side_menu{
list-style: none;
color:white;
margin-top:45px;
text-align:right;

}
.right_side_menu li{
  border-bottom:thin solid #555;
}
.right_side_menu li:first-child{
  border-top:thin solid #555;
}
/* workbench ==============================================*/
.dashboard{
	padding-left:50px;
}

.snap{
	height:auto;
	width:90%;
	display:block;
	padding:10px;
	border:10px solid #222;
}
.snap:hover{
	cursor:pointer;
	opacity:0.75;
}
.snap i, .snap p{
	position:relative;
	float:left;
	width:100%;
	display:inline-block;
	font-size:18px;
	clear:both;

}
.snap i{
	font-size:60px;
}
.snap h3{
	position:absolute;
	right:0;
	top:0;
	padding:10px;
	font-size:44px;
}
.spon {
	background-color:#ffcc00;
}
.pled {
	background-color:#2d89ef;
}
.view {
	background-color:#00aba9;
}
.msgs {
	background-color:#cc3333;
}
#regions_div rect{
	fill:#222 !important;
}
.xul{
	padding:0;
}
.padding-16{
	padding-top:16px;
	padding-bottom:5px;
	/*background-color:rgba(0,0,0,0.1);*/
	margin-bottom:16px;
}
.circle-1{
	background-color:#fff;
	color:#222;
	border-radius:100px;
	font-style:italic;
	width:100px;
	margin-left:10px;
}
.post-history{
	position:relative;
	float:left;
	height:auto;
	width:100%;

}
.post-history p{
	color:#fff;
	font-size:0.75em;
	vertical-align:top;
}

.rect-1{
	background-color:#111;
	color:#222;
	font-style:italic;
	width:200px;
	height:100px;
	float: left;
	margin: 10px;
	text-align:center;
	vertical-align:top;
	margin-top:0;
}
.spacer{
	height:45px;
	width:100%;
}
.rect-1 img{
	max-width:100%;
	max-height:100%;
	margin:0 auto;

}
.xlarge{
	padding:16px;
	font-size:22px;
	color:#fff;

}
.xlarge span{
	font-size:16px;
	font-style:italic;

}
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}
.posting{
	margin-bottom:45px;
	color:#fff;
}
.check_div{
	position:relative;
	float:left;
	display:inline-block;
	width:auto;
	margin-right:10px;
}
.form-check{
	display:inline-block;
	padding:10px !important;
	cursor:pointer;
	width:20pt;
	height:20pt;
	border-radius:5px;
	vertical-align: middle;
	text-align:center;
	margin:20px 0px;
}
.check_div:hover .check_label{
	display:block;
}

/*.check_label:after{
	content:"\25c0";
	position:absolute;
	left:-12px;
	color:#fff;
}*/

.check_label{
	display:none;
	position:absolute;
    bottom:42px;
    /*width: 28px;*/
    white-space: nowrap;
    /*Firefox*/
    -moz-transform: rotate(-45deg);
    /*Safari*/
    -webkit-transform: rotate(-45deg);
    /*Opera*/
    -o-transform: rotate(-45deg);
    /*IE*/
    background-color:var(--main-color);
	padding:5px;
	border-radius:5px;
	color:#fff;
	text-align:center;
	vertical-align:middle;
	-moz-transform-origin:bottom left;
	-webkit-transform-origin:bottom left;
	-o-transform-origin:bottom left;
	left:15px;

}
/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: none;
    border-top: none;
	background-color: #333;
}
.tabcontent {
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

#gallery{
	padding-top:10px;
	padding-bottom:10px;
}
#gallery img{
	height:100px;
	width:auto;
	margin-right:10px;
}
/* Go from zero to full opacity */
@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}



/*----------------------------------------------------------*/
/* profile page */
.profile_scroll{
	padding:0;
}
.profile_cover{
	width:100%;
	height:400px;
	background-color:#fff;
	background-size:cover;
	position:relative;
	float:left;
}
.profile_cover_image{
	width:100%;
	height:400px;
	background-color:#fff;
	background-size:cover;
	position:relative;
	float:left;
	margin:0 auto;
}
.profile_cover_text{
	width:100%;
	height:100%;
	padding-left:10%;
	padding-right:10%;
	background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.75));
	position:absolute;
	bottom:0;
	display:table-cell;
	vertical-align:center;
}
.profile_cover_text h1{
	position:absolute;
	bottom:0;
	padding-bottom:45px;
	font-size:2em;
	color:white;
	font-weight:600;
}
.profile_cover_text h1:before{
	background-image: url(../img/badge_verified.png);
    background-size: 32px 32px;
    display: inline-block;
    width: 32px;
    height: 32px;
    content:"";
	margin-left:-40px;
	margin-right:10px;
}
.profile_buttons{
	width:350px;
	height:65px;
	background-color:rgba(255,255,255,0.75);
	position:absolute;
	bottom:0;
	right:0;
	margin:20px;
	border-radius:10px;
}

.profile_button{
	width:24%;
	height:100%;
	display:inline-block;
	text-align:center;
	cursor:pointer;
}
.profile_button:not(:last-child):after{
	content:"";
	height: 70%;
	top: -70%;
	width: 2px;
	background-color: #ececec;
	position: relative;
	float: right;
}
.profile_button img{
	width:auto;
	height:65%;
	max-width:100%;
	max-height:100%;
	margin:0 auto;
}
.profile_button P{
	width:100%;
	text-align:center;
	font-size:0.65em;
	font-weight:600;
	color:var(--main-color);
	margin:0;
}
.profile_stats{
	width:100%;
	height:auto;
	background-color:#2f2f2f;
	color:#fff;
	padding:20px;
	position:relative;
	float:left;
}
.stats {
	margin:0;
	float:left;
	vertical-align:top;
	top:0;
	position:relative;
}
.stats h1{
	font-size:1.5em !important;
	padding:0;
}
.stats p{
	font-size:0.85em !important;
}

.aboutme h1, .myfeed h1{
	color:#fff;
	font-size:2em;
}



.aboutme p, .myfeed p{
	color:#fff;
	font-size:1em;
	text-align:left justify;
}
.aboutme img:nth-child(even){
	float:left;
	margin:10px;
	margin-left:0;
	max-height:150px;
}
.aboutme img:nth-child(odd){
	float:right;
	margin:10px;
	margin-right:0;
	max-height:150px;
	width:auto;
}

.welcome_video{
	border:2px solid #fff;
	margin-bottom:10px;
}

.button_follow{
	width:100%;
	height:auto;
	padding:10px;
	color:#fff;
	font-size:1em;
	font-weight:600;
	border-radius:5px;
	background-color:var(--main-color);
	cursor:pointer;
	border:1px solid var(--main-color);
}
.button_follow:hover{
	background-color:var(--main-color-hover);
	cursor:pointer;
	border:1px solid var(--main-color-hover);
}
.button_generic{
	width:100%;
	height:auto;
	padding:10px;
	color:#fff;
	font-size:1em;
	font-weight:600;
	border-radius:5px;
	background-color:#666;
	cursor:pointer;
	border:1px solid #666;
}
.button_generic:hover{
	background-color:#000;
	cursor:pointer;
	border:1px solid #000;
}
.button_white{
	width:100%;
	height:auto;
	padding:10px;
	color:#333;
	font-size:1em;
	font-weight:600;
	border-radius:5px;
	background-color:#fff;
	cursor:pointer;
	border:1px solid #fff;
}
.button_white:hover{
	background-color:#ccc;
	cursor:pointer;
	border:1px solid #ccc;
}
.social_icons{
	padding:5px;
	margin:0;
}

.social_icons img{
	width:100% !important;
	float:left !important;
	margin: 0 auto !important;
max-width: 100% !important;
cursor:pointer;
}
.social_icons_small{
  width:32px;
  height:32px;
  background-size:cover !important;
  background-repeat: none;
  display:inline-block;
  cursor:pointer;
}
.mini-badges{
	padding:8px;
	margin:0;
  display:inline-block;
}

.mini-badges img{
	width:100% !important;
	float:left !important;
	margin: 0 auto !important;
	max-width: 100% !important;
	cursor:pointer;
}
.badges{
	padding:5px;
	margin:0;
}

.badges img{
	width:100% !important;
	float:left !important;
	margin: 0 auto !important;
	max-width: 100% !important;
	cursor:pointer;
}

.switch{
  position: relative;
float: left;
height: 25px;
margin: 0 auto;
}
.profile_levels{
	width:100%;
	height:auto;
	background-color:#333;
	color:#fff;
	padding:20px;
	position:relative;
	float:left;
}
.profile_level{
	width:100%;
	height:auto;
	background-color:var(--main-color);
	color:#fff;
	padding:0px;
	position:relative;
	float:left;
}
.levels {
	margin:0;
	float:left;
	vertical-align:top;
	top:0;
	position:relative;
	padding:0;
}
.levels h1{
	font-size:1.5em !important;
	padding-left:20px;
	padding-right:20px;
	padding-top:20px;
}
.levels h5{
	font-size:0.85em !important;
	padding:0;
	color:#fff;
	padding-left:20px;
	padding-right:20px;
}
.levels p, .levels li{
	font-size:0.85em !important;
	padding-left:20px;
	padding-right:20px;
}

.levels .head{
	width:100% !important;
	height:auto !important;
	max-width:100% !important;
	padding:0 !important;
	margin:0 !important;
}

switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
  width:250px;
  height:35px;
}
.slider {
	padding:5px;
	text-indent:50px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(200px);
  -ms-transform: translateX(200px);
  transform: translateX(200px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
/* Rounded sliders */
.slider.round2 {
  border-radius: 5px;
}

.slider.round2:before {
  border-radius: 15%;
}

.tierpost{
  color:#222;
}

.largesse{
  padding:15px 40px !important;
  margin:0 !important;
  line-height: 1.2em;
  height:auto;
  font-size:1.2em;
  border-radius:5px;
  float:left;
}

.creator_list{
	float:left;
	height:261px;
	background-color:#fff;
	background-size:cover !important;
	position:relative;
	float:left;
	margin-bottom:25px;
	padding:0 !important
	}

.creator_list_image{
	height:100%;
	background-color:#fff;
	background-size:cover !important;
	position:relative;
	float:left;
	margin:0 auto;
  background-position:center !important;
}
.creator_list_text{
	height:100%;
	padding-left:2%;
	padding-right:10%;
	background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.65));
	position:absolute;
	bottom:0;
	display:table-cell;
	vertical-align:center;
	left:0;
}
.creator_list_text h1{
	position:absolute;
	bottom:0;
	padding-bottom:10px;
	font-size:2em;
	color:white;
	font-weight:600;
}
.creator_list_deets{
	float:left;
	padding:0;
	width:175px;
	height:261px;
	background-color:var(--main-color);
	border-top-right-radius:25px;
	border-bottom-right-radius:25px;
	margin-left: 0;
	left:0;
}
.creator_list_deets button{
	font-size:0.65em;
	display:inline;
	float:left;
}

.creator_list_deets .button_generic{
	background-color:	#7b1d04;
	border: #7b1d04;
}

.creator_list_deets .stats h1{
	font-size:1.2em !important;
	color:#fff;
	margin-top:5px;
	margin-bottom:0px;
}
.creator_list_deets .stats p{
	color:#7b1d04;
}

.creator_list_filter{
	background-color:#444;
	height:200px;
	padding:20px;
	margin-bottom:45px;

}

.creator_category_circle{
	display:inline;
	float:left;
	padding:5px;
	background-color:#ccc;
	margin:10px;
	border-radius:25px;
	text-align:center;
	color:#222;
	font-weight:600;
	font-size:0.45em;
	padding-left:20px;
	padding-right:20px;
	cursor:pointer;
}

.widget{
	padding:20px;
}

.tier-next, .tier-previous {
	top:auto !Important;
	width:64px;
	height:64px;
}

.tooltip {

}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}


.item_thumb{
	width:98%;
	height:240px;
	background-color:#111;
	float:left;
	top:0;
	left:0;
	border-radius:4px;
	display:inline-block;
	margin-bottom:45px;
}

.item{
	width:100%;
	height:auto;
	background-color:#111;
	float:left;
	top:0;
	left:0;
	border-radius:4px;
	display:inline-block;
	margin-bottom:45px;
}


.item_thumb_img{
	float:left;
	width:100%;
	height:auto;
	overflow:hidden;
	border-top-left-radius:4px;
	border-top-right-radius:4px;
	max-height:160px;
}

.item_img{
	float:left;
	width:100%;
	height:auto;
	overflow:hidden;
}

.item_thumb h1{
	color:white;
	font-size:0.85em;
	padding:4%;
	margin:0 auto;
	margin-top:10px;
	float:left;
	width:100%;
}
.item_thumb h2{
	color:var(--main-color);
	font-size:0.75em;
	padding:4%;
	margin:0 auto;
	float:left;
	display:inline-block;
	top:0;
}
.item_thumb h3{
	background-color:var(--main-color);
	color:white;
	font-size:1.5em;
	padding:5px;
	border-radius:4px;
	margin:2%;
	cursor:pointer;
	z-index:99;
	position:absolute;
}
.item_thumb h3:hover{
	background-color:var(--main-color-hover);
}

.visible{
 	visibility: visible !important;
  	opacity: 1 !important;
  	display:inline !important;
     transition:opacity 2s ease;
	 transition:visibility 2s ease;
	 transition:display 2s ease;
  }

  .login_shrink{
  height:500px;
  transition:height 2s ease;
}
  .msg_shrink{
  height:500px;
  transition:height 2s ease;
  }
  .register_shrink{
	height:1000px;
	transition:height 2s ease;
  }

@media only screen and (max-width: 760px){

  .sidemenu_ad{
    display: none;
  }



  .icon_gear{
    display:none;
  }
.profile_cover_text h1 {
    bottom: 40px;

 }

	.logo{
		width:250px;
	}

	.logged_in_user_newsfeed_profile_img{
		width: 40px;
		height: 40px;
		position: relative;
		float: left;
		border: 1px solid #242424;
		margin-left: 0;
		margin-top: 3px;
		border-radius: 40px;
		left: 0;
	}
.logged_in_user_newsfeed_profile_badges{
  position:relative;
  float:left;
  width:auto;
  display:table;
  text-align:center;
  color:#fff;
  font-size:0.65em;
  height: 100%;
  margin-left:5px;
}
.logged_in_user_newsfeed_profile_badges:after{
  content: "";
  display: block;
  border-bottom: 1px solid #444;
  padding-top: 10px;
  width: 25%;
  margin: 0 auto;
  }
	.logged_in_user_newsfeed_profile_title{
		position:relative;
		float:left;
		width:auto;
		display:table;
		text-align:center;
		color:#fff;
		font-size:0.75em;
		height: 100%;
		margin-left:5px;
	}
	.logged_in_user_newsfeed_profile_title p, .logged_in_user_newsfeed_profile_badges p{
		display:table-cell;
		vertical-align:middle;
	}

	.logged_in_user_newsfeed_profile_title, .logged_in_user_newsfeed_profile_img, .logged_in_user_newsfeed_profile_badges{
		display:none;
	}

	.logged_in_user_newsfeed_profile_title p::after{
		content:"";
		display:block;
		border-bottom:none;
		padding-top:0px;
		width:25%;
		margin:0 auto;
	}
  .logged_in_user_newsfeed_profile_badges p::after{
    content:"";
    display:block;
    border-bottom:none;
    padding-top:0px;
    width:25%;
    margin:0 auto;
  }

	.top_header{
		height:auto;
	}

	.hamburger {
		float:left;
		display:inline-block !important;
	}
	.hamburger-inner, .hamburger-inner:before, .hamburger-inner:after {
		background-color:#fff !important;
	}

	.logged_in_user_side_menu ul, .logged_in_workshop_side_menu ul{
		margin-top:55px;
		width: 100%;
	}
	.logged_in_user_side_menu ul li, .logged_in_workshop_side_menu ul li{
		width: 100%;
		text-align:left;
		padding:5px;
		line-height:1.5em;
	}

	.mobile_menu{
		height:0;
		overflow:hidden;
		transition:height .2s ease-in;
	}
	.header_logo, .logo_section {
		position:absolute;
		top:0;
		right:0;
	}


.form_login_div, .form_register_div, .register_msg_div{
	width:100% !important;


}
#form_login, #form_register{
	width:100% !important;
	margin:0;
	position:relative;
	left:0;
}


}

.shrink{
	height:700px;
	transition:height 2s ease;
  }
