/* ==================================================================
GLOBAL STYLES
================================================================== */
/* === GENERAL === */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, dark, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {border: 0 none;padding: 0;vertical-align: baseline;}
html {font-size: 100%;}
audio, canvas, video {display: inline-block;*display: inline;*zoom: 1;}
body, html {background: transparent;padding: 0;position: relative;height: 100%;margin: 0;}

html,
body { 
	height:100%;
	width:100%;
	overflow: hidden-x;
	position: relative;

}
#demonote { display: none !important;}
img[src*="https://cdn.000webhost.com/000webhost/logo/footer-powered-by-000webhost-white2.png"] {
    display: none !important;}

body {
	background:#FFF;
	color:#000;
	font-family:'JF Flat Regular', sans-serif!important;
	font-size:12px;
	font-weight:400;
	line-height:1.8em;
}

a,
a:hover,
a:focus,
a:active { 
	color:#009DD6;
	font-weight:400;
	outline:none !important;
	text-decoration:none;
}

ul,li { 
	list-style:none;
}

iframe { 
	border:0; 
}

hr {
	border-color:#e6e6e6;
	border-width:1px 0 0;
	float:left;
	margin:45px 0 45px 30px;
	width:100%;
}

textarea,
input,
input:hover,
input:focus,
input:active,
input[type="text"], 
input[type="text"]:focus, 
input[type="text"]:hover, 
input[type="text"]:active, 
input[type="email"],
input[type="email"]:focus,
input[type="email"]:hover,
input[type="email"]:active,
button,
button[type="submit"]{
	-webkit-box-shadow: none;
	   -moz-box-shadow: none;
		-ms-box-shadow: none;
		 -o-box-shadow: none;
			box-shadow: none;
	outline:0px !important;
}

#supersized img{
	max-width: none !important;
}

.poster-image {
	background:url('../images/poster-image.jpg');
	background-repeat:no-repeat;
	background-size:cover;
	width:100%;
	height:100%;
	z-index:0 !important;
	backface-visibility:hidden;
	background-position:center center;
}

/* ==================================================================
ANIMATIONS
================================================================== */

.btn {
	-webkit-transition: all 0.35s ease-in-out;
   	   -moz-transition: all 0.35s ease-in-out;
   		 -o-transition: all 0.35s ease-in-out;
   		-ms-transition: all 0.35s ease-in-out;
   			transition: all 0.35s ease-in-out;
   	text-transform: uppercase;
}


.navbar-toggle .icon-bar,
#features .features-wrapper h4,
.spotlight-features li:hover p strong,
.plan:hover,
.button-send,
.mask-overlay,
.footer-content .back-top,
ul.footer-social a {
	-webkit-transition: all 0.35s ease-in-out;
   	   -moz-transition: all 0.35s ease-in-out;
   		 -o-transition: all 0.35s ease-in-out;
   		-ms-transition: all 0.35s ease-in-out;
   			transition: all 0.35s ease-in-out;
}

ul.nav li a::before,
ul.nav li a::after {
	-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
	   -moz-transition: -moz-transform 0.3s, opacity 0.2s;
		 -o-transition: -o-transform 0.3s, opacity 0.2s;
		-ms-transition: -ms-transform 0.3s, opacity 0.2s;
			transition: transform 0.3s, opacity 0.2s;
}

.hi-icon-effect .hi-icon:after {
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	   -moz-transition: -moz-transform 0.2s, opacity 0.3s;
		 -o-transition: -o-transform 0.2s, opacity 0.3s;
		-ms-transition: -ms-transform 0.2s, opacity 0.3s;
			transition: transform 0.2s, opacity 0.3s;
}

.post figure a {
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	   -moz-transition: -moz-transform 0.5s, opacity 0.5s;
		 -o-transition: -o-transform 0.5s, opacity 0.5s;
		-ms-transition: -ms-transform 0.5s, opacity 0.5s;
			transition: transform 0.5s, opacity 0.5s;
}

@-webkit-keyframes spinAround {
	from { -webkit-transform: rotate(0deg) }
	to { -webkit-transform: rotate(360deg); }
}

@-moz-keyframes spinAround {
	from { -moz-transform: rotate(0deg) }
	to { -moz-transform: rotate(360deg); }
}

@-ms-keyframes spinAround {
	from { -moz-transform: rotate(0deg) }
	to { -moz-transform: rotate(360deg); }
}

@-o-keyframes spinAround {
	from { -moz-transform: rotate(0deg) }
	to { -moz-transform: rotate(360deg); }
}

@keyframes spinAround {
	from { transform: rotate(0deg) }
	to { transform: rotate(360deg); }
}

.hi-icon-2-effect .hi-icon-2 {
	-webkit-transition: background 0.2s, color 0.2s;
	   -moz-transition: background 0.2s, color 0.2s;
		 -o-transition: background 0.2s, color 0.2s;
		-ms-transition: background 0.2s, color 0.2s;
			transition: background 0.2s, color 0.2s;
}

/* ==================================================================
TYPOGRAPHY
================================================================== */

p {
	color:#444;
	font-size:14px;
	font-weight:300;
	line-height:2.1em;
	margin:15px 0;
	width:100%!important;
}

em { 
	color:#009DD6;
	font-style:normal;
	font-weight:normal;
}


h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'JF Flat Regular', cursive !important;
  font-weight: normal;
  line-height: 1.1;
  color: inherit;
}

h1 { 
	font-size:38px;
	line-height:1.4em;
	margin-bottom: 0px; 
}

h2 { 
	font-size:24px;
	line-height:1.8em; 
}
h3 { 
	font-size:20px;
	line-height:1.8em;
	margin-bottom: 20px; 
}

h4 { 
	font-size:16px;
	line-height:1em;
}
	


input,
button,
select,
textarea ,
.form-control,
.btn {
	margin: 0px;
	border-radius: 2px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
       -o-user-select: none;
          user-select: none;
}	
.form-control {
	font-family:'JF Flat Regular', sans-serif;height: 46px!important;line-height: 46px;padding: 0 20px;
	border-color: #999; background: none;text-align: right;font-size: 14px;color: #000;float: right;display: block;width: 100%;}
.btn-default{
	font-family:'JF Flat Regular', sans-serif;height: 46px;line-height: 46px;border-color: #009DD6; 
	background: #009DD6;font-size: 14px;padding: 0 25px;color: #fff;text-shadow: none;}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {border-color: #009DD6;background: none;font-size: 14px;color: #000;}

/* ==================================================================
HEADING
================================================================== */
.heading { margin-bottom: 30px;padding: 0px 15px;text-align: center;}
.heading .section-name{font-size:12px;line-height:3em;text-transform: uppercase;color: #777;padding: 0 15px;margin-bottom:25px;}
.heading p {font-size:16px;line-height:2em;}
.heading span.line {margin-top: 10px;display: inline-block;border-bottom: 2px solid #009DD6;width:60px;}

.dark .heading { margin-bottom: 30px;padding: 0px 15px;text-align: center;}
.dark .heading .section-name{font-size:12px;line-height:3em;text-transform: uppercase;color: #eee;padding: 0 15px;margin-bottom:25px;}
.dark .heading h2 {color: #fff}
.dark .heading p {font-size:16px;line-height:2em;color: #eee}
.dark .heading span.line {margin-top: 10px;display: inline-block;border-bottom: 2px solid #009DD6;width:60px;}

/* ==================================================================
FIXED NAVBAR
================================================================== */
nav {
	background: #009DD6;
	border-bottom:0px solid rgba(0, 0, 0, .1) !important;
	height:60px;
	padding:10px 0 20px 0;
	position:fixed;
	z-index:99 !important;
}

ul.nav li {
	border:2px solid rgba(255, 255, 255, 0);
	padding: 7px 10px;
}		

ul.nav li a {
	color:#fafafa;
	font-size:14px;
	font-weight:500;
	padding:0;
	text-transform:uppercase;
}		

ul.nav li a::before,
ul.nav li a::after {
	color:#fafafa;
	display: inline-block;
	opacity: 0;
	font-weight: bold;
	font-size: 21px
}

ul.nav li a::before {
	margin-right: 5px;
	content: '.';
	-webkit-transform: translateX(20px);
	-moz-transform: translateX(20px);
	transform: translateX(20px);
}

ul.nav li a::after {
	margin-left: 5px;
	content: '.';
	-webkit-transform: translateX(-20px);
	-moz-transform: translateX(-20px);
	transform: translateX(-20px);
}

ul.nav li a:hover::before,
ul.nav li a:hover::after,
ul.nav li a:focus::before,
ul.nav li a:focus::after,
ul.nav li.active a::before,
ul.nav li.active a::after {
	color:#fff;
	font-weight:900; 
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	transform: translateX(0px);
}

ul.nav li.active a{
	color:#fff;
	font-weight:900; 
}

ul.nav li a:hover, ul.nav li a:focus  { 
	background:none; 
}		

nav.navbar-fixed-top { 
	top:-57px; 
}

.navbar-header{float:right}
.navbar-toggle {
  position: relative;
  float: left;
  padding: 9px 0px;
  margin-top: 12px;
  margin-left: 5px;
  margin-bottom: 8px;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
}

/* ==================================================================
BRAND - NAVBAR, HOMEPAGE, FOOTER
================================================================== */
nav .logo,
.intro-brand, 
footer .logo { 
	color:#fff;
	font-family: 'JF Flat Regular', cursive;
}

nav .logo { 
	font-size:16px;
	margin: -4px 0px 0px -15px;
	font-weight: bold;
}

.intro span.intro-brand { 
	color:#FFF;
	font-size:38px;
}

footer h1.logo { 
	color:#fff;
	font-size:38px;
	font-weight:400;
	
}



/* ==================================================================
SECTIONS
================================================================== */
section{padding: 100px 0;text-align: center;margin:0;position: relative;float: left;width: 100%}
figure {float: left;width: 100%}
#features {background: #fafafa url(../images/patterns/pattern1.png) repeat;}
#download {	background: rgba(0, 157, 214, 0.8) url(../images/patterns/pattern1.png) repeat;}
#client {	background: rgba(0, 157, 214, 0.8) url(../images/patterns/pattern1.png) repeat;padding: 40px}
#gallery, #contact, footer{background: #fff url(../images/patterns/pattern1.png) repeat;}
#newsletter {background: rgba(255, 255, 255, 0.8) url(../images/patterns/pattern1.png) repeat;}
#prices {background: rgba(255, 255, 255, 0.8) url(../images/patterns/pattern1.png) repeat;}
#spotlight1{background: #fff ;}
	
/* ==================================================================
HOMEPAGE
================================================================== */
.logo{width:100px;margin:0px auto}
#homepage{background: url(../images/patterns/pattern3.png) repeat;position: relative;}
.intro{padding-top: 20px;text-align: center;}
.intro h1,
.intro p {color:#FFF;}
.intro p { 
	line-height: 2.2em;font-size: 13px;
	font-family: "Droid Arabic Kufi",serif;
	margin: 0px;padding: 10px 0px;
}

@media (max-width: 640px) {
.intro h1 {font-size: 24px;line-height: 28px}
}
@media (max-width: 480px) {
.intro h1 {font-size: 20px;line-height: 26px}
}


.scroll-down{
	position: absolute;
	z-index: 100;
	opacity: 0.5;
	left: 50%;
	bottom: 40px;
	margin-left: -20px;
	-webkit-transition: all .35s ease-in-out;
	   -moz-transition: all .35s ease-in-out;
		-ms-transition: all .35s ease-in-out;
		 -o-transition: all .35s ease-in-out;
			transition: all .35s ease-in-out;
}

@keyframes arrows {
	0% { bottom:40px; }
	10% { bottom:50px; }
	20% { bottom:40px; }
	30% { bottom:50px; }
	40% { bottom:30px; }
	50% { bottom:50px; }
	60% { bottom:40px; }
	70% { bottom:50px; }
	80% { bottom:30px; }
	90% { bottom:50px; }
	100% { bottom:40px; }
}

@-webkit-keyframes arrows {
	0% { bottom:40px; }
	10% { bottom:50px; }
	20% { bottom:40px; }
	30% { bottom:50px; }
	40% { bottom:30px; }
	50% { bottom:50px; }
	60% { bottom:40px; }
	70% { bottom:50px; }
	80% { bottom:30px; }
	90% { bottom:50px; }
	100% { bottom:40px; }
}

@-moz-keyframes arrows {
	0% { bottom:40px; }
	10% { bottom:50px; }
	20% { bottom:40px; }
	30% { bottom:50px; }
	40% { bottom:30px; }
	50% { bottom:50px; }
	60% { bottom:40px; }
	70% { bottom:50px; }
	80% { bottom:30px; }
	90% { bottom:50px; }
	100% { bottom:40px; }
}

@-ms-keyframes arrows {
	0% { bottom:40px; }
	10% { bottom:50px; }
	20% { bottom:40px; }
	30% { bottom:50px; }
	40% { bottom:30px; }
	50% { bottom:50px; }
	60% { bottom:40px; }
	70% { bottom:50px; }
	80% { bottom:30px; }
	90% { bottom:50px; }
	100% { bottom:40px; }
}

@-o-keyframes arrows {
	0% { bottom:40px; }
	10% { bottom:50px; }
	20% { bottom:40px; }
	30% { bottom:50px; }
	40% { bottom:30px; }
	50% { bottom:50px; }
	60% { bottom:40px; }
	70% { bottom:50px; }
	80% { bottom:30px; }
	90% { bottom:50px; }
	100% { bottom:40px; }
}

.scroll-down {
	-webkit-animation: arrows 3.8s infinite;
	   -moz-animation: arrows 3.8s infinite;
		-ms-animation: arrows 3.8s infinite;
		 -o-animation: arrows 3.8s infinite;
			animation: arrows 3.8s infinite;
	-webkit-animation-delay: 1s;
	   -moz-animation-delay: 1s;
		-ms-animation-delay: 1s;
		 -o-animation-delay: 1s;
			animation-delay: 1s;
	cursor:pointer;
}

.scroll-down:hover{
	opacity: 1;
}
		

/* ==================================================================
CLIENT
================================================================== */
#client a,
#client img {margin-right: auto!important;margin-left: auto!important}
@media (max-width: 780px) {
	#client img {margin-top: 20px;margin-bottom: 20px}
}
@media (max-width: 640px) {
	#client img {margin-top: 20px;margin-bottom: 20px}
}
@media (max-width: 480px) {
	#client img {margin-top: 20px;margin-bottom: 20px}
}

/* ==================================================================
FEATURES
================================================================== */
#features .features-wrapper { 
	margin-top:60px ;
}

#features .features-desc { 
	margin-bottom:20px 
}

.hi-icon-wrap {
	text-align: center;
	margin: 0 auto;
	margin-bottom: 10px;
}

.hi-icon {
	display: inline-block;
	font-size: 0px;
	margin: 15px 30px;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #4e565c;
}

.hi-icon: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;
}

.hi-icon:before {
	font-family: 'ElegantIcons';
	speak: none;
	font-size: 25px;
	line-height: 60px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased;
}

.hi-icon-effect .hi-icon {
	box-shadow: 0 0 0 1px #4e565c;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect .hi-icon:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #009DD6;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	   -moz-transition: -moz-transform 0.2s, opacity 0.3s;
		 -o-transition: -o-transform 0.2s, opacity 0.3s;
		-ms-transition: -ms-transform 0.2s, opacity 0.3s;
			transition: transform 0.2s, opacity 0.3s;
}

.hi-icon-effectb .hi-icon {
	color: #4e565c;
}

.features-desc:hover .hi-icon {
	color: #fff;
}

.hi-icon-effectb .hi-icon:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}

.features-desc:hover .hi-icon:after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

.features-desc h4 {
	text-transform: none !important;
}

.features-desc:hover h4 {
	color: #009DD6;
}

#features .features-images {
	position: relative;
	display: block;
	margin: 20px 0px;
}

.features-images .feat1 {
	width: 38%;
	margin-left: 40px;
	float: left;
} 

.features-images .feat2 {
	width: 38%;
	margin-right: 40px;
	float: right;
}

.features-images .feat3 {
	position: absolute;
	z-index: 10;
	margin-left: auto;
	margin-right: auto;
	left:0;
	right:0;
	top: -20px;
	width: 40%;
}			
				
/* ==================================================================
SPOTLIGHT 1
================================================================== */
#spotlight1{
	text-align: left;
}
		
.spotlight-link{
	border-color: #009DD6; 
	background: none;
	font-size: 14px;
	padding: 0 25px;
	height: 48px;
	line-height: 46px;
	border-radius: 3px;
	color: #009DD6;
	text-shadow: none;
	margin-top: 20px;
}

.spotlight-link:hover{
	border-color: #009DD6;
	background: #009DD6;
	color: #fff;
}

.spot1-img{
	float: right  ;
	width: 85%;
}

/* ==================================================================
NEWSLETTER
================================================================== */
.success-message{
	clear: both;
	margin-top: 15px;
	color: #009DD6;
	font-weight: 400;
	font-size: 18px;
}

.error-message{
	clear: both;
	margin-top: 25px;
	color: #f32626;
	font-weight: 400;
	font-size: 18px;
}

/* ==================================================================
GALLERY
================================================================== */
a.thumbnail{
	box-shadow: none;
	overflow:hidden;
	float: left;
	padding: 3px;
	border-radius: 3px;
	position: relative;
}

a.thumbnail:hover{
	padding: 3px;
	cursor: url('../images/plus.png'), url('../images/plus.png'), move;
}

a.thumbnail div {
	position: absolute;
	background:rgba(0, 157, 214,0.4);
	width: 100%;
	height: 100%;
	top: 100%;
}

a.thumbnail div span{
	display: block;
	padding: 10px 0;
	color: #fff;
	font-weight: 300;
	font-size: 18px;
	position: absolute;
	top: 30%;
	width: 100%;
}

.gallery-images{
	margin-top: 20px;
}

.thumbnail {width: 100%}

/* ==================================================================
CONTACT
================================================================== */
#messagecontact .input-group {width: 100%;padding: 10px}
#messagecontact .textarea {
	height: 100px!important;
	box-shadow: none;
}

.success-message-2{
	color: #009DD6;
	font-weight: 700;
	font-size: 16px;
}

.error-message-2{
	margin: 15px 0px 0px 10px;
	float: left;
	color: #f32626;
	font-weight: 700;
	font-size: 16px;
}


/* ==================================================================
CLIENT
================================================================== */
@media (max-width: 780px) {
	.client img {margin-top: 20px;margin-bottom: 20px}
}
@media (max-width: 640px) {
	.client img {margin-top: 20px;margin-bottom: 20px}
}
@media (max-width: 480px) {
	.client img {margin-top: 20px;margin-bottom: 20px}
}


/* ==================================================================
PRICES
================================================================== */
.prices-one {padding:50px;margin-top: 40px; background-color: #fff;position: relative;float: left;border:1px solid #ccc}
.prices-one h3 {font-size:32px;font-weight: 100;margin:0 0 15px 0;line-height: 34px}
.prices-one .sub-title {color: #555;font-size: 24px;font-weight: 300;;margin-top: 20px}
.prices-one .sub-title span {color: #666;font-size: 12px;}
.prices-box .content ul {list-style: none;margin:25px 0;color: #666;font-size: 13px;}
.prices-box .content ul li {padding:6px 0;border-top:1px solid #eee;}
.prices-box .content ul li i{font-size:12px;line-height:1em;display: inline-block; }
.prices-box .content ul li p{font-size:13px;padding: 0;margin: 0;display: inline-block;}

.prices-one span.line {
	margin-top: 10px;
	display: inline-block;
	border-bottom: 1px solid #009DD6;
	width:40px;
}

.prices-one.active,
.prices-one:hover{border:1px solid #009AD3;}
.prices-one.active h3,
.prices-one:hover h3  {color: #009AD3;}
@media (max-width: 780px) {
	.prices-one {padding:60px 100px;}
}
@media (max-width: 640px) {
	.prices-one {padding:35px 25px;}
}
@media (max-width: 480px) {
	.prices-one {padding:25px 25px;}
}


/* ==================================================================
DOWNLOAD
================================================================== */
.download-header,
.download-footer,
.download-b,
.download-c,
.download-d {
    list-style: outside none none;
    margin: 0px;
    padding: 0px;
    text-align: center;
}
.download-header li,
.download-footer li,
.download-b li,
.download-c li,
.download-d li {
    display: inline-block;
    margin: 0px 10px 0;
}
.download-header li a,
.download-footer li a,
.download-b li a,
.download-c li a,
.download-d li a {
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: 200px;
    height: 65px;
    border-radius: 3px;
    margin: 0;
    text-indent: -3000em;
    text-align: left;
}

.download-header li.as a {background: url("../images/download-as-c.png") no-repeat scroll -5px -5px rgba(81, 94, 109,0);border: 1px solid rgba(255,255,255,.2);}
.download-header li.gp a {background: url("../images/download-gp-b.png") no-repeat scroll -5px -5px rgba(81, 94, 109,0);border: 1px solid rgba(255,255,255,.2);}
.download-header li.as a:hover {background: url("../images/download-as-d.png") no-repeat scroll -5px -5px #009AD3;}
.download-header li.gp a:hover {background: url("../images/download-gp-d.png") no-repeat scroll -5px -5px #009AD3;}

.download-footer li.as a {background: url("../images/download-as-c.png") no-repeat scroll -5px -5px rgba(81, 94, 109,0);border: 1px solid rgba(255,255,255,.2);}
.download-footer li.gp a {background: url("../images/download-gp-b.png") no-repeat scroll -5px -5px rgba(81, 94, 109,0);border: 1px solid rgba(255,255,255,.2);}
.download-footer li.as a:hover {background: url("../images/download-as-d.png") no-repeat scroll -5px -5px #009AD3;}
.download-footer li.gp a:hover {background: url("../images/download-gp-d.png") no-repeat scroll -5px -5px #009AD3;}

.download-b li.as a {background: url("../images/download-as-a.png") no-repeat scroll -5px -5px #FFF;}
.download-b li.gp a {background: url("../images/download-gp-a.png") no-repeat scroll -5px -5px #FFF;}
.download-b li.as a:hover {background: url("../images/download-as-c.png") no-repeat scroll -5px -5px #222;}
.download-b li.gp a:hover {background: url("../images/download-gp-b.png") no-repeat scroll -5px -5px #222;}

.download-c li.as a {background: url("../images/download-as-d.png") no-repeat scroll -5px -5px rgba(0,0,0,0.9);}
.download-c li.gp a {background: url("../images/download-gp-d.png") no-repeat scroll -5px -5px rgba(0,0,0,0.9);}
.download-c li.as a:hover {background: url("../images/download-as-c.png") no-repeat scroll -5px -5px rgba(0,0,0,0.9);}
.download-c li.gp a:hover {background: url("../images/download-gp-b.png") no-repeat scroll -5px -5px rgba(0,0,0,0.9);}

.download-d li.as a {background: url("../images/download-as-d.png") no-repeat scroll -5px -5px #009AD3;}
.download-d li.gp a {background: url("../images/download-gp-d.png") no-repeat scroll -5px -5px #009AD3;}
.download-d li.as a:hover {background: url("../images/download-as-c.png") no-repeat scroll -5px -5px #009AD3;}
.download-d li.gp a:hover {background: url("../images/download-gp-b.png") no-repeat scroll -5px -5px #009AD3;}

@media (max-width: 640px) {
.download-header li a,
.download-footer li a,
.download-b li a,
.download-c li a,
.download-d li a {
    width: 100px;
    height: 33px;
    background-size:110px 40px!important
}
}
@media (max-width: 480px) {
.download-header li a,
.download-footer li a,
.download-b li a,
.download-c li a,
.download-d li a {
    width: 100px;
    height: 33px;
    background-size:110px 40px!important
}
}
@media (max-width: 380px) {
.download-header li a,
.download-footer li a,
.download-b li a,
.download-c li a,
.download-d li a {
    width: 100px;
    height: 33px;
    background-size:110px 40px!important
}
}

/* ==================================================================
FOOTER
================================================================== */
footer { 
	padding: 0px;
	text-align: center;
	float: left;
	width: 100%
}

.footer-content hr{
	border-color: #eee;
	padding: 0px;
	margin: 0px;
}

.footer-content .back-top{
	color: #ccc;
	background-color: #fff;
	font-size: 30px;
	position: absolute;
	z-index: 10;
	top: -20px;
	left: 50%;
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 3px;
	margin-left: -20px;
	padding: 4px;
}

.footer-content .back-top:hover{
	background-color: #009DD6;
}

footer p { 
	font-size:12px;
	line-height:1.2857em;
	margin:80px 0 60px 0;
}

footer p a span { 
	margin-left:10px; 
}

ul.footer-social { 
	margin:30px auto 50px auto;
}

ul.footer-social li{
	display: inline-block;
}

ul.footer-social a { 
	display: inline-block;
	width: 48px;
	height: 48px;
	line-height: 48px;
	text-align: center;
	background: none;
	color:rgba(78, 101, 108, 0.5);
	font-size: 18px;
	font-family: 'ElegantIcons';
	float: left;
	border-radius: 2px;
	margin:0px 4px
}

ul.footer-social a:hover { 
	color:rgba(255, 255, 255, 0.9);
}

ul.footer-social a.facebook:hover { 
	background: #3b5998;
}

ul.footer-social a.twitter:hover { 
	background: #00aced;
}

ul.footer-social a.skype:hover { 
	background: #2aa4e9;
}

ul.footer-social a.linkedin:hover { 
	background: #007bb6;
}

ul.footer-social a.pinterest:hover { 
	background: #cb2027;
}

ul.footer-social a.googleplus:hover { 
	background: #dd4b39;
}

ul.footer-social a.dribbble:hover { 
	background: #ec4a89;
}

ul.footer-social a.vimeo:hover { 
	background: #aad450;
}


/* ==================================================================
MEDIA QUERIES - RESPONSIVE FEATURES
================================================================== */

@media (max-width: 1024px) {
	h1 { 
		font-size:45px;
		line-height:1.2em;
	}
	h2 { 
		font-size:25px;
		line-height:1.1em; 
	}
	h3 { 
		font-size:23px;
		line-height:1.2em;
	}
	h4 { 
		font-size:15px;
	}
	p{
		font-size: 13px;
	}
	section{
		padding: 60px 0;
	}
	#features .features-wrapper{
		margin-top: 0px;
	}
	.post .thumbnail{
		max-width: none;
		margin-right: 30px;
	}
}

@media (max-width: 768px) {
	header{
		text-align: center;
	}
	nav .logo{
		font-size: 16px;
	}
	ul.nav li {
		padding: 7px 3px;
	}		
	ul.nav li a {
		font-size:11px;
	}
	h1 { 
		font-size:35px;
	}
	h2 { 
		font-size:22px;
	}
	h3 { 
		font-size:20px;
		line-height:1.2em;
	}
	h4 { 
		font-size:15px;
	}
	p{
		font-size: 13px;
	}
	.heading .section-name{
		font-size: 11px;
	}
	.heading p{
		font-size: 15px;
	}
	.intro{
		padding-top: 0px;
	}
	.mockup-slider{
		width: 70%;
		margin: 0 auto;
	}
	.features-images .feat3{
		width: 57%;
	}
	.spot1-img{
		width: 100%;
	}
	.subs-submit{
		width: 100%;
		margin-top: 10px;
		float: left;
	}
	.subscribe{
		height: 110px;
	}
	.success-message, .error-message{
		font-size: 15px;
	}
	#spotlight2{
		height: 520px;
	}
	.spot2-img{
		width: 100%;
	}
	.spotlight-link {
		font-size: 12px;
		margin-top: 5px;
	}
	.plan{
		margin-bottom: 25px;
	}
	.circle-price{
		width: 100px;
		height: 100px;
		font-size: 20px;
		line-height: 100px;
	}
	.post .thumbnail{
		margin-right: 0px;
	}
	.post{
		text-align: center;
	}
	a.more{
		float: none;
	}
	a.more-posts{
		font-size: 15px;
	}
	#contactform{
		padding-bottom: 20px;
	}
	#contactform input{
		margin-top: 15px;
	}
	.send-div{
		clear: both;
	}
	.button-send{
		font-size: 12px;
		float: none;
		width: 100%;
	}
	.error-message-2{
		float: none;
	}
	.error-message-2, .success-message-2{
		font-size: 15px;
	}
	.thumbnail > img{
		width: 100%;
	}
}

@media (max-width: 480px) {
	.navbar-toggle .icon-bar{
		background-color: #fff;
	}
	
	.navbar-toggle:hover .icon-bar{
		background-color: #fff;
	}
	.icon-bar{color:#fff!important}
	
	button {color:#fff!important}
	.navbar-header{
		width: 100%;
		padding:0px 15px 0px 0px;
		margin: 0px;
	}

	.navbar-brand{float:right!important;}
	.navbar-toggle{float:left!important;color:#fff!important;
			padding:0px;
	}
	.navbar-nav{
		width: 100%;
		padding:0px;
		margin: 0px;
	}
	

	.navbar .container{
		width: 100%;
		padding:0px;
		margin: 0px;
	}
	.container > .navbar-collapse{
		border-top: 1px solid #009DD6;
		background: #009DD6;
		width: 100%;
		padding:0px;
		margin: 0px;
	}
	
	.container > .navbar-collapse ul.nav li{
		border-bottom: 1px solid #008CC0;
		padding:10px;
		margin: 0px;
		text-align: center;
	}
	ul.nav li a {font-size: 13px!important;}
	section{
		padding: 50px 0;
	}
	nav .logo{
		font-size: 16px;
	}
	h1 { 
		font-size:27px;
	}
	h2 { 
		font-size:22px;
	}
	h3 { 
		font-size:17px;
	}
	h4 { 
		font-size:13px;
	}
	p{
		font-size: 12px;
	}
	.intro .btn-lg{
		font-size: 12px;
		margin: 10px 0;
	}
	.features-images .feat3{
		width: 50%;
		position: relative;
		margin-top: 50px;
	}
	#features .features-desc{
		margin-bottom: 0px;
	}
	.hi-icon {
		margin: 15px 30px;
		width: 50px;
		height: 50px;	
	}
	.hi-icon:before {
		font-size: 20px;
		line-height: 50px;
	}
	#spotlight1, #spotlight2{
		height: auto;
		text-align: center;
	}
	#spotlight1 figure{
		margin-top: 30px;
	}
	.spotlight-features li{
		text-align: left;
	}
	.hi-icon-2{
		width: 40px;
		height: 40px;
	}
	.hi-icon-2:before {
		font-size: 20px;
		line-height: 40px;
	}
	.hi-icon-2-wrap{
		padding-top: 10px;
	}
	a.thumbnail div span{
		font-size: 15px;
	}
	#testimonials-slides .testimonial-icon{
	    margin: 0px;
	}
	.post{
		margin-bottom: 20px;
	}
	.post .thumbnail{
		float: none;
	}
	a.more{
		margin-top: 5px;
	}
	a.more-posts{
		margin-top: 20px;
	}
	.icon-twitter{
		margin: 12px 20px 0px 0px;
		font-size: 30px;
	}
	ul.list-tweets {
		height: 50px;
	}
	.footer-content h1{
		padding-top: 60px;
	}
	footer h1.logo{
		font-size: 30px;
	}
	footer p{
		font-size: 12px;
	}
	ul.footer-social a{
		padding: 10px;
	}
}


@media (max-width: 340px) {
	h3 { 
		font-size:15px;
		line-height:1.3em;
	}
	#comments .heading{
		margin-bottom: 15px
	}
}