Jump to content

CSS3 Background not showing up?

jttiglao
 Share
Posted

Before I had a nice little picture as my background of my website. Looked fine, but I wanted to change it.

When I went to change it in the css, I removed the previous background, and then added a new one, but nothing showed up. The background was just blank.

 

Here is my css code:

Spoiler 

	@charset "utf-8";
@import url("../webfonts/Ubuntu_Regular/stylesheet.css");
@import url("../webfonts/Lato_Hairline/stylesheet.css");
@import url("PlayfairDisplay_Bold/stylesheet.css");
@import url("Vollkorn_Regular/stylesheet.css");
.open{
	display: inline;
}
.open1{
	display: none;
}
a.back-to-top {
	display: none;
	width: 60px;
	height: 60px;
	text-indent: -9999px;
	position: fixed;
	z-index: 999;
	right: 20px;
	bottom: 20px;
	background-repeat: no-repeat;
	background-position: center 43%;
	background-image: url(../images/arrow-up-01-128.png);
	background-color: #FFFFFF;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background-size: 65% auto;
	border: thin solid #000000;
	opacity: 0.45;
}
.ultramedia {
	font-family: "Ubuntu Regular";
	font-style: normal;
	font-weight: 400;
	color: #FFFFFF;
	margin-top: 15%;
	text-align: center;
	letter-spacing: 10px;
	margin-bottom: -0.5%;
	padding-top: 95px;
	background-image: url(../images/LOGO.png);
	background-size: 97.5px auto;
	font-size: 38px;
	width: auto;
	background-repeat: no-repeat;
	background-position: 0em;
	background-position: center;
	background-position: center 0%;
}

.photography {
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 10px;
	text-decoration: none;
	line-height: -1px;
	font-family: "Lato Hairline";
	font-size: 20px;
	padding-top: 0px;
	margin-top: 17px;
	margin-left: auto;
	margin-right: auto;
	padding-left: auto;
	padding-right: auto;
}
.website {
	background-position: 0%;
	background-attachment: fixed;
	max-width: 100%;
	width: 100%;
	background-image: url(../images/aaron.jpg);
	background-color: #000000;
}
.aboutMe {
	float: none;
	font-family: "Ubuntu Regular";
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0px;
}
.thumbheads {
	text-align: center;
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 300;
	color: #FFFFFF;
	text-shadow: 0px 4px 11px #000000;
	text-decoration: none;
}
.SecondBackground {
	background-image: url(../images/craig_sarah_57.jpg);

}
footer {
	text-align: center;
	font-family: "Lato Hairline";
	text-shadow: 0px 0px #FFFFFF;
	background-color: #333333;
	padding-top: 3%;
	padding-bottom: 3%;
	color: #FFFFFF;
}
.submitForm {
	display: block;
	border: 0;
	width: 10%;
	height: 60px;
	margin-top: 1%;
	margin-right: auto;
	margin-left: 28%;
	margin-bottom: 5%;
	background: #eee;
	color: #333;
	text-align: center;
	transition: background, color, .5s ease 0;
	border: 0;
	font-size: 1.2em;
	line-height: 1.5em;
	color: #333333;
	letter-spacing: .01em;
	font-style: normal;
	font-weight: 300;
	font-family: source-sans-pro, sans-serif;
}
.messageForm {
	height: 125px;
	text-align: left;
}
.formDec {
	width: 25%;
	margin-left: 20%;
	text-align: left;
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 200;
	font-size: 1.4em;
	margin-top: 1%;
	margin-right: 5%;
}
.letstalk {
	font-family: "Ubuntu Regular";
	margin-left: 20%;
	letter-spacing: 5px;
}
.formdesc {
	font-family: "Lato Hairline";
	margin-left: 20%;
}
.weddingtext {
	color: #FFFFFF;
	text-decoration: none;
	font-style: normal;
}
.foodtext {
	color: #FFFFFF;
	text-decoration: none;
}
.eventtext {
	color: #FFFFFF;
	text-decoration: none;
}
.portraittext {
	text-decoration: none;
	color: #FFFFFF;
}
.quote {
	color: #FFFFFF;
	font-family: "Vollkorn Regular";
	letter-spacing: 5px;
	margin-left: 25%;
	font-size: 172%;
	margin-bottom: 3%;
	font-weight: lighter;

}
.formquote {

}
.formsection {
	background-image: url(../images/Chase3.jpg);
	background-repeat: no-repeat;
	background-size: 44% auto;
	background-position: 100% 0%;
	background-color: #FFFFFF;
	padding-top: 5%;
	padding-bottom: 5%;
}
.weddings {
	max-width: 0%;
	width: 0%;
}













@media (min-width : 1024px ) and (max-width : 1309px ){
.portfoliothumbs {
	height: 33.333%;
	max-width: 33.333%;
}
.aboutum {
	margin-top: 26%;
}
.website {
	background-position: 0% -2%;
}
.weddingstext {
	width: 33.333%;
	max-width: 33.333%;
	color: #FFFFFF;
}
.eventstext {
	width: 33.333%;
	max-width: 33.333%;
}
.portraitstext {
	width: 33.333%;
	max-width: 33.333%;
}
tr .weddingstext .fancybox.weddingstext.weddingtext {
}
.thumbheads {
	color: #000000;
	text-shadow: 0px 0px;
	font-family: "Lato Hairline";
	letter-spacing: 2px;
	font-weight: 900;
	width: 100%;
	background-color: #FFFFFF;
	padding-top: 1%;
	padding-bottom: 1%;
}
.formsection {
	margin-bottom: -2%;
}
.SecondBackground {
	background-size: 117% auto;
	background-position: 0% 0%;
	background-attachment: fixed;
	background-repeat: no-repeat;
}
.quote {
	width: 33%;
	margin-left: 17%;

}









nav li:hover {
	border-color: #000000;
}
}

@media (min-width : 769px ) and (max-width : 1024px ){
.ultramedia {
	font-size: 23px;
	background-size: 60px auto;
	background-position: center center;
}
.photography {
	font-size: 11px;
	margin-top: 13px;
}
.portfoliothumbs {
	float: none;
}
.formsection {

}
.SecondBackground {
	background-size: 124% auto;
	background-attachment: fixed;
}


.wethumb {
	width: 50%;
	height: 50%;
}
.eventsthumb {
	width: 100%;
	height: 100%;
}
.portraitstext {
	width: 50%;
}



.weddingthumbs {
	width: 50%;
	height: 50%;
}
.aboutum {
	margin-top: 20%;
	margin-bottom: -2%;

}
.quote {
	padding-top: 173%;
	width: 36%;
	font-size: 131%;
	margin-left: 19%;

}

.website {
	background-position: 0%
%;
	background-repeat: no-repeat;



	background-position: 0%
%;
	background-position: 0% 0%;
}
.thumbheads {
	width: 100%;
	display: none;






}
.weddingstext {
	width: 50%;
}
.halfhalf {
	width: 100%;
}


.eventtext   {


}

.weddingstext {
	float: none;
}
.burgertext {
	-webkit-transition: all;
	-o-transition: all;
	transition: all;
}
.eventstext {
	float: left;
}
.formsection {
	margin-bottom: -2%;
}







nav li:hover {
	border-color: #000000;
}

}
.aboutum {
	background-color: #FFFFFF;
	padding-left: 55%;
	padding-right: 10%;
	padding-bottom: 2.5%;
	font-size: 100%;
}
nav {
	background-color: #FFFFFF;
	text-align: center;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
}
nav li {
	display: inline-block;
	border-color: #FFFFFF;
	border-style: solid;
	padding-top: 0.125%;
	padding-bottom: 0.125%;
	padding-left: 2%;
	padding-right: 2%;
	margin-left: 2%;
	margin-right: 2%;
	-webkit-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
nav li a {
	color: #000000;
	text-decoration: none;
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 200;
	font-size: 156%;

}



.aboutp {
	font-family: "Vollkorn Regular";
	font-style: normal;
	font-weight: 200;
}
.portfoliothumbs {
	float: left;
}

@media (min-width: 1300px){
body {



}
.portfoliothumbs {
	max-width: 33.3333%;
	height: 33.3333%;
	margin-bottom: -13%;
}
.aboutum {
	margin-top: 34%;
	padding-top: 0%;
	padding-bottom: 7.5%;
}
.aboutMe {
	font-size: 232%;
}
.aboutp  {
	font-size: 119%;
}
.website {
	background-size: 120% auto;
	background-position: 45% 11%;
	background-image: url(../images/craig_sarah_57.jpg);
}
.thumbheads {
	text-align: center;
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 300;
	font-size: 159%;
	color: #FFFFFF;
	text-shadow: 0px 4px 11px #000000;

}
.weddingstext {
	margin-left: 7%;
	margin-right: 8%;
	max-width: 33.3333%;
	width: 33.3333%;
}
.eventstext {
	width: 33.3333%;
	max-width: 33.3333%;
}
.SecondBackground {
	background-size: 130% auto;
	background-attachment: fixed;
	background-image: url(../images/craig_sarah_57-min.jpg);
}
.formsection {
	background-color: #FFFFFF;
	width: 100%;
	padding-top: 10%;
	padding-bottom: 10%;
	margin-bottom: -3%;
}
.thumbheads {
	width: 100%;
}
.quote {
	width: 25%;
}
.formquote {
	margin-top: 100%;
}

















}
.jttiglao {
	color: #22FF00;
}
.weddingtext {
}
#top {
}
.halfhalf {
}
nav li:hover {
	border-color: #000000;
}
	
@media (max-width : 773px ){
.ultramedia {
	font-size: 141%;
	background-size: 17% auto;
	background-position: 50% 43%;
	margin-top: 14%;
	margin-bottom: 5%;
	opacity: 0;

}
.photography {
	font-size: 78%;
	opacity: 0;

}
.website {
	background-image: url(../images/erin-and-mike-black-and-white-kissing.jpg);
}
.aboutum {
	margin-top: 16%;
	margin-bottom: -12%;
	padding-left: 8%;
}
.portfoliothumbs {
	width: 100%;
	height: 100%;
}
.navlogo {
	font-family: source-sans-pro;
	font-style: normal;
	font-weight: 400;
	color: #000000;
	letter-spacing: 10px;
	opacity: 1;
	display: inline;
}
.formsection {
	margin-left: -19%;
	width: 119%;
	background-size: 47% auto;
}
.formDec {
	width: 32%;
	font-size: 124%;
}
.submitForm {
	width: 15%;
}
.quote {
	margin-top: 12%;


}
.formdesc {
	width: 31%;
}
.emailForm {
	width: 96%;
}
.thumbheads {
	display: none;
}
.SecondBackground {
}
.formquote {

}

  .hamburger {
    padding: 15px;
    display: block;
  }

  .line {
    border-bottom: 4px solid #000000;
    width: 35px;
    margin-bottom: 6px;
  }
  
  .line:last-child {
    margin-bottom: 0;




}
.menu {
	margin-left: -9%;
	margin-top: 0px;
	display: none;
	overflow: hidden;
	transition: height 0.3s;
}

.open{
	display: inline;
}

nav li {
	display: block;
	padding-left: 0%;
	margin-top: 2%;
}
nav li:hover {
	border-color: #FFFFFF;
}
.formsection {
	background-color: #FFFFFF;
	background-size: 0% auto;
}
.formDec {
	width: 74%;
}
.submitForm {
	width: 30%;
	margin-left: 41%;
}
.formdesc {
	width: 80%;
}








}

@media (max-width: 320px){
.website {
	background-size: 100% auto;
	background-position: 31% 2.5%;
	background-attachment: scroll;
	background-image: url(../images/Wedding%20Portfolio/weddings&events/3event.JPG);
	background-repeat: no-repeat;
	background-color: #FFFFFF;
}
.aboutum {
	margin-top: 59%;
}
.menu {
	height: 0px;

}
.newnavbar {

}
.open {

}
nav {

}
.contact {
	background-color: #FFFFFF;
}
.ultramedia {
	opacity: 1;
	color: #000000;
	margin-top: -43%;
	letter-spacing: 4px;
	background-image: url(../images/UM-4.png);
	background-size: 13% auto;
	background-position: 23% 106%;
	padding-left: 35%;
}
.formsection {
}











}

@media (max-width: 375px){
}

@media (max-width: 414px){
}
.contact {
}

 

Keep in mind that the background for the website is found under .website.

 

Here is the html if that helps:

Spoiler 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Ultra Media</title>
<!-- <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> -->
<script src="js/jquery-1.11.3.min.js"></script>
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script>var __adobewebfontsappname__="dreamweaver"</script>
<script src="http://use.edgefonts.net/lancelot:n4:default;poiret-one:n4:default;source-sans-pro:n4,n2,n9,n3,n6:default;droid-serif:n4:default;noticia-text:n4,n7:default;passion-one:n4:default;paytone-one:n4:default.js" type="text/javascript"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="/js/jquery.fancybox.js"></script>
<script src="jquery.scrollstop.js" type="text/javascript"></script>
<link href="css/UltraMedia.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="js/fancyapps-fancyBox-18d1712/source/jquery.fancybox.css" type="text/css" media="screen"/>
<style type="text/css">
.nav {
	background-color: #FFFFFF;
}
body{
		margin:0;
}
</style>
<script type="text/javascript" src="js/jquery.fancybox.pack.js"></script>
<script>
  $(function() {
    $('a[href*="#"]:not([href="#"])').click(function() {
      if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
        if (target.length) {
          $('html, body').animate({
            scrollTop: target.offset().top
          }, 1000);
          return false;
        }
      }
    });
  });
</script>
<script>
$(document).ready(function(){
    $('section[data-type="background"]').each(function(){
        var $bgobj = $(this); // assigning the object
    
        $(window).scroll(function() {
            var yPos = -($window.scrollTop() / $bgobj.data('speed')); 
            
            // Put together our final background position
            var coords = '50% '+ yPos + 'px';

            // Move the background
            $bgobj.css({ backgroundPosition: coords });
        }); 
    });    
});
</script>
<script>
$("img.lazy").lazyload({
  event: "scrollstop"
});
</script>
<link rel="shortcut icon" href="http://i.imgur.com/qwjrV3i.png" />
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->



</head>

  <body class="website">

<a href="#top" class="back-to-top">Back to Top</a>



<div class="newnavbar" id="header">
	<nav>
    
        <a href="#" class="hamburger">
        <div class="line"></div>
        <div class="line"></div>
        <div class="line"></div>
		</a>

    	<ul class="menu">
 		<li><a href="index.html" class="newhomenav">HOME</a></li> 
        <li><a href="#aboutum" class="newaboutnav">ABOUT</a> </li>
 		<li><a href="#portfolio" class="newportfolionav">PORTFOLIO</a></li>
 		<li class="contact"><a href="#contact" class="newcontactnav">CONTACT</a></li>
        <!---<a href="clientalbums.html" class="clientalbumnav">CLIENT ALBUMS </a>--->
        
	</nav>
</div>


  <h1 class="ultramedia">ULTRA MEDIA</h1>
  <h5 class="photography">PHOTOGRAPHY</h5>

<div class="aboutum" id="aboutum">

  <h2 class="aboutMe">____</h2>
	<h2 class="aboutMe">About us</h2>

<section class="aboutp">
  <p>I'm a paragraph. Click here to add your own text and edit me. It’s easy. Just click “Edit Text” or double click me to add your own content and make changes 	    to the font. Feel free to drag and drop me anywhere you like on your page. I’m a great place for you to tell a story and let your users know a little more      	    about you. </p>
  <p><p>This is a great space to write long text about your company and your services. You can use this space to go into a little more detail about your company.</p>
 
	<p>Talk about your team and what services you provide. Tell your visitors the story of how you came up with the idea for your business and what makes you 				    different from your competitors. Make your company stand out and show your visitors who you are.</p>
	</p>
</section>
   
  </div>

  <div class="SecondBackground">

<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/30event.jpg"><img src="images/Wedding Portfolio/weddings&events/30event.jpg" alt="" width="1366" height="911" class="portfoliothumbs wethumb"/></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/1event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/2event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/4event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/5event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/6event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/7event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/8event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/9event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/10event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/11event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/12event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/13event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/14event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/15event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/16event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/17event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/18event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/19event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/20event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/21event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/22event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/23event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/24event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/25event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/26event.jpg"></a>
<a class="fancybox" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/27event.jpg"></a>


  
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial1.jpg"><img src="images/Wedding Portfolio/commercial/commercial1.jpg" alt="" width="1366" height="911" class="portfoliothumbs weddingthumbs" id="portfolio"/></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial2.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial3.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial4.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial5.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial6.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial7.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial9.jpg"></a>
<a class="fancybox" rel="commercial" href="images/Wedding Portfolio/commercial/commercial10.jpg"></a>


<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous1.jpg"><img src="images/Wedding Portfolio/miscellaneous/miscellaneous1.jpg" alt="" width="1366" height="911" class="portfoliothumbs eventsthumb"/></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous2.jpg"></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous3.jpg"></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous4.jpg"></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous5.jpg"></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous6.jpg"></a>
<a class="fancybox" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous7.jpg"></a>







  
<table border="0" class="thumbheads">
 <tbody>   
 <tr>
      <td class="portraitstext halfhalf"><a class="fancybox portraittext thumbheads portraitstext" rel="weddingsevents" href="images/Wedding Portfolio/weddings&events/29event.jpg">WEDDINGS & EVENTS</a></td>
  	  <td class="weddingstext halfhalf"><a class="fancybox weddingstext weddingtext thumbheads" rel="commercial" href="images/Wedding Portfolio/commercial/commercial8.jpg">COMMERCIAL</a></td>
      <td class="eventstext"><a class="fancybox eventtext thumbheads eventstext" rel="miscellaneous" href="images/Wedding Portfolio/miscellaneous/miscellaneous8.jpg">MISCELLANEOUS</a></td>
    </tr>
  </tbody>
</table>

  <section class="formquote">
    <h2 class="quote">“In photography there is a reality so subtle that it becomes more real than reality.”</h2>
    <div class="formsection" id="contact">
  <h3 class="letstalk"> Let's talk.</h3>
  <h4 class="formdesc">Want to have us at your next event? Contact below!</h4>
<form class="emailForm" name="Email Form" method="post" action="contact.php">
<input name='first' type='first' required class="formDec" id="first" placeholder="First*">
<input name='last' type='last' required class="formDec" id="last" placeholder="Last*">
<input name='email' type='email' required class="formDec" id="email" placeholder="Email*">
<input name='subject' type='subject' required class="formDec" id="subject" placeholder="Event Type (Wedding, party, etc.)">
<input name='message' type='message' required class="formDec messageForm" id="message" placeholder="Message">
<input type="submit" class="submitForm" id="submit" value="Submit">
</form>
<//div>
</section>

<footer class="footer">Ultra Media 2016 Website by <a href="https://www.youtube.com/c/jttiglaohd" target="_blank" class="jttiglao">JT Tiglao</a></footer></div>
<!-- Include all compiled plugins (below), or include individual files as needed --> 
	<script src="js/bootstrap.js"></script> <script type="text/javascript">
	$(document).ready(function(){
		$(".fancybox").fancybox();
	});
</script>

<script type="text/javascript">
// create the back to top button
$('body').prepend('<a href="#" class="back-to-top">Back to Top</a>');

var amountScrolled = 300;

$(window).scroll(function() {
	if ( $(window).scrollTop() > amountScrolled ) {
		$('a.back-to-top').fadeIn('slow');
	} else {
		$('a.back-to-top').fadeOut('slow');
	}
});
</script>

<script>
$('.hamburger').on('click', function() {
  // Prevent link from jumping to the top of the page
if ($('.menu').hasClass('open')) {
	$('.menu').removeClass('open');
} else{
	$('.menu').addClass('open');
}
if ($('.ultramedia').hasClass('open1')) {
	$('.ultramedia').removeClass('open1');
} else{
	$('.ultramedia').addClass('open1');
}
});
</script>

	
  </body>
</html>

 

Thanks for helping in advance!

Link to comment
https://linustechtips.com/topic/596915-css3-background-not-showing-up/
Share on other sites
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing Programs, Apps and Websites

×