/*Fonts*/
@font-face {
  font-family: 'ufreedoms_icon';
  src:  url('../fonts/ufreedoms_icon/fonts/ufreedoms_icon.eot?diivzy');
  src:  url('../fonts/ufreedoms_icon/fonts/ufreedoms_icon.eot?diivzy#iefix') format('embedded-opentype'),
    url('../fonts/ufreedoms_icon/fonts/ufreedoms_icon.ttf?diivzy') format('truetype'),
    url('../fonts/ufreedoms_icon/fonts/ufreedoms_icon.woff?diivzy') format('woff'),
    url('../fonts/ufreedoms_icon/ufreedoms_icon.svg?diivzy#ufreedoms_icon') format('svg');
  font-weight: normal;
  font-style: normal;
}

html, body {
	height: auto!important;
}


/*Background*/

.bgAqua {
	background-color: #00e1be!important;
}

.bgAquaStrong {
	background-color: #31ceb3!important;
}

.bgAquaStronger {
	background-color: #3d6d61!important;
}

.bgGradient {
	background: linear-gradient(to bottom, #f5f9fc 35%, #dddcd7 65%)
}

.bgLeft {
	background-image: url("../images/Fondo_1.png");
	background-size: cover;
	background-repeat: no-repeat;
	color: white;
	min-height: 770px;
	background: linear-gradient(to bottom, #f5f9fc 0%, #0a3433 100%);
}

.bgRight {
	background: linear-gradient(to bottom, #e1e1dd 0%, #0a3433 100%);	
	min-height: 770px;
}


.bgLeft img {
	transform: translate(0px,-100px);
}

/*tools*/
div.clear {
	clear: both;
}

* {
	font-family: 'Raleway', sans-serif;
}

.container-fluid {
	padding: 0px!important;
}

/*Navbar*/
#navbar {
	background-color: #00e1be;
	min-height: 68px;
	color: white;
	font-size: 1.3em;
	text-align: center;
}

#navbar a {
	color: white!important;
}

#navbar [class^='col'] {
	min-height: 68px;
}

#navbar img.logo {
	max-height: 91px;
	margin-left: 1em;
	padding-top: 8px;
	text-align: left;
	z-index: 2;
	position: absolute;
}

ul.nav.navbar-nav {
	margin-top: 10px;
	width: 100%;
}

ul.nav i {
	cursor: pointer; 
	font-size: 2em;
	padding: 10px;
}

ul.nav li.priv a {
	padding: 0px; 
}
/*ul.nav.navbar-nav li {
	float: right;
}
*/
.nav>li>a:hover, .nav .open>a, .dropdown-menu>li>a:hover, .nav>li>a:focus {
	background-color: #31ceb3!important;
	background-image: none!important;
}

.nav .dropdown-menu {
	background-color: #00e1be;
}

.nav button {
    background-color: #3d6d61;
    text-transform: uppercase;
    margin: 7px;
    font-weight: bold;
    font-size: 0.9em;
    padding: 8px;
}

/*Section*/
div.section {
	height: auto;
	min-height: 900px;
	text-align: center;
}

div.textContent {
	margin-top: 15%;
}

div.textContent.noMargin {
	margin-top: 0%;
}

div.textContent h1 {
	font-size: 4em;
	font-style: italic;
	margin-bottom: 0.5em;
}

div.textContent p {
	font-size: 1.2em;
    text-align: justify;
    line-height: 1.5;
}

/*Footer*/
/*footer {
	position: absolute;
    width: 100%;
    bottom: 0px;
    z-index: -1;
}*/

div.footer {
	min-height: 80px;
	background: #323232;
	color: #bcbcbc;
	font-family: courier;
	position: absolute;
    width: 100%;
    bottom: 0px;
	/*margin-top: 4em;*/
}

div.footer span{
	font-family: courier;
}

div.footer a {
	color: #02ddb7;
}

/* LOGIN */
#login .panel {
	margin-top: 4em;
	margin-bottom: 4em;
	padding: 0;
	box-shadow: 5px 5px 10px gray;
	border: 2px solid rgb(0,150,136);
}

#login .panel-heading {
    height: 64px;
}

#login .panel-heading img {
	max-width: 200px;
	margin: 0 auto;
}

#login .panel-body input[type='text'], #login .panel-body input[type='password'] {
	margin-top: 1em;
}

#login .panel-body button {
	background-color: rgb(0,150,136);
	width: 120px;
	margin: 0 auto;
	color: white;
	display: inline-block;
	font-size: 1.3em;

}

#login .panel-footer {
	height: 0px;
	opacity: 0;
	transition: all 1s ease;

}

#login .panel-footer.open {
	height: auto;
	opacity: 1;
}

#login div.btn-container {
	text-align: center;
}

/*FAQ*/
#faq h1{
	padding-left: 1em;
	font-size: 4em;
	margin-top: 2em;
}

#faq div.question {
	width: 75%;
	margin: 3em 12.5%;
}

#faq div.question p {
	padding-left: 3em;
	line-height: 2em;
    font-size: 1.2em;
}

/*Private*/
#private div.col-md-4 {
	margin-bottom: 5em;
}

#private div.headerChat {
	background-color: #00e1be;
	max-height: 65px;
	padding: 10px;
	color: white;
}

#private div.headerChat img.logo {
	max-height: 75px;
}

#private div.headerChat img.photoUrl {
    width: 55px;
    height: 55px;
    border-radius: 100px;
    float: right;
    transform: translate(0px,-5px);
}

#private div.headerChat p {
    display: inline;
    font-size: 30px;
    float: right;
	font-weight: bold;
	margin-top: 0px;
    margin-right: 1em;
}

#private div.searchBar {
	padding: 20px 0px;
	background: #f9f9f9;
	border-left: 1px solid #4DB6AC;
	border-right: 1px solid #4DB6AC;
	
}

#private div.searchBar input {
	background: #f9f9f9;
}

#private div.searchBar .input-group-addon {
    border: 0px!important;
    background: transparent!important;

}

#private div.searchBar input, input[type='text'] {
 border: 0px;
 width: 100%;
 padding: 5px; 
 font-size: 1.2em;
 outline: none;
 border-bottom: 1px solid #00e1be;

}

#private div.searchBar div.date {
	padding-top: 20px;
}

#private div.searchBar ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #00e1be;
}
#private div.searchBar :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #00e1be;
   opacity:  1;
}
#private div.searchBar ::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #00e1be;
   opacity:  1;
}
#private div.searchBar :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #00e1be;
}


#private div.container-twin {
    max-height: 530px;
    overflow: auto;
    background: #f9f9f9;
}

#private div.container-phones {
    max-height: 450px;
    overflow: auto;
}

#private div.lastMessage {
	color: gray!important;
	/*padding-bottom: 10px;*/
}

#private div.twin {    
    margin-bottom: 1em;
    margin-left: 0px;
}

#private div.twin:hover {
	border-left: 2px solid #00e1be;
	cursor:pointer;
}

#private div.twin hr {
	width: 90%;
	margin: 0 auto;
	color: gray;
}

#private .twin .photo img {
    width: 50px;
    height: 50px;
    border-radius: 100px;
    margin: 10px;
}

#private .settings {
	height: 30px;
}

#private div.phone {
    font-size: 1.2em;
    padding: 1em 0.5em;
    margin-bottom: 1em;
    min-height: 60px;

    border-bottom: 1px solid;
}

#private .defaultCall {
	    font-weight: bold;
	    margin-top: 1em;
}

#private div.current-section {
	    background: rgba(0, 225, 190, 0.14);
	    padding:10px;
}

#private .actions {
	font-size: 1.3em;
	color: #8b8b8b;
}

#private .actions i {
	cursor: pointer;
}

#private h3.section-title {
	border-bottom: 1px solid #cdcdcd;
	font-size: 1.5em;
}

#private md-list-item h4 {
	font-size: 1.25em;
}

#private md-list-item button img.md-avatar {
	margin:0px;
}

#private md-list-item button {
	min-height: 40px;
}

#private .newPhone {
    min-height: 50px;
    font-size: 1.1em;
}

#private .newPhone i {
	font-size: 1.3em;
	cursor: pointer;
}

#private .col-title {
	font-weight: bold;
	text-align: center;
	margin-top: 10px;
	font-size: 2em;
}

/*Chat*/
#private.chatMain .col-md-4.contactList {
	padding-right: 0px;
}

#private.chatMain .col-md-8 {
	padding-left: 0px;
}

#private.chatMain .col-md-4.contactList, #private.chatMain .col-md-8 {
    height: 775px;
    background: #f9f9f9;
}

#private.chatMain .col-md-4.contactList md-content#list {
	border-left: 1px solid #4DB6AC;
	border-right: 1px solid #4DB6AC;
	border-bottom: 1px solid #4DB6AC;
}

#private.chatmain div.headerConver {
	background-color: #d8ebe9;
	height: 65px;
	padding: 10px;
	color: white;
	padding-left: 0px;
}

#private.chatmain div.headerConver .currentTwin {
	max-height: 65px;
}

#private.chatmain div.headerConver h3 {
    color: #31ceb3;
	font-weight: bold;
	font-size: 35px;
}


#private.chatmain md-toolbar#headerChat .photo img {
	max-height: 55px;
    margin: 5px;
    border: 1px solid #4DB6AC;
}

#private.chatmain md-toolbar button {
	height: auto;
}

#private.chatmain div.chatBody {
    height: 623px;
    background: white;
    overflow: auto;
    padding: 10px;
    width: 100%;
}

#private.chatmain div.chatInput {
	height: 60px;
	padding: 2px 0px 0px 0px;
	background: #a2d3c9;
}

#private.chatmain div.chatInput div.input-group, #private.chatmain div.chatInput div.input-group input {
	height: 100%
}

#private.chatmain [class^='icon'], #private.chatmain .chatInput input {
	font-size: 2em;
}


#private.chatmain .chatBody .message {
    padding: 10px;
    border-radius: 10px;
	width: auto;
	max-width: 70%;
}

#private.chatmain .chatBody .message img {
	max-width: 100%;
}

#private.chatmain .chatBody .message .text {
	font-size: 2em;
}

#private.chatmain .chatBody .message .message-content {
    display: inline;
    padding: 10px;
    border-radius: 10px;
}

#private.chatmain .progress {
    margin-bottom: 0px;
    margin-top: 5px;
	height: 5px;
	border-radius: 5px;
}

#private.chatmain .progress-bar {
	width: 0%;
	transition: all 120s linear;

}

#private.chatmain .progress-bar.full {
	width: 100%;
}


#private.chatmain .chatBody .message.foreign .message-content{
	background: #e5e6ea;
	float: left;
}

#private.chatmain .chatBody .message.foreign {
	margin-right: auto;
}

#private.chatmain .chatBody .message.local {
	float: right;
	margin-left: auto;
}

#private.chatmain .chatBody .message.local .message-content{
	background: #7ab8ad;
	float: right;
}

#private.chatmain .chatBody .message .photo {
	display: inline;
	max-width: 70px;
}

p.groupNameTwin.ng-binding {
    font-size: 0.5em;
    border-bottom: 1px solid;
    padding: 0 10px;
    font-weight: bold;
}

font.userLastMSG.ng-binding {
    font-weight: bold;
}

.message.local .photo {
	float: right;
	margin-left: 10px;
}

.message.foreign .photo {
	float: left;
	margin-right: 10px;
}

#private.chatmain .chatBody .message img.photoURL {
    width: 70px;
    height: 70px;
    border-radius: 100px;
}

#private #fileUpload, #private #fileUploadImg {
	display: none;
}

#private .noRead {
    margin-top: 10px;
    float: right;
    margin-right: 20px;
    font-size: 1.5em;
    color: #31ceb3;
}

#private #remoteVideosContainer video{
	margin: 0 auto;
	display: block;
	border-color: #3ec7c2!important;
}

#private #remoteVideosContainer video#localVideo {
	transform: translate(325px,-150px);
}

#private #remoteVideosContainer button {
    margin: 0 auto;
    display: block;
    transform: translate(0px,-100px);
	background-color: red;
	
}

li.uploadPrev.ng-scope {
	list-style-type: none;
    display: initial;
    margin-right: 10px;
}

li.uploadPrev.ng-scope img {
	border: 1px solid black
}
/*.message*/

.payment md-dialog {
	max-width: 50%;
}