/********************************************************* Core Styling */

/*
 * Core styling
 */
html {
	width: 100%;
	height: 100%;
}
body {
	margin: 0;
	background-repeat: no-repeat;
   	background: #1c1c1c;
    background: -webkit-radial-gradient(center bottom, circle farthest-corner, #343434, #1c1c1c, black) fixed;
    background: -moz-radial-gradient(center bottom, circle farthest-corner, #343434, #1c1c1c, black) fixed;
    background: -o-radial-gradient(center bottom, circle farthest-corner, #343434, #1c1c1c, black) fixed;
    background: -ms-radial-gradient(center bottom, circle farthest-corner, #343434, #1c1c1c, black) fixed;
    background: radial-gradient(center bottom, circle farthest-corner, #343434, #1c1c1c, black) fixed;
}
div, body, img {
	color: white;
	font-family: 'futura-light';
    -webkit-font-smoothing: antialiased;
	border: none;
	margin: 0px;
	padding: 0px;

}
a {
	
	border: none;
    color: white;
    text-decoration: none;
}
a:hover 
{
     color:black; 
     text-decoration:none; 
     cursor:pointer;  
}
img {
	display: block;
}
ul, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
input, label {
    display:block;
    outline: none;
}
label {
	font-size: .9em;
}
/*
 * Page Styling
 */
#home {
	background-color: black;
}
#topGap {
	width: 100%;
}
.resp_topGap_Std {
	margin-top: 6%;
}
#wrapper {
	width: 100%;
}
#navWrapper {
	display: none;
	z-index: 2;
}
.resp_navWrapper_Std {
	position: fixed;
	max-height: 565px;
	height: 65%;
	min-height: 450px;
	max-width: 230px;
	width: 23%;	
	float: left;
	background-color: #606060;
}
#navWrapper #navigation ul {
	padding-top: 18px;
}

#centredMain {
}
.resp_centredMain_Std {
	position: absolute;
	width: 100%;
}
#leftSpacer {
	width: 25%;
	max-width: 250px;
	height: 500px;
	float: left;
}
#main {
	min-width: 70%;
	font-size: .8em;
	height: auto;
	padding: 20px;
	background-color: #606060;
}
#footer .copyright {
	display: none;
}
/*.licence-window:hover {
	cursor: hand; cursor: pointer;
    color: black; 
}*/
/*
 *  Navigation styling
 */
#navigation {
	width: 82.6%;
	height: 91.3%%;
	position: relative;
}
.resp_nav_Std {
	margin: 8.7%;
}
.resp_nav_Small {
	margin: 4.35% 8.7%;
}
.logo {
	width: 100%;
}
.resp_navWrapper_Std #navigation ul, .resp_navWrapper_Std #navigation ul li {
	display: list-item;
	margin-left: 0px;
	margin-bottom: 23px;
	margin-right: 0px;
	margin-top: 0px;
	padding: 0px;
	font-size: 1.1em;
	list-style-type: none;
}
.resp_navWrapper_Small #navigation ul li {
	margin: 0 10px 0 auto;
	display: inline-block;
	font-size: 1.1em;
	list-style-type: none;
}
.resp_navWrapper_Small a:hover 
{
     color:#686868; 
     text-decoration:none; 
     cursor: hand; cursor:pointer;  
}

#navFooter{
}
.resp_navFooter_Std {
	position: absolute;
	right: 0;
	bottom: 0;
	font-size: 0.8em;
	text-align: right;
}

#aboutus, #services, #contact, #licence, #news, #employment {
	font-size: 1.1em;
}

.resp_topGap_Small {
	margin-top: 0;
}
.resp_navWrapper_Small {
	position: relative;
	display: block;
	width: 		100%;
	background-color: none !important;
}
.resp_centredMain_Small {
	width: 100%;
	display: block;
	position: relative;
	margin-left:	0;
}
.resp_navFooter_Small, #footer {
	margin-top: 10px;
	font-size: 0.8em;
	text-align: right;
}
.nW2 {
	height: auto !important;
	margin: 0 auto -30px;
}
.nf, .push{
	height: 30px;
}
.copyright {
	font-size: 0.8em;
}
/********************************************************* Home Page Styling */

/*
 *  Tagline sliders
 */
.flexslider {
	-moz-transition: all 0.5s linear;  
    -o-transition: all 0.5s linear;  
    -webkit-transition: all 0.5s linear;  
    transition: all 0.5s linear;  
    
    width: 460px;
	height: 100px;
	left: 800px;
	z-index: 3;
	top:240px;
	position: absolute;
	background-color: black;
	padding: 10px;
	display: none;
}
.flexslider ul {
	padding: 0;
}
.tag-line {
	width: 460px;
	height: 100px;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	font-size: 1.6em;
	background-color: #606060;
	border-top-right-radius: 10px;
	  -moz-border-radius-topright: 10px;
	    -webkit-border-top-right-radius: 10px;
	border-bottom-left-radius: 10px;
	  -moz-border-radius-bottomleftt:10px;
	    -webkit-border-bottom-left-radius: 10px;

	margin: 0, 20px;
}
.tag-line h2 {
	font-size: 1em;
	font-weight: normal;
}

.smallImpact {
	width: 75px;
	height: 19px;
}
.stdImpact {
	width: 100%;
	height: 100%;
}

/*
 *  Isoptope Styling
 */
.item {	border: none;
	margin: 0px;
	padding: 0px;

}
#isotope_wrapper {
	overflow: hidden;
	z-index: 1;
	background-color: black;
}
#isotope {
	background-color: black;
}
#loader img {
   position: absolute;
   top: 50%;
   left: 50%;
}
#loader .impact-logo {
   width: 180px;
   margin-top: -120px; /* Half the height */
   margin-left: -90px; /* Half the width */
}


#loader .loader {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 90px;
   height: 20px;
   margin-top: -10px; /* Half the height */
   margin-left: -45px; /* Half the width */
}


/* 
 *  Isotope sizes 
 */
.stdSize {
	width: 160px;
	height: 120px;
}
.doubleWidth {
	width: 320px;
	height: 120px;
}
.doubleHeight {
	width: 160px;
	height: 240px;
}
.doubleSize {
	width: 320px;
	height: 240px;
}
.masonaryImg {
	width: 100%;
	height: 100%;
}

#shuffle {
	bottom: 25px;
	right: 25px;
	z-index: 4;
	position: fixed;
}
#shuffle img {
	opacity: .35;
}
#shuffle img:hover {
	opacity: .9;
}
/********************************************************* About Us Page Styling */

#aboutusContent {
	
}
#aboutus {
	text-align: justify;
}
#aboutus ul {
	padding-left: 25px;
	padding-top: 7px;
}
#aboutus li {
	padding-top: 3px;
}

/********************************************************* Contact Page Styling */

#contactDetails {
float: left;
	width: 200px;
}
#spacer{
	margin-left: 200px;
	margin-right: 300px;
	width:auto;
	display: inline-block;
	left: -200px;
	height:300px;
	background-color: red;
}
#contactFormContainer {
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    border: 2px solid #727272;
    padding: 10px;
   	width: 300px;
	/*float: right;	*/
    background: #2d2d2d;
    background: -webkit-gradient(
                    linear,
                    left bottom,
                    left top,
                    color-stop(0, rgb(60,60,60)),
                    color-stop(0.74, rgb(43,43,43)),
                    color-stop(1, rgb(60,60,60))
                );
    background: -moz-linear-gradient(
                    center bottom,
                    rgb(60,60,60) 0%,
                    rgb(43,43,43) 74%,
                    rgb(60,60,60) 100%
                );
                display: inline-block;
               left: -500px;
}

	  
fieldset {
      padding: 0 12px 0 5px;
      border: none;
      }
	  
input.text, textarea.text {
      -webkit-border-radius: 15px;
      -moz-border-radius: 15px;
      border-radius: 15px;
      border:solid 1px #444;
      font-size: 14px;
      width: 90%;
      padding: 7px 8px 7px 30px;
      -moz-box-shadow: 0px 1px 0px #777;
      -webkit-box-shadow: 0px 1px 0px #777;
	  background: #ddd url('../images/infield/inputSprite.png') no-repeat 4px 5px;
	  background: url('../images/infield/inputSprite.png') no-repeat 4px 5px, -moz-linear-gradient(
           center bottom,
           rgb(225,225,225) 0%,
           rgb(215,215,215) 54%,
           rgb(173,173,173) 100%
           );
	  background:  url('../images/infield/inputSprite.png') no-repeat 4px 5px, -webkit-gradient(
          linear,
          left bottom,
          left top,
          color-stop(0, rgb(225,225,225)),
          color-stop(0.54, rgb(215,215,215)),
          color-stop(1, rgb(173,173,173))
          );
      color:#333333;
      text-shadow:0px 1px 0px #FFF;
}	

textarea.text {
	height: 100px;
}  

 input#email { 
 	background-position: 4px 5px; 
	background-position: 4px 5px, 0px 0px;
	}
	
 input#company { 
 	background-position: 4px -20px; 
	background-position: 4px -20px, 0px 0px;
	}
	
 input#name { 
 	background-position: 4px -46px; 
	background-position: 4px -46px, 0px 0px; 
	}
	
 input#tel { 
 	background-position: 4px -76px; 
	background-position: 4px -76px, 0px 0px; 
	}
 textarea#message {
 	outline: none; 
 	background-position: 4px -102px; 
	background-position: 4px -102px, 0px 0px; 
	}
	
 #contactFormContainer p {
      position: relative;
      }
	  
fieldset label.infield /* .infield label added by JS */ {
    color: #1d1d1d;
    text-shadow: 0px 1px 0px #fff;
    position: absolute;
    text-align: left;
    top: 3px !important;
    left: 35px !important;
    line-height: 29px;
    }
/********************************************************* Services Page Styling */
#services {
	width: inherit;
}
#services table {
	width: 100%;
	
}
#services td {
	vertical-align: top;
}
#services td:nth-child(1) {
	width: 190px;
	font-weight: bold;
}



/******************************
*
*  RoyalSlider Default Inverted Skin 
*
*    1. Arrows 
*    2. Bullets
*    3. Thumbnails
*    4. Tabs
*    5. Fullscreen button
*    6. Play/close video button
*    7. Preloader
*    8. Caption
*    
*  Sprite: 'rs-default-inverted.png'
*  Feel free to edit anything
*  If you don't some part - just delete it
* 
******************************/


/* Background */
.rsDefaultInv,
.rsDefaultInv .rsOverflow,
.rsDefaultInv .rsSlide,
.rsDefaultInv .rsVideoFrameHolder,
.rsDefaultInv .rsThumbs {
/*	background: #404040; */
}


/***************
*
*  7. Preloader
*
****************/

.rsDefaultInv .rsPreloader {
	width:20px;
	height:20px;
	background-image:url(../images/preloader.gif);

	left:50%;
	top:50%;
	margin-left:-10px;
	margin-top:-10px;	
}

/***************
*
*  8. Global caption
*
****************/
.rsDefaultInv .rsGCaption {
	position: absolute;
	float: none;
	bottom: 6px;
	left: 6px;
	text-align: left;

	background: #FFF;
    background: rgba(255,255,255, 0.75);

	color: #000;
	padding: 2px 8px;
	width: auto;
	font-size: 12px;
	border-radius: 2px;
}

/* Mask for background, by default is not display */
#mask {
	display: none;
	background: #000; 
	position: fixed; left: 0; top: 0; 
	width: 100%; height: 100%;
	opacity: 0.8;
	z-index: 3;
}

/* You can customize to your needs  */
.licence-popup{
	display:none;
	background: #333;
	padding: 10px; 	
	border: 2px solid #ddd;
	float: left;
	font-size: 1.2em;
	position: fixed;
	top: 50%; left: 50%;
	z-index: 99999;
	box-shadow: 0px 0px 20px #999; /* CSS3 */
        -moz-box-shadow: 0px 0px 20px #999; /* Firefox */
        -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
	border-radius:3px 3px 3px 3px;
        -moz-border-radius: 3px; /* Firefox */
        -webkit-border-radius: 3px; /* Safari, Chrome */
}

img.btn_close { /* Position the close button */
	float: right; 
	margin: -20px -20px 0 0;
}

.button { 
	background: -moz-linear-gradient(center top, #f3f3f3, #dddddd);
	background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#dddddd));
	background:  -o-linear-gradient(top, #f3f3f3, #dddddd);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f3f3f3', EndColorStr='#dddddd');
	border-color:#000; 
	border-width:1px;
        border-radius:4px 4px 4px 4px;
	-moz-border-radius: 4px;
        -webkit-border-radius: 4px;
	color:#333;
	cursor:pointer;
	display:inline-block;
	padding:6px 6px 4px;
	margin-top:10px;
	font:12px; 
	width:214px;
}
.button:hover { background:#ddd; }

