Files
Wedding-invitation/style.css
2026-01-07 20:45:52 +03:00

239 lines
4.9 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* --------------------------------Font-------------------------------- */
@font-face {
font-family: "MurreyC";
src: url("fonts/MurreyC/murreyc.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "MurreyC";
src: url("fonts/MurreyC/murreyc.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "MurreyC";
src: url("fonts/MurreyC/murreyc.eot") format("eot");
font-weight: 400;
font-style: normal;
font-display: swap;
}
/* --------------------------------MAIN-------------------------------- */
body {
background: url("images/ChatGPT\ Image\ 5\ янв.\ 2026\ г.\,\ 15_49_39.png") no-repeat 100% 100% fixed;
background-size: cover;
font-family: "MurreyC";
font-size: 16px;
font-weight: 400;
letter-spacing: 3px;
height: auto;
}
button {
background-color: #3a1f09;
padding: 0 15px;
border-radius: 33px;
transition: all .1s;
color: #e5b97e;
box-shadow: #3a1f09 2px 4px 10px 2px;
}
button:hover {
background-color: #f0c590;
color: #b06029;
transform: scale(1.015);
}
img {
max-width: 100%;
}
/* -------------------------------HEADER------------------------------ */
.header {
width: 100%;
background-color: #663c24;
padding: 20px 180px;
margin-top: 40px;
margin-bottom: 40px;
box-shadow: #3a1f09 2px 4px 10px 2px;
}
.nav {
}
.menu {
display: flex;
justify-content: space-between;
}
.item {
color: #e7b15c;
font-size: 36px;
font-weight: 900;
transition: all .3s;
text-shadow: 1px 2px #322624;
}
.item:hover {
}
.link {
transition: all .3s;
}
.link:hover {
text-decoration: underline;
}
/* --------------------------------Welcome----------------------------- */
.content {
}
.heading {
background: url("images/25.png") 50% 100% / cover;
margin: 0px 400px;
/* border: 10px solid rgb(184, 136, 48); */
/* border: 15px double rgb(184, 136, 48); */
height: 640px;
box-shadow: #000000 2px 4px 10px 2px;
}
.heading_content {
padding: 15px 100px;
}
.heading_cont {
position: relative;
z-index: 1;
padding: 20px 0px 20px 0px;
text-align: center;
box-shadow: #000000 2px 4px 10px 2px;
}
.heading_cont::after {
z-index: -1;
position: absolute;
content: "";
display: block;
background-color: rgba(184, 136, 48, 0.8);
height: 100%;
width: 100%;
top: 0;
border: 1px solid #42240c;
}
.heding_title {
font-size: 42px;
font-weight: 900;
/* text-decoration: underline; */
}
.heading_info {
font-size: 36px;
font-weight: 700;
text-transform: uppercase;
/* color: #eccfae; */
}
.heading_date {
font-size: 32px;
font-weight: 700;
border-top: 3px solid #000;
border-bottom: 3px solid #000;
/* background-image: linear-gradient(to left, rgb(66, 36, 12), rgb(184, 136, 48)); */
}
.heading_text {
font-size: 26px;
padding: 0 20px;
font-weight: 700;
}
.btn_share {
margin-top: 10px;
font-size: 30px;
}
.asise {
}
.time{
padding-top: 15px;
font-size: 110px;
text-align: center;
background-image: linear-gradient(90deg,rgba(26, 21, 26, 1) 0%, rgba(101, 62, 39, 1) 50%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
text-shadow: #000 2px 2px 6px;
}
/* -----------------------------------PEOPLE-------------------------------------- */
.people {
width: 1400px;
margin: 0 auto;
padding-bottom: 40px;
}
h4 {
display: block;
border-top: 3px solid #000;
border-bottom: 3px solid #000 ;
font-size: 60px;
text-align: center;
font-weight: 900;
width: 30%;
margin: 0 auto;
line-height: 1.2;
margin-bottom: 40px;
}
.newlywed {
display: flex;
justify-content: space-between;
gap: 40px;
width: 100%;
margin-bottom: 40px;
}
.newlywed_item {
display: flex;
align-items: center;
background-color: rgba(245, 198, 124, 0.9);
padding: 20px;
box-shadow: #000000 2px 4px 10px 2px;
}
.img_newlywed {
width: 40%;
width: 240px;
height: 240px;
border-radius: 50%;
border: 1px solid #47312c;
}
.newlywed_text {
margin-left: 20px;
width: 60%;
}
.newlywed_title {
font-size: 34px;
font-weight: 700;
text-decoration:underline;
line-height: 1.5;
}
.newlywed_info {
font-size: 26px;
}
.guest_list {
width: 100%;
}
table {
table-layout: fixed;
background-color:#e5b97e;
border-collapse: collapse;
box-shadow: #000 2px 4px 10px 1px;
width: 100%;
border: 1px solid #000;
}
.table_title {
font-size: 35px;
font-weight: 900;
line-height: 2.2;
text-decoration: underline;
border: 3px solid #000;
}
.table_name {
font-size: 30px;
}
th, td {
border: 2px solid #000;
height: 50px;
font-size: 28px;
text-align: center;
}