
/* Font Icons */

@font-face {
	font-family: 'pixelvicon';
	src:url('../fonts/Pixelvicon/pixelvicon.eot?3annyp');
	src:url('../fonts/Pixelvicon/pixelvicon.eot?#iefix3annyp') format('embedded-opentype'),
		url('../fonts/Pixelvicon/pixelvicon.woff?3annyp') format('woff'),
		url('../fonts/Pixelvicon/pixelvicon.ttf?3annyp') format('truetype'),
		url('../fonts/Pixelvicon/pixelvicon.svg?3annyp#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'pixelvicon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	font-size:20px;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-browser-1:before {
	content: "a";
}
.icon-transform:before {
	content: ")";
}
.icon-resize:before {
	content: "*";
}
.icon-grid:before {
	content: "+";
}
.icon-menu:before {
	content: ",";
}
.icon-fullscreen:before {
	content: "-";
}
.icon-outline:before {
	content: ".";
}
.icon-align-left:before {
	content: "/";
}
.icon-align-center:before {
	content: ":";
}
.icon-align-right:before {
	content: ";";
}
.icon-align-justify:before {
	content: "<";
}

/* Body and Tags */

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 {
border:0 none;
font-family:inherit;
font-size-adjust:inherit;
font-stretch:inherit;
font-style:inherit;
font-variant:inherit;
font-weight:inherit;
line-height:inherit;
margin:0;
padding:0;
}


body {
width: 100%;
height: 100%;
font-family: 'Rokkitt', serif;
}

html {
width: 100%;
height: 100%;
}

a, a:hover, a:active, a:focus {
outline: medium none;
text-decoration: none;
}

p {
padding:0 0 30px;
}

ol, ul {
list-style:none outside none;
}

h1, h2, h3, h4, h5, h6 {
letter-spacing:1px;
}

h1 {
font-family: 'Montserrat', sans-serif;
font-size:15px;
font-weight:700;
letter-spacing:12px;
margin-bottom:100px;
text-transform:uppercase;
}
input::-webkit-input-placeholder {color: #0a1a39;}
textarea::-webkit-input-placeholder {color: #0a1a39;}


/* HOME */
/* Navigation */
.navbar {
background-color: #FFF;
border-radius: 7px / 50px;
border:none;
font-family:'Montserrat', sans-serif;
font-size:10px;
font-weight:700;
letter-spacing:3px;
margin-top:30px;
text-transform:uppercase;
}
.navbar-nav {
margin: 0 20px 0;
}

.navbar-custom a {
color: #000;
transition: all 0.3s ease-in 0s;
-webkit-transition: all 0.3s ease-in 0s;
}
.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus,
.navbar-custom .nav li.active {
outline: 0;
color: #973E00;
 text-shadow: 2px 2px 2px #ccc;
transition: all 0.3s ease-in 0s;
-webkit-transition: all 0.3s ease-in 0s;
}
.navbar-nav > li > a {
padding-bottom:22px;
padding-top:22px;
}
.top-nav-collapse {
padding:0;
background-color: #E6E6E6;
}
.navbar-custom.top-nav-collapse {

}
.navbar-brand {
padding: 10px 0 10px 55px;
}


/* Text Home */
#scrolltextfade {
margin:200px auto 50px;
color:#fff;

}

.contain {
overflow: hidden;
margin: 0 auto 50px;
text-align:center;
}
.top-txt {
letter-spacing:15px;
font-size:36px;
margin:10px 0 7px;
font-weight:900;
text-transform:uppercase;
text-shadow: 4px 4px 8px #000;
font-family: 'Montserrat', sans-serif;
}
.bottom-txt {
line-height: 1;
text-align: center;
margin:auto;
}
.bottom-txt span {
display: inline-block;
position: relative; 
font-size:16px;
text-shadow: 4px 4px 8px #000;
font-family: 'Montserrat', sans-serif;
letter-spacing:12px;
text-transform:uppercase;
}


/* ABOUT */
.about-info {
background: none repeat scroll 0 0 #fff;
border-radius: 5px;
color: #000;
font-size: 14px;
letter-spacing:2px;
line-height: 12px;
margin: 0 0 12px;
min-height: 550px;
padding: 20px;
}

.about-info p {
padding:0 0 12px;
}

.about-title {
font-family: 'Montserrat',sans-serif;
font-size: 14px;
font-weight: 700;
letter-spacing: 8px;
margin: 7px 0 25px;
text-transform: uppercase;
}

.about-sub-title {
color: #DD1B12;
font-size:15px;
font-weight:400;
line-height:22px;

}

/* Team */
.team {
border-radius:100%;
border:2px solid #F8F8F8;
float:left;
height:75px;
margin:0 25px 0 0;
width:75px;
}
.team-name {
color: #DD1B12;
font-size:12px;
letter-spacing:2px;
margin:25px 0 -9px;
text-align:left;
text-transform:uppercase;
}
.team-post {
font-family: 'Montserrat', sans-serif;
font-size:9px;
letter-spacing:2.5px;
text-align:left;
text-transform:uppercase;
}

.social-team {
margin:2px 0 30px;
text-align:left;
font-size:9px;
}
.social-team i{
-webkit-transition: all 0.3s ease-in 0s;
border-radius:100%;
border:solid 1px;
color: #808080;
height:25px;
line-height:24px;
text-align:center;
transition: all 0.3s ease-in 0s;
width:25px;
}
.social-team i:hover{
color:#808080;
}

.social-team a {
margin:0 12px 0 0;
}


/* Skills */
.mar {
background: #fff;
border-radius: 50%;
cursor: default;
height: 74px;
margin:0 auto;
position: relative;
width: 74px;
}
.mar>.number {
color: #000;
font-family: 'Montserrat', sans-serif;
font-size: 14px;
left: 0;
position: absolute;
text-align: center;
top: 25px;
width: 100%;
z-index: 2;
}
.mar>.number .dec {
font-size: 35px;
}
.mar>#slice.mamu {
clip: rect(auto,auto,auto,auto);
}
.mar>#slice {
position: absolute;
clip: rect(0px,74px,74px,37px);
width: 74px;
height: 74px;
}
.mar>#slice>.part {
background: #DD1B12;
border-radius: 50%;
clip: rect(0px,37px,74px,0px);
height: 74px;
position: absolute;
width: 74px;
}
.mar>#slice>.part.fill {
-moz-transform: rotate(180deg)!important;
-webkit-transform: rotate(180deg)!important;
-o-transform: rotate(180deg)!important;
transform: rotate(180deg)!important;
}
.mar:after {
background: #ffffff;
border-radius: 50%;
content: '';
display: block;
height: 62px;
left:6px;
position: absolute;
top:6px;
width: 62px;
z-index: 1;
}

.skills {
margin:75px 0 0;
}
.skills-title {
display:block;
font-size:12px;
letter-spacing:2px;
margin:20px 0 40px;
text-transform:uppercase;
}

/* BRANDS */
.client img {
max-width:120px;
margin:15px 0;
}

/* SERVICES */
.services-box {
background: none repeat scroll 0 0 #fff;
border-radius: 5px;
margin: 0 7px 40px;
padding: 45px 0 30px;
}

.service-ico i {
display: inline-block;
cursor: pointer;    
color: #000;
}
.service-ico i:hover{
opacity:0.7;
}

.service-ico i:before {
display:block;
font-size:30px;
}

.service-ico h4 {
background: #DD1B12;
color: #fff;
font: 700 11px 'Montserrat',sans-serif;
letter-spacing: 2px;
margin: 10% 0 8%;
padding: 15px 0;
text-transform: uppercase;
transition: all 0.2s ease 0s;
width: 100%;
}

.service-ico p {
color: #000;
font-size: 11px;
letter-spacing: 1.5px;
line-height: 24px;
padding: 5px 35px;
text-transform: uppercase;
}



/* STATS */
.stats {
margin:0 0 20px;
}

.stats i {
font-size:30px;
color: #DD1B12;
}
.stats h4 {
font: 400 12px/17px 'Montserrat',sans-serif;
letter-spacing:2px;
text-transform:uppercase;
}
.stats span {
font:400 14px 'Rokkitt', sans-serif;
letter-spacing:0.5px;
}


/* Contact Form */
input[type="text"], input[type="email"] {
background:#fff;
border: none;
border-radius: 5px;
color: #000;
font: 700 12px 'Rokkitt',sans-serif;
height: 55px;
letter-spacing: 4px;
margin: 0 0 20px;
padding: 0 0 0 40px;
text-transform: uppercase;
transition:all 0.5s ease 0s;
-webkit-transition:all 0.5s ease 0s;
width: 100%;
}

input[type="phone"] {
float:left;
background: #fff;
border: none;
border-radius:5px;
color: #000;
font: 700 12px 'Rokkitt',sans-serif;
height: 55px;
letter-spacing:4px;
margin:0 0 20px;
padding:0 0 0 40px;
text-transform: uppercase;
transition:all 0.5s ease 0s;
-webkit-transition:all 0.5s ease 0s;
width: 47%;
}

#contactform select { 
float:left;
border:0;
border-radius:5px 0 0 5px;
background: #fff;
color: #000;
font: 700 12px 'Rokkitt',sans-serif;
height: 55px;
letter-spacing:2px;
text-transform: uppercase;
transition:all 0.5s ease 0s;
-webkit-transition:all 0.5s ease 0s;
width: 50%; 
margin: -15px 0 0 3%;
padding:10px 0 10px 40px;
}


textarea  {
background: #fff;
border: none;
border-radius: 5px;
color: #000;
font: 700 12px 'Rokkitt',sans-serif;
height: 99px;
letter-spacing: 4px;
margin: 0 0 20px;
padding: 19px 0 0 40px;
text-transform: uppercase;
transition: all 0.5s ease 0s;
width: 100%;
}

button[type="submit"] {
background:#fff;
border: none;
border-radius: 5px 0;
bottom: 20px;
color: #3ab074;
cursor: pointer;
font: 700 10px 'Montserrat',sans-serif;
letter-spacing: 3px;
padding: 9px 20px;
position: absolute;
right: 15px;
text-align: center;
text-transform: uppercase;
transition: all 0.2s ease-in 0s;
width: 135px;
}

button[type="submit"]:hover {
background: #3ab074;
color: #fff;
}

#load {
display:none;
}

/* Error / Success */
#contactform .success { 
background: #3ab074;
color: #fff;
}
#contactform .error { 
background: #000;
color: #fff;
}

#contactform .success,
#contactform .error { 
padding:12px;
margin:20px auto;
text-align: center;
font-size:10px;
font-weight:700;
border-radius:5px;
letter-spacing:1px;
text-transform:uppercase;
color: #fff;
width:100%;
}

/* Contact Details */
.cont-details {
background: none repeat scroll 0 0 #fff;
border-radius: 5px;
border: medium none;
padding:90px 0 91px 16%;
}
.cont-details div {
color: #000;
font-size:12px;
font-weight:400;
letter-spacing:2px;
text-align:left;
text-transform:uppercase;
}
.cont-details span {
color:#3ab074;
display:block;
font:700 10px 'Montserrat', sans-serif;
letter-spacing:2px;
margin:0 0 5px;
}

.phone {
padding:25px 0 25px;
}

.email a {
color: #000;
transition: all 0.2s ease-in 0s;
-webkit-transition: all 0.2s ease-in 0s;
}
.email a:hover {
color: #3ab074;
transition: all 0.2s ease-in 0s;
-webkit-transition: all 0.2s ease-in 0s;
}




 
/* FOOTER */

/* Copyright */
.copyright {
color: #000; 
font:700 10px 'Montserrat', sans-serif;
letter-spacing:3px;
text-transform:uppercase;
}
.copyright a {
color: #000; 
transition: all 0.2s ease-in 0s;
-webkit-transition: all 0.2s ease-in 0s;
}
.copyright a:hover {
color: #DD1B12;  
}


/* SECTIONS */
.home-section {
background:url('../img/home.jpg') no-repeat bottom center fixed;
background-size:cover;
display: table;
height: 100%;
padding:200px 0;
text-align: center;
width: 100%;
}

.about-section {
background:#F8F8F8;
display: table;
height: auto;
padding:135px 0 70px;
text-align: center;
width: 100%;
}

.brands-section {
background: #fff;
display: table;
height: auto;
padding:22px 0;
text-align: center;
width: 100%;
}

.services-section {
background:url('../img/services.jpg') no-repeat bottom center fixed;
color: #fff;
display: table;
height:auto;
padding:130px 0 125px;
text-align:center; 
width:100%;
}

.portfolio-section {
background: #fff;
color: #000;
display: table;
height:100%;
padding:130px 0 100px;
text-align: center;
width:100%;
}

.pricing-section {
background:url('../img/pricing.jpg') no-repeat bottom center fixed;
color: #fff;
display: table;
height:100%;
padding:130px 0 100px;
text-align: center;
width:100%;
}

.stats-section {
background: #fff;
display: table;
height: auto;
padding:35px 0 25px;
text-align: center;
width: 100%;
}

.contact-section {
background: #F8F8F8;
color: #000;
display: table;
height:auto;
padding:135px 0 100px;
text-align: center;
width:100%;
}

.footer-section {
background: #fff;
display: table;
height: auto;
padding:15px 0;
text-align: center;
width: 100%;
}


/* Style for Responsive Design */
@media only screen and (max-width: 1200px) {
/* ABOUT */
.about-info-mob {
min-height:200px;
}

}

@media only screen and (max-width: 992px) {

/* PORTFOLIO */
.cbp-l-inline-left {
float:left;
width:100%;
}

.cbp-l-inline-right {
float:right;
padding:35px;
width:100%;
}

}

@media(min-width:767px) {
.navbar {
padding:0;
-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
transition: background .5s ease-in-out,padding .5s ease-in-out;
}

.top-nav-collapse {
 /* Customize the look and feel of the collapsed top nav here */
padding: 0;
}
}


@media only screen and (max-width: 767px) {

/* HOME */
/* Nanvigation */
.navbar {
margin:30px 15px;
}

.navbar-custom {
background-color: #fff;
border-color: #000;
}
.navbar-toggle {
padding:9px 10px;
margin:15px;
}
.navbar-custom .navbar-toggle {
border:none;
transition: all 0.4s ease 0s;
-webkit-transition: all 0.4s ease 0s;
}
.navbar-custom .navbar-toggle:hover,
.navbar-custom .navbar-toggle:focus {
background-color: #F8F8F8;
}
.navbar-custom .navbar-toggle .icon-bar {
background-color: #000;
}
.navbar-nav > li > a {
padding-top: 10px;
padding-bottom: 10px;
line-height: 20px;
}

.navbar-brand {
padding: 10px 0 10px 15px;
}

.home-group-txt {
margin:170px 0 50px;
}

.home-middle-text {
font-size:25px;
}

/* Copyright */
.copyright {
text-align:center;
}

/* Social Networks */
.social-net{
text-align:center;
}

}

@media only screen and (max-width: 480px) { 
.service-ico p {
font-size:13px;
}
}
