@font-face {
		  font-family: 'Asap';
		  font-style: normal;
		  font-weight: 400;
		  src: local('Asap'), local('Asap-Regular'), url('nvGvEwsMAvkIa6w2U-PXffesZW2xOQ-xsNqO47m55DA.woff') format('woff');
		}
		@font-face {
		  font-family: 'Asap';
		  font-style: normal;
		  font-weight: 700;
		  src: local('Asap Bold'), local('Asap-Bold'), url('QGN0GG0540fyG6NL_PpOpgLUuEpTyoUstqEm5AMlJo4.woff') format('woff');
		}
		@font-face {
		  font-family: 'Asap';
		  font-style: italic;
		  font-weight: 400;
		  src: local('Asap Italic'), local('Asap-Italic'), url('QnZU7dKCBgkkMBlac2djsOvvDin1pK8aKteLpeZ5c0A.woff') format('woff');
		}
		@font-face {
		  font-family: 'Asap';
		  font-style: italic;
		  font-weight: 700;
		  src: local('Asap Bold Italic'), local('Asap-BoldItalic'), url('_sVKdO-TLWvaH-ptGimJBbO3LdcAZYWl9Si6vvxL-qU.woff') format('woff');
		}

html {
	font-family: Asap, Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: #474646;
	/* overflow: hidden !important; */
	background-color: white;
}

body {
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	/* overflow: hidden !important; */
}

a {
	color: #474646;
	text-decoration: none;
	border-bottom: 1px dashed #ccc;
}

.mbsc-mobiscroll {
	-webkit-transform : translate3d( 0, 0, 999px );
	transform: translate3d( 0, 0, 999px );
}

.chatbox {
	width:100%;
	min-height:50px;
	height:auto;
	padding:10px;
	border-top: 1px dotted lightgray;
}

.mychat .chat-bubble-text:before {
   content:"";
   position: absolute;
   right: -3%;
   top: 30px;
   width: 0;
   height: 0;
   border-top: 10px solid transparent;
   border-left: 20px solid rgb(17, 143, 153);
   border-bottom: 10px solid transparent;
}

.yourchat .chat-bubble-text:before {
   content:"";
   position: absolute;
   left: -3%;
   top: 30px;
   width: 0;
   height: 0;
   border-top: 10px solid transparent;
   border-right: 20px solid lightgray;
   border-bottom: 10px solid transparent;
}

.yourchat .chat-bubble-text {
	background-color: lightgray;
}

.mychat .chat-bubble-text {
	background-color: rgb(17, 143, 153);
}

.chat-bubble-text {
	margin : 10px;
	padding : 5px;
	border-radius: 5px;
}

.chatbox.inactive {
/*	background: rgb(225, 225, 225);
	background: -moz-linear-gradient(90deg, rgb(225, 225, 225) 30%, rgb(235, 235, 235) 70%);
	background: -webkit-linear-gradient(90deg, rgb(225, 225, 225) 30%, rgb(235, 235, 235) 70%);
	background: -o-linear-gradient(90deg, rgb(225, 225, 225) 30%, rgb(235, 235, 235) 70%);
	background: -ms-linear-gradient(90deg, rgb(225, 225, 225) 30%, rgb(235, 235, 235) 70%);
	background: linear-gradient(180deg, rgb(225, 225, 225) 30%, rgb(235, 235, 235) 70%);*/
}

.mychat {
	color:#000;
	text-align:right;
/*	background: rgb(209, 236, 255);
	background: -moz-linear-gradient(90deg, rgb(209, 236, 255) 30%, rgb(229, 245, 255) 70%);
	background: -webkit-linear-gradient(90deg, rgb(209, 236, 255) 30%, rgb(229, 245, 255) 70%);
	background: -o-linear-gradient(90deg, rgb(209, 236, 255) 30%, rgb(229, 245, 255) 70%);
	background: -ms-linear-gradient(90deg, rgb(209, 236, 255) 30%, rgb(229, 245, 255) 70%);
	background: linear-gradient(180deg, rgb(209, 236, 255) 30%, rgb(229, 245, 255) 70%);*/

}

/*
.mychat:after {
	content:'';
	position:absolute;
	border-style:solid;
	border-width:15px 0 0 10px;
	border-color:transparent #EBEBEB;
	display:block;
	width:0;
	z-index:1;
	right:-9px;
	top:20px;
}
*/

.yourchat {
	color:#000;
/*	background: rgb(255, 241, 196);
	background: -moz-linear-gradient(90deg, rgb(255, 241, 196) 30%, rgb(255, 255, 188) 70%);
	background: -webkit-linear-gradient(90deg, rgb(255, 241, 196) 30%, rgb(255, 255, 188) 70%);
	background: -o-linear-gradient(90deg, rgb(255, 241, 196) 30%, rgb(255, 255, 188) 70%);
	background: -ms-linear-gradient(90deg, rgb(255, 241, 196) 30%, rgb(255, 255, 188) 70%);
	background: linear-gradient(180deg, rgb(255, 241, 196) 30%, rgb(255, 255, 188) 70%);*/
}

.yourchat .icon-holder .fa,.mychat .icon-holder .fa {
	font-size:35px;
}

/*
	.yourchat:after {
	content:'';
	position:absolute;
	border-style:solid;
	border-width:15px 10px 0 0;
	border-color:transparent #EBEBEB;
	display:block;
	width:0;
	z-index:1;
	left:-8px;
	top:20px;
}
*/

.button {
	font-family:'Avenir Next W10 Medium';
	line-height:20px;
	width:88px;
	height:30px;
	text-align:left;
	padding:5px 5px 5px 30px;
	border-radius:5px;
	background-color:rgba(0,0,0,0.5);
	color:#fff;
}

input[type=text],input[type=email],input[type=password],textarea {
	color:#474646!important;
/*background-color: #f8f8f8!important;*/
	border-radius:0!important;
	border:none;
	border-bottom:1px solid #ddd;
	-webkit-box-shadow:none!important;
	-moz-box-shadow:none!important;
	box-shadow:none!important;
	margin-bottom:5px;
	display:block;
	width:100%;
	height:24px;
	padding:6px 12px;
	font-size:14px;
}

input:focus,textarea:focus {
	outline: none;
}

textarea {
	resize:none;
}

.pageview {
	background:#fff;
	background:-moz-linear-gradient(90deg,#fff 30%,#f4f4f4 70%);
	background:-webkit-linear-gradient(90deg,#fff 30%,#f4f4f4 70%);
	background:-o-linear-gradient(90deg,#fff 30%,#f4f4f4 70%);
	background:-ms-linear-gradient(90deg,#fff 30%,#f4f4f4 70%);
	background:linear-gradient(180deg,#fff 30%,#f4f4f4 70%);
}

.nav {
	/*background: rgb(255, 255, 255);
	background: -moz-linear-gradient(90deg, rgb(255, 255, 255) 65%, rgb(250, 250, 250) 90%);
	background: -webkit-linear-gradient(90deg, rgb(255, 255, 255) 65%, rgb(250, 250, 250) 90%);
	background: -o-linear-gradient(90deg, rgb(255, 255, 255) 65%, rgb(250, 250, 250) 90%);
	background: -ms-linear-gradient(90deg, rgb(255, 255, 255) 65%, rgb(250, 250, 250) 90%);
	background: linear-gradient(180deg, rgb(255, 255, 255) 65%, rgb(250, 250, 250) 90%);*/
	background-color: white;

	position:fixed;
	top:0;
	border-bottom: 1px solid #f8f8f8;
}

.nav.hidden {
	visibility:hidden;
}

.mychat .icon-parent {
	float: right;
}

.yourchat .icon-parent {
	float: left;
}

.icon-parent {
	border:0px solid red;
	/*position: absolute;*/
}

.icon-parent.memberlist {
	position: relative;
	float: left;
}

.icon-holder {
	display : block;
	width : 45px;
	height : 40px;
	background-color : #fff;
	-webkit-border-radius : 16px 16px 16px 16px / 108px 108px 72px 72px;
	border-radius : 75% / 50%;
	overflow : hidden;
	text-align : center;
}

.mychat .chattext-parent {
	right:50px;
	margin-left: 50px;
}

.yourchat .chattext-parent {
	left:50px;
	margin-right: 50px;
}

.chattext-parent {
	position: relative;
	top:0px;
	font-size:17px;
	word-wrap: break-word;
}

.chattext-name {
	font-size: 14px;
	color: #999;
}
	
.uduhamburger {
	margin:10px;
	font-size:28px!important;
}

.famous-root {
	opacity:.999999!important;
/* ios8 hotfix */
}

.chat-bubble-image {
	width:80%;
}

.chat-bubble-image-source {
	font-size:10px;
	word-wrap: break-word;
	margin-right: 10px;
	width: 80%;
}

.chat-bubble-timestamp {
	font-size:10px;
}

.site-preview-name {
	opacity:.5;
}

.site-preview-image {
	max-width:80%;
}

.site-preview-video {
	max-width : 80%;
}

.site-preview-container {
	border:0px solid #000;
	margin-top : 0px;
}

.site-preview-container div {
	margin-left: 60px;
}
.site-preview-container div img {
	margin-left: -60px;
	/*float: left;*/
	margin-right: 10px;
	border-radius: 5px;
}

.channel-name {
	font-size:14px;
	margin: 10px; 
}

.channel-name.memberlist {
	margin: 0px; 
}

.channel-members {
	font-size:12px;
	margin: 10px;
	color: #999;
}

.channel-dropdown-button {
	background-color: transparent;
	color: #474646;
	line-height: 30px;
	font-size: 24px;
	text-align: center;
}

.loading-blocker {
	background-color: white;
}

.loading-surface {
	
}

.modal-blocker {
	background-color: white;
}

.modal-surface {
	background-color: white;
	border: 1px solid #999;
	border-radius: 24px/16px;
	padding: 16px;
	border-radius: 4px;
	padding: 8px;
}

.modal-surface ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	min-width: 120px;
}

.modal-surface li {
	padding: 8px 2px;
	border-bottom: 1px solid #999;
}

.modal-surface li:first-child {
	padding-top: 0;
}

.modal-surface li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.modal-surface form input[type=text],input[type=email],input[type=password],textarea {
	width: initial;
}

.modal-form {

}

.modal-form .udubutton {
	display: block;
	margin: 8px;
}

.modal-form-buttons {
	text-align: right;
}

.modal-form-buttons a {
	margin-left: 10px;
}

.gallery-image {
	margin:2px;
}

.channel-bg {
	background:#fff;
	background:-moz-linear-gradient(90deg,#fff 30%,#f8f8f8 79%);
	background:-webkit-linear-gradient(90deg,#fff 30%,#f8f8f8 79%);
	background:-o-linear-gradient(90deg,#fff 30%,#f8f8f8 79%);
	background:-ms-linear-gradient(90deg,#fff 30%,#f8f8f8 79%);
	background:linear-gradient(180deg,#fff 30%,#f8f8f8 79%);
}
.channellist-bg {
	background-color: #f8f8f8;
}
.channelheader-bg {
	background-color: #FCD917;
	color: #737373;
	font-size: 14px;
	font-weight: 100;
	letter-spacing: 4px;
	text-transform: uppercase;
	line-height: 22px;
}

.swoop-bg {
  background-image: url('data:image/svg+xml;utf8,<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1600px" height="2100px" viewBox="0 0 1600 2100" enable-background="new 0 0 1600 2100" xml:space="preserve"><polygon fill="#1D1D1B" points="-14.6,549.4 -14.6,570.3 -14.6,1091.4 -14.6,1091.4 -14.6,549.4 "/><path opacity="0.1" fill="#1D1D1B" d="M1599.8,1054V25.2h-473.5h-99H411.6c-5.8,0-11.6,0.1-17.3,0.4C187.3,34.3,21.8,198.7,18,401.6V773v567.2v125.6V2100h1581.8v-501.8v-258v-246.1c0.1-6.7,0.2-13.4,0.2-20.1S1599.9,1060.6,1599.8,1054z"/></svg>');
  background-attachment: fixed;
}

.boardheader-bg {
	color: #fff;
	background-color: #23CAD3;
	font-size: 14px;
}

button {
	display: inline-block;
	margin-bottom: 0;
	font-weight: 400;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	background-image: none;
	white-space: nowrap;
	padding: 6px 12px;
	line-height: 1.42857143;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: none;
}

.udubutton {
	outline: 0!important;
	font-size: 14px;
	line-height: 20px;
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
	box-shadow: none!important;
	background-color: #eee!important;
	border: 2px solid #ddd;
	color: #333 !important;
	border-radius: 8px;
	text-align: center;
	padding-top: 7px;
}

.udubutton i {
	font-size: 2rem;
	margin-top: -4px;
}

.icon-holder-profile {
	background-color: #fff;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	border: 5px solid #000;
	text-align: center;
	overflow: hidden;
	margin-top: 15px;
	margin-left: 25%;
}

.icon-holder-profile .fa {
	font-size: 170px;
	color: black;
}


/*DEMO STUFF*/
.grid-container-outer {
	background-color : blue;
	opacity : 0.999;
}

.scrolling-block {
	border : 1px solid black;
	height : 120px;
}

.grid-container-inner {
	z-index : 800;
	background-color: purple;
	position : relative;
	opacity : 0.999;
}

.errormodalbg {
	opacity: .75;
	background-color: black;
}

.errormodal {
    background-color: white;
    border-radius:10px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding-box;
    background-clip: padding-box;
    font-size: 17px;
	padding: 10px;
}

.channellistbox-parent {
	border-bottom: 1px solid #eee;
	padding: 0px;
}

.channellisticon {
	font-size: 40px !important; /* overwrite fa*/
	margin: 5px;
	margin-left: 10px;
	float: left;
}

.channellisticon.chaticon {
	color: #72CCD2;
	border: 1px solid rgb(215, 215, 215);
	border-radius: 5px;
	padding: 5px;
	font-size: 25px !important; /* overwrite channellisticon*/
	background-color: rgb(215, 215, 215);
}

.pagetranslogo {
	margin: auto;
	/*position: absolute;
	top: 45%;
	left: 45%;*/
	font-size: 50px !important;
}

.pagetransition {
	background-color: white;
	text-align: center;
	color: black;
}

.suggestButton {
	border-bottom: 1px solid #f8f8f8;
	background-color: white;
	color: #bbbbbb;
}

.suggestButton .channel-name {
	line-height: 25px;
}

.UduPoll {
	
}

.UduPollTitle {
	
}

.pollImage {
	background: url("http://thecatapi.com/api/images/get?format=src&type=jpg,png,gif") no-repeat center center;
	background-size: cover;
	background-position: 50% 50%;
	width: 100%;
	height: 100%;
}

.pollText {
	font-size: 90%;
	background-color: white;
	position: absolute;
	max-width: 75%;
	top: 8px;
	left: 0px;
	padding: 2px;
	overflow: hidden;
}

.pollButton {
	background-color: white;
	padding: 2px;
	border-radius: 8px;
}

.pollButton i {
	font-size: 2rem;
	color: #ccc;
}

.pollButtonSelected {
	background-color: green;
	color: white;
}

.searchCardImage {
	background: url("http://thecatapi.com/api/images/get?format=src&type=jpg,png,gif") no-repeat center center;
	background-size: cover;
	background-position: 50% 50%;
	width: 100%;
	height: 100%;
}

.searchCardTitle {
	font-weight: bold;
}

.searchCardText {
	font-size: 90%;
	background-color: white;
	position: absolute;
	max-width: 75%;
	top: 8px;
	left: 0px;
	padding: 2px;
	max-height: 90%;
	overflow: hidden;
}

.modal-surface .searchCardImage {
	min-width: 300px;
	min-height: 300px;
}

.user-uploaded-image {
	width : 80%;
}

.hidden-contact-check {
	color : transparent;
	float : right;
	margin-right : 10px;
}

.contact-method-checked .fa-check {
	color : black;
}

.settingsuserheaders {
	background-color: #23CAD3;
	color: white;
	color: #fff!important;
	font-weight: 100;
	letter-spacing: 4px;
	font-size: 14px;
	text-transform: uppercase;
}

.settingscontactheaders {
	background-color: #31B1B1;
	color: white;
	color: #fff!important;
	font-weight: 100;
	letter-spacing: 4px;
	font-size: 14px;
	text-transform: uppercase;
}

.settingsprefheaders {
	background-color: #2D959A;
	color: white;
	color: #fff!important;
	font-weight: 100;
	letter-spacing: 4px;
	font-size: 14px;
	text-transform: uppercase;
}

.profilebg {
	opacity: 0.4 !important;
}

.channel-name-in-header {
	max-width : 65%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/*Progress Loader*/
.file-upload-progress-loader-hidden {
	visibility : hidden;
}

.rotating {
	-webkit-animation: rotating 2s linear infinite;
	-moz-animation: rotating 2s linear infinite;
	-ms-animation: rotating 2s linear infinite;
	-o-animation: rotating 2s linear infinite;
	animation: rotating 2s linear infinite;
	transform-origin: 50% 50%;
}

.rotating > svg {
	height: 100%;
	display: block;
}

@keyframes rotating {
	from {
		transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
	}
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
	from {
		transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
	}
}
/*End Progress Loader*/
            
.UduVideoChat iframe {
	width: 100%;
	height: 100%;
	border: 0;
}

.chat-feature-list-buttons {
	margin : 5px;
}

.active-slide-indicator {
	fill : red !important;
}

.slide-indicator {
	fill : white;
	stroke : red;
}

.hidden-slide-indicator {
	display : none;
}

/*Image editor*/
#profile-pic-container {
    border: 1px solid #333;
    overflow: hidden;
    position: relative;
    width: 256px;
    height: 256px;
    /*
    	dh : this (margin-top : 50px;) is just a hack for now to make it look decent
    	we should probably change the way elements are laid out in the modal
    */
    margin-top : 50px;
}

.profile-button {
    font-size: 18px;
    line-height: 20px;
    position: absolute;
    top: 2px;
    width: 40px;
    height: 40px;
    background-color: rgba( 255, 255, 255, 0.8 );
    border: 1px solid #333;
    border-radius: 8px;
}

.profile-button:focus {
    outline: none;
}

#profile-zoom-in {
    left: 2px;
}

#profile-zoom-out {
    left: 44px;
}

#profile-pic {
    position: absolute;
    background-color: black;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;     
    user-select: none;
    cursor: default;
}

#profile-canvas {
    width: 256px;
    height: 256px;
    border: 1px solid #333;
    display : none;
}

.when-widget-calendar-text {
	font-size: 12px;
	margin-top: .3em;
}

/*End Image editor*/
