Bootstrap DPS alt Color Scheme CATX9do3Ii

javascript

/* affix the navbar after scroll below header */
$('#nav').affix({
      offset: {
        top: $('header').height()-$('#nav').height()
      }
});

/* highlight the top nav as scrolling occurs */
$('body').scrollspy({ target: '#nav' })

/* smooth scrolling for scroll to top */
$('.scroll-top').click(function(){
  $('body,html').animate({scrollTop:0},1000);
})

/* smooth scrolling for nav sections */
$('#nav .navbar-nav li>a').click(function(){
  var link = $(this).attr('href');
  var posi = $(link).offset().top+20;
  $('body,html').animate({scrollTop:posi},700);
})

/* make services show USE JQUERY WAYPOINTS or JQUERY.APPEAR */
$(document).ready(function(){
  $("#serv1").hide();
  $("#serv2").hide();
  $("#serv3").hide();
  $("#panel1").hide();
  $("#panel2").hide();
  $("#panel3").hide();
  $("#test1").hide();
  $("#test2").hide();
  $("#test3").hide();
  $("#gal1").hide();
  $("#gal2").hide();
  $("#gal3").hide();
  
  $("#section1").mouseenter(function(){
    $("#serv1").fadeIn(500);
    $("#serv2").fadeIn(500);
    $("#serv3").fadeIn(500);
  });
  
  $("#testback").mouseenter(function(){
    $("#test1").fadeIn(600);
    $("#test2").fadeIn(1200);
    $("#test3").fadeIn(1800);
  });
  
  $("#feat").mouseenter(function(){
    $("#gal1").fadeIn(600);
    $("#gal2").fadeIn(1200);
    $("#gal3").fadeIn(1800);
  });
});

$("#serv1").hover(function(){
    $("#panel1").fadeIn(700);
  },
  function(){
  $("#panel1").hide();
});

$("#serv2").hover(function(){
    $("#panel2").fadeIn(700);
  },
  function(){
  $("#panel2").hide();
});

$("#serv3").hover(function(){
    $("#panel3").fadeIn(700);
  },
  function(){
  $("#panel3").hide();
});

/* SCROLL REVEAL! */

css

@import url(http://fonts.googleapis.com/css?family=Kreon:400,700);

html,
body {
  height: 100%;
  /* The html and body elements cannot have any padding or margin. */
  -webkit-font-smoothing: antialiased;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.428571429;
}
.margins{

}
.row {
  margin-left:0px;
  margin-right:0px;
}

/* Wrapper for page content to push down footer */
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  /* Negative indent footer by its height */
  margin: 0 auto -60px;
  /* Pad bottom by footer height */
  padding: 0 0 10px;
}

/* Set the fixed height of the footer here */
#footer {
  height: 60px;
  margin-top:50px;
  padding-top:20px;
  padding-bottom:20px;
  
}

/* Custom page CSS
-------------------------------------------------- */

#wrap > .container {
  padding: 60px 15px 0;
}
.container .credit {
  margin: 20px 0;
}

#footer {
  background-color:#414141;
}

#footer a {
  color:#efefef;
}

h1,h2,h3,h4 {
 font-family: inherit;
font-weight: 500;
line-height: 1.1;
color: inherit;
}

header {
  background: #f16251;
  height:550px;
  color:white;
}
#mainhead{
  color:#1632AD;
}
header h1{
   color:white;
  font-weight:800;
  text-decoration:none;
}

header h2,header h3 a,header a,header a:hover {
  color:#101010;
  font-weight:800;
  text-decoration:none;
}

header h3 {
  font-family: 'Kreon', serif;
  background: none;
  padding:10px;
  border-radius:3px;
  font-size:20px;
  padding:20px 10px 6px 10px;
  color: white;
}

header .dropdown-menu {
  top:74px;
  background: #ffcc33;
  border-width:0;
}

h1 {
  font-size:50px;
}

#nav {
  width: 100%;
  position:static;
  top:-32px;
}

#nav.affix {
   position: fixed;
   top: 0;
   z-index:10;
   -webkit-transition: all .6s ease-in-out;
}

#footer > .container {
  
}

@media (min-width: 767px) {
  .navbar-nav.nav-justified > li{
      float:none;
  }
}
.navbar-nav {
  margin: 1px 1px; 
  
}  
 
.masthead{
background: black;
  height:110px;

}
.lead{
  
  margin-bottom: 70px;
}
.graydivider{
  background: #343434;
  height: 100px;
  }

.page-header{
margin-top:-75px;
  background: #003300;
  color:white;
  }
  
/* customize nav style */
.navbar-custom {
    background-color: #2e2e2e;
	font-weight:700;
    text-transform:uppercase;
    border-width:0;
  
}
.navbar-custom  .navbar-nav>li>a {
	color: #ddd;
  
}
.navbar-custom  .navbar-nav li>a:hover, .navbar-nav li .open, .navbar-custom .navbar-nav .active a  {
	background-color: #000;
}
.navbar-custom .dropdown-menu{
	right:0;
  
}
.navbar-custom .navbar-nav>.dropdown>a .caret {
	border-top-color: #999;
	border-bottom-color: #999;
}

.navbar-collapse.in { /*3.0.2 bug workaround*/
    overflow-y: visible;
}

.navbar-toggle {
	outline:0;
}

.divider {
	height:60px;
}
.divider1 {
	height:120px;
  background: -webkit-linear-gradient(top,#f8f8f8,#fafafa);
   
}
.divider2 {
	height:150px;
    background:#ddd;
}

.panel {
	border-width:0;
}

.panel-shadow{
  box-shadow: 2px 2px 3px grey;
  }
@media (max-width: 768px) {
	header {
		height: 95px;
	}
}

#map-canvas {
  	width: 100%; 
  	height: 300px;
	margin: 0;
	padding: 15px;
}

.scroll-top {
   position:fixed;
   bottom:0;
   right:6%;
   z-index:100;
   background: #D0D0D0;
   font-size:24px;
   border-top-left-radius:3px;
   border-top-right-radius:3px;
}
.scroll-top a:link,.scroll-top a:visited {
  color:#222;
}

section {
  color: #ffffff;
  min-height: 400px;
  height: auto !important;
  height: 100%;
  padding-top:100px;
}
.back{
  background: url('http://metroannex.com/demo4/wp-content/uploads/2008/09/escoto-landscaping-design-installation-maintenance.jpg')no-repeat center fixed;
    -webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
    margin-top: -20px;
    margin-bottom:0px;
    padding-bottom:0px;
    height:100%;
}

.bg-1 {
	background: url('http://backyardideas.biz/wp-content/uploads/2012/01/Landscaping-Services-in-Maryland.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
   box-shadow: 3px 5px 2px #ddd;
    
}

.bg-2 {
	background: url('http://www.bootply.com/assets/example/bg_5.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}

.bg-3 {
	background: url('http://www.bootply.com/assets/example/bg_6.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}

.bg-4 {
	
    width:100%;
    background: #343434;
    padding-top:120px;
   padding-bottom:120px;
   height: 1000px;
	
}
.dividergrey{
   background: #202020;
   padding-top:200px;
   height:200px;
   margin-top: -120px;
   padding-bottom: 120px;
   
  }

.coolline {
 height: 2px;
 background:white;
 margin-top:45px;
  
 
}  
.coolline2 {
 height: 2px;
 background:white;
 margin-bottom:50px;
  
 
} 
  AWESOME COLOR
AWESOM COLOR
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(20,20,20,0.2)),to(rgba(255,255,255,0)), color-stop(1,#000));
 background-color: #444248;
  
div.img-div{
     
    height:180px;
    width:180px;
    overflow:hidden;
    border-radius:50%;
    border-style: solid;
    border-width: 1px;
    border-color: grey;
    margin-left: auto;
    margin-right: auto;
    margin-top: -90px;

}
div.img-div:hover{
  border-color: #66CC66;
  border-width: 3px;
  box-shadow: 4px 4px 3px grey;
}

ul.services li:hover {
  background-color:rgba(5,5,5,.99);
  height:500px;
  margin-top: 0px;
 
}

#panel1{
 margin: 0 15px 50px;
padding: 20px 0; 
}
#panel2{
 margin: 0 15px 50px;
padding: 20px 0; 
}
#panel3{
 margin: 0 15px 50px;
padding: 20px 0; 
}

ul.services li {

color: #FFF;

font: 22px/30px "proxima-nova", sans-serif;
letter-spacing: 0.05em;
list-style-type: none;
text-align: center;
width: 30%;
height: 300px;
margin: 0 15px 50px;
padding: 20px 0;
border-radius:2px;
  background-color:rgba(5,5,5,.6);
  float:left;
  -webkit-transition: height 500ms; /* For Safari 3.1 to 6.0 */
  transition: height 500ms;
}

.service-body{
  font: normal 14px arial,sans-serif;
    
  }

.service-content{
    padding-left: 15px;
    border-style: solid;
    border-width: 1px;
    border-color: #ddd;
    border-radius: 3px;
    
    padding-right: 15px;
    width: 100%;
    margin-bottom: 100px;
    box-shadow: 4px 4px 3px #888888;
    height: 400px;
    background: white;
     
  }
.newback{
   width:100%;
    height: 610px;
    border-top: 1px solid #DDD;
  
    border-bottom: 1px solid #DDD;
    padding-top: 150px;
    background: -webkit-linear-gradient(top,#f8f8f8,#fafafa);
  }
.header-back{

}
.glyphs{
    height: 130px;
    width: 130px;
  }
.header-cont{
   margin-top:-50px; 
  }
.hugebackground{
    background:-webkit-linear-gradient(top,#f8f8f8,#fafafa);
    width: 100%;
    height: 100%;
    margin-top:-20px;
  }
.topbackground{
    background:#ddd;
    width: 100%;
    height: 100%;
    margin-top:-20px;
  }

.line{
  height:1px;

background:#DDD;

border-bottom:1px solid #DDD;
  }

.featurette{

min-height:600px;

background: url(http://store.makerbot.com/mb-images/mb/rep2/sliver.jpg);
background-position-x: initial;
background-position-y: initial;
background-size: initial;
background-repeat-x: repeat;
background-repeat-y: no-repeat;
background-attachment: initial;
background-origin: initial;
background-clip: initial;
background-color: initial;
    border-bottom: 1px solid #DDD;
        padding-top:80px;
        padding-bottom:100px;
    color: #ffffff;
  }

.featurette-item {
  margin-bottom: 25px;
}

.featurette-item > i {
  border: 3px solid #ffffff;
  border-radius: 50%;
  display: inline-block;
  font-size: 56px;
  width: 140px;
  height: 140px;
  line-height: 136px;
  vertical-align: middle; 
  text-align: center;
}

.featurette-item > i:hover {
  font-size: 68px;
  border-color: #006633;
}
.featurette2{
    background: url('http://blog.templatemonster.com/wp-content/uploads/2013/03/02.jpg');
    padding:50px;
    width:100%;
    height:600px;
    color: #ffffff;
  }
.gallery1{
  background: #006600;
    padding-top: 20px;
  }
  .img-responsive{
     width:100%; 
    }
.gallery{
    background: url('http://metroannex.com/demo4/wp-content/uploads/2008/09/escoto-landscaping-design-installation-maintenance.jpg')no-repeat center fixed;
    -webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
    
    margin-bottom:0px;
    padding-bottom:0px;
    height:100%;
  }
.gal-const{
  height:300px; 
  width:20%;
    background-color:rgba(5,5,5,.85);
    margin-top:0px;
    padding-left:15px;
    padding-top:55px;
  }
.well{
   font-size: 25px; 
  }
  .scottpic{
      margin-bottom:-60px;
      background: url('http://mckeephotography.com/wp-content/uploads/2010/12/mckee_20101117_4515-140x140.jpg');
      border: 3px solid black;
  border-radius: 50%;
  display: inline-block;
  font-size: 56px;
  width: 140px;
  height: 140px;
  line-height: 136px;
  vertical-align: middle; 
  text-align: center;
  z-index:5;
    }
 .featurette4{
        background:grey;
      }
      .featurette3{
        background:black;
      }
.contact-space{
   height:15px;

}
.address-space{
  height:60px;
}
 .contact-back{
      padding-bottom: 60px;
      padding-top:50px;
      background: rgba(20,20,20,0.2);
      
    }
.testimonial{
    background: rgba(121, 146, 247, 0.9);
    height: 100%;
    width:100%;
    margin-bottom: 10px;
    border-radius: 3px;
    
  }
.bigpic{
  background:yellow;
  height: 400px;
  width:100%;
  }
  
  .gallerybutton{
      height:100px;
      width:100%;
  background:purple
    }
#gallabel:hover{
    height:133px;
    margin-bottom:-133px;
    margin-top:133px;
    -moz-transform: translate(0px, -60px);
    -ms-transform: translate(0px, -60px);
    -o-transform: translate(0px, -60px);
    -webkit-transform: translate(0px, -60px);
    transform: translate(0px, -60px)
}

html

Bootply

DPS alt Color Scheme

Bootply v1.2.1
An unofficial Bootstrap playground.

Fork on GitHub | Contact

h1

h2

h3

h4

Dynamic
Property Services LLC

Dynamic Property Services LLC is Findlay and Northwest Ohio's premier service provider for all your property needs.

From home to lawn, Dynamic does it all!

What We Do

Honest. Fair. Reliable.

Our Work

Construction

Landscape

Renovation

What our Clients say

Check us out on social media!

Bill says:

Susan Says:

Brad Says:

Dynamic Property Services LLC

Call Us Today! 423.965.8547

About Us

Contact

DPS alt Color Scheme
1	1371 Bootstrap v3.2.0

Created by: snippets

id
style
class

Bootply

DPS alt Color Scheme

Bootply v1.2.1 An unofficial Bootstrap playground.

Fork on GitHub | Contact

h1

h2

h3

h4

Starter Template

Details

Dynamic Property Services LLC is Findlay and Northwest Ohio's premier service provider for all your property needs. From home to lawn, Dynamic does it all!