﻿/* -----------------------------------------------------------------------------

    This file should be used to add your own CSS definitions or override
	the existing ones.

----------------------------------------------------------------------------- */

	/* your CSS here */


/*Header Stuff start*/

html{ background: url('../../images/lines.png') repeat-x scroll top left; 
	background-size: auto 250px;
	background-position: center 95px;
	}
body{background: url('../../images/eraser.svg') no-repeat scroll center; 
		background-size: auto 300px;	
		background-position: center 74px;		
}

.container {
padding-left: 15px;
padding-right: 15px;
}
h1{
	text-align: center;
	position: relative;
	margin-top:15px;
	padding-top:11px;
	margin-bottom: 35px;
	margin-left: 15px;
	margin-right: 15px;
	text-transform: uppercase;
	font-family: 'Franchise Bold';
	font-weight: normal;
	font-size: 42px;
	line-height: normal;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-color: #cc6633;
	
}

h2{
	text-align:left;
	position: relative;
	padding-bottom: 5px;
	text-transform: uppercase;
	font-family: 'Franchise Bold';
	font-weight: normal;
	font-size: 27px;
	color:#cc6633;
}
.project-info p{
	margin-bottom:20px;
}

#bottom-panel *:last-child>.widget, #bottom-panel .widget {
padding: 0 0 0 0px;
}

.service-content h2{
	text-align:center;
	color:#4e5655;
}
h3{
	font-weight: bold;
	
}
.rightalign h2, .rightalign ul li, .rightalign p{
	text-align:right;
}

.c-section a{
	color:#cc6633;
}

#header-fixed {
height: 77px;
}
#main-sidebar {
border-left: 7px solid #fff;
}
.list{
	margin-top: -1px;
	padding-top: 4px;
	border-top: 1px solid transparent;
	border-color: #CCCCCC;
}

#header.m-standard {
height: 320px;
}
.c-icon-block p{
	color:white;
}
.c-icon-block h3{
	color:#cc6633
}

.bodytext{
	text-align:left;
}

.logo{
	width: 230px;
	text-align: center;
	margin: 0px auto;
	margin-top: 73px;
}
	
	}
#header.m-standard {
	height: 200px;
	}

	#bottom-panel {
	padding: 33px 0 24px 0;
	}
.c-gallery .gallery-filter>li>button {
	font-size: 19px;
}
.bullets{
		width:6px;
}
#header-fixed .main-sidebar-toggle {
	right: 15px;
	top: 34px;
}

.c-gallery .gallery-tools {
padding: 0;
border-bottom: 0px solid transparent;
}



/*Navbar start*/


.main-sidebar-toggle {
	top:18px;
}

#header.m-standard .header-menu>ul{
		margin-top:20px;
}

#header.m-standard .header-menu>ul>li>a{
	font-family:'Franchise Bold';font-weight:normal;font-size:23px	
}
.bullets{
	width:6px;
}

/*Navbar end*/

/*Header Stuff start*/



/*porfoli menu start*/

.portfolio-list .c-gallery .gallery-filter>li {
		margin: 0px 4.3% 0px 0px;
}

.c-gallery .gallery-filter>li>button {
	font-family:'Franchise Bold';font-weight:normal;font-size:20px;
	text-transform: uppercase;
	margin:0px;
	padding:0px;
	color: #4e5655;
}

.c-gallery .gallery-filter{
		margin-top:0px;
		margin-bottom:30px;
		
}
#page-header{
	padding: 0px 0 0px 0;
}
.portfolio{
	text-align: left;
	position: relative;
	margin-top:0px;
	padding-top:0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 15px;
	text-transform: uppercase;
	font-family: 'Franchise Bold';
	font-weight: normal;
	font-size: 45px;
	border-top: 0px solid transparent;
	border-bottom: 0px solid transparent;
	float: left;
    max-width: 60%;
    line-height: 1em;



}
#page-header{
	margin-bottom:25px;
}


#page-header h1:after {
content: "";
display: block;
position: relative;
top: 0px;
width: 60px;
height: 4px;
-webkit-transition: width 300ms ease-in-out;
-moz-transition: width 300ms ease-in-out;
-ms-transition: width 300ms ease-in-out;
-o-transition: width 300ms ease-in-out;
transition: width 300ms ease-in-out;
}

.portfolio-detail>.project-images:first-child {

border-bottom: 1px solid rgba(237, 237, 237, 0.75);
border-top: 1px solid rgba(237, 237, 237, 0.75);

}


a {
border-bottom: 0px solid transparent;
}


/*porfolio end*/




.tweet_text{
	color:white;
	font: bold 1em "Montserrat", Arial, sans-serif;

	
}
.widget-title a, .widget-title h3{
		font-family:'Franchise Bold';font-weight:normal;font-size:30px;
}
#main-sidebar .twitter-widget .nav-buttons>button {
background-color: #4e5655;
}
#main-sidebar .widget-title {
margin-bottom: 15px;
padding-bottom: 4px;
}
.twitter-feed a{
	color:#cc6633;
}
#main-sidebar .twitter-widget .tweet_time a {
color: #EDEDED;
}
.twitter-widget .tweet_time {
display: block;
font-size: 0.8em;
}
.twitter-widget .nav-buttons {
margin-top: 15px;

}

/*start blog*/
.construction{
	font-family:'Franchise Bold';font-weight:normal;font-size:10vw;
	text-transform: uppercase;
	margin-top:10vw;
	margin-bottom:2vw;
	padding:0px;
	color: #BD5323;
	text-align:center;
}

.substruction{
	text-align:center;
	margin-bottom:1vh;
}

/*end blog*/


/*start home*/

.bigtextwrapper{
	width:100%;
	text-align:center;
	margin: 0 auto;
	max-width:1199px;
	margin: 10px auto 0%;
}

.bigtext{
	font-family:'Franchise Bold';font-weight:normal;font-size:40px;
	text-transform: uppercase;
	text-align:center;
	
}

.darkbandcontact {
	background-color:#4e5655;
	padding-top:10px;

	margin-top:0%;
}

.darkband{
	background-color:#4e5655;
	padding-top:6%;
	padding-bottom:3%;
	margin-top:17%;
	
}

.greyband{
	background-color: #EDEDED;
	padding-top: 20px;
	padding-bottom: 20px;

}
.whiteband{
	background-color: white;
	padding-top: 30px;
	padding-bottom: 20px;

	
}
.bandwrapper{
	width:95%;
	margin: 0px auto 0%;
}

.c-icon-block {
position: relative;
margin-bottom: 0px;
padding-left: 0px;
}

.darkbandcontact h3{
	color:#cc6633;
	font-family:'Franchise Bold';font-weight:normal;font-size:31px;
	text-transform: uppercase;
	text-align:center;
	font-size:32px;
	margin-bottom:-4px;
	padding:0px;
}

.darkbandcontact h4{
	color:white;
	font-family:'Franchise Bold';font-weight:normal;font-size:31px;
	text-transform: uppercase;
	text-align:center;
	font-size: 32px;
	margin:0px 0px 10px 0px;
	padding:0px;
}

.contactme h2{
	padding-left:15px;

}

.headshot{

	margin: 0px auto 0%;
	margin: 10% 0% 7% 0%;

}
.headshotwrapper{
	width:100%;

}


.orange{
	color:#BD5323;
}

.white{
	color:white;
}
.lightgrey{
	color:#B7B7B7;
}

#body{
	margin-top:32px;
}

.biotext{
	margin-top:12.5%;
}
.resume ul{
	margin-bottom:25px;
}
.resume p{
		margin-bottom:10px;
		line-height:25px;
}
.help p{
		margin-bottom:22px;
}
.col-md-6 {
width: 73.333333%;
}
.header-menu a{
	color:#4e5655;
}
.header-menu .active{
	color:#BD5323;
}
.footer-social a{
	color:#4e5655;
}
.row {
margin-left: 0px;
margin-right: 0px;
}



.various-content p {
margin-bottom: 3px;
line-height: 1.5em;
}
.various-content a:hover {
	color:#B7B7B7;
}
#body{
	margin-top:75px;
}
#homefittext1 {
margin: 0% auto 33.5%;
}
#homefittext2 {
margin: 0% auto 45.5%;
}
#homefittext3{
	margin: 0% auto 0%;
}
#homefittext4{
	margin: 0% auto 4.5%;
}
#homefittext5 {
margin: 0% auto 6.7%;
}
#homefittext6 {
margin: 0% auto 6.5%;
}
#homefittext7{
	margin: 0% auto 0%;
}
.darkband {
margin-top: 14%;
}

.bigtextwrapper{
	width:800px;
}
.headshot{
	width: 300px;
	margin: 0px auto;
	margin-top: 0px;
	display: block;
	float: left;
	margin: 0px 20px 0px 15px;
}
.whiteband{
	background-color: white;
	padding-top: 20px;
	padding-bottom: 20px;


}
.threed{
	text-shadow:#B7B7B7 -9px 9px 0;
	
}
.various-content .c-parallax-section, .c-parallax-section {
margin-bottom: 24px;
border-bottom: 0px solid transparent;
}
.various-content .c-parallax-section .section-inner, .c-parallax-section .section-inner {
padding: 0px 0px 0px 0px;
}
.c-parallax-section {
margin-bottom: 0px
}

    <!-- slider css -->

      #full-width-slider {
  width: 100%;
  color: #000;
}
.coloredBlock {
  padding: 12px;
  background: rgba(255,0,0,0.6);
  color: #FFF;
   width: 200px;
   left: 20%;
   top: 5%;
}
.infoBlock {
  position: absolute;
  top: 30px;
  right: 30px;
  left: auto;
  max-width: 25%;
  padding-bottom: 0;
  background: #FFF;
  background: rgba(255, 255, 255, 0.8);
  overflow: hidden;
  padding: 20px;
}
.infoBlockLeftBlack {
  color: #FFF;
  background: #000;
  background: rgba(0,0,0,0.75);
  left: 30px;
  right: auto;
}
.infoBlock h4 {
  font-size: 20px;
  line-height: 1.2;
  margin: 0;
  padding-bottom: 3px;
}
.infoBlock p {
  font-size: 14px;
  margin: 4px 0 0;
}
.infoBlock a {
  color: #FFF;
  text-decoration: underline;
}
.photosBy {
  position: absolute;
  line-height: 24px;
  font-size: 12px;
  background: #FFF;
  color: #000;
  padding: 0px 10px;
  position: absolute;
  left: 12px;
  bottom: 12px;
  top: auto;
  border-radius: 2px;
  z-index: 25; 
} 
.photosBy a {
  color: #000;
}
.fullWidth {
  max-width: 100%;
  margin: 0 auto 24px;
}

@media screen and (min-width:960px) and (min-height:660px) {
  .heroSlider .rsOverflow,
  .royalSlider.heroSlider {
      height: 520px !important;
  }
}

@media screen and (min-width:960px) and (min-height:1000px) {
    .heroSlider .rsOverflow,
    .royalSlider.heroSlider {
        height: 660px !important;
    }
}
@media screen and (min-width: 0px) and (max-width: 800px) {
  .royalSlider.heroSlider,
  .royalSlider.heroSlider .rsOverflow {
    height: 300px !important;
  }
  .infoBlock {
    padding: 10px;
    height: auto;
    max-height: 100%;
    min-width: 40%;
    left: 5px;
    top: 5px;
    right: auto;
    font-size: 12px;
  }
  .infoBlock h3 {
     font-size: 14px;
     line-height: 17px;
  }
}

      #page-navigation { display: none; }


/*end home*/

/* -----------------------------------------------------------------------------

    RESPONSIVE DEFINITIONS

----------------------------------------------------------------------------- */


	@media ( min-width: 1400px ) {
		.header-menu li{
			margin: 0px 0px 0px 90px;
			}
		.header-menu ul {
			width: 1199px;
			}
			.c-gallery .item-list .item { width: 20%; }
			

			
		
	}
	
	@media ( min-width: 1200px ) {
		#header-fixed {
		    background-color: rgba(237, 237, 237, 0.95)
		
		}
		#footer {
		padding: 20px 0 20px 0;
		}
		#header-fixed {
		border-bottom: 7px solid #fff;
		}
		.darkband {
		margin-top: 160px;
		padding-top:73px;
		padding-bottom:45px;
		
		}
		.various-content .c-parallax-section .section-inner, .c-parallax-section .section-inner {
		height:400px;
		}
		
	}
  
 /* -------------------------------------------------------------------------
        LARGE DEVICES
		devices with width between 992px and 1199px
 ------------------------------------------------------------------------- */
	
    @media ( max-width: 1199px ) {
		html{ 
			background-size: auto 190px;
			background-position: center 24px;
			}
		body{
				background-size: auto 250px;	
				background-position: center -10px;		
		}
		.logo{
			width:200px;
			margin-top:43px;
			
			}
		#header.m-standard {
			height: 200px;
			}
		.c-gallery .gallery-filter{
				margin-top:0px;
				margin-bottom:30px;
		}
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 5.5 0px 0px;
		}
		.c-gallery .gallery-filter>li>button {
			font-size: 19px;
		}
		.bullets{
				width:5px;
		}
		#header-fixed .main-sidebar-toggle {
			right: 15px;
			top: 40px;
		}
		.c-gallery .item-list .item { width: 25%; }
		
		#footer {
		padding: 20px 0 16px 0;
		}


		.various-content p {
		margin-bottom: 3px;
		line-height: 1.5em;
		}

		#body{
			margin-top:52px;
		}
		#homefittext1 {
		margin: 0% auto 32%;
		}
		#homefittext2 {
		margin: 31.75% auto 43.75%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto 4.5%;
		}
		#homefittext5 {
		margin: 0% auto 6.3%;
		}
		#homefittext6 {
		margin: 0% auto 6.2%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}
		.darkband {
		margin-top: 13%;
		
		}

		.bigtextwrapper{
			width:70%;
		}
		.headshot{
			width: 300px;
			margin: 0px auto;
			margin-top: 0px;
			display: block;
			float: left;
			margin: 0px 20px 0px 15px;
		}
		.whiteband{
			background-color: white;
			padding-top: 20px;
			padding-bottom: 20px;

		}
		.threed{
			text-shadow:#B7B7B7 -6px 6px 0;
		}
		.various-content .c-parallax-section .section-inner, .c-parallax-section .section-inner {
		height:450px;
		}

		/* your CSS here */

	}

    /* -------------------------------------------------------------------------
        MEDIUM DEVICES
		devices with width between 768px and 991px
    ------------------------------------------------------------------------- */

    @media ( max-width: 991px ) {
	
		html{ 
			background-size: auto 190px;
			background-position: center 24px;
			}
		body{
			background-size: auto 267px;
			background-position: center -13px;	
		}
		.logo{
			width:200px;
			margin-top:43px;
			
			}
		.c-gallery .item-list .item { width: 33.33333333333%; }
		
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 4.3% 0px 0px;
		}
	
		#footer {
		padding: 20px 0 4px 0;
		}
		#body{
			margin-top:52px;
		}
		#homefittext1 {
		margin: 0% auto 32.75%;
		}
		#homefittext2 {
		margin: 0% auto 44.5%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto 4.5%;
		}
		#homefittext5 {
		margin: 0% auto 6.7%;
		}
		#homefittext6 {
		margin: 0% auto 6.4%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}
		.darkband {
		margin-top: 120px;
		}

		.bigtextwrapper{
			width:85%;
		}
		.headshot{
			width: 300px;
			margin: 0px auto;
			margin-top: 0px;
			display: block;
			float: left;
			margin: 0px 20px 0px 15px;
		}
		.whiteband{
			background-color: white;
			padding-top: 20px;
			padding-bottom: 20px;

		}
		.threed{
			text-shadow:#B7B7B7 -5px 5px 0;
		}
		
		/* your CSS here */
	

	}

	/* -------------------------------------------------------------------------
        SMALL DEVICES
		devices with width between 481px and 767px
    ------------------------------------------------------------------------- */

    @media ( max-width: 767px ) {
		.c-gallery .item-list .item { width: 33.33333333333%; 
			}
		html{
			background-size: auto 180px;
			background-position: center 10px;
			}
		body{
				background-size: auto 220px;	
				background-position: center -12px;		
		}
		.logo{
			width:190px;
			margin-top:-45px;
			
			}
		#header.m-standard {
			height: 180px;
			}
		.c-gallery .gallery-filter{
				margin-top:0px;
				margin-bottom:25px;
		}
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 1.4% 0px 0px;
		}

		#header-fixed .main-sidebar-toggle {
			right: 10px;
			top: 30px;
		}
		.c-gallery .gallery-filter>li>button {
			font-size: 21px;
		}
		#body{
			margin-top:36px;
		}
		#homefittext1 {
		margin: 0% auto 32%;
		}
		#homefittext2 {
		margin: 0% auto 44%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto 3.5%;
		}
		#homefittext5 {
		margin: 0% auto 5.25%;
		}
		#homefittext6 {
		margin: 0% auto 5.1%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}
		.threed{
			text-shadow:#B7B7B7 -7px 7px 0;
		}
		.darkband {
		margin-top: 16.5%;
		}
		.biotext{
			width:100%;
			margin-top:5.5%;
		}
		.bigtextwrapper{
			width:90%;
		}
		.headshot{
			width:200px;		
			margin: 0px auto;
			margin-top:0px;
			display:block;
		}
		.whiteband{
			background-color: white;
			padding-top: 20px;
			padding-bottom: 20px;

		}
		.threed{
			text-shadow:#B7B7B7 -5px 5px 0;
		}
		.various-content .c-parallax-section .section-inner, .c-parallax-section .section-inner {
		height:225px;
		}
		/* your CSS here */

	}
	
@media ( min-width: 570px ) {	
	.headshot{
		float: left;
		margin-left:15px;
		margin-right:20px;
	}
	.biotext{
		margin-top:auto;
		margin-bottom:auto;
		width:100%;
	}
}

	/* -------------------------------------------------------------------------
        EXTRA SMALL DEVICES
		devices with width up to 480px
    ------------------------------------------------------------------------- */
@media ( min-width: 480px ) {
		.bullets-invisible{
		display:none;}
	}


	@media ( max-width: 480px ) {
	
		.c-gallery .item-list .item { width: 50%; }
		html{ background-size: auto 140px;
			background-position: center 9px;
			}
		body{ background-size: auto 165px;	
				background-position: center -7px;		
		}
		.logo{
			width:150px;
			margin-top:-50px;
			
			}
		#header.m-standard {
			height: 140px;
			}
		.c-gallery .gallery-filter{
				margin-top:-100px;
			
		}
			.c-gallery .gallery-filter{
				margin-top:-1px;
				margin-bottom:12px;
		}
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 0.5% 0px 0px;
		}
		.c-gallery .gallery-filter>li>button {
			font-size: 21px;
		}
		.col-md-6 {
		width: 100%;
		}
		.headshot{
			width:60%;
			
			margin: 0px auto;
			margin-top:-20px;
			display:block;
		}
		.biotext{
			margin-top:7.5%;
		}
		.bigtextwrapper{
			width:350px;
		}
		#body{
			margin-top:36px;
		}
		#homefittext1 {
		margin: 0% auto 29%;
		}
		#homefittext2 {
		margin: 0% auto 41%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto 1.15%;
		}
		#homefittext5 {
		margin: 0% auto 2.9%;
		}
		#homefittext6 {
		margin: 0% auto 3%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}
		.darkband {
		margin-top: 14.5%;
		}
		.greyband{
			background-color: #EDEDED;
			padding-top: 20px;
			padding-bottom: 20px;
		}
		.whiteband{
			background-color: white;
			padding-top: 30px;
			padding-bottom: 20px;


		}
		.threed{
			text-shadow:#B7B7B7 -4px 4px 0;
		}

	}
	
	@media ( max-width: 479px ) {
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 3.25% 0px 0px;
		}
		.col-md-6 {
		width: 100%;
		}
		.biotext{
			margin-top:7.5%;
		}

	}
		/* your CSS here */
		
		@media (max-width: 430px){
			body{background: url('../../images/eraser-320.svg') no-repeat scroll center; 
					background-size: auto 165px;	
					background-position: center 0px;		
			}

			.portfolio-list .c-gallery .gallery-filter>li {
					margin: 0px 3.25% 0px 0px;
			}
			.col-md-6 {
			width: 100%;
			}
			.bigtextwrapper{
				width:100%;
			}

			.darkband {
			margin-top: 16.5%;
			}
			
			#homefittext1 {
			margin: 0% auto 30%;
			}
			#homefittext2{
				margin: 0% auto 42%;
			}
			#homefittext3{
				margin: 0% auto 0%;
			}
			#homefittext4{
				margin: 0% auto 1.15%;
			}
			#homefittext5{
				margin: 0% auto 3.15%;
			}
			#homefittext6{
				margin: 0% auto 2.8%;
			}
			#homefittext7{
				margin: 0% auto 0%;
			}

			.whiteband, .greyband{
				padding:13px 0px 13px 0px;
			}
			h1{
				margin-bottom:25px;
				font-size: 35px;
			}



			/* your CSS here */
		}

		
	@media (max-width: 390px){

		.logo{
			width:145px;
			margin-top:-46px;
			
			}

		.c-gallery .gallery-filter>li>button {
			font-size: 21px;
		}
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 2% 0px 0px;
		}

		.bullets{
			width:4px;
		}
		.col-md-6 {
		width: 100%;
		}
		.greyband{
			background-color: #EDEDED;

			padding-bottom: 20px;

		}
		.darkband {
		margin-top: 16.5%;
		}
		#body{
			margin-top:37px;
		}
		#homefittext1 {
		margin: 0% auto 30%;
		}
		#homefittext2{
			margin: 0% auto 42.5%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto 1.15%;
		}
		#homefittext5{
			margin: 0% auto 3.15%;
		}
		#homefittext6{
			margin: 0% auto 2.8%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}


		
		
		
		/* your CSS here */
	}

	
	@media ( max-width: 330px ) {
	


		.c-gallery .gallery-filter>li>button {
			font-size: 21px;
		}
		.portfolio-list .c-gallery .gallery-filter>li {
				margin: 0px 1.5% 0px 0px;
		}
		.col-md-6 {
		width: 100%;
		}
		.headshot{
			width:75%;
			margin: 0px auto 0%;
			display:block;
		}
		.biotext{
			margin-top:25px;
		}
		.bigtextwrapper{
			width:100%;
		}

		.darkband{
			margin-top:17%;
		}
		#homefittext1{
			margin: 0% auto 28.25%;
		}
		#homefittext2{
			margin: 0% auto 40%;
		}
		#homefittext3{
			margin: 0% auto 0%;
		}
		#homefittext4{
			margin: 0% auto .75%;
		}
		#homefittext5{
			margin: 0% auto 2.15%;
		}
		#homefittext6{
			margin: 0% auto 2.25%;
		}
		#homefittext7{
			margin: 0% auto 0%;
		}
		#body{
			margin-top:32px;
		}



		/* your CSS here */

	}