I have a modal form where I ask people to input information. Up to recently, it has been behaving perfectly now some of the text won't show because the default colour has changed.
The text used to default to black on a white background. I can see the text by highlighting. I have tried changing the text colours but nothing is working. I am baffled as I have not changed this code in months. Not sure why this has changed.
You can see an example in the code I have posted where I have tried to set the text colour to #333333 but there is no change.
The expected colours are a white background with black text.
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Pricing</h4>
</div>
<div class="modal-body pricing">
<div class="row" style="background-color: #333333; color: white;text-align: center;line-height: 35px">
<div class="col-lg-7">Item</div>
<div class="col-lg-2">Qty</div>
<div class="col-lg-3">Price</div>
</div>
<form>
<div class="row itemlabel">
<div class="col-lg-7"><style ="color:DodgerBlue;">Blocks [ Size : 10 pixels X 10 pixels : Min 1 - Max 49]</div>
<div class="col-lg-2"><input class="form-control" type="number" value="1" min="1" max="49" id="blockCount"/> </div>
<div class="col-lg-3"></div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">Add Logo</div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="addLogo"/> </div>
<div class="col-lg-3" id="addLogoPrice">1.00 USD</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">Add Sticker "Currently FREE to change" <a target="_blank" href="<?php echo get_site_url().'/stickers';?>" class="badgesHelp" data-toggle="tooltip" title="" data-rel="tooltip"> <i class="fa fa-question-circle"></i> </a></div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="addBadge"/> </div>
<div class="col-lg-3" id="addBadgePrice">0.50 USD</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">Add Link</div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="addLink"/> </div>
<div class="col-lg-3" id="addLinkPrice">1.00 USD</div>
</div>
<div class="row" style="background-color: #333333; color: white;text-align: center;line-height: 35px">
<div class="col-lg-12">Listing Duration</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">1 Year</div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="duration1" /> </div>
<div class="col-lg-3" id="duration1Price">1.00 USD</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">2 Years</div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="duration2" /> </div>
<div class="col-lg-3" id="duration2Price">2.00 USD</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7">5 Years</div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="duration3" /> </div>
<div class="col-lg-3" id="duration3Price">5.00 USD</div>
</div>
<div class="row itemlabel">
<div class="col-lg-7"><h4 style="color:DodgerBlue;"><b>Forever - "BEST VALUE"</b></h4></div>
<div class="col-lg-2"><input class="form-control" type="checkbox" value="1" id="duration4" /> </div>
<div class="col-lg-3" id="duration4Price">15.00 USD</div>
</div>
</form>
<div class="row" style="font-size: 19px; font-weight: bold; margin-top: 28px;">
<div class="col-lg-9" style="text-align: right">Total</div>
<div class="col-lg-3" style="text-align: left" id="totalAmount">1.00 USD</div>
</div>
</div>
<div class="modal-footer">
<div class="errorMsg" style="text-align:center"></div>
<div class="alert alert-info text-center">You will be able to edit the block and add your story upon successful purchase </div>
<button type="button" class="btn btn-default" onclick="addDataToCart();">Buy Now</button>
</div>
</div>
</div>
</div>