body, h5, p {
font-size: 1.4rem;
line-height: 140%;
}
body, h2, h3, h4, h5, .site-title {
font-family: "Chakra Petch", sans-serif;
font-weight: 300;
font-display: swap;
}
h1 {
font-family: "Chakra Petch", sans-serif;
font-weight: 300;
font-display: swap;
}
h5, strong {
font-weight: 700;
}
h1, h2 {
font-size: 2vw;
font-weight: 300;
}
.label {
font-size: 2.4vw;
}
h3 {
font-size: 1.6vw;
}
h4 {
font-size: 1.2vw;
font-weight: 700;
}
h1, h2, h3, h4 {
line-height: 120%;
font-style: italic;
}
h1, h2, h3, h4, h5, p {
margin-bottom: 1rem;
}
h1 span, h2 span, h3 span, h4 span, h5 span, p span {
color: #40ffb6;
} body {
color: #ffffff;
background-color: #020202;
}
a, a:visited, a:active, a:hover {
color: #ffffff;
}
.light a, .light a:visited, .light a:active, .light a:hover {
color: #ffffff;
}
a:hover {
text-decoration: none;
}
.bg {
background-position: center center;
background-repeat: no-repeat;
background-size: 50%;
}
.bg.check {
background-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/check.svg);
}
.bg.resize {
background-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/resize.svg);
}
.bg.banned {
background-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/banned.svg);
}
.bg.top-burst {
background-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/top-burst.svg);
background-position: center 100%;
background-size: 50%;
}
.bg.bottom-burst {
background-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/top-burst.svg);
background-position: center -10%;
background-size: 50%;
}
.bg.block-color {
border-radius: 1rem;
}
.bg.block-color.dark {
background-color: rgb(6.4906779661, 5.994, 13.986);
}
.bg.block-color.light {
background-color: #40ffb6;
color: #020202;
}
.mask {
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
mask-size: 98%;
-webkit-mask-position: center;
mask-position: center;
}
.mask.fade-edge-vert {
-webkit-mask-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/fade-edge-vert.svg);
mask-image: url(//dojyn.com/wp-content/themes/dojyn5/img/svg/fade-edge-vert.svg);
} .flexin {
display: flex;
align-items: center;
justify-content: center;
}
img {
width: 100%;
height: auto;
}
a.btn {
display: inline-block;
background-color: #594eff;
margin-top: 1rem;
padding: 0.5rem 1rem;
border-radius: 1rem;
text-decoration: none;
color: #020202;
}
a.btn:hover {
background-color: white;
}
.outer {
width: 100%;
}
.outer.solo {
margin-bottom: 1rem;
}
.wrapper, nav {
margin: 2rem auto;
width: 100%;
max-width: 1280px;
}
.post .wrapper, .post nav {
max-width: 1024px;
}
nav {
padding: 1rem;
}
nav > div {
padding: 0 1rem;
}
nav > div:first-child {
font-weight: 700;
}
.layer-1 {
padding: 2rem;
}
.boxed {
border-radius: 1rem;
}
.image {
margin: 1rem;
}
.image img {
border-radius: 1rem;
}
.grid {
display: grid;
row-gap: 1rem;
height: auto;
width: 100%;
margin: auto;
border-radius: 2rem;
}
.grid.two {
grid-template-columns: 50% 50%;
}
.grid.three {
grid-template-columns: 33.3% 33.3% 33.3%;
}
.grid.four {
grid-template-columns: 25% 25% 25% 25%;
}
.grid.menu {
grid-template-columns: 50% 12.5% 12.5% 12.5% 12.5%;
}
.grid .grid-item {
width: 100%;
}
.grid.minor {
border: 2px solid rgb(21.6355932203, 19.98, 46.62);
}
.grid.three .grid-item:nth-child(2) {
border-right: 2px solid white;
border-left: 2px solid white;
}
.canvas {
position: relative;
display: flex;
align-items: center;
justify-content: center;
min-height: 400px;
overflow: hidden;
}
.canvas > div, .canvas > img {
height: 100%;
position: absolute;
margin: auto;
}
.canvas > img {
width: auto;
}
.text-block svg, .text-block video {
max-width: 480px;
}
.text-block .the-text {
padding: 4rem;
}
.text-block.post h1 {
font-weight: 300;
font-size: 4rem;
}
.text-block.post p.site-title {
margin-bottom: 1rem;
}
.text-block.post .wrapper {
margin-bottom: 0;
}
footer ul, footer li {
margin: 0;
list-style-type: none;
}
footer .wrapper {
margin: 0 auto;
}
.logos {
display: flex;
align-items: center;
justify-content: center;
padding: 4rem;
width: 100%;
}
.logos svg {
width: 100%;
height: auto;
display: none;
}
.logos svg:first-child {
display: block;
}
#logoCarousel img {
width: 100%;
max-width: 480px;
} header.home {
padding: 8rem 0;
text-align: center;
}
header.home h1, header.home p {
margin: 0;
padding: 0;
line-height: 100%;
}
header.home .hero-text {
display: inline-block;
font-size: 2vw;
text-align: center;
font-weight: 700;
font-style: italic;
color: rgb(172, 166.5, 255);
letter-spacing: 1rem;
border-top: 2px solid #594eff;
border-bottom: 2px solid #594eff;
padding: 1rem 0;
margin: 1rem 0;
}
header.home p.background-text {
font-size: 10vw;
font-weight: 700;
font-style: italic;
color: transparent;
}
@supports (-webkit-text-stroke: 2px black) {
header.home p.background-text {
-webkit-text-stroke: 2px white;
}
}  @media only screen and (max-width: 800px) {
h1 {
font-size: 3rem;
}
h2 {
font-size: 2.4rem;
}
h3 {
font-size: 1.8rem;
}
h4, h5 {
font-size: 1.4rem;
}
.grid.two, .grid.three, .grid.four {
grid-template-columns: 100%;
}
.grid.menu {
grid-template-columns: 50% 50%;
}
header.home h1 {
font-size: 1.4rem;
}
header.home p {
font-size: 6rem;
}
.grid.three .grid-item:nth-child(2) {
border-right: 0px solid #020202;
border-left: 0px solid #020202;
border-top: 2px solid white;
border-bottom: 2px solid white;
}
} div.wpforms-container {
padding: 2rem !important;
background-color: rgb(6.4906779661, 5.994, 13.986) !important;
margin: 2rem auto !important;
border-radius: 1rem !important;
}
div.wpforms-container-full .wpforms-form input[type=date], div.wpforms-container-full .wpforms-form input[type=datetime], div.wpforms-container-full .wpforms-form input[type=datetime-local], div.wpforms-container-full .wpforms-form input[type=email], div.wpforms-container-full .wpforms-form input[type=month], div.wpforms-container-full .wpforms-form input[type=number], div.wpforms-container-full .wpforms-form input[type=password], div.wpforms-container-full .wpforms-form input[type=range], div.wpforms-container-full .wpforms-form input[type=search], div.wpforms-container-full .wpforms-form input[type=tel], div.wpforms-container-full .wpforms-form input[type=text], div.wpforms-container-full .wpforms-form input[type=time], div.wpforms-container-full .wpforms-form input[type=url], div.wpforms-container-full .wpforms-form input[type=week], div.wpforms-container-full .wpforms-form select, div.wpforms-container-full .wpforms-form textarea {
background-color: transparent !important;
box-sizing: border-box;
border-radius: 0.5rem !important;
color: #ffffff !important;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
display: block;
float: none;
font-size: 16px;
font-family: inherit;
border: 2px solid rgb(21.6355932203, 19.98, 46.62) !important;
padding: 6px 10px;
height: 38px;
width: 100%;
line-height: 1.3;
}
div.wpforms-container-full .wpforms-form input[type=submit], div.wpforms-container-full .wpforms-form button[type=submit], div.wpforms-container-full .wpforms-form .wpforms-page-button {
background-color: #594eff !important;
border-width: 0px !important;
color: #ffffff !important;
font-size: 1rem !important;
font-family: inherit;
padding: 1rem !important;
border-radius: 0.5rem;
}
.bg.block-color.light div.wpforms-container {
background-color: #40ffb6 !important;
padding: 0 !important;
}
.bg.block-color.light .wpforms-form input[type=datetime],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=datetime-local],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=email],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=month],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=number],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=password],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=range],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=search],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=tel],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=text],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=time],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=url],
.bg.block-color.light div.wpforms-container-full .wpforms-form input[type=week],
.bg.block-color.light div.wpforms-container-full .wpforms-form select,
.bg.block-color.light div.wpforms-container-full .wpforms-form textarea {
color: #020202 !important;
}