.small-title:hover {
cursor: url("https://freight.cargo.site/m/M1565408600048439168630729339000/cursor_cursor_2.svg"),auto !important;
}
.small-title a .linked{
cursor: url("https://freight.cargo.site/m/M1565408600048439168630729339000/cursor_cursor_2.svg"),auto !important;
}
/*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
text-align: center;
background: #ff0000;
}
p {
font-size: 1.6em;
font-family: 'Lato', sans-serif;
background-color: #000000;
padding: 1em;
color: #002240;
margin-top: 0;
}*/
/* .button */
.button {
display: inline-block;
position: relative;
margin: 0em;
padding: 0em;
overflow: hidden;
text-decoration: none;
font-size: 1.8em;
outline: none;
color: #ff0000;
background: transparent;
font-family: "Benton Sans";
line-height: 0.5;
letter-spacing: 5;
cursor: url("https://freight.cargo.site/m/M1565408600029992424557019787384/cursor_cursor_1.svg"),auto !important;
font-weight: 700;
font-style: oblique;
}
.button span {
-webkit-transition: 0.6s;
-moz-transition: 0.6s;
-o-transition: 0.6s;
transition: 0.6s;
-webkit-transition-delay: 0.2s;
-moz-transition-delay: 0.2s;
-o-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.button:before,
.button:after {
content: '';
position: absolute;
top: 0.67em;
left: 0;
width: 100%;
text-align: center;
opacity: 0;
-webkit-transition: .4s,opacity .6s;
-moz-transition: .4s,opacity .6s;
-o-transition: .4s,opacity .6s;
transition: .4s,opacity .6s;
}
/* :before */
.button:before {
content: attr(data-hover);
-webkit-transform: translate(0,0);
-moz-transform: translate(0,0);
-ms-transform: translate(0,0);
-o-transform: translate(0,0);
transform: translate(0,0);
}
/* :after */
.button:after {
content: attr(data-active);
-webkit-transform: translate(150%,0);
-moz-transform: translate(150%,0);
-ms-transform: translate(150%,0);
-o-transform: translate(150%,0);
transform: translate(150%,0);
}
/* Span on :hover and :active */
.button:hover span,
.button:active span {
opacity: 0;
-webkit-transform: scale(0.3);
-moz-transform: scale(0.3);
-ms-transform: scale(0.3);
-o-transform: scale(0.3);
transform: scale(0.3);
}
/*
We show :before pseudo-element on :hover
and :after pseudo-element on :active
*/
.button:hover:before,
.button:active:after {
opacity: 1;
-webkit-transform: translate(0,0);
-moz-transform: translate(0,0);
-ms-transform: translate(0,0);
-o-transform: translate(0,0);
transform: translate(0,0);
-webkit-transition-delay: .4s;
-moz-transition-delay: .4s;
-o-transition-delay: .4s;
transition-delay: .4s;
}
/*
We hide :before pseudo-element on :active
*/
.button:active:before {
-webkit-transform: translate(-150%,0);
-moz-transform: translate(-150%,0);
-ms-transform: translate(-150%,0);
-o-transform: translate(-150%,0);
transform: translate(-150%,0);
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-o-transition-delay: 0s;
transition-delay: 0s;
}
/*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
text-align: center;
background: #00C8FF;
}
p {
font-size: 1.6em;
font-family: 'Lato', sans-serif;
background-color: #fff;
padding: 1em;
color: #002240;
margin-top: 0;
}*/
/** .button */
/**.button {
display: inline-block;
/*position: relative;
margin: 1em;
padding: 0.67em;
border: 2px solid #FFF;
overflow: hidden;
text-decoration: none;
font-size: 2em;
outline: none;
/*color: #FFF;
background: transparent;
}
.button span {
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
-webkit-transition-delay: 0.2s;
-moz-transition-delay: 0.2s;
-o-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.button:before,
.button:after {
content: '';
position: absolute;
/*top: 0.67em;
left: 0;
width: 100%;
text-align: left;
opacity: 0;
-webkit-transition: .2s,opacity .4s;
-moz-transition: .2s,opacity .4s;
-o-transition: .2s,opacity .4s;
transition: .2s,opacity .4s;
}
/* :before
.button:before {
content: attr(data-hover);
-webkit-transform: translate(-2%,0);
-moz-transform: translate(-2%,0);
-ms-transform: translate(-2%,0);
-o-transform: translate(-2%,0);
transform: translate(-2%,0);
}
/* :after
.button:after {
content: attr(data-active);
-webkit-transform: translate(2%,0);
-moz-transform: translate(2%,0);
-ms-transform: translate(2%,0);
-o-transform: translate(2%,0);
transform: translate(2%,0);
}
/* Span on :hover and :active
.button:hover span,
.button:active span {
opacity: 0;
-webkit-transform: scale(-1);
-moz-transform: scale(-1);
-ms-transform: scale(-1);
-o-transform: scale(-1);
transform: scale(-1);
}
/*
We show :before pseudo-element on :hover
and :after pseudo-element on :active
.button:hover:before,
.button:active:after {
opacity: 1;
-webkit-transform: translate(0,0);
-moz-transform: translate(0,0);
-ms-transform: translate(0,0);
-o-transform: translate(0,0);
transform: translate(0,0);
-webkit-transition-delay: .4s;
-moz-transition-delay: .4s;
-o-transition-delay: .4s;
transition-delay: .4s;
}
/*
We hide :before pseudo-element on :active
.button:active:before {
-webkit-transform: translate(-2%,0);
-moz-transform: translate(-2%,0);
-ms-transform: translate(-2%,0);
-o-transform: translate(-2%,0);
transform: translate(-2%,0);
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-o-transition-delay: 0s;
transition-delay: 0s;
}
*/