/*
	Tania Fitzpatrick
	tania@reddotdesign.ca
*/

/* Use Border Box */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* Normalize CSS */
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:700;}dfn{font-style:italic;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace, serif;font-size:1em;}pre{white-space:pre-wrap;word-wrap:break-word;}q{quotes:\201C \201D \2018 \2019;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-.5em;}sub{bottom:-.25em;}img{border:0;}svg:not(:root){overflow:hidden;}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,html input[type=button],/* 1 */
input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;}button[disabled],input[disabled]{cursor:default;}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}body,figure{margin:0;}legend,button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/* -- BASE STYLES 
------------------------------------------------------------- */

body {
	background: #efefef;
	font-family: 'Open Sans', sans-serif;
}

.wrapper {
	max-width: 940px;
	margin: 0 auto;
}

h1 {
	font-family: "Open Sans";
	font-weight: 600;
	font-size: 15px;
}

h3 {
	font-family: "Open Sans";
	font-weight: 700;
	font-size: 12px;
	padding: 0 0 7% 0;
	margin: 0;
	color: #2c2c2c;
}

h4 {
	color: #979696;
	font-family: "Sanchez";
	font-size: 8px;
	text-transform: uppercase;
	margin: 0;
	padding: 0 0 5px 0;
	line-height: 11px;
}


/* -- TWITTER BAR 
------------------------------------------------------------- */

.twitter {
	position: relative;
	max-width: 940px;
	margin: 0 auto;
	padding: 0;
	background: #efefef;
	border-radius: 0 0 2px 2px;
}

.twitter img {
	position: absolute;
	top: 17px;
	left: 0;
}

.twitter a {
	float: left;
	padding-right: 8px;
}

.redDot {
	padding: 17px 0 0 25px;
	text-decoration: none;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 12px;
	color: #cc0033;
}

.tweetDump p {
	font-family:"Open Sans";
	font-weight: 400;
	color: #979696;
	font-size: 12px;
	padding: 17px 0 15px 120px;
	margin: 0;
	font-style: italic;
}

.tweetDump a {
	color: #cc0033;
}

/* -- NAVIGATION BAR 
------------------------------------------------------------- */

.header {
	max-width: 940px;
	margin: 2px auto 0 auto; 
	background: #2c2c2c;
	min-height: 90px;
	border-radius: 2px;
	border-top: 6px solid #979696;
	position: relative;
}

.navBar {
	width: 66%;
	float: right;
}
	
ul.menu {
list-style-type: none;
margin: 0;
padding: 47px 30px 9px 0;
float: right;
}

ul.menu li {
	display: inline;
}

ul.menu li a {
	color: #c1c1c1;
	text-decoration: none;
	font-size: 13px;
	padding-left: 33px;
	font-family: "Open Sans";
	font-weight: 600;
}

ul.menu li a:hover {
	color: white;
}

.number {
	font-family: "Sanchez";
	color: #979696;
	font-size: 10px;
}

/* -- PHOTO AND INTRO BAR
------------------------------------------------------------- */

.logoBar {
	max-width: 940px;
	margin: 0 auto;
	background: #efefef;
	min-height: 80px;
}

.leftLogoBox {
	width: 33%;
	margin-top: 0px;
	float: left;
	overflow: hidden;
}

.dotbox {
	position: relative;
	width: 33%;
}


.dot {
	background: rgba(204, 0, 51, .8);
	padding: 40px;
	border-radius: 50%;
	position: absolute;
	top: 58px;
	left: 215px;
	z-index: 999;
}

img.logo {
	margin: 0 auto;
	display: block;
}

.logoCopy h1 {
	text-align: center;
	font-family: "Open Sans";
	font-weight: 600;
	font-size: 12px;
	color: #979696;
	margin-top: 10px;
	line-height: 15px;
}

.logoCopy p {
	text-align: center;
	font-family: "Open Sans";
	font-size: 11px;
	color: #2c2c2c;
}

.rightLogoBox {
	max-width: 66%;
	float: right;
	margin-bottom: 60px;
}

.introduction p {
	font-family: "Open Sans";
	font-weight: 400;
	font-size: 21px;
	color: #969696;
	line-height: 42px;
	margin: 0;
	padding: 25px 0 0 0;
}

span.name {
	color: #2c2c2c;
	font-weight: 600;
}

span.wait {
	color: #2c2c2c;
	font-weight: 600;
}

.makeRed {
	color: #cc0033;
}

.hiThere {
	font-family: "Open Sans";
	font-weight: 600;
	color: #2c2c2c;
}

.yay {
	color: #cc0033;
	font-size: 14px;
}


.funFacts {
	color: #c1c1c1;
	font-size: 14px;
	font-family: "Open Sans";
	font-weight: 400;
	text-decoration: none;
	margin-right: 3px;
	-webkit-transition: color 1s;
	-moz-transition: color 1s;
	-ms-transition: color 1s;
}

.funFacts:hover {
	color: #cc0033;
	border-bottom: 0;
	font-weight: 400;
}


/* -- DESIGN / PHOTOGRAPHY SECTION 
------------------------------------------------------------- */

img.backToTop {
	position: fixed;
	max-width: 60px;
	max-height: 60px;
	right: 0;
	bottom: 8px;
}

.section {
	max-width: 940px;
	border-top: 1px dotted #323333;
	border-bottom: 2px solid #323333;]
	float: left;
}

h5 {
	margin: 0;
	padding: 12px 0 12px 0;
	color: #cc0033;
	font-size: 18px;
	font-family: "Open Sans";
	font-weight: 600;
}

.sectionNumber {
	color: #2c2c2c;
	font-family: "Sanchez";
	margin-left: 3%;
	font-size: 12px;
	margin: 0;
	padding: 0;
}

.package {
	max-width: 940px;
	border-radius: 2px;
	margin: 0;
	padding: 0;
	border-bottom: 1px dotted #979696;
}

.package2 {
	max-width: 940px;
	border-radius: 2px;
	margin: 0;
	padding: 0;
	border-bottom: 1px dotted #979696;
}

.package3 {
	max-width: 940px;
	border-radius: 2px;
	max-height: 500px;
	margin: 0;
	padding: 0;
}

.leftaboutDesign {
	width: 27%;
	float: left;
	margin: 3% 2% 2% 3%;
	border-radius: 2px;

}

.leftaboutDesign p {
	font-family: "Open Sans";
	font-style: italic;
	font-weight: 400;
	font-size: 12px;
	line-height: 20px;
	padding: 0;
	margin: 0;
	color: #2c2c2c;
}

.leftaboutPhotography {
	width: 27%;
	float: left;
	margin: 0% 2% 6% 3%;
	border-radius: 2px;
}

.leftaboutPhotography p {
	font-family: "Open Sans";
	font-weight: 400;
	font-size: 12px;
	line-height: 20px;
	padding: 0px 28px 0 0;
	margin: 0 0 30px 0;
	color: #2c2c2c;
}

.leftaboutPhotography a {
	color: #cc0033;
	font-weight: 700;
	text-decoration: none;
	font-family: "Sanchez";
	letter-spacing: -1px;
}

.thirds {
	width: 20%;
	margin-left: 2%;
	float: left;
	color: #c1c1c1;
	min-height: 200px;
}

.thirds p {
	text-align: center;
	color: #2c2c2c;
	font-size: 15px;
	font-weight: 400;
}

.thirds img {
	border-radius: 2px;
	width: 100%;
	margin: 0 auto;
	box-shadow: 0 8px 6px -6px #323333;
	border: 8px solid white;
}

.thirds img:hover {
	border: 8px solid #323333; 
}

.photoCategory {
	color: #979696;
	font-size: 11px;
	font-family: "Sanchez";
	text-transform: uppercase;
}	

.leftaboutAbout {
	width: 100%;
	float: left;
	margin: 3% auto;
	border-radius: 2px;
}

.technology {
	font-family: "Open Sans";
	font-weight: 400;
}

.project {
	margin-top: 25px;
}


.flexslider  {
	width:65%;
	float:left;
	margin: 3% 0% 6% 3%;
}

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

.detailsHalf p {
	font-family: "Open Sans";
	font-weight: 400;
	font-size: 12px;
	line-height: 22px;
	padding: 0 28px 0 30px;
	margin: 0 0 30px 0;
	color: #2c2c2c;
}

span.acceptingWork {
	font-family: "Sanchez";
	font-size: 18px;
	color: #cc0033;
}

/* -- FOOTER 
------------------------------------------------------------- */

.footer {
	background: #2c2c2c;
	border-top: 12px solid #979696;
	max-width: 940px;
	margin: 0 auto;
	clear: both;
}

.footer p {
	color: #979696;
	font-size: 9px;
	text-align: center;
	padding-bottom: 10px;
}

.footerThird {
	width: 33.3%;
	float: left;
	margin: 20px 0 0 0;
	min-height: 65px;
	padding: 0 30px;
}

.footerThird img {
	margin: 8px auto;
	display: block; 
	width: 40px;
}

.footerThird img:hover {
	border: 3px solid #cc0033;
	border-radius: 50%;
}

.footerThird a {
	font-family: "Open Sans";
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	color: #c1c1c1;
	text-align: center;
	display: block;
}

.footerThird a:hover {
	color: #efefef;
}

h6 {
	text-align: center;
	color: #979696;
	font-family: "Sanchez";
	font-size: 10px;
	text-transform: uppercase;
	margin: 0 0 10px 0;
}

.thirdCopy {
	font-family: "Open Sans";
	font-weight: 400;
	font-size: 12px;
	line-height: 22px;
	color: #c1c1c1;
	font-style: italic;
}

.redDotDesign {
	font-style: italic;
	color: #cc0033;
}

.testimonialName {
	color: #979696;
	font-family: "Sanchez";
	font-size: 12px;
	line-height: 40px;
}

.mouseCopy {
	width:100%;
}


/* Flex Slider */

/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {position: relative;  zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}

.carousel li {margin-right: 5px}


/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {opacity: 1; left: 0;}
  .flex-direction-nav .flex-next {opacity: 1; right: 0;}
}