GIF89a;
| Direktori : /home/serb/www/freichat/client/themes/basic/ |
| Current File : /home/serb/www/freichat/client/themes/basic/styles.less |
#freichat div {
box-sizing: content-box !important;
}
.frei_chatroom_formatter_plugin {
height: 12px;
width: 12px;
background: grey;
border: 1px solid black;
border-radius: 14px;
float:left;
margin-right: 4px;
opacity: 0.8;
&:hover {
opacity: 1;
}
}
.frei_nanocontent {
position:relative;
overflow: hidden;
width: 100%;
height: 100%;
}
.frei_nanocontent .frei_content {
position:absolute;
overflow:scroll;
overflow-x:hidden;
top:0;
right:0;
bottom:0;
left:0;
padding:10px;
}
.frei_nanocontent .frei_content:focus {
outline:thin dotted;
}
.frei_nanocontent .frei_content::-webkit-scrollbar {
visibility:hidden;
}
.has-scrollbar .frei_content::-webkit-scrollbar {
visibility:visible;
}
.frei_nanocontent > .pane {
position:absolute;
width:6px;
right:0;
top:0;
bottom:0;
visibility:hidden \9;
opacity:.01;
-webkit-transition:.2s;
-moz-transition:.2s;
-o-transition:.2s;
transition:.2s;
}
.frei_nanocontent > .pane > .slider {
position:relative;
margin:0 1px;
visibility: hidden;
border-radius: 12px;
}
.frei_nanocontent:hover > .pane > .slider {
visibility: visible;
}
.frei_nanocontent > .pane:hover > .slider {
background:#999;
}
.frei_nanocontent > .pane:hover {
background:rgba(0,0,0,0.1);
}
.frei_nanocontent:hover > .pane {
visibility:visible \9;
opacity:0.99;
}
.pane.active {
visibility:visible \9;
opacity:0.99;
}
.pane.flashed {
visibility:visible \9;
opacity:0.99;
}
.frei_nanocontent .slider {
background-color:#A0A0A0;
background:rgba(0,0,0,0.2);
}
.chatboxtextarea:focus {
border:2px solid #0060a8;
margin:0;
background: white;
}
.frei_smileys_table{
border: 0;
margin: 0;
width: 100%;
tr,td,th,tbody {
border-collapse: collapse;
border: 0px;
padding: 0px;
}
}
.frei_smileys_table tr td {
padding:0px;
background:white;
}
#freichat {
position:fixed;
right:0px;
bottom:0px;
margin-right:5px;
font-family: helvetica, arial, sans-serif;
font-size: 13px;
}
.freichat {
position:relative;
padding:0px;
background-color:none;
color:#000000;
text-align:justify;
font-size:14px;
width:200px;
background-image:none;
border:none;
line-height:1.4em;
margin:0px;
a:hover {
text-decoration:none;
background-color:white;
color:blue;
}
img {
padding-left:0px;
margin-left:0px;
margin-right:0px;
display:inline;
border-top:0px;
border-bottom:0px;
}
}
.frei_smileys {
position:absolute;
color:white;
background: white;
display:none;
width:150px;
height:115px;
bottom: 72px;
left: 0;
border:1px solid #ccc;
padding:5px;
overflow-x: hidden;
overflow-y: auto;
box-shadow: 2px -1px 5px -1px #ccc;
border-radius: 0 3px 0 0px;
img {
cursor:pointer;
border:1px solid white;
font-size:12px;
padding:1px;
width:16px;
height:16px;
}
img:hover {
border:1px solid gray;
border-radius:5px;
}
}
.frei_smiley_image {
padding:1px 0 1px 2px;
border:0px;
width: 24px;
height: 24px;
}
.frei_box {
position:relative;
bottom:0px;
width:225px;
z-index:9999999;
}
.frei {
font-size:13px;
height:112px;
overflow:auto;
width:200px;
img {
border:none;
padding-left:0px;
margin-left:0px;
margin-right:0px;
}
a:hover {
color:blue;
}
a:link {
text-decoration:none;
color:wroomcontainerhite;
font-weight:normal;
}
}
.onfreioffline {
position:fixed;
right:0px;
bottom:0px;
z-index:10001;
}
.status_available {
width: auto;
display: inline-block;
padding-right:5px;
}
.status_busy {
width: auto;
display: inline-block;
margin-left:10px;
}
.status_invisible {
width: auto;
display: inline-block;
padding-right:5px;
}
.status_offline {
width: auto;
display: inline-block;
margin-left:10px;
}
*html {
#freichat {
position:absolute;
bottom:0px;
}
}
.freicontain {
z-index:99999;
bottom:0px;
position:fixed;
width:225px;
display:block;
overflow:visible;
font-family: Arial, sans-serif;
font-size: 13px;
}
.user_freichat_head_content {
font-weight:bold;
color:white;
}
.frei_chat_status {
background-color:inherit;
color:#b94a48;
font-size:80%;
padding-bottom:2px;
display:block;
bottom:80px;
}
.freichat_time {
color:black;
float:right;
font-size:9px;
}
.freichathead {
cursor:pointer;
padding-top:3px;
padding-bottom:3px;
-webkit-border-top-left-radius:4px;
-webkit-border-top-right-radius:4px;
-moz-border-radius-topleft:4px;
-moz-border-radius-topright:4px;
border-top-left-radius:4px;
border-top-right-radius:4px;
display: block;
margin-bottom: 0;
font-size: 13px;
line-height: 18px;
text-align: left;
vertical-align: middle;
cursor: pointer;
color: #fff /*{b-bup-color}*/;
text-shadow: 0 1px 0 #194b7e;
background: -webkit-gradient(linear, left top, left bottom, from( #5f9cc5 ), to( #396b9e ));
background: -webkit-linear-gradient(top, #5f9cc5 , #396b9e );
background: -moz-linear-gradient(top, #5f9cc5 , #396b9e );
background: -ms-linear-gradient(top, #5f9cc5 , #396b9e );
background: -o-linear-gradient(top, #5f9cc5 , #396b9e );
background: linear-gradient(to bottom, #5f9cc5 , #396b9e );
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
width: 202px;
img {
padding-right:2px;
padding-left:2px;
}
}
#offlineimg {
border-radius:10px 0px 0px 0px;
}
.freichat_userscontentstatus {
float:right;
padding-right:5px;
padding-top:4px;
padding-right:4px;
}
.frei_msg_container {
color: black;
}
.chatboxmessagecontent_him {
color: black;
a {
color:blue;
text-decoration:none;
}
a:hover {
color: black;
background: white;
border-bottom: 1px dotted black;
cursor: pointer;
}
}
.chatboxmessagecontent_me {
color: black;
a {
color:blue;
text-decoration:none;
}
a:hover {
color: black;
background: white;
border-bottom: 1px dotted black;
cursor: pointer;
}
}
.chatboxmessagefrom_him {
font-weight:bold;
}
.chatboxmessagefrom_me {
font-weight:bold;
}
.chatboxhead {
position:relative;
cursor:pointer;
padding:6px 0px 6px 0px ;
-webkit-border-top-left-radius:4px;
-webkit-border-top-right-radius:4px;
-moz-border-radius-topleft:4px;
-moz-border-radius-topright:4px;
border-top-left-radius:4px;
border-top-right-radius:4px;
display: inline-block;
margin-bottom: 0;
font-size: 13px;
line-height: 18px;
text-align: left;
vertical-align: middle;
cursor: pointer;
color: #fff /*{b-bup-color}*/;
text-shadow: 0 1px /*{b-bup-shadow-y}*/ 0 /*{b-bup-shadow-radius}*/ #194b7e /*{b-bup-shadow-color}*/;
background-image: -webkit-gradient(linear, left top, left bottom, from( #5f9cc5 ), to( #396b9e ));
background-image: -webkit-linear-gradient( #5f9cc5 , #396b9e );
background-image: -moz-linear-gradient( #5f9cc5 , #396b9e );
background-image: -ms-linear-gradient( #5f9cc5 , #396b9e );
background-image: -o-linear-gradient( #5f9cc5 , #396b9e );
background-image: linear-gradient( #5f9cc5 , #396b9e );
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
width: 225px;
img {
padding-right:2px;
padding-left:2px;
}
}
.chatboxmessage {
color:#ffffff;
font-size:0.9em;
}
.freichat_linkprofile_s {
visibility:hidden;
img {
padding-right:6px;
padding-top:2px;
height:20px;
width:20px;
}
}
.freichat_userscontentname {
float:left;
padding-bottom:3px;
padding-left:5px;
padding-top:4px;
text-align:left;
}
.input_blue_focus{
border: 2px solid #0060A8;
outline: 0;
outline: thin dotted 9;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(82, 168, 236, .6);
}
.chatboxinput {
padding:3px;
background-color:#ffffff;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
background-image:none;
border-top:1px solid #555;
border-bottom:1px solid #cccccc;
border-bottom-right-radius:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
-moz-border-radius-bottomleft:5px;
-webkit-border-bottom-left-radius:5px;
img {
margin-left:4px;
}
:focus {
.input_blue_focus;
}
}
#frei_member_search_input {
padding: 0px 0px 0px 8%;
width: 100%;
margin:0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
}
.zero-border-radius {
border-radius:0px;
-webkit-border-radius:0px;
-moz-border-radius:0px;
-o-border-radius:0px;
}
.frei_search_members {
display: block;
input {
width:100%;
-webkit-box-sizing: content-box;
font-family: "Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;
font-size: 11px;
font-weight: normal;
.zero-border-radius;
border-top: 1px solid #555;
cursor: text;
background: url("search.jpg") no-repeat;
margin: 0px;
color: #999;
outline: 0;
padding: 0px;
line-height:15px;
}
}
.min_freichathead {
padding-right:10px;
float:right;
}
.frei_status_options span {
width: 78px;
margin: 0;
padding: 0;
border: 1px solid transparent;
}
.frei_status_options_selected {
border: 1px solid #999 !important;
box-shadow: 0px 0px 3px #ccc;
border-radius: 3px;
}
.frei_tools_options {
img {
cursor:pointer;
padding-bottom:15px;
padding-right:0px;
}
}
#freichat_mobile_chat {
position:fixed;
z-index: 999999999;
color: #333;
text-shadow: 0 1px 1px rgba(255,255,255,0.75);
background-color: whiteSmoke;
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe5e5e5', GradientType=0);
border-color: #E6E6E6 #E6E6E6 #BFBFBF;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border: 1px solid #BBB;
border-bottom-color: #A2A2A2;
right:0px;
vertical-align:middle;
bottom:0px;
width:100px;
text-align: center;
height: 23px;
padding-top: 7px;
cursor:pointer;
border-bottom:0;
border-right:0;
&:hover {
background: #e6e6e6;
}
}
.freichat_mobile_new_messages {
line-height: 18px;
text-shadow: 1px 1px 0 rgba(0, 0, 0, .2);
color: white;
border: 1px solid #efefef;
background: #f56c7e;
height: 18px;
text-align: center;
width: 18px;
float: right;
border-radius: 10px;
position: relative;
bottom: 18px;
right: 10px;
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .17), 0 1px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .17), 0 1px 1px rgba(0, 0, 0, .2);
-webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .17), 0 1px 1px rgba(0, 0, 0, .2);
font-weight: bold;
}
.freichat_userlist_hover {
background-color:#B2C9F1;
color:#000000;
text-align:left;
}
.langlist {
a {
color:white;
text-decoration:none;
font-weight:normal;
font-size:13px;
}
a:hover {
color:blue;
}
}
.freicontain0 {
right:208px;
z-index:999999;
}
.freichat_userlist {
cursor:pointer;
height:26px;
line-height:100%;
text-align:left;
padding-top:0px;
padding-bottom:1px;
width:99%;
}
.chatboxoptions {
padding-right:6px;
float:right;
> a {
background: none;
padding: 0;
img {
border:none;
}
}
}
.frei_smileys_table {
border-collapse:collapse;
}
.freicontain1 {
right:432px;
z-index:999998;
}
.frei_user_brand {
border:1px solid #555;
/*background-image:url('chatroom.jpeg');*/
background:white;
width: 200px;
}
.originalmessagecontent {
position:absolute;
color:white;
background-color:black;
overflow:auto;
border:1px solid white;
width:150px;
height:44px;
a {
color:white;
}
}
.chatboxtitle {
float:left;
color:#FFFFFF;
padding-left:6px;
}
.freicontain2 {
right:658px;
z-index:999997;
}
.freichat_linkprofile {
float:right;
}
.frei_user_count {
color:inherit;
padding-left:10px;
color:white;
}
.chatboxtextarea {
font-size:12px;
width: 100%;
height:44px;
padding:3px 0px 3px 3px;
border:2px solid #efefef;
margin:1px;
overflow:hidden;
color:#000000;
background-image:none;
/*max-width:209px;*/
box-sizing: border-box !important;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
-o-box-sizing: border-box !important;
-ms-box-sizing: border-box !important;
min-width:209px;
max-height:100px;
min-height: 44px;
box-sizing: content-box;
background:white;
color:#222;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-o-border-radius: 2px;
-ms-border-radius: 2px;
}
.chatboxcontent {
background-image: url('bmid.png');
font-family: Arial, sans-serif;
font-size: 13px;
height: 200px;
width: 209px;
padding: 7px;
border: 1px solid #ccc;
background-color: #ffffff;
line-height: 1.32em;
text-align: left;
word-wrap: break-word;
min-height: 45px;
max-height: 200px;
}
.freicontain3 {
right:884px;
z-index:999996;
}
.frei_options {
border-radius: 4px;
background: white;
width: 199px;
border: 1px solid grey;
margin-bottom: -10px;
a {
color:black;
text-decoration:none;
font-weight:normal;
font-size:12px;
background: #fff;
&:focus,&:active,&:visited {
color: black;
background: #fff;
}
}
>div {
padding-left: 20px;
}
input {
font-family: Tahoma, sans-serif;
width: 125px;
border: 1px solid #ccc;
padding: 5px;
font-size: 11px;
font-weight: normal;
border-right: 0;
margin-top: 0;
height: 15px;
margin-bottom: 10px;
&:focus {
border-color: rgba(82, 168, 236, 0.8);
outline: 0;
outline: thin dotted 9;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
}
}
button {
display: inline-block;
padding: 4px 5px;
margin: 0;
margin-bottom: 10px;
margin-left: -6px;
font-size: 13px;
line-height: 18px;
text-align: center;
height: 27px;
cursor: pointer;
color: #333;
text-shadow: 0 1px 1px rgba(255,255,255,0.75);
background-color: whiteSmoke;
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe5e5e5',GradientType=0);
border-color: #E6E6E6 #E6E6E6 #BFBFBF;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
border: 1px solid #BBB;
border-bottom-color: #A2A2A2;
-webkit-border-radius: 0px 4px 4px 0px;
-moz-border-radius: 0px 4px 4px 0px;
border-radius: 0px 4px 4px 0px;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
border-left: 1px solid #ccc;
width: 25px;
&:hover {
color: #333;
text-decoration: none;
background-color: #E6E6E6;
background-position: 0 -15px;
-webkit-transition: background-position .1s linear;
-moz-transition: background-position .1s linear;
-o-transition: background-position .1s linear;
transition: background-position .1s linear;
}
}
}
#frei_set_status_title {
padding: 5px;
background: #eee;
padding-left: 10px;
color: #222;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
}
.custom_mesg {
padding-top:8px;
}
.self_status_img {
img {
padding-top:2px;
}
}
.frei_status_options {
cursor:pointer;
margin-bottom: 15px;
a {
text-decoration:none;
background-color:none;
color:black;
&:hover{
text-decoration:none;
color:black;
background:none;
}
}
img {
cursor:pointer;
vertical-align: middle;
}
}
.freichat_userscontentavatarimage {
height:22px;
width:22px;
text-align:left;
}
.freichat_userscontentavatar {
display:block;
float:left;
padding-bottom:1px;
padding-left:5px;
padding-top:1px;
text-align:left;
}
.frei_added_options_img {
float:left;
padding-top:0px;
padding-right:5px;
padding-bottom:2px;
height:12px;
width:12px;
border-right:1px solid black;
&:hover{
-webkit-transform: translate(0px,-3px);
-moz-transform: translate(0px,-2px);
-o-transform: translate(0px,-2px);
transform: translate(0px,-2px);
-webkit-transition:all 0.3s ease-out;
-moz-transition:all 0.3s ease-out;
-o-transition:all 0.3s ease-out;
transition:all 0.3s ease-out;
background:#e6e6e6;
}
}
.added_options {
padding:2px 0px 2px 0px;
display: inline-block;
margin-bottom: 0;
font-size: 13px;
line-height: 15px;
text-align: left;
vertical-align: middle;
cursor: pointer;
color: #333;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
background-color: whiteSmoke;
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe5e5e5', GradientType=0);
border-color: #E6E6E6 #E6E6E6 #BFBFBF;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border-bottom: 1px solid #BBB;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
width:100%;
> a {
background: none;
padding: 0;
}
}
.chatboxinfo {
margin-left:-1em;
color:#666666;
}
.frei_option_bar{
padding:2px 0px 2px 0px;
display: inline-block;
margin-bottom: 0;
font-size: 13px;
line-height: 15px;
text-align: left;
vertical-align: middle;
cursor: pointer;
color: #333;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
background-color: whiteSmoke;
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe5e5e5', GradientType=0);
border-color: #E6E6E6 #E6E6E6 #BFBFBF;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
border-bottom: 1px solid #BBB;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
width: 200px;
}
.frei_option_bar_arrow{
height: 15px;
background: url('icons/arrow-up.png') no-repeat left;
background-size: 12px 12px;
width: 12px;
display: inline-block;
}
.frei_option_bar_status{
padding:2px;
height: 15px;
border-right: 1px solid black;
display:inline-block;
width: 100px;
&:hover{
background: #e6e6e6;
}
}
.frei_option_bar_status_txt{
height: 15px;
display: inline-block;
vertical-align: top;
width: 82px;
overflow: hidden;
}
.frei_chatbox_options {
float:right;
}
.frei_option_bar_reset {
padding-right:7px;
display:inline-block;
&:hover{
background: #e6e6e6;
}
}
.frei_option_bar_reset_bg{
height: 15px;
background: url('icons/loop.png') no-repeat left;
background-size: contain;
width: 12px;
display: inline-block;
}
.frei_option_bar_rtl {
border-right: 1px solid black;
padding-right:7px;
padding-left:7px;
display:inline-block;
&:hover{
background: #e6e6e6;
}
}
.frei_option_bar_rtl_bg{
height: 15px;
background: url('icons/paragraph-left.png') no-repeat left;
background-size: contain;
width: 12px;
display: inline-block;
}
.frei_option_bar_sound {
padding-left:7px;
padding-right:7px;
display:inline-block;
&:hover{
background: #e6e6e6;
}
}
.frei_option_bar_sound_bg_on {
background: url('icons/volume.png') no-repeat left;
}
.frei_option_bar_sound_bg_off {
background: url('icons/volume_off.png') no-repeat left;
}
.frei_option_bar_sound_bg{
height: 15px;
background-size: contain;
width: 12px;
display: inline-block;
}
.frei_groupchat {
position: absolute;
bottom: 0;
z-index: 99;
width: 220px;
left: 2px;
display: none;
background: #fff;
input {
margin: 0;
padding: 4px;
border: 1px solid #ccc;
box-shadow: none;
border-radius: 0;
width: 77%;
font-size: 12px;
&:focus {
box-shadow: none;
border: 1px solid #1471af;
}
}
.groupchat-done {
display: inline-block;
padding: 1px 6px 3px 5px;
margin: 0;
line-height: 17px;
text-align: center;
cursor: pointer;
color: #333;
text-shadow: 0 1px 1px rgba(255,255,255,0.75);
background-color: whiteSmoke;
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe5e5e5',GradientType=0);
border-color: #E6E6E6 #E6E6E6 #BFBFBF;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
border: 1px solid #BBB;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.05);
&:hover {
color: #333;
text-decoration: none;
background-color: #E6E6E6;
background-position: 0 -15px;
-webkit-transition: background-position .1s linear;
-moz-transition: background-position .1s linear;
-o-transition: background-position .1s linear;
transition: background-position .1s linear;
}
}
ul.tagit {
padding: 1px 3px;
overflow: auto;
/*margin-left: inherit; /* usually we don't want the regular ul margins.
margin-right: inherit;*/
margin: 0;
border: 1px solid #ccc;
min-height: 19px;
width: 79%;
display: inline-block;
position: relative;
bottom: -8px;
}
ul.tagit li {
display: block;
float: left;
//margin: 2px 5px 2px 0;
margin: 0;
}
ul.tagit li.tagit-choice {
position: relative;
line-height: inherit;
border: 1px solid #9daccc;
background: #e2e6f0;
border-radius: 2px;
color: #000;
margin-right: 2px;
margin-bottom: 1px;
cursor: default;
}
input.tagit-hidden-field {
display: none;
}
ul.tagit li.tagit-choice-read-only {
padding: .2em .5em .2em .5em;
}
ul.tagit li.tagit-choice-editable {
padding: 0px 17px 0px 3px;
}
ul.tagit li.tagit-new {
//padding: .25em 4px .25em 0;
padding: 0;
padding-left: 2px;
}
ul.tagit li.tagit-choice a.tagit-label {
cursor: pointer;
text-decoration: none;
}
ul.tagit li.tagit-choice .tagit-close {
cursor: pointer;
position: relative;
right: -10px;
top: 50%;
margin-top: -8px;
line-height: 17px;
text-decoration: none;
color: #000;
}
/* used for some custom themes that don't need image icons */
ul.tagit li.tagit-choice .tagit-close .text-icon {
// display: none;
}
ul.tagit li.tagit-choice input {
display: block;
float: left;
margin: 2px 5px 2px 0;
}
ul.tagit input[type="text"] {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border: none;
margin: 0;
padding: 0;
width: inherit;
background-color: inherit;
outline: none;
}
}
.tagit-autocomplete {
width: 1px;
background: #fff;
border: 1px solid #9daccc;
z-index: 9999999999999999999;
padding: 0 !important;
> .ui-state-focus {
color: #fff;
background: #6d84b4;
}
.ui-menu-item {
padding-left: 3px !important;
box-sizing: border-box;
img {
float: right;
}
}
}
.ui-menu {
list-style:none;
padding: 2px;
margin: 0;
display:block;
float: left;
}
.ui-menu .ui-menu {
margin-top: -3px;
}
.ui-menu .ui-menu-item {
margin:0;
padding: 0;
zoom: 1;
float: left;
clear: left;
width: 100%;
}
.ui-menu .ui-menu-item a {
text-decoration:none;
display:block;
padding:.2em .4em;
line-height:1.5;
zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
font-weight: normal;
margin: -1px;
}
/* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */
.tooltipster-default {
border-radius: 5px;
border: 2px solid #000;
background: #4c4c4c;
color: #fff;
}
/* Use this next selector to style things like font-size and line-height: */
.tooltipster-default .tooltipster-content {
font-family: Arial, sans-serif;
font-size: 14px;
line-height: 16px;
padding: 8px 10px;
overflow: hidden;
}
/* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */
.tooltipster-default .tooltipster-arrow .tooltipster-arrow-border {
/* border-color: ... !important; */
}
/* If you're using the icon option, use this next selector to style them */
.tooltipster-icon {
cursor: help;
margin-left: 4px;
}
/* This is the base styling required to make all Tooltipsters work */
.tooltipster-base {
padding: 0;
font-size: 0;
line-height: 0;
position: absolute;
left: 0;
top: 0;
z-index: 9999999;
pointer-events: none;
width: auto;
overflow: visible;
}
.tooltipster-base .tooltipster-content {
overflow: hidden;
}
/* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */
.tooltipster-arrow {
display: block;
text-align: center;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.tooltipster-arrow span, .tooltipster-arrow-border {
display: block;
width: 0;
height: 0;
position: absolute;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span {
border-left: 8px solid transparent !important;
border-right: 8px solid transparent !important;
border-top: 8px solid;
bottom: -7px;
}
.tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border {
border-left: 9px solid transparent !important;
border-right: 9px solid transparent !important;
border-top: 9px solid;
bottom: -7px;
}
.tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span {
border-left: 8px solid transparent !important;
border-right: 8px solid transparent !important;
border-bottom: 8px solid;
top: -7px;
}
.tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
border-left: 9px solid transparent !important;
border-right: 9px solid transparent !important;
border-bottom: 9px solid;
top: -7px;
}
.tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border {
left: 0;
right: 0;
margin: 0 auto;
}
.tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span {
left: 6px;
}
.tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border {
left: 5px;
}
.tooltipster-arrow-top-right span, .tooltipster-arrow-bottom-right span {
right: 6px;
}
.tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border {
right: 5px;
}
.tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border {
border-top: 8px solid transparent !important;
border-bottom: 8px solid transparent !important;
border-left: 8px solid;
top: 50%;
margin-top: -7px;
right: -7px;
}
.tooltipster-arrow-left .tooltipster-arrow-border {
border-top: 9px solid transparent !important;
border-bottom: 9px solid transparent !important;
border-left: 9px solid;
margin-top: -8px;
}
.tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border {
border-top: 8px solid transparent !important;
border-bottom: 8px solid transparent !important;
border-right: 8px solid;
top: 50%;
margin-top: -7px;
left: -7px;
}
.tooltipster-arrow-right .tooltipster-arrow-border {
border-top: 9px solid transparent !important;
border-bottom: 9px solid transparent !important;
border-right: 9px solid;
margin-top: -8px;
}
/* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */
.tooltipster-fade {
opacity: 0;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
-ms-transition-property: opacity;
transition-property: opacity;
}
.tooltipster-fade-show {
opacity: 1;
}
.tooltipster-grow {
-webkit-transform: scale(0,0);
-moz-transform: scale(0,0);
-o-transform: scale(0,0);
-ms-transform: scale(0,0);
transform: scale(0,0);
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-backface-visibility: hidden;
}
.tooltipster-grow-show {
-webkit-transform: scale(1,1);
-moz-transform: scale(1,1);
-o-transform: scale(1,1);
-ms-transform: scale(1,1);
transform: scale(1,1);
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-swing {
opacity: 0;
-webkit-transform: rotateZ(4deg);
-moz-transform: rotateZ(4deg);
-o-transform: rotateZ(4deg);
-ms-transform: rotateZ(4deg);
transform: rotateZ(4deg);
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
}
.tooltipster-swing-show {
opacity: 1;
-webkit-transform: rotateZ(0deg);
-moz-transform: rotateZ(0deg);
-o-transform: rotateZ(0deg);
-ms-transform: rotateZ(0deg);
transform: rotateZ(0deg);
-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1);
-webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
-moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
-ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
-o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4);
}
.tooltipster-fall {
top: 0;
-webkit-transition-property: top;
-moz-transition-property: top;
-o-transition-property: top;
-ms-transition-property: top;
transition-property: top;
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-fall-show {
}
.tooltipster-fall.tooltipster-dying {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
-ms-transition-property: all;
transition-property: all;
top: 0px !important;
opacity: 0;
}
.tooltipster-slide {
left: -40px;
-webkit-transition-property: left;
-moz-transition-property: left;
-o-transition-property: left;
-ms-transition-property: left;
transition-property: left;
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
-o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15);
}
.tooltipster-slide.tooltipster-slide-show {
}
.tooltipster-slide.tooltipster-dying {
-webkit-transition-property: all;
-moz-transition-property: all;
-o-transition-property: all;
-ms-transition-property: all;
transition-property: all;
left: 0px !important;
opacity: 0;
}
/* CSS transition for when contenting is changing in a tooltip that is still open. The only properties that will NOT transition are: width, height, top, and left */
.tooltipster-content-changing {
opacity: 0.5;
-webkit-transform: scale(1.1, 1.1);
-moz-transform: scale(1.1, 1.1);
-o-transform: scale(1.1, 1.1);
-ms-transform: scale(1.1, 1.1);
transform: scale(1.1, 1.1);
}
.frei_spinner {
margin: 100px auto;
width: 40px;
height: 40px;
position: relative;
text-align: center;
-webkit-animation: rotate 2.0s infinite linear;
animation: rotate 2.0s infinite linear;
}
.frei_dot1, .frei_dot2 {
width: 60%;
height: 60%;
display: inline-block;
position: absolute;
top: 0;
background-color: #333;
border-radius: 100%;
-webkit-animation: bounce 2.0s infinite ease-in-out;
animation: bounce 2.0s infinite ease-in-out;
}
.frei_dot2 {
top: auto;
bottom: 0px;
-webkit-animation-delay: -1.0s;
animation-delay: -1.0s;
}
@-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg) }}
@keyframes rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}
@-webkit-keyframes bounce {
0%, 100% { -webkit-transform: scale(0.0) }
50% { -webkit-transform: scale(1.0) }
}
@keyframes bounce {
0%, 100% {
transform: scale(0.0);
-webkit-transform: scale(0.0);
} 50% {
transform: scale(1.0);
-webkit-transform: scale(1.0);
}
}
@import 'chatroom_styles.less';
@import 'speech.less';