body {  
  	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 1.42857143;
    margin: 0;
    padding: 0;
    position: relative;
    min-height: 100%;
    padding-bottom: 120rem;
}

ul.nav {
	font-size: 18px;
}
.navbar-default .navbar-collapse {
	    border-color: #4c4c4c;
}
.navbar-default {	
    border-color: #9f9f9f;   
   	background:#91588b ; 
    border-bottom: #91588b; 
    }  

.navbar-default ul  {
	list-style: none;
	margin-right: 20px;
	
}
.navbar-default li {
	display: inline;
	padding: 8px;
}

.navbar-default .navbar-nav>li>a, .navbar-default .navbar-header p{	
	color:#fff;
	text-decoration: none;
	font-family: 'Lato', Arial, sans-serif;
}
.navbar-default .navbar-nav>li>a:hover {
	color: #333;
}

.navbar-default .navbar-brand {
	font-size: 2.8rem !important;
    margin-top: 4px;
}

.navbar-default p.navbar-brand:hover {
     color: #fff;
} 
.navbar-nav {
	float:right;
}

/* Jumbotron */
.jumbotron {
	text-align: center;
    background-image: url('../images/desktop-workspace.jpg');
    background-repeat: no-repeat;
    background-size:100%;
    background-color: #fff;
    height: 680px;
    color: #fff;
    position: relative;
    max-width: 100%;
    margin-top: -20px;
}


 .transbox {
 	top: 180px;
	width: 700px;
	height: 300px;
	left: 0;
	right: 0;
	margin: auto;
    background-color: #ffffff;
    opacity: 0.7;
    color: #000;
    position: absolute;    
}
.transbox h1{
	position: absolute;
	top: 70px;
	left: 30px;
	right: 30px;
    font-family: 'Lato', Arial, sans-serif;
    margin-bottom: 50px;
    font-weight: 800;
    font-size: 4rem;
}

.transbox h3 {
	position: absolute;
	top: 90px;
	right: 30px;
    font-family: 'Lato', Arial, sans-serif;
    margin-bottom: 10px;

}

.container .transbox a{
    text-decoration: none;
    position: absolute;
    font-weight: bold;
     font-family: 'Lato', Arial, sans-serif;
    color: #000;
    top: 250px;
    left: 450px;
    right: 20px;    
}

/*  About */
.homepage {
	text-align: left;
	padding-top: 100px;
  padding-bottom: 30px;
  margin-left: 200px;
  margin-right: 200px;
  margin-bottom: 100px;
}
.homepage h2, .homepage h3{	
    font-family: 'Lato', Arial, sans-serif;
    text-transform: uppercase;
    color:  #747678;
}

.homepage h2 {
	font-size: 30px;

}
.homepage h3 {
  	font-size: 26px;
}

.homepage p {
   	font-size: 1.4em;
  	font-weight: 300;
  	color:  #747678;
}

ul.nav {
	font-size: 18px;
}
ul.no-bullet {
	list-style-type: none;
    padding:0;
    margin:0;
}


li.briefcase {
	background: url('../images/web-logo.png') no-repeat left center; 
	padding-left: 43px;
	margin-bottom: 8px;
	font-size: 21px;
    font-weight: 300;
    color: #747678;	
}

.profile-photo {
	position:relative;
	width:100%;
}

.img-circle {
	width: 200px;
    border-radius: 50%;
    position: absolute;
    top:-120px;
    left: 600px;
}
.extra-space {
	height:32px;
}
/* Footer */
footer {	
	background-color: #FEF1FF;
	border-top: 1px solid #FEF1FF ;
	padding-top: 40px;
  	position: absolute;
  	right: 0;
  	bottom: 0;
  	left: 0;	
  	height: 80px;
}

.repeatmenu {

	margin:auto;
	width: 60%;		
}


.repeatmenu ul{
	list-style:none;
	margin: auto;
	width: 100%;


}
.repeatmenu li {
	font-family: 'Lato', Arial, sans-serif;
    font-size: 1.3rem;
    line-height: 1.7em;
    color: #747678;
    margin-top: -10px;
}
img.icon-footer {
	width: 4%;
	float: right;
	margin: -10px 10px 10px 10px;
}
/*  Work Page  */

#work-title h2{
    color: #91588b;
    font-size: 3.0em;
    font-weight: 900;   
    font-family: 'Lato', Arial, sans-serif;
    margin-bottom: -25px;
}
#work-title h3 {
	 color: #91588b;
    font-size: 2.0em;
    font-weight: 900;   
    font-family: 'Lato', Arial, sans-serif;
    margin-bottom: 100px;
}

.work h1, .photo h1 {
	padding-bottom: 50px;
	font-family: 'Lato', Arial, sans-serif;
	font-size: 72px;
	
	color:  #747678;
	text-align: center;

}

.work h3, .photo h3 {
	color: #000;
	font-family: 'Helvetica Neue', Arial, sans-serif;
	font-size: 31px;
	line-height: 1.4;
	margin: auto;
	width: 90%;
	color:  #747678;
}

.work p, .photo p {
   	font-size: 1.4em;
  	font-weight: 300;
  	font-family: 'Helvetica Neue', Arial, sans-serif;
  	color:  #747678;
}

.work {
	margin-top: 100px;
	margin-bottom: 100px;

}

img.moneyCo {
	width: 95%;
	margin-bottom: 300px;
}

.describeWork h5, .ad h5 {
	color: #a0e9ff;
	color: #91588b;
	font-size: 140px;
  margin-top: -130px;
  text-align: right;
  font-weight: 900;
}


.describeWork h2, .ad h2{
	color: #a0e9ff;
	color: #91588b;
	font-size: 2.6em;
	font-weight:900;
	text-align: left;
	font-family: 'Lato', Arial, sans-serif;

}


.describeWork h3, .ad h3 {
	font-family: 'Lato', Arial, sans-serif;
	text-align: left;
	color:  #747678;
	font-weight: 400;
    font-size: 22px;
    line-height: 1.3;
}

.describeWork >a, .ad >a {
	color: #a0e9ff;
	color: #91588b;
	font-size: 1.8em;
	text-align: right;
}

.describeWork >a:hover, .ad >a:hover {
	color:  #747678;
}

.ad h5, .ad h2, .ad h3{
	text-align: left;
}


.ad, .crewU {
	margin-bottom: 100px;
}


/* Banner Ad */

#banner {
	border: 1px solid #02225d;
	margin: auto;
	width: 800px;
	height: 150px;
	
	position: relative;
    background: url(img/chicagoSkyline.jpg);
    background-repeat: no-repeat;
    margin-bottom: 200px;
    margin-top: 10px;

}

#burgee img{
	position: absolute;
	width: 15%;
	margin-top: 2%;
	margin-left: 4%;
}

#logo {
	position: absolute;
	width: 55%;
	margin-left: 60%;
	margin-top: 8%;
}


input[type=button] {
	display: block;
	position: absolute;
	margin-top: 10px;
    margin-left: 70%;
    height: 30px;
    border-radius: 10%;
    background-color:#02225d;
    color: #fff;
    
}

input[type=button]:hover {
	 background-color:#fff;
    color: #02225d;
}

#little-text {color: #fff; margin-left: auto;margin-right: auto;width: 75%;font-size: 2.2rem;margin-top: 45px;}

/*Portfolio items */

#portfolio .portfolio-item {margin: 0 0 50px 0; border: 1px outset rgba(255, 255, 255, 0.5); }

#portfolio .portfolio-item:hover {transition: 0.4s; box-shadow: 5px 5px 5px rgba(0,0,0,0.4); border: rgba(0,0,0,0.6);}

#portfolio .portfolio-item .portfolio-link {display:block;position: relative;max-width: 500px;margin:0 auto;padding: 0;}
#portfolio .portfolio-item .portfolio-link .portfolio-hover {background: rgba(0,0,0,0.6); position: absolute; width: 100%; height: 100%;opacity: 0; transition: all ease .6s;}
#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {opacity: 1}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {position:absolute; width:100%; height:20%; font-size: 10px;text-align: center; top:90%; margin-top:; color:#fff }
#portfolio .portfolio-item .portfolio-caption {margin:0 auto; background-color:rgba(0,0,0,0.6); text-align: center;padding: 10px;max-width: 500px; height: 90px}
#portfolio .portfolio-item .portfolio-caption h4 {color:#fff}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-work i {color: #fff; position: absolute; top:50%; left:45%; margin-left: -50%;tranform: translateY(-50%, -50%);margin:0;}
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-work >img {position: absolute; width: 99%; margin:auto}
#portfolio .portfolio-item .portfolio-link img {margin:0 auto; height: 350px}

.portfolio-caption {color: #fff; text-shadow: 2px 2px #2f4f4f ;}
.portfolio-item1-left {float:left; margin-left:0% !important;}
.portfolio-item1-left-hover {float:left;}
.portfolio-item2-right {float:right;  margin-right:0% !important;}
.portfolio-item2-right-hover {float:right;}

/* Photography */


#myShots {
	width: 100%;
}

.left {
	width: 50%;	
	float: left;
}

#myShots a:hover img {
	opacity:0.5;
}

.right {
	width: 50%;
	float: right;
}


.photo {
	margin-top: 100px;
  margin-bottom: 100px;
}

img.gallery {
	overflow: auto;
	display: inline-block;
}

/* Blog */
.blog, .largeblog {
	margin-top: 100px;
}
.blog, .pre-footer {
	margin-bottom: 200px;
}

.blog h2, .blog a {
	color: #4c4c4c;
	font-size: 1.2em;
}
.largeblog a {
	color:  #747678;
	font-size: 1.0em;
}

.largeblog p, .largeblog li  {
	font-size: 1.4em;
	font-weight: 300;
    color: #747678;
}
.largeblog li {
	line-height: 2em;
}
.closerlist > li {
	line-height: 1.5em;
}
.blog a {
	text-decoration: none;

}
.blog a:hover, .largeblog a:hover {
	transition: color ease 0.3s;
	color: #A0E9FF;
	color: #91588b;
}

.blog p  {
	font-size: 1.4em;
    font-weight: 300;
    color: #747678;
} 


.post-meta{
	color: #c0c0c0;
	font-size: 0.9em;
}

.largeblog h3{
	color: #4c4c4c;
	font-size: 2.0em;
}

.gutter {
	padding-right: 25% !important;
	padding-left: 25% !important; 
	
}
.gutterLargeBlog {
	padding-right: 19%;
	padding-left: 19%;
}


.blogLine {
	margin-top: 6%;
	margin-bottom: 6%;
	color: #c0c0c0;
}

.largeblog h4 {
	font-size: 1.4em;
	margin: 5% 0%;
	color: #4c4c4c;
}

.largeblog p, .largeblog img {
	margin: 5% 0%;
}
.pre-footer h5 {
	display: block;
    -webkit-margin-before: 1.33em;
    -webkit-margin-after: 1.33em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
    text-rendering: optimizeLegibility;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 1.4rem;
    margin: 0;
    text-align: right;
    color: #4c4c4c;
}
img.icon-facebook {
	width: 5%;
	float: right;
	margin: 1.4rem 1.6rem 1.6rem 0;
}

.post-footer .share a {
    font-size: 1.8rem;
    display: inline-block;
    margin: 1.4rem 1.6rem 1.6rem 0;
    color: #BBC7CC;
    text-decoration: none;

}

/* Responsive Design */
@media (max-width: 768px) {
#collapsemenu {
	float:left;
}
.jumbotron {
	height: 280px;
}
 .transbox {
 	top: 50px;
	width: 300px;
	height: 150px;
	left: 0;
	right: 0;
	margin: auto;
    background-color: #ffffff;
    opacity: 0.7;
    color: #000;
    position: absolute;    
}
.transbox h1 {
	font-size: 20px;
	top: 0px ;
}
.container .transbox a {
	visibility: hidden;
}
.homepage, .work, .photo {
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 0px;
	
}
.homepage p {
	font-size: 1.3em;
}
li.briefcase {
	font-size: 1.2em;
}
.img-circle {
	top: -80px;
	left:90px;
}

.repeatmenu {
	width: 90%;
}
img.icon-footer {
	width:10%;
	}
#little-text {font-size:1.8rem}
.portfolio-caption h2{
	font-size: 2.3rem;
}
.photo h1, .work h1 {
	font-size: 5rem;
}
#myShots >.left, #myShots >.right {
	width: 100% !important;
}
img.icon-facebook {
	width:12%;
}
.gutter {
	padding-right: 8% !important;
	padding-left: 8% !important; 
	
}
.gutterLargeBlog {
	padding-right: 8%;
	padding-left: 8%;
}
}