@charset "utf-8";

    /* GLOBAL STYLES
	
	Author: Rocky
	Website: http://artatm.com
    -------------------------------------------------- */
	
	/* Add additional stylesheets below
-------------------------------------------------- */

	
	*::-moz-selection {
 background: none repeat scroll 0 0 #FF755A;
 color: #FFFFFF;
}
body {
	color: #5a5a5a;
	font-family: Open Sans;
	margin: 0;
	padding: 0;
	background: url(../img/pw_maze_white.png);
}
h1, h2, h3 {
	font-family: 'Noticia Text', serif;
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: local('Open Sans Light'), local('OpenSans-Light'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
/* hove effect */
.hover img:hover {
	opacity: 0.7;
	filter: alpha(opacity=70); /* For IE8 and earlier */
	background-color: #000;
}
.hover:hover {
	background-color: #009933;
}

/* button Styles */
.btn {
	background: #3498DB;
	text-shadow: none;
	color: #fff;
	border: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.btn:hover {
	background: #111111;
	color: #FFF;
}


.msg-bg {
	min-height: 20px;
	padding: 19px;
	margin-bottom: 20px;
	border: 1px solid #e3e3e3;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	background: #27ae60;
	color: #fff;
	border: 0;
}
/* MARKETING CONTENT
    -------------------------------------------------- */

    /* Center align the text within the three columns below the carousel */
.marketing .span4 {
	text-align: center;
}
.marketing h2 {
	font-weight: normal;
}
.marketing .span4 p {
	margin-left: 10px;
	margin-right: 10px;
	color: #333333;
	font-size: 16px;
}
.infobox h2, .infobox-2 h2, .infobox-3 h2 {
	color: #FFF;
	padding: 4px 0;
}
.infobox {
	background: #FF755A;
	color: #ecf0f1;
}
.infobox-2 {
	background: #6DB4BA;
	color: #ecf0f1;
}
.infobox-3 {
	background: #34dbb6;
	color: #ecf0f1;
}
/* end of marketing content */


/* Home page classes */
#info {
	padding-bottom: 3%;
	padding-top: 1%;
}
#message {
	margin-top: 0%;
	margin-bottom: 1%;
	background-image: url(../img/blpattern.png);
	background-color: #000000;
}

#message1 {
	margin-top: 0%;
	margin-bottom: 1%;

}
.work-area {
	background: #e74c3c;
}
.work-area img {
	width: 100%;
}
.work-title {
	padding: 10px 0;
	color: #fff;
}
#clients {
	background: #f1c40f;
}
/* sidebar */
.sidebar h3{ color:#2c3e50; }
.sidebar, .sidebar a{ color:#fff;}
.sidebar li > a:focus, .sidebar li > a:hover{ background:#3498db;}
.sidebar .well{
	background-color:#3498DB;
}
.client {
	border: 1px solid #fff;
	display: block;
	padding: 20px 10px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

/* social Area */
ul.social-icons {
	list-style: none outside none;
	margin-left: 0;
}
ul.social-icons li {
	display: inline;
	line-height: 50px;
	margin-right: 25px;
}
ul.social-icons li a {
	color: #FF755A;
	text-decoration: none;
	text-shadow: 1px 1px black, -1px -1px #444;
}
ul.social-icons li a:hover {
	color: #F1C40F;
}
/* Footer */
footer {
	background: #31363A url(../img/black_lozenge.png);
	margin: 0;
	padding: 0;
}
.footer-copy {
	background-color: #000000;
	color: #31363A;
}
.footer-copy a {
	color: #fff;
}
/* spacing */
.padded-xl {
	padding: 3% 1px;
	;
}
.padded-s {
	padding: 2%;
}
.padding-8p {
	padding-bottom: 2%;
	padding-top: 2%;
}
.padding-5p {
	padding-bottom: 3%;
	padding-top: 3%;
}
.padding-30 {
	padding-bottom: 30px;
	padding-top: 30px;
}
.padding-b20 {
	padding-bottom: 20px;
}
.top-buffer {
	margin-top: 50px;
}
.margin-40 {
	margin: 40px 0;
}
.margin-20 {
	margin: 20px 0;
}
.center {
	margin: 0 auto !important;
	float: none !important;
	text-align: center;
}
/* CUSTOM SEARCH */

 #custom-search-form {
margin:0;
margin-top: 5px;
padding: 0;
}
#custom-search-form .search-query {
padding-right: 3px;
padding-right: 4px \9;
padding-left: 3px;
padding-left: 4px \9;
/* IE7-8 doesn't have border-radius, so don't indent the padding */
margin-bottom: 0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
#custom-search-form button {
border: 0;
background: none;
/** belows styles are working good */
padding: 2px 5px;
margin-top: 2px;
position: relative;
left: -28px;
/* IE7-8 doesn't have border-radius, so don't indent the padding */
margin-bottom: 0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.search-query:focus + button {
z-index: 3;
}

/*  ./ CUSTOM SEARCH  */

/* CUSTOMIZE THE NAVBAR
    -------------------------------------------------- */

    /* Special class on .container surrounding .navbar, used for positioning it into place. */
	.navbar-inverse .brand, .navbar-inverse .nav > li > a {
	color: #fff;
}
.navbar-wrapper {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10;
	margin-top: 20px;
	margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
	background-color: #099;
}
.navbar-wrapper .navbar {
}
/* Remove border and change up box shadow for more contrast */
.navbar .navbar-inner {
	background: #3498db;
	border: 0;
	-webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
	box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
	margin: 0 0 0 0;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
/* Downsize the brand/project name a bit */
.navbar .brand {
	padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */
	font-size: 16px;
	font-weight: bold;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
}
/* Navbar links: increase padding for taller navbar */
.navbar .nav > li > a {
	padding: 15px 20px;
}
/* Offset the responsive button for proper vertical alignment */
.navbar .btn-navbar {
	margin-top: 10px;
}
.navbar-inverse .nav-collapse .nav > li > a, .navbar-inverse .nav-collapse .dropdown-menu a {
	color: #fff;
}
.navbar-inverse .nav > li > a:focus, .navbar-inverse .nav > li > a:hover {
	color: #ffffff;
	background-color: #6DB4BA;
}
.navbar-inverse .nav-collapse .dropdown-menu a {
	color: #111;
}
/* CUSTOMIZE THE CAROUSEL
    -------------------------------------------------- */

    /* Carousel base class */
.carousel {
	margin-bottom: 20px;
	margin-top: -20px;
}
.carousel .container {
	position: relative;
	z-index: 9;
}
.carousel-control {
	height: 80px;
	margin-top: 0;
	font-size: 120px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
	background-color: transparent;
	border: 0;
	z-index: 10;
}
.carousel .item {
	height: 500px;
}
.carousel img {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 100%;
	height: 500px;
}
.carousel-caption {
	background-color: transperant;
	position: static;
	max-width: 500px;
	padding: 0 20px;
	margin-top: 5%;
}

.carousel-caption1 {
	background-color: transperant;
	position: static;
	max-width: 5px;
	padding: 0 10px;
	margin-top: 2%;
}

.carousel-caption h1, .carousel-caption .lead {
	margin: 0;
	line-height: 1.20;
	color: #FFF;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
}
.carousel-caption .btn {
	margin-top: 10px;
}
/* FLAT COLORS */


.green-sea{ background:#16a085; color:#fff;} 
.sun-flower{ background: #c0392b;}



/* Featurettes
    ------------------------- */

.featurette-divider {
	margin: 80px 0; /* Space out the Bootstrap <hr> more */
}
.featurette {
	padding-top: 100px; /* Vertically center images part 1: add padding above and below text. */
	overflow: hidden; /* Vertically center images part 2: clear their floats. */
}
.featurette-image {
	margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
}
/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left {
	margin-right: 40px;
}
.featurette-image.pull-right {
	margin-left: 40px;
}
/* Thin out the marketing headings */
.featurette-heading {
	font-size: 50px;
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: -1px;
	color: #f1c40f;
	text-align: center;
}
.srt {
	color: #fff;
}


    /* RESPONSIVE CSS
    -------------------------------------------------- */

    @media (max-width: 1208px) {
.container.navbar-wrapper {
	margin-bottom: 0;
	width: auto;
}
.navbar-inner {
	border-radius: 0;
	margin: -20px 0;
}
.carousel .item {
	height: 500px;
}
.carousel img {
	width: auto;
	height: 500px;
}
.featurette {
	height: auto;
	padding: 0;
}
.featurette-image.pull-left, .featurette-image.pull-right {
	display: block;
	float: none;
	max-width: 40%;
	margin: 0 auto 20px;
}
}
 @media (max-width: 1208px) {
.navbar-inner {
	margin: -20px;
}
.carousel {
	margin-left: -20px;
	margin-right: 0px;
}
.carousel .container {
}
.carousel .item {
	height: 300px;
}
.carousel img {
	height: 300px;
}
.carousel-caption {
	width: 65%;
	padding: 0 60px;
	margin-top: 50px;
}
.carousel-caption h1 {
	font-size: 15px;
}
.carousel-caption .lead, .carousel-caption .btn {
	font-size: 12px;
}
.marketing .span4 + .span4 {
	margin-top: 40px;
}
.featurette-heading {
	font-size: 30px;
}
.featurette .lead {
	font-size: 18px;
	line-height: 1.5;
}
footer h2 {
	font-size: 26px;
}