* {
outline: none !important;
-webkit-tap-highlight-color: transparent;
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
*:focus {
outline: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
::-webkit-scrollbar {
width: 12px !important;
}
::-webkit-scrollbar-track {
background: #f0f0f0 !important;
}
::-webkit-scrollbar-thumb {
background: #b3b3b3 !important;
}
::-webkit-scrollbar-thumb:hover {
background: #8a8a8a !important;
}
body {
font-family: "Manrope", serif;
color: #000;
background: #fff;
font-size: 18px;
max-width: 1920px;
min-width: 320px;
margin: 0 auto;
}
ul {
margin: 0;
padding: 0;
overflow: hidden;
}
ul li {
list-style: none;
}
a,
a:hover,
a:focus {
text-decoration: none !important;
color: #000;
}
p,
a,
span,
h1,
h2,
h3,
h4,
h5 {
margin: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
div,
ul,
li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
input,
textarea {
-webkit-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
font-family: "Manrope", serif;
caret-color: auto !important;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
font-family: "Manrope", serif;
}
input::-moz-placeholder, textarea::-moz-placeholder {
font-family: "Manrope", serif;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
font-family: "Manrope", serif;
}
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
font-family: "Manrope", serif;
}
input,
input::placeholder,
textarea,
textarea::placeholder {
font-family: "Manrope", serif;
}
select {
cursor: pointer;
}
.container {
width: 1100px;
margin: 0 auto;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#wrap {
background: url(//mariamusic.ca/wp-content/themes/mm/img/bg.jpg) no-repeat top;
overflow: hidden;
}
header .header .container {
display: grid;
grid-template-columns: 1fr auto 1fr;
gap: 50px;
padding: 40px 0;
}
header .header .container .menu {
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
grid-template-columns: auto auto auto;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding-bottom: 30px;
}
header .header .container .menu a {
display: block;
font-size: 18px;
color: #656565;
-webkit-transition: 0.3s;
transition: 0.3s;
}
header .header .container .menu a:hover {
color: #000;
}
header .header .container .menu a.active {
color: #000;
}
header .lang .container div {
float: right;
display: grid;
grid-template-columns: auto auto auto;
gap: 10px;
margin-top: -65px;
}
header .lang .container div a,
header .lang .container div span {
color: #656565;
font-size: 20px;
z-index: 1;
position: relative;
}
header .lang .container div .active {
color: #000;
}
.index .h2-ru {
display: block !important;
}
.index .h2-ru::before {
display: none;
}
.index .first {
display: grid;
grid-template-columns: auto 1fr;
gap: 30px;
margin-bottom: 30px;
}
.index .first-ru {
grid-template-columns: 1fr 1.2fr;
}
.index .first div img {
width: 100%;
height: auto;
}
.index .first div h2 {
font-size: 32px;
display: grid;
grid-template-columns: 70px 1fr;
gap: 20px;
text-transform: uppercase;
font-weight: 400;
margin-bottom: 10px;
line-height: 1.2;
}
.index .first div h2::before {
width: 70px;
height: 2px;
background: #000;
content: "";
margin-top: 20px;
}
.index .first-ru div h2 {
text-transform: unset;
}
.index .first div p {
margin-top: 10px;
font-size: 20px;
color: #505050;
line-height: 1.23;
}
.index .first div p u {
font-weight: 700;
text-decoration: none;
}
.index .first div p u a {
color: #505050;
}
.index .first div p b {
color: #505050;
font-weight: 700;
}
.index .first div p b u a {
color: #505050;
}
.index .second p {
font-size: 20px;
color: #505050;
line-height: 1.23;
}
.index .second-ru p {
margin-bottom: 10px;
}
.index .second p a {
color: #505050;
font-weight: 700;
}
.concerts .first {
display: grid;
grid-template-columns: 346px 1fr;
gap: 30px;
}
.concerts .first img {
width: 100%;
}
.concerts .first .first-content-text {
text-align: center;
margin-top: -295px;
padding: 30px;
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.concerts .first .first-content-text p {
font-size: 20px;
color: #fff;
font-weight: 700;
}
.concerts .first .first-content-text span {
font-size: 20px;
color: #fff;
display: grid;
grid-template-columns: 1fr;
}
.concerts .first .first-content-text span::before {
content: "";
width: 130px;
height: 1px;
background: #fff;
margin: 20px auto;
}
.concerts .first > div:last-child {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
row-gap: 30px;
}
.concerts .first > div .first-content > div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.concerts .first > div .first-content > div::before, .concerts .first > div .first-content > div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.concerts .first > div .first-content > div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.concerts .first > div .first-content > div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.concerts .first > div .first-content > div img {
height: 295px;
}
.concerts .second {
margin-top: 30px;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
}
.concerts .second img {
width: 100%;
}
.concerts .second .second-content-text {
text-align: center;
margin-top: -295px;
padding: 30px;
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.concerts .second .second-content-text p {
font-size: 20px;
color: #fff;
font-weight: 700;
}
.concerts .second .second-content-text span {
font-size: 20px;
color: #fff;
display: grid;
grid-template-columns: 1fr;
}
.concerts .second .second-content-text span::before {
content: "";
width: 130px;
height: 1px;
background: #fff;
margin: 20px auto;
}
.concerts .second .second-content > div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.concerts .second .second-content > div::before, .concerts .second .second-content > div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.concerts .second .second-content > div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.concerts .second .second-content > div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.concerts .second .second-content > div img {
height: 295px;
}
.concerts h4 {
font-size: 20px;
color: #505050;
text-decoration-line: underline !important;
text-decoration-color: #000 !important;
text-decoration-style: solid !important;
text-decoration-thickness: 1px !important;
text-align: center;
font-weight: 400;
margin-top: 10px;
cursor: pointer;
}
.media h3 {
display: grid;
grid-template-columns: 130px 1fr;
gap: 20px;
font-size: 32px;
text-transform: uppercase;
font-weight: 400;
margin-bottom: 40px;
}
.media h3::before {
width: 130px;
height: 2px;
background: #000;
content: "";
margin-top: 20px;
}
.media .photo {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
row-gap: 30px;
margin-bottom: 70px;
}
.media .photo div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.media .photo div::before, .media .photo div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.media .photo div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .photo div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .photo div img {
cursor: pointer;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.media .audio {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
row-gap: 30px;
margin-bottom: 70px;
}
.media .audio div > div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.media .audio div > div::before, .media .audio div > div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.media .audio div > div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .audio div > div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .audio div > div img {
cursor: pointer;
}
.media .audio p {
margin-top: -5px;
text-align: center;
font-size: 20px;
color: #000;
cursor: pointer;
text-decoration-line: underline;
text-decoration-color: #000;
text-decoration-style: solid;
text-decoration-thickness: 1px;
}
.media .video {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
row-gap: 30px;
}
.media .video div > div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.media .video div > div::before, .media .video div > div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.media .video div > div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .video div > div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.media .video div > div img {
cursor: pointer;
}
.media .video p {
margin-top: -5px;
text-align: center;
font-size: 20px;
color: #000;
cursor: pointer;
text-decoration-line: underline;
text-decoration-color: #000;
text-decoration-style: solid;
text-decoration-thickness: 1px;
}
.fancybox-slide--image .fancybox-content {
background: none !important;
}
.lessons .container {
display: grid;
grid-template-columns: 560px 1fr;
gap: 30px;
margin-bottom: 30px;
}
.lessons .container div img {
width: 100%;
}
.lessons .container div ul {
margin-bottom: 15px;
}
.lessons .container div ul li {
margin-bottom: 5px;
margin-bottom: 10px;
font-size: 20px;
color: #505050;
line-height: 1.23;
display: grid;
grid-template-columns: auto 1fr;
gap: 10px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.lessons .container div ul li::before {
content: "";
width: 9px;
height: 9px;
background: #505050;
border-radius: 50%;
}
.lessons .container div p {
margin-bottom: 10px;
font-size: 20px;
color: #505050;
line-height: 1.23;
}
.lessons .container div span {
margin-bottom: 15px;
font-size: 20px;
color: #505050;
line-height: 1.23;
display: block;
}
.lectures-wrap {
background: url(//mariamusic.ca/wp-content/themes/mm/img/lectures-bg.jpg) no-repeat top !important;
}
.lectures-wrap .lectures .first {
margin-bottom: 20px;
padding: 440px 0 0 570px;
}
.lectures-wrap .lectures .first p {
font-size: 20px;
color: #000;
font-weight: 500;
margin-bottom: 10px;
}
.lectures-wrap .lectures .first span {
font-size: 20px;
color: #505050;
}
.lectures-wrap .lectures .second {
margin-bottom: 70px;
}
.lectures-wrap .lectures .second p {
font-size: 20px;
color: #000;
font-weight: 500;
margin-bottom: 10px;
margin-top: 25px;
}
.lectures-wrap .lectures .second span {
font-size: 20px;
color: #505050;
margin-bottom: 10px;
display: block;
}
.lectures-wrap .lectures .second > div {
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
}
.lectures-wrap .lectures .second > div u {
text-decoration-line: underline !important;
text-decoration-color: #505050 !important;
text-decoration-style: solid !important;
text-decoration-thickness: 1px !important;
}
.lectures-wrap .lectures .second > div .social a {
margin-right: 8px;
}
.lectures-wrap .lectures .third {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
row-gap: 30px;
margin-bottom: 70px;
}
.lectures-wrap .lectures .third div > div {
position: relative;
display: grid;
padding: 7px;
background: #fff;
-webkit-box-shadow: 0 0 0 2px #000;
box-shadow: 0 0 0 2px #000;
}
.lectures-wrap .lectures .third div > div::before, .lectures-wrap .lectures .third div > div::after {
content: "";
position: absolute;
height: 2px;
background: #fff;
width: 50%;
}
.lectures-wrap .lectures .third div > div::before {
top: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.lectures-wrap .lectures .third div > div::after {
bottom: -2px;
left: 0;
right: 0;
margin: 0 auto;
}
.lectures-wrap .lectures .third div > div img {
cursor: pointer;
}
.lectures-wrap .lectures .third p {
margin-top: -5px;
text-align: center;
font-size: 20px;
color: #000;
cursor: pointer;
text-decoration-line: underline;
text-decoration-color: #000;
text-decoration-style: solid;
text-decoration-thickness: 1px;
}
.lectures-wrap .lectures .fourth h3 {
font-size: 32px;
font-weight: 400;
color: #000;
margin-bottom: 20px;
text-transform: uppercase;
}
.lectures-wrap .lectures .fourth p {
margin-bottom: 20px;
color: #505050;
}
.lectures-wrap .lectures .fourth p a {
color: #505050;
font-weight: 500;
}
.lectures-wrap .lectures .fourth ul {
margin-bottom: 15px;
}
.lectures-wrap .lectures .fourth ul li {
margin-bottom: 5px;
margin-bottom: 10px;
font-size: 20px;
color: #505050;
line-height: 1.23;
display: grid;
grid-template-columns: auto 1fr;
gap: 10px;
}
.lectures-wrap .lectures .fourth ul li::before {
content: "";
width: 9px;
height: 9px;
background: #505050;
border-radius: 50%;
margin-top: 7px;
}
.lectures-wrap .lectures .fourth > div {
display: grid;
grid-template-columns: auto 1fr;
gap: 15px;
}
.lectures-wrap .lectures .fourth > div p b {
font-weight: 600;
}
.lectures-wrap .lectures .fourth > div span {
color: #505050;
}
.contacts p {
margin-bottom: 10px;
font-size: 20px;
color: #505050;
line-height: 1.23;
}
.contacts span {
margin-bottom: 15px;
font-size: 20px;
color: #505050;
line-height: 1.23;
display: block;
}
.feedback .container {
margin: 70px auto;
display: grid;
grid-template-columns: auto 1fr;
gap: 40px;
}
.feedback .container h3 {
display: grid;
grid-template-columns: 130px 1fr;
gap: 20px;
font-size: 32px;
text-transform: uppercase;
font-weight: 400;
}
.feedback .container h3::before {
width: 130px;
height: 2px;
background: #000;
content: "";
margin-top: 20px;
}
.feedback .container .social {
margin-top: 5px;
}
.feedback .container .social a {
margin-right: 8px;
}
.feedback .container .social a img {
-webkit-transition: 0.3s;
transition: 0.3s;
}
.feedback .container .social a:hover img {
-webkit-transform: translateY(2px);
transform: translateY(2px);
}
.feedback-form .container {
margin: 70px auto 40px;
}
.form {
margin-bottom: 50px;
}
.form .form-input {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 30px;
}
.form input {
width: 100%;
padding: 25px;
border: 1px solid #000;
font-size: 20px;
color: #505050;
}
.form input::-webkit-input-placeholder {
color: #505050;
font-size: 20px;
}
.form input::-moz-placeholder {
color: #505050;
font-size: 20px;
}
.form input:-ms-input-placeholder {
color: #505050;
font-size: 20px;
}
.form input::-ms-input-placeholder {
color: #505050;
font-size: 20px;
}
.form input::placeholder {
color: #505050;
font-size: 20px;
}
.form textarea {
width: 100%;
margin-top: 15px;
padding: 25px;
border: 1px solid #000;
resize: none;
font-size: 20px;
color: #505050;
height: 135px;
}
.form textarea::-webkit-input-placeholder {
color: #505050;
font-size: 20px;
}
.form textarea::-moz-placeholder {
color: #505050;
font-size: 20px;
}
.form textarea:-ms-input-placeholder {
color: #505050;
font-size: 20px;
}
.form textarea::-ms-input-placeholder {
color: #505050;
font-size: 20px;
}
.form textarea::placeholder {
color: #505050;
font-size: 20px;
}
.form input[type=submit] {
display: block;
margin-top: 25px;
width: 395px;
padding: 25px;
background: #000;
color: #fff;
font-size: 20px;
border: none;
cursor: pointer;
-webkit-transition: 0.3s;
transition: 0.3s;
text-transform: uppercase;
}
.form input[type=submit]:hover {
-webkit-transform: translateY(2px);
transform: translateY(2px);
}
.wpcf7-spinner {
display: block !important;
margin: 20px auto 0 !important;
}
.wpcf7-not-valid-tip {
font-size: 18px !important;
}
.wpcf7 form .wpcf7-response-output {
margin: 0 auto !important;
text-align: center !important;
border: 1px solid #dc3232 !important;
padding: 10px !important;
}
.wpcf7 form.sent .wpcf7-response-output {
border: 1px solid #46b450 !important;
}
.grecaptcha-badge {
display: none !important;
}
footer .container {
border-top: 2px solid #656565;
padding: 30px 0;
}
footer .container p {
font-size: 16px;
color: #000;
}
.menu-mobile {
display: none;
}
@media (max-width: 1199px) {
.menu-mobile {
display: block;
width: 70px;
z-index: 9999;
position: fixed;
top: 0;
right: 0;
background: #000;
padding: 10px 0;
height: 60px;
}
.menu-mobile nav {
overflow: hidden;
}
.menu-mobile .burger {
width: 40px;
height: 30px;
position: absolute;
right: 15px;
top: 15px;
z-index: 999;
cursor: pointer;
}
.menu-mobile .burger .bar {
width: 100%;
height: 5px;
background-color: #fff;
position: absolute;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.menu-mobile .burger .bar:nth-of-type(1) {
top: 0;
}
.menu-mobile .burger .bar:nth-of-type(2) {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.menu-mobile .burger .bar:nth-of-type(3) {
bottom: 0;
}
.menu-mobile .burger.show .bar:nth-of-type(1) {
-webkit-transform: rotate(-45deg) translate(-12px, 12px);
transform: rotate(-45deg) translate(-12px, 12px);
background: #fff;
}
.menu-mobile .burger.show .bar:nth-of-type(2) {
opacity: 0;
}
.menu-mobile .burger.show .bar:nth-of-type(3) {
-webkit-transform: rotate(45deg) translate(-5px, -5px);
transform: rotate(45deg) translate(-5px, -5px);
background: #fff;
}
.menu-mobile .menu-wrapper {
display: none;
background-color: #000;
position: fixed;
top: 0;
left: -250px;
width: 100%;
height: 100%;
padding: 20px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0.4em 2em -0.4em;
box-shadow: rgba(0, 0, 0, 0.2) 0px 0.4em 2em -0.4em;
z-index: 9;
-webkit-transition: left 0.3s ease-in-out;
transition: left 0.3s ease-in-out;
overflow-y: auto;
padding-top: 30px;
}
.menu-mobile .menu-wrapper.show {
left: 0;
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.menu-mobile .menu-wrapper li {
width: 100%;
margin-bottom: 10px;
}
.menu-mobile .menu-wrapper a {
font-size: 24px;
color: #fff;
display: block;
margin: 0 !important;
padding: 10px 30px !important;
text-align: center;
}
.menu-mobile .menu-wrapper .lang {
margin: 0 auto;
text-align: center;
}
.menu-mobile .menu-wrapper .lang a {
display: inline-block;
padding: 10px 20px !important;
}
.menu-mobile .menu-wrapper .lang span {
font-size: 24px;
color: #fff;
}
.menu-mobile .close-button {
position: absolute;
top: 10px;
right: 10px;
font-size: 24px;
color: #fff;
cursor: pointer;
}
.menu-mobile .close-button:hover {
color: #fff;
}
.container {
width: 720px;
}
header .header .container {
display: block;
padding: 30px 0;
}
header .header .container .menu {
display: none;
}
header .header .container .logo img {
text-align: center;
display: block;
margin: 0 auto;
width: 200px;
}
header .lang {
display: none;
}
.index .first {
grid-template-columns: 1fr;
gap: 0;
row-gap: 30px;
margin-bottom: 10px;
}
.index .first div h2,
.feedback .container h3,
.lectures-wrap .lectures .fourth h3 {
font-size: 24px;
}
.index .first div p,
.index .second p {
font-size: 18px;
}
.feedback .container {
margin: 50px auto;
}
.feedback .container h3::before {
margin-top: 15px;
}
.feedback .container .social {
margin-top: 0px;
}
.concerts .first,
.lessons .container {
grid-template-columns: 1fr;
gap: 0;
row-gap: 30px;
}
.concerts .second,
.media .photo {
grid-template-columns: 1fr 1fr;
gap: 30px;
row-gap: 30px;
}
.concerts .first .first-content-text p,
.concerts .first .first-content-text span,
.concerts h4,
.concerts .second .second-content-text p,
.concerts .second .second-content-text span,
.lessons .container div p,
.lessons .container div ul li,
.lessons .container div span,
.form input,
.form textarea,
.form input[type=submit],
.form input::placeholder,
.form textarea::placeholder,
.contacts p,
.contacts span,
.lectures-wrap .lectures .first p,
.lectures-wrap .lectures .first span,
.lectures-wrap .lectures .second p,
.lectures-wrap .lectures .second span,
.lectures-wrap .lectures .fourth ul li,
.lectures-wrap .lectures .fourth > div span,
.lectures-wrap .lectures .fourth p {
font-size: 18px !important;
}
.lectures-wrap {
background-size: 1200px !important;
}
.lectures-wrap .lectures .first {
padding: 380px 0 0 0;
}
.lectures-wrap .lectures .second .social {
margin-top: -3px;
}
.lectures-wrap .lectures .second {
margin-bottom: 50px;
}
.index .first div h2::before {
margin-top: 12px;
}
.index .h2-ru {
display: grid !important;
}
.index .h2-ru:before {
display: block;
}
.media h3 {
font-size: 24px;
}
.media h3:before {
margin-top: 15px;
}
.menu-mobile .menu-wrapper {
padding: 0
}
}
@media (max-width: 739px) {
.container {
width: 320px;
}
header .header .container .logo img {
width: 150px;
}
.feedback .container {
gap: 20px;
}
.feedback .container h3 {
grid-template-columns: 30px 1fr;
}
.feedback .container h3::before {
width: 30px;
}
.feedback .container .social a {
margin-right: 0;
}
.index .first div h2,
.media h3 {
grid-template-columns: 40px 1fr;
gap: 10px;
}
.media h3:before,
.index .first div h2::before {
width: 40px;
}
.concerts .first > div:last-child,
.concerts .second,
.media .photo {
grid-template-columns: 1fr;
row: 0;
gap: 30px;
}
.form .form-input {
grid-template-columns: 1fr;
}
.form input[type=submit] {
width: 320px;
}
.lectures-wrap {
background: url(//mariamusic.ca/wp-content/themes/mm/img/lectures-320.jpg) no-repeat top !important;
}
.lectures-wrap .lectures .first {
padding: 320px 0 0 0;
}
}