@import url('https://fonts.googleapis.com/css2?family=Mochiy+Pop+One&display=swap');
    * {
        padding: 0;
        margin: 0;
        /*overflow-x: hidden;*/
        font-family: sans-serif;
        
    }
    * { 
    -webkit-tap-highlight-color: transparent;
        
    }
    
    body {
        width: 100%;
        max-width: 100%;
        /*overflow-x: hidden;*/
        min-height: 100vh;
    }
    .NavHeader {
      position: fixed; 
      width: 100%;
      max-width: 100%;
      height: auto;
      background: white;
      z-index: 1000;
    }
     .header_fixed {
        position: fixed;
        left: 0;
        top: 0;
        max-width: 100%;
    }
    .contentHeader {
        width: 80%;
        max-width: 100%;
        height: auto;
        padding-top: 1rem;
        margin: auto;
        
        
        justify-content: center;
        color: rgb(12, 12, 12);
        font-size: 15px;
        font-weight: 400;
        background: white;
       /* -ms-box-orient: horizontal;
        -moz-box-orient: horizontal;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-box-direction: normal;
        -moz-box-direction: normal;*/
        flex-direction: row;
        /*flex: 1 1 0%;*/
        flex-grow: 1;
        flex-shrink: 1;
        flex-basis: 0%;
        -webkit-box-align: center;
        -ms-box-align: center;
        -moz-box-align: center;
        align-items: center;
       /* -webkit-box-pack: end;
        -ms-box-pack: end;
        -moz-box-pack: end;*/
        /*justify-content: flex;*/
    }
    .contentHeaderTop {
        display: flex;
        margin: auto;
        justify-content: center;
        border-bottom: 1px solid gray;
        width: 100%;
        max-width: 100%;
    }
    .logo {
       background: inherit;
       width: 10%; 
       min-width: 7.5rem;
       max-width: 9em;
       height: 5rem;
      
       text-align: left;
       margin-left: 0;
      
    }
    .logo a {
        -webkit-tap-highlight-color: transparent;
    }
    .logoimg {
        width: 100%;
        height: 5rem;
        background-size: cover;
        background-size: contain;
    }
    .contact_adress {
        padding-top: 0.5rem;
        width: 40%;
        height: auto;
        text-align: center;
        justify-content: center;
        display: flex;
       
    }
    .contact_adress_content {
        margin-top: 5px;
        display: flex;
        justify-content: left;
        background: white;
        margin-right: 10px;
        
    }
    .adress {
        color: #05063c;
        padding-top: 10px;
        width: auto;
        font-size: 15px;
        font-family: Haettenschweiler, 'Arial Narrow Bold', sans-serif ;
    }
    .contact_tel {
        width: 30%;
        min-width: 11.5rem;
        text-align: center;
       
        font-family: Haettenschweiler, 'Arial Narrow Bold', sans-serif;
        justify-content: center;
      
    }
    .contact_tel_content {
        display: flex;
        padding-left: 5px;
        margin-top: 22px;
        font-size: 20px;
        color: #050519;
        cursor: pointer;
    }
    .linkphone {
        text-decoration: none;
        color: #05063c;
        cursor: pointer;
    }
    .linkphone:hover {
        color: #192d92;
        transition: 2s;
       
    }
 
    .contact_contact {
        width: 20%;
        min-width: 8rem;
        height: auto;
        font-size: 16px;
        color: rgb(7, 7, 60);
        display: flex;
        justify-content: flex-end;
        background: white;
        /*border: solid 1px;
        border-color: #f44336 #2196f3 #4caf50 #ff9800;*/
        padding-bottom: 8px;
    }
    .contact_contact_content {
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
        border-radius: 3px;
        background: rgb(252, 251, 250);
        width: 5.5rem;
        height: 36px;
        text-align: center;
        justify-content: center;
        margin: auto;
        padding-left: 3px;
        padding-right: 3px;
        /*padding-left: 10px;
        margin-top: 17px;*/
        display: flex;
        align-items: center;
        /*margin-right: 20px;*/
        cursor: pointer;
        }
    .contact_contact_content a {
        -webkit-tap-highlight-color: transparent;
    }    
    .contact_contact_content:hover {
        border-radius: 5px;
        /*border-bottom: solid 0.5px rgb(119, 106, 106);
        border-top: solid 0.5px rgb(119, 106, 106);*/
        background: white;
        box-shadow: rgba(17, 17, 17, 0.35) 0px 5px 15px;
        transition: 0.5s;
      
    }    
    .contact_contact_content a {
        text-decoration: none;
        /*margin-top: 6px;*/
        color: #05063c;
        text-align: center;
            
        }
      
    .links_button {
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: 40px;
        justify-content: center;
       display: flex;
       flex-wrap: wrap;
       border-bottom: solid 1px gray;
       background: white;
       
    }
    .game, .college, .contests {
        width: 20%;
        padding: 10px;
        height: auto;
        margin: 10px 20px 10px 20px;
       text-align: center;
       font-size: 17px;
       justify-content: center;
       border: solid 0.5px rgb(59, 58, 63);
       background: white;
       border-radius: 2px/2px; 
       position: relative;
       overflow-x: hidden;
       text-transform: uppercase;
       box-shadow: rgba(60, 64, 67, 0.3) 0 1px 2px 0, rgba(60, 64, 67, 0.15) 0 2px 6px 2px;
    }


    /*.contests.active, .game.active, .college.active {
        background: rgb(250, 126, 48);

    }*/
    /*.links_button .active {
        font-weight: 300;
        background: whitesmoke;
        
        
    }*/
   
    .links_button .college .active {
       /*color: #fa183d;*/
       color: #e52b50;
    }      
    .links_button .game .active {
        color: #e52b50;
    }
    .links_button .contests .active {
        color: #e52b50;
    }        
    


    .a_game, .a_college, .a_contests {
       
        text-decoration: none;
        color: #05063c;
        background: white;
        -webkit-tap-highlight-color: transparent;
    }
   
    @media screen and (max-width: 1200px) {
       .contentHeader {
        width: 100%;
        max-width: 100%;
       }
        .contact_adress{
            width: 50%;
        }
       
        .contact_tel {
            width: 20%;
        }
    }
    @media screen and (max-width: 800px) {
        .contentHeader {
            width: 100%;
            max-width: 100%;
        }
       .contact_adress {
        display: none;
       }
      .contact_contact {
        width: 50%;
        text-align: right;
      }
      .contact_tel {
        width: 38%;
      }
      .contact_tel_content {
        justify-content: flex-end;
      }
      .push {
          height: 100px;
      }
    }
    @media screen and (max-width: 600px) {
        .contentHeader {
            width: 100%;
            max-width: 100%;
        }
        .contact_adress {
            display: none;
        }
     
        .logo {
            justify-content: flex-start;
            width: 20%;
        }
        .contact_tel {
            width: 41%;
        }
        .contact_contact {
            width: 37%;
        }
        .contact_tel_content {
            width: auto;
        }
       
       
    }
    @media screen and (max-width: 550px) {
        .logo {
            justify-content: flex-start;
            width: 20%;
        }
        .contact_contact {
            width: 75%;
            justify-content: flex-end;
            padding-right: 20px;
            overflow: hidden;
        } 
       .contact_contact_content {
         
       }
        .contact_tel {
            /*width: 30%;
            font-size: 10px;*/
           display: none;
        }
       
    }
    @media screen and (max-width: 460px) {
        .game, .college, .contests {
            font-size: 12px;
            width: 70px;
            padding: 10px;
            margin: 10px 18px 10px 18px;
        }
        /** {
            overflow-x: hidden;
        }*/
        .main {
                width: 100%;
                max-width: 100%;
                
        }
        .post {
            width: 95%;
           
        }
        .contact_contact_content {
        font-size: 15px;
        margin-right: 20px;
       
        
    }
   
    }
    @media screen and (max-width: 380px) {
    .game, .college, .contests {
        padding: 10px;
        margin: 10px 17px 10px 17px;
        }
    .contact_contact_content {
        font-size: 15px;
        padding-left: 15px;
        padding-right: 10px;
    }    
    }
    @media screen and (max-width: 365px) {
       .links_button {
           height: 60px;
       }
       .game, .college, .contests {
           padding: 10px;
           margin: auto;
           font-size: 12px;
       }
       .post_text_h1 {
           height: 50px;
           max-height: 70px;
           margin-bottom: 10px;
       }
       .push_button a {
           font-size: 11px;
       }
       push_button {
           margin-left: 60%;
       }
        .contact_contact_content {
        font-size: 16px;
        padding-left: 15px;
    }
    }
    
    
   
        .main {
           padding-top: 170px;
            width: 80%;
            max-width: 100%;
            min-height: calc(100vh - 372px);
            height: auto;
            margin: auto;
            font-family: "Montserrat";
            /*overflow-x: hidden;*/
           
        }
        .post_data {
            width: 100%;
            max-width: 100%;
            height: 20px;
            margin: 20px 10px 10px 0;
            text-align: right;
          
        }
        .post_data p {
            padding-right: 30px;
            color: #999;
        }
        .post {
            border: solid 1px rgb(207, 207, 209);
            border-radius: 5px;
            box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
            padding: 5px;
            margin: auto;
            margin-top: 0px;
            width: 98%;
            max-width: 99%;
            height: 200px;
            max-height: 300px;
            text-align: center;
            justify-content: center;
            display: flex;
            font-family: "Montserrat";
        }
        .data_post {
            padding-top: 40px;
            padding-right: 10px;
            width: 17%;
            font-size: 20px;
           
        }
        .data_number {
            height: 50px;
            font-size: 45px;
            padding-top: 1px;
           
        }
        .data_month {
            margin-top: 10px;
            height: 30px;
            font-size: 25px;
            
        }
        .data_time{
            font-size: 25px;
            margin-top: 10px;
             display: flex;
            justify-content: center;  
        }
       
        .image {
            width: 330px;
            height: auto;
            max-height: 300px;
            border-radius: 10px;
           /*border: solid 1px black;*/
            position: relative;
            overflow: hidden;
            outline: none;
            object-fit: fill;
            display: flex;
            align-items: center;
            
        }
        .post_img {
            width: 100%;
            height: 100%;
        }
        .post_text {
            width: 48%;
            position: relative;
            padding: 0 10px;
            display: flex;
           flex-direction: column;
           /*overflow-y: hidden;*/
        }
        .post_text_h1 {
            margin-bottom: 0;
            height: 60%;
            max-height: 170px;
            font-weight: 500;
            text-align: left;
           /*overflow-y: hidden;*/
            padding-bottom: 0;
        }
       .post_text_h1_content {
           overflow: hidden;
            font-size: 18px;
            width: 100%;
            height: 150px;
            max-height: 150px;
            font-weight: 500;
            line-height: 25px;
            padding-top: 15px;
            /*overflow-y: hidden;*/
            color: black;
            z-index: 1;
        }
       
       
        @media screen and (max-width: 1200px) {
            .main {
                width: 90%;
                max-width: 100%;
            }
        }
         
        @media screen and (max-width: 850px) {
            .main {
                width: 70%;
            }
        .post {
            width: 90%;
            max-width: 100%;
            height: auto;
            max-height: 1000px;
            display: flex;
            flex-wrap: wrap;
            margin: auto;
        }
        .post_data p {
            padding-right: 30px;
        }
        .data_post {
            width: 100%;
            display: flex;
            justify-content: center;
            padding-top: 20px;
            padding-bottom: 10px;
        }
        .data_number p {
            font-size: 35px;
        }
        .data_number, .data_month, .data_time {
            height: auto;
            margin-right: 10px;
        }
        .data_time {
            height: auto;
        
        }
        .data_month {
            height: auto;
        }
        .image {
            width: 100%;
            height: auto;
            max-height: 250px;
        }
        .post_text {
            width: 90%;
            margin: auto;
            height: 200px;
            max-height: 200px;
            justify-content: center;
            text-align: center;
        }
        .post_text_h1 {
            height: 300px;
            min-height: 50px;
            position: relative;
            font-size: 15px;
        padding-top: 5px;
        }
        .post_text_h1_content {
            padding-top: 10px;
            line-height: 25px;

        }
        .push {
            min-height: px;
            margin-bottom: 10px;
        }
        }
        @media screen and (max-width: 650px) {
            .main {
                width: 90%;
            }
        }
        @media screen and (max-width: 460px) {
            .image {
                max-height: 220px;
            }
        }
        @media screen and (max-width: 320px) {
            .main {
                width: 100%;
            }
            
            
        }
        
        
                .push {
            width: 99%;
            height: 40px;
            padding-top: 10px;
            
        }
          
          .push_button {
          
          margin-left: 60%;
          margin-bottom: 0px;
          margin-right: 10%;
          background: transparent;
          border-width: 0;
          position: relative;
          cursor: pointer;
          font-family: 'Montserrat', sans-serif;
          font-size: 14px;
          transition: .3s;
          text-decoration: none;
          /*overflow: hidden;*/
          }
        .push_button span {
              display: block;
              position: relative;
              z-index: 3;
              background: #44246b;
              color: white;
              padding: 0 10px;
              line-height: 40px;
              font-weight: 500;
              text-decoration: none;
              /*overflow: hidden;*/
        }
      
        .push_button:before {
            content: "";
            position: absolute;
            width: calc(100% + 5px);
            height: calc(100% + 5px);
            left: -5px;
            top: -5px;
            background: #fb7e3b;
            z-index: 1;
            transition: .4s ease-out;
            
        }
        .push_button:after {
            content: "";
            position: absolute;
            width: calc(100% + 5px);
            height: calc(100% + 5px);
            right: -5px;
            bottom: -5px;
            background: #41ebdf;
            transition: .4s ease-out .1s;
            
        }
        .push_button:hover:before {
            transform: translate(5px, 5px);
        }
        .push_button:hover:after {
            transform: translate(-5px, -5px);
        }
        .push_button a {
            text-decoration: none;
        }
        @media screen and (max-width: 460px) {
           .push {
               margin-bottom: 20px;
           }
           .push_button {
               margin-right: 5%;
               margin-left: 40%;
               transform: none;
           }
           .push_button:hover:before {
               transform: translate(0, 0);
           }
           /*  .push_button:before {
            transform: translate(5px, 5px);
        }
        .push_button:after {
            transform: translate(-5px, -5px);
        }*/
        }
      


        footer {
            z-index: 1000;
            position: relative;
        }
        .footer_main {
            border: solid 1px black;
            margin-top: 20px;
            width: 100%;
            height: auto;
           justify-content: center;
            /*bottom: 0;
            left: 0;*/
            background: rgb(11, 11, 63);
        }
        .footer_main_flex {
            width: 90%;
            max-width: 100%;
            height: auto;
            display: flex;
            flex-wrap: wrap;
           justify-content: center;
           margin: auto;
        }
        .footer_left {
            /*border: solid 1px red;*/
            width: 49%;
            min-width: 48%;
            height: auto;
           color: white;
           line-height: 2;
        }
        .footer_left_top {
            width: 80%;
           margin: 10px 0px 0px 20px;
           /*border: solid 1px red;*/
        }
        .footer_left_bottom {
             width: 80%;
            margin: 10px 0px 0px 20px;
        }
        .footer_left_top a, .footer_left_bottom a {
            text-decoration: none;
            color: white;
        }
        .footer_right {
            width: 48%;
            height: auto;
        }
        .footer_main_svg {
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            text-align: center;
            justify-content: left;
            /*border: solid 1px red;*/
            
        }
        .footer_svg a svg {
            width: 55px;
            height: 40px;
        }
        .footer_svg {
          margin-right: 15px;
        }
        .footer_right_text {
            color: white;
            padding-left: 20px;
            margin: 10px 0px 10px 0px;
            font-size: 16px;
            font-weight: 500; 
            /*border: solid 1px red;*/
        }
        @media screen and (max-width: 920px) {
            .footer_svg {
                margin-right: 8px;
                margin-left: 0;
            }
             .footer_svg a svg {
                width: 50px;
            }
             footer {
                overflow: hidden;
            }
        }
        @media screen and (max-width: 800px) {
            footer {
                overflow-x: hidden;
            }
            .footer_main_flex {
                display: flex;
                flex-wrap: wrap-reverse;
            }
            .footer_left {
                width: 100%;
            }
            .footer_right {
                width: 100%;
                
            }
            .footer_right_text p {
                padding-left: 10px;
            }
            .footer_main_svg {
                padding-left: 10px;
            }
            .footer_svg a svg {
                padding-left: 0px; 
            }
            .footer_left_top, .footer_left_bottom, .footer_right_text {
                padding-left: 20px;
            }
        }
        .scrollToTopBtn {
            left: 20px;
        }
        /*@media screen and (max-width: 800px) {
        }*/
        @media screen and (max-width: 460px) {
            .footer_svg a svg {
                  width: 45px;
                  height: 35px;
                  
                }
            .footer_svg {
                margin: 5px;
            }
            .footer_right_text {
                padding-left: 25px;
            }
            .scrollToTopBtn {
                left: 10px;
            }
        }