html, body{
width:100%;
height:100%;
padding:0;
margin:0;
font-family: 'Raleway', sans-serif;
line-height: 22px;
font-size: 18px;
letter-spacing: 1px;
}

/*
body { 
  background: url(../images/GT40back.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  overflow-y:scroll;
}
*/
body{ position:relative; }
.left{ float:left; }
.right{ float:right;}
.clear{ clear:both; }
.center{ margin:0 auto; }


#container{
width:1200px;
margin: 0 auto
}
#blackBox{
position: fixed; top:0px; right:50px;
width:400px;
padding:0px;
/*background-color:rgba(255,255,255,0.75);*/
box-shadow:3px 3px 6px #000;
box-shadow:3px 3px 6px rgba(0,0,0,0.4);
	h1{
	font-family: 'Lexend Zetta', sans-serif;
}
}
#blackBox2{
position: fixed; top:355px; right:50px;
width:400px;
padding:20px;
background-color:#000;
background-color:rgba(255,255,255,0.75);
box-shadow:3px 3px 6px #FFF;
box-shadow:3px 3px 6px rgba(0,0,0,0.4);
	h1{
	font-family: 'Lexend Zetta', sans-serif;
}
}
.blackBoxFrt{ height:175px; }
.blackBoxBack{ height:75px; }

#content{
margin-top:135px;
margin-left: 50px;
width:800px;
float:left;
color:#000;
padding:20px;
font-size:14px;
/*background-color:#000;*/
background-color:rgba(255,255,255,0.75);
box-shadow:3px 3px 6px #000;
box-shadow:3px 3px 6px rgba(0,0,0,0.4);
}
	p
	{
    /*border-left: 3px white solid;*/
    padding-left: 20px;
    /*margin-right: 40%;*/
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    color: #666666;
    font-weight: bold;
	}
.nametitle{
    color: #03889E;
}
#logo{
color:#fff;
font-size:14px;
}
#logo h1{
color:#fff;
	font-family: 'Teko', sans-serif;
	font-size: 48px;
	font-weight: 200;
	letter-spacing: 7px;
	text-align: center;
text-shadow:2px 2px 4px #000;
text-shadow:2px 2px 4px rgba(0,0,0,0.5);
}
#txt{
font-size:14px;
margin-top:55px;
color:#fff;
}

#menu{
margin-top:20px;
float:left;
line-height:20px;
font-size:18px;
color:#000;
}
#menu a{
	line-height:22px;
	font-size:18px;
	color:#000;
	text-decoration:none;
}

#menutagline{
background: rgba(255,255,255,0.75);
padding: 0 20px 0 20px;
position:fixed;
left:0;
top:45px;
float:left;
color:#666;
font-size:18px;
line-height:48px; 
text-shadow:3px 2px 3px #000;
text-shadow:3px 2px 3px rgba(0,0,0,0.4);
box-shadow:3px 3px 6px #000;
box-shadow:3px 3px 6px rgba(0,0,0,0.4);
}
#menutagline a{

bottom:20px;
color:#03889E;
font-size:18px;
letter-spacing:3px;
line-height:40px;
text-decoration:none;
text-shadow:none;
}
a:hover {
    color: #F00;
    text-decoration: none;
}

#botTagLine{
width:960px;
text-align:center;
position:absolute;
font-size:48px;
font-weight:700;
font-style:italic;
color:#fff;
text-shadow:3px 3px 5px #000;
text-shadow:3px 3px 5px rgba(0,0,0,0.5);
bottom: 100px;
}

.box{
position:relative;
float:left;
width:479px;
overflow:hidden;
background-color:#fff;
}
.short{ height:50px; }
.box:nth-of-type(1), .box:nth-of-type(2){
border-bottom:1px solid #aaa;
}
.box:nth-of-type(2), .box:nth-of-type(4){
border-left:1px solid #aaa;
}
.box:nth-of-type(3){
box-shadow:1px 0px 0px #aaa;
}

.boxTitle{ margin:16px; }
.boxTitle i{ color:#aaa; font-style:normal; }
.grey{ background-color:#aaa; }
.white{ color:#fff; }
h3{ font-size:20px; padding:0; margin:0; }
.pad{ padding:16px; }
.padsides{ padding:0 16px; }
.box3img{ width:447px; display:none; }
#b3padTxt0{ padding:0px 16px 8px 16px; }

.fivecols{
	background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #fff), color-stop(100%, #fff));   	
	background-image: -webkit-linear-gradient( left, #fff, #fff 100% );
	background-image: -moz-linear-gradient(	left, #fff, #fff 100% );
	background-image: -ms-linear-gradient( left, #fff, #fff 100% );
	background-image: -o-linear-gradient( left, #fff, #fff 100%	);
	box-shadow:4px 4px 7px #000;
	box-shadow:4px 4px 7px rgba(0,0,0,0.5);
}

.projectTitle{
padding:3px;
}
.projectTitle b{
color:#999;
font-weight:100;
}
.projectTitle:hover, .projectTitle:hover b{
cursor:default;
color:#33f;
}
/*project page begin*/
.smallbox{ width:300px; }
.bigbox{ width:659px; }


/*project page end*/
/*fusebox stylesheet begin*/
	#FBcover{
		position:absolute;
		z-index:900;
		top:-999em;
		left:-999em;
		width:100%;
		height:100%;
		background-color:#666;
		background-color:rgba(0,0,0,0.7);
	}
	#FBcont{
		position:absolute;
		border:3px double #666;
		background-color:#fff;
		cursor:pointer;
	}
	#FBcont div{
		position:absolute;
		margin: auto;
	}
	#FBcont img{
		width:auto;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		-o-user-select: none;
		user-select: none;  
	}
	.FBpointer{
		position:absolute;
		z-index:1;
		width: 0;
		height: 0;
		border-style: solid;
		display:none;
	}
	.FBpointerLeft{
		left:5px;
		border-width: 50px 38px 50px 0;
		border-color: transparent #ccc transparent transparent;
		border-color: transparent rgba(204,204,204,0.5) transparent transparent;
	}
	.FBpointerRight{
		right:5px;
		border-width: 50px 0 50px 38px;
		border-color: transparent transparent transparent #ccc;
		border-color: transparent transparent transparent rgba(204,204,204,0.9);
	}
/*fusebox stylesheet end*/
/*little comm images begin*/
/* why? * /
#COMppLittleimgCont{
width:450px;
}
/**/
.COMppLittleimgConts:first-of-type{
margin-left:0;
}
.COMppLittleimgConts:last-of-type{
margin-right:0;
}
.COMppLittleimgConts{
background-color:#ccc;
float:left;
cursor:pointer;
}

.COMppLittleimg{
max-width: 100%;
max-height: 100%;
display: block;
margin: auto;
}
#COMppBigimgCont{
overflow:hidden;
background-color:#ccc;
width:98%;
margin:1%;
cursor:pointer;
}
#COMppBigimg{
margin:0px auto;
display:block;
}
/*little comm images end*/
.red {
	color: #F00;
	font-size: 24px;
}
a {
	color: #03889E;
	text-decoration: none;
}
a:hover {
    color: #F00;
    text-decoration: none;
}
#contact {
	display: block; 
	width: 125px;
	height: 125px; 
	position: fixed; bottom:50px; right:50px;
}
#webdesign {
	display: block; 
	width: 100px;
	height: 25px; 
	position: fixed; bottom:50px; right:50px;
}

.bgSlideShow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -100;
}

.bgSlideShow > .ssImage {
  position: absolute;
  width: 100%;
  min-height: 100%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.image-wrap {
  /*max-height: 800px;*/
  /*overflow: hidden;*/
  position: relative;
  max-width: 100%;
  -webkit-transition: max-width 0.5s ease-out;
  /* Saf3.2+, Chrome */
  -moz-transition: max-width 0.5s ease-out;
  /* FF4+ */
  -ms-transition: max-width 0.5s ease-out;
  /* IE10? */
  -o-transition: max-width 0.5s ease-out;
  /* Opera 10.5+ */
  transition: max-width 0.5s ease-out;
}

.image-wrap > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transition: margin-top 0.5s ease-out;
  /* Saf3.2+, Chrome */
  -moz-transition: margin-top 0.5s ease-out;
  /* FF4+ */
  -ms-transition: margin-top 0.5s ease-out;
  /* IE10? */
  -o-transition: margin-top 0.5s ease-out;
  /* Opera 10.5+ */
  transition: margin-top 0.5s ease-out;
  opacity: 0;
}

.image-wrap > img.active {
  z-index: 5;
}

.image-wrap > img.last {
  z-index: 0;
}

.image-wrap > img.placeholder {
  position: relative;
  display: block;
  opacity: 0;
}

.image-wrap > .homepage-tag-line {
  position: relative;
  width: 1500px;
  height: 40px;
  height: 2vw;
  margin: 0 auto;
  padding: 5px 0 10px;
  top: 10px;
  z-index: 200;
}

.image-wrap > .homepage-tag-line > .tag {
  position: fixed;
  height: 40px;
  height: 2.8vw;
  margin-left: 100px;
  /*overflow: hidden;*/
  top: 5px;
  /*width: 600px;*/
}

.image-wrap > .homepage-tag-line > .tag > h1 {
  position: relative;
  display: inline-block;
  opacity: 0;
  word-break: break-all;
  letter-spacing: 10px;
  font-size: 33px;
  color: #FFF;
  text-shadow: 2px 2px 2px #000;
}

@media only screen and (min-width: 800px) {
  .image-wrap {
    max-width: 100%;
	  z-index: -1;
  }
}

#mainImgBack {
  /*height: auto;
    min-width:800px; 
    width: 100%; 
    
    max-height:1067px;
    z-index:1;
    vertical-align: text-top;
    overflow:hidden;*/
  max-width: 100%;
}
