@charset "UTF-8";
/* CSS Document */

body{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-weight: 400;
	background-color: #EFECDF;
	background-image: url(../img/background.png);
	background-repeat: repeat-x;
}
h1{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #9B7D0C;
}
h4{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	color: #9B7D0C;
}
.copyright{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-size: 12px;
	color: #EFECDF;
}
.small{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-size: 12px;
}
.small3{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-size: 21px;
}
.small2{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
}
.black{
		background-color: #000000;

	width: 100%;
	}
.highlight{
		  border: solid 1px #CC6632;
	padding: 10px;
	}
.work{
	margin-bottom: 20px;
}	
.button{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-size: 20px;
}

.button-group li{padding-top:3%;}

.button-group a{
	color: #CC6632;
	background-color: transparent;
}

.button-group a:hover{
	color: #9B7D0C;
	background-color: transparent;
}

.button-group{float:none;}

@media only screen and (min-width: 40.063em) {
	}
	
	@media only screen and (min-width: 40.063em) {
		
		.namelogo{padding-bottom:10px;}
		}
		
		.namelogo h1{font-size:1.5em;font-weight:600;text-align:center;}
		
		@media only screen and (min-width: 40.063em) {
			.namelogo h1{font-size:16px;text-align:left;}}
			
			@media only screen and (min-width: 64.063em) {
				.namelogo h1{font-size:24px;text-align:left;}
				}
.photo{
	float: left;
	margin-right:15px;
	border: solid #CC6632 1px }
	
	.photo2{
	border: solid #CC6632 1px }
					
.hero{
	background-color: #000000;
	border-top: solid #CC6632 5px;
	border-bottom: solid #CC6632 5px;
	background-size: cover;
	box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.15);
	height: auto;
}
.heropress{
	background-color: #000000;
	border-top: solid #CC6632 5px;
	border-bottom: solid #CC6632 5px;
	background-size: cover;
	box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.15);
	height: auto;
	background-image: url(../img/caito-press2.jpg);
}
.heroportfolio{
	background-color: #000000;
	border-top: solid #CC6632 5px;
	border-bottom: solid #CC6632 5px;
	background-size: cover;
	box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.15);
	height: auto;
	background-image: url(../img/caito-portfolio2.jpg);
}
.heroabout{
	background-color: #000000;
	border-top: solid #CC6632 5px;
	border-bottom: solid #CC6632 5px;
	background-size: cover;
	box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.15);
	height: auto;
	background-image: url(../img/caito-about2.jpg);
}
.herofeature{
	background-color: #000000;
	border-top: solid #CC6632 5px;
	border-bottom: solid #CC6632 5px;
	background-size: cover;
	box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.15);
	height: auto;
	background-image: url(../img/feature.jpg);
}
	
				
				.intro-text{padding-top:20%;color:rgba(255,255,255,1);text-align:center;}
				
				@media only screen and (min-width: 40.063em) {
					
					.intro-text{padding-top:15%;}
					}
					
					@media only screen and (min-width: 64.063em) {
						
						.intro-text{padding-top:18%;}
						}
						
						.intro-text p{
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
	font-size: 50px;
}
						.about{padding:50px 0 0 0;}
						.work,.contact,.press{padding:10px 0 0 0;}
						
						.about img{width:180px;
						height:180px;
						border-radius:150px;
						-webkit-border-radius:150px;
						-moz-border-radius:150px;}
						
						.work img:hover{opacity:0.5;-webkit-transition:0.3s ease;-moz-transition:0.3s ease;-ms-transition:0.3s ease;-o-transition:0.3s ease;transition:0.3s ease;}
						
						.work li{height:140px;overflow:hidden;}
						
						hr{border:0;height:1px;background-image:-webkit-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));opacity:0.8;}
						
						footer{padding:20px 0 10px 0;
						border-top: solid #CC6632 5px;
							background-color: #000000;

	width: 100%;}
						
						footer a:hover{color:#9B7D0C;}
				
				
				
				
						.contain-to-grid {
  width: 100%;
  background: none; 
	}
  
  .top-bar {
  overflow: hidden;
  height: 2.8125rem;
  line-height: 2.8125rem;
  position: relative;
  background:none;
  margin-bottom: 0;
   }

	
	.top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] {
      border-bottom: none;
      border-top: none;
      border-right: solid 1px #CC6632;
      clear: none;
      height: 2.8125rem;
      width: 0; }
	  
	  
	  
	  
	  .reveal-modal-bg {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #000000;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1004;
  display: none;
  left: 0; }

.reveal-modal {
  visibility: hidden;
  display: none;
  position: absolute;
  z-index: 1005;
  width: 100%;
  top: 0;
  border-radius: 3px;
  left: 0;
  background-color: #EFECDF;
  padding: 1.875rem;
  border: solid 1px #666666;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
  @media only screen and (max-width: 40em) {
    .reveal-modal {
      min-height: 100vh; } }
  .reveal-modal .column, .reveal-modal .columns {
    min-width: 0; }
  .reveal-modal > :first-child {
    margin-top: 0; }
  .reveal-modal > :last-child {
    margin-bottom: 0; }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal {
      width: 80%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal {
      top: 6.25rem; } }
  .reveal-modal.radius {
    border-radius: 3px; }
  .reveal-modal.round {
    border-radius: 1000px; }
  .reveal-modal.collapse {
    padding: 0; }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal.tiny {
      width: 30%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal.small {
      width: 40%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal.medium {
      width: 60%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal.large {
      width: 70%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  @media only screen and (min-width: 40.063em) {
    .reveal-modal.xlarge {
      width: 95%;
      max-width: 62.5em;
      left: 0;
      right: 0;
      margin: 0 auto; } }
  .reveal-modal.full {
    top: 0;
    left: 0;
    height: 100%;
    height: 100vh;
    min-height: 100vh;
    max-width: none !important;
    margin-left: 0 !important; }
    @media only screen and (min-width: 40.063em) {
      .reveal-modal.full {
        width: 100%;
        max-width: 62.5em;
        left: 0;
        right: 0;
        margin: 0 auto; } }
  .reveal-modal.toback {
    z-index: 1003; }
  .reveal-modal .close-reveal-modal {
    font-size: 2.5rem;
    line-height: 1;
    position: absolute;
    top: 0.625rem;
    right: 1.375rem;
    color: #AAAAAA;
    font-weight: bold;
    cursor: pointer; }
	
	