body {
    background-image: url('/img/Bground_1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-size: 100% contain;
  
    @media (max-width: 1200px) {
      background-size: 400% auto;
    }
  
    @media (max-width: 992px) {
      background-size: 300% auto;
    }
  
    @media (max-width: 768px) 
    {
      background-size: 200% auto;
      background-size: cover;
    }
  
    @media (max-width: 1400px) {
      background-size: 400% auto;
      background-size: cover;
    }
  }


/* Try again */
  #trygain {
    margin-top: -4px;
    position: absolute;
    opacity: 0;
    transform: translateX(-97%);
  }
  
  #tryAgainHover:hover #trygain {
    opacity: 1;
  }
  
  #tryAgainHover:hover #trygain_white {
    opacity: 0;
  }

  /* Sigture  */

  #buttons_image{
    margin-top: -4px;
    position: absolute;
    opacity: 0;
    transform: translateX(-97%);
  }
  
  #MrLeeCountinu:hover #buttons_image{
    opacity: 1;
  }
  #MrLeeCountinu:hover #buttons_image_white{
    opacity: 0;
  }


  #submit_lee_evidence{
    margin-top: -4px;
    position: absolute;
    opacity: 0;
    transform: translateX(-97%);
  }
  
  #questionLee:hover #submit_lee_evidence{
    opacity: 1;
  }
  #questionLee:hover #submit_lee_evidence_white{
    opacity: 0;
  }

  /* Right Ans Question */

#addtolast_lee{
  margin-top: -4px;
    position: absolute;
    opacity: 0;
    transform: translateX(-97%);
}

#RightAnsCountineu:hover #addtolast_lee{
  opacity: 1;
}
#RightAnsCountineu:hover #addtolast_lee_white{
  opacity: 0;
}





/* Input Ans*/

#submit__last_datalast_lee_evidence{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#InputRef:hover #submit__last_datalast_lee_evidence{
  opacity: 1;
}
#InputRef:hover #submit__last_datalast_lee_evidence_white{
  opacity: 0;
}



/* Bingooo */
#newImagePageSelect{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#BingoMrLee:hover #newImagePageSelect{
  opacity: 1;
}
#BingoMrLee:hover #newImagePageSelect_white{
  opacity: 0;
}


/* Last my Coutntiner */

#AfterNowNextPageShowAllFakeImage{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);

}

#AllFakeImages:hover #AfterNowNextPageShowAllFakeImage{
  opacity: 1;
}
#AllFakeImages:hover #AfterNowNextPageShowAllFakeImage_white{
  opacity: 0;
}









     

  



     
    


  .h2_font_style {
    font-family:courier, courier new;
      /* font-size: 24pt; */
  }
  
  .p_main {
    font-family:courier;
  }

  .onPage{
   font-family:courier;
   font-style: normal;
    font-weight: 800;
    font-size: 18px;
    text-align: center;
  }
  
  .header{
    font-family:courier, courier new;
    font-size: 24pt;
  }
  .p_question {
   
    font-family: Courier;
    font-style: normal;
    font-weight: 800;
    font-size: 24px;
    text-align: center;
    color: #000000;

  }
  .mian_header{
    font-family:Courier;
    font-style: normal;
    font-weight: 800;
    font-size: 24px;
    line-height: 28px;
    display: flex;
    align-items: center;
    letter-spacing: -0.025em;
    
    color: #000000;
  }
  .contact-img-style{
    font-family:courier, courier new;
    font-size: 16px;
    font-weight: 400;
  }




/* test */
.card_main_1 {
    margin-top: 20px; /* Adjust as needed */
    margin-bottom: 20px; /* Adjust as needed */
}

.text-center-hamza {
    height: 90vh; /* Adjust as needed */
    overflow: hidden;
}

.d-flex {
    display: flex;
}

.align-items-center {
    align-items: center;
}

.justify-content-center {
    justify-content: center;
}

.case_1 {
    width: 100%;
    height: auto;
}
.p_font_style {
    font-family: "Lorum ipsum";
    font-size: 16pt;
}
.h3_font_style {
    font-family: "Lorum ipsum";
    font-size: 24pt;
}
.image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 3px;
  }
  .centered-placeholder {
    text-align: center;
    border-color: black;
  }

.test{
    padding: 10%;
}


/* Hover games */
#signture_hover {
  position: absolute;
  opacity: 0;
}

#signature:hover #simple_signture {
  opacity: 0;
}

#signature:hover #signture_hover {
  opacity: 1;
}

/* Coloring Hover */

#theColoring {
  position: absolute;
  opacity: 0;
}

#colorHover:hover #simple_color {
  opacity: 0;
}

#colorHover:hover #theColoring {
  opacity: 1;
}

/* Name Hover */

#theName {
  position: absolute;
  opacity: 0;
}

#nameHover:hover #simple_name {
  opacity: 0;
}

#nameHover:hover #theName {
  opacity: 1;
}

/* Shapes Hover */

#theShapes {
  position: absolute;
  opacity: 0;
}

#shapesHover:hover #simple_shapes {
  opacity: 0;
}

#shapesHover:hover #theShapes {
  opacity: 1;
}

/* Mariral Hover */

#theMaterial {
  position: absolute;
  opacity: 0;
}

#materialHover:hover #simple_material {
  opacity: 0;
}

#materialHover:hover #theMaterial {
  opacity: 1;
}

/* Style Hover */
#theStyle {
  position: absolute;
  opacity: 0;
}

#styleHover:hover #simple_style {
  opacity: 0;
}

#styleHover:hover #theStyle {
  opacity: 1;
}




/* ********************************************* Cut code */


/* Mr Richderd Baker */

#the_signture_white_3{
  position: absolute;
  opacity: 0;
}


#signature_missphyish:hover #the_signture_white_3{
  opacity: 1;
}

#signature_missphyish:hover #the_signture_3{
  opacity: 0;
}

/* color */

#the_color_white_3{
  position: absolute;
  opacity: 0;
}


#thecolor_3rd:hover #the_color_white_3{
  opacity: 1;
}

#thecolor_3rd:hover #the_color_3{
  opacity: 0;
}

/* Name  */
#the_name_white_3{
  position: absolute;
  opacity: 0;
}

#thename_3rd:hover #the_name_white_3{
  opacity: 1;
}

#thename_3rd:hover #the_name_3{
  opacity: 0;
}


/* theshapes_3rd  */
#the_shape_white_3{
  position: absolute;
  opacity: 0;
}

#theshapes_3rd:hover #the_shape_white_3{
  opacity: 1;
}

#theshapes_3rd:hover #the_shapes_3{
  opacity: 0;
}


/* thematerial_3rd  */
#the_material_white_3{
  position: absolute;
  opacity: 0;
}

#thematerial_3rd:hover #the_material_white_3{
  opacity: 1;
}

#thematerial_3rd:hover #the_material_3{
  opacity: 0;
}


/* thestyle_3rd  */
#the_style_white_3{
  position: absolute;
  opacity: 0;
}

#thestyle_3rd:hover #the_style_white_3{
  opacity: 1;
}

#thestyle_3rd:hover #the_style_3{
  opacity: 0;
}

/* Correct Modal Buttton Countineu */

#the_corrent_baker_go{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#theCorrectBakerGo:hover #the_corrent_baker_go_white{
  opacity: 0;
}

#theCorrectBakerGo:hover #the_corrent_baker_go{
  opacity: 1;
}

/* Select Options Button */
#submit_richer_baker_evidence{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#submitRicherBaker:hover #submit_richer_baker_evidence_white{
  opacity: 0;
}

#submitRicherBaker:hover #submit_richer_baker_evidence{
  opacity: 1;
}

/* After Select Options Countine */
#the_corrent_second_answere_baker_go{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#correntSecondAnswere:hover #the_corrent_second_answere_baker_go_white{
  opacity: 0;
}

#correntSecondAnswere:hover #the_corrent_second_answere_baker_go{
  opacity: 1;
}


/* Input submite ans */

#submit__last_richer_baker_evidence{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#submitLastEvidence:hover #submit__last_richer_baker_evidence_white{
  opacity: 0;
}

#submitLastEvidence:hover #submit__last_richer_baker_evidence{
  opacity: 1;
}

/* Last Baker button */

#newpageafterRecherdBaker{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#newpageCompate:hover #newpageafterRecherdBaker_white{
  opacity: 0;
}

#newpageCompate:hover #newpageafterRecherdBaker{
  opacity: 1;
}

/* Physical Brown Work Start */


/* Select 6 Coloum */
#the_signture_white_2{
  position: absolute;
  opacity: 0;
}

#signature_missphyish_2:hover #the_signture_white_2{
  opacity: 1;
}

#signature_missphyish_2:hover #the_signture_2{
  opacity: 0;
}


/* Color */

#the_color_white_2{
  position: absolute;
  opacity: 0;
}

#theColor2nd:hover #the_color_white_2{
  opacity: 1;
}

#theColor2nd:hover #the_color_2{
  opacity: 0;
}


/* Name */
#the_name_white_2{
  position: absolute;
  opacity: 0;
}

#theName2nd:hover #the_name_white_2{
  opacity: 1;
}

#theName2nd:hover #the_name_2{
  opacity: 0;
}
/* Shapes */
#the_shapes_white_2{
  position: absolute;
  opacity: 0;
}

#theShap2nd:hover #the_shapes_white_2{
  opacity: 1;
}

#theShap2nd:hover #the_shapes_2{
  opacity: 0;
}

/* Metrial */
#the_material_white_2{
  position: absolute;
  opacity: 0;
}

#theMaterial2nd:hover #the_material_white_2{
  opacity: 1;
}

#theMaterial2nd:hover #the_material_2{
  opacity: 0;
}
/* Style */
#the_style_white_2{
  position: absolute;
  opacity: 0;
}

#theStyle2nd:hover #the_style_white_2{
  opacity: 1;
}

#theStyle2nd:hover #the_style_2{
  opacity: 0;
}
/* Correct Image select The Singture */

#the_corrent_go{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#TheCorrect2ndModal:hover #the_corrent_go_white{
  opacity: 0;
}

#TheCorrect2ndModal:hover #the_corrent_go{
  opacity: 1;
}

/* Brown Select Options */

#submit_phy_brown_evidence{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);

}

#SelectOptionBrwon:hover #submit_phy_brown_evidence_white{
  opacity: 0;
}

#SelectOptionBrwon:hover #submit_phy_brown_evidence{
  opacity: 1;
}

/* correntphyBwornModal */

#the_corrent_phyBworn_go{
  margin-top: -4px;
    position: absolute;
    opacity: 0;
    transform: translateX(-97%);
}

#correntphyBwornModal:hover #the_corrent_phyBworn_go_white{
  opacity: 0;
}

#correntphyBwornModal:hover #the_corrent_phyBworn_go{
  opacity: 1;
}


/* inputBrown */

#submit__last_phy_brown_evidence{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#inputBrown:hover #submit__last_phy_brown_evidence_white{
  opacity: 0;
}

#inputBrown:hover #submit__last_phy_brown_evidence{
  opacity: 1;
}

/* Last Modal Brown */

#newImagePageSelectAfterphyBworn{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#LastModalBrown:hover #newImagePageSelectAfterphyBworn_white{
  opacity: 0;
}

#LastModalBrown:hover #newImagePageSelectAfterphyBworn{
  opacity: 1;
}

/* Next Fake images after button show */


#buttons_countine_after{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#FinalAllFakeContinueButton:hover #buttons_countine_after_white{
  opacity: 0;
}

#FinalAllFakeContinueButton:hover #buttons_countine_after{
  opacity: 1;
}


/* Last submite Input */
#submite_for_input_last_part{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#LastsubmiteInput:hover #submite_for_input_last_part_white{
  opacity: 0;
}

#LastsubmiteInput:hover #submite_for_input_last_part{
  opacity: 1;
}



/* Last Modal */

#atfterModalCountineu{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);

}

#LastModalPart:hover #atfterModalCountineu_white{
  opacity: 0;
}

#LastModalPart:hover #atfterModalCountineu{
  opacity: 1;
}


/* Mr Lee Hover Image */



#drweleeImage_Hover{
  position: absolute;
  opacity: 0;
}

#leeHover:hover #drweleeImage_Hover{
  opacity: 1;
}
#leeHover:hover #drweleeImageHover{
  opacity: 0;
}

/* Baker Hover */

#bakerSelectImage_hover{
  position: absolute;
  opacity: 0;
}

#bakerHover:hover #bakerSelectImage_hover{
  opacity: 1;
}
#bakerHover:hover #bakerSelectImage{
  opacity: 0;
}

/* phy hover */

#phylisImagehower_2_hover{
  position: absolute;
  opacity: 0;
}

#phyHover:hover #phylisImagehower_2_hover{
  opacity: 1;
}
#phyHover:hover #phylisImagehower_2{
  opacity: 0;
}


#back_page{
  margin-top: -4px;
  position: absolute;
  opacity: 0;
  transform: translateX(-97%);
}

#backToAudio:hover #back_page_white{
  opacity: 0;
}

#backToAudio:hover #back_page{
  opacity: 1;
}