/*!
 * Start Bootstrap - Full Slider HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

h4, h5, h6,
h1, h2, h3 {margin-top: 0;}
ul, ol {margin: 0;}
p {margin: 0;}
html, body{
   font-family: 'Titillium Web', sans-serif;
    font-size: 100%;
}

.container { padding-bottom:70px;}
.carousel { margin-top:-20px;}

html,
body {
	background:url(../img/confectionary.png);
    height: 100%;
	overflow:hidden;}
body a, body li{
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
h1 {
	font-size:2.2em;}
	
h1,h2,h3,h4,h5,h6{
	font-family: 'Russo One', sans-serif;
	text-transform:uppercase;}
.logo {
	padding-left:10px;}
	
.navbar-fixed-top, .navbar-fixed-bottom{
	background: rgb(255,255,255);
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 55%, rgba(238,249,254,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(55%,rgba(255,255,255,1)), color-stop(100%,rgba(238,249,254,1)));
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 55%,rgba(238,249,254,1) 100%);
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 55%,rgba(238,249,254,1) 100%);
	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 55%,rgba(238,249,254,1) 100%);
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 55%,rgba(238,249,254,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eef9fe',GradientType=0 );
	padding:0 0;
	border-color:#0089ae}
.navbar-fixed-top {
	border-bottom:none}
	
.carousel,
.item,
.active {
    height: 100%;
}
.content-page {
	margin-top:7%;}
.col-sm-5 {
	padding-top:70px;}
	

/*----navbar-nav----*/
.top-nav ul li a{
	color: #999;
	padding: 0.2em 1em;
	font-size: 0.7em;
	font-weight: 500;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	font-family: 'Russo One', sans-serif;
}
.top-nav ul li.active a,
.top-nav ul li a:hover{
	text-decoration:none;
}
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}
/* top-nav */
.top-nav:before,
.top-nav:after {
    content: " ";
    display: table;
}
.top-nav:after {
    clear: both;
}
.top-nav ul li {
		display:inline;
	text-decoration:none;}
hr {
	margin:0;
	padding:0;}
.top-nav ul {
	padding:5px;}
.carousel-caption {
	top:20%;}
.carousel-indicators .active {
	background-color:#fff;
	border-color:#333}

.carousel-inner {
    height: 100%;
	margin-top:0px;
	background: url(../img/banner.jpg) no-repeat center top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
	background-size: 100% 100%; 
}
ul.button {
	padding: 0;
	width: 100%;
	margin: 0 auto;
	text-align: left;
	margin-top: 3em;
}
ul.button li {
	margin-left: 8px;
	list-style: none;
	display: inline-block;
}
ul.button li a {
	color: #FFF;
	padding: 0.6em 2em;
	border: 1px solid #FFF;
	text-decoration: none;
	font-weight: 300;
	font-size: 0.85em;
	text-transform: uppercase;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
}
ul.button li a:hover {
	color:#333;
	background:#fff;
	text-shadow:none;
}

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.social {
	float: right;
}
.social ul {
	margin: 0;
	padding: 0;
}
.social li {
	background: none;
	display: inline-block;
}
.social ul li:first-child, ol li:first-child {
	margin-top: 0px;
	margin-left: 0;
}
.social-media {
	margin-left:3px;
	margin-right:3px;}
.social-media a{
	color:#666;}
.social-media a:hover, .social-media a:focus{
	color:#0e5a7d;
	padding-top:15px;}

/**carousel**/

.carousel-indicators {
	position: absolute;
	left: 15%;
	bottom:15%;}
	
	
/****owl carousel****/ 

 


#software-solutions .item{
  margin: 3px;
}
#software-solutions .item img{
  display: block;
  width: 100%;
  height: auto;
}

a.list-group-item, a.list-group-item.active  {
	font-family: 'Titillium Web', sans-serif;
	font-size:14px;
	color:#0e5a7d;
	font-weight:bolder;
	}
a.list-group-item:hover , a.list-group-item:focus, a.list-group-item.active {
	background:#0084a7;
	color:white;
	}
a.list-group-item.active, a.list-group-item.active:hover {
	border-color:#CCC;
	background:#0084a7;}
	/*
.list-group-item:first-child, .list-group-item:first-child:hover, .list-group-item:first-child:focus {
	background:rgba(14, 90, 125, 0.66);
	color:#FFF;
	text-align:center;
	font-weight:bolder;}
	*/
/**bootstrap changes***/
.navbar-default .navbar-nav > li > a {
	color: #999;
	font-size: 0.8em;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	font-family: 'Russo One', sans-serif;}
.navbar-default .navbar-nav > li > a:hover , .navbar-default .navbar-nav > li > a:focus, .top-nav ul li a:hover, .top-nav ul li a:focus, .top-nav ul li a.active {
	color:#0084a7;}
.top-nav ul li a.active {	
	text-decoration:underline;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover,.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
	background-color:transparent;
	color:#0084a7;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
	text-decoration:underline;}
.dropdown-menu > li > a {
	font-family: 'Titillium Web', sans-serif;
	border-bottom:1px solid #ddd;
	font-weight:100;
	font-size: 1em;
	color:#666;
	}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
	padding-left:2em;
		background-color:#0084a7;}
.dropdown-menu {
	min-width:180px;}
.col-sm-4 {
	margin-top:10px;}
.container .row .item h4, .row h4, h4{
	color:#777;
	font-size:24px;
	text-transform:none;}
h2 {
	color:#0084a7;
	font-size:30px;}
	
.copy { font-size:0.8em;
padding-top:15px;}

.p, blockquote {
	background-color:#FFF;
	padding:15 15;}
.container p{
	text-align:justify;
		background-color:#FFF;
		padding:10px;}
.col-sm-6 img {
	width:100%;
	height:100%}
.p {
	line-height:2;
	padding-right:10px;
	list-style:url(../img/checked.png);}
	
.portfolio{
	background:#FFF;
	width: 100%;
    height: 400px;
    overflow: scroll;
	overflow-x:hidden;
	}
.row-portfolio {
	padding-left:30px;
	padding-right:30px;
		overflow-x:hidden;}
.row-portfolio iframe {
	width:100%;}
.clients {
	height:200px;}
.group {
	height:150px;}
.col-sm-6 iframe {
	width:100%}
.careers h5 {
	text-transform:none;
	padding-top:10px;}
.careers {
	margin-bottom:10px;
	padding:5px;
	background-color:#FFF}
.btn-primary {
	border:none;
	background-color:#0084a7;}
.btn-primary:hover, .btn-primary:focus {
	background-color:#156f98;}
.list-group {
	border-top:solid 5px #0084a7; }

.contact p {
	height:220px;}
.contact .fa {
	color:#0084a7;}
.navbar-fixed-top {
	border-top:#FFF 30px solid;	
	}
.container {
	padding-top:25px;}
.btn-primary.disabled {
	background-color:#999;}
.btn-default {
	border-color:#0084a7;
	color:#0084a7}

/*******Media queries********/


@media all and (min-width: 1500px) {
	.container {
		min-width:90%;
		padding-top:70px;}
		h2 { font-size:34px;}
.container .row .item h4, .row h4 {
		font-size:25px;}
			p, .p, blockquote p {
		font-size:18px;}
.top-nav ul li a {
	font-size:14px;}
.navbar-default .navbar-nav > li > a {
	font-size:18px;}
.dropdown-menu > li > a {
	font-size:16px;}
	.col-sm-5 {
		padding-top:150px;}
	.col-sm-5 p {
		font-size:20px;
		}
	.col-sm-5 h1 {
		font-size:50px;}
a.list-group-item,  a.list-group-item.active, a.list-group-item.active:hover{
	font-size:20px;}
	.logo a img, .social-media a img {
		min-width:110%;}
	.portfolio {
		height:500px;}
	.careers h5 {
		font-size:20px;}
}
 
@media all and (max-width: 959px) and (min-width: 600px) {

    body{
		overflow:scroll;
    }
	p, .p, blockquote p {
		font-size:14px;}
	body { 
		padding-top: 70px; }
	.carousel-indicators {
		display:none}
	.list-group, col-sm-3 img {
		padding-bottom:100px;}
	.top-nav {
		display:none;}
		h2 { font-size:24px;}
.container .row .item h4, .row h4 {
		font-size:20px;}
		.btn { margin:10px;}
}
 
@media all and (max-width: 599px) and (min-width: 320px) {

    body{
		overflow:scroll;
    }
	p, .p, blockquote p {
		font-size:12px;}
	body { padding-top: 70px; }
	.carousel-indicators {
		display:none}
 	.list-group, col-sm-3 img {
		padding-bottom:100px;}
		.top-nav {
		display:none;}
	h2 { font-size:24px;}
.container .row .item h4, .row h4 {
		font-size:20px;}
		.btn { margin:10px;}
}

.webmail {
	 padding-left:50px; 
	 margin-top:-15px;"
	}
.webmail i {
	padding:10px; 
	background:#0084A7; 
	border-radius:50%; 
	color:#fff; 
	font-size:20px;}

.navbar-default .navbar-nav > li > a:hover {
	background-color:transparent;}
.navbar-default .navbar-nav > li > a::before,
.navbar-default .navbar-nav > li > a::after {
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
	-moz-transition: -moz-transform 0.3s, opacity 0.2s;
	transition: transform 0.3s, opacity 0.2s;
}

.navbar-default .navbar-nav > li > a::before {
	margin-right: 2px;
	top:0px;
	position:absolute;
	border-top:#0084A7 3px solid;
	content: ' ';
	-webkit-transform: translateX(20px);
	-moz-transform: translateX(20px);
	transform: translateX(20px);
}


.navbar-default .navbar-nav > li > a:hover::before,
.navbar-default .navbar-nav > li > a:focus::before,
.navbar-default .navbar-nav > li .active {
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	transform: translateX(0px);
}
/*Modifying -------------------*/
h2 {
	font-size:25px;}
p, .p, ul {
	font-size:14px;}
	
/*portfolio-body*/
.portfolio-body {
	overflow-y:visible;}
.portfolio-items {
	margin-top:20px;}
.portfolio-items .thumbnail h5 {
	text-align:center;
	color:#069;
	font-size:16px;}
.project-item {
	margin-top:30px;}
.project-item .stars {
	padding-top:0;
	padding-bottom:0;
	font-size:10px;
	text-align:center;
	background-color:#eee;}
.project-item .date-location{
	padding-top:5px;
	padding-bottom:5px;}
.project-item a {
	display:block;
	color:#C71228;
	text-align:center;
	padding:5px;
	border:#C71228 1px solid;}
.project-item a:hover, .project-item a:focus {
	text-decoration:none;}
.portfolio-body .modal-dialog {
	width:800px;}
.modal img {
	width:100%;
	margin-top:20px;
	margin-bottom:20px;}
.modal hr {
	padding-top:10px;
	padding-bottom:10px;}
.modal-h6 {
	color:#C71228;
	padding:2px;
	border:1px #eee dotted;}