/****************************************************************************
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; }


/****************************************************************************
FONTS
****************************************************************************/

font-face {
    font-family: 'helvetica_neueregular';
    src: url('../fonts/helvetica-neue1-webfont.eot');
    src: url('../fonts/helvetica-neue1-webfontd41d.eot?#iefix') format('embedded-opentype'),
    url('../fonts/helvetica-neue1-webfont.woff') format('woff'),
    url('../fonts/helvetica-neue1-webfont.ttf') format('truetype'),
    url('../fonts/helvetica-neue1-webfont.svg#helvetica_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

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

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

a { color: #000; text-decoration: none; }
a:visited {}
a:hover {  }
a:focus { outline: thin dotted; }
a:hover, a:active { color: #000 }

h1, h2, h3, h4, h5, h6 { font: bold 14px Arial, Helvetica, sans-serif; color: #000; }
h1 {font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-weight: 800; font-size: 40px; line-height: 46px; color: #ffffff;}
h1 a { color: #000; }
h2 {font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-weight: 700; font-size: 22px; color: #ffffff;}
h2 a {  }
h3 { font-size: 20px; font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-weight: 600;  color: #ffffff; display: inline-block;}
h3 a {  }
h4 {font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-size: 15px; color: #ffffff; display: inline-block;}
h4 a { color: #00f; }
h5 { font-size: 12px; }
h5 a { color: #000; }
h6 { font-size: 10px; }
h6 a { color: #000; }

ul {}
ul li []
ul li a {}
ol {}
ol li {}
ol li a {}

p {font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif' !important;  font-size: 15px; color: #ffffff; }
p strong { font-weight: bold; }
em {font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-size: 22px; font-weight: 800; color: #29333e; }

blockquote {}
blockquote p {}

::-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; }


/****************************************************************************
Header
****************************************************************************/
header{background: url('../images/header-bg.png') center top no-repeat; /*background-size: cover;*/ padding-top: 340px; padding-bottom: 145px; margin-bottom: 0px; position: relative;}
.logo{font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-weight: 800; font-size: 30px; color: #ffffff; padding-left: 30px; background: url("../images/logo-icon.png") left center no-repeat; float: left;}
header span{height: 1px; margin-top: 20px; background: #34363a; width: 80%; float: right;}

header .menu ul{text-align: center;}
header .menu .first-row{margin-bottom: -70px; padding-top: 105px;}
header .menu .second-row{margin-bottom: -85px;}
header .menu li{display: inline-block;}
/*header .buttons{ text-align: center; overflow: hidden; padding: 5px; margin-right: -5px; background:url('../images/btn-hover.png') center top no-repeat;-webkit-transition: background 0.4s ease-in-out;-moz-transition: 0.4s ease-in-out;  -ms-transition:  0.4s ease-in-out; -o-transition:  0.4s ease-in-out; transition:  0.4s ease-in-out}*/

header .service-btn-hover:hover {background:url('../images/1-1.png') center top no-repeat;}
header .about-btn-hover:hover {background:url('../images/2-2.png') center top no-repeat; }
header .portfolio-btn-hover:hover {background:url('../images/about-btn-hover.png') center top no-repeat;}
header .lab-btn-hover:hover {background:url('../images/3-3.png') center top no-repeat;}
header .news-btn-hover:hover {background:url('../images/4-4.png') center top no-repeat;}
header .contact-btn-hover:hover {background:url('../images/about-btn-hover.png') center top no-repeat;}

header .menu a{width: 195px; height:222px; text-align: center; display: block; float: left;}
header .menu a div{padding-top: 70px;}

header .service-btn{background:url('../images/1.png') center top no-repeat;}
header .service-btn:hover{background:url('../images/1-1.png') center top no-repeat;}
header .service-btn b{/*background:url('../images/setting-icon.png') center top no-repeat;*/}

header .menu .about-btn{background:url('../images/2.png') center top no-repeat;}
header .menu .about-btn:hover{background:url('../images/2-2.png') center top no-repeat;}
header .menu .about-btn b{/*background:url('../images/bubble-icon.png') center top no-repeat;*/}

header .menu .portfolio-btn{background:url('../images/3.png') center top no-repeat; }
header .menu .portfolio-btn:hover{background:url('../images/3-3.png') center top no-repeat; }
header .menu .portfolio-btn b{/*background:url('../images/camera-icon.png') center top no-repeat;*/}

header .menu .lab-btn{background:url('../images/4.png') center top no-repeat; }
header .menu .lab-btn:hover{background:url('../images/4-4.png') center top no-repeat; }
header .menu .lab-btn b{/*background:url('../images/lab-icon.png') center top no-repeat;*/}

header .menu .news-btn{background:url('../images/about-btn-bg.png') center top no-repeat;}
header .menu .news-btn b{/*background:url('../images/pencil-icon.png') center top no-repeat;*/}

header .menu .contact-btn{background:url('../images/about-btn-bg.png') center top no-repeat;}
header .menu .contact-btn b{/*background:url('../images/paperplane-icon.png') center top no-repeat;*/}

header .menu a b{font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif'; font-size: 25px; padding-top: 28px; display: inline-block;}

.home-slider{background:url('../images/home-slider-bg.png') center top no-repeat; padding: 200px 0 125px 0; background-size: cover; text-align: center; position: relative; margin-bottom: -55px;}
.home-slider strong{font-family: "Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif"; font-weight: 800; font-size: 80px; color: #ffffff;}
.home-slider .pager_three{margin: 125px 0 0 0;}
.home-slider p{font-family: "Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif"; font-size: 20px; color: #8e96a0; margin-bottom: 45px; padding: 0 100px;}
.home-slider .hire-us{ font-family: "Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif";  font-size: 15px; font-weight: 700; color: #8e96a0; padding: 13px 80px; border: 2px solid #45484d; border-radius:50px;  display: inline-block;  -moz-transition: 0.5s; -o-transition: 0.5s; -ms-transition: 0.5s; transition: 0.5s;}
.home-slider .hire-us:hover{color: #ffffff; border-color: #e1483a;}

/****************************************************************************
Services
****************************************************************************/
.services{background: #e1483a; padding-top: 130px; text-align: center;}
.heading h1{padding-bottom: 35px; border-bottom:1px solid #e56357; margin-bottom: 25px; position: relative; text-align: center;}
.heading h1 span{background:#e1483a  url("../images/border-style.png") 8px center no-repeat; width: 30px; height: 20px; position: absolute; bottom: -10px; left: 49%;}
.heading{margin-bottom: 85px; text-align: center;}
.heading p{font-family: 'helvetica_neueregular'; font-weight: 400; font-size: 20px; line-height: 26px; padding: 0 100px;}
.services .service{padding: 0 20px; padding-top: 175px; }
.services .service-section{padding-bottom: 130px;}
.services .service {padding-bottom: 20px;}
.services .responsive{background: url("../images/responsive-icon.png") center top no-repeat;}
.services .rocktable{background: url("../images/rocket-icon.png") center top no-repeat;}
.services .showcase{background: url("../images/camera.png") center top no-repeat;}
.services .service span{background:#e56357; height: 1px; width: 170px; position: relative; display: inline-block; margin: 20px 0;}
.services .service span em{background:#e1483a  url("../images/border-style.png") center center no-repeat; width: 30px; height: 20px; position: absolute; bottom: -10px; left: 41%;}
.services .service-discription{padding-top: 60px; padding-bottom: 98px;   }
.services .service-discription h2{color: #4c2521; padding-bottom: 30px;}
.services .discription-one{background: #da4638; width: 47.3%; padding-right: 35px; text-align: right; float: left;}
.services .discription-two{background: #d44437; width: 47.5%; padding-left: 35px; text-align: left; float: right;}
.services .left-discription{padding-left: 47px; }
.services .right-discription{padding-right: 47px; margin-left: auto}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-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;
    -ms-transition-property:     -ms-transform, opacity;
    -o-transition-property:      -o-transform, opacity;
    transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}

/* End: Recommended Isotope styles */



/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
}


.pie-chart, .pie-chart2, .pie-chart3, .pie-chart4, .pie-chart5 {
    position: relative;
    display: inline-block;
    width: 110px;
    height: 110px;
    margin-top: 50px;
    margin-bottom: 50px;
    text-align: center;
    left:-47px; opacity: 1;
}
.pie-chart canvas, .pie-chart2 canvas, .pie-chart3 canvas, .pie-chart4 canvas, .pie-chart5 canvas {
    position: absolute;
    top: -60px;
    left: 0;
    width: 195px;
    height: 195px;
    opacity: 1;
}

.percent {
    display: inline-block;
    line-height: 110px;
    z-index: 2;
    font-family: 'Open Sans Condensed",Helvetica Neue, Helvetica,Arial,sans-serif';
    font-weight: 800;
    font-size: 40px;
    line-height: 46px;
    color: #ffffff;
    margin-left: 61px;
    margin-top: 11px;
}

.photoshop{}
.percent:after {
    content: '%';
    margin-left: 0.1em;
    font-size: .8em;
}

.photoshop, #white-page .photoshop h2{color: #009ee7;}
.illustrator, #white-page .illustrator h2{color: #ef6521;}
.html , #white-page .html h2{color: #2dcb73;}
.wordpress, #white-page .wordpress h2{color: #e73c5c;}