/*General Items*/
*{
    margin:0;
    padding:0;
}
body{
    background:#000;
    font-family: 'Gudea', sans-serif;
    font-size: 34px;
}
a{
    color:#fff;
    text-decoration:none;
}
h1{
    font-size:50px;
    line-height:45px;
}
h2{
    font-size:30px;
    line-height:28px;
}
p{
    font-size:22px;
    line-height:24px;
}
a:hover{
    text-decoration:underline;
}

fieldset {
  border:0px;
}

input, textarea, button{
  font-size:14px;
  padding:0 10px;
  font-family: 'Gudea', sans-serif;
  color:#999;
  margin-top:10px;
  
  -webkit-border-radius: 10px; /* Saf3-4, iOS 1-3.2, Android =1.6 */
     -moz-border-radius: 10px; /* FF1-3.6 */
          border-radius: 10px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */

  /* useful if you don't want a bg color from leaking outside the border: */
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;

  -webkit-box-shadow: 0 0 2px 2px #81080c; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
     -moz-box-shadow: 0 0 2px 2px #81080c; /* FF3.5 - 3.6 */
          box-shadow: 0 0 2px 2px #81080c; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
          border:0px;

}
input {
  width:400px; 
  height:40px;
}

textarea {
  width:400px; 
  height:200px;
  padding-top:10px;
}

button{
width:100px;
height:40px;
color:black;
font-weight:bold;
}


/*End General items*/

/* Header Section */
.header{
    position:fixed;
    left:0;
    height:95px;
    width:100%;
    top:0;
    font-size:13px;
    font-weight:bold;
    z-index:10;
    background: url('../img/bg-header.png');
           
}
.nav {
    float:right;
    font-size:18px;
    margin:35px 10px 0 0;
    
}
 
.nav li{
    float:left;
    color:#000;
    list-style-type:none;
}
.nav li a{
    padding:3px 5px;
    margin:5px;
    display:block;
    color:#000;
}
.nav li a:hover{
    text-decoration:none;
    color:#000;
    background-color:#ddd;
    
    -webkit-border-radius: 5px; /* Saf3-4, iOS 1-3.2, Android =1.6 */
    -moz-border-radius: 5px; /* FF1-3.6 */
    border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
    -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;

}

.nav li .bg{
    text-decoration:none;
    color:#000;
    background-color:#ddd;
    
    -webkit-border-radius: 5px; /* Saf3-4, iOS 1-3.2, Android =1.6 */
    -moz-border-radius: 5px; /* FF1-3.6 */
    border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
    -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;

}

/* End Header Section */

/*Content Sections*/

.section{
    margin:0px;
    height:800px;
    width:100%;
    float:left;
    text-align:center;
    padding:75px 0 50px 0;
    position:relative;
}
.black{
    color:#fff;
    background-color:black;
    padding-right:20px

}
.white{
    color:#000;
    background-color:white;
    padding-right:20px

}
.red{
    color:#fff;
    background-color:#db2127;
    padding-right:20px
}

.mycontent {
    display:block;
    width:1000px;
    text-align:left;
    margin-left: auto;
    margin-right: auto;

}

.hr{
  margin-top:10px;
  height:10px;
  border-top:1px dashed white;
  clear:both;
}
.colfull {
    margin-top:20px;
    margin-bottom:20px;

}
.col2 {
    width:480px;
    float:left;
    margin-top:20px;

}

.col3 {
    width:309px;
    margin-left:16px;
    float:left;
}
.col3 ul{
  margin-left:20px;
  font-size:16px;
  line-height:18px;
}

.col3 img{
      border:3px solid white;
}

.left{
    margin-left:20px;
}

.callout {
    margin-top:5px;
    /* the image size is 126x126, it's adjusted to fit the border as well*/
    width:309px;
    height:233px;
 
    /* important, allow the children object to move inside its parent obj */
    position:relative; 
 
    /* important, it hides the moved image */
    overflow:hidden;
     
    /* with the clear class, make it into 3 x 3 layout */
    float:left;
     
    /* IE float bug fix */
    display:inline;
     
    /* styling */
    font-size:12px;
}
 
.callout img {
    display:block;
    width:303px;
    height:227px;
    /* styling */
    text-decoration:none;
    border:3px solid #fff;
    background:#000;
 
    /* important, it allows this obj to move by jquery */
    position:absolute;
     
    /* make sure it appears above the caption */
    z-index:5;
     
    cursor:pointer; cursor:hand;
}
 
 
.callout .caption {
    /* should be the same size with the image */
    width:303px;
    height:227px;
     
    /* styling */
    background:#000;
    border:3px solid #fff;
    color:#eee;
     
    /* set the position to 0, 0 and appear under the image */
    position:absolute;
    top:0; left:0;
    z-index:0;
}
 
 
/* extra styling*/
 
.callout .caption a.header {
    margin:10px 5px 5px 5px;
    display:block;
    font-size:14px;
    font-weight:700;
    color:#4ed7f4;
}
 
.callout .caption p {
    margin:5px;
}

.gallery ul{
  margin-top:10px;
}
.gallery ul li{
    float:left;
    color:#000;
    margin-right:10px;
    list-style-type:none;
}

.gallery img{
 border:3px solid white;
}

#section4{
    height:2000px;
}

/*End Content Sections*/

/*Footer Section*/
.footer{
    position:fixed;
    width:100%;
    height:60px;
    padding-top:25px;
    bottom:-20px;
    font-size:13px;
    font-weight:bold;
    z-index:10;
    background: url('../img/bg-footer.png') repeat-x top left;
}

.footer .phone{
    font-size:30px;
    font-weight:bold;
    margin:0 0 0 20px;
    color:white
}

.footer .social{
    position:absolute;
    top:-5px;
    right:15px;
    font-size:30px;
    font-weight:bold;
    margin:0 0 0 20px;
    color:white
}

.footer a:hover{
    color:#ddd;
    text-decoration:none;
}
/*End Footer Section*/

/*! fancyBox v2.0.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-tmp iframe, .fancybox-tmp object {
	vertical-align: top;
	padding: 0;
	margin: 0;
}

.fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1002;
}

.fancybox-outer {
	position: relative;
	padding: 0;
	margin: 0;
	background: #f9f9f9;
	color: #444;
	text-shadow: none;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
			border-radius: 4px;
}

.fancybox-opened {
	z-index: 1003;	
}

.fancybox-opened .fancybox-outer {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-inner {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	position: relative;
	outline: none;
	overflow: hidden;
}

.fancybox-error {
	color: #444;
    font: 14px/20px;
    margin: 0;
    padding: 10px;
}

.fancybox-image, .fancybox-iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	padding: 0;
	margin: 0;
	vertical-align: top;
}

.fancybox-image {
	max-width: 100%;
	max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
	background-image: url('../img/fancybox_sprite.png');
}

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -22px;
	margin-left: -22px;
	background-position: 0 -108px;
	opacity: 0.8;
	cursor: pointer;
	z-index: 1010;
}

#fancybox-loading div {
	width: 44px;
	height: 44px;
	background: url('../img/fancybox_loading.gif') center center no-repeat;
}

.fancybox-close {
	position: absolute;
	top: -18px;
	right: -18px;
	width: 36px;
	height: 36px;
	cursor: pointer;
	z-index: 1004;
}

.fancybox-nav {
	position: absolute;
	top: 0;
	width: 40%;
	height: 100%;
	cursor: pointer;
	background: transparent url('../img/blank.gif'); /* helps IE */
	z-index: 1003;
}

.fancybox-prev {
	left: 0;	
}

.fancybox-next {
	right: 0;
}

.fancybox-nav span {
	position: absolute;
	top: 50%;
	width: 36px;
	height: 36px;
	margin-top: -18px;
	cursor: pointer;
	z-index: 1003;
	visibility: hidden;
}

.fancybox-prev span {
	left: 20px;
	background-position: 0 -36px;
}

.fancybox-next span {
	right: 20px;
	background-position: 0 -72px;
}

.fancybox-nav:hover span {
	visibility: visible;
}

.fancybox-tmp {
	position: absolute;
	top: -9999px;
	left: -9999px;
	padding: 0;
	overflow: visible;
	visibility: hidden;
}

/* Overlay helper */

#fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	z-index: 1001;
	background: #000;
}

/* Title helper */

.fancybox-title {
	visibility: hidden;	
	font: normal 13px/20px ;
	position: relative;
	text-shadow: none;
	z-index: 1005;
}

.fancybox-opened .fancybox-title {
	visibility: visible;
}

.fancybox-title-float-wrap {
	position: absolute;
	bottom: 0;
	right: 50%;
	margin-bottom: -35px;
	z-index: 1003;
	text-align: center;
}

.fancybox-title-float-wrap .child {
	display: inline-block;
	margin-right: -100%;
	padding: 2px 20px;
	background: transparent; /* Fallback for web browsers that doesn't support RGBa */
	background: rgba(0, 0, 0, 0.8);
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
			border-radius: 15px;
	text-shadow: 0 1px 2px #222;
	color: #FFF;
	font-weight: bold;
	line-height: 24px;
	white-space: nowrap;
}

.fancybox-title-outside-wrap {
	position: relative;
	margin-top: 10px;
	color: #fff;
}

.fancybox-title-inside-wrap {
	margin-top: 10px;
}

.fancybox-title-over-wrap {
	position: absolute;
	bottom: 0;
	left: 0;	
	color: #fff;
	padding: 10px;
	background: #000;
	background: rgba(0, 0, 0, .8);
}