/*last change: 22.6.23*/
html {
scroll-behavior: smooth;
}
body {
margin:0px;
padding:0px 0px 77px 0px;
background: #f0f7fa;
font-family: Montserrat;
}
/* .lokkalNotice aka #notice */
.lokkalNotice {
text-align: center;
color: red;
padding: 7px;
margin: 7px;
background: yellow;
border-radius: 9px;
}
/* Used in
* - templates././style.css
* - pages/wall2_editable
* */
.lokkalEmoji {
display:inline;
font-family:system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", Times, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort,system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
}
/*-- NAV START */
.footer .footerAds {
}
.footer .footerAds .adsField {
margin:2px;
}
.footer {
position:fixed;
bottom:0px;
left:0px;
right:0px;
z-index:1000;
}
.nav {
bottom:-100%;
left:0px;
right:0px;
height:56px;
vertical-align:middle;
color:white;
background-image:url(img/gradient-nav.png);
background-position:center;
background-repeat:no-repeat;
background-size:cover;
z-index:901;
text-align:center;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
display:table;
width:100%;
transition:all 1s;
}
.nav:not(.active) {
position:fixed;
}
/**/
.nav.active {
bottom:0px;
max-height:100vh;
transition:all 0.3s;
}
.nav div.navField {
display:table-cell;
vertical-align:middle;
margin:9px 0px;
}
.nav div.navField > div {
margin:0px 4px;
}
.nav div.navField > div > a:not(.playstore) {
display:block;
width:100%;
height:100%;
text-decoration:none;
}
/* .navField */
body:not(.loggedin) .nav div.navField {
width: 76vw;
float: left;
margin:9px 0px 9px -16px;
}
/* .navAds */
body.loggedin .nav div.navAds {
display:none;
}
/* (18.1.23) iphone hide google ads.. */
body.iphone .nav .navAds {
display:none !important;
}
body.iphone .nav .navField {
width:100% !important;
}
/**/
body:not(.loggedin) .nav div.navAds {
float:right;
width:27vw;
position: absolute;
right: 21px;
top: 50%;
transform: translate(0%,-50%);
}
.nav .back {
position:absolute;
left: -4%;
top: -21%;
width: 15%;
height: 32px;
background-image:url(img/back-nav.png);
background-position:center;
background-repeat:no-repeat;
background-size:63% 47%;
}
.nav .eye {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .eye > a { position:relative; }
.nav .eye > a > div {
position:absolute;
width:100%;
height:100%;
background-size: 63% 47%;
background-position:center;
background-repeat:no-repeat;
background-image:url(img/search-nav1-xxhdpi.png);
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.nav .message {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .message > a {
}
.nav .message > a > div {
position:relative;
width:100%;
height:100%;
background-size: 63% 47%;
background-position:center;
background-repeat:no-repeat;
background-image:url(img/mensaje-nav.png);
}
.nav .message > a > div > div {
position: absolute;
right: -11px;
top: 0px;
background: #ffff00;
color: #5cc487;
border-radius: 45px;
border-color: #5cc487;
padding: 0px 3px;
border-width: 2px;
border-style: solid;
font-size: 0.8125em;
font-weight: bold;
}
.nav .message > a > div > div.unactive {
display:none;
}
.nav .wall {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .wall > a {}
.nav .wall > a > div {
position: relative;
width:100%;
height:100%;
background-size: 63% 47%;
background-repeat: no-repeat;
background-position: center;
}
body:not(.wall) .nav .wall > a > div {
background-image: url(img/wall-nav1-xxhdpi.png);
}
body.wall .nav .wall > a > div {
background-image: url(img/wall-nav1-xxhdpi.png);
}
body.wall .nav .wall {
background-color: #8ec845;
border-radius: 35px;
box-shadow: 1px 1px 10px 0px #2c2c2c6b;
border-color: white;
border-width: 1px;
border-style: solid;
}
.nav .calendar {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .calendar > a { position:relative; }
.nav .calendar > a > div {
position:absolute;
width:100%;
height:100%;
background-size: 63% 47%;
background-position:center;
background-repeat:no-repeat;
background-image:url(img/calendario-nav.png);
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.nav .notification {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .notification > a {
position:relative;
}
.nav .notification > a > div {
position:absolute;
width:100%;
height:100%;
background-size: 63% 47%;
background-position:center;
background-repeat:no-repeat;
background-image:url(img/notification-nav.png);
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.nav .notification > a > div > div {
position: absolute;
right: -3px;
top: 0px;
height: 16px;
background: #ffff00;
color: #5cc487;
border-radius: 45px;
border-color: #5cc487;
padding: 0px 3px;
border-width: 2px;
border-style: solid;
/* LMOSCCCSNS0001S change style of notifications so it fits the whole number.
/*width: 10px;*/
width: fit-content;
height: fit-content;
font-size: 0.8125em;
font-weight: bold;
}
.nav .notification > a > div > div.unactive {
display:none;
}
.nav .profile {
display:inline-block;
width: 11%;
height: 50px;
}
.nav .profile.active {
background-color: #8ec845;
border-radius: 35px;
box-shadow: 1px 1px 10px 0px #2c2c2c6b;
border-color: white;
border-width: 1px;
border-style: solid;
}
.nav .profile > a {}
.nav .profile > a > div {
position:relative;
width:100%;
height:100%;
background-size: 63% 47%;
background-position:center;
background-repeat:no-repeat;
background-image:url(img/home-nav.png);
}
.nav .iniciar {
display: inline-block;
height: 50px;
vertical-align: bottom;
position:relative;
width:11%;
left:13px;
}
.nav .iniciar > a {
border: solid 1px white;
height: 30px;
color: white;
font-weight: bolder;
font-size: 1em;
transform: translate(-50%,-50%);
position: absolute;
top: 50%;
left: 50%;
}
/*-- HEADER START */
.header {
background-image:url(img/gradient1.png);
background-repeat:repeat-y;
background-position:center;
background-size:cover;
font-family: 'Montserrat', sans-serif;
position:relative;
min-height:61px;
}
.header .left {
float:left;
width:70px;
}
.header .right {
float:right;
width:70px;
}
.header .center {
margin:0px 70px 0px 70px;
text-align:center;
}
.header .left.logo a {
display:block;
position:absolute;
top:50%;
left:3px;
transform:translate(3px,-50%);
}
.header .left.logo a img {
height:auto;
width:60px;
}
.header .center > div {
display:table;
width:100%;
/*height:100%; */
}
.header .center > div > div {
display:table-cell;
vertical-align:middle;
}
.header .center > div > div a {
text-decoration:none;
display:inline-block;
padding:7px 0px;
}
.header .center .hcity {
font-size: 0.88em;
font-weight: 900;
color: white;
display:block;
}
.header .center .hstate {
font-size: 0.81em;
font-weight: 700;
color: #fdfdb0;
}
.header .center .hcountry {
font-size: 0.81em;
font-weight: 700;
color: #fdfdb0;
position:relative;
}
/*body.wall .header .center .hcountry:after,
body.events .header .center .hcountry:after,
body.search_for .header .center .hcountry:after
{
background-image: url(/templates/template_mobile_1/img/magnaglass.png);
width: 16px;
height: 16px;
top: 0px;
right: -17px;
content: "\00a0\00a0\00a0\00a0";
background-position: center;
margin: 0px 0px 0px 4px;
background-size:16px 16px;
background-repeat: no-repeat;
}*/
.header .right > div {
position:absolute;
right:3px;
top:50%;
transform:translate(3px,-50%);
}
/*.header .right > div > div:nth-child(1) {
position:absolute;
top:0px;
right:0px;
bottom:0px;
width:17px;
}*/
.header .right > div > div {
display:inline-block;
}
/**/
.inner {
margin:3px;
padding:3px;
}
/*profile*/
/*.profile_header {
word-wrap: break-word;
position:relative;
z-index: auto!important
}*/
.profile_cover {
position:relative;
width:100%;
min-height:150px;
overflow:hidden;
}
.profile_cover.none {
border:dotted 1px gray;
}
.profile_cover img {
image-rendering: optimizeQuality;
}
.profile_cover img.full {
width:100%;
height:100%;
position: static!important;
}
.profile_cover img.default {
width:100%;
height:100%;
position: static!important;
}
/*.profile_name {
position:absolute;
bottom:-29px;
display:inline-block;
font-size: 1.4375em;
font-weight: 500;
line-height: 30px;
z-index:3;
white-space:nowrap;
color:white;
}*/
.profile_header {
word-wrap: break-word;
position:relative;
background-image: url('/img/header_pages_calendars.jpg');
background-position: center;
}
.profile_container {
margin: 0px auto;
position: relative;
}
.profile_name {
position: absolute;
font-size: 24px;
font-weight: 500;
line-height: 40px;
z-index: 3;
white-space: nowrap;
color: white;
text-align: center;
width: 100%;
margin: 5px 0px;
}
.profile_name a {
color: #fff;
text-rendering: optimizelegibility;
text-shadow: 0 0 3px rgba(0,0,0,.8);
text-decoration:none;
}
.profile_header .profileImageHelper {
bottom:-48px;
border: solid 1px lightgray;
box-shadow: 0 0 0 2pt white;
}
body.ppage .profileImageHelper, body.ppage .profileImageContainer {
border-radius:130px;
}
body.npage .profileImageHelper, body.npage .profileImageContainer {
border-radius:27px;
}
.profile_header .profileImageContainer {
border: solid 1px lightgray;
box-shadow: 0 0 0 2pt white;
}
.npage .profile_header .profileImageHelper {
right:13px;
}
.ppage .profile_header .profileImageHelper {
left:13px;
}
.profile_header .profileImageHelper,
.profile_header .profileImageContainer { /* set size of profile photo just for header */
width:128px;
height:128px;
}
.userInfo .profileImageHelper,
.userInfo .profileImageContainer,
.userInfo .profileImageContainer > div { /* set size of profile photo just for posts */
width:97%;
height:97%;
border-radius:33px;
}
.profileicon .profileImageHelper, .profileImg .profileImageHelper,
.profileicon .profileImageContainer, .profileImg .profileImageContainer,
.profileImg .profileImageContainer > div { /* set size of profile photo just for posts */
width:100%;
height:100%;
border-radius:33px;
}
.profileicon .profileImageContainer > div { /* bgimg*/
width: 47px;
height: 47px;
}
.userInfo .profileImageHelper, .profileicon .profileImageHelper, .profileImg .profileImageHelper {
position:initial;
}
.profileImageHelper {
position:absolute;
z-index:3;
border-radius: 8px;
}
.profileImageContainer {
overflow:hidden;
position:relative;
}
body.profile_page .profileImageContainer {
border-radius: 90px;
}
body.default_page .profileImageContainer {
border-radius: 30px;
}
#profileImage .pageMoreR {
}
.ppage #profileImage .pageMore {
position:absolute;
left: 38%;
bottom: -13px;
transform: translate(-50%,0px);
}
.npage #profileImage .pageMore {
position: absolute;
right: 52%;
bottom: -13px;
transform: translate(-50%,0px);
}
.profile_header .pageMore .btnPageMore {}
.profile_header .pageMore .btnPageMore:after {
top: 100%;
left: 50%;
transform: translate(-55%,10px);
color: white;
letter-spacing: -2px;
}
/*-- UNDER PROFILE GRADIENT START */
.ppage .underProfileGradient {
text-align:right;
}
.npage .underProfileGradient {
text-align:left;
}
.underProfileGradient {
background-image:url("/templates/template_mobile_1/img/gradient2.png");
background-repeat:repeat-y;
background-position:center;
background-size:cover;
height:77px;
display:table;
width:100%;
font-family: 'Montserrat', sans-serif;
}
.underProfileGradient > div {
display:table-cell;
vertical-align:middle;
padding:0px 13px;
}
.underProfileGradient > div > div {
}
.ppage .underProfileGradient > div > div.text {
margin: 6px 6px 7px 140px;
}
.npage .underProfileGradient > div > div.text {
margin: 6px 140px 7px 6px;
}
.underProfileGradient a {
color:white;
font-size:0.98em;
font-weight:900;
text-decoration:none;
}
.underProfileGradient .opts {
height:37px;
margin:6px 0px;
}
.underProfileGradient .opts > div > div {
/*margin:0px 0px 0px 5px;*/
}
.underProfileGradient .opts > div #btnPageLike {
width:33px;
height:33px;
background-color:white;
border-radius:25px;
background-image:url("/templates/template_mobile_1/img/like.png");
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
position:relative;
}
/**/
.underProfileGradient .opts > div #btnPageMore.atRight ul {
right:13px;
}
.underProfileGradient .opts > div #btnPageMore {
width:33px;
height:33px;
background-color:white;
border-radius:25px;
background-image:url("/templates/template_mobile_1/img/threedots.png");
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
position:relative;
}
.underProfileGradient .opts > div #btnPageMore.active ul {
display:block;
}
.underProfileGradient .opts > div #btnPageMore ul {
display:none;
position: absolute;
z-index:2;
top: 27px;
color: black;
background: white;
border-radius: 7px;
padding: 7px 5px;
margin: 7px;
list-style: none;
white-space: nowrap;
}
/*.underProfileGradient .opts > div #btnPageMore:before {
content:"...";
font-size: 2em;
position: absolute;
top: 30%;
left: 50%;
transform: translate(-50%,-50%);
color:green;
}*/
.underProfileGradient .opts > div #btnPageLike.liked:before {
position:absolute;
width:14px;
height:14px;
background:url("/img/selected.svg") no-repeat center center transparent;
background-size:14px 14px;
content:"";
right:-6px;
bottom:-2px;
}
/**/
.underProfileGradient .opts > div button {
border:none;
outline:none;
margin:0px 8px 0px 0px;
}
.underProfileGradient .opts > div #btnFriendAdd {
width:33px;
height:33px;
border-radius:25px;
/*background-color:white;
background-image:url(/templates/template_mobile_1/icons/usericon.png);*/
background-image: url("/templates/template_mobile_1/icons/friend_add.png");
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
position:relative;
}
/*.underProfileGradient .opts > div #btnFriendAdd::before {
position:absolute;
bottom: 7px;
right: 8px;
font-size: 0.5em;
padding: 0px 2px;
}
.underProfileGradient .opts > div #btnFriendAdd.friendAdd::before {
border-radius:45px;
background: #93c841;
color: white;
content: "+";
}*/
.underProfileGradient .opts > div #btnFriendAdd.friendApprove/*::before*/ {
/*border-radius:45px;
background:orange;
color:green;
content:"?";*/
/*background-image:url(/templates/template_mobile_1/icons/usericon_waiting.png);*/
background-image: url("/templates/template_mobile_1/icons/friend_waiting.png");
}
.underProfileGradient .opts > div #btnFriendAdd.friendDel/*::before*/ {
/*border-radius:45px;
background:red;
color:white;
content:"-";*/
/*background-image:url(/templates/template_mobile_1/icons/usericon_approved.png);*/
background-image: url("/templates/template_mobile_1/icons/friend_approved.png");
}
.underProfileGradient .opts > div #btnFriendMessage {
width:33px;
height:33px;
border-radius:25px;
/*background-color:white;
background-image:url(/templates/template_mobile_1/img/mensaje.png);*/
background-image: url("/templates/template_mobile_1/img/mensaje.png");
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
}
/* CHAT ADDONS */
#btnFriendMessage.loading {
position:relative;
}
#btnFriendMessage.loading:after, #btnFriendAdd.loading:after {
position: absolute;
content: " ";
width: 33px;
height: 33px;
opacity: 0.5;
color: red;
background: orange;
border-radius: 25px;
top:0px;
left:0px;
}
#btnFriendMessage.active {
}
/*.underProfileGradient .opts > div #btnPageShare {
width:33px;
height:33px;
background-color:white;
border-radius:25px;
background-image:url(/templates/template_mobile_1/img/sharegreen2.png);
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
}*/
.underProfileGradient .opts > div #btnPageSettings {
width:33px;
height:33px;
background-color:white;
border-radius:25px;
background-image:url("/templates/template_mobile_1/img/Opciones.png");
background-size:33px 33px;
background-repeat:no-repeat;
background-position:center;
}
.underProfileGradient .opts > div #btnFriends {
width: 33px;
height: 33px;
border-radius: 25px;
background-color: white;
background-image: url("/templates/template_mobile_1/icons/usericon.png");
background-size: 33px 33px;
background-repeat: no-repeat;
background-position: center;
position: relative;
}
/*.underProfileGradient .opts > div #btnFriendAdd:before,
.underProfileGradient .opts > div #btnFriends:before,
.underProfileGradient .opts > div #btnFriendAdd.friendAdd::before,
.underProfileGradient .opts > div #btnFriendAdd.friendApprove::before,
.underProfileGradient .opts > div #btnFriendAdd.friendDel::before {
position: absolute;
bottom: 8px;
right: 7px;
content: "";
width: 9px;
height: 9px;
border-radius: 33px;
background: white;
}*/
a.myfriends{
text-decoration: none;
color: black;
font-size: 0.7500em;
font-weight: 800;
}
/**/
.t_main_center { max-width:600px;margin:0px auto;}
.t_main_menu {
position:relative;
overflow:hidden;
/*height:28px;*/
}
.t_main_menu > div {
vertical-align:middle;
white-space: nowrap;
text-overflow: ellipsis;
}
.t_main_menu > div > a {
color:black;
text-decoration:none;
}
.t_main_menu.uppmArrowAtRight { position:relative; }
.t_main_menu.uppmArrowAtRight:before {
position: absolute;
right: -6px;
top: 50%;
width: 60px;
/*height: 60px;*/
content: "\21E0";
font-size: 2em;
color: yellow;
background: none;
border-radius: 66px;
transform: translate(45%,-50%);
}
/*-- UNDER PROFILE PAGE MENU START */
.underProfilePageMenu {
font-family: 'Montserrat', sans-serif;
overflow-x: auto;
/*height: 2em;*/ /*30px*/
background: #d2eefa;
/*box-sizing: content-box;*/
width: 100%;
padding: 3px 0px 3px 0px;
z-index:2;
}
.t_main_menu.english .underProfilePageMenu {
float: left;
overflow: auto;
/*width:auto !important;*/
}
.underProfilePageMenu > div.unactive {
display:none;
}
.underProfilePageMenu > div.switching {
opacity:0;
position:fixed;
}
.underProfilePageMenu > div {
margin:0px auto;
transition:opacity 1s;
opacity:1;
}
.underProfilePageMenu > div.threeonly {
width:363px;
margin:0px auto;
}
.underProfilePageMenu > div > div {
display:inline-block;
min-width:120px;
border-right:solid 1px #58bea9;
text-align:center;
padding:1px 3px;
white-space:nowrap;
text-transform:capitalize;
}
.underProfilePageMenu > div.threeonly > div {
}
.underProfilePageMenu > div > div a {
color:#52b7d5;
text-align:center;
display:block;
width:100%;
/*height:100%;*/
text-decoration:none;
font-family: 'Montserrat';
font-weight: 900;
font-size: 0.8em;
line-height:25px;
}
/*-- USERNAV PAGES */
.pcli img.profileimg {
width:48px;
height:48px;
}
.pcli .content {
/*margin-left:52px;*/
}
.notification_event b {
text-transform: capitalize;
color: black;
}
body.activity #activity > .activity {
padding: 6px 2px 6px 6px;
}
body.activity #activity > .activity:nth-child(odd) {
background:white;box-shadow: 0px 6px 14px -3px #aaaaaa;
}
body.activity #activity > .activity:nth-child(even) {
background:white;box-shadow: 0px 6px 14px -3px #aaaaaa;
}
body.activity #activity > .activity .content img {
max-width:100%;
}
body.activity #activity > .activity .profileImg { float:left; }
body.activity #activity > .activity .profileImg > img {width: 55px;height: 55px;border-radius: 35px;margin: 5px;}
/**/
#activity {}
#activity .activity {margin:13px 13px 13px 13px; padding: 6px 2px 6px 6px;}
#activity .activity .post_tags > .result_tags {
overflow: auto;
text-overflow: ellipsis;
}
.duration {font-size: 12px;}
/**/
button.btnResultTagsMore {
outline:none;
border:none;
background:none;
padding: 0px;
margin: 7px 0px;
}
/**/
.t_main_center { max-width:600px;margin:0px auto;}
.t_main_menu {
}
#activity .activity .info .field {
margin:0px 0px 0px 65px;
color: #7f7f7f;
min-height: 62px;
}
#activity .activity .info .field font {
font-size:0.9em;
}
#activity .activity .date { font-size: 0.7em;color: #93cb4e; }
#activity .activity a {
color:#52b7da;
font-size:1em;
font-weight:bolder;
text-decoration:none;
text-transform: capitalize;
}
#activity .activity a b {
font-size:0.9em;
}
#activity .activity .notice {font-size:0.8em;}
#activity .activity .content {
font-size: 0.9em;
word-break: break-word;
color: black;
overflow: auto;
text-overflow: ellipsis;
white-space: nowrap;
}
#activity .activity .content.di { display:inline; }
#activity .activity .content img { width:80%; }
/*.#activity .activity .content:before {
content:'"';
}
#activity .activity .content:after {
content:'"';
}*/
.duration {font-size: 0.7500em;}
/**/
body.results .result_filter > a { color:black; }
/**/
#events_container .eventsDateField {
background-image: url(img/gradient1.png);
display:table;
width:100%;
}
#events_container .eventsDateField.noEvents {
margin-bottom:30px;
}
#events_container .eventsDateField > h3 {
color: rgb(255, 255, 255);
/* padding: 5px; */
text-underline-position: under;
text-decoration: none;
font-size: 1.1em;
padding: 0px 0px 0px 6px;
/* float: left; */
display: table-cell;
white-space: nowrap;
height: 34px;
vertical-align: middle;
}
#events_container .eventsDateField > div.event_filter {
/* float: right; */
display: table-cell;
height: 34px;
vertical-align: middle;
padding: 0px 6px 0px 0px;
}
#events_container .eventsDateField > div.event_add_link {
/* margin-left: 33px; */
display: block;
width: 100%;
height: 34px;
/* margin: 0px auto; */
/* position: relative; */
display: table-cell;
text-align: center;
vertical-align: middle;
}
#events_container .eventsDateField > div.event_add_link > button {
background-image:url(/templates/template_mobile_1/img/icon-add-event.png);
background-position:center;
background-repeat:no-repeat;
background-size: 57px 57px;
content: "";
width: 34px;
height: 34px;
border: solid 1px white;
outline: none;
background-color: transparent;
border-radius: 33px;
}
#event_filter_tags {z-index:100;}
#event_filter_tags .btnall {cursor:pointer;position:absolute;left:-20px;font-size:0.7em;color:black;}
#event_filter_tags .dropevents {padding:0px 1px 0px 20px;min-width:170px;}
/*#event_filter_date_field {position:absolute;}*/
.event_filter {text-align:right;}
.event_filter > button {
font-size:1em;
font-weight:bolder;
color:white;
border:none;
outline:none;
background:transparent;
}
#event_filter_dates {z-index:100;}
.event_filter .calendar table {
border:solid 1px #2C2C2C;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-moz-box-shadow: 0 0 15px #2C2C2C;
-webkit-box-shadow: 0 0 15px #2C2C2C;
}
.event_filter .calendarDays {
background:gray;
color:yellow;
font-size:0.75em;
}
.event_filter dateCell {
display:block;
border:solid 1px lightgray;
cursor:pointer;
text-align:center;
}
.event_filter dateCell:hover { border: solid 1px #ff0000; }
.event_filter .prevornext {border:solid 1px #AADE89;background:gray;}
.event_filter .current { border:solid 1px #EEBBB7;background:lightyellow;}
.event_filter .otherdays {border:solid 1px #B7EEEC;background:lightgray;}
.event_filter .dropevents {
margin:0px; padding:0px;
border:solid 1px #2C2C2C;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-moz-box-shadow: 0 0 15px #2C2C2C;
-webkit-box-shadow: 0 0 15px #2C2C2C;
}
/**/
body.cschomepage .event,
body.events .event,
body.results .result {
word-wrap: break-word;
margin: 11px 11px;
padding: 10px 4px 3px 10px;
position: relative;
border: solid 0px #DCDAD5;
/* border-bottom: solid 1px #DCDAD5; */
background: white;
box-shadow: 0px 2px 3px 1px lightgrey;
}
.event.event_red .event_title { color:#ee0000; }
.event.event_red .event_title { color:#ee0000; }
.event.event_free .event_title { color:#7F00FF; }
.event.event_free .event_title { color:#7F00FF; }
.event.other .event_cost { display:none; } /* hide FREE from other events (fbid) */
body.cschomepage .event .event_title,
body.events .event .event_title,
body.results .result > a {
color: black;
font-family: Montserrat;
font-weight: bold;
font-size:0.8125em;
text-overflow: ellipsis;
/*text-underline-position: under;*/
text-decoration: none;
text-decoration-color: gray!important;
white-space: nowrap;
overflow: hidden;
display:block;
}
.event > div {
word-wrap:break-word;
padding:0px 0px 9px 0px;
overflow:hidden;
text-overflow: ellipsis;
}
.event > div > div > a {
font-size:1.1em;
}
.event > div > div > div > .clearfix { height:0px; }
.event .appmenu > div:nth-child(2) {
}
.event .appmenu > div:nth-child(2) a {
display:block;
position:relative;
}
.event .appmenu > div:nth-child(2) a:after {
width:30px;
height:24px;
content: "";
position: absolute;
right: 0px;
background-image: url(/img/off.png);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.event .appmenu > div:nth-child(2) a.active:after {
background-image: url(/img/on.png);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.event_info {
}
.event_location {
text-align:center;
font-size: 0.5625em;
font-weight: bold;
letter-spacing: 1px;
color: #424141;
text-overflow: ellipsis;
overflow: hidden;
width: 60%;
white-space: nowrap;
display:inline-block;
margin-left: 3px;
}
.event .event_cost {
float: right;
font-size: 0.5625em;
font-weight: bold;
letter-spacing: 1px;
color: #8ec845;
}
.event .event_date {
float:left;
font-size: 0.5625em;
font-weight: bold;
letter-spacing: 1px;
color: #424141;
}
/*-- tags*/
body.events .event .event_tags {
min-height:22px;
}
.event_tags,
.result_tags {
padding:4px 0px 4px 0px;
}
body.cschomepage .event_tags .tag a,
body.events .event_tags .tag a,
body.results .result_tags a {
margin: 0px 0px 0px 0px;
cursor: pointer;
float: left;
background-color: transparent;
color: #53b8ce;
border-radius: 66px;
padding: 0px 3px 0px 3px;
font-size: 0.78em;
font-weight: 900;
position: relative;
text-decoration: none;
}
body.results .result_tags:after {
content: "";
display: table;
clear: both;
}
.event_tags .tag {
display: inline-block;
}
/*-- THIS cant be used like that because change all settings-- you need to specify with own classes or similar !!
#form.popup input { width:100%;}
#form.popup select { width:100%;}*/
#form.popup div[contenteditable=true] {overflow-y:auto;width:100%;min-height:60px;max-height:170px;border:solid 1px lightgray;}
#form.popup .field {margin:0px auto;width:330px;}
#form.popup .field > div {margin:13px 0px;}
#form.popup .field > div > button {}
.noscroll1 {width:100%;
height:100%;
overflow:hidden;
position:relative;}
.noscroll2 {position: fixed;
width: 100%;
height: 100%;}
/**/
.t_page {}
.t_page #results_loading {
text-align:center;
font-size:0.77em;
font-weight:900;
}
.t_page .t_page_menu {
height: 30px;
overflow: auto;
}
.t_page .t_page_menu > div {
background: rgb(240, 240, 240);
position: relative;
width: 610px;
overflow: auto;
}
.t_page .t_page_menu > div > div {
width:116px;
display:inline-block;
border-right:solid 1px lightgray;
text-align: center;
}
.t_page .t_page_menu .text {
display: inline-block;
width: auto;
padding: 0px 27px 0px 4px;
font-size: 0.88em;
}
.t_page .t_page_menu .text > div {
position:absolute;
top:3px;
}
.t_page .t_page_menu select, .t_page .t_page_menu button {
width: 100%;
height:30px;
padding: 0px;
margin: 0px;
border: 0;
outline: none;
color: black;
background: rgb(240, 240, 240);
font-family: 'Montserrat', sans-serif;
appearance:none;
text-align:center;
text-align-last:center;
-webkit-appearance: none;
-moz-appearance: none;
text-indent: 1px;
text-overflow: '';
white-space:nowrap;
}
.t_page_top {
line-height:27px;
}
.t_page_top a {color:black; text-decoration:none; }
.t_page_top > h3 {margin:0px;padding:0px;}
.t_page_top > div {}
.pages_center {
text-align: center;
font-weight: bold!important;
font-size: 0.938em!important;
text-transform: capitalize;
}
.t_page_container {}
.t_page_container a {
color:#0A4682;
text-decoration:none;
}
.t_page_container ul {
list-style:none;
}
.t_page_container .tabs.menu a {
display:block;
border-radius:33px;
padding:1px 7px;
}
.t_page_container .tabs.menu a:first-letter {
text-transform:capitalize;
}
.t_page_container .tabs.menu a.active {
color:white;
background-image: url(img/gradient1.png);
}
.interests .t_page_top > div:nth-child(1) > div:nth-child(1),
.aboutme .t_page_top > div:nth-child(1) > div:nth-child(1),
.photos .t_page_top > div:nth-child(1) > div:nth-child(1),
.photos_user .t_page_top > div:nth-child(1) > div:nth-child(1),
.your_events .t_page_top > div:nth-child(1) > div:nth-child(1),
.likes .t_page_top > div:nth-child(1) > div:nth-child(1),
.followers .t_page_top > div:nth-child(1) > div:nth-child(1),
.pages .t_page_top > div:nth-child(1) > div:nth-child(1),
.pages_user .t_page_top > div:nth-child(1) > div:nth-child(1),
.friends .t_page_top > div:nth-child(1) > div:nth-child(1),
.friends_mutual .t_page_top > div:nth-child(1) > div:nth-child(1),
.friends_user .t_page_top > div:nth-child(1) > div:nth-child(1) {
color:black;
font-weight:900;
font-size:0.88em;
}
.interests .t_page_top > div:nth-child(1) > div:nth-child(2),
.aboutme .t_page_top > div:nth-child(1) > div:nth-child(2),
.photos .t_page_top > div:nth-child(1) > div:nth-child(2),
.photos_user .t_page_top > div:nth-child(1) > div:nth-child(2),
.your_events .t_page_top > div:nth-child(1) > div:nth-child(2),
.likes .t_page_top > div:nth-child(1) > div:nth-child(2),
.followers .t_page_top > div:nth-child(1) > div:nth-child(2),
.pages .t_page_top > div:nth-child(1) > div:nth-child(2),
.pages_user .t_page_top > div:nth-child(1) > div:nth-child(2),
.friends .t_page_top > div:nth-child(1) > div:nth-child(2),
.friends_mutual .t_page_top > div:nth-child(1) > div:nth-child(2),
.friends_user .t_page_top > div:nth-child(1) > div:nth-child(2) {
color:#424141;
font-weight:100;
font-size:0.77em;
text-decoration:none;
}
.interests .t_page_top .opts,
.aboutme .t_page_top .opts,
.photos .t_page_top .opts,
.photos_user .t_page_top .opts,
.your_events .t_page_top .opts,
.likes .t_page_top .opts,
.followers .t_page_top .opts,
.pages .t_page_top .opts,
.pages_user .t_page_top .opts,
.friends .t_page_top .opts,
.friends_mutual .t_page_top .opts,
.friends_user .t_page_top .opts {
color:#424141;
font-size:0.88em;
text-decoration:none;
}
.interests .t_page_top .opts select,
.aboutme .t_page_top .opts select,
.photos .t_page_top .opts select,
.photos_user .t_page_top .opts select,
.your_events .t_page_top .opts select,
.likes .t_page_top .opts select,
.followers .t_page_top .opts select,
.pages .t_page_top .opts select,
.pages_user .t_page_top .opts select,
.friends .t_page_top .opts select,
.friends_mutual .t_page_top .opts select,
.friends_user .t_page_top .opts select {
max-width:75px;
}
/**/
.interests .t_page_top > div:nth-child(2),
.aboutme .t_page_top > div:nth-child(2),
.photos .t_page_top > div:nth-child(2),
.photos_user .t_page_top > div:nth-child(2),
.your_events .t_page_top > div:nth-child(2),
.likes .t_page_top > div:nth-child(2),
.followers .t_page_top > div:nth-child(2),
.pages .t_page_top > div:nth-child(2),
.pages_user .t_page_top > div:nth-child(2),
.friends .t_page_top > div:nth-child(2),
.friends_mutual .t_page_top > div:nth-child(2),
.friends_user .t_page_top > div:nth-child(2) { /* .flr */
color:#424141;
font-weight:100;
font-size:0.77em;
text-decoration:none;
}
.interests .t_page_container ul,
.aboutme .t_page_container ul,
.photos .t_page_container ul,
.photos_user .t_page_container ul,
.your_events .t_page_container ul,
.likes .t_page_container ul,
.followers .t_page_container ul,
.pages .t_page_container ul,
.pages_user .t_page_container ul,
.friends .t_page_container ul,
.friends_mutual .t_page_container ul,
.friends_user .t_page_container ul {
padding:0px;
margin:0px 0px;
}
.interests .t_page_container li,
/*.aboutme .t_page_container li,*/
.photos .t_page_container li,
.photos_user .t_page_container li,
.likes .t_page_container li,
.followers .t_page_container li,
.pages .t_page_container li,
.pages_user .t_page_container li,
/*.friends .t_page_container li,*/
.friends_mutual .t_page_container li/*,
.friends_user .t_page_container li*/ {
/*display: inline-block;
width: 30%;*/
height: 30%;
vertical-align: top;
margin: 9px 3px;
/* background-color: #54b9c5;*/
text-align:center;
border-radius: 29px;
color: white;
font-weight: bold;
font-size: 0.6875em;
}
.interests .t_page_container li > div:nth-child(1),
.aboutme .t_page_container li > div:nth-child(1),
.photos .t_page_container li > div:nth-child(1),
.photos_user .t_page_container li > div:nth-child(1),
.followers .t_page_container li > div:nth-child(1),
.pages .t_page_container li > div:nth-child(1),
.pages_user .t_page_container li > div:nth-child(1),
.friends .t_page_container li > div:nth-child(1),
.friends_mutual .t_page_container li > div:nth-child(1),
.friends_user .t_page_container li > div:nth-child(1) {
position:relative;
}
.interests .t_page_container li > div:nth-child(1) a,
.aboutme .t_page_container li > div:nth-child(1) a,
.photos .t_page_container li > div:nth-child(1) a,
.photos_user .t_page_container li > div:nth-child(1) a,
.likes .t_page_container li > div:nth-child(1) a,
.followers .t_page_container li > div:nth-child(1) a,
.pages .t_page_container li > div:nth-child(1) a,
.pages_user .t_page_container li > div:nth-child(1) a,
.friends .t_page_container li > div:nth-child(1) a,
.friends_mutual .t_page_container li > div:nth-child(1) a,
.friends_user .t_page_container li > div:nth-child(1) a {
display:block;
text-decoration:none;
}
.interests .t_page_container li > div:nth-child(1) img,
.aboutme .t_page_container li > div:nth-child(1) img,
.photos .t_page_container li > div:nth-child(1) img,
.photos_user .t_page_container li > div:nth-child(1) img,
.likes .t_page_container li > div:nth-child(1) img,
.followers .t_page_container li > div:nth-child(1) img,
.pages .t_page_container li > div:nth-child(1) img,
.pages_user .t_page_container li > div:nth-child(1) img,
.friends .t_page_container li > div:nth-child(1) img,
.friends_mutual .t_page_container li > div:nth-child(1) img,
.friends_user .t_page_container li > div:nth-child(1) img {
width:100%;
display:block;
border-radius:17px;
}
.interests .t_page_container li > div:nth-child(1) .opts,
.aboutme .t_page_container li > div:nth-child(1) .opts,
.photos .t_page_container li > div:nth-child(1) .opts,
.photos_user .t_page_container li > div:nth-child(1) .opts,
.likes .t_page_container li > div:nth-child(1) .opts,
.followers .t_page_container li > div:nth-child(1) .opts,
.pages .t_page_container li > div:nth-child(1) .opts,
.pages_user .t_page_container li > div:nth-child(1) .opts,
.friends .t_page_container li > div:nth-child(1) .opts,
.friends_mutual .t_page_container li > div:nth-child(1) .opts,
.friends_user .t_page_container li > div:nth-child(1) .opts {
position:absolute;
top:0px;
left:0px;
right:0px;
height:17px;
font-size:0.7em;
color:black;
font-weight:100;
}
.photos .t_page_container li > div:nth-child(1) .opts .DropDownMenuXXX,
.photos_user .t_page_container li > div:nth-child(1) .opts .DropDownMenuXXX {
background: white;
border-bottom-left-radius: 99px;
}
.interests .t_page_container li > div:nth-child(2),
.aboutme .t_page_container li > div:nth-child(2),
.photos .t_page_container li > div:nth-child(2),
.photos_user .t_page_container li > div:nth-child(2),
.likes .t_page_container li > div:nth-child(2),
.followers .t_page_container li > div:nth-child(2),
.pages .t_page_container li > div:nth-child(2),
.pages_user .t_page_container li > div:nth-child(2),
.friends .t_page_container li > div:nth-child(2),
.friends_mutual .t_page_container li > div:nth-child(2),
.friends_user .t_page_container li > div:nth-child(2) {
color:black;
font-size:0.7em;
font-weight:100;
text-decoration:none;
}
.interests .t_page_container li > div:nth-child(2) a,
.aboutme .t_page_container li > div:nth-child(2) a,
.photos .t_page_container li > div:nth-child(2) a,
.photos_user .t_page_container li > div:nth-child(2) a,
.likes .t_page_container li > div:nth-child(2) a,
.followers .t_page_container li > div:nth-child(2) a,
.pages .t_page_container li > div:nth-child(2) a,
.pages_user .t_page_container li > div:nth-child(2) a,
.friends .t_page_container li > div:nth-child(2) a,
.friends_mutual .t_page_container li > div:nth-child(2) a,
.friends_user .t_page_container li > div:nth-child(2) a {
color:black;
font-weight:900;
font-size: 1.25em;
text-decoration:none;
}
.interests .t_page_container li > div:nth-child(2) font,
.aboutme .t_page_container li > div:nth-child(2) font,
.photos .t_page_container li > div:nth-child(2) font,
.photos_user .t_page_container li > div:nth-child(2) font,
.likes .t_page_container li > div:nth-child(2) font,
.followers .t_page_container li > div:nth-child(2) font,
.pages .t_page_container li > div:nth-child(2) font,
.pages_user .t_page_container li > div:nth-child(2) font,
.friends .t_page_container li > div:nth-child(2) font,
.friends_mutual .t_page_container li > div:nth-child(2) font,
.friends_user .t_page_container li > div:nth-child(2) font {
color:black;
font-weight:100;
text-decoration:none;
}
/*-- .your_events have different style */
.your_events .t_page_container li { display:block; }
.your_events .t_page_container li:nth-child(even) { background:lightgray; }
.your_events .t_page_container li:nth-child(odd) { background:none; }
.your_events .t_page_container li > div:nth-child(1) { font-size: 0.77em; color:#0A4682; }
.your_events .t_page_container li > div > div:nth-child(1) { }
.your_events .t_page_container li > div > div:nth-child(2) { }
.your_events .t_page_container li > div > div:nth-child(1),
.your_events .t_page_container li > div > div:nth-child(2) {
float:left;
color:#424141;
font-weight:100;
font-size:0.77em;
margin:0px 0px 0px 3px;
white-space:nowrap;
}
.your_events .t_page_container li > div > div:nth-child(3) { margin-left:116px; }
.your_events .t_page_container li > div > div:nth-child(3) a { text-decoration:none; color:black;
font-weight:900;
font-size:0.88em;
}
.your_events .t_page_container li:after { content: "";display: table;clear: both; }
/*-- POST */
.post .postShare {
position:relative;
}
.post .postShare #share_post_buttons_outer {
position: absolute;
right:0px;
background: white;
border: 1px solid lightgray;
border-radius: 3px;
padding: 3px 6px;
text-align: left;
white-space:nowrap;
}
.post .postShare #share_post_buttons_outer > div > div {
padding:3px 0px;
}
/*-- POST IMAGES */
.post .content img {
max-width:100%;
}
.post .content img.img_big {}
.post .content img.img_medium {}
.post .content img.img_small {}
/*-- PHOTOS POPUP VIEW / COMMENT */
.photo_field .btn_post_comment { /* hide send/post comment button. instead use ENTER/SUBMIT phone*/
display:none;
}
.photo_field {}
.photo_field > div:nth-child(1) { /* #photos*/
}
.photo_field #comments { /* #comments*/
margin: 13px 0px 0px 0px;
padding: 13px 7px;
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
background: #fbfbfb;
border-top-left-radius: 21px;
border-top-right-radius: 21px;
box-shadow: 0px 0px 2px 1px grey;
}
body:not(.photos2_comment_focus) .photo_field #comments {
height: 50px;
overflow: auto;
}
body:not(.photos2_comment_focus) .photo_field #comments:before {
position: fixed;
left: 0px;
right: 0px;
bottom: 0px;
background: gray;
opacity: 0.5;
z-index: 1000;
height: 79px;
content: "";
border-top-left-radius: 21px;
border-top-right-radius: 21px;
}
body.photos2_comment_focus .photo_field #comments {
/*height:auto;
max-height:50%;*/
}
.photo_field #photos_view .photosMenu {
margin: 7px;
position:relative;
}
.photo_field #photos_view .photosMenu > button {
/*border:none;
outline:none;
background-color:transparent; */
}
.photo_field #photos_view .photosMenu > button.photosLike {
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat;
width: 30px;
height: 30px;
position: absolute;
top: 40px;
right: 7px;
border-radius: 33px;
}
.photo_field #photos_view .photosMenu > button.photosLike.active {
}
.photo_field #photos_view .photosMenu > button.photosLike:after {
background: url(img/like-blue.png);
content: "";
position: absolute;
transform: translate(-50%,-50%);
top: 50%;
left: 50%;
background-size: 100% 100%;
width: 100%;
height: 100%;
}
.photo_field #photos_view .photosMenu > button.photosLike.active:after {
background: url(img/like-yellow.png);
content: "";
position: absolute;
transform: translate(-50%,-50%);
top: 50%;
left: 50%;
background-size: 100% 100%;
width: 100%;
height: 100%;
}
.photo_field #photos_view .photosMenu > button#btn_photos_left {
float:left;
}
.photo_field #photos_view .photosMenu > button#btn_photos_right {
float:right;
}
.photo_field #photos_view .photosMenu > div {
text-align:center;
font-weight:900;
}
.photo_field #photo {
overflow:auto;
}
.photo_field #photo > img {
width:100%;
height:auto;
}
/**/
.buttondotsdown {
padding:9px 0px 0px 5px;
cursor:pointer;
}
.buttondotsdown > div {
width: 7px;
height: 7px;
border-radius: 25px;
background: white;
margin: 5px 0px;
}
/*-- COMMENT START */
.comments {}
.comments > .load_more { font-size:0.73em; text-align:center; text-transform:lowercase; font-weight:400; color:#385898; }
/*-- TABLE COMMENT REPLY FIELD START */
.comments > .field { margin:7px 0px 3px 0px; }
.comments > .field > .left { float:left; }
.comments > .field > .left > a { text-decoration:none; } /* user profile url */
.comments > .field > .left > a > img {border-radius: 100%;} /* .ser logo */
.comments > .field > .right {
position:relative;
margin:0px 0px 0px 33px;
border-radius: 13px;
border: solid 1px rgb(221, 225, 232);
background: rgb(242, 243, 245);
box-shadow: 0px 0px 3px 1px rgb(221, 225, 232);
}
.comments > .field > .right .options {
position: absolute;
z-index: 3;
right: 7px;
top: 0px;
}
.comments > .field > .right .options img {
width:20px;
height:18px;
}
.comments > .field > .right .options .btn {
/*display:inline-block;*/
float:left;
height: 22px;
width: 27px;
position: relative;
background: transparent;
border:none;
outline:none;
padding: 0px;
margin: 1px 7px;
}
.comments > .field > .right .options .btn:hover { text-decoration:none; }
.comments > .field > .right .options .btn_post_comment {
}
/*.comments > .field > .right .options .btn_post_comment:before {
content:"\25B6";
}*/
.comments > .field > .right .options .btn_emoji {
}
.comments > .field > .right .options .btn_emoji .emosxxxfield {
display:inline-block;
position:relative;
}
.comments > .field > .right .options .btn_emoji .emosxxxbutton {
/*vertical-align: text-bottom;
line-height: 11px;*/
font-size: 1.3125em;
/*float: right;
margin-right: 13px;*/
}
.comments > .field > .right .options .btn_emoji button.emosxxxbutton {
outline:none;
border:none;
background:transparent;
}
.comments > .field > .right .editable {
padding: 5px 22px 5px 6px;
overflow: auto;
max-height: 133px;
outline-style: none;
font-family: system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
font-size:0.8em;
vertical-align:baseline;
font-weight:400;
color:rgb(68, 68, 68);
}
.comments > .field > .right .editable.empty { color:gray; }
.comments > .field > .right .display_photos {
}
.comments > .field > .right .display_photos > div {
width:80%;
margin:0px auto;
position:relative; /* for delete button */
}
.comments > .field > .right .display_photos > div > .commentImage {
width:100%;
}
.comments > .field > .right .display_photos > div > .deleteCommentImage {
}
.comments > .field > .right .display_photos > div > .deleteCommentImage::before {
position: absolute;
content: "X";
width: 15px;
height: 15px;
vertical-align: baseline;
right: 3px;
top: 3px;
color: black;
background: white;
text-align: center;
border-radius: 33px;
box-shadow: 0px 0px 2px 1px grey;
font-size: 0.73em;
cursor:pointer;
}
.comments > .field > .right .display_photos > div > .deleteCommentImage:hover::before {
background:yellow;
}
.comments > .field > .notice {
font-size: 0.6em;
color: #737373;
margin: 0px 0px 6px 33px;
}
/*-- COMMENT DISPLAY START */
.comments > .display {
overflow: auto;
max-height: 50vh;
}
.comments > .display .comment {
margin:0px 0px 13px 0px;
}
.comments > .display .comment > .left {
float:left;
}
.comments > .display .comment > .left a { text-decoration:none; }
.comments > .display .comment > .left > a > img {
border-radius: 100%;
}
.comments > .display .comment > .right {
margin:0px 0px 0px 33px;
}
.comments > .display .comment > .right > .display {
display:inline-block;
padding: 6px 30px 6px 6px;
border-radius: 13px;
margin: 0px 0px 0px 0px;
background: rgb(242, 243, 245);
color:rgb(68, 68, 68);
position:relative;
}
.comments > .display .comment > .right > .display .display_photos {}
.comments > .display .comment > .right > .display .display_photos > div {
width:80%;
margin:0px auto;
}
.comments > .display .comment > .right > .display .display_photos > div .commentImage {
width:100%;
}
.comments > .display .comment > .right > .display .user {
display:inline-block;
margin:0px 17px 0px 0px;
}
.comments > .display .comment > .right > .display .user a {
color: #385898;
text-decoration: none;
font-weight: bolder;
}
.comments > .display .comment > .right > .display .text {
font-family: system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
font-size:0.8em;
line-height:1.6em;
vertical-align:baseline;
display:inline;
font-weight:400;
}
.comments > .display .comment > .right > .display .menu {
position: absolute;
right: 2px;
top: 49%;
/* margin: 0px 0px; */
margin: -4px 0px 0px 0px;
z-index:1;
}
.comments > .display .comment > .right > .display .menu .btn {
font-size:0.8em;
}
.comments > .display .comment > .right > .options {
font-size:0.73em;
}
.comments > .display .comment > .right > .options > font.btn {
font-weight:100;
color:#385898;
}
.comments > .display .comment > .right > .options > font.btn.liked {
background-image: url(/templates/template_mobile_1/img/like-yellow.png);
width: 16px;
height: 16px;
background-size: 16px 16px;
display: inline-block;
background-repeat: no-repeat;
background-position: center;
}
.comments > .display .comment > .right > .options > font.btn.notliked {
background-image: url(/templates/template_mobile_1/img/like-blue.png);
width: 16px;
height: 16px;
background-size: 16px 16px;
display: inline-block;
background-repeat: no-repeat;
background-position: center;
}
.comments > .display .comment > .right > .options > font.duration {
color:gray;
}
.comments > .display .comment > .right > .options > font:not(.jstext) {
}
.comments > .display .comment > .right > .options > font > .like_image {
position:relative;
display: inline-block;
margin: 0px 0px 0px 21px;
}
.comments > .display .comment > .right > .options > font > .like_image:after {
position:absolute;
content:"";
left: -22px;
top: -2px;
width: 21px;
height: 21px;
background-image: url(/img/LIKE-BUTTON.png);
background-position: center;
background-size: 21px 21px;
}
/*-- COMMENT REPLY FIELD START */
.comments > .display .comment > .right > .reply_display {
}
.comments > .display .comment > .right > .reply_field {
margin:6px 0px 0px 0px;
}
.comments > .display .comment > .right > .reply_field .left { float:left; }
.comments > .display .comment > .right > .reply_field .left > a { text-decoration:none; } /* user profile url */
.comments > .display .comment > .right > .reply_field .left > a > img {border-radius: 100%;} /* user logo */
.comments > .display .comment > .right > .reply_field .right {
margin:0px 0px 0px 33px;
position:relative;
border-radius: 13px;
border: solid 1px rgb(221, 225, 232);
background: rgb(242, 243, 245);
box-shadow: 0px 0px 3px 1px rgb(221, 225, 232);
}
.comments > .display .comment > .right > .reply_field .options {
position: absolute;
z-index: 3;
right: 7px;
top: 3px;
}
.comments > .display .comment > .right > .reply_field .options img {
width:18px;
height:16px;
}
.comments > .display .comment > .right > .reply_field .options .btn {
display:inline-block;
float:left;
}
.comments > .display .comment > .right > .reply_field .options .btn:hover { text-decoration:none; }
.comments > .display .comment > .right > .reply_field .options .btn_emoji {}
.comments > .display .comment > .right > .reply_field .options .btn_emoji .emosxxxfield {
display:inline-block;
position:relative;
}
.comments > .display .comment > .right > .reply_field .options .btn_emoji .emosxxxbutton {
vertical-align: text-bottom;
line-height: 11px;
font-size: 1.3125em;
float: right;
margin-right: 13px;
}
.comments > .display .comment > .right > .reply_field .editable {
padding: 5px 22px 5px 6px;
overflow: auto;
max-height: 133px;
outline-style: none;
font-family: system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
font-size:0.8em;
vertical-align:baseline;
font-weight:400;
color:rgb(68, 68, 68);
}
.comments > .display .comment > .right > .reply_field .editable.empty { color:gray; }
.comments > .display .comment > .right > .reply_field .display_photos {}
.comments > .display .comment > .right > .reply_field .display_photos > div {
width:80%;
margin:0px auto;
position:relative; /* for delete button */
}
.comments > .display .comment > .right > .reply_field .display_photos > div > .commentImage {
width:100%;
}
.comments > .display .comment > .right > .reply_field .display_photos > div > .deleteCommentImage {
}
.comments > .display .comment > .right > .reply_field .display_photos > div > .deleteCommentImage::before {
position: absolute;
content: "X";
width: 15px;
height: 15px;
vertical-align: baseline;
right: 3px;
top: 3px;
color: black;
background: white;
text-align: center;
border-radius: 33px;
box-shadow: 0px 0px 2px 1px grey;
font-size: 0.73em;
cursor:pointer;
}
.comments > .display .comment > .right > .reply_field .display_photos > div > .deleteCommentImage:hover::before {
background:yellow;
}
.comments > .display .comment > .right > .reply_field .notice {
font-size: 0.6em;
color: #737373;
margin: 0px 0px 6px 33px;
}
/*-- 8.11.19, photos2.js, function_insert */
#photos_content .photo {
width: 43%;
height: 100px;
margin: 7px;
display: inline-block;
vertical-align: middle;
position: relative;
max-width: 125px;
border-radius: 9px;
box-shadow: 0px 0px 2px 1px grey;
background: lightgray;
}
#photos_content .photo img {
max-width: 104px;
max-height: 104px;
margin: auto;
display: block;
position: absolute;
top: 28px;
bottom: 12px;
left: 0;
right: 0;
padding: 0px;
width: calc( 100% - 24px );
height: calc( 100% - 30px );
}
#photos_content .photo label {
display:none;
}
/**/
#results_menu .result_filter .result_tags_menu {
display:none;
}
/*-- SEARCH IDS DEFINED BY USER */
#header_search_layout,
#header_search_layout3,
#header_search_layout4,
#searchbar_tags_menu {
position:relative;
margin:0px 2px;
}
#header_search_layout3,
#searchbar_tags_menu {
margin: 13px auto;
}
/* LMOSTCSSSF0001 Style for tags in search-for page. */
#header_search_layout .tagField,
#header_search_layout3 .tagField,
#searchbar_tags_menu .tagField {
margin: 1px 2px;
text-decoration: none;
color: #479fff;
border-radius: 22px;
margin: 0px 4px 0px 0px;
display: inline-block;
position: relative;
font-weight: bold;
/*padding: 0px 14px 0px 6px;
position: relative;
text-decoration: none;
font-size: 0.875em;
color: white;
background: #53b7d3;
border-radius: 22px;
margin: 6px 4px 0px 0px;
display: inline-block;*/
}
#header_search_layout .tagEmpty,
#header_search_layout4 .tagEmpty,
#header_search_layout3 .tagEmpty {
display: inline-block;
vertical-align: middle;
margin: 5px 0px 3px 0px;
padding:0px 20px 0px 11px;
position:relative;
}
#header_search_layout .loadingField,
#header_search_layout4 .loadingField,
#header_search_layout3 .loadingField {
display: inline-block;
vertical-align: bottom;
margin: 5px 0px 3px 0px;
}
#header_search_layout .tagDelete,
#header_search_layout4 .tagDelete,
#header_search_layout3 .tagDelete,
#searchbar_tags_menu .tagDelete {
display: inline;
right: 0px;
top: 0px;
cursor: pointer;
position: absolute;
height: 13px;
width: 13px;
}
#header_search_form,
#header_search_form4,
#header_search_form3 {}
#header_search_form:before,
#header_search_form4:before,
#header_search_form3:before {
position:absolute;
left:0px;
top:0px;
width:21px;
height:37px;
content:"";
background-image:url(/img/lupa.png);
background-size:21px 21px;
background-position:center;
background-repeat:no-repeat;
opacity:0.4;
z-index:1;
}
#header_search_form:after,
#header_search_form4:after,
#header_search_form3:after {
content: "";display: table;clear: both; }
#header_search_bar,
#header_search_bar3 {}
#header_search_results,
#header_search_results4,
#header_search_results3 {
z-index:998;
border-bottom-left-radius:25px;
border-bottom-right-radius:25px;
background:white;
}
#header_search_results > div,
#header_search_results4 > div,
#header_search_results3 > div {
margin:13px 0px;
}
#header_search_results .searchResults,
#header_search_results4 .searchResults,
#header_search_results3 .searchResults {
background:white; }
#header_search_results .searchResult,
#header_search_results4 .searchResult,
#header_search_results3 .searchResult {
margin:0px;
border-bottom:dotted 1px lightgray;
cursor:pointer;
}
#header_search_results .searchResult:hover,
#header_search_results4 .searchResult:hover,
#header_search_results3 .searchResult:hover {
background:yellow;
}
#header_search_results .searchResult > div:nth-child(1),
#header_search_results4 .searchResult > div:nth-child(1),
#header_search_results3 .searchResult > div:nth-child(1) {
font-size:0.7em;
color:gray;
display:none;
}
/**/
.searchBar a.searchResult {
display:block;
padding:3px 4px;
}
/* SEARCH ICONS TOP */
#search_icons,
#search_icons3 {
text-align:center;
}
#search_icons > div,
#search_icons3 > div {
display: inline-block;
padding: 5px 5px;
margin: 13px 9px;
cursor: pointer;
position: relative;
width: 52px;
height: 35px;
background-size: auto 35px;
background-repeat: no-repeat;
background-position: center;
background-color: yellowgreen;
border-radius: 13px;
box-shadow: 0px 0px 5px 1px #888888;
}
div#header_search_bar,
div#header_search_bar4,
div#header_search_bar3 {
border-radius: 0px;
box-sizing: border-box;
border: solid 0px #eeeeee!important;
background-color: rgb(255, 255, 255)!important;
font-family: Montserrat;
color: black;
display: block;
margin-left: auto!important;
margin-right: auto!important;
width: 100%;
}
.selected {
background-color: #53b7d3!important;
border: 2px solid white;
}
#search_icons > div:nth-child(1),
#search_icons3 > div:nth-child(1) {
background-image:url('/templates/template_mobile_1/icons/sico_calendar.png');}
#search_icons > div:nth-child(2),
#search_icons3 > div:nth-child(2) {
background-image:url('/templates/template_mobile_1/icons/sico_page2.png'); }
#search_icons > div:nth-child(3),
#search_icons3 > div:nth-child(3) {
background-image:url('/templates/template_mobile_1/icons/sico_profile2.png'); }
#search_icons > div:nth-child(4),
#search_icons3 > div:nth-child(4) {
background-image:url('/templates/template_mobile_1/icons/sico_map.png');}
#search_icons > div.selected,
#search_icons3 > div.selected {
/*border-bottom:solid 2px #0294F5;
border-radius:13px;*/
}
#search_icons > div.selected:before,
#search_icons3 > div.selected:before {
position:absolute;
width:14px;
height:14px;
background:url("/img/selected.svg") no-repeat center center transparent;
background-size:14px 14px;
content:"";
right:6px;
bottom:-6px;
}
/* SEARCH CONSTANT IDS,CLASSES,tAGS. */
#search,
#search3 {
display:block;
margin:0px 0px;
height: 70px;
background-color: bisque;
padding: 0px 10px 10px 10px;
background-image: url(img/gradient1.png);
}
/*--.*/
body.wall #search,
body.wall #search3 {
border-radius:13px;
height:auto;
padding:0;
}
#search a,
#search3 a {
color:#0A4682; }
#search #search_title,
#search3 #search_title {
display:inline-block;
height:100%;
vertical-align:middle;
margin: 5px 0px 3px 0px;
padding: 0px 20px 0px 11px;
}
#searchLayout,
#searchLayout3 {}
.slstyle {
border: 0px solid #c0c0c0;
background:#fff;
height:37px;
max-height:37px;
box-shadow: 0px 0px 12px 0px #424141a8;
}
/*--*/
body.wall #header_search_layout,
body.wall #header_search_layout3 {
margin:1px 0px;
height:none;
max-height:none;
box-shadow:0px 0px 2px 1px lightgrey;
border-radius:13px;
}
#searchText,
#searchText3 {
}
#search .ststyle,
#search3 .ststyle {
min-height: 36px;
line-height: 24px;
font-size: 0.81em;
font-weight: 600;
clear: both;
outline: 0;
border-top: 0;
border-bottom: 0;
border-left: 0;
overflow-x: none;
padding: 0px 0px 0px 21px;
text-align: left;
vertical-align: bottom;
}
/*--*/
body.wall #header_search_bar,
#header_search_bar3 {
border-radius:13px;
}
#search .search_side_menu,
#search3 .search_side_menu {
display:none;
position:absolute;
/*top:0px;
right:0px;
width: 24px;
height: 24px;*/
top: 50%;
right: 0px;
transform: translate(0%,-50%);
}
#search .search_side_menu > .menu,
#search3 .search_side_menu > .menu {
position: absolute;
top: 37px;
left: 50%;
transform: translate(-50%,0px);
z-index: 1000;
}
#search .search_side_menu > .button,
#search3 .search_side_menu > .button {
/*margin:7px 0px 0px 0px; */
width:100%;
height:100%;
font-size:1.5em;
}
#search .historyEnable .ststyle,
#search3 .historyEnable .ststyle {
/*margin:7px 30px 7px 16px; - causing problem*/
}
#search .favoriteEnable .ststyle,
#search3 .favoriteEnable .ststyle {
/*margin:7px 30px 7px 16px; - causing problem*/
}
#search .historyEnable .search_side_menu,
#search3 .historyEnable .search_side_menu {
display:block;
z-index:1000;
}
#search .favoriteEnable .search_side_menu,
#search3 .favoriteEnable .search_side_menu {
display:block;
z-index:1000;
}
#search .search_side_menu > .menu > div,
#search3 .search_side_menu > .menu > div {
padding:8px 13px 8px 15px;
}
#search .search_side_menu .btnSearchHistory,
#search3 .search_side_menu .btnSearchHistory {
position:relative; display:none; }
#
search .search_side_menu .btnSearchFavorites,
#search3 .search_side_menu .btnSearchFavorites {
position:relative; display:none; }
#search .search_side_menu .btnSearchHistory:before,
#search3 .search_side_menu .btnSearchHistory:before {
position:absolute;
width:21px;
height:21px;
background-image:url(/templates/template_mobile_1/img/icon-hour.png);
background-size:17px 17px;
background-position:center;
background-repeat:no-repeat;
left:-6px;
content:"";
}
#search .search_side_menu .btnSearchFavorites:before,
#search3 .search_side_menu .btnSearchFavorites:before {
position:absolute;
width:21px;
height:21px;
background-image:url(/templates/template_mobile_1/img/like-yellow.png);
background-size:17px 17px;
background-position:center;
background-repeat:no-repeat;
left:-6px;
content:"";
}
#search .historyEnable .search_side_menu .btnSearchHistory,
#search3 .historyEnable .search_side_menu .btnSearchHistory {
display:block; }
#search .favoriteEnable .search_side_menu .btnSearchFavorites,
#search3 .favoriteEnable .search_side_menu .btnSearchFavorites {
display:block; }
.searchButton {
display:none;
}
#searchOptions {}
.searchOptionsField_header {
background:#1E90FE;
border:solid 1px #fff;
}
.searchOptionsField {
background:#fff;
border:solid 1px #000;
}
/*-- APPMENU */
.appmenu {
float:right;
cursor:pointer;
position:relative;
line-height:auto;
vertical-align:middle;
}
.appmenu.dropd {
margin:0px;
padding:0px;
color:black;
}
.appmenu.options, .appmenu.menu {
color: #ffffff;
padding:7px 0px;
}
.appmenu.options > div {}
.appmenu.options > div.dott.gray.mobile { /* nothing*/
margin-bottom:5px;
}
.appmenu.options > div.starr.gray.mobile { /* interested*/
}
.appmenu.options > div.starr.gold.mobile { /*going*/
}
.appmenu.options > div > span {
width:20px;
height:20px;
}
.appmenu .app_back {
background:url(mobile_back1.png) no-repeat center center transparent;
background-size:17px 17px;
width:45px;
height:45px;
}
.appmenu .app_user {
font-size:0.77em;
}
.appmenu .app_user, .appmenu .app_user a {
color:white;
white-space:nowrap;
display:block;
text-decoration:none;
}
.appmenu .app_settings {
background:url(img/mobile_settings4.png) no-repeat center center transparent;
background-size:19px 40px;
width:25px;
height:61px;
padding:0px 3px 0px 3px;
}
.appmenu > div:nth-child(2) {
position: absolute;
top: 38px;
right: -5px;
display:inline-block;
background:#f1f0f0;
padding:0px 7px;
width:145px;
max-height:277px;
overflow-y:auto;
z-index:900;
border-bottom-left-radius:25px;
}
.appmenu.options > div:nth-child(2), .appmenu.dropd > div:nth-child(2) {
position: absolute;
top: 2px;
right: -4px;
padding: 0px 7px 7px 7px;
border-radius: 7px;
box-shadow: 0px 3px 3px 1px #2c2c2c9c;
}
.appmenu.menu > div:nth-child(2) {
position:absolute;
top:9px;
right:13px;
padding:7px;
border-radius:7px;
}
.appmenu > div:nth-child(2) > div {
position: relative;
padding: 0px 0px 0px 0px;
border-top: 1px solid #aaaaaa;
}
body.mobile .appmenu > div:nth-child(2) > div {
padding:7px 0px 7px 0px;
}
.appmenu > div:nth-child(2) a {
color: black;
opacity: 0.8;
padding: 2px 0px 2px 7px;
text-decoration: none;
display:block;
}
.appmenu.fsbig > div:nth-child(2) a {
font-size:1.1em;
}
.appmenu > div:nth-child(2) a:hover {}
.appmenu .selected {color:red;font-weight:bolder;text-decoration:underline;}
body{
font-family: "Montserrat";
}
/* .single-line
* contenteditable Act as input.
* */
[contenteditable="true"].single-line {
white-space: nowrap;
overflow: hidden;
}
[contenteditable="true"].single-line br {
display:none;
}
[contenteditable="true"].single-line * {
display:inline;
white-space:nowrap;
}
[contenteditable="true"] {
border-radius:11px;
box-sizing:border-box;
border: solid 0px #eeeeee;
/*font-size: 0.75em;*/
font-family:Montserrat;
/*font-weight:bold;*/
color:rgba(115, 111, 111, 0.52);
}
[contentEditable=true]:empty:not(:focus) {
position:relative;
}
[contentEditable=true]:empty:not(:focus):before {
position:absolute;
top:50%;
left:0px;
margin:0px 0px 0px 6px;
content:attr(placeholder);
color: #736f6f;
font-family: Montserrat;
font-weight: bold;
transform: translate(0,-50%);
}
[contenteditable="true"]:focus {
color:black;
font-weight:initial;
}
[contenteditable="true"]:not(.unfocused) {
color:black;
font-weight:initial;
}
div#description[contenteditable=true]:not(.skipStyle) {
border: solid 0px #eeeeee!important;
background-color: #eeeeee!important;
max-width: 95%;
margin: 7px auto;
display: block;
padding: 4px;
overflow-y: auto;
min-height: 60px;
max-height: 170px;
}
div.discNewPage:empty:not(:focus):before {
content: attr(data-placeholder)
}
.btnEventTag {
margin: 2px 1px 4px 8px;
cursor: pointer;
float: left;
border-radius: 66px;
padding: 1px 10px 1px 10px;
font-size: 0.813em;
margin: 1px 2px;
text-decoration: none;
color: #479fff;
border-radius: 22px;
margin: 0px 4px 0px 0px;
display: inline-block;
position: relative;
font-weight: bold;
/*padding: 0px 14px 0px 6px;
position: relative;
text-decoration: none;
font-size: 0.875em;
color: white;
background: #53b7d3;
border-radius: 22px;
margin: 6px 4px 0px 0px;
display: inline-block;*/
}
button#save.green {
background: #92c83e;
height: 50px;
margin-top: 6%!important;
border: 0px!important;
color: white;
font-size: 0.813em;
font-weight: bold;
border-radius: 7px;
}
button#place_tags_add {
width:22px;
float:right;
-webkit-appearance: button;
-webkit-writing-mode: horizontal-tb !important;
text-rendering: auto;
color: white;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: center;
align-items: flex-start;
cursor: default;
background-color: buttonface;
box-sizing: border-box;
margin: 3px;
font: 400 1.1875em Arial;
padding: 0px 6px;
border-width: 0px;
border-style: outset;
border-color: buttonface;
border-image: none;
background: #92c83e;
border-radius: 35px;
font-weight: bold;
}
div:empty:before:not(.skipStyle) {
/*content: attr(data-placeholder)!important;*/
color: #797979!important;
font-family: Montserrat!important;
font-weight: bold!important;
/*font-size: 13px!important;*/
}
input:not(.skipStyle) {
cursor: text;
margin: 0em;
font-size: 0.75em;
font-family:Montserrat;
font: 400 0.813em Montserrat;
border-radius: 11px;
border-width: 0px;
box-sizing:border-box;
padding-left: 10px;
padding-right: 0px;
padding-top: 3px;
padding-bottom: 3px;
font-weight: bold;
color: #736f6f;
background-color: #eeeeee;
border: solid 1px #b3b3b3;
/*width: -webkit-fill-available; */
}
/* LMOSTCSSCZ0001 Size of checkbox, and before this is the style issue in checkbo when creating an event.*/
.bigCheckbox{
width: 15px;
height: 15px;
}
input.unfocused:not(.skipStyle) {
}
input[type="text"][disabled]:not(.skipStyle) {
background: #ffe5e5!important;
}
label:not(.skipStyle) {
margin-bottom: 0px;
font-size: 0.75em;
font-family:Montserrat;
font-weight: bold;
color: #736f6f;
white-space:nowrap;
}
select:not(.skipStyle) {
background-color: #eeeeee;
cursor: default;
margin: 0em;
font-size: 0.75em;
font-family:Montserrat;
border-radius: 13px;
border-width: 1px;
border-style: solid;
font-weight: bold;
padding: 2px 1px;
color:rgba(115, 111, 111, 0.52);
-webkit-appearance: none; /*-- Disable IOS strange style. */
}
select:focus:not(.skipStyle) {
color: #736f6f;
}
.wallv2 { /*-- mobile css */
position: relative;
/*word-break: break-word; NOT GOOD TO BREAK ALL WORDS!!!*/
margin: 0px 16px;
}
.wallv2 .btn_options {
font-size:1em;
background:#d3d8dc;
color:black;
border-radius:25px;
padding:0px 7px;
display:inline-block;
cursor:pointer;
text-transform:capitalize;
font-weight:bolder;
}
.wallv2 .top { /* mobile css */
width: 100%;
max-width: 600px;
margin: 22px auto 0px auto;
background: lightgray;
border-radius: 9px;
box-shadow: 0px 0px 3px 1px lightgrey;
}
.wallv2 .separate {
color:gray;
display:inline-block;
position:relative;
width: 22px;
height: 22px;
line-height: 22px;
vertical-align: middle;
}
.wallv2 .separate::after {
position:absolute;
width:22px;
content:"|";
left: 11px;
font-size: 1.3750em;
}
.wallv2 .top > .topm {
background:#d3d8dc;
line-height:30px;
}
.wallv2 .topm img {width:22px;height:22px;vertical-align:middle;}
.wallv2 .top > .topw {
}
.wallv2 .top > .topw > .uploadphotoicon {
width: 50px;
height: 60px;
float: right;
background: #3f9fc3;
background-image: url(/templates/template_mobile_1/img/photoiconwhite.png);
background-size: 32px 32px;
background-color: #3c9ec2;
border-top-right-radius: 13px;
border-bottom-right-radius: 13px;
background-repeat: no-repeat;
background-position: center;
padding: 1px;
cursor:pointer;
}
.wallv2 .top > .topw > .profileicon {
float:left;
background: white;
border-top-left-radius: 13px;
border-bottom-left-radius: 13px;
width:62px;
height:62px;
position:relative;
}
.wallv2 .top > .topw > .profileicon a {
text-decoration:none;
display:block;
}
.wallv2 .optTop {
padding:1px 0px 7px 0px;
}
.wallv2 .optTop .userInfo {
height:53px;
position:relative;
}
.wallv2 .optTop .userInfo > div > div {
color: white;
font-weight: bolder;
}
.wallv2 .top > .topw > .profileicon .bgimg,
.wallv2 .optTop .userInfo .bgimg {
border-radius:33px;
}
.wallv2 .optTop .userInfo > div:nth-child(1) {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
bottom: 0px;
width: 47px;
height:47px;
box-shadow: 0px 0px 0px 0px grey;
border-radius: 33px;
background:white;
}
.wallv2 .optTop .userInfo > div:nth-child(2) {
margin: 0px 0px 0px 42px;
padding: 3px 3px 3px 13px;
width: calc( 100% - 78px );
position: absolute;
left: 0px;
top: 42%;
z-index: 0;
color: white;
border-top-right-radius: 8px;
border-bottom-right-radius: 8px;
font-size: 0.875em;
line-height: 20px;
max-height: 40px;
overflow: hidden;
transform: translate(0%,-50%);
white-space:nowrap;
}
.wallv2 .optTop .userInfo.typeProfile > div:nth-child(2) {
background: rgb(146, 200, 62);
}
.wallv2 .optTop .userInfo.typePage > div:nth-child(2) {
background:rgb(82, 183, 213);
}
.wallv2 .optTop .userInfo .postOptions {
width: 30px;
height: 16px;
position:absolute;
top:50%;
right:4px;
transform:translate(4px,-50%);
z-index:3;
}
.wallv2 .top > .topw > .wall_simple {
margin: 0px 50px 0px 62px;
padding: 0px 6px 0px 6px;
background: white;
height: 62px;
font-size: 0.83em;
position:relative;
}
.wallv2 .top > .topw > .wall_simple:before {
position:absolute;
content:attr(emptytext);
top:50%;
left:6px;
transform:translate(6px,-50%);
}
.wallv2 .top > .topw > .wall_simple.unactive {
color:gray;
line-height:62px;
cursor:pointer;
}
.wallv2 .top > .topw > .wall_simple.active {
outline-style:none;
height:62px;
}
.wallv2 .wall_simple_cmd {
position:relative;
}
.wallv2 .wall_simple_cmd.unactive {
display:none;
}
.wallv2 .wall_simple_cmd.active {
margin:13px 0px;
}
.wallv2 .btn_wall_simple {
position:absolute;
right:40%;
font-size:1.7em;
background:#004ab3;
color:white;
border-radius:25px;
padding:0px 7px;
display:inline-block;
/*float:right;*/
cursor:pointer;
text-transform:capitalize;
}
.wallv2 .top > .toplrc {
line-height:30px;
}
/*.wallv2 */.btn_sh.hide { font-size:2.5em; }
.wallv2 .toplrc .topl {
float:left;
}
.wallv2 .toplrc .topr, .wallv2 .toplrc .topr > div {
float:right;
}
.wallv2 .toplrc .topc {
text-align:center;
width:30px;
margin:0px auto;
}
.wallv2_unactive {
display:none;
}
.wallv2_show {
/*width:100%;
min-width:340px;
max-width:740px;
margin:0px auto;*/
position:relative;
height:21px;
}
.wallv2_show .btn_sh {
display:inline-block;
position:absolute;
left:200px;
}
.wallv2 .post {
background:white;
border-radius: 9px;
box-shadow: 0px 0px 3px 1px lightgrey;
z-index:2;
}
.wallv2 .post .content {
margin:7px 7px;
/*font-family: system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;*/
word-break: break-word;
color: #1c1e21;
padding-left: 5%;
padding-right: 5%;
/* Quick fix for font-family and emos problem with word-spacing. */
/* fixed with .lokkalEmoji patching */
/*word-spacing: -10px;
letter-spacing: 0px;*/
/*font-family:system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", Times, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort,system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif, 'Montserrat';*/
}
.wallv2 .post .content img { width:100%; }
/*class="_1579 img"*/
.wallv2 .post .content img._1579 { width:0px;height:0px; }
.wallv2 .post .img_fullscreen {
width:100%;
}
.wallv2 .post img.postImage, .wall_editable img.postImage { /* center all images . for wall and iframe are located in pages/wall2_editor.. */
display: block;
margin: 0px auto;
}
.wallv2 .post .img_big, .wall_editable .img_big {
width:100%;
max-width:800px;
}
.wallv2 .post .img_medium, .wall_editable .img_medium {
width:100%;
max-width:400px;
}
.wallv2 .post .img_small, .wall_editable .img_small {
width:100%;
max-width:340px; /**/
}
.fieldContent .post_tags {
margin:0px 0px 0px 7px;
}
.fieldContent .post_tags {
/*line-height:22px;*/
}
/* another style for event tags in page_events. */
body.wall .post_tags a, .fieldContent .post_tags a, #post_tags > div {
margin: 0px 0px 0px 0px;
cursor: pointer;
/*float: left;*/
display:inline-block;
background-color: transparent;
color: #53b8ce;
border-radius: 66px;
padding: 2px 8px 2px 0px;
font-size: 0.78em;
font-weight:900;
position: relative;
text-decoration:none;
}
.fieldContent .post_tags a.show {
display:none;
}
.fieldContent .post .postFiles {
padding:11px 0px;
}
.fieldContent .post_date {
font-size: 0.7em;
color: #93cb4e;
margin:7px 7px 1px 7px;
}
.fieldContent .optBottom {
padding: 0px;
height:40px;
}
.fieldContent .optBottom > .postMore,
.fieldContent .optBottom > div > button {
position:relative;
float:left;
margin:0px 3px;
width:32px;
height:32px;
background-repeat:no-repeat;
background-position:center;
border:none;
outline:none;
background-color:transparent;
}
/*-- like icon */
.fieldContent .optBottom .postMore {
margin:0px 3px;
}
.fieldContent .optBottom .postMore > button {
width: 100%;
height: 100%;
background-color: transparent;
border: none;
outline: none;
position:relative;
}
.fieldContent .optBottom .postMore > button:before {
content: "...";
font-size: 2em;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 34px;
height: 34px;
}
/**/
.fieldContent .optBottom .postLike {
background-size:24px 24px;
}
.fieldContent .optBottom .postLike.active { /*liked*/
background-image:url(/templates/template_mobile_1/img/like-yellow.png);
}
.fieldContent .optBottom .postLike.unactive { /*unliked*/
background-image:url(/templates/template_mobile_1/img/like-blue.png);
}
.fieldContent .optBottom .postLike > div {
position:absolute;
bottom:0px;
right:0px;
font-size:0.7em;
background:red;
color:white;
border-radius:45px;
padding:0px 3px;
}
/*-- comment icon */
.fieldContent .optBottom .postComment {
background-size:19px 19px;
}
.fieldContent .optBottom .postComment.active { /* contain comments*/
background-image:url(/templates/template_mobile_1/img/comment-yellow.png);
}
.fieldContent .optBottom .postComment.unactive { /* no comments */
background-image:url(/templates/template_mobile_1/img/comment-blue.png);
}
.fieldContent .optBottom .postComment > div {
position:absolute;
bottom:0px;
right:0px;
font-size:0.7em;
background:red;
color:white;
border-radius:45px;
padding:0px 3px;
}
.fieldContent .post .lc .lf {
font-size:0.73em;
margin: 0px 0px 13px 0px;
}
.fieldContent .post .lc .lf.liked {
position:relative;
padding:2px 0px 0px 23px;
}
.fieldContent .post .lc .lf.liked:before {
position:absolute;
left:0px;
top:0px;
vertical-align:baseline;
content:"";
background-image:url('/img/LIKE-BUTTON.png');
background-position:center;
background-size:21px 21px;
width:21px;
height:21px;
}
.fieldContent .optTop > div.datetime {
font-size:0.73em;
color:gray;
display:inline-block;
}
.wallv2 .row {
margin:22px auto 0px auto;
}
.wallv2 .row:after {content: "";display: table;clear: both;}
.DropDownMenuXXX {
position:relative;
}
/**/
body.photos_user .DropDownMenuXXX:not(.buttonFS) > .button {
font-size:3em;
}
body.photos_user .DropDownMenuXXX:not(.buttonFS) > .button.afterdots:after {
background: white;
padding: 0px 0px 11px 0px;
border-bottom-left-radius: 33px;
box-shadow: 0px 0px 1px 0px grey;
border-bottom-right-radius: 33px;
top: 9px;
left: -9px;
}
body.photos_user .DropDownMenuXXX:not(.buttonFS) > .menu.active {
top:13px;
}
/** postOptions BUTTON */
.DropDownMenuXXX:not(.buttonFS):not(.postMore) > .button {
font-size:2em;
cursor:pointer;
border:none;
outline:none;
background-color:transparent;
width:100%;
/**/
position: absolute;
top: 0px;
left: 0px;
transform: translate(-50%,-50%);
margin: -15% -70%;
}
.DropDownMenuXXX:not(.buttonFS) > .button.img48w > img {width: 65px;height: 25px;object-fit: cover;border: solid 1px grey; padding: 2px 0px}
.DropDownMenuXXX:not(.buttonFS) > .button.img26w > img { width: 21px;height: auto;padding-top: 4px;}
.DropDownMenuXXX > .button.afterdots {
position:relative;
content:"";
font-size:2em;
}
.DropDownMenuXXX > .button.afterdots:after {
position: absolute;
content: "...";
width: 30px;
height: 13px;
line-height:0;
right:3px;
top: 50%;
z-index: 2;
transform: translate(3px,-50%);
}
.DropDownMenuXXX > .button.white { color:white;}
.DropDownMenuXXX > .button.black { color:black;}
.DropDownMenuXXX > .button.gray { color:gray;}
body:not(.mobile) .DropDownMenuXXX > .button.active {
color:yellow;
}
body.mobile .DropDownMenuXXX > .button.active {
color:#3e9041;
}
.DropDownMenuXXX > .button:hover {
text-decoration:underline;
}
/** postOptions MENU */
.DropDownMenuXXX > .menu,
.DropDownMenuXXX .menuChild,
.DropDownMenuXXX .menuChild {
display:none;
background:white;
border:solid 1px lightgray;
border-radius:3px;
padding:3px 6px;
z-index:998;
}
.DropDownMenuXXX > .menu.active {
position: absolute!important;
display:block;
top:33px;
/*Fix for android A70 and strange resolutions */
min-width: 60vw;
max-width: 262px;
}
.DropDownMenuXXX .menuChild.active:not(.dn) {
display:inline-block;
}
.DropDownMenuXXX > .menu.left.active { left:0px; }
.DropDownMenuXXX > .menu.right.active { right:0px; }
.DropDownMenuXXX > .menu.left {}
.DropDownMenuXXX > .menu.right {}
.DropDownMenuXXX > .menu.center {
/*top: 37px;
left: 50%;
transform: translate(-50%,0px);
z-index: 1000;*/
}
.DropDownMenuXXX > .menu > div,
.DropDownMenuXXX > .menu > a {
border-bottom:solid 1px lightgray;
color:black;
background:white;
cursor:pointer;
line-height:normal;
padding:8px 13px;
}
.DropDownMenuXXX > .menu > div > div {
/*white-space:nowrap; NOT GOOD ON Android A70*/
}
.DropDownMenuXXX > .menu > div.withRightOption,
.DropDownMenuXXX > .menu > div.withCoverOption {
position:relative;
}
.DropDownMenuXXX > .menu > div.withRightOption > div:nth-child(1) {
right: 0px;
top: 50%;
transform: translate(-2px,-50%);
position:absolute;
}
.DropDownMenuXXX > .menu > div.withCoverOption > div:nth-child(1) {
right: 0px;
top: 0px;
left:0px;
bottom:0px;
position:absolute;
}
.DropDownMenuXXX > .menu > div.withCoverOption > div:nth-child(1) > select {
background:transparent;
width:100%;
height:100%;
color:transparent;
border:none !important;
box-shadow:none !important;
}
.DropDownMenuXXX > .menu > div.withCoverOption > div:nth-child(1) > select option {
color:black;
}
.DropDownMenuXXX > .menu > div:not(.withRightOption):not(.withCoverOption) > div:nth-child(1),
.DropDownMenuXXX > .menu > div:not(.withCoverOption):not(.withRightOption) > div:nth-child(1),
.DropDownMenuXXX > .menu > div.withRightOption > div:nth-child(2),
.DropDownMenuXXX > .menu > div.withCoverOption > div:nth-child(2) {
font-size:1em;
}
.DropDownMenuXXX > .menu > div:not(.withRightOption):not(.withCoverOption) > div:nth-child(2),
.DropDownMenuXXX > .menu > div:not(.withCoverOption):not(.withRightOption) > div:nth-child(2),
.DropDownMenuXXX > .menu > div.withRightOption > div:nth-child(3),
.DropDownMenuXXX > .menu > div.withCoverOption > div:nth-child(3) {
font-size:0.7em;
color:lightgray;
}
/**/
.bqSlideCheckbox {}
.bqSlideCheckbox > ul {
padding:0px;
margin:0px;
}
.bqSlideCheckbox ul {
list-style:none;
}
.bqSlideCheckbox li {
line-height: 20px;
padding:4px 0px;
margin:1px 1px;
}
.bqSlideCheckbox li > input[class='chk'] {
float:left;
}
.bqSlideCheckbox li > textarea[class='sel'] {
display:none;
padding: 0px;
margin: 0px;
width: 100%;
height: 60px;
border: solid 1px lightgray;
border-radius: 9px;
}
.bqSlideCheckbox li > ul {
display:none;
}
.bqSlideCheckbox li > input[class='chk']:checked + ul {
display:block;
}
.bqSlideCheckbox li > input[class='sel']:checked + textarea[class='sel'] {
display:block;
}
.bqSlideCheckbox li input.sel {
margin:0px 9px 0px 0px;
}
/* EMOJI */
.emosxxxbutton {
position:relative;
width:21px;
height:21px;
display:inline-block;
}
.emosxxxbutton:before {
position:absolute;
content:"\263A";
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.emosxxxemoji {
}
.emosxxxouter {
background:white;
margin: 0px 0px 7px 0px;
box-shadow: 0px 2px 2px 1px grey;
background: white;
border-top-left-radius: 25px;
border-bottom-left-radius: 14px;
padding: 7px 0px 7px 12px;
margin: 0px 4px 7px 0px;
}
.emosxxx {
width:233px;
height:233px;
overflow:auto;
}
.emosxxx > div:nth-child(2) {
display:none;
}
.emosxxx > div:nth-child(2).active {
display:block;
}
.emosxxx > div > div {
/*border-bottom:solid 1px gray;*/
}
.emosxxx > div > div > .title { cursor:pointer; font-size:0.83em; font-weight:200; padding:8px 0px; }
.emosxxx > div > div > .emoji { display:none; }
.emosxxx > div > div > .emoji:after {content: "";display: table;clear: both;}
.emosxxx .emo {
padding:2px;
cursor:pointer;
float:left;
font-size:2em;
width: 32px;
height: 32px;
/* nice colored emoji but they fuck other lettes. (got patch for this to move emo in it own html block)
* "Noto Color Emoji",*/
font-family: "Apple Color Emoji", "Segoe UI Emoji", Times, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort,system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
}
.photo_field .emosxxxemoji {
position: fixed;
bottom: 80px;
right: 50px;
z-index: 1;
}
.wallv2 .emosxxxemoji { /*.*/
position: absolute;
bottom: 30px;
right: 0px;
z-index: 1;
}
.photo_field .emosxxxemoji .emosxxx {
border-top-left-radius: 21px;
border-top-right-radius: 21px;
padding: 9px 3px 0px 3px;
box-shadow: 0px 0px 2px 0px grey;
border-top: solid 1px gray;
}
/*POPUP*/
.PopupField {
/*padding:7px 4px;*/
}
body > .Popup { /* outer div */
position:fixed;
}
.PopupContent {
color:black;
position:relative;
font-family: Montserrat;
}
.PopupTop {
text-align: center;
background-image: url(img/gradient1.png);
min-height: 35px;
position:relative;
margin:8px;
border-radius:9px;
}
.PopupTitle {
color: #4a2a2a;
margin: 0px;
text-align: center;
font-weight: bolder;
vertical-align: middle;
padding: 3px;
margin: 3px 3px 3px 26px;
display:block;
}
.PopupTitle:first-letter {
text-transform:capitalize;
}
#PopupTitle h3 {
color:#250D09;
padding:5px;
margin:0px;
text-align:center;
}
#PopupTitleRight {
color:#0A4682;
font-weight:900;
}
.PopupRightContent {}
/*.PopupRightContent.PopupRightEnabled { float:left;width:30%; }*/
.PopupLeftContent {
color: #736f6f;
}
/*.PopupLeftContent.PopupRightEnabled {width:70%;display:inline-block;}*/
#PopupContent {
width:100%;
}
.PopupBtn {
color:white;
}
.PopupBtn.PopupClose {
font-size:0.75em;
background: rgba(204, 154, 129, 0);
padding: 3px 6px;
position:absolute;
left: 7px;
top: 50%;
transform: translate(0px,-50%);
z-index:2;
border-radius:33px;
box-shadow: 0px 0px 2px 1px grey;
border:none;
outline:none;
}
/* SIDE POPUP */
.PopupSide {
border:solid 2px red;
border-radius:25px;
padding:13px 7px;
background:white;
min-width:133px;
min-height:66px;
}
.PopupSide.click {
cursor:pointer;
}
#form_login input {
width: 215px;
}
#form_register input {
width: 215px;
}
.sep{
margin-top: 20px;
}
/* colorpicker. Translates should be set like:
* .sp-picker-container button.sp-choose:before { content:"Elije;?>"; }
* .sp-picker-container a.sp-cancel:before { content:"Cancelar"; }
* */
.sp-picker-container button.sp-choose { float:right; }
.sp-picker-container a.sp-cancel { float:left; }
.sp-picker-container button.sp-choose,
.sp-picker-container a.sp-cancel {
margin:0px 3px;
visibility:hidden;
color:black;
font-weight:bolder;
background:lightgray;
border:solid 1px gray;
box-shadow:0px 0px 2px 1px gray;
display:inline-block;
}
.sp-picker-container button.sp-choose:before,
.sp-picker-container a.sp-cancel:before {
background: lightgray;
border: solid 1px gray;
box-shadow: 0px 0px 2px 1px gray;
padding: 1px 3px;
visibility:visible;
position:absolute;
}
/* if keyboard is open, page chat hide top header and maximize chat window */
body.chat.KIO > div.header { display:none !important; }
body.chat.KIO #chat_fixed_field { top:0px !important; }
body.chat.KIO .chat_windows > .chat_windows_back { display:none !important; }
body.chat.KIO .chat_windows > .title { display:none !important; }
body.chat.KIO .chat_windows > .content { top:0px !important; }
/* if keyboard is open hide bottom nav bar */
body.KIO > div.nav {
display:none;
}
/* hide navigation bar if chat friend window is open (overwrite above rule that hide nav if keyboard..) */
body.c_f_o .nav {
overflow: hidden;
max-height: 0px;
display: block;
}
/* (bug on android) if friend window is open, hide chat options: friends, pages. */
body.c_f_o .chat_place_options {
max-height: 0;
overflow: hidden;
}
.chat_place_options {
height:30px;
line-height:30px;
}
/* style for chat that should be loaded before chat itself. */
body:not(.chat_FL_active) .chat_place_options {
display:none;
}
.chat_place_options .chat_place {
font-weight:100;
}
.chat_place_options .chat_place.active {
font-weight:900;
}
.chat_place_options .chat_place.friend,
.chat_place_options .chat_place.page {
float:left;
width:50%;
box-sizing:border-box;
text-align:center;
position:relative;
}
.chat_place_options .chat_place .chat_place_notify {
position: absolute;
right: 6px;
top: 0px;
}
.chat_place_options #cpn_notseen_page > div:not(.active) {
display:none;
}
.chat_place_options #cpn_notseen_page > div.active {
background: red;
display: inline;
border-radius: 66px;
padding: 1px 4px;
color: white;
font-weight: 900;
font-size: 0.7em;
}
/**/
iframe.embedediframevideo {
width:100%;
}
video.postVideo {
display:block;
width:100%;
max-height:720px;
margin:0px auto;
}
video.postVideo.wB {
width:100%;
height:56%;
}
video.postVideo.hB {
width:56%;
height:100%;
}
/*. 8.9.22, effect_blueHighlight */
#effect_blueHighlight {
position:relative;
transition: all 3s;
}
#effect_blueHighlight:before {
transition: all 3s;
/**/
content:"";
z-index:2;
position:absolute;
top:-13px;
left:0px;
right:0px;
bottom:-13px;
/**/
background:lightblue;
opacity:0;
border-radius:13px;
}
.affect_blueHighlight:before {
transition: all 3s;
opacity:0.8 !important;
}
/* ( TEMPOLARY HIDE REPORT BUTTONS ) */
.pageReport, .postReport, .eventReport, .profileReport { /*display:none;*/ }
/*iphone5*/
@media screen and (min-device-width: 319px) and (max-device-width: 360px) { /* Normal android devices */
.header .center > div > div a {
font-size:1em;
}
#search #search_title,
#search3 #search_title {
font-size:1em;
height: unset;
}
}
@media screen and (min-device-width: 361px) and (max-device-width: 412px) { /* Android A70 and similar */
.header .center > div > div a {
font-size:0.8em;
}
.nav .iniciar {
}
.nav .iniciar > a {
font-size:0.9em;
}
.emosxxx .emo {
width:48px;
height:48px;
}
}
@media screen and (min-device-width: 413px) and (max-device-width: 640px) {
.nav .eye > a > div {
width:50px;
height:35px;
background-size: 50px 38px;
}
.nav .calendar > a > div {
width:35px;
height:35px;
background-size: 35px 33px;
}
.nav .notification > a > div {
width:35px;
height:35px;
background-size: 35px 33px;
}
}
/**/