/* 2019 nikolovdzn.com */

@import url('https://fonts.googleapis.com/css?family=Dosis:700');

body {
background-color: #000000;;
}

#ndzn-ip {
width: 550px;
height: 60px;
background: url(../img/ndzn-ip.png) no-repeat center / 100%;
text-align: center;
display: flex;
align-items: center;
margin: 0px auto 10px;
font-weight: 700;
font-family: 'Dosis', cursive;
position: relative;
cursor: pointer;
transition: .25s;
max-width: 100%;
}
#ndzn-ip h1 {
text-transform: uppercase;
color: #ffc700;
font-size: 40px;
display: block;
text-align: center;
width: 100%;
margin: 0;
letter-spacing: 1px;
transition: .1s;
}
#ndzn-ip small {
text-transform: uppercase;
font-size: 20px;
color: #d8d8d8;
position: absolute;
top: 100%;
left: 0;
right: 0;
margin: -5px auto 0;
line-height: 20px;
pointer-events: none;
user-select: none;
overflow: hidden;
height: 20px;
transition: .15s;
}
#ndzn-ip small b {
display: block;
transition: .15s;
}
#ndzn-ip .count {
font-weight: bold;
pointer-events: none;
user-select: none;
position: absolute;
background: rgba(200, 200, 200, 0.7);
height: 24px;
line-height: 25px;
padding: 0 10px 0 12px;
color: white !important;
border-radius: 3px;
font-size: 15px;
right: -10px;
left: auto;
bottom: calc(100% - 5px);
box-shadow: 0 4px 5px rgba(0,0,0,0.075);
text-shadow: 0 2px 3px rgba(0,0,0,0.15);
letter-spacing: 0.05em;
transition: .2s;
}
#ndzn-ip .count:before {
content: "✔";
font-size: 15px;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 100%;
height: 100%;
display: block;
opacity: 0;
transition: .15s;
}
#ndzn-ip .count:after {
content: "";
position: absolute;
top: 100%;
left: 6px;
border: 3px solid transparent;
border-top-color: rgba(200, 200, 200, 0.7);
border-left-color: rgba(200, 200, 200, 0.7);
}

#ndzn-ip.copied {
background-size: 85%;
}
#ndzn-ip.copied h1 {
font-size: 40px;
color: #18ff00;
}
#ndzn-ip.copied small {
margin-top: -5px;
color: #d8d8d8;
}
#ndzn-ip.copied small b:first-child {
margin-top: -20px;
}
#ndzn-ip.copied .count {
background: rgba(200, 200, 200, 0.7);
right: -10px;
width: 50px;
font-size: 0;
}
#ndzn-ip.copied .count:before {
opacity: 1;
}
#ndzn-ip.copied .count:after {
border: 5px solid transparent;
border-top-color: rgba(200, 200, 200, 0.7);
left: 0;
right: 0;
width: 0;
margin: 0 auto;
}

@media (max-width: 380px) {
.links > div {
display: block;
width: 100%;
text-align: center;
}
.links > div img {
height: 160px;
width :auto;
}
.logo + .container {
display: flex;
flex-direction: column;
}
.links {
order: 2;
}
#ndzn-ip {
margin: 0 auto 20px;
background: rgba(0,0,0,0.25);
border-radius: 6px;
height: 55px;
pointer-events: none;
user-select: none;
}
#ndzn-ip h1 {
font-size: 19px;
text-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
#ndzn-ip small {
display: none;
}
#ndzn-ip .count {
bottom: calc(100% - 5px);
}
}

#ndzn-discord {
position: fixed;
bottom: 45px;
right: 50px;
width: 75px;
height: 75px;
border-radius: 50%;
background: #7388d9;
box-shadow: 0 7px 10px rgba(0,0,0,0.2);
display: flex;
align-items: center;
justify-content: center;
transition: .15s;
z-index: 10000;
}
#ndzn-discord i {
position: relative;
top: 2px;
left: 0px;
width: 27px;
height: 31px;
display: block;
background: url(https://discordapp.com/assets/1c8a54f25d101bdc607cec7228247a9a.svg) no-repeat center / auto 100%;
}
#ndzn-discord:hover, #ndzn-discord:focus {
transform: scale(0.95);
background: #8a9eec;
}#ndzn-discord {
position: fixed;
bottom: 40px;
right: 50px;
width: 75px;
height: 75px;
border-radius: 50%;
background: #7388d9;
box-shadow: 0 7px 10px rgba(0,0,0,0.2);
display: flex;
align-items: center;
justify-content: center;
transition: .15s;
z-index: 10000;
}
#ndzn-discord i {
position: relative;
top: 2px;
left: 0px;
width: 27px;
height: 31px;
display: block;
background: url(https://discordapp.com/assets/1c8a54f25d101bdc607cec7228247a9a.svg) no-repeat center / auto 100%;
}
#ndzn-discord:hover, #ndzn-discord:focus {
transform: scale(0.95);
background: #8a9eec;
}

@media (max-width: 480px) {
#ndzn-discord {
bottom: 20px;
right: 20px;
width: 60px;
height: 60px;
}
#ndzn-discord i {
top: 1px;
height: 27px;
}
}