/*
 * Author: Carlos Alvarez
 * URL: http://Alvarez.is
 *
 * Project Name: NYC Design
 * Version: 1.0
 * Date: 04-20-2014
 * URL: 
 */


/* ==========================================================================
   Base Styles, Bootstrap Modifications & Fonts Import
   ========================================================================== */

@import url('https://fonts.googleapis.com/css?family=Noto+Sans');


::-moz-selection {
    background: #f2c2c9;
    color: #a4003a;
    text-shadow: none;
}

::selection {
    background: #16a085;
    color: #a4003a;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

 hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

.centered {
	text-align: justify
}

.mt {
	margin-top: 80px;
}

.mb {
	margin-bottom: 80px;
}   
 


/* ==========================================================================
   General styles
   ========================================================================== */


body {
  	font-family: 'Noto Sans', sans-serif;

	line-height: 1.5em;
    font-weight: 400;
    font-size: 15px;

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
	text-align: center;
    color: #4a4a4a;
}


.navbar-brand {
	font-weight: 700;        
	
}

.navbar-default .navbar-brand {
	color: #4a4a4a;
	font-weight: 700;  
}

.navbar-default {
	background-color: white;
	border-color: transparent;  
	padding-top: 20px;    
	padding-bottom: 20px;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
	color: #4a4a4a;
	font-weight: 700;
	background-color: white;
	border-bottom: 2px solid #4a4a4a;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: white;
	font-weight: 700;
    color: darkgrey;
}          

.navbar-default .navbar-nav > li > a {
	font-weight: 700;
    color: #4a4a4a;
}

/* ==========================================================================
   Wrap Sections
   ========================================================================== */

#headerwrap {
	background: url(../img/back.jpg) no-repeat center top;
	margin-top: -120px;
	padding-top: 200px;
	text-align:center;
	background-attachment: relative;
	background-position: center center;
	min-height: 500px;
	width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
 
#headerwrap h1 {
	color:#ffffff;
	padding-top: 10px;
	padding-bottom: 20px;
	letter-spacing: 4px;
	font-size: 80px;
	font-weight: bold;
}

#headerwrap h4 {
	font-weight: 400;
	font-size: 40px;
	color: #ffffff;
}

/*for centering header text on smaller browser size*/
 @media all and (max-width:350px) and (min-width:1px){ 
     #headerwrap {padding-top: 175px;} 
}

#social {
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #f2f2f2;
}

#social i {
	font-size: 40px;
	color: #4a4a4a
}

#social i:hover {
	color: #1abc9c
}


#footerwrap {
	/* background: url(../img/footer.jpg) no-repeat center top; */
	background: white;
	padding-top: 30px;
	padding-bottom: 100px; 
	padding-left: 50px;
	text-align:center;
	background-attachment: relative;
	background-position: center bottom;
	max-height: 50px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#footerwrap h1 {
	color:#4a4a4a;
	padding-top: 0px;
	padding-bottom: 10px;
	letter-spacing: 2px;
	font-size: 20px;
	font-style: bold;
    text-align: left;
     float: left;
    line-height: 50%;
}

#footerwrap h4 {
    color:#4a4a4a;
    font-size: 16px;
    text-align: left;
    line-height: 50%;
}

#footerwrap p {
    color:white;
    font-size: 20px;
    text-align: left;
     float: right;
    font-style: bold;
     line-height: 90%;
}

/*for resizing footerwrap h4 based on browser size*/
 @media all and (max-width:400px) and (min-width:1px){ 
     #footerwrap h4 {font-size:4vw;} 
} 

/*for resizing footerwrap h1 based on browser size*/
 @media all and (max-width:400px) and (min-width:1px){ 
     #footerwrap h1 {font-size:5vw;} 
}

/*for shifting footer text on smaller browser size*/
 @media all and (max-width:400px) and (min-width:1px){ 
     #footerwrap {padding-left: 3vw;} 
}

#aboutwrap {	
	background: url(../img/about.jpg) no-repeat center top;
	margin-top: -120px;
	padding-top: 150px;
	text-align: center;
	background-attachment: relative;
	background-position: center center;
	min-height: 500px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#aboutwrap h4 {
	font-weight: 400;
	font-size: 8vw;  
	padding-top: 55px; 
	color: #ffffff;
}
     
/*for resizing aboutwrap h4 based on browser size*/
 @media all and (max-width:600px) and (min-width:1px){ 
     #aboutwrap h4 {font-size:16vw;} 
} 


/* Gallery */
.gallery {
	margin-top: 30px;
}

.gallery img:hover {
	opacity: 0.4;
}      
       

/* for placing text within portfolio images*/