*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  img{
      height:150px;
      width:100%;
    }
    
    div [class^="col-"]{
      padding-left:5px;
      padding-right:5px;
    }
    .card{
      transition:0.5s;
      cursor:pointer;
    }
    .card-title{  
      font-size:15px;
      transition:1s;
      cursor:pointer;
    }
    .card-title i{  
      font-size:15px;
      transition:1s;
      cursor:pointer;
      color:#ffa710
    }
    .card-title i:hover{
      transform: scale(1.25) rotate(100deg); 
      color:#18d4ca;
      
    }
    .card:hover{
      transform: scale(1.05);
      box-shadow: 10px 10px 15px rgba(0,0,0,0.3);
    }
    .card-text{
      height:80px;  
    }
    
    .card::before, .card::after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transform: scale3d(0, 0, 1);
      transition: transform .3s ease-out 0s;
      background: rgba(255, 255, 255, 0.1);
      content: '';
      pointer-events: none;
    }
    .card::before {
      transform-origin: left top;
    }
    .card::after {
      transform-origin: right bottom;
    }
    .card:hover::before, .card:hover::after, .card:focus::before, .card:focus::after {
      transform: scale3d(1, 1, 1);
    }
    .imgg{
      width: 600px;
      height: 300px;
      display: block;
      margin-right: auto;
      margin-left: auto;
      border-radius: 10px;
     
    }
    .head{
      color: beige;
      background: #425888;
      
      display: block;
     
     
      margin-right: auto;
      margin-left: auto;
     
  
    }
    .head:hover{
      background: #f8fdfd;
      color: #425888;
    }
    .parent{
      color: beige;
      background: #425888;
      width: 400px;
      height: 500px;
      display: block;
      margin-right: auto;
      margin-left: auto;
      justify-content: center;
      padding: 10px;
      border-radius: 15px;
      margin-top: 20px;
     
    }
    .parent ul{
      margin: 10px;
    }
  
    .moh{
     text-align: center;
    }
    .card-title{
      text-align: center;
        }
        @media (max-width:923px) {
          .paragraph p{
              display:  inline-block;
            
          }
          }
          @media (max-width:923px) {
            .parent{
              width: 90%;
              list-style-type: disc;
              
            }
            }
            @media (max-width:923px) {
                .paragraph p{
                    display:  inline-block;
                  
                }
                }
          @media (max-width:923px) {
              parent{
                  width: 50%;
                  height: 20%;
                 
                
              }
              }
              @media (max-width:923px) {
                row col{
                    width: 50%;
                    height: 20%;
                }}  
              .cont {
                display: grid;
                align-items: center; 
                grid-template-columns: 1fr 1fr 1fr;
                column-gap: 5px;
               }
               
               img {
                 max-width: 100%;
                 max-height:100%;
               }
               
               .text {
                 font-size: 70px;
               }
              ;
           
              .about .paragraph{
                margin-top: 30px;
                display: flex;
              }
             .imgg{
                display: block;
               margin: auto;
               width: 700px;
               border-radius: 8px;
               margin-top: 20px;
               
             }
             .logo2{
                width: 50px;
             }
             .land{
                width: 300px;
                justify-content: center;
                margin-right: 200px;
             }
           
            
            
             @media ( max-width:700px) {
                .about .paragraph{
                    display: block;
                   
                }
               .container.map{
                justify-content: center;
                align-items: center;
               }
               @media ( max-width:700px) {
                #contact{
                    align-items: center;
                   justify-content: center;
                   align-items: center;
                }
                .land{
                    
                   display: block;
                   margin: auto;
                  right: 50%;
                
                }
                @media ( max-width:703px) {
                    .land{
                        align-items: center;
                       justify-content: center;
                       align-items: center;
                       display: flex;
                       width: 50%;
            
                    }
                    @media (max-width:600px) {
                        .imgg{
                        width:90vw
                        }
                        .contact1 iframe{
                            width: 300px;
                            color: aqua;
                            display: block;
                            margin: auto;
                            margin-right:50px;
                            width: 600px;
                            height: 350px;
                            overflow: hidden;
                            border-radius: 15px 0;
                        }
                       
                        }
                        #map1 .adrees{
                            display: flex;
                            text-align: center;
                            align-items: center;
                            justify-content: center;
                            color: rgb(15, 101, 182);
                            margin-right: 40px;
                        }
                        @media ( max-width:703px) {
                            .land{
                                #map1 .adrees{
                                    text-align: center;
                                    align-items: center;
                                }
            
            
                            }}
                            .contcts{
                             
                                height: 100vh;
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                flex-direction: column;
                            }
                            
                    #contact{
                        min-height: 100vh;
                    }
                    @media(max-width:920px){
                        #contact .container
                        
                    {
                        
                         
                         overflow: hidden;
                         align-items: center;
                         justify-content: center;
                         width: 100%;
                        
                         
                    
                        }
                    }
                  
                        
                    }
                    
                    
                }
                
              
               
                    
                .cont{
                  
                 
                 background: #303030;
                 margin-left: auto;
                 margin-right: auto;
                 color: #82074a;
                 position: relative;
                 width: 100%;
                 }  
                 .mohata{
                  margin: 0 auto;
                  color: #82074a;
                 }  
               .crr .brr{
                margin-bottom: 40px;
                color: #82074a;
              
               }
             .card-body p{
              text-align: center;
             }
             #footer{
              background: #f7f7f7;
                padding: 3rem;
              /* padding-top: 5rem; */
              padding-top: 7rem;
                padding-bottom: 80px;
              background-image: url(https://arena.km.ua/wp-content/uploads/3538533.jpg);
            }
            #footer2{
              background: #f7f7f7;
                padding: 3rem;
                margin-top: 0px;
              /* padding-top: 5rem; */
              padding-top: 7rem;
                padding-bottom: 80px;
              background-image: url(../images/cards/v748-toon-111.png);
            }
            .logo-footer{
              /* max-width: 300px; */
            }
            .social-links{
              /* display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center; */
            
            }
            .social-links h2{
              padding-bottom: 15px;
              font-size: 20px;
                font-weight: 600;
            }
            .social-links img{
              padding-bottom: 25px;
            }
            .social-icons{
              /* display: flex;
                gap: 3rem; */
              display: flex;
                flex-direction: column;
                gap: 1rem;
              color: #fcfcfc;
            }
            .social-icons a{
              /* font-size: 18px; */
                /* background: #ffffff; */
                /* box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;
                padding: 0.4rem 1rem 0.4rem 1rem;
                border-radius: 3px;
              color: #82074a; */
              /* margin-right: 18px; */
              color: #fffcfc;
            }
            .social-icons a:hover{
              color: #000;
            }
            .social-icons a i{
              box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;
                padding: 0.4rem 1rem 0.4rem 1rem;
                border-radius: 3px;
                color: #82074a;
              font-size: 16px;
              margin-right: 12px;
            }
            li{
              list-style: none;
            }
            .useful-link h2{
              padding-bottom: 15px;
              font-size: 20px;
                font-weight: 600;
            }
            .useful-link img{
              padding-bottom: 15px;
            }
            .use-links{
              line-height: 32px;
            }
            .use-links li i{
              font-size: 14px;
                padding-right: 8px;
                color: #faf5f5;
            }
            .use-links li a{
              color: #303030;
                font-size: 15px;
                font-weight: 500;
              color: #fffefe;
            }
            .use-links li a:hover{
              color: #000;
            }
            .address h2{
              padding-bottom: 15px;
              font-size: 20px;
                font-weight: 600;
            }
            .address img{
              padding-bottom: 15px;
            }
            .address-links li a{
              color: #ffffff;
                font-size: 15px;
                font-weight: 500;
              color: #ffffff;
            
            }
            .address-links li i{
              font-size: 16px;
                padding-right: 8px;
              color: #82074a;
            
            }
            .address-links li i:nth-child(1){
              padding-top: 9px;
            }
            .address-links .address1{
              font-weight: 500;
                font-size: 15px;
              display: flex;
            }
            .address-links{
                  line-height: 32px;
                color: #fff8f8;
            }
            .copy-right-sec{
              padding: 1.8rem;
                background: #82074a;
                color: #fff;
                text-align: center;
            }
            .copy-right-sec a{
              color: #fcd462;
                font-weight: 500;
            }
            a{
              text-decoration:none;
            }
            
            /* footer section end */
                
          .container1{
            background: #425888;
            display: flex;
          }
          .radio-btns {
            display: grid;
            gap: 4px;
            grid-template-columns: repeat(3, 100px);
          }
          
          .radio-btns:hover .radio-btns__btn:not(:hover) {
            filter: grayscale(100%);
            opacity: 0.75;
          }
          
          .radio-btns:hover .radio-btns__btn:not(:hover)::after {
            background-color: rgba(#000, 0.5);
          }
          
          @media (min-width: 30rem) {
            .radio-btns {
              grid-template-columns: repeat(3, 150px);
            }
          }
          
          .ved{
       display: block;
       margin-left: auto;
       margin-right: auto;
       background: #000;
       color: #000;
          }
          @media (min-width: 30rem) {
            video {
          width: 80%;
          height: 200px;
            }
          }
          .conta{
            border-radius: 20px;
            margin-top: 30px;
          }
          @media(max-width:920px){
           video{
            width: 100%;
           }
            
          }
         
          }
          footer span{
            color:var(--secondray-color)
          }
          .btn{
              position:sticky;
              bottom:20px;
              right:7px;
              width: 20px;
              /* height:20px; */
              color:rgb(14, 153, 207);
              display:block;
              /* background-color: antiquewhite; */
        
          }
          .about .paragraph{
            margin-top: 30px;
            display: flex;
          }
         .imgg{
            display: block;
           margin: auto;
           width: 700px;
           border-radius: 8px;
           margin-top: 20px;
           
         }
         .logo2{
            width: 50px;
         }
         .land{
            width: 300px;
            justify-content: center;
            margin-right: 200px;
         }
        
         @media ( max-width:700px) {
            .about .paragraph{
                display: block;
               
            }
           .container.map{
            justify-content: center;
            align-items: center;
           }
           @media ( max-width:700px) {
            #contact{
                align-items: center;
               justify-content: center;
               align-items: center;
            }
            .land{
                
               display: block;
               margin: auto;
              right: 50%;
            
            }
            @media ( max-width:703px) {
                .land{
                    align-items: center;
                   justify-content: center;
                   align-items: center;
                   display: flex;
                   width: 50%;
        
                }
                @media (max-width:600px) {
                    .imgg{
                    width:90vw
                    }
                    .contact1 iframe{
                        width: 300px;
                        color: aqua;
                        display: block;
                        margin: auto;
                        margin-right:50px;
                        width: 600px;
                        height: 350px;
                        overflow: hidden;
                        border-radius: 15px 0;
                    }
                   
                    }
                    #map1 .adrees{
                        display: flex;
                        text-align: center;
                        align-items: center;
                        justify-content: center;
                        color: rgb(15, 101, 182);
                        margin-right: 40px;
                    }
                    @media ( max-width:703px) {
                        .land{
                            #map1 .adrees{
                                text-align: center;
                                align-items: center;
                            }
        
        
                        }}
                        .contcts{
                         
                            height: 100vh;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            flex-direction: column;
                        }
                        
                #contact{
                    min-height: 100vh;
                }
                @media(max-width:920px){
                    #contact .container
                    
                {
                    
                     
                     overflow: hidden;
                     align-items: center;
                     justify-content: center;
                     width: 100%;
                    
                     
                
                    }
                }
              
                    
                }
                .ddress-links li{
                  list-style: none;
                }
                
                .card {
                box-shadow: 25 25 25 0.25;
                }
                .imgg{
                  display: block;
                  margin-right: auto;
                  margin-left: auto;
                }
               
        .ip{
         filter: grayscale(0%);
         transition: .5s ease-in-out;
         border-radius: 20px;
      
        }
        .ip:hover{
          filter: grayscale(100%);
          transform: rotate(1145deg);
          transform: scale(1.3);
          z-index: 2;
        }
        @media (max-width:923px) {
          .ip{
        width: 70%;
          display: block;
          margin-left: auto;
          margin-right: auto;
            
          }

        }

