@font-face {
    font-family: myFont; 
    src: url(KtavYadCLM-BoldItalic.ttf);
}
header img{
width: 13%;
margin: 0 auto;
display: block;
padding-top: 15px;
}
body
{
   font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;  
   scroll-behavior:smooth;
   background-color: #fad9d2;
}
.video-container {
    width: 60%;
    margin: 0 auto;
    display: block; 
    position: relative;
}
.responsive-padding {
    padding: 35% 0 0 0;
    position: relative;
    padding-top: 0%;
}
nav{
    width: 60%;
    margin: 0 auto;
    display: block;
    direction: rtl;
}
nav a{
    display: inline-block;
    text-decoration: none;
    color: #A47B2D;
    text-align: center;
    font-weight: bold;
    font-size: 17px;
    width: 16%;
    padding: 2% 0.5%;
}
nav a:hover{
    text-decoration: underline;
}
footer{
    margin: 5% auto;
}
footer ul{
list-style-type: none;
}
footer ul li{
display: inline;
margin: 0 1%;
}
footer ul{
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 10px;
    margin: 0;
}
footer ul li {
    margin: 0 10px;
}
footer ul img {
    width: 45px; 
}
footer b{
text-align: center;
display: block;
color: black;
font-size: 20px;
}
footer .rights{
font-weight:400;
text-align: center;
display: block;
color: black;
font-size: 18px;
}
footer button{
    margin: 0 auto;
    display: block;
    margin-bottom: 2%;
}
.card-img-top
{
    width: 100%;
}
.card-title
{
    text-align: right;
}
.card-text
{
    text-align: right;
}
.card
{
    width: 100%;
    margin: 0 auto;
    margin-top: 10px;
    display: inline-block;
}
main
{
    width: 60%;
    margin: 0 auto;
    display: block;
    padding-top:20px;
}
::marker
{
    content: none;
}
.card1 {
    border: 2px solid #A47B2D;   
    width: 30%;
    display: inline-block;
    margin: 10px 1%;
    margin-top: 0%;
    box-shadow: #A47B2D 0 0 15px;
    overflow: hidden;
    background-color: #A47B2D;
    position: relative;
}
.card1 b {
    text-align: right;
    font-size: 25px;
    color: white;
    background-color: #A47B2D;
    right: 0;
    padding: 3px;
    direction: rtl;
    font-weight: lighter;
}
.card1 .image-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.card1 .image-container img {
    display: block;
    width: 100%;
    height: auto;
}
.card1 .image-container .placeholder {
    display: block;
}
.card1 .image-container .actual-image {
    display: none;
}
.title {
    position: absolute;
    right: 0;
    bottom: 25px;
}
.card1 p {
    text-align: right;
    margin-right: 4%;
    font-size: 20px;
}
.card1 a {
    text-decoration: none;
    color: white;
}
.carousel-control-next-icon {
    background-color: #A47B2D;
}
.carousel-control-prev-icon {
    background-color: #A47B2D;
}
.carousel-inner {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.carousel-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease, opacity 0.3s ease !important;
    will-change: transform, opacity;
}
.carousel-item.active {
    position: relative;
}


article{
    width: 100%;
    display: block;
    text-align: center;
    padding: 30px;
    direction: rtl;
}
article h1{
    font-size: 45px;
    padding: 10px;
    padding-bottom: 20px;
    color: #A47B2D;
    font-family: myFont; 
    word-spacing: -10px;
}
article p{
    font-size: 30px;
}
article a{
    text-decoration: none;
    color: black;
}
article .contact
{
    padding-bottom: 15px;
}
article a:hover{
    text-decoration: underline;
    color: black;
}

button
{    
    background-color: #A47B2D;
    border-radius: 8px;
    border-style: none;
    box-sizing: border-box;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 20px;
    font-weight: 500;
    height: 4rem;
    padding: 0 1.6rem;
    text-align: center;
    text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
    transition: all .5s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    
}
button:hover
{
    box-shadow: #A47B2D 0 1px 30px;
    transition-duration: .1s;
}
button a{
    text-decoration: none;
    color: white;
}
button a:hover{
    text-decoration: underline;
    color: white;
}
.info{
    display: flex;
    width: 60%;
    margin: 20px auto;
    border: 2px solid #A47B2D;
    background-color: #A47B2D;
    box-shadow: #A47B2D 0 0 15px;
}
.info img{
    width: 40%;
}
.info aside{
    display: inline-block;
    text-align: right;
    padding-top: 5%;
    width: 58%;
}
.info b{
    font-size: 25px;
    color: white;
    text-align: center;
    display: block;
    direction: rtl;
    font-family: myFont; 
    word-spacing: -9px;
}
.info p{
    font-size: 16px;
    color: #FEFBD8;
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: lighter;
    direction: rtl;
}
.info span{
    font-size: 14px;
    color: #FEFBD8;
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: lighter;
    direction: rtl;
    
}
@media screen and (max-width: 1660px)
{
    header img{
        width: 15%;
        padding-top: 10px;
    }
    .video-container {
        width: 80%;
        margin: 0 auto;
        display: block; 
        position: relative;
    }
    main{
        width: 80%;
        padding-top: 0;
        height: 100%;
    }
    .info{
        width: 70%;
        margin: 0 auto;
    }
    
}
@media screen and (max-width: 1536px)
{
    nav{
        display: none;
    }
    header img{
        width: 17%;
        padding-bottom: 10px;
    }
}
@media screen and (max-width: 1280px)
{
    header img{
        width: 20%;
    }
    .video-container {
        width: 90%;
    }
    main{
        width: 90%;
    }
    .info{
        width: 80%;
    }

}
@media screen and (max-width: 1024px)
{
    header img{
        width: 25%;
        padding-top: 0px;
    }
    .video-container {
        width: 95%;
    }
    main{
        width: 95%;
    }
    .card1{
        width: 47%;
        margin: 1% 1% 1% 1%;
    }
    .info{
        display: block;
        width: 85%;
        margin: 0 auto;
    }
    .last{
        display: block;
        margin: 0 auto;
        margin-bottom: 2%;
    }
    .info img{
        content: url('https://i.ibb.co/6Jw0Ghv/F24-B6173-1-new.jpg');
        width: 100%;
    }
    .info aside{
        width: 100%;
    }



}
@media screen and (max-width: 768px) {
    header img{
        width: 30%;
    }
    .video-container {
        width: 100%;
        margin: 0 auto;
        display: block; 
        position: relative;
    }
    article h1
    {
        font-size: 35px;
        padding-top: 0;
    }
    article p
    {
        font-size: 25px;
    }
    main{
        width: 100%;
        padding-top: 0;
        height: 100%;
    }
    .card1{
        width: 90%;
        margin: 0 auto;
        display: block;
        margin-bottom: 20px;
        height: 100%;
    }
    .last{
        width: 90%;
        margin: 0 auto;
        display: block;
        margin-bottom: 20px;
        height: 100%;
    }
    .card1 b{
        font-size: 30px;
    }
}
@media screen and (max-width: 540px)
{
    .card1 b{
        font-size: 25px;
    }
    article h1
    {
        font-size: 30px;
    }
    article p
    {
        font-size: 20px;
    }
    button
    {
        font-size: 20px;
        padding: 0 1rem;
        height: 3rem;
    }

}
@media screen and (max-width: 470px)
{
    header img{
        width: 35%;
    }
    article
    {
        padding: 15px;
    }
    article h1
    {
        font-size: 25px;
        padding-bottom: 3%;
    }
    article p
    {
        font-size: 18px;
    }
    .card1 b{
        font-size: 25px;
    }
    article
    {
        padding-bottom: 20px;
    }
}
@media screen and (max-width: 420px)
{
    article h1
    {
        font-size: 22px;
    }
    article p
    {
        font-size: 15px;
    }
    .card1 b{
        font-size: 20px;
    }
}
@media screen and (max-width: 345px)
{
    article h1
    {
        font-size: 18px;
    }
    article p
    {
        font-size: 15px;
    }
    .card1 b{
        font-size: 15px;
    }
    button
    {
        font-size: 15px;
    }
}