@media (min-width: 768px) and (max-width: 991px)
 {
    .container {
        margin-right: auto;
        margin-left: auto;
        padding-left: 10px;
        padding-right: 5px;
    }
    .container>.navbar-header, .container-fluid>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-collapse {
        margin-right: -15px;
        margin-left: -15px;
    }
}
html,
body {
   margin:0;
   padding:0;
   height:100%;
}
#container {
   min-height:100%;
   height:100%;
   height: auto !important;
   position:relative;
   /*margin-bottom:-15%;   /* Negative height of the footer */*/
}
footer .row {
    margin-left:0px;
    margin-right:0px;
}
footer{
    /*bottom:0px;
    position:relative;
    width:100%;*/
    position:relative;
   width:100%;
   background:#6cf;
}
.btn {
    margin-bottom:10px;
    border-radius: 0px;
}
.btn-success, .btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success {
    background-color:#f30;
    border-color:#f30;
}
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary{
    background-color:#f7931e;
    border-color:#f7931e;
}
.btn-info, .btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info{
    background-color:#ffc000;
    border-color:#ffc000;
}
.btn-default, .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default{
    background-color:#333;
    border-color:#333;
    color:#fff;
}
.wrapper {
    min-height:100%;
    height:auto;
    margin:0 auto -60px;
    padding:0 0 60px;
}

@charset "utf-8";
/*********************************
			COMET CSS
**********************************/

/*********************************	INDEX  **********************************
	1-	OTHER	------------------------------------------------- XXX
	2-	NAVBAR	------------------------------------------------- XXX
	3-	SECTION STYLES	----------------------------------------- XXX
	4-	FEATURE SECTION STYLE	--------------------------------- XXX
	5-	PRODUCT SECTION STYLE	--------------------------------- XXX
	6-	ABOUT SECTION STYLE 	--------------------------------- XXX	
	7-	CONTACT SECTION STYLE 	--------------------------------- XXX	
	8-	FOOTER STYLES 	----------------------------------------- XXX	
	9-	FEATURE HOVER EFFECT 	--------------------------------- XXX	
	10-	CAROUSEL 	--------------------------------------------- XXX	
	11-	BACKGOUND FOR MOBILE 	--------------------------------- XXX	
	12-	PARALLAX  	--------------------------------------------- XXX	
	13-	EXTRA 	------------------------------------------------- 	
	14-	EXTRA 	------------------------------------------------- 	
****************************************************************************/

/*********************************
			OTHER
**********************************/
@font-face {
	font-family: 'gt';
	src: url(../fonts/ff/goodtimes.ttf) format("truetype");
}

@font-face {
	font-family: 'cd';
	src: url(../fonts/ff/CaviarDreams_Bold.ttf) format("truetype");
}

#three-d h1 {
	color: #fff;
	text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px	    #333, 0px 8px 7px #001135;
	font-family:gt;
	
}

#slide-top{
	top:25%;
	padding-left:0px;
	padding-right:0px;	
}

#main{
	height: 800px;
}

.cfont16{
	font-size: 16px;
}

.cus-intro-heading{
	color: #f30; 
	text-align:center; 
	border-bottom:solid 1px;
}

#intro ul{
	list-style-type:none; 
	padding-left:0px;
}

#intro .row h1{
	color:#f30;
}


html{
    overflow: visible;
}

body{
	position:relative;
	/*background-color:#222;*/
	font-family:Monda ;
	/*overflow-x: hidden;*/
    overflow: visible;
}

.visiblehidden{
	visibility: hidden;
}

.divider{
	margin:50px 0px;
}

/*********************************
			NAVBAR
**********************************/
.navbar-default, .navbar-default .navbar-toggle .icon-bar{
	background-color:#FFF;
}

.navbar, .navbar-default .navbar-collapse, .navbar-default .navbar-form, .navbar-default .navbar-toggle{
	border:none;
}

.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand{
	margin-top:-5px;
}	

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
	background-color:#333;	
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus{
	background-color:#f30;
	color:#fff;
	border-bottom: solid #f30;
}

.navbar-default .navbar-nav>li>a, .navbar-default .navbar-nav>li>a:before, .navbar-default .navbar-nav>li>a:after{
	color:#fff;
	padding:16px;
}

.navbar-default .navbar-nav>li>a:hover{
	color:#f30;	
	border-bottom:solid ;
}

.navbar-header img{
	width:50px;
	height:50px;	
}

.navbar-brand img{
	margin-top:-10px;	
}

/*********************************
		SECTION STYLES 
**********************************/

section{
	background-color:#FFF;
	position:relative;	
}

.sectiondiv{
	background-color: #F30;
	padding-right: 20px;
	padding-left: 20px;
	padding: 25px;
	text-align: center;	
}

.sectiondiv h1{
	color:white;
	margin:0; 
	padding:0;
}

/***	MAIN SECTION STYLE 	***/

#bdown{
	color:#f30;	
}

/***	FEATURE SECTION STYLE 	***/
#featContent a{
	color:#f30;
}

.featborder{
	border:solid 3px #f30;
	border-radius:50%;
	width:100px;
	height:100px;
	padding:25px;
}

/***	PRODUCT SECTION STYLE 	***/
#product a, #product .container h1{
	color:#f30;
}

#product .row{
	margin:50px 0px;
}

#product .row img{
	width:80%;
	height:80%;
	margin: 0 auto;	
}

#multi-platform-image img{
	width:80%;
	/*height:80%;*/
	margin:0 auto;
}

/***	ABOUT SECTION STYLE 	***/
#about .row h1{
	color:#f30;
}

/***	CONTACT SECTION STYLE 	***/
#contact-form{
	margin:50px 0px; 
	padding:10px 0px;
}

#contact-form button{
	color: #fff;
	background-color: #f30;
	border-radius: 0px;
}

.form-control {
	border-color: #DDDDDD;
	border-radius: 0;
	box-shadow: none;
	font-size: 15px;
	height: 38px;
	font-weight: 300;
	background-color: #FCFCFC;
    margin-bottom: 27px;
}

textarea.form-control {
	height: 144px;
	resize: vertical;
}

/*********************************
		FOOTER STYLES 
**********************************/

footer{
	background-color:#333;
	color:#fff;
	/*position:relative;*/
}

footer ul{
	list-style-type:none;
	padding:0px;
}

footer ul li{
	display:inline;
	margin-right:10px;
}

footer ul li i{
	border: solid 2px #FFF;
	border-radius:50%;
	padding:10px;
	width:35px;
	height:35px;
	display:block;
	text-align:center;
}

footer h4{
	color:#f30;	
}

#footer-style{
	padding:10px 0px;
}

#copyRights p{
	margin:0px 0px;	
}

#footer-end-line p{
 	margin:0px;
}

#footer-end-line{
	background-color:#222;
}

/*********************************
		FEATURE HOVER EFFECT
**********************************/

.hovicon {
    display: inline-block;
    font-size: 45px;
    line-height: 100px;
    cursor: pointer;
    margin: 20px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    text-decoration: none;
    z-index: 1;
    color: #000;
}

.hovicon.small {
    font-size: 20px;
    line-height:45px;
    width:45px;
    height:45px;
    margin:7px;
}

.hovicon.mini {
    font-size: 15px;
    line-height:32px;
    width:30px;
    height:30px;
    margin:7px;
}

.hovicon.auto-width {
    width: auto;
    height: auto;
    padding: 15px;
}

.hovicon:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content:'';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.hovicon:before {
    speak: none;
    font-size: 48px;
    line-height: 90px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}

.hovicon-effect-3 .hovicon {
	box-shadow: 0 0 0 4px #fff;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hovicon-effect-3 .hovicon:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #fff;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3 */
 .hovicon.effect-3 {
    box-shadow: 0 0 0 4px #fff;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.hovicon.effect-3:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #f30;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
    -moz-transition: -moz-transform 0.2s, opacity 0.3s;
    transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3b */
 .hovicon.effect-3.sub-b, .hovicon.effect-3.sub-b i {
    color: #000;
}

.hovicon.effect-3.sub-b:hover, .hovicon.effect-3.sub-b:hover i {
    color: #fff;
}

.hovicon.effect-3.sub-b:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
}

.hovicon.effect-3.sub-b:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/*********************************
		CAROUSEL
**********************************/

.carousel-inner h1{
	font-weight:bolder;
	font-size:6em;	
}

.carousel-control.m-btn {
	position: absolute;
	height: auto;
	width: auto;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
}

.carousel-inner .item img {
	display: inline-block !important;
}

.carousel-inner .item {
	text-align: center !important;
}

@media (max-width: 570px) {
	.carousel-control.left {
		left: 0;
	}
	.carousel-control.right {
		right: 0;
	}
}

.carousel-control {
	background: none;
	border: none;
	opacity: 0.3;
}

.carousel-control:hover {
	background: none;
	border: none;
	opacity: 0.8;
}

.carousel.horizontal .next {
	left: 100%;
}

.carousel.horizontal .prev {
	left: -100%;
}

.carousel.horizontal .active.left {
	left: 100%;
}

.carousel.horizontal .active.right {
	left: -100%;
}

.carousel.carousel-fade .item {
	-webkit-transition: opacity 0.5s ease-in-out;
	-moz-transition: opacity 0.5s ease-in-out;
	-ms-transition: opacity 0.5s ease-in-out;
	-o-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;
	opacity:0;
}

.carousel.carousel-fade .active.item {
	opacity:1;
}

.carousel.carousel-fade .active.left,
.carousel.carousel-fade .active.right {
	left: 0;
	z-index: 2;
	opacity: 0;
	filter: alpha(opacity=0);
}

.carousel.carousel-fade .next,
.carousel.carousel-fade .prev {
	left: 0;
	z-index: 1;
}

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

.vertical .carousel-inner {
	height: 100%;
}

.carousel.vertical .item {
	-webkit-transition: 0.6s ease-in-out top;
	-moz-transition: 0.6s ease-in-out top;
	-ms-transition: 0.6s ease-in-out top;
	-o-transition: 0.6s ease-in-out top;
	transition: 0.6s ease-in-out top;
}

.carousel.vertical .active {
	top: 0;
}

.carousel.vertical .next {
	top: 100%;
}

.carousel.vertical .prev {
	top: -100%;
}

.carousel.vertical .next.left,
.carousel.vertical .prev.right {
	-webkit-transition: ease-in-out top;
	-moz-transition: ease-in-out top;
	-ms-transition: ease-in-out top;
	-o-transition: ease-in-out top;
	transition: ease-in-out top;
}

.carousel.vertical .active.left {
	top: 100%;
}

.carousel.vertical .active.right {
	top: -100%;
}

.carousel.vertical .item {
	left: 0;
}

.carousel .inactive {
	position: absolute;
	display: block;
	z-index: -1;
}

.carousel .inactive.active {
	position: relative !important;
	z-index: 0;
}


/*********************************
		BACKGOUND FOR MOBILE
**********************************/
#mobile-bg{
	background-image: url(../images/geometric.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	height: 500px;
	width: 100%;
}

#mobile-bg h1{
	padding-top: 30%;
	color: #fff;
	text-align:center;	
}

/*********************************
		PARALLAX ID AND CLASSES
**********************************/
#Scene{
	position:fixed;
	width:100%;
	height:11000px;
	margin-top:-350px;
	top:50%;
}

#c-main{
	background:url(../images/iphone-5.jpg) no-repeat center center fixed; 
	/*background:url(../images/iphone-5.jpg);*/
	background-size:cover;
	height:800px; 
	width:2000px; 
	height:100%; 
	width:100%; 
	position:absolute;
	
	/*background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size:cover;
    height: 100%;
    width: 100%;
	position: absolute;*/
}

/*.parallax-layer{
	position:absolute;
	height:700px;
	background-repeat:no-repeat;
}*/

/*.parallax-layer{
	position:absolute;
	height:100%;
}*/

#bg1{
	position:absolute;
	/*background:url('../images/bg3.png') no-repeat center center fixed;*/
	background:url('../images/bg3.png') no-repeat center center;
	height:1000px;
	/*height:800px;*/
	/*width:3528px;*/
	width: 1425px;
	/*width: 100%;*/
	/*background-repeat:no-repeat;*/
	/*background-size: 1300px 800px;*/
	background-size: 100%;
	top: -140px;
}

#bg2{
	background:url('../images/') left bottom;
	width:4368px; 
}

#sun{
	position:absolute;
	background:url('../images/sun.png');
	width:194px;
	height:194px;
	left:180px;
}

#cloud{
	position:absolute;
	background:url('');
	width:2059px;
	height:347px;
}

#ccloud{
	position:absolute;
	background:url('../images/cc.png');
	width:200px;
	height: 134px;
}

#zombie{
	position:absolute;
	background-image:url('../images/boardman2.png');
	width:250px;
	height:190px;
	top:340px;
	left:300px;
}

#zombie1{
	position:absolute;
	background-image:url('../images/fr.png');
	width:250px;
	height:190px;
	top:340px;
	left:300px;
}

.cm{
	position:absolute;
	background-image:url('../images/cm2.png');
	width:25px;
	height:50px;
	top:340px;
	left:300px;
}

#bird{
	position:absolute;
	background-image:url('../images/.png');
	width:160px;
	height:200px;
	top:340px;
	left:300px;
}

.box{
	position:absolute;
	background-image:url('../images/box.png');
	width:80px;
	height:67px;
}

#car{
	position:absolute;
	background-image:url('../images/car.png');
	width:355px;
	height:213px;
	top:340px;
	left:300px;
}

.school{
	position:absolute;
	width:600px;
	height:523px;
	top:100px;
}

#schoolunder{background:url('../images/school_under.png');}
#schoolover{background:url('../images/school_over.png');}


/*birdy*/

.birdy {
	position:absolute;
    width: 164px;
    height: 88px;
    background-image: url('../images/birds.png');
    
    -webkit-animation: play .8s steps(2) infinite;
       -moz-animation: play .8s steps(2) infinite;
        -ms-animation: play .8s steps(2) infinite;
         -o-animation: play .8s steps(2) infinite;
            animation: play .8s steps(2) infinite;
}

@-webkit-keyframes play {
   from { background-position-y:    0px; }
     to { background-position-y: -176px; }
}

@-moz-keyframes play {
   from { background-position-y:    0px; }
     to { background-position-y: -176px; }
}

@-ms-keyframes play {
   from { background-position-y:    0px; }
     to { background-position-y: -176px; }
}

@-o-keyframes play {
   from { background-position-y:    0px; }
     to { background-position-y: -176px; }
}

@keyframes play {
   from { background-position: 0px    0px; }
     to { background-position: 0px -176px; }
}

/*Floating*/

.floating{
	position:absolute;
    float: left;
    -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-name: Floating;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
	-ms-animation-name: Floating;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: ease-in-out;
	-o-animation-name: Floating;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: ease-in-out;
	animation-name: Floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;

}

@-webkit-keyframes Floatingx{
    from {-webkit-transform:translate(0, 0px);}
    65% {-webkit-transform:translate(0, 25px);}
    to {-webkit-transform: translate(0, -0px);}    
}
    
@-moz-keyframes Floating{
    from {-moz-transform:translate(0, 0px);}
    65% {-moz-transform:translate(0, 25px);}
    to {-moz-transform: translate(0, -0px);}    
}

@-ms-keyframes Floating{
    from {-ms-transform:translate(0, 0px);}
    65% {-ms-transform:translate(0, 25px);}
    to {-ms-transform: translate(0, -0px);}    
}

@-o-keyframes Floating{
    from {-o-transform:translate(0, 0px);}
    65% {-o-transform:translate(0, 25px);}
    to {-o-transform: translate(0, -0px);}    
}

@keyframes Floating{
    from {transform:translate(0, 0px);}
    65% {transform:translate(0, 25px);}
    to {transform: translate(0, -0px);}    
}








@media (max-device-width: 480px){
	#three-d h1 {
	color: #fff;
	text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px 	#333, 0px 8px 7px #001135;
	font-size: 2.5em;
	font-family:gt;
	}	
	
	#c-main{
	background:url(../images/iphone-5-320.png) no-repeat center center fixed; 
	/*background:url(../images/iphone-5.jpg);*/
	background-size:cover;
	height:100%; 
	width:100%; 
	position:absolute;
}
}

@media (min-device-width: 481px) and (max-device-width: 768px){
	#three-d h1 {
	color: #fff;
	text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px 	#333, 0px 8px 7px #001135;
	font-size: 5em;
	font-family:gt;
	}	
}