::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#f1f1f1;border-radius:0px}
::-webkit-scrollbar-thumb{background:#888;border-radius:0px}
::-webkit-scrollbar-thumb:hover{background:#555}
html {
overflow-x: hidden
overflow-x: hidden !important;
}
* {
}
body {
color:
margin: 0;
}
a, a:hover {
}
.icon {
width:
height:
stroke-width:
stroke:
fill: currentColor;
}
.wrapper {
width:
height:
min-height:
padding: 50px
padding-top:
display:
background-image: linear-gradient(-20deg, #ff2846 0%, #6944ff
display:
background: linear-gradient(-45deg, #EE7752, #E73C7E, #23A6D5,
background-size: 400%
-webkit-animation: Gradient 15s ease
-moz-animation: Gradient 15s ease
animation: Gradient 15s ease infinite;
}
@-webkit-keyframes Gradient {
background-position: 0%
}
}
50%
background-position: 100%
}
}
100%
background-position: 0%
}
}
@-moz-keyframes Gradient {
background-position: 0%
}
}
50%
background-position: 100%
}
}
100%
background-position: 0%
}
}
@keyframes Gradient {
background-position: 0%
}
}
50%
background-position: 100%
}
}
100%
background-position: 0%
}
}
@media screen and (max-width: 768px) {
min-height:
padding-top:
}
}
.profile-card {
min-height:
margin:
box-shadow: 0px 8px 60px -10px rgba(13, 28, 39, 0.6);
border-radius:
max-width:
position: relative;
}
.profile-card.active .profile-card__cnt {
}
.profile-card.active .profile-card-message,
.profile-card.active .profile-card__overlay {
pointer-events:
transition-delay: .1s;
}
.profile-card.active .profile-card-form {
transition-delay: .1s;
}
.profile-card__img {
height:
margin-left:
margin-right:
transform:
border-radius:
overflow:
position:
z-index:
box-shadow: 0px 5px 50px 0px #6c44fc, 0px 0px 0px 7px rgba(107, 74, 255, 0.5);
}
@media screen and (max-width: 576px) {
height:
}
}
.profile-card__img img {
width:
height:
object-fit:
border-radius: 100%;
}
.profile-card__cnt {
text-align:
padding: 0
padding-bottom:
transition: all .3s;
}
.profile-card__name {
font-size:
color:
margin-bottom: 15px;
}
.profile-card__txt {
font-weight:
color:
margin-bottom: 15px;
}
.profile-card__txt strong {
}
.profile-card-loc {
justify-content:
align-items:
font-size:
font-weight: 600;
}
.profile-card-loc__icon {
font-size:
margin-right: 10px;
}
.profile-card-inf {
justify-content:
flex-wrap:
align-items:
margin-top: 35px;
}
.profile-card-inf__item {
min-width: 150px;
}
@media screen and (max-width: 768px) {
min-width:
}
}
.profile-card-inf__title {
font-size:
color: #324e63;
}
.profile-card-inf__txt {
margin-top: 7px;
}
.profile-card-social {
display:
justify-content:
align-items:
flex-wrap: wrap;
}
.profile-card-social__item {
width:
height:
margin:
border-radius:
align-items:
justify-content:
color:
background:
box-shadow: 0px 7px 30px rgba(43, 98, 169, 0.5);
font-size:
flex-shrink:
transition: all .3s;
}
@media screen and (max-width: 768px) {
height:
margin:
}
}
@media screen and (min-width: 768px) {
}
.profile-card-social__item.facebook {
box-shadow: 0px 4px 30px rgba(43, 98, 169, 0.5);
}
.profile-card-social__item.twitter {
box-shadow: 0px 4px 30px rgba(19, 127, 212, 0.7);
}
.profile-card-social__item.instagram {
box-shadow: 0px 4px 30px rgba(120, 64, 190, 0.6);
}
.profile-card-social__item.behance {
box-shadow: 0px 4px 30px rgba(27, 86, 231, 0.7);
}
.profile-card-social__item.github {
box-shadow: 0px 4px 30px rgba(63, 65, 67, 0.6);
}
.profile-card-social__item.codepen {
box-shadow: 0px 4px 30px rgba(55, 75, 90, 0.6);
}
.profile-card-social__item.link {
box-shadow: 0px 4px 30px rgba(223, 45, 70, 0.6);
}
.profile-card-social .icon-font {
}
.profile-card-ctr {
justify-content:
align-items:
margin-top: 40px;
}
@media screen and (max-width: 576px) {
}
}
.profile-card__button {
border:
font-family: 'Quicksand',
font-weight:
font-size:
margin: 15px
padding: 15px
min-width:
border-radius:
min-height:
color:
cursor:
backface-visibility:
transition: all .3s;
}
@media screen and (max-width: 768px) {
margin: 15px
}
}
@media screen and (max-width: 576px) {
margin:
margin-bottom:
width:
max-width:
}
.
}
.profile-card__button:last-child {
}
}
.profile-card__button:focus {
}
@media screen and (min-width: 768px) {
}
}
.profile-card__button:first-child {
}
.profile-card__button:last-child {
}
.profile-card__button.button--blue {
box-shadow: 0px 4px 30px rgba(19, 127, 212, 0.4);
}
.profile-card__button.button--blue:hover {
}
.profile-card__button.button--orange {
box-shadow: 0px 4px 30px rgba(223, 45, 70, 0.35);
}
.profile-card__button.button--orange:hover {
}
.profile-card__button.button--gray {
background:
color: #142029;
}
.profile-card-message {
height:
position:
top:
left:
padding-top:
padding-bottom:
opacity:
pointer-events:
transition: all .3s;
}
.profile-card-form {
margin-left:
margin-right:
height:
background:
border-radius:
padding:
transform: scale(0.8);
z-index:
transition: all .3s;
}
@media screen and (max-width: 768px) {
height:
}
}
@media screen and (max-width: 576px) {
}
}
.profile-card-form__bottom {
display: flex;
}
@media screen and (max-width: 576px) {
}
}
.profile-card textarea {
resize:
height:
margin-bottom:
border: 2px solid
border-radius:
padding: 15px
color:
font-weight:
font-family: 'Quicksand',
outline:
transition: all .3s;
}
.profile-card textarea:focus {
border-color: #8a979e;
}
.profile-card__overlay {
height:
position:
top:
left:
pointer-events:
opacity:
background: rgba(22, 33, 72, 0.35);
transition: all .3s;
}
[hidden], template {
}
ul.contextMenu {
text-align:
margin:
padding: 10px
border-radius:
color:
box-shadow: 0 0 70px rgba(0, 0, 0, .25);
font-weight:
font-size:
z-index:
position:
top:
left:
transform: translate(-50%,
pointer-events: none
}
]]>
Nguyễn Duy Quân
Tôi là một cậu nhóc có đam mê về lập trình, thích khám phá những điều thú vị trên mạng internet. Biết đôi chút về HTML, CSS, JS,...(Phét thôi chứ đang vọc :v)
Nghệ An, Việt Nam
50.640
Followers
65
Following
24
Bài Viết
1
Website