.side_notifier { position:fixed; display:inline-block; padding:10px 20px; width: auto; max-width:400px; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5); top:20%; right:0; z-index:10000; background-color:#fff; border:1px solid #ff715b; color: #ff715b; border-left-width:40px; -webkit-transform: translate3d(0%, 0, 0); -ms-transform: translate3d(0%, 0, 0); -o-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } .side_notifier.sw { right:20px; } .side_notifier::before { content: "\f06a"; font-family: "FontAwesome"; display: inline-block; position:absolute; top:calc(50% - 15px); left: -28px; font-size:20px; color: #FFF !important; } .side_notifier.alert { border-color:#F9D01F; color: #F9D01F; } .side_notifier.alert::before { content: "\f071"; } .side_notifier.success { border-color:#45cb85; color: #45cb85; } .side_notifier.success::before { content: "\f00c"; } .notifier { margin:auto; display:none } .notifier.warning { color:gold; } .notifier.success { background-color: #88ffd1; color:#0b2f01; } .upload_file img { max-width:100%; }

#emailUser { position:relative; } #emailUser input[type="text"]#findUsers.load { background:url(ajax_load.gif) 98% center no-repeat; transition:none; } #emailUser .userList { position:absolute; left:0; top:65px; width:100%; background:#eaeaea; box-shadow: 7px 0px 4px -4px #888, 0px 7px 7px -4px #888, -7px 0px 4px -4px #888; border-radius: 0px 0px 5px 5px; z-index:1; transition:none; padding:0; margin:0; } #emailUser .userList li, #emailUser .userList span { display:block; padding:4px 5%; border-bottom:1px solid #999; font-size:14px; color: #444; } #emailUser .userList li:last-child { border-bottom:none; } #emailUser .userList li:hover { background:#dadada; cursor:pointer; } #emailUser .userList li:active { background:#cacaca; } .reg.post_with_ajax .shortcodes { padding:10px 0px; } .reg.post_with_ajax .shortcodes i { font-style:normal; margin-right:10px; font-weight:700; } .reg.post_with_ajax .shortcodes i:last-child { margin-right:0; } .reg.post_with_ajax .hint { color:#f00; margin:2px 0; font-size:15px; }
 
.infotip { position:relative; } .infotip:before { content: attr(data-text); position:absolute; top:50%; transform:translateY(-50%); left:100%; margin-left:11px; width:180px; max-width:300px; display:inline-block; padding:10px; border-radius:10px; background:#000; color: #fff; text-align:center; opacity:0; transition:.30s opacity; display:none; z-index:1000; font-size:12px !important; font-weight:200 !important; } .infotip.ext:before { width:250px; } .infotip.left:before { left:initial; margin:initial; right:100%; margin-right:15px; } .infotip:after { content: ""; position:absolute; opacity:0; transition:.3s opacity; left:100%; margin-left:-5px; top:50%; transform:translateY(-50%); border:10px solid #000; border-color: transparent black transparent transparent; display:none; z-index:1000; } .infotip.top:before { top:-50%; left: 50%; transform: translate(-50%, -100%); margin-left: 0; } .infotip.top:after { left: 50%; top: -50%; transform: translate(-50%, -10%) rotate(-90deg); margin-left: 0; } .infotip:hover:before, .infotip:hover:after { display:block; opacity:1; } .infotip .quest { display: inline-block; background:#e8f2f9; padding:1px 5px; border-radius:50%; font-size: 9px; font-weight: 700; color: #000; } @media screen and (max-width: 800px) { .infotip:before { top:-50%; left: 50%; transform: translate(-50%, -100%); margin-left: 0; } .infotip:after { left: 50%; top: -50%; transform: translate(-50%, -10%) rotate(-90deg); margin-left: 0; } }

@media screen and (max-width: 440px) { .side_notifier { max-width:80%; } .side_notifier.sw { right:5px; } }