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 {
font-size: 4vw;
font-weight: 700;
}
h2, .label {
font-size: 2.4vw;
}
h3 {
font-size: 2vw;
}
h4 {
font-size: 1.6vw;
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: #e50b34;
}
footer h4, footer p {
font-size: 60%;
}
footer p {
color: #828282;
} 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;
}
p {
color: #a6a6a6;
}
.bg {
background-position: center center;
background-repeat: no-repeat;
background-size: 60%;
}
.bg.check {
background-image: url(//dojyn.com/wp-content/themes/dojyn4/img/svg/check.svg);
}
.bg.resize {
background-image: url(//dojyn.com/wp-content/themes/dojyn4/img/svg/resize.svg);
}
.bg.banned {
background-image: url(//dojyn.com/wp-content/themes/dojyn4/img/svg/banned.svg);
} .flexin {
display: flex;
align-items: center;
justify-content: center;
}
img {
width: 100%;
height: auto;
}
a.btn {
display: inline-block;
background-color: #e50b34;
margin-top: 1rem;
padding: 0.5rem 1rem;
border-radius: 1rem;
text-decoration: none;
color: #020202;
}
a.btn:hover {
background-color: #f52e53;
}
.outer {
width: 100%;
}
.outer.solo {
margin-bottom: 1rem;
}
.wrapper, nav {
margin: 0 auto 1rem;
width: 100%;
max-width: 1280px;
}
nav {
padding: 1rem;
}
nav > div {
padding: 0 1rem;
}
nav > div:first-child {
font-weight: 700;
}
.layer-1 {
padding: 1rem;
margin: 1rem;
}
.boxed {
border-radius: 1rem;
}
.image {
margin: 1rem;
}
.image img {
border-radius: 1rem;
}
.grid {
display: grid;
row-gap: 1rem;
height: auto;
width: 100%;
margin: auto;
}
.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.three .grid-item:nth-child(2) {
border-right: 2px solid #1c1c1c;
border-left: 2px solid #1c1c1c;
}
.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, .text-block.post p {
margin: 0;
padding: 0;
line-height: 100%;
}
.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;
}
.dark {
background-color: #e50b34;
color: #ffffff;
}
.dark a.btn {
background-color: #020202;
color: #e50b34;
}
.dark a.btn:hover {
background-color: #1c1c1c;
}
.light {
background-color: #ffffff;
color: #e50b34;
}
.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: 320px;
} header.home h1, header.home p {
margin: 0;
padding: 0;
line-height: 100%;
}
header.home h1, header.home .hero-text p {
display: inline-block;
font-size: 3vw;
text-align: center;
z-index: 5;
width: 80%;
font-weight: 400;
font-style: italic;
color: #ffffff;
}
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 #1c1c1c;
}
}
.rotator, .home, .text-block {
border-bottom: 2px solid #1c1c1c;
} .rotator p.label {
position: absolute;
color: #e50b34;
z-index: 100;
left: 0;
background-color: #020202;
height: 100%;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-align: center;
border-right: 2px solid #1c1c1c;
margin: 0;
padding: 1rem;
} @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 #1c1c1c;
border-bottom: 2px solid #1c1c1c;
}
} 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 #1c1c1c !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: #e50b34 !important;
border: 1px solid #e50b34 !important;
color: #ffffff !important;
font-size: 1rem !important;
font-family: inherit;
padding: 1rem !important;
border-radius: 0.5rem;
}