/*
	Author: Umair Chaudary @ Pixel Art Inc.
	Author URI: http://www.pixelartinc.com/
*/


/****************************************************************************
TABLE OF CONTENTS

	01. CSS RESET
	02. BASIC STYLES
	03. HEADER
	04. SLIDER
	05. BUTTON
	06. PORTFOLIO
	07. ABOUT
	08. CONTACT
	09. FOOTER
	10. ISOTOPE

****************************************************************************/


/****************************************************************************
CSS RESET
****************************************************************************/

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, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio,
video {	margin: 0; 	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table {	border-collapse: collapse; border-spacing: 0; }




/****************************************************************************
BASIC STYLES
****************************************************************************/

body {
	border: 15px solid #ffffff;
	background: #fff;
	color: #000;
	font: 14px Arial, Helvetica, sans-serif;
}

a { color: #00e; text-decoration: none; }
a:visited { /*color: #551a8b;*/ }
a:hover { /*color: #06e;text-decoration: underline; */}
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

h1, h2, h3, h4, h5, h6 { font: bold 14px Arial, Helvetica, sans-serif; color: #000; }
h1 { font:700 74px 'Open Sans', sans-serif; color: #ffffff }
h1 a { color: #000; }
h2 { font:300 50px 'Open Sans', sans-serif; color: #ffffff; }
h2 a { color: #000; }
h3 { font:700 22px 'Open Sans', sans-serif; color: #ffffff; }
h3 a { color: #000; }
h4 { font:20px Helvetica, Arial, sans-serif; }
h4 a { color: #000; }
h5 { font:700 20px 'Open Sans', sans-serif; color: #ffffff; }
h5 a { color: #ffffff; }
h6 { font-size: 10px; }
h6 a { color: #000; }

p strong { font-weight: bold; }
p em { font-style: italic; }
p {font:20px 'Open Sans', sans-serif; color: #656872; line-height: 35px;}

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }


.spinner{ border-right: 15px solid #fff; position:fixed; z-index:99999; background:url(images/loader.gif) 50% 50% no-repeat #000000; width: 100%; width: calc(100% - 30px); width: -webkit-calc(100% - 30px); width: -moz-calc(100% - 30px); width: -o-calc(100% - 30px); height:100%; top:0; left:15px;}

/****************************************************************************
    *-*-*-* HEADER *-*-*-*
****************************************************************************/

.topline, .bottomline {width: 100%;height: 15px;background: #ffffff;position: fixed;left: 0px;z-index: 99999;}
.topline {top: 0px;}
.bottomline {bottom: 0px;}

.header_top { overflow: hidden; height: 100%; width: 100%; position: relative; background: fixed url("images/header-img.png") no-repeat; }
.header_top > img { display: block; visibility: hidden; }
.header_overlay { background: url("images/header-bg.png") repeat; text-align: center; height: 100%; position: absolute; top:0px; left: 0px; width: 100%; }
.header_overlay p { color: #ffffff; line-height:28px; background: url("images/header-line.png") center bottom no-repeat; margin-bottom:15px; padding-bottom: 15px;  }
.header_overlay .bottom-arrow {
    position: absolute;
    left: 50%;
    bottom: 88px;
    margin-left: -36px;
    width: 72px;
    height: 72px;
    z-index: 100;
    opacity: 1;
    cursor: pointer;
    display: inline-block;
    background: url("images/bottom-arrow.png") no-repeat;
    background-position: 0 0px;
    filter: alpha(opacity=100);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    transition: opacity 0.35s;
    -webkit-transition: opacity 0.35s;
    -moz-transition: opacity 0.35s;
    -o-transition: opacity 0.35s;
    -ms-transition: opacity 0.35s;
    animation: swing 1s 1s ease-in-out infinite;
    -webkit-animation: swing 1s 1s ease-in-out infinite;
    -moz-animation: swing 1s 1s ease-in-out infinite;
    -ms-animation: swing 1s 1s ease-in-out infinite;
    -o-animation: swing 1s 1s ease-in-out infinite;
}
.header_overlay .bottom-arrow.hide {
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
@keyframes swing {
    0% {
        transform: translate(0, -10px);
    }
    50% {
        transform: translate(0, 10px);
    }
    100% {
        transform: translate(0, -10px);
    }
}

@-webkit-keyframes swing {
    0% {
        -webkit-transform: translate(0, -10px);
    }
    50% {
        -webkit-transform: translate(0, 10px);
    }
    100% {
        -webkit-transform: translate(0, -10px);
    }
}

@-moz-keyframes swing {
    0% {
        -moz-transform: translate(0, -10px);
    }
    50% {
        -moz-transform: translate(0, 10px);
    }
    100% {
        -moz-transform: translate(0, -10px);
    }
}

@-o-keyframes swing {
    0% {
        -o-transform: translate(0, -10px);
    }
    50% {
        -o-transform: translate(0, 10px);
    }
    100% {
        -o-transform: translate(0, -10px);
    }
}

@-ms-keyframes swing {
    0% {
        -ms-transform: translate(0, -10px);
    }
    50% {
        -ms-transform: translate(0, 10px);
    }
    100% {
        -ms-transform: translate(0, -10px);
    }
}

.social_icon {z-index: 999; position: relative; margin-top: 30px}
.social_icon a { width: 54px; height: 49px; display: inline-block; }
.social_icon a.fbk{ background: url("images/header-fb.png") no-repeat; background-position: 0 0px;}
.social_icon a.bal{background: url("images/header-bal.png") no-repeat; background-position: 0px 0px;}
.social_icon a.in{background: url("images/header-in.png") no-repeat; background-position: 0px 0px;}
.social_icon a.twt{background: url("images/header-twt.png") no-repeat; background-position: 0px 0px;}
.social_icon a.google{background: url("images/header-google.png") no-repeat; background-position: 0px 0px;}

.header_two.header_top {background: fixed url("images/header-img2.png") no-repeat;}
.header_two.header_top .big-btn { margin-left: 17px; margin-bottom:10px; }
.header_two.header_top .black { padding:14px 37px; }
.header_two.header_top h1 {font-weight: 300; }
.header_two.header_top p {  background:none;  }
.header_two.header_top .header_overlay { height: 100%; background: url("images/header-bg2.png") repeat !important;}

header { background: #0e0f16; line-height: 68px; width: 100%; z-index: 999; }
#header-sticky-wrapper { height: auto !important; }
.logo { float: left;width:300px; margin-left: 35px; margin-bottom:35px; }
.logo a img { vertical-align: middle; }

header nav { width: 700px; float: right; margin-right: 35px; }
header nav ul { float: right; }
header nav li { float: left; margin-left: 40px; }
nav li a { display: inline-block;font: 600 15px 'Open Sans', sans-serif; color: #656872; -webkit-transition: color 0.5s; -moz-transition: color 0.5s; -o-transition: color 0.5s; -ms-transition: color 0.5s; transition: color 0.5s; }
nav li a:hover { color: #ffffff }


/****************************************************************************
    *-*-*-* SLIDER *-*-*-*
****************************************************************************/
.overlay-slides { margin: 0 auto; height: 50%;width: 965px;}
.overlay-slides .slide {width: 965px; height: 100%; top:50% !important; }
.ie8 .overlay-slides .slide { background: none !important; }
.overlay-slides .slide img { width: 100%; margin: -50px 0px 0px -150px;  }

.header_two.header_top .overlay-slides {  height: 100% !important; }
.header_two.header_top .overlay-slides .slide {width: 965px; height: 100%; top:25% !important; }
.header_two.header_top .header_overlay > img  {position: absolute; bottom: -532px;right: 50%; margin-right: -580px;}


/****************************************************************************
    *-*-*-* BUTTON *-*-*-*
****************************************************************************/
a.btn { background: #f65142; padding: 5px 14px 7px 14px; display: inline-block; border-radius: 15px; behavior: url(js/PIE/PIE.htc); color: #ffffff;font:700 15px  Helvetica, Arial, sans-serif;-webkit-transition: background-color 0.5s; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -ms-transition: background-color 0.5s; transition: background-color 0.5s;}
.ie8 a.btn { display: block; position: relative; }
a.btn:hover { background: #d74b40;}

.big-btn {font:700 15px Helvetica, Arial, sans-serif; padding: 14px 50px; position: relative; behavior: url(js/PIE/PIE.htc); border-radius: 3px;  color: #ffffff;display: inline-block;background: #f65142 none;-webkit-transition: background-color 0.5s; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -ms-transition: background-color 0.5s; transition: background-color 0.5s;}
.big-btn:hover { background: #d74b40 none;}

.black {background: #28282e; border: 1px solid #b4b4b6;-webkit-transition: border-color 0.5s; -moz-transition: border-color 0.5s; -o-transition: border-color 0.5s; -ms-transition: border-color 0.5s; transition: border-color 0.5s; }
.black:hover {background: #28292e; border: 1px solid #ffffff;}


/****************************************************************************
    *-*-*-* PORTFOLIO *-*-*-*
****************************************************************************/
.portfolio-wrap {background: #004b76; text-align:center; padding-top:100px;}
.portfolio-wrap div p a { color: #fd347f; }
.portfolio-wrap div p a:hover { text-decoration: underline; }
.portfolio-wrap div p { margin-bottom: 78px; text-transform: uppercase; }
.portfolio-wrap div h2 {
	padding-bottom: 3px;
	margin-bottom: 13px;
	text-align:left;
	
}

.portfolio-nav ul { margin-bottom: 74px;  text-align:left; }
.portfolio-nav li { display: inline-block; margin-left: 10px;}
.portfolio-nav li a { background: #242630 !important; padding: 5px 14px; color: #ffffff;font:700 15px Helvetica, Arial, sans-serif;-webkit-transition: background-color 0.5s; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -ms-transition: background-color 0.5s; transition: background-color 0.5s; display: inline-block; border-radius: 15px; behavior: url(js/PIE/PIE.htc); }
.ie8 .portfolio-nav li a { position: relative; z-index: 0; }
.portfolio-nav li a:hover, .portfolio-nav li a.selected { background: #f65142 !important; }

.portfolio_item { width: 965px; margin: 0 auto; overflow: visible !important; }

.portfolio_item > div { position: relative; margin:0px 30px 57px 30px; cursor: pointer; }
.portfolio_item > div > a { display:inline-block; width: 260px; height: 260px; overflow: hidden; behavior: url(js/PIE/PIE.htc); border-radius: 50%; }
.ie8 .portfolio_item > div > a { position: relative; z-index:0;}

.portfolio_item .e1 { background: url(images/curso1.png) no-repeat !important; }
.portfolio_item .e2 { background: url(images/curso2.png) no-repeat !important; }
.portfolio_item .e3 { background: url(images/curso3.png) no-repeat !important; }
.portfolio_item .e4 { background: url(images/curso4.png) no-repeat !important; }
.portfolio_item .e5 { background: url(images/curso5.png) no-repeat !important; }
.portfolio_item .e6 { background: url(images/curso6.png) no-repeat !important; }
.portfolio_item .e7 { background: url(images/servico1.png) no-repeat !important; }
.portfolio_item .e8 { background: url(images/servico2.png) no-repeat !important; }
.portfolio_item .e9 { background: url(images/servico3.png) no-repeat !important; }
.portfolio_item .e10 { background: url(images/servico4.png) no-repeat !important; }

.portfolio_item .overlay { display: none; position: absolute; top: 0px; left: 0px; background:rgba(212,72,60,0.9); width: 260px; height: 260px; behavior: url(js/PIE/PIE.htc); border-radius: 50%; }
.ie8 .portfolio_item .overlay { background:rgb(212,72,60); }
.portfolio_item .overlay .zoom {background: url("images/zoom-btn.png") no-repeat; width: 70px; height: 70px;display: inline-block; margin-top: 54px; margin-bottom: 20px;}
.portfolio_item .overlay h5 {margin-bottom: 10px;}
.portfolio_item .overlay strong {font:13px 'Open Sans' sans-serif; color: #ffffff;}

.portfolio_detail { background: #1c1f28; padding: 48px 0px; position: relative; display: none; margin-bottom: 20px; }

.portfolio_detail figure { width: 40%; float: left;  margin-left: 48px;}
.portfolio_detail figure img { width: 100%; }

.portfolio_detail .detail { width: 50%; float: right; text-align: left; margin-right: 48px; }
.portfolio_detail .detail h3 {font:300 50px 'Open Sans', sans-serif; color: #ffffff; background: url("images/line.png") left bottom no-repeat;padding-bottom: 3px; margin-bottom: 13px;}
.portfolio_detail .detail p { font-size: 18px; line-height: 22px; text-transform: none; margin-bottom: 34px; color: #8e96a0; }

.portfolio_detail .detail ul { margin-bottom: 45px; }
.portfolio_detail .detail li  { color: #8e96a0; margin-bottom: 4px;font:15px 'Open Sans' sans-serif; }
.portfolio_detail .detail li span { color: #ffffff; font:700 15px 'Open Sans' sans-serif;}

.portfolio_detail .close { position: absolute; right: 30px; top: 32px; width: 26px; height: 26px; display: block; background: url("images/close.png") no-repeat; }


/****************************************************************************
    *-*-*-* ABOUT *-*-*-*
****************************************************************************/
.about-wrap {background: #181b23; text-align: center; padding: 100px 0px;  }
.about-wrap div p a { color: #ef4a4a; }
.about-wrap div p a:hover { text-decoration: underline; }
.about-wrap div p { margin-bottom: 10px;}
.about-wrap div h2 {  padding-bottom: 3px; margin-bottom: 13px; background: url("images/line.png") center bottom no-repeat; }

.about { text-align: center }
.about li { display: inline-block; margin:0px 30px 57px 30px; position: relative;  }
.about li figure { margin-bottom: 30px; width: 171px; height: 171px; cursor: pointer; }
.about li figure a { position: relative; behavior: url(js/PIE/PIE.htc); border-radius: 50%; overflow: hidden; display: block; width: 171px; height: 171px; }
.about li figure:hover a { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1) !important; }

.about li figure a.t1 { background: url(images/team-img1.png) no-repeat; background-size: 100% 100%; }
.about li figure a.t2 { background: url(images/team-img2.png) no-repeat; background-size: 100% 100%; }
.about li figure a.t3 { background: url(images/team-img3.png) no-repeat; background-size: 100% 100%; }
.about li figure a.t4 { background: url(images/team-img4.png) no-repeat; background-size: 100% 100%; }

.about li h3 { padding-bottom: 4px; margin-bottom: 13px; background: url("images/line2.png") center bottom no-repeat;}
.about li a.btn { margin-bottom: 20px; }

.about li .overlay { behavior: url(js/PIE/PIE.htc); border-radius: 50%; overflow: hidden; display: none;  position: absolute; top: 0px; left: 0px; width: 171px; height: 140px; background:rgba(226,71,72,0.8); text-align: center; padding-top: 30px; }
.ie8 .about li .overlay { background:rgb(226,71,72); }
.about li .blue .overlay { background:rgba(24,189,221,0.8);}
.ie8 .about li .blue .overlay { background: rgb(24,189,221); }
.about li .yellow .overlay { background:rgba(250,174,53,0.8); }
.ie8 .about li .yellow .overlay { background:rgb(250,174,53); }
.about li .pink .overlay { background:rgba(233,65,124,0.8); }
.ie8 .about li .pink .overlay { background:rgb(233,65,124); }

.about li .overlay a { width: 16px; height: 15px; margin-bottom: 10px; display: inline-block; background: transparent url("images/heart.png") no-repeat; }
.about li .overlay p { font:16px 'Open Sans' sans-serif;line-height: 26px; color: #ffffff; }

.social a { width: 28px; height: 27px; display: inline-block; }
.social a.fbk{ background: url("images/fbk.png") no-repeat; background-position: 0 0px;}
.social a.bal{background: url("images/bal.png") no-repeat; background-position: 0px 0px;}
.social a.in{background: url("images/in.png") no-repeat; background-position: 0px 0px;}
.social a.twt{background: url("images/twt.png") no-repeat; background-position: 0px 0px;}
.social a.google{background: url("images/google.png") no-repeat; background-position: 0px 0px;}


/****************************************************************************
    *-*-*-* CONTACT *-*-*-*
****************************************************************************/
.contact-wrap {background: #801317; text-align: center; padding: 100px 0px;  }
.contact-wrap div p a { color: #ef4a4a; }
.contact-wrap > div > p { margin-bottom: 78px; text-transform: uppercase;}
.contact-wrap div h2 {  padding-bottom: 3px; margin-bottom: 13px; background: url("images/line.png") center bottom no-repeat; }

.contact_form { width: 460px; display: inline-block;  margin-right: 70px; }
form input[type='text'] { outline: none; background: url("images/star.png") 95% center no-repeat;font:700 15px Helvetica, Arial, sans-serif; border:1px solid #394148; height: 36px; padding:0px 15px; width: 426px; margin-bottom: 19px; color: #8e96a0; }

form select[name='jumpMenu'] { outline: none; background: url("images/star.png") 20% center no-repeat;font:700 15px Helvetica, Arial, sans-serif; border:1px solid #394148; height: 36px; padding:0px 15px; width: 460px; margin-bottom: 19px; color: #8e96a0; }


form textarea { outline: none;font:700 15px Helvetica, Arial, sans-serif;  border:1px solid #394148; height: 191px; padding:15px; background: none; width: 426px; resize: none; margin-bottom: 19px; color: #8e96a0; }
form input[type='submit'] { cursor: pointer; font:700 15px  Helvetica, Arial, sans-serif; color: #ffffff;border: 0px; display: block; width: 459px; padding: 8px 0px; text-align: center; background: #f65142; -webkit-transition: background-color 0.5s; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -ms-transition: background-color 0.5s; transition: background-color 0.5s; position: relative; behavior: url(js/PIE/PIE.htc); border-radius: 15px; }
form input[type='submit']:hover { background: #d74b40; }
form p { font:15px Helvetica, Arial, sans-serif; margin-bottom: 21px; background: url("images/star.png") 21px center no-repeat; }

.contact_detail { width: 321px; display: inline-block; vertical-align: top; text-align: left;}
.contact_detail h4 {color:#f65142; margin-bottom: 20px; }
.contact_detail p { font:15px Helvetica, Arial, sans-serif; color: #8e96a0; line-height: 24px; }
.contact_detail p span { font-weight: 700;  color: #ffffff}
.contact_detail .social {  margin-top: 20px;}
.contact_detail .social p { font:700 15px Helvetica, Arial, sans-serif;  color: #ffffff; margin-bottom: 10px;}


/****************************************************************************
    *-*-*-* FOOTER *-*-*-*
****************************************************************************/
footer { border-top:1px solid #394148; background: #1c1f28; text-align: center;padding: 70px 0px; }
footer p span { font-weight: 700; display: block;  }
footer p {font:15px Helvetica, Arial, sans-serif; background: url("images/footer-twtr.png") left bottom no-repeat;padding-left: 85px; display: inline-block;line-height: 28px;}
footer p a { color: #ef4a4a;}
footer p a:hover { text-decoration: underline; }

.footer_bottom {  background: #14161e; text-align: center; line-height: 86px;}
.footer_bottom p {display: inline-block; margin-right: 100px;font:15px Helvetica, Arial, sans-serif;}
.footer_bottom p a{ color: #ef4a4a;}
.footer_bottom p a:hover { text-decoration: underline; }
.footer_bottom p span { width: 10px; height: 9px; display: inline-block; background: url("images/small-heart.png") center no-repeat; }

.footer_bottom nav { display: inline-block; margin-left: 100px; }
.footer_bottom nav li { display: inline-block; margin-left: 40px; }
.footer_bottom nav li a { font:15px  Helvetica, Arial, sans-serif; display: inline-block; }


/******************************
   Isotope CSS3 transitions
******************************/
.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property:    -moz-transform, opacity;
    -o-transition-property:         top, left, opacity;
    transition-property:         transform, opacity;
}
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}