@charset "UTF-8";
/*------------------------------------------------------------------
 * Theme Name: HostRocket Responsive HTML5 Landing page
 * Theme URI: http://www.iunique.me/brandesign/hostrocket
 * Author: Brandesign
 * Author URI: http://www.iunique.me/brandesign
 * Description: A Bootstrap Responsive HTML5 Landing page
 * Version: 1.0
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * Bootstrap v3.3.4 (http://getbootstrap.com)
 * Copyright 2015 Brandesign.
 -------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Table of contents]

1. General styles.
2. Header.
3. Sign Up Section.
4. Features Section.
5. Try Now Section.
6. Pricing tables Section.
7. Testimonials Section.
8. Clients Section.
9. Footer.
10. Responsive Styles.
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
	1. General styles
-------------------------------------------------------------------*/
/* This line will import “Montserrat” font from google web fonts */
@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);

/* This is the style for the body of the template, setting the font and the transition (Animation options)*/
*,body{
	font-family: 'Source Sans Pro', sans-serif;
	transition: all 0.5s ease 0s;
}

body #bodyWrap {
	transition:none;
}

body {
	background:#eee;
}

h1 {
	text-transform:uppercase;
	margin:0;
}

h1 span {
	color:#e70101;
}

h1.title {
	font-size:50px;
	line-height:46px;
}

h2 {
	font-size:24px;
	margin:0;
}

h3 {
	font-size:17px;
	margin:0;
}

h4 {
	margin-top:0;
}

p {
	color:#666;
	font-size:14px;
	margin:0 0 14px ;
}

a {
	text-decoration:none;
	color:#e70101;
}

a:hover {
	text-decoration:none;
}

a:active, a:focus {
	text-decoration:none;
	color:#333;
}

/* These classes are for alignments, for the text and the objects floating. */
.t-left{
	text-align:left;
}
.t-right{
	text-align:right;
}
.f-left{
	float:left;
}
.f-right{
	float:right;
}
.big-text{
	font-size: 70px;
	line-height: 70px;
	font-weight:700;
}
.small-text{
	font-size: 18px;
	line-height: 25px;
	color:#ffffff;
	margin-bottom:0;
}
.firstRow {
	padding-top:50px;
}

.firstRow h1 + p {
	padding-top:14px;
}

@media screen and (max-width:768px) {
	.firstRow {
	  padding-top: 10px;
	}
}
/* Some rows has title and we have two different titles styles */
.row-title1{
	text-align:center;
}
/* Underline style */
.row-title1 div{
	display: inline-block;
	font-size: 26px;
	font-weight:600;
	padding-bottom:10px;
	border-bottom:2px solid #ffffff;
	margin-top:40px;
	margin-bottom:40px;
}
/* Title style */
.row-title1 div .text{
	color:#ffffff;
}
/* The style of the dot after title */
.row-title1 div .dot{
	color:#ff4e00;
}

.row-title2{
	text-align:center;
}
/* Underline style */
.row-title2 div{
	display: inline-block;
	font-size: 26px;
	font-weight:600;
	padding-bottom:10px;
	border-bottom:2px solid #013243;
	margin-top:40px;
	margin-bottom:40px;
}
/* Title style */
.row-title2 div .text{
	color:#013243;
}
/* The style of the dot after title */
.row-title2 div .dot{
	color:#ff4e00;
}






.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
	padding-top:10px;
	padding-bottom:10px;
}

img {
	max-width:100%;
}



/*------------------------------------------------------------------
	2. Header 
-------------------------------------------------------------------*/
#header, .row1{
	background-color:#1093C1;
	min-height: 500px;
}

#header, .row1a {
	min-height:0;
	background-color:#1093C1;
}

/* Live chat text style */
.box a{
	font-size: 16px;
	color:#ffffff;
}

/* The Rocket Animation Style */
#canvas{
	position:absolute;
	right:40px;
	top:40px;
	opacity:1;
	/*width:170%;*/
}

/* The style of the header of the form */
.form-top{
	width: 348px;
	height: 55px;
	background-color: #FFF;
	border-radius: 25px 25px 0px 0px;
	margin-bottom: 0px;
	text-align: center;
	padding-top: 20px;
	color: #013243;
	font-size: 18px;
	font-weight: 600;
}

.menuBox {
	color:#fff;
	cursor:pointer;
	font-size: 16px;
}

.chat-link {
	display:inline-block;
	line-height:43px;
	margin-right:12px;
}

#bodyWrap {
	position:relative;
	overflow:hidden;
	width:100%;
}

.menuBtn {
	height:43px;
	width:43px;
	display:block;
	background:url(../img/sprites/nav-icons.png) no-repeat;
	background-position:0 center;
	float:right;
}

/*------------------------------------------------------------------
	NEW - Menu Section
------------------------------------------------------------------*/

#mobile-menu, #mobile-latest, .mobileNavbar {
	display:none;
}

@media screen and (max-width: 1350px) {
	#mobile-menu, #mobile-latest, .mobileNavbar {
		display:block;
	}
	
	#gallery-cont-scroll {
		padding:20px;
	}
	
	#responsive-nav-button1, #responsive-nav-button2 {
		display:block;
	}
	
	#mobile-menu {
		display: block;
		position: absolute;
		overflow: hidden;
		width: 300px;
		height: 100%;
		right: -300px;
		top: 0;
		background:#000;
		background-size:cover;
		font-family: 'Roboto', sans-serif;
		font-weight: 200;
		font-size: 14px;
		z-index: 1001;
		pointer-events: none;
		
		-webkit-transform-origin: 0 0;
				transform-origin: 0 0;
		-webkit-transition: -webkit-transform .35s ease-in-out;
				transition: transform .35s ease-in-out;
		-webkit-transform: translateX(0);
				transform: translateX(0);
	}
	
	#bodyWrap.active #mobile-menu {
		pointer-events: auto;
		
		-webkit-transform: translate(-300px, 0);
				transform: translate(-300px, 0);
	}
	
	#mobile-latest {
		display: block;
		position: absolute;
		overflow: hidden;
		width: 500px;
		height: 100%;
		left: -500px;
		top: 0;
		background:#000;
		background-size:cover;
		font-family: 'Roboto', sans-serif;
		font-weight: 200;
		font-size: 14px;
		z-index: 1001;
		pointer-events: none;
		
		-webkit-transform-origin: 0 0;
				transform-origin: 0 0;
		-webkit-transition: -webkit-transform .35s ease-in-out;
				transition: transform .35s ease-in-out;
		-webkit-transform: translateX(0);
				transform: translateX(0);
	}
	
	#bodyWrap.currentMenu #mobile-latest {
		pointer-events: auto;
		
		-webkit-transform: translate(500px, 0);
				transform: translate(500px, 0);
	}
	
	
	#mobile-menu ul li {
		border: 0 none;
		border-bottom: none;
		margin-bottom:0px;
	}
	
	#mobile-menu ul li a i {
		color:#e70101;
		height:30px;
		width:30px;
		line-height:30px;
		margin-left:15px;
		font-size:18px;
		text-align:center;
		float:right;
	}
	
	#mobile-menu ul li a { color: #fff; text-transform:capitalize; }
	
	
	
	#mobile-menu ul li a:hover:before { color: #fff; left:5px; }
	
	#mobile-menu > ul { background:none; background-size:cover; margin:0;
	list-style:none; padding:100px 20px 40px 20px}
	
	#mobile-menu ul ul {
		list-style:none;
	}
	
	#mobile-menu ul li:hover ul {
		display:block;
	}
	
	#mobile-menu ul ul li a { padding-left: 0px; background: none; color:#999; }
	
	#mobile-menu ul li a {
		display: block;
		padding: 0;
		display: block;
		font-size:14px;
		text-align:right;
		height:30px;
		line-height:30px;
		font-weight:300;
		background: none;
	
		-webkit-transition: background-color .35s ease;
				transition: background-color .35s ease;
	}
	
	#mobile-menu > ul > li > a { background-color: none; }
	
	#mobile-menu ul li:hover > a {
		color: #e70101;
	}
	
	#mobile-menu ul ul ul li {
		position: relative;
		border-left: none;
		border-bottom: none;
		padding-left: 30px;
	}
	
	#menu-hide, #latest-hide {
		width: 40px;
		height: 40px;
		background: none);	
		text-align: center;
		font-weight: normal;
		font-style: normal;
		font-size: 21px;
		font-family: 'FontAwesome';
		line-height: 40px;
		vertical-align: middle;
		right: 20px;
		top: 20px;
		display: block;
		position: absolute;
		z-index: 105;
		color:#fff;
	
		-webkit-border-radius: 6px;
				border-radius: 6px;
	}
	
	.mobileNavbar {
		background:url(../images/logo-white.png) no-repeat center center #e70101;
		background-size:auto 24px;
	}
	
	.responsive-nav-button {
		border-radius: 0px;
		display: none;
		font-family: 'FontAwesome';
		font-size: 24px;
		font-style: normal;
		font-weight: normal;
		height: auto;
		text-align: right;
		vertical-align: middle;
		width: auto;
		color:#fff;
		height:45px;
		line-height:43px;
		margin-right:0px;
		-webkit-transition: height 400ms ease-in-out, line-height 400ms ease-in-out;
		-moz-transition: height 400ms ease-in-out, line-height 400ms ease-in-out;
		-ms-transition: height 400ms ease-in-out, line-height 400ms ease-in-out;
		-o-transition: height 400ms ease-in-out, line-height 400ms ease-in-out;
		transition: height 400ms ease-in-out, line-height 400ms ease-in-out;
	}
	
	.responsive-nav-button i {
		cursor:pointer;
	}
	
	.leftBtn {
		float:left;
	}
	
	.rightBtn {
		float:right;
	}
	
	.responsive-nav-button:hover {
		color:#9e0202;
	}
}
	
@media screen and (max-width: 768px) {
	#mobile-menu {
		width: 100%;
		height: 100%;
		right: -100%;
	}
	
	#mobile-latest {
		width: 100%;
		height: 100%;
		left: -100%;
	}
	
	#bodyWrap.active #mobile-menu {
		pointer-events: auto;
		
		-webkit-transform: translate(-100%, 0);
				transform: translate(-100%, 0);
	}
	
	#bodyWrap.currentMenu #mobile-latest {
		pointer-events: auto;
		
		-webkit-transform: translate(100%, 0);
				transform: translate(100%, 0);
	}
	
	#mobile-menu > ul { background:none; background-size:cover; margin:0;
	list-style:none; padding:60px 20px 40px 20px}
	
	#mobile-menu ul li a {
		display: block;
		padding:8px 0;
		display: block;
		font-size:14px;
		text-align:center;
		border-bottom:1px solid #212121;
		height:auto;
		line-height:auto;
		font-weight:300;
		background: none;
	
		-webkit-transition: background-color .35s ease;
				transition: background-color .35s ease;
	}
	
	#mobile-menu ul ul {
		margin:0;
		padding:0;
	}
	
	#mobile-menu ul ul li {
		width:50%;
		display:inline-block;
		float:left;
		padding:0;
		margin:0;
		border-right:1px solid #212121;
	}
	
	#mobile-menu ul ul li:last-child {
		border-right:0;
	}
	
	.mobileHide {
		display:none;
	}

	
}

/*------------------------------------------------------------------
	NEW - Products
------------------------------------------------------------------*/
.productBox {
	margin-bottom:10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	overflow:hidden;
}

.productBox .thumb {
  position: relative;
  border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  overflow: hidden;
}

.overlay {
    background: #EC0000;
    background-color: rgba(0,0,0,0.35);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0.75)";
}

.overlay, .background-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    transition: all 0.35s ease;
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    -ms-transition: all 0.35s ease;
    border-radius: inherit;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

.background-overlay {
    opacity: 1;
    padding: inherit;
}

.overlay:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    cursor: pointer;
}

.overlay:hover i.sm, .overlay:hover i.md {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.overlay i.sm, .overlay i.md {
    border-radius: 100%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

.overlay i.md {
    line-height: 74px;
    width: 74px;
    font-size: 15px;
    margin-top: -37px;
    margin-left: -37px;
}

.overlay i.sm {
    line-height: 25px;
    width: 25px;
    font-size: 10px;
    margin-top: -13px;
    margin-left: -13px;
}

.bg-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
}

a.overlay:hover {
    text-decoration: none;
}

.overlay i.sm, .overlay i.md {
    color: #fff;
    background: #000000;
    background-color: rgba(0,0,0,0.60);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0.60)";
}

.productBox img {
  width: 100%;
  border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
}

.productText {
	padding:10px;
	background:#fff;
	border:1px solid #dbdbdb;
	border-top:0 none;
	border-radius: 0 0 5px 5px;
  -webkit-border-radius: 0 0 5px 5px;
  -moz-border-radius: 0 0 5px 5px;
}

.productText p {
	padding-bottom:10px;
	border-bottom:1px solid #dbdbdb;
	margin-bottom:6px;
	min-height:71px;
}

.enquireBtn, .detailsBtn {
	float:left;
	color:#EC0000;
	margin-right:0px;
	padding:6px 0px;
	text-align: center;
	width:50%;
	border-right:1px solid #dbdbdb;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0ms ease-in-out;
	-moz-transition: all 0ms ease-in-out;
	-ms-transition: all 0ms ease-in-out;
	-o-transition: all 0ms ease-in-out;
	transition: all 0ms ease-in-out;
}

.enquireBtn i, .detailsBtn i {
	font-weight:normal;
	margin-right:7px;
	-webkit-transition: all 0ms ease-in-out;
	-moz-transition: all 0ms ease-in-out;
	-ms-transition: all 0ms ease-in-out;
	-o-transition: all 0ms ease-in-out;
	transition: all 0ms ease-in-out;
}

.detailsBtn {
	border-right:0 none;
	color:#333;
}

.enquireBtn:hover, .detailsBtn:hover, .enquireBtn:hover i, .detailsBtn:hover i {
	color:#333;
}

/*------------------------------------------------------------------
	NEW - Products Details
-------------------------------------------------------------------*/
.productDetails .info > p {
    line-height: 23px;
    margin-bottom: 15px;
}

.productDetails .icon.list {
    margin-bottom: 15px;
}

.productDetails .icon.list .element {
    margin-bottom: 0;
}

.productDetails .icon.list .element p {
    padding: 2px;
	margin-bottom:8px;
}

.productDetails .icon.list .element i {
    border-radius: 100%;
    height: 23px;
    line-height: 24px;
    width: 23px;
    text-align: center;
    text-indent: -1px;
    font-size: 13px;
    margin-right: 15px;
	background:#E70101;
	color:#fff;
}

.productDetails .photo {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.productDetails .photo img {
    border-radius: 5px;
    -webkit-border-radius: 5px;
}

.item {
	background:#fff;
	padding:20px;
	text-align:center;
	margin-right:5px;
	border:1px solid #dbdbdb;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

.breadcrumb {
	margin:0;
	padding:0;
	background:none;
	color:#666;
}

.breadcrumb i {
	margin:0 5px;
}

.breadcrumb a {
	color:#999;
}

.owl-item .item h3 {
	text-transform:uppercase;
	min-height:36px;
}


/* =============== Carousel =============== */

.crsl-wrap {
    position: relative;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

.carousel-inner {
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

.carousel.fade {
    opacity: 0.4;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
}

.carousel.fade .item {
    -moz-transition: opacity ease-in-out 1.5s;
    -o-transition: opacity ease-in-out 1.5s;
    -webkit-transition: opacity ease-in-out 1.5s;
    transition: opacity ease-in-out 1.5s;
    left: 0 !important;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    top: 0;
    position: absolute;
    width: 100%;
    display: block !important;
    z-index: 100;
}

.carousel.fade .item:first-child {
    top: auto;
    position: relative;
}

.carousel.fade .item.active {
    opacity: 0.4;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    -moz-transition: opacity ease-in-out 1.5s;
    -o-transition: opacity ease-in-out 1.5s;
    -webkit-transition: opacity ease-in-out 1.5s;
    transition: opacity ease-in-out 1.5s;
    z-index: 200;
}

.carousel.fade .carousel-indicators li.pre-active {
    margin: 1px;
}


/* ============== Shop =============== */

.shop-crsl {
    position: relative;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
}

.shop-crsl.carousel-fade .carousel-inner {
    overflow: visible;
}

.carousel .controls a {
    position: absolute;
    top: 50%;
    width: 100%;
    line-height: 53px;
    width: 50px;
    border-radius: 2px;
    text-align: center;
    margin-top: -25px;
    font-size: 11px;
    height: 50px;
    z-index: 200;
}

.carousel .controls.mini a {
    height: 25px;
    width: 25px;
    line-height: 27px;
    margin: 0;
}

.carousel .controls.mini .left {
    left: 20px;
    top: 20px;
}

.carousel .controls.mini .right {
    left: 48px;
    top: 20px;
}

.carousel .controls.spaced a {
    margin-left: 15px;
    margin-right: 15px;
}

.carousel .controls a:hover {
    text-decoration: none;
}

.carousel .controls .left {
    left: 0px;
    position: absolute;
    padding-right: 3px;
}

.carousel .controls .right {
    right: 0px;
    position: absolute;
    padding-left: 3px;
}


.carousel .controls a {
    background: #7b7a7a;
    background: rgba(123,122,122,0.45);
    color: #fff;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

.carousel .controls a:hover {
    background: #219fd1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.carousel-fade .carousel-inner .item {
	margin:0;
	padding:0;
}

.carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}



/*------------------------------------------------------------------
	NEW - Sidebars
-------------------------------------------------------------------*/
/* Left Sidebar */

#left-side-bar {
	width:16%;
	min-width:180px;
	height:100%;
	position:fixed;
	background-color:#000;
	left:0;
	border-right:1px solid #ddd;
	z-index:10;
}

#left-side-bar-content {
	position:relative;
	width:100%;
	padding:0;
	margin:0 auto;
	height:100%;
}

#latest-projects-links {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	padding:0 30px 30px;
	z-index:12;
}

#latest-projects-links h2 {
	color:#fff;
	font-family: 'Source Sans Pro', sans-serif;
	font-style:italic;
	font-weight:600;
	padding-bottom:5px;
}

#latest-projects-links h3 {
	color:#fff;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:300;
}

#latest-projects-links img {
	position:relative;
	margin:5% 0;
	float:left;
}

#logo-red {
	float:left;
	position:relative;
	top:5%;
	left:25%;
	width:50%;
	z-index:12;
}

#kpdLink {
	z-index:11;
	margin-bottom:15px;
	width:100%;
}

#kpdLink a {
	display:block;
}

#latest-projects-links #kpd-link img {
	float:none;
}

#gallery-popout {
	width:68%;
	height:100%;
	position:fixed;
	background-color:#000;
	left:15.8%;
	z-index:15;
	border-right:1px solid #ddd;
	display:none;
	transition:none;
}

.gall-link {
	cursor:pointer;
}

.gall-link:hover {
	opacity:0.5;
}

.gall-expand {
	display:block;
}

#gallery-container {
	width:100%;
	min-width:620px;
	position: absolute;
	left:0;
	top:0;
	bottom:0;
	padding:5%;
	color:#fff;
	display:none;
	overflow-y:auto;
}

#gallery-cont-scroll {
}

#galleryTwo {
	margin-bottom:25px;
}

#gallery-container p {
	font-family: 'Source Sans Pro', sans-serif;
	color:#999;
}

#gallery-container h3, .left-col h3 {
	color:#ce0000;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:600;
	font-style:italic;
	font-size:35px;
}

#gallery-container h4, .left-col h4 {
	color:#fff;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:300;
	font-size:24px;
}

#gallery-container .btn-learn-more div {
	background:#ce0000;
	font-weight:400;
}

.left-col {
	padding-bottom:30px;
	width:100%;
}

.right-col {
	width:100%;
}

#gallery-container .left-col {
	width:100%;
	float:left;
	padding:0;
	margin:0;
}

#gallery-container .right-col {
	width:48%;
	float:left;
	padding:0;
	margin:0 0 0 0;
}

#find-out-moretwo {
	position:relative;
	float:right;
	width:44%;
	min-width:123px;
}

#find-out-moretwo-paddiv {
	padding-top:28.2%;
}

#find-out-moretwo-element {
	position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
	padding:9% 15%;
    background:url(../images/findoutmore-btn2.jpg) no-repeat;
	background-position:100% 0;
	background-size:cover;
	transition:all 0.3s ease-in-out 0s;
	-moz-transition:all 0.3s ease-in-out 0s;
	-webkit-transition:all 0.3s ease-in-out 0s;
	-o-transition:all 0.3s ease-in-out 0s;
	-ms-transition:all 0.3s ease-in-out 0s;
}

#find-out-moretwo-element:hover {
	color:#ec0000;
	background-position:0 0;
	transition:all 0.3s ease-in-out 0s;
	-moz-transition:all 0.3s ease-in-out 0s;
	-webkit-transition:all 0.3s ease-in-out 0s;
	-o-transition:all 0.3s ease-in-out 0s;
	-ms-transition:all 0.3s ease-in-out 0s;
}

#find-out-moretwo-element h2 {
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:600;
	font-style:italic;
	text-align:center;
	color:#fff;
	transition:all 0.3s ease-in-out 0s;
	-moz-transition:all 0.3s ease-in-out 0s;
	-webkit-transition:all 0.3s ease-in-out 0s;
	-o-transition:all 0.3s ease-in-out 0s;
	-ms-transition:all 0.3s ease-in-out 0s;
}

#find-out-moretwo-element:hover h2{
	color:#ec0000;
	background-position:0 0;
	transition:all 0.3s ease-in-out 0s;
	-moz-transition:all 0.3s ease-in-out 0s;
	-webkit-transition:all 0.3s ease-in-out 0s;
	-o-transition:all 0.3s ease-in-out 0s;
	-ms-transition:all 0.3s ease-in-out 0s;
}

#find-out-moretwo-element-inner {
	height:100%;
}

@media screen and (max-width: 1350px) {
	#gallery-cont-scroll {
		color:#fff;
	}
	
	#gallery-cont-scroll p {
		color:#ccc;
		font-weight:400;
	}
	
	#gallery-cont-scroll .btn-learn-more div {
		background:#EC0000;
		font-weight:600;
	}
}


/* Right Sidebar */

#right-side-bar {
	width:17%;
	min-width:180px;
	height:100%;
	position:fixed;
	right:0;
	z-index:10;
}

#menu {
	position:relative;
	float:right;
	padding:0;
	margin:40% 0 0 0;
	list-style:none;
	z-index:11;
	width:100%;
}

#menu li {
	padding:0;
	margin:0 0 0px 0;
	width:auto;
}

#menu li a {
	height:38px;
	display:block;
	padding:0 40px 0 30px;
	margin:0 0 5px 0;
	float:right;
	color:#212121;
	font-size:14px;
	line-height:42px;
	text-align:right;
	text-transform:uppercase;
	width:auto;
}

#menu li.current a {
	background-color:#ec0000;
	color:#fff;
	text-shadow:none;
}

#menu li a:hover {
	background-color:#000;
	color:#fff;
	text-shadow:none;
	transition:all 0.3s ease-in-out 0s;
	-moz-transition:all 0.3s ease-in-out 0s;
}

#menu li ul {
	position:relative;
	float:right;
	list-style:none;
	display:none;
	padding:0;
	margin:0 0 0px 0;
	width:240px;
	height:auto;
}

#menu li ul li {
	float:none;
	padding:0;
	margin:0;
}

#menu li ul li a {
	font-size:14px;
	padding:0 40px 0 0;
	margin:0 0px 0 0;
	color:#444;
	float:none;
}

#menu li ul li a:hover {
	background:none;
	color:#000;
}

#menu li:hover ul.droppy {
	display:block;
}

#logo {
	bottom:5%;
	right:40px;
	left:auto;
	position:absolute;
	width:30%;
	z-index:12;
}

@media screen and (max-width: 1350px) {
	#left-side-bar, #right-side-bar, #gallery-popout {
		display:none;
	}
}


/*------------------------------------------------------------------
	3. Sign Up Section
-------------------------------------------------------------------*/
#signup, .row2{
	background-color:#FFFFFF;
	min-height: 385px;
}

/* Form style */
.form-items-holder{
	display:inline-block;
	width:306px;
	padding-top:40px;
	padding-left:20px;
	padding-right:20px;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}

/* Form text input style */
#demoform input[type=text]{
	color: #838383;
  	background-color: #ffffff;
	border: 1px solid #D0D0D0;
	padding: 10px;
  	border-radius: 3px;
  	background-color: #fff;
  	margin: 8px 0 8px 0px;
  	font-size: 14px;
  	width: 100%;
  	height: 43px;
}

/* Form submit button style */
#demoform input[type=submit]{
	font-size: 18px;
	color:#ffffff;
	width: 100%;
	height: 52px;
	background-color:#F04040;
	border:0;
}
#demoform input[type=submit]:hover{
	background-color:#d43b3b;
}

/*------------------------------------------------------------------
	4. Features Section
-------------------------------------------------------------------*/
#features, .row3{
	background-color:#152031;
	background-image:url(../images/bg1.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: 730px;
}

/* Features styles */
.features .feature{
	text-align:center;
}
.features .feature img{
	margin-bottom:15px;
}
.features .feature .f-title{
	margin-bottom:15px;
	color:#1093c1;
	font-size: 18px;
}
.features .feature .f-details{
	margin-bottom:30px;
	color:#999999;
	font-size: 14px;
}

/*------------------------------------------------------------------
	5. Try Now Section
-------------------------------------------------------------------*/
#trynow, .row4{
	background-color:#FFFFFF;
	min-height: 368px;
}

/* Try Now informations styles */
.trynow{
	padding-top:40px;
	padding-bottom:50px;
}
.trynow h3{
	font-size:22px;
	margin-bottom:5px;
}
.trynow ul{
	padding-left:18px;
}
.trynow ul li{
	color:#808080;
	font-size:18px;
	padding-bottom: 12px;
}
.btn-learn-more {
	display:inline-block;
}
.btn-learn-more div{
	display:inline-block;
	height: 45px;
  	width: 160px;
	background-color: #e70101;
  	color: #ffffff;
	font-size:15px;
	-webkit-border-radius: 0px;
  	-moz-border-radius: 0px;
	border-radius:0px;
	text-align:center;
	padding-top:12px;
}
.btn-learn-more:hover div{
	background-color: #000;
}

/* laptop image and youtube video styles */
.laptop{
	text-align:center;
	padding-top:40px;
	padding-bottom:50px;
}
.laptop img{
	max-width:100%;
	margin-top:35px;
}
.laptop .video{
	position:absolute;
	left:125px;
	top:78px;
	width:337px;
	height:212px;
}
.laptop .video .youtube_object{
	width:100%;
	height:100%;
}

/*------------------------------------------------------------------
	6. Pricing tables Section
-------------------------------------------------------------------*/
#prices, .row5{
	background-color:#D8D8D8;
	background-image:url(../images/bg2.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	min-height: 613px;
}

 /* This is the pricing table styles */
.price-column{
	margin-bottom:50px;
}
.price-table{
	background-color:#013243;
	color:#ffffff;
	text-align:center;
	-webkit-border-radius: 6px;
  	-moz-border-radius: 6px;
	border-radius: 6px;
	font-size: 12px;
	padding-bottom:50px;
}
.price-table .price-title{
	height:46px;
	-webkit-border-radius: 5px 5px 0px 0px;
  	-moz-border-radius: 5px 5px 0px 0px;
	border-radius: 5px 5px 0px 0px;
	font-weight:500;
	font-size:18px;
	text-align:center;
	padding-top:10px;
	margin-bottom:20px;
}
.green{
	background-color: #49bd8f;
}
.pink{
	background-color: #e85e76;
}
.blue{
	background-color: #56b4bd;
}
.purple{
	background-color: #8061a1;
}
.price-table .price{
	font-size:42px;
	text-align:center;
}
.price-table .duration{
	margin-bottom:15px;
	text-align:center;
	color:#336680;
	font-size:16px;
}
.price-table .sp{
	border-bottom: 1px solid #336680;
	margin-top:10px;
	margin-bottom:10px;
	margin-right:20px;
	margin-left:20px;
}
a.price-btn{
	position:absolute;
	bottom:-20px;
	margin-left:-68px;
	left:50%;
	text-decoration:none;
}
.price-btn div{
	height: 40px;
  	width: 136px; 
	-webkit-border-radius: 5px;
  	-moz-border-radius: 5px;
	border-radius: 5px;
	color:#ffffff;
	font-size: 13px;
	text-align:center;
	padding-top:10px;
}
.price-btn:hover .green{
	background-color:#3fa57d;
}
.price-btn:hover .pink{
	background-color:#d9566d;
}
.price-btn:hover .blue{
	background-color:#439fa6;
}
.price-btn:hover .purple{
	background-color:#6d5282;
}
.circle{
	width: 63px;
  	height: 63px;
  	background-color: #ffc40d;
  	opacity: 0.86;
  	filter: alpha(opacity=86);
	-webkit-border-radius: 50%;
  	-moz-border-radius: 50%;
  	border-radius: 50%;
	position:absolute;
	text-align:center;
	color:#FFFFFF;
	font-size:12px;
	padding-top:15px;
	top:-30px;
	right:-15px;
	z-index:2;
}

/*------------------------------------------------------------------
	NEW - Map Section
------------------------------------------------------------------*/
#map {
    height: 450px;
    width: 100%;
}

.mobileImg {
		display:none;
		max-width:100%;
	}


/*------------------------------------------------------------------
	7. Testimonials Section
-------------------------------------------------------------------*/
.testimonials-2 .itemT {
	margin-bottom:10px;
}

.testimonials-2 .itemT .text {
    border-radius: 5px;
    line-height: 22px;
    padding: 18px 40px 18px 20px;
    position: relative;
}

.testimonials-2 .itemT .text:before {
    position: absolute;
    border: inherit;
    border-top: none;
    content: "";
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 23px 26px 0 0;
    border-color: #fff transparent transparent transparent;
    bottom: -23px;
    left: 95px;
    z-index: 5;
}

.testimonials-2 .itemT .text:after {
    position: absolute;
    border: inherit;
    border-top: none;
    content: "";
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 25px 29px 0 0;
    border-color: #ebebeb transparent transparent transparent;
    bottom: -25px;
    left: 94px;
}

.testimonials-2 .avatar {
    position: absolute;
    padding: 3px;
    bottom: -48px;
    left: 16px;
    border-radius: 2px;
}

.testimonials-2 .itemT .text p {
    margin-bottom: 5px;
    line-height: 22px;
}

.testimonials-2 .client {
    padding: 17px 120px;
    padding-right: 20px;
    padding-bottom: 12px;
}

.testimonials-2 .client h5 {
    margin: 0;
}

.testimonials-2 .client p {
    margin: 0;
    font-size: 11px;
    line-height: 15px;
}

.avatar {
    background: #fff;
    -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}

.testimonials-2 .itemT .text {
    border: 1px solid #ebebeb;
    background: #fff;
}

.testimonials-2 .itemT .text p {
    color: #6f6f6f;
}

/*------------------------------------------------------------------
	8. Clients Section
-------------------------------------------------------------------*/
#clients, .row7{
	background-color:#FFFFFF;
	min-height: 266px;
}

/* This is the style for the clients logos */
.clients{
	text-align:center;
}

.client-logo{
	display:inline-block;
	opacity:0.7;
}
/* client logo mouse over opacity change */
.client-logo:hover{
	opacity:1;
}

/*------------------------------------------------------------------
	9. Footer
-------------------------------------------------------------------*/
#footer, .row8{
	background-color:none;
	min-height: 76px;
}

/* This is the style for the left area of the footer (Copyright text) */
.footer-left{
	text-align:left;
	color:#808080;
	font-size:12px;
	margin-top:30px;
}
/* And this is for the right area of the footer (Social media links) */
.footer-right{
	text-align:right;
	margin-top:30px;
	color:#808080;
	font-size:12px;
}

.social{
	opacity:0.8;
}
.social:hover{
	opacity:1;
}

/*------------------------------------------------------------------
	10. Responsive Styles
-------------------------------------------------------------------*/

.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
	clear:both;
}

/* Other screens styles modifications */
@media (max-width: 1200px) {
	.laptop .video{
		left:90px;
		top:77px;
		width:305px;
		height:191px;
	}
	.laptop img{
		height: 288px; 
		width: 450px;
	}
}
@media (max-width: 992px) {
	.laptop{
		padding-top:30px;
		padding-bottom:30px;
	}
	.laptop .video{
		left:72px;
		top:92px;
		width:238px;
		height:149px;
	}
	.laptop img{
		height: 222px; 
		width: 350px;
	}

}
@media (max-width: 768px) {
	.mobileImg {
		display:block;
	}
	.box{
		width:46px !important;
	}
	.box img{
		margin-left:0 !important;
	}
	.chat-link{
		display:none;
		visibility:hidden;
	}
	.laptop .video{
		left:50%;
		margin-left:-135px;
		top:93px;
		width:271px;
		height:170px;
	}
	.laptop img{
		height: 254px; 
		width: 400px;
	}
	#canvas{
		opacity:1;
		top:340px;
		right:0px;
	}
	.small-text{
		margin-bottom:200px;
	}
	.form-top{
		width:100% !important;
	}
	.form-items-holder{
		width:100% !important;
		padding-left:0 !important;
	}
	.footer-left{
		text-align:center;
	}
	.footer-right{
		text-align:center;
		margin-bottom:15px;
	}
	.client-logo{
		opacity:1;
	}
}
@media (max-width: 480px) {
	.big-text{
		font-size:50px;
	}
	.laptop .video{
		left:50%;
		margin-left:-84px;
		top:90px;
		width:169px;
		height:108px;
	}
	.laptop img{
		height: 159px; 
		width: 250px;
	}
	#canvas{
		opacity:1;
		top:340px;
		right:0px;
		width:500%;
	}
	.small-text{
		margin-bottom:200px;
	}
	.big-text{
		line-height:50px;
	}
	.features .feature .f-title{
		font-size: 12px;
	}
	.features .feature .f-details{
		font-size: 12px;
	}
}