@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

body{
    background-color:#ffe6ca;
    color: #666;
    direction: ltr;
    font-family: 'Oswald', sans-serif !important;
    
    
}
 img{
max-width: 100%;
}

.btn-1 {   
   background-color: #FFFFFF;
  border-radius: 48px;
  border-style: none;
  box-shadow: #ADCFFF 0 -12px 6px inset;
  box-sizing: border-box;
  color: #000000;
  cursor: pointer;
  display: inline-block;
  font-family: -apple-system,sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.24px;
  margin: 0;
  outline: none;
  padding: 13px 15px; 
  text-align: center;
  text-decoration: none;
  transition: all .15s;
 
}
.btn-1:hover {
  background-color:#caedfa;
  box-shadow: #c1e3f0 0 -6px 8px inset;
  transform: scale(1.125);
}
.btn-2 {
    background:#cedaec;
    padding: 13px 13px;
    border: 1px solid #4b4f55;
    color: #1d1e20;
    border-radius: 3px;
    position: relative;
    display: inline-block;
    font-weight:700;
    font-size: 15px;
    text-transform: uppercase;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.btn-2:hover,.btn-2:focus {
   background: #4328b7;
    color: #fff;
    border: 1px solid #4328b7;
} 
.btn-3 {
  appearance: button;
  background-color: #1899D6;
  border: solid transparent;
  border-radius: 13px;
  border-width: 0 0  2px;
  box-sizing: border-box;
  color: #FFFFFF;
  cursor: pointer;
  display: inline-block;
  font-family: din-round,sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .8px;
  line-height: 20px;
  margin: 0;
  outline: none;
  overflow: visible;
  padding: 13px  13px;
  text-align: center;
  text-transform: uppercase;
  touch-action: manipulation;
  transform: translateZ(0);
  transition: filter .2s;
  user-select: none;
  -webkit-user-select: none;
  vertical-align: middle;
  white-space: nowrap;
  
}

.btn-3:after {
  background-clip: padding-box;
  background-color: #1CB0F6;
  border: solid transparent;
  border-radius: 13px;
  border-width: 0 0 2px;
  bottom: -4px;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}

.btn-3:main,
.btn-3:focus {
  user-select: auto;
}

.btn-3:hover:not(:disabled) {
  filter: brightness(1.1);
  -webkit-filter: brightness(1.1);
}

.btn-3:disabled {
  cursor: auto;
}
.btn-4 {
      background: #4328b7;
    padding: 13px 32px;
    border:  1px solid #4328b7;
    color: #fff;
    border-radius: 13px;
    font-size: 15px;
    display: inline-block;
    font-weight: 700;
    position: relative;
    text-transform: uppercase;    
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}



.btn-4:hover,.btn-4:focus {
  background: #1b2032;
 color: #fff;
border: 1px solid #1b2032;
}
.btn-5 {
    border-radius: 19px;
        font-size:  13px;
    color: white;
    transition: .2s linear;
    background: #0B63F6;
   padding:  13px 17px; 
}

.btn-5:hover {
   box-shadow: #003CC5 0 0px 0px 34px inset;
}                
.razmer{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.input-btn__layoutitem{
    margin: 12px 0px;
    display: block;
    width: 100%;
    padding:  12px 17px;
    font-size: 16px;
    font-weight:  700;
    line-height: 1.3;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 9px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.textarea-btn__layoutitem{
    border: 1px solid #ced4da;
    border-radius: 9px;
     padding:  12px 17px;
    width: 100%;
    font-size: 16px;
}

p{
    padding: 0;
    margin: 0;
}
address{
    margin: 0;
}
h1,h2,h3,h4,h5,h6{
    margin: 0;
}
a{
    word-break: break-all;
    text-decoration: none;
    color: inherit;
}
ul{
list-style: none;
margin: 0;
padding: 0;
}
.site {
    background-color:#ffe6ca;
 }
.site-header{
   
    margin-bottom: 29px;
    padding-top: 29px;
    

 }
 .site-branding{
    text-align: center;    
    border-bottom: 2px dotted #eee;
    padding-bottom: 23px;
 }

.header-title{
    font-size: 21px;
    line-height: 1;
    font-weight: 800;
    
}
.navbar{
    border-bottom: 2px dotted #eee;
    font-weight: 700;
    letter-spacing: 1px;
    
    padding-top: 20px;
    padding-bottom: 20px;
    text-transform: uppercase;
    text-align: center;
}
.navbar-toggler{
    margin-left: auto;
    margin-right: auto;
    width: auto;
}
.navbar-nav{
    text-align: start;
    justify-content: space-around;
}
.dropdown-menu[data-bs-popper]{
border: 2px;
box-shadow: 0 0 29px rgb(0 0 0 / 9%);
z-index: 5;
width: 500px;

}
@media(max-width: 800px){
    .dropdown-menu[data-bs-popper]{
        width: 100%;
    }
}
.dropdown-item{
    white-space: normal !important;
}

.custom-header{
border-radius: 3px;
margin: 0 auto;
color: #ffff;
height:  356px;

background-image:linear-gradient( to right, rgba(47, 48, 58, 0.5), rgba(47, 48, 58, 0.5) ), url(pics/body-bg_q950.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 29px;
display: flex;
align-items: center;
 

}
.container-main{
    margin-top: 34px;
}
.wrapper{
    width: 100%;
    display: flex;
    gap: 19px;
    flex-direction:  row;
   
}
.content{
    flex: 3;
    
    
}
.sidbar{
    flex: 1;
    
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 58px;    
    
}
.wpapper_blok{
    display: flex;
 gap: 58px; 
}
.post:not(:last-child){
     margin: 0 0 48px;    
}
.post{       
    border: 2px dotted #eee;   

}
.post-img{
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;    
    height: 356px;
  

}
.post-img img{
    display: block;   
    border-radius: 3px;
}
.post-text{
    flex: 1;
}
.post-content{
    width: 100%;
    display: flex;
    flex-direction: row-reverse;
    gap:  17px;
    
}
.post-title{
    font-size:  29px;
    text-align: center;
    margin-bottom: 12px;
}
.post-subtitle{
    font-size: 23px;
    margin-bottom: 12px;
    text-align: start;
}  
.entry-meta{
    font-size: 13px;
    font-weight: 700;
    line-height: 2.09231em;
    margin: 0 0 29px;
    letter-spacing: 1px;
    text-transform: uppercase;   
    display: flex;
    gap:  12px;
    flex-wrap: wrap;
    justify-content:  center;
}

.post-text{
   
    line-height: 2.09231em;
     letter-spacing: 1px;

}
.post-rating{
    display: flex;
    justify-content: space-between;
    margin-top: 29px;
}
.post-btn{
    display: flex;
    align-items: center;
    gap: 9px;
  transition: all .15s;

}
.post-btn:hover{
   
    color: #ff0000;
}
.footer{   
    width: 100%;
    margin: 23px 0 0;
    padding:  13px 0 13px;
    text-align: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #999;
    border-top: 2px dotted #eee;
}
.subscribe{
    text-align: center;
   

}
.form-sidbar{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap:  12px;
  
}
.form-label{
    text-align: start;
}
.form-control::placeholder{
    font-size: 13px;
}
.gallery{    
    overflow: hidden;
    text-align: center;
}
.gallery-list{
    display: grid;
    grid-gap: .5rem;
    grid-auto-columns: 1fr;
    grid-template-columns: repeat(2,1fr);
}
@media(max-width: 600px){
    .gallery-list{
        grid-template-columns: repeat(1,1fr);
    }
}
.gallery-list li{
    overflow: hidden;
}
.gallery-list li:hover img{
     transform: scale(1.13, 1.13);
}
.gallery-list img{
    width: 100%;
    object-fit: cover;
    height: 100%;
    border-radius: 3px;
    transition: all 0.6s ease-in-out;
}

.category-item{
    margin: 0;
    padding-top: 9px;
    padding-bottom: 9px;
    list-style: none;
    border-top: 2px  dotted #eee;

}
.contact-list{
    display: flex;
    flex-wrap: wrap;
    
}
.contact-item{

    word-break: break-all;
    display: flex;
    gap: 9px;
    width: 100%;
    align-items: center;
    padding-top: 9px;
    padding-bottom: 9px;
    border-top: 2px  dotted #eee;
    transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1);
}
.contact-item:hover{
    color: #2196f3;
}
.title-sidbar{
    text-align: center;
    margin-bottom: 23px;   
    font-size: 19px;
    font-weight: 700;
    transition: all 0.6s ease-in-out;
}
.title-sidbar:hover{
     transform: scale(1.13, 1.13);
}
.page-img{
     flex: 1;
    display: flex;
    justify-content: center;
    order: 0;
   
}
.page-img img{
    object-fit: contain;   
    width: 100%;
    border-radius: 3px;

}


.post-rating i{
    font-size: 21px;
} 
.page{
   background-color: #fff5ea1a;
    padding:12px;

}
.imges{
max-height: 356px;
  object-fit: contain;
  border-radius: 20px;
  float: right;
  width: 38%;
  margin: 17px;
  margin-top: 0;
  margin-right: 0;  
    
}
@media (max-width: 768px){
.imges{
    float: none;
    width:100%;
    margin: 0 0 19px 0; 
  }
}

.text-pege p{
 margin-bottom: 9px;
  text-indent: 3ch; 
}
.page-rating{
    display: flex;
    margin-top: 29px;
    justify-content:  space-between;
    gap:  29px;
    
    
}
.rating-icon{
    display: flex;
    gap: 19px;
}
.title-page{
    font-weight:700;
    text-align: center;
}
.content-box{
    word-wrap: break-word;
}
.content-box p{
 margin-bottom: 9px;
  text-indent: 3ch; 
}
.content-box h1{
    font-weight: 800;
    text-align: center;
    margin-bottom:  22px;
}
.content-box h2{
    font-weight: 700;
    text-align: center;
    margin-bottom:17px ;
}
.content-box ul li,
.content-box ol li {
  margin-bottom: 5px;
}
.content-box ul,
.content-box ol {
  margin-bottom: 13px;
  padding-left:  19px;
  list-style: inside;
}
.content-box a,.content-box table{
color: inherit;
}
.logo{
     text-align: center;
    padding: 12px 0px 12px;
}
.logo-link{
    display: flex;
    align-items: center;             
    text-align: center;
    gap: 19px;
    justify-content: center;
}
.logo-link img{
width: 50px;
height: 50px;
}
.footer-politik{
    color: #000;
    display: flex;
    font-size: 12px;
    flex-wrap: wrap;
    justify-content: space-around;
    margin:17px 0;
    gap: 12px;
}

.com-add{
     display: none;
}
.form-coment{
    margin-top: 60px;
}
.title-com{
     text-align: center;
    font-weight: 700;
    font-size: 19px;    
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-bottom: 29px;
}
.comments-list{
    display: flex;
    flex-direction:  column-reverse;
    gap: 23px;
}
.comments-item{
      padding: 29px 0px 23px;
    border-top: 2px dotted rgb(235, 235, 235);
    display: flex;
    
    gap: 23px;
    flex-direction: column-reverse;
}
.comment-user-info{
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap:  17px;
    justify-content: center;
    align-items: center;
    
}
.comment-user-info h3{
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;   
}
.comment-user-info img{
   width: 98px;
height: 98px;
border-radius: 0%;
}
    
.comment-user-data{
    flex: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 19px;
}
.comment-user-data__header{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.price{
     display: flex;
     color: #ff0000;
    gap:  9px;
    font-size: 19px;
    font-weight: 700; 
}
.map-box{
padding-top:  60px;   

}
iframe {
height: 100%;
height: 482px;
}
.bg-contact{
    gap:  19px;
    border-top: 2px dotted #dac7c7;
    padding-top: 12px;
    padding-bottom: 12px;
}
.contact-infa{
    display: flex;
    gap: 17px;
    align-items: center;
    flex-direction: row;
}
.contact-infa h4{
    font-size: 19px;
    margin-bottom: 0;
}
.title-contact{
    font-size: 32px;
    text-align:  center;
    margin-bottom: 36px;
    
}
.form-box{
   padding-top: 32px;
    padding-bottom: 32px;
    border-top: 2px dotted #dac7c7;
     border-bottom: 2px dotted #dac7c7;


}
.form-wrapper label{
    margin-bottom:  12px;
    float: none;
    font-weight:800;
    display: block;
}

.box_label a{
color: inherit;
}
.related-list{
    display: flex;
    gap: 19px;
    flex-direction: column;
}
.related-item{
    flex: 1;
    display: flex;
    width: 100%; 
    flex-direction:  row;
    gap: 17px;
    justify-content: start;
    align-items: center;    
    border-radius:  6px;
     border: 2px dotted #dac7c7;
        
    padding: 12px;
}
.related-item:nth-child(2n){
    flex-direction: row-reverse;
}
.related-title{
    font-size: 19px;
    font-weight: 700;
}

.related-item img{
    max-width: 192px;
    max-height: 192px;
    border-radius: 3px;
}

.related-title{
    font-size: 19px;
}
.entry-meta-page{
 margin-bottom: 9px;
}
.btn-contact {
    margin-top: 12px;
} 
.icon{
    display: flex;
    gap: 9px;
    align-items: center;
} 
  @media (max-width: 575px){

    button{
        width: 100%;
    }
    .post-title{
        font-size: 19px;
    }
    .post-text{
        letter-spacing:0px
    }
    .imges{
        float:none;
        max-width: 100%;
    }
    .post-rating i{
        font-size: 13px;
    }
    .comments-item{
        flex-direction:  column-reverse;
    }
    .rating-icon{
        font-size:  13px;
        gap:  9px;
    }
    .price{
        font-size:  13px;
    }
    .page-rating {
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
        
    }
    .logo-link {
        justify-content: center;
    }
    .contact-infa {
        flex-direction: column;
        align-items: start;

    }
    .contact-infa h4{
        font-size: 19px;
    }
    .related-item{
        flex-direction: column;
    }
    .related-item:nth-child(2n) {
        flex-direction: column;

    }
}
@media (min-width: 768px){
    .comment-user-info {
        flex-direction: column;
    }
}
@media (max-width: 768px){
    .wrapper{
        flex-direction: column;
        gap: 48px;
    }
    .content{
    flex: 1;
    }
    .sidbar{
        gap: 48px;
    }
    .wpapper_blok{
        gap: 48px;
    }
    .post-content{
        align-items: center;
        flex-direction: column-reverse;

    }

    .form-control{
        width: 90%;
    }
    .contact-list{
        flex-direction: column-reverse;
    }
.dropdown-item a{
    white-space: initial;

        }
}