Style_en_Instagram(prowebplus.blog.ir).css
/*Designed By Prowebplus.blog.ir*/
@import url('https://fonts.googleapis.com/css2?family=Balsamiq+Sans&display=swap');
@font-face {
font-family: 'tanha';
src: url('//bayanbox.ir/download/6569803721922940607/Tanha.woff') format('woff');
font-weight: normal;
}
@font-face {
font-family: 'estedad';
font-style:normal;
font-weight:400;
src: url('//bayanbox.ir/download/3394188548996175807/Estedad-Light.woff') format('woff');
}
@font-face {
font-family: 'estedad';
font-style:normal;
font-weight:bold;
src: url('//bayanbox.ir/download/5964064727761107919/Estedad-Bold.woff') format('woff');
}
*{font-family:'Balsamiq Sans','estedad','tanha';}
::-webkit-scrollbar {
width: 12px;
height: 12px;
}
::-webkit-scrollbar-button {
width: 0px;
height: 0px;
}
::-webkit-scrollbar-thumb {
background: #010204;
border: 2px solid #fffcfc;
}
::-webkit-scrollbar-track {
background: #ffffff;
border: 1px dotted #ffffff;
}
textarea, input, select{font-family: 'Balsamiq Sans','estedad','tanha'!important;}
:root {
font-size: 10px;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
*:focus {
outline: 0;
}
a{
color: #0061ae;
}
a:hover{color:#bc0000;}
p,font,span,div{color:#000;}
a,a:hover,a:before,a:after,a:active,a:visited,a:focus{
text-decoration:none;
}
audio,video{max-width:100%;}
pre{text-align:left;}
ul{
margin:0;
padding:0;
}
h1,h2,h3,h4,h5,h6{
font-family: estedad;
}
body {
font-family: tanha;
color: #262626;
background: #ffffff;
font-size: 16px;
height: 100vh;
transform-style: preserve-3d;
perspective: 600px;
}
img {
max-width:100%;
height:auto;
}
.container {
max-width: 99%;
margin: 2em auto;
padding: 0px 1rem;
}
.btn {
display: inline-block;
font: inherit;
background: none;
border: none;
color: inherit;
padding: 0;
cursor: pointer;
}
.btn:focus {
outline: 0.5rem auto #4d90fe;
}
.maintainbox{
width: 62.66666%;
display:inline-block;
float:left;
}
.gallery-item-info a{color:#fff;z-index: 2;position: relative;}
.visually-hidden {
position: absolute !important;
height: 1px;
width: 1px;
color: #fff;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
/* Profile Section */
.item_err,.item_warn,.item_success {
display: inline-block;
}
.fa-check{
border-radius:10px;
color:#fff;
background: #2196F3;
border:1px inset #ccc;
padding:3px;
text-shadow:1px 1px 1px #333;
}
/* Gallery Section */
.gallery {
padding-bottom: 3rem;
}
.tag-cloud h3 {
margin: 0px;
font: normal 11px tanha;
display: inline-block;
*
display: inline;
*
margin: 2px;
}
.tag-cloud span {
display: inline-block;
margin: 1px 0px 1px 0px;
}
.tag-cloud a {
font-family: 'Balsamiq Sans','estedad','tanha';
color: #000;
background: rgb(249 249 249 / 0%);
padding: 3px 7px;
display: inline-block;
*
display: inline-block;
margin-left: 1px;
/*margin: 2px 0px 2px 0px;*/
}
.tag-cloud a:hover {
color: #03A9F4;
font-weight: 900;
}
.tag-cloud a.selected {
color: #216cf3;
font-weight: 900;
}
.box-tags .post-tags h3{margin: 10px 5px;display: inline-block;}
.box-tags .post-tags h3 a{ color: #0064b3;transition:0.4s ease-in-out;}
.box-tags .post-tags h3 a:hover{color:#008;transition:0.4s ease-in-out;}
.gallery-item {
margin: 1rem!important;
margin-top: 0!important;
}
.more-desk{
background: #dadada;
}
.more-desk .content-part{
text-align:justify;
line-height:1.7;
margin:10px 0px;
word-break: break-word;
padding: 15px 15px;
outline: none;
cursor: default;
}
.more-desk .post_de{padding: 2px 15px;width: 100%;display: block;text-align: left;direction: ltr;}
.post_details_more{
padding: 2px 0pc;
font-size: 14px;
vertical-align: super;
}
.more-desk .content-part a h2{color:#000;margin-bottom: 0;}
.more-desk .content-part a{color:blue;}
.more-desk .content-part a:hover{color:red;}
.gallery-item:hover .gallery-item-info,
.gallery-item:focus .gallery-item-info {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
width: 100%;
border-radius:9px;
height: 100%;
background-color: #0000004d;
}
.gallery-item-info {
display: none;
direction: ltr;
}
.gallery-item-info a.post-link{z-index: 0;width:100%;height:100%;position:absolute;}
.gallery-item-comments{z-index:2}
.gallery-item-info li {
display: inline-block;
font-size: 2rem;
font-weight: 600;
}
.gallery-item-likes {
margin-right: 2.2rem;
z-index: 2;
}
.gallery-item-type {
position: absolute;
top: 1rem;
right: 1rem;
font-size: 2.5rem;
text-shadow: 0.2rem 0.2rem 0.2rem rgba(0, 0, 0, 0.1);
}
.fa-envelope-o{
color:#000;
transition: all 1s ease;
}
.fa-comment-o:before {
color: #ffffff;
transition: all 1s ease;
}
.fa-envelope-o:hover:before {
content:"\f0e0";
color:#292929;
transition: all 1s ease;
}
.fa-envelope-o:after{
transition: all 1s ease;
}
.fa-clone,
.fa-comment {
transform: rotateY(180deg);
}
.rate-counter{font-family: 'Balsamiq Sans','estedad','tanha';font-weight:600;color: #000;}
.more-desk .rate-counter{color:#000;}
.gallery-image {
width: 100%;
height: 100%;
border-radius: 5px 5px 0 0;
}
.view-port{}
.comment-port{
width:100%;
display:inline-block;
float:left;
display:inline-block;
border-radius: 5px;
margin-bottom: 1px;
}
.more-desk .rate-box{padding: 9px 16px;margin-bottom: 0px;margin-top: -35px;text-align: right;display: block;font-size: 9px;}
.fa-heart-o{color: #fff;}
.rate-box .fa-heart-o:before {
color: #ff0000;
transition: all .4s ease;
}
.more-desk .rate-box .fa-heart-o:before {
color: #ff0000;
text-shadow:1px 1px 1px #000;
transition: all .4s ease;
}
.rate-box:hover .fa-heart-o:before {
content:"\f004";
}
.rate-box.rated .fa-heart-o:before {
content:"\f004";
color:#ff0000;
}
.fa-comment-o:before {
color: #000;
transition: all .4s ease;
}
.fa-comment-o:hover:before {
content:"\f075";
transition: all .4s ease;
}
.messages h2 {
color: #222;
font-size: 21px;
padding-right:5px;
cursor: default;
background: #c5c5c5;
margin: 0 0 7px;
text-align: center;
}
.messages h2 a.comment_count {
color: #333;
}
.messages h2 a.comment_count:hover {
color: #000;
cursor: pointer;
}
.view-port .align .messages{text-align:center;direction: ltr;}
/*COMMENT --------------------------------------------- */
.post_comments{
}
.cmt_break{
margin-bottom:10px;
}
.post_comments .title_cmt{
height:20px;
width:100%;
}
.post_comments .body_cmt{
height:auto;
line-height:1.9em; /*new*/
padding-top:5px;
padding-bottom:8px;
background:#383838;
border:1px solid #666;
border-top:none;
border-radius:0px 0px 4px 4px;-moz-border-radius:0px 0px 4px 4px;-webkit-border-radius:0px 0px 4px 4px;
}
.post_comments .body_cmt .cnt{
color:#ccc;
}
.post_comments .body_cmt .cnt .cnt_l{
display:inline-block;
margin-right:-70px;
vertical-align:top;
}
.post_comments .body_cmt .cnt .cnt_r{
display:inline-block;
margin-right:-70px;
min-width:50px;
height:auto;
float:right;
}
.post_comments .body_cmt .cnt .cnt_r img{
width:30px;
height:auto;
}
.post_comments .body_cmt .cnt a{
color:#ccc;
}
.post_comments .body_cmt .cnt a:hover{
color:#fff;
}
.post_comments .body_cmt .cnt{
padding:0 80px 0 20px;
}
.post_comments .body_cmt .cnt ul{
margin-top:-4px;
}
.post_comments .body_cmt .cnt ul li{
margin-right:5px;
line-height:1.9em; /*new*/
}
/*-- Comment Details --*/
.post-comments {
font: 14px "tanha","estedad";
}
.post-comment {
margin-bottom: 0px;
border-radius: 5px;
}
.comment-details {
padding: 0;
cursor: default;
padding-bottom: 5px;
}
.comment-details a {
color: #040404;
cursor: pointer;
margin-right: 0px;
vertical-align: super;
-moz-transition-duration: .0s;
-webkit-transition-duration: .0s;
-o-transition-duration: .0s;
-khtml-transition-duration: .0s;
padding: 1px 5px;
border-radius: 7px;
}
.comment-details a:hover{color:#03a9f4}
.comment-details-left {
padding: 4px 0 0 5px;
float: left;
}
.comment-avatar img {
width: 50px;
height: auto;
border-radius: 100%;
display: inline-block;
}
.comment-name {
color: #000;
cursor: default;
vertical-align: sub;
padding: 0px 5px;
}
.comment-body {
padding: 10px;
background: #333;
display: block;
border-radius: 18px 9px 18px 18px;
margin: auto;
width: 90%;
}
.comment-body-content div,.comment-body-content span,.comment-body-content p,.comment-body-content {
color: #ccc;
word-break: break-word;
}
.comment-date {
color: #000;
display: block;
text-align: left;
font-size: 10px;
float: left;
}
.comment-date span{
background: #b5b5b5;
padding: 2px 8px;
border: 1px solid #272727;
border-radius: 7px;
}
.comment-website {
background: url(//cdn.bayan.ir/blog/templates/41199/details_ico_cmt.png) center -102px no-repeat;
width: 18px;
height: 23px;
display: inline-block;
}
.comment-website:hover {
background-position: center -125px;
cursor: pointer;
}
.comment-email {
background: url(//cdn.bayan.ir/blog/templates/41199/details_ico_cmt.png) center -60px no-repeat;
width: 18px;
height: 23px;
display: inline-block;
}
.comment-email:hover {
background-position: center -79px;
cursor: pointer;
}
/*-- Reply --*/
.reply-align{text-align:left;}
.comment-reply {
margin: 14px 23px 35px 0px;
}
.comment-reply .comment-reply-details{
padding: 0;
padding-bottom: 5px;
}
.comment-reply .comment-name{margin-bottom: 0px;display: inline-block;}
.comment-reply .comment-name span{color: #000;padding: 2px 7px;border-radius: 7px;}
.comment-reply-details {
padding: 5px 10px 0;
}
.comment-reply-date {
color: #000;
margin-left: 1px;
font-size: 10px;
margin-bottom: 5px;
}
.comment-reply-date span{
background: #888;
padding: 2px 8px;
border: 1px solid #6d6d6d;
border-radius: 7px;
}
.comment-reply-date .left-date{text-align: right;display: inline-block;margin-bottom: 7px;}
.comment-reply-date .reply-name{text-align: left;border:0px;font-size:14px;background: none;float: left;direction: ltr;}
.comment-reply-name {
color: #31ace0;
cursor: default;
}
.comment-reply-body {
color: #000000;
padding: 10px;
word-break: break-word;
text-align: right;
background: #bbb;
margin-bottom: 0px;
margin-top: 0px;
border: 1px solid #ffffff;
box-shadow: 0 3px 5px rgba(117, 100, 100, 0.1);
border-radius: 20px 20px 20px 20px;
display: block;
width: 90%;
margin: auto;
}
.comment_add_form{
color:#CCC;
}
div.commentForm input.sendbutton{
padding:5px 15px 6px 15px;
float: right;
background: #777;
color: #000;
display: block;
font-family: 'Balsamiq Sans','estedad','tanha';
cursor:pointer;
border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
}
div.commentForm input.sendbutton:hover{
background: #666;
}
.comment_add_form{
font-family: 'Balsamiq Sans','estedad','tanha';
background: #c0c0c0;
border-bottom:1px solid #5f5f5f;
border-radius:4px;
font-size: 14px;
padding: 15px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
}
.comment_add_form div.inputFix input.text {
font-family: 'Balsamiq Sans','estedad','tanha'!important;
}
.comment-add-form div.formField2 input.text,
select {
height: 25px;
width: 100%;
}
div.commentForm iframe {background:#FFF;}
/*DB Prowebplus.blog.ir*/
.pagination {
cursor: default;
display: inline-block;
margin: auto;
direction: ltr;
float: none;
text-align: center;
margin-bottom: 0;
font: 13px "tanha";
}
.pagination .left {
margin-left: -3px;
}
.pagination a {
padding: 10px 18px 10px;
margin-left: 3px;
cursor: pointer;
float: none;
margin-top:15px;
font-family:'Balsamiq Sans','estedad','tanha';
display: inline-block;
color: #ffffff;
border: #302f2f 1px solid;
background: #737272;
border-radius: 3px;
}
.pagination a:hover {
color: #000000;
border: #6d7375 1px solid;
background: #b5b5b5;
}
.pagination a.current {
color: #000000;
border: #6d7375 1px solid;
background: #b5b5b5;
}
.pagination .spacer {
padding: 1px 8px;
color: #999;
}
.pagination {
padding-top: 3em;
}
.pagination .pagesList{display:inline-block;}
footer{
display:inline-block;
direction: ltr;
padding: 0px 10px;
text-align: center;
width:100%;
margin:0px;
}
footer a{font-weight: 900;transition:0.3s ease-in-out;cursor:pointer;color: #010204;}
footer a:hover{color:#ff0000;transition:0.3s ease-in-out;}
footer .fa-heart{color: #ff0000;font-size: 18px;font-weight:900;text-shadow:1px 0.5px 0px #000;}
/* Media Query */
@media screen and (max-width: 40rem) {
.comment-port{background:none;box-shadow:none;}
.hideme{display:none;visibility:hidden;opacity:0;}
.more-desk{
width: 100%;
display:inline-block;
margin-right: 0px!important;
float:none;
}
.view-port{
width:100%;
position:unset;
}
.comment-port{
border:0px;
width:100%;
display:inline-block;
float:none;
margin-bottom: 8px;
height: 100%;
overflow: visible;
}
.maintainbox{
display:none;
visibility:hidden;
opacity:0;
}
}
/*Designed By Prowebplus.blog.ir*/
.gallery {
}
.gal-port{margin: auto;width: 75%;}
@media (max-width: 40rem) {
.gallery-item-info {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
width: 100%;
border-radius:9px;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
}
.item_err,.item_warn,.item_success {
display: inline-block;
}
}
/*Designed By Prowebplus.blog.ir*/
:root {
--color: #3c3163;
--transition-time: 0.5s;
}
.card-columns {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-gap: 0.25rem;
-moz-column-gap: 0.25rem;
column-gap: 0.25rem;
orphans: 1;
widows: 1;
direction: ltr;
}
.section-columns {
}
.card {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
}
.cardonhover{
height: 485px;
display:inline-block;
padding: 0px 10px 0px 10px;
margin-bottom: 1em;
}
.card {
height: 400px;
background-color: #000000;
font-size: 1.5em;
margin-top: 1em;
color: white;
display: inline-block;
margin-bottom: -32px;
width: 100%;
background-color: #ffff00;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ff8000'/%3E%3Cstop offset='1' stop-color='%23ff8000' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='1200' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300ff19'/%3E%3Cstop offset='1' stop-color='%2300ff19' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='c' cx='600' cy='0' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%239900ff'/%3E%3Cstop offset='1' stop-color='%239900ff' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='d' cx='600' cy='800' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ffff00'/%3E%3Cstop offset='1' stop-color='%23ffff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='0' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23FF0000'/%3E%3Cstop offset='1' stop-color='%23FF0000' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='f' cx='1200' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%230CF'/%3E%3Cstop offset='1' stop-color='%230CF' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' width='1200' height='800'/%3E%3Crect fill='url(%23c)' width='1200' height='800'/%3E%3Crect fill='url(%23d)' width='1200' height='800'/%3E%3Crect fill='url(%23e)' width='1200' height='800'/%3E%3Crect fill='url(%23f)' width='1200' height='800'/%3E%3C/svg%3E");
border-radius: 1em;
padding: 1em;
background-size: cover;
background-position: center;
box-shadow: 0 0 5px 0em black;
transition: all,1s;
position: relative;
overflow: hidden;
border: 10px solid #ccc;
text-decoration: none;
}
.hoverlink:hover{animation: 8s shake ease;animation-delay:2s;}
@keyframes shake{
0%{background-position:50% 50%;}
50%{background-position:100% 100%;}
75%{background-position:0% 0%;}
100%{background-position:50% 50%;}
}
.card .hoverlink{
position:absolute;
width: 100%;
right: 0;
top: 0;
height: 100%;
content: '';
z-index: 98;
background-size: cover;
background-position: center;
transition:.5s all;
}
a.hoverlink:before, a.hoverlink:after {
content: '';
transform: scale(1);
transform-origin: top left;
position: absolute;
left: 0%;
top: 0%;
z-index: 0;
transition: all, 1s;
transition-timing-function: ease-in-out;
}
a.hoverlink:after {
width: 100%;
z-index: 9999;
height: 100%;
background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.6) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.6) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.6) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#99000000',GradientType=0 );
}
.card:hover a.hoverlink:before,.card:hover a.hoverlink:after{
transform: scale(0);
border-radius:0% 0% 50% 0%;
}
.card h2 {
margin: 0 0 8px;
text-align: center;
font-size: 0.9em;
top: 1.5em;
font-weight: 100;
position: relative;
color: #ccc;
text-shadow: 1px 1px 1px #000;
z-index: 98;
padding: 15px 7px;
/* Fallback for older browsers */
line-height: normal;
}
.card p {
font-size: 0.75em;
font-family: 'Open Sans';
margin-top: 0.5em;
line-height: 2em;
}
.features {
z-index: 99;
width: 100vw;
text-align: center;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=90, Direction=0, Color=#000000)";/*IE 8*/
-moz-box-shadow: 0 0 90px 15px rgb(0,0,0) inset;/*FF 3.5+*/
-webkit-box-shadow: 0 0 90px 15px rgb(0,0,0) inset;/*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/
box-shadow: 0 0 90px 15px rgb(0,0,0) inset;/* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=90, Direction=135, Color=#000000); /*IE 5.5-7*/
height: 60px;
padding: 2em 0em 8px 0em;
border-radius: 0px 0px 20px 20px;
vertical-align: middle;
display: table-cell;
}
.features .fitems {
display: inline-block;
font-size: 1em;
font-weight: bold;
cursor: default;
background: #ffffff;
box-shadow: 1px 1px 5px 1px inset;
border: 1px solid #3c3c3c;
border-radius: 0.3rem;
padding: 8px 0.5em;
margin-right: 0.5em;
line-height: 1.5em;
transition: all, var(--transition-time);
}
.features .fitems a{
color:#000;
}
.card .date {
position: absolute;
top: 8px;
border-radius: 5px;
right: 8px;
font-size: 14px;
background: #fff;
padding: 1em;
z-index: 99;
opacity: .7;
cursor: default;
line-height: 0;
}
.card .author {
position: absolute;
top: 8px;
border-radius: 5px;
left: 4px;
margin-right: 99px;
font-size: 14px;
background: #fff;
padding: 5.4px;
cursor: default;
z-index: 99;
opacity: .7;
line-height: 17px;
}
.card:hover {
color: var(--color);
}
.card:hover:before, .card:hover:after {
transform: scale(1);
}
.card-grid-space .num {
font-size: 3em;
margin-bottom: 1.2rem;
margin-left: 1rem;
}
header .hcontainer {
max-width: 93.5rem;
margin: 0 auto;
direction: ltr;
padding: 0 2rem;
}
header .cbtn {
display: inline-block;
font: inherit;
background: none;
border: none;
color: inherit;
padding: 0;
cursor: pointer;
}
header .cbtn:focus {
outline: 0.5rem auto #4d90fe;
}
header .profile {
padding: 5rem 0;
}
header .profile::after {
content: "";
display: block;
clear: both;
}
header .profile-image {
float: left;
width: calc(33.333% - 1rem);
display: flex;
justify-content: center;
align-items: center;
margin-left: 3rem;
}
header .profile-image {
border-radius: 50%;
width: 150px;
height: 150px;
background-repeat: no-repeat;
background-size:cover;
background-position:center;
}
header .profile-user-settings,
header .profile-stats,
header .profile-bio {
float: left;
width: calc(66.666% - 2rem);
}
header .profile-user-settings {
margin-top: 1.1rem;
}
header .profile-user-name {
display: inline-block;
}
header .profile-user-name a{
color: #000;
font-size: 3.2rem;
}
header .profile-edit-btn {
font-size: 1.4rem;
line-height: 1.8;
border: 0.1rem solid #a9a9a9;
border-radius: 0.3rem;
padding: 0 2.4rem;
color: #fff;
background: #0490ff;
margin-left: 2rem;
}
header .profile-settings-btn {
font-size: 3rem;
margin-left: 1rem;
color: #0490ff;
text-shadow: 1px 1px 0px #666;
}
header .profile-settings-btn .fa-check-circle{vertical-align:super;}
header .profile-stats {
margin-top: 2.3rem;
}
header .profile-stats ul{padding:0px;line-height: 35px;}
header .profile-stats li {
display: inline-block;
font-size: 1.6rem;
line-height: 1.5;
margin-right: 4rem;
cursor: pointer;
}
header .profile-stats li:last-of-type {
margin-right: 0;
}
header .profile-bio {
font-size: 1.6rem;
font-weight: 400;
line-height: 1.5;
margin-top: 2.3rem;
}
header .profile-stat-count {
font-weight: 600;
}
header .menu_items_hashtags{line-height: 2.5;padding-right: 20px;display: inline-block;}
/* Media Query */
@media screen and (max-width: 40rem) {
header .profile {
display: flex;
flex-wrap: wrap;
padding: 4rem 0;
}
header .profile::after {
display: none;
}
header .profile-user-settings,
header .profile-bio,
header .profile-stats {
float: none;
width: auto;
}
header .profile-image {
width: 77px;
height: 77px;
}
header .profile-user-name a{font-size:14px}
header .profile-user-settings {
flex-basis: calc(100% - 10.7rem);
display: flex;
flex-wrap: wrap;
margin-top: 1rem;
}
header .profile-user-name {
font-size: 1.3rem;
margin-bottom: 0;
}
header .profile-edit-btn {
order: 1;
padding: 0;
text-align: center;
margin-top: 1rem;
}
header .profile-edit-btn {
margin-left: 0;
}
header .profile-bio {
font-size: 1.4rem;
margin-top: 1.5rem;
}
header .profile-edit-btn,
header .profile-bio,
header .profile-stats {
flex-basis: 100%;
}
header .profile-stats {
order: 1;
margin-top: 1.5rem;
}
header .profile-stats ul {
display: flex;
text-align: center;
padding: 1.2rem 0;
border-top: 0.1rem solid #dadada;
border-bottom: 0.1rem solid #dadada;
}
header .profile-stats li {
font-size: 1.4rem;
flex: 1;
margin: 0;
}
header .profile-stat-count {
display: block;
}
}
@supports (display: grid) {
header .profile {
display: grid;
grid-template-columns: 1fr 2fr;
grid-template-rows: repeat(3, auto);
grid-column-gap: 3rem;
align-items: center;
}
header .profile-image {
grid-row: 1 / -1;
}
header #stat_summary_div{display:contents!important;text-align: left;}
header .profile-user-settings,
header .profile-stats,
header .profile-bio {
width: auto;
margin: 0;
}
@media (max-width: 40rem) {
header .profile {
grid-template-columns: auto 1fr;
grid-row-gap: 1.5rem;
}
header .profile-image {
grid-row: 2 / 1;
}
header .profile-user-settings {
display: grid;
grid-template-columns: auto 1fr;
grid-gap: 1rem;
}
header .profile-edit-btn,
header .profile-stats,
header .profile-bio {
grid-column: 1 / -1;
}
header .profile-user-settings,
header .profile-edit-btn,
header .profile-settings-btn,
header .profile-bio,
header .profile-stats {
margin: 0;
}
}
}
span#value_VIEW_STAT_TOTAL,span#lang_VIEW_STAT_TOTAL,span#lang_HIT_STAT_TOTAL,span#value_HIT_STAT_TOTAL,span#lang_HIT_STAT_TODAY,span#value_HIT_STAT_TODAY,span#lang_VIEW_STAT_TODAY,span#value_VIEW_STAT_TODAY,span#lang_HIT_STAT_YESTERDAY,span#value_HIT_STAT_YESTERDAY,span#lang_VIEW_STAT_YESTERDAY,span#value_VIEW_STAT_YESTERDAY,span#lang_HIT_STAT_DAY_AVERAGE,span#value_HIT_STAT_DAY_AVERAGE,span#lang_VIEW_STAT_DAY_AVERAGE,span#value_VIEW_STAT_DAY_AVERAGE,span#lang_HIT_STAT_PREVISION,span#value_HIT_STAT_PREVISION,span#lang_VIEW_STAT_PREVISION,span#value_VIEW_STAT_PREVISION,span#lang_VIEW_STAT_COMMENTS_COUNT,span#value_VIEW_STAT_COMMENTS_COUNT,span#lang_VIEW_STAT_BLOG_LIFE_TIME,span#value_VIEW_STAT_BLOG_LIFE_TIME,span#lang_VIEW_STAT_ONLINE_USER,span#value_VIEW_STAT_ONLINE_USER{display:none;position:absolute}span#lang_VIEW_STAT_FOLLWING_COUNT,span#lang_VIEW_STAT_POSTS_COUNT,span#lang_VIEW_STAT_FOLLWER_COUNT{font-size:0}span#lang_VIEW_STAT_FOLLWING_COUNT:before{font-size:1.6rem;content:'Following '}span#lang_VIEW_STAT_FOLLWER_COUNT:before{font-size:1.6rem;content:'Followers '}span#lang_VIEW_STAT_POSTS_COUNT:before{font-size:1.6rem;content:'Posts '}
.storycontainer{display: block;text-align: left;white-space: nowrap;overflow-x: scroll;direction: ltr;}
.story {
width: 100px;
height: 100px;
margin: 0px 15px;
display: inline-block;
}
.story img {
width:70px;
border-radius:50%;
}
.story svg {
fill:none;
stroke:#8a3ab8;
stroke-width: 4px;
border-radius: 50%;
background-size: cover;
background-position: center;
stroke-dasharray: 0;
background-image: linear-gradient( 89.9deg, rgba(255,18,18,1) -2.8%, rgba(252,246,19,1) 50.8%, rgba(0,159,8,1) 107.9% );
}
.story svg:hover{animation: loading 3500ms ease-in-out infinite alternate;}
.story svg:active{animation: 8s shake linear;}
@keyframes loading {
100% {
stroke:#cd476b;
stroke-dasharray:10;
}
}
/* MEDIA QUERIES */
@media screen and (max-width: 1285px) {
.card-columns {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 2.25rem;
-moz-column-gap: 2.25rem;
column-gap: 2.25rem;
}
}
@media screen and (max-width: 900px) {
header .profile-settings-btn .fa-check-circle{vertical-align: top;font-size: 20px;}
.card-columns {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 8.25rem;
-moz-column-gap: 8.25rem;
column-gap: 2.25rem;
}
.info {
justify-content: center;
}
.card-grid-space .num {
/margin-left: 0;
/text-align: center;
}
}
@media screen and (max-width: 768px){
.gal-port{width: 100%;}
.card-columns {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
-webkit-column-gap: 2.25rem;
-moz-column-gap: 2.25rem;
column-gap: 2.25rem;
}
.card h2{bottom:2em;}
}
@media screen and (max-width: 500px) {
.card h2{bottom: 2em;}
}
@media screen and (max-width: 450px) {
.card h2{font-size: 0.6em;font-weight: 100;}
.card .date{font-size:0.6em;}
.info {
display: block;
text-align: center;
}
.info h1 {
margin: 0;
}
}