div, article, section, header, footer, nav {
position : relative;
}
.group:after {
display : block;
height : 0;
clear : both;
content : ".";
visibility : hidden;
}
body {
background : #fff;
color : #000000;
font-size : 15px;
font-weight : 300;
font-family : 'Open Sans', Arial, sans-serif;
padding : 0;
overflow-x : hidden;
}
.clearfix:before, .clearfix:after {
display : table;
content : " ";
}
.clearfix:after {
clear : both;
}
.scrollup {
	position : absolute;
	width : 70px;
	height : 70px;
	bottom : 10px;
	left : 50%;
	transition : all 0.4s 0.2s ease-in-out;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 500px;
}
.scrollup:hover i {
transform : scale(1.8);
transition : all 0.4s 0.2s ease-in-out;
}
a.scrollup {
outline : 0;
text-decoration : none;
}
a.scrollup:hover, a.scrollup:active, a.scrollup:focus {
opacity : 0.8;
text-decoration : none;
transition : all 0.8s 0s ease-out;
transform:rotate(360deg) scale(1.3);
}
a.scrollup i:hover {
text-decoration : none;
}
.blankdivider10 {
height : 10px;
display : block;
}
.blankdivider20 {
height : 20px;
display : block;
}
.blankdivider30 {
height : 30px;
display : block;
}
.row {
margin-bottom : 30px;
}
.row .row {
margin-bottom : 30px;
}
.row.nomargin {
margin-bottom : 0;
}
.headingborder {
background-image : url("../images/03-frame-top-left.png"), url("../images/03-frame-top-right.png"), url("../images/03-frame-bottom-right.png"), url("../images/03-frame-bottom-left.png");
background-position : left top, right top, right bottom, left bottom;
background-repeat : no-repeat;
border : rgba(255, 255, 255, 0.1) solid 1px;
padding : 25px;
display : inline-block;
}
.uppercase {
text-transform : uppercase;
}
.pulse {
animation-duration : 1s;
animation-iteration-count : infinite;
}
input[type="text"], input[type="submit"], textarea {
width : 100%;
padding : 0.5em;
font-size : 1em;
margin-bottom : 1.5em;
box-sizing : border-box;
}
input, button, select, textarea {
font-family : 'Open Sans', Arial, sans-serif;
}
#about, #team, #pricing, #works, footer {
background : #fff;
}
.container-video {
height : 100%;
min-height : 100%;
overflow : hidden;
position : relative;
text-align : center;
z-index : 750;
}
#preloader {
background-color : #FFFFFF;
bottom : 0;
left : 0;
position : fixed;
right : 0;
top : 0;
z-index : 2147483647;
}
#status {
background-image : url("../images/preloader.GIF");
background-position : center center;
background-repeat : no-repeat;
height : auto;
left : 50%;
top : 50%;
position : absolute;
width : 200px;
margin : -100px 0 0 -100px;
}
#status h4 {
font-size : 18px;
padding-top : 74px;
text-align : center;
text-transform : uppercase;
padding-top : 100px;
}
p {
line-height : 1.6em;
margin : 0 0 10px 0;
text-align : justify;
}
blockquote {
font-size : 18px;
border : none;
padding : 0;
}
blockquote.large {
font-size : 32px;
font-weight : 400;
line-height : 1.2em;
}
blockquote.large:before {
font-size : 64px;
font-family : FontAwesome;
content : "\f10d";
margin-right : 20px;
}
blockquote cite {
display : block;
font-size : 18px;
}
blockquote cite a, blockquote cite a:visited, blockquote cite a:visited {
color : #555;
}
ul, ol {
font-size : 1em;
line-height : 1.5;
margin : 0 0 1.5em 0;
}
a {
color : #454545;
text-decoration : none;
}
a:hover, a:active {
text-decoration : underline;
}
h1, h2, h3, h4, h5, h6 {
font-weight : 400;
color : #312f2b;
line-height : 1.1em;
font-family : 'Open Sans', Arial, sans-serif;
}
h1 {
font-size : 28px;
margin-bottom : 20px;
text-align: center;
}
h2 {
font-size : 30px;
margin-bottom : 20px;
}
h3 {
font-size : 20px;
margin-bottom : 20px;
}
h4 {
font-size : 22px;
margin-bottom : 20px;
}
h5 {
font-size : 18px;
margin-bottom : 15px;
}
h6 {
font-size : 16px;
margin-bottom : 10px;
}
strong {
font-weight : 700;
font-family : 'Open Sans', sans-serif;
color : #D9B346;
}
small {
font-size : 0.75em;
line-height : 2;
margin-top : 2em;
margin-bottom : 0;
}
em {
font-style : normal;
font-family : 'Open Sans';
}
.alignright {
text-align : right;
}
.alignleft {
text-align : left;
}
.aligncenter {
text-align : center;
}
.navbar-fixed-top, .navbar-fixed-bottom {
z-index : 9999;
}
.navbar .brand {
margin-left : 0;
padding : 0;
margin-top : 1.3em;
}
.navbar .brand a {
padding : 0;
font-size : 1.75em;
margin-left : 0;
font-weight : 400;
text-transform : uppercase;
}
.navbar .brand a:hover {
text-decoration : none;
color : #000;
}
.navbar .brand a:focus {
outline : none;
}
.navbar-wrapper {
overflow : hidden;
}
#menu-main {
margin : 0;
}
ul#menu-main > li > a {
font-weight : 600;
color : #4A4F52;
font-size : 14px;
text-transform : uppercase;
line-height : 72px;
}
ul#menu-main > li > a:hover {
border-bottom : 5px solid #ed1b24;
color : #ed1b24;
background-attachment : scroll;
background-color : #f7e8e9;
background-image : none;
background-repeat : repeat;
background-position : 0 0;
}
.selected {
border-bottom : 5px solid #ed1b24;
color : #ed1b24;
background-color : #f7e8e9;
}
ul#menu-main > li > a:focus {
outline : 0;
}
.navbar-inverse .brand, .navbar-inverse .nav > li > a {
text-shadow : none;
}
#header-wrapper {
width : 100%;
min-height : 600px;
padding-top : 160px;
text-align : center;
position : relative;
}
#header-wrapper h1 {
color : #FFFFFF;
font-size : 4em;
font-weight : 400;
margin : 1em 0;
}
#header-wrapper .span12 h1 {
font-size : 52px;
font-weight : 400;
line-height : 62px;
margin-bottom : 10px;
font-family : 'Oswald', sans-serif;
}
#header-wrapper .span12 h1 span {
background : none 0 0 repeat scroll rgba(0, 0, 0, 0);
padding : 0 2px;
}
#header-wrapper h2 {
color : #fff;
font-family : 'Open Sans', sans serif;
font-size : 2em;
font-weight : normal;
margin : 0.5em 0;
text-shadow : 1px 1px 1px #333333;
}
header .logo {
text-align : center;
margin-bottom : 30px;
}
#header-wrapper.header-slider {
background-image : url("../images/04-homebg.jpg");
background-position : center top;
background-repeat : no-repeat;
background-size : cover;
background-attachment : fixed;
height : 100%;
overflow : hidden;
}
#main-flexslider ul.slides li p, #main-blogpage p, #main-portfoliopage p {
font-size : 72px;
text-transform : uppercase;
position : relative;
margin-bottom : 0;
text-align : center;
line-height : 1;
color : #FF0000;
text-shadow : 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.texteffect {
background : none 0 0 repeat scroll rgba(255, 255, 255, 0.1);
font-family : oswald !important ;
font-size : 28px !important ;
font-weight : 300 !important ;
line-height : normal !important ;
margin-left : 0 !important ;
padding : 5px 10px !important ;
position : relative !important ;
text-align : center !important ;
text-transform : uppercase !important ;
}
.texteffect strong {
font-family : oswald !important ;
font-weight : 300 !important ;
}
#main-flexslider.flexslider {
margin : 0;
background : none;
border : none;
border-radius : 0;
box-shadow : none;
}
#header-wrapper .scroll_btn {
background : url("../images/05-scroll.gif") 50% 50% no-repeat scroll rgba(215, 181, 94, 0);
border : #FFFFFF solid 2px;
border-radius : 50%;
display : block;
height : 45px;
margin : 42px auto;
transition : all 500ms 0s ease-in-out;
width : 45px;
animation : intro_text_home 0.7s 2s ease-in-out 1 normal backwards;
}
#header-wrapper .scroll_btn:hover {
background : url("../images/05-scroll.gif") 50% 50% no-repeat scroll rgba(237, 27, 36, 1);
opacity : 0.85000002384185791015625;
transform : scale(1.3);
}
.video-overlay {
background-attachment : scroll;
background-repeat : repeat;
height : 100%;
left : 0;
position : absolute;
top : 0;
width : 100%;
background-image : url("../images/05_overlayPattern.png");
}
section.section {
padding : 0;
}
section.section .picture h4 {
color : #fff;
text-shadow : 1px 1px 1px rgba(0, 0, 0, 0.5);
}
section.section .picture h3 {
color : #fff;
text-shadow : 1px 1px 1px rgba(0, 0, 0, 0.5);
}
section.section h4 {
text-align : center;
margin : 2em 0 -0.1em;
font-size : 46px;
font-weight : 700;
letter-spacing : -1px;
display : inline-table;
}
.iconface .num {
height : 140px;
margin : 0 auto 20px;
width : 140px;
}
.iconface .n2 {
background : url("../images/06-icon-bg.png") 0 0 no-repeat scroll rgba(0, 0, 0, 0);
}
.iconface .bg-numero {
height : 140px;
position : absolute;
top : 0;
width : 140px;
z-index : 9;
}
.iconface .n20 {
background : #fff;
color : #D9B346;
}
.iconface .roda {
transform : rotate(-360deg);
transition : all 1.2s 0s ease-out;
}
.iconface .numero {
border-radius : 50%;
font-size : 72px;
height : 120px;
line-height : 134px;
margin-left : 10px;
position : absolute;
text-align : center;
top : 10px;
width : 120px;
z-index : 10;
}
.ch-icon {
display : table;
font-size : 72px;
line-height : normal;
margin : 21px auto;
position : relative;
text-align : center;
vertical-align : middle;
}
.iconface:hover .bg-numero {
transform : rotate(0deg);
transition : all 1.2s 0s ease-out;
}
#info .span4:hover .iconface .bg-numero, #services .span3:hover .iconface .bg-numero {
transform : rotate(0deg);
transition : all 1.2s 0s ease-out;
}
.iconface .roda {
transform : rotate(-360deg);
transition : all 1.2s 0s ease-out;
}
.heading {
text-align : center;
padding : 40px 0;
}
.heading h1 {
margin-bottom : 0;
}
.ch-grid:after, .ch-item:before {
content : "";
display : table;
}
.ch-img-1 {
background-image : url("../images/13.jpg");
}
.ch-item {
border-radius : 50%;
box-shadow : 0 1px 2px rgba(0, 0, 0, 0.1);
cursor : default;
position : relative;
height : 220px;
margin : 0 auto 20px;
width : 220px;
}
#works .ch-item {
border-radius : 50%;
box-shadow : 0 1px 2px rgba(0, 0, 0, 0.1);
cursor : default;
position : relative;
height : 180px;
margin : 20px auto 60px;
width : 180px;
}
.ch-item {
cursor : default;
}
.ch-info-wrap {
background : #D9B346;
box-shadow : 0 0 0 20px rgba(255, 255, 255, 0.2), 0 0 3px rgba(115, 114, 23, 0.8) inset;
left : 20px;
top : 20px;
transition : all 0.4s 0.2s ease-in-out;
}
.ch-info-wrap, .ch-info {
border-radius : 50%;
height : 180px;
position : absolute;
width : 180px;
}
#works .ch-info-wrap, #works .ch-info {
border-radius : 50%;
height : 140px;
position : absolute;
width : 140px;
}
#works .ch-info h1 {
color : #FFFFFF;
font-size : 62px;
font-weight : 100;
line-height : 110px;
}
.ch-img-1 {
background : #f2f2f2;
text-align : center;
}
.ch-img-2 {
background-image : url("../img/14.jpg");
}
.ch-img-3 {
background-image : url("../img/15.jpg");
}
.ch-info .ch-info-front {
transition : all 0.6s 0s ease-in-out;
}
.ch-info > div {
background-position : center center;
border-radius : 50%;
display : block;
height : 100%;
position : absolute;
width : 100%;
background : #D9B346;
}
.ch-info .ch-info-back {
background : none 0 0 repeat scroll #FFFFFF;
opacity : 0;
transform : scale(1.5);
transition : all 0.4s 0.2s ease-in-out;
}
.ch-info h3 {
color : #000000;
font-size : 25px;
height : 80px;
line-height : 30px;
margin : 0 15px;
padding : 60px 0 0;
text-align : center;
text-transform : uppercase;
}
#works .ch-info h3 {
font-size : 22px;
height : 60px;
line-height : 30px;
margin : 0 15px;
padding : 40px 0 0;
text-align : center;
text-transform : uppercase;
}
.ch-item:hover .ch-info-front {
opacity : 0;
transform : scale(0);
}
.ch-item:hover .ch-info-back {
opacity : 1;
transform : scale(1);
}
.ch-item:hover .ch-info-wrap {
transition : all 0.4s 0.2s ease-in-out;
box-shadow : 0 0 0 20px #D9B346, 0 0 3px rgba(115, 114, 23, 0.8) inset;
}
.skillbar {
background : none 0 0 repeat scroll #EFEFEF;
display : block;
height : 10px;
margin-bottom : 50px;
margin-top : 30px;
position : relative;
transition-delay : 0s;
transition-duration : 0.4s;
transition-property : width, background-color;
transition-timing-function : linear;
width : 100%;
}
.skillbar-title {
color : #323232;
font-size : 14px;
left : 0;
position : absolute;
top : -25px;
}
.skillbar-title span {
display : block;
}
.skillbar-bar {
background : none 0 0 repeat scroll #D9B346;
}
.skillbar-bar {
height : 10px;
width : 0;
}
.skill-bar-percent:after {
border-color : #323232 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
border-style : solid;
border-width : 10px;
content : "";
height : 0;
left : 5px;
position : absolute;
top : 11px;
width : 0;
}
.skill-bar-percent {
background : none 0 0 repeat scroll #323232;
border : #323232 solid 4px;
border-radius : 2px;
color : #FFFFFF;
font-size : 12px;
font-weight : normal;
height : 7px;
line-height : 7px;
opacity : 0;
padding : 3px;
position : absolute;
text-align : center;
top : -27px;
width : 24px;
}
section.spacer {
color : #fcfcfc;
position : relative;
background-attachment : scroll;
background-position : 50% 0;
background-size : cover;
background-repeat : repeat;
}
@media only screen and (max-width:1024px) {
section.spacer {
background-attachment : scroll !important ;
background-position : center top !important ;
}
}
.darker-overlay {
background-color : rgba(0, 0, 0, 0.7);
display : block;
height : 100%;
position : relative;
width : 100%;
}
section.spacer .container {
padding : 60px 0 30px;
}
section.spacer.bg1 {
background-image : url("../images/09-parallax.jpg");
}
section.spacer.bg2 {
background-image : url("../images/10-parallax.jpg");
}
section.spacer.bg3 {
background-image : url("../images/09-parallax.jpg");
}
section.spacer blockquote.large:before {
color : #eee;
opacity : 0.60000002384185791015625;
}
section.spacer blockquote cite {
color : #fff;
}
section#studio {
padding-bottom : 0;
overflow : hidden;
}
.studio .row {
margin-bottom : 0;
}
.studio {
margin-top : 10px;
}
.swiper-container {
position : relative;
z-index : 1;
overflow : hidden;
margin : 0 auto;
backface-visibility : hidden;
}
.swiper-wrapper {
position : relative;
width : 100%;
transition-timing-function : ease;
transition-duration : 0s;
transition-property : transform, left, top;
transform : translate3d(0,0,0);
}
.swiper-slide {
float : left;
}
.swiper-slide img {
width : 100%;
}
.swiper-container, .swiper-slide {
width : 100%;
}
.swiper-container {
overflow : visible;
margin : 0 auto;
max-width : 670px;
height : 50px;
}
#team {
padding : 0 0 100px 0;
}
.exp_block .span4 a {
color : #999999;
display : block;
text-decoration : none;
}
.exp_block a.exp_tt {
position : relative;
text-align : center;
}
.exp_block a.exp_tt .tt {
background : none 0 0 repeat scroll #FFFFFF;
border-bottom : 1px solid #CCCCCC;
color : #4A4F52;
display : block;
height : 37px;
left : 15%;
opacity : 0;
position : absolute;
top : -90px;
transition : all 500ms 0s cubic-bezier(0.68,-0.55,0.265,1.55);
width : 70%;
}
.exp_block .span4 .face {
border : rgba(0, 0, 0, 0.03) solid 15px;
border-radius : 50%;
margin-bottom : 20px;
transition : all 500ms 0s ease-in-out;
}
.exp_block .span4 .link_exp {
border-left : 1px solid rgba(204, 204, 204, 0);
border-right : 1px solid rgba(204, 204, 204, 0);
color : #4A4F52;
display : inline;
padding : 0 30px;
text-align : center;
transition : all 500ms 0s cubic-bezier(0.68,-0.55,0.265,1.55);
}
.exp_block .span4 p {
margin : 0 10% 20px;
padding-top : 20px;
text-align : center;
transition : all 500ms 0s ease-in-out;
}
.exp_block .span4 h2 {
color : #4A4F52;
}
.text-left {
text-align : left !important ;
}
.exp_block a.exp_tt .tt img {
bottom : 0;
left : 50%;
margin-bottom : -7px;
margin-left : -6px;
position : absolute;
}
.exp_block a.exp_tt:hover .tt, .exp_block a.exp_tt:focus .tt {
border-bottom : 1px solid #CCCCCC;
color : #4A4F52;
display : block;
height : 37px;
left : 15%;
opacity : 1;
position : absolute;
top : -40px;
width : 70%;
}
.exp_block .span4:hover .link_exp {
border-left : 1px solid #CCCCCC;
border-right : 1px solid #CCCCCC;
padding : 0 10px;
background : #f2f2f2;
}
.exp_block .span4:hover .face {
border : rgba(0, 0, 0, 0.1) solid 15px;
transition : all 0.4s 0s ease;
}
.team-social {
clear : both;
font-size : 16px;
overflow : hidden;
text-align : center;
}
.team-social a {
background : none 0 0 repeat scroll #f1f1f1;
border-radius : 50%;
color : #848484;
display : inline-block !important ;
height : 20px;
padding : 9px;
text-decoration : none;
width : 20px;
}
.team-social a:hover {
color : #000;
}
#services {
padding : 0;
background : none 0 0 repeat scroll #fff;
position : relative;
}
#services .iconface .num {
height : 100px;
margin : 0 auto 20px;
width : 100px;
}
#services .iconface .bg-numero {
border-radius : 50%;
height : 100px;
position : absolute;
top : 0;
width : 100px;
z-index : 9;
background-image : linear-gradient(-90deg, #D9B346 25%, #dfdfdf 25%, #dfdfdf 50%, #dfdfdf 50%, #dfdfdf 75%, #D9B346 75%, #D9B346);
background-color : #ed1b24;
}
#services .iconface .numero {
border-radius : 50%;
font-size : 44px;
height : 80px;
line-height : 78px;
margin-left : 10px;
position : absolute;
text-align : center;
top : 11px;
width : 80px;
z-index : 10;
}
#services .iconface .numero i {
line-height : 78px;
}
section#services {
position : relative;
}
section#services h2 {
font-size : 18px;
margin-bottom : 15px;
margin-top : 10px;
text-align : center;
}
section#services p {
margin : 10px;
}
section#services .service-box {
border : #999999 dashed 1px;
padding : 20px;
text-align : center;
transition : all 0.3s ease-in-out;
}
section#services .span3:hover {
background-color : #ed1b24;
}
section#services .service-box h2 {
color : #f7f7f7;
font-weight : 500;
}
section#services .service-box h2 a {
text-decoration : none;
color : #4A4F52;
}
section#services .service-box h2 a:hover {
color : #000;
}
section#services.section .service-box:hover {
background : #fff;
}
.service-icon {
background : #FFFFFF;
border-radius : 50%;
color : #000;
font-size : 58px;
height : 80px;
line-height : 60px;
padding : 20px 0 0;
transition : all 0.2s 0s linear;
width : 100px;
}
.reveal-modal-bg {
position : fixed;
height : 100%;
width : 100%;
z-index : 100;
display : none;
top : 0;
left : 0;
opacity : 1 !important ;
background : rgba(217, 179, 70, 0.8);
}
.reveal-modal.small {
width : 200px;
margin-left : -140px;
}
.reveal-modal.medium {
width : 400px;
margin-left : -240px;
}
.reveal-modal.large {
width : 600px;
margin-left : -340px;
}
.reveal-modal.xlarge {
width : 800px;
margin-left : -440px;
}
.reveal-modal {
visibility : hidden;
border-radius : 5px;
box-shadow : 0 0 10px rgba(0, 0, 0, 0.4);
background-color : #FFFFFF;
border : #f2f2f2 solid 1px;
box-shadow : 0 0 5px rgba(0, 0, 0, 0.1);
height : auto;
left : 50%;
margin-left : -40%;
position : absolute;
top : 50px;
z-index : 9999;
transition : all 0.4s ease-in;
}
.reveal-modal {
margin-left : -32%;
width : 60%;
}
.reveal-modal {
padding : 1.875em;
}
.reveal-modal > *:last-child {
margin-bottom : 0;
}
ul.nav_modal {
display : none;
}
.db {
display : block !important ;
}
ul.nav_modal li {
list-style : none outside none;
}
ul.nav_modal li .prev {
box-shadow : -3px 0 0 0 rgba(0, 0, 0, 0.2);
left : -1.6em;
}
ul.nav_modal li .next {
box-shadow : 3px 0 0 0 rgba(0, 0, 0, 0.2);
right : -1.6em;
}
.close-reveal-modal {
transition : all 2s ease-in;
}
.reveal-modal .close-reveal-modal {
font-weight : bold;
color : #AAAAAA;
cursor : pointer;
font-size : 1.375em;
font-weight : bold;
line-height : 1;
position : absolute;
right : 0.6875em;
top : 0.5em;
}
ul.nav_modal li a {
background : none 0 0 repeat scroll #FFFFFF;
border-radius : 4px;
height : 50px;
margin-top : -25px;
position : absolute;
top : 50% !important ;
transition : all 200ms 0s ease-in-out;
width : 50px;
}
ul.nav_modal li a svg {
display : inline-block;
height : 21px;
margin-top : 14px;
transition : all 200ms 0.1s ease-in-out;
width : 14px;
margin : 14px;
}
ul.nav_modal li a svg path {
transition : all 500ms 0s ease-in-out;
}
ul.nav_modal li .next:hover {
box-shadow : 0 0 0 0 rgba(0, 0, 0, 0);
right : -2em;
}
ul.nav_modal li .next:hover svg {
margin-left : 10px;
}
ul.nav_modal li .prev:hover {
box-shadow : 0 0 0 0 rgba(0, 0, 0, 0);
left : -2em;
}
ul.nav_modal li .prev:hover svg {
margin-right : 10px;
}
@media (max-width:1000px)
@media only screen and (min-width:480px) and (max-width:767px) {
.reveal-modal {
margin-left : -40%;
width : 65%;
}
}
@media only screen and (max-width:479px) {
.reveal-modal {
margin-left : -35%;
width : 52%;
}
}
#process {
position : relative;
}
#process ul {
padding : 0;
margin : 0;
}
.processLead-list li a {
transition : all 0s;
}
.processLead-list {
height : auto;
display : block;
margin-bottom : 0;
}
.processLead-list li {
margin : 0;
padding : 0;
position : relative;
width : 20%;
display : inline;
float : left;
height : auto;
z-index : 99;
}
.processLead-list li a {
display : block;
padding-top : 100%;
position : relative;
width : 100%;
}
.bg-discovery {
background : #f1f1f1;
}
.processLead-list li a span {
background-position : center center;
background-repeat : no-repeat;
background-size : auto 100%;
color : #000000;
display : block;
font-size : 18px;
font-weight : 400;
height : 20%;
left : 0;
line-height : 206px;
margin-top : -14%;
position : absolute;
text-align : center;
text-transform : uppercase;
top : 44%;
width : 100%;
transition : all 0.2s 0s ease-in-out;
}
.bg-planning {
background : #f1f1f1;
}
.bg-design {
background : #f1f1f1;
}
.bg-develop {
background : #f1f1f1;
}
.bg-launch {
background : #f1f1f1;
}
.processLead-list li a i {
font-size : 4em;
position : absolute;
left : 42%;
text-align : center;
color : #D9B346;
text-shadow : 1px 1px 0 #F2F2F2;
}
.processLead-list li a:hover {
margin-left : -5%;
margin-top : -5%;
padding-top : 110%;
width : 110%;
z-index : 999;
}
.processLead-list li a:hover span {
line-height : 200px;
}
.processLead-list li a:hover span {
line-height : 224px;
}
@media (max-width:1000px) {
.processLead-list li a span {
font-size : 14px;
line-height : 170px;
}
.processLead-list li a:hover span {
line-height : 200px;
}
}
@media only screen and (min-width:480px) and (max-width:767px) {
.processLead-list {
height : auto;
}
.processLead-list li {
width : 33.333%;
}
.processLead-list li a span {
font-size : 12px;
line-height : 170px;
}
.processLead-list li a:hover {
margin-left : 0%;
margin-top : 0%;
padding-top : 100%;
width : 100%;
z-index : 9999;
}
.processLead-list li a:hover span {
line-height : 200px;
}
}
@media only screen and (max-width:479px) {
.processLead-list {
height : auto;
}
.processLead-list li {
width : 50%;
}
.processLead-list li a span {
font-size : 12px;
line-height : 170px;
}
.processLead-list li a:hover {
margin-left : 0%;
margin-top : 0%;
padding-top : 100%;
width : 100%;
z-index : 999;
}
.processLead-list li a:hover span {
line-height : 200px;
}
}
#pricing .price-plan-standard {
margin-left : 0;
margin-right : 0;
margin-bottom : 26px;
}
#pricing .price-plan {
background : url("../images/10-parallax.jpg") 0 0 repeat scroll rgba(0, 0, 0, 0.4);
position : relative;
transition : background-color 0.1s 0s ease-out;
width : auto;
}
#pricing .price-plan:hover {
background : url("../images/11-pricingpattern.png") 0 0 repeat scroll rgba(0, 0, 0, 0.6);
transition : width 0.6s 0s ease;
animation : progress-bar-stripes 8s linear infinite;
}
@keyframes progress-bar-stripes {
from {
background-position : 50px 0;
}
to {
background-position : 0 0;
}
}
#pricing .price-plan .price-plan-intrinsic {
padding-bottom : 280px;
position : relative;
}
#pricing .price-plan .most-popular {
background : none 0 0 repeat scroll #D9B346;
color : #FFFFFF;
height : auto;
padding : 6px 0;
position : absolute;
right : 0;
text-align : center;
text-transform : uppercase;
top : 0;
width : 100%;
}
#pricing .price-plan .most-popular span {
position : static;
}
#pricing .price-plan .most-popular span p {
color : #FFFFFF;
font-size : 11px;
font-style : normal;
font-weight : 500;
letter-spacing : 1px;
line-height : 15px;
margin : 0;
}
#pricing .price-plan .price-plan-intrinsic .price-plan-link {
cursor : pointer;
height : 100%;
position : absolute;
width : 100%;
text-decoration : none;
background : url("../images/11-pricingpattern.png") 0 0 repeat scroll rgba(0, 0, 0, 0.1);
}
#pricing .price-plan-business h2:after {
left : -4px;
position : relative;
width : 150px;
}
#pricing .price-plan-unlimited h2:after {
left : -5px;
position : relative;
width : 166px;
}
#pricing .price-plan-standard h2:after {
left : -4px;
position : relative;
width : 162px;
}
#pricing .price-plan h2 {
color : #FFFFFF;
margin : 0;
padding : 42px 0 0;
text-align : center;
text-transform : uppercase;
}
#pricing .price-plan .price {
padding : 30px 0 0;
}
#pricing .price-plan-standard .inside {
padding-left : 6px;
}
#pricing .price-plan .inside {
color : #FFFFFF;
font-weight : 100;
height : 100px;
line-height : 100px;
text-align : center;
}
#pricing .price-plan .super {
font-size : 24px;
left : -7px;
position : relative;
top : -56px;
}
#pricing .price-plan .amt {
font-size : 104px;
font-weight : 300;
letter-spacing : -4px;
margin-left : -5px;
margin-right : 6px;
}
#pricing .price-plan .sub {
font-size : 14px;
letter-spacing : 2px;
margin-left : -5px;
text-transform : uppercase;
}
#pricing .price-plan .price p {
color : #fff;
font-style : italic;
margin-top : 21px;
text-align : center;
}
.responsive-break {
display : inline;
padding : 0 0 0 0.45em;
}
#pricing .price-plan .price-plan-arrow {
display : none;
position : absolute;
}
#pricing .price-plan .info {
background-color : #F7F7F7;
text-align : center;
}
#pricing .price-plan .info {
text-align : center;
}
#pricing .price-plan .info ul {
list-style : none outside none;
margin : 0;
padding : 0;
text-align : left;
}
#pricing .price-plan .info ul li {
background : none 0 0 repeat scroll #F7F7F7;
border-bottom : 1px solid #E9E9E9;
line-height : 20px;
padding : 15px 30px;
text-align : left;
}
#pricing .price-plan .info ul li .free {
background : #D9B346;
border-radius : 3px;
color : #FFFFFF;
font-size : 11px;
font-weight : 500;
left : 4px;
letter-spacing : 1px;
line-height : 0;
padding : 4px 8px;
position : relative;
text-align : center;
text-transform : uppercase;
top : -1px;
width : 55px;
}
#portfolio {
padding-bottom : 0;
}
#filters {
margin-bottom : 0;
text-align : center;
display : block;
z-index : 2;
position : relative;
background : #f1f1f1;
}
#filters ul {
margin : 0;
list-style : none;
padding : 0;
}
#filters ul li {
display : inline-block;
vertical-align : middle;
}
#filters ul li a {
display : block;
float : left;
padding : 20px 25px;
color : inherit;
margin-right : 5px;
font-weight : 300;
border-bottom : 5px solid #f1f1f1;
}
#filters ul li a:hover, #filters ul li a:focus {
text-decoration : none;
outline : 0;
border-bottom : 5px solid #D9B346;
}
#filters ul li a:hover, #filters ul li a.active {
color : #D9B346;
background : #fff;
border-bottom : 5px solid #D9B346;
}
#portfolio-wrap {
margin-bottom : 60px;
width : 100%;
}
#portfolio-wrap {
margin-bottom : 0;
width : 100.5%;
position : relative;
}
.portfolio-item.current {
z-index : 101;
}
.portfolio-item {
width : 25%;
float : left;
padding : 0;
margin : 0;
box-shadow : 0 0 0 1px #000000;
}
.portfolio-item .portfolio-image {
overflow : hidden;
display : block;
position : relative;
}
.portfolio-item .portfolio-image img {
width : 100%;
height : auto;
}
.portfolio .portfolio-overlay {
background : none 0 0 repeat scroll rgba(255, 255, 255, 0);
height : 96%;
left : 2%;
position : absolute;
top : 2%;
width : 94%;
z-index : 4;
opacity : 0;
transition : all 0.3s ease-in-out;
}
.portfolio > a, .portfolio > a:hover {
color : #ffffff;
}
.portfolio-item .portfolio > a:hover > .portfolio-overlay {
opacity : 1;
cursor : url('../images/more.png') 40 40, crosshair;
}
.portfolio > a img {
transition : all 0.3s ease-in-out;
}
.portfolio > a:hover img {
transition : all 0.3s ease-in-out;
cursor : url('../images/more.png') 40 40, crosshair;
}
.portfolio .thumb-info {
position : absolute;
width : 100%;
height : 100%;
opacity : 0;
transition : all 0.3s ease-in-out;
}
.portfolio a:hover .portfolio-overlay .thumb-info {
opacity : 1;
}
.portfolio-overlay .thumb-info i {
top : 50%;
}
.portfolio-overlay .thumb-info .headingborder {
padding : 20px 0;
}
.portfolio-overlay .thumb-info h5 {
font-size : 22px;
font-weight : 300;
text-transform : uppercase;
}
.portfolio-overlay .thumb-info h5 span {
display : block;
font-size : 14px;
font-weight : 400;
padding-top : 10px;
}
.portfolio-overlay .thumb-info p {
top : 50%;
font-size : 13px;
}
.portfolio-overlay .thumb-info h5 {
color : #FFFFFF;
position : relative;
text-align : center;
width : 100%;
}
.portfolio-overlay .thumb-info p {
color : #ffffff;
width : 100%;
position : absolute;
text-align : center;
font-weight : bold;
}
.portfolio-overlay .thumb-info i {
color : #D9B346;
width : 100%;
position : absolute;
text-align : center;
display : block;
}
.owl-carousel .owl-wrapper:after {
clear : both;
content : ".";
display : block;
height : 0;
line-height : 0;
visibility : hidden;
}
.owl-carousel {
display : none;
position : relative;
width : 100%;
}
.owl-carousel .owl-wrapper {
display : none;
position : relative;
cursor : ew-resize;
}
.owl-carousel .owl-wrapper-outer {
overflow : hidden;
position : relative;
width : 100%;
height : auto !important ;
}
.owl-carousel .owl-wrapper-outer.autoHeight {
transition : height 500ms 0s ease-in-out;
}
.owl-carousel .owl-item {
float : left;
position : relative;
padding : 10px 0;
}
.owl-prev:before {
content : "\f177";
}
.owl-next:before {
content : "\f178";
}
.owl-prev, .owl-next {
font-family : FontAwesome;
font-style : normal;
font-weight : normal;
line-height : 1;
color : rgba(255, 255, 255, 0.2);
display : inline-block;
font-size : 28px;
margin : 20px;
position : relative;
text-align : center;
cursor : pointer;
}
.owl-prev:hover, .owl-next:hover {
color : #fff;
}
#clients {
text-align : center;
padding : 20px 0;
margin-bottom : 60px;
background : #f1f1f1;
position : relative;
}
#clients img {
max-width : 70%;
opacity : 0.800000011920928955078125;
}
#clients img:hover {
max-width : 70%;
opacity : 1;
}
.isotope, .isotope .isotope-item {
transition-duration : 0.8s;
}
.isotope {
transition-property : height, width;
}
.isotope .isotope-item {
transition-property : transform, opacity;
}
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
transition-duration : 0s;
}
#portfoliopage .row {
margin-bottom : 0;
}
.project-nav {
background : #f2f2f2;
padding : 30px 0;
margin-bottom : 20px;
}
.nav-bottom {
margin-bottom : 0;
}
.project-nav a {
font-size : 28px;
margin : 0 20px;
}
#projectslider .owl-prev:before {
content : "\f137";
}
#projectslider .owl-next:before {
content : "\f138";
}
#projectslider .owl-prev, #projectslider .owl-next {
color : #dfdfdf;
margin : 0 10px;
}
#projectslider .owl-buttons {
text-align : center;
}
#blog {
background : #f2f2f2;
}
#blogpage {
padding : 6em 0 0;
}
#blogpage ul, #portfoliopage ul {
list-style-type : none;
margin : 0;
padding : 0;
}
#blogpage a, #portfoliopage a {
color : #000;
text-decoration : none;
transition : all 0.2s 0s linear;
}
#blogpage a:hover, #portfoliopage a:hover {
color : #D9B346;
transition : all 0.2s 0s linear;
}
.post {
margin-bottom : 50px;
padding-bottom : 30px;
padding-left : 70px;
position : relative;
text-align : left;
}
.post .date {
background : none 0 0 repeat scroll #000000;
border-radius : 50%;
color : #FFFFFF;
font-size : 1.6em;
height : 55px;
left : 0;
padding-top : 10px;
position : absolute;
text-align : center;
text-transform : uppercase;
top : 0;
width : 65px;
}
.post-title h2 {
margin-bottom : 10px;
}
.post .date small {
font-size : 0.583333em;
}
.post-media {
margin-bottom : 20px;
position : relative;
}
.post-media img {
width : 100%;
}
.fluid-width-video-wrapper {
padding : 0;
position : relative;
width : 100%;
}
.fluid-width-video-wrapper iframe, .fluid-width-video-wrapper object, .fluid-width-video-wrapper embed {
height : 100%;
left : 0;
position : absolute;
top : 0;
width : 100%;
}
.widget {
margin-bottom : 50px;
text-align : left;
}
.cat-item, .recentcomments {
border-bottom : 1px solid #E9E9E9;
margin-bottom : 15px;
padding-bottom : 8px;
list-style : none;
}
.widget-archive a, .widget-recent-entries a, .widget-projectdetail a {
border-bottom : 1px solid #E9E9E9;
color : #AAAAAA;
display : block;
font-weight : 300;
margin-bottom : 15px;
padding-bottom : 8px;
}
.blogtag a {
border : #D9B346 solid 1px;
border-radius : 3px;
display : inline-block;
margin-bottom : 10px;
margin-right : 10px;
padding : 5px 10px;
text-transform : uppercase;
color : #fff;
}
#tweet {
text-align : center;
margin : 20px 0 0;
font-size : 20px;
color : #fff;
}
#tweet ul {
float : left;
list-style : none outside none;
margin : 0;
padding : 40px 0 20px;
text-align : center;
width : 100%;
}
#tweet ul li {
display : inline-block;
list-style : none;
margin : 0 0 20px;
padding : 0 0 0 34px;
font-size : 20px;
line-height : 1.5em;
}
#tweet ul li:before {
font-family : 'FontAwesome';
speak : none;
font-style : normal;
font-weight : normal;
font-variant : normal;
text-transform : none;
line-height : 1;
content : "\f099";
margin-right : 20px;
}
#tweet a {
color : #D9B346;
text-decoration : none;
}
#contact {
background : #D9B346;
position : relative;
}
.validation {
display : none;
margin : -20px 0 20px;
color : #fff;
font-weight : 700;
font-size : 13px;
}
#sendmessage {
border : #fff solid 1px;
display : none;
text-align : center;
padding : 15px 12px 15px;
margin : 10px 0;
font-weight : 600;
margin-bottom : 30px;
}
#sendmessage.show, .show {
display : block;
}
#contact-form {
position : relative;
z-index : 999;
}
#contact-form input[type="text"], .contactForm textarea {
background : url("../images/23-bg-input.png") 0 0 repeat scroll rgba(255, 255, 255, 0.1);
font-family : 'Open Sans', sans serif;
border : 0;
font-size : 16px;
text-align : left;
vertical-align : middle;
border-radius : 0%;
color : #000;
height : 160px;
box-shadow : none;
}
#contact-form input[type="text"]:focus, .contactForm textarea:focus {
color : #fff;
box-shadow : none;
background : none;
}
#contact-form input[type="text"] {
height : 50px;
margin-bottom : 30px;
}
#contact-form input[type="submit"] {
color : #D9B346;
width : 150px;
height : 50px;
text-shadow : none;
font-size : 16px;
padding : 0.5em;
letter-spacing : 0.05em;
margin : 0 0 20px 0;
display : block;
border : 0;
text-transform : none;
border-radius : 3px;
box-shadow : none;
}
#contact-form input[type="submit"]:hover, #contact-form input[type="submit"]:active {
background : #000 !important ;
}
#contact-form textarea {
padding-top : 1em;
}
div.cform-response-output {
max-width : 60%;
text-align : center;
margin-left : 40% !important ;
margin-top : 0.5em !important ;
padding : 0.5em !important ;
border-radius : 4px;
}
.cform-not-valid-tip {
color : #888;
border : #ad3729 dotted 1px !important ;
width : 100% !important ;
left : 0 !important ;
padding : 0.5em !important ;
font-family : 'Open Sans', sans-serif;
box-sizing : border-box;
border-radius : 4px;
}
.sidecontact {
text-align : center;
margin-top : 0;
margin-right : 0;
margin-bottom : 40px;
margin-left : 0;
}
.sidecontact i {
color : #D9B346;
font-size : 90px;
line-height : 90px;
width : 80px;
height : 80px;
border-radius : 50%;
background : #fff;
text-align : center;
}
.sidecontact h1 {
text-align : center;
font-size : 16px;
font-weight : 400;
color : #fff;
line-height : normal;
}
.popup-btn {
background : #222;
color : #8A8A8A;
display : block;
padding : 30px;
text-align : center;
text-decoration : none;
text-transform : uppercase;
transition : all 0.2s 0s ease-in-out;
width : 100%;
text-decoration : none;
border : none;
}
.popup-btn:hover {
background-color : #f1f1f1;
color : #000;
text-decoration : none;
}
.map-overlay {
background : none 0 0 repeat scroll rgba(131, 113, 161, 0.9);
height : 80%;
left : 0;
opacity : 1;
position : absolute;
top : 0;
transition : all 0.3s 0s linear;
visibility : visible;
width : 100%;
z-index : 99;
}
#map {
height : 94%;
width : 100%;
z-index : 99;
position : absolute;
}
footer {
text-align : center;
color : #5e5e5e;
padding-top : 25px;
padding-right : 0;
padding-bottom : 10px;
padding-left : 0;
}
footer ul.social-networks {
list-style : none;
}
footer ul.social-networks li {
display : inline;
}
footer ul.social-networks li i {
display : inline-block;
}
footer ul.social-networks li a {
color : #5e5e5e;
margin : 0 5px;
}
footer ul.social-networks li a:hover {
text-decoration : none;
transition : all 0.4s ease-in-out;
}
footer ul.social-networks li i.icon-bgdark {
background : #fff;
color : #000;
}
footer ul.social-networks li a i.icon-instagram:hover {
background : #ba7b3d;
color : #fff;
}
footer ul.social-networks li a i.icon-twitter:hover {
background : #5ad2eb;
color : #fff;
}
footer ul.social-networks li a i.icon-dribbble:hover {
background : #f57b71;
color : #fff;
}
footer ul.social-networks li a i.icon-pinterest:hover {
background : #d84848;
color : #fff;
}
i.icon-bglight {
color : #444;
background : #f7f7f7;
}
i.icon-bglight.active {
color : #fff;
}
i.icon-bglight.active:hover {
color : #444;
background : #f7f7f7;
}
i.icon-bgdark {
color : #f7f7f7;
background : #333;
}
i.icon-bgdark:hover {
color : #fff;
}
i.icon-bgdark.active:hover {
color : #f7f7f7;
background : #333;
}
i.icon-square {
display : inline-block;
text-align : center;
width : 24px !important ;
height : 24px !important ;
line-height : 24px !important ;
}
i.icon-square.icon-2x {
width : 48px !important ;
height : 48px !important ;
line-height : 48px !important ;
}
i.icon-square.icon-3x {
width : 72px !important ;
height : 72px !important ;
line-height : 72px !important ;
}
i.icon-square.icon-4x {
width : 96px !important ;
height : 96px !important ;
line-height : 96px !important ;
}
i.icon-square.icon-5x {
width : 120px !important ;
height : 120px !important ;
line-height : 120px !important ;
}
i.icon-rounded {
display : inline-block;
border-radius : 6px !important ;
text-align : center;
width : 24px !important ;
height : 24px !important ;
line-height : 24px !important ;
}
.icon-rounded.icon-2x {
width : 48px !important ;
height : 48px !important ;
line-height : 48px !important ;
}
.icon-rounded.icon-3x {
width : 72px !important ;
height : 72px !important ;
line-height : 72px !important ;
border-radius : 8px !important ;
}
.icon-rounded.icon-4x {
width : 96px !important ;
height : 96px !important ;
line-height : 96px !important ;
border-radius : 10px !important ;
}
.icon-rounded.icon-5x {
width : 120px !important ;
height : 120px !important ;
line-height : 120px !important ;
border-radius : 12px !important ;
}
i.icon-circled {
display : inline-block;
border-radius : 1000px !important ;
text-align : center;
width : 24px !important ;
height : 24px !important ;
line-height : 24px !important ;
background : #D9B346;
color : #000;
}
.icon-circled.icon-2x {
width : 48px !important ;
height : 48px !important ;
line-height : 48px !important ;
}
.icon-circled.icon-3x {
width : 72px !important ;
height : 72px !important ;
line-height : 72px !important ;
}
.icon-circled.icon-4x {
width : 96px !important ;
height : 96px !important ;
line-height : 96px !important ;
}
.icon-circled.icon-5x {
width : 120px !important ;
height : 120px !important ;
line-height : 120px !important ;
}
i.icon-white {
color : #fff;
}
.icon-6x {
font-size : 6em;
}
.icon-6x.icon-border {
border-width : 6px;
border-radius : 8px;
}
.icon-7x {
font-size : 7em;
}
.icon-6x.icon-border {
border-width : 6px;
border-radius : 8px;
}
.icon-8x {
font-size : 8em;
}
.icon-6x.icon-border {
border-width : 6px;
border-radius : 8px;
}
.icon-9x {
font-size : 9em;
}
.icon-6x.icon-border {
border-width : 6px;
border-radius : 8px;
}
.icon-10x {
font-size : 10em;
}
.big-icon {
font-size : 10em;
}
.icon-6x.icon-border {
border-width : 6px;
border-radius : 8px;
}
.btn:visited {
color : #fff;
}
.btn:hover {
background : #000 !important ;
}
.btn-large {
padding : 18px 25px;
font-size : 24px;
border-radius : 0;
}
.btn-large [class^="icon-"], .btn-large [class*=" icon-"] {
margin-top : 4px;
}
.btn-small {
padding : 6px 13px;
font-size : 11.9px;
border-radius : 0;
}
.btn-small [class^="icon-"], .btn-small [class*=" icon-"] {
margin-top : 0;
}
.btn-mini [class^="icon-"], .btn-mini [class*=" icon-"] {
margin-top : -1px;
}
.btn-mini {
padding : 0 6px;
font-size : 10.5px;
border-radius : 0;
}
.btn-flat {
border-radius : 0;
}
.btn-rounded {
border-radius : 20px;
}
.btn-large.btn-rounded {
border-radius : 28px;
}
.navbar-inverse .btn-navbar {
width : auto;
height : auto;
}
#style-switcher div h3 {
color : #1D1D1D;
font-size : 19px;
margin : 8px 3px 12px;
}
#style-switcher {
background : none 0 0 repeat scroll #FFFFFF;
box-shadow : 2px 2px 0 0 rgba(0, 0, 0, 0.08);
left : -189px;
position : fixed;
top : 17%;
width : 195px;
z-index : 9999;
}
#style-switcher div {
padding : 5px 10px;
}
#style-switcher .bottom {
background : none 0 0 repeat scroll #FFFFFF;
color : #252525;
padding : 0;
}
#style-switcher .bottom a.settings {
background : none 0 0 repeat scroll #FFFFFF;
box-shadow : 2px 2px 0 0 rgba(0, 0, 0, 0.08);
display : block;
height : 41px;
position : absolute;
right : -40px;
bottom : 0;
width : 40px;
padding : 3px;
}
#style-switcher .bottom a.settings i {
margin-left : 1px;
margin-top : 3px;
color : #000;
font-size : 28px;
line-height : 30px;
}
#style-switcher select {
background : none 0 0 repeat scroll #F6F6F6;
border : #FFFFFF solid 1px;
line-height : 1;
margin-bottom : 10px;
padding : 5px 10px;
width : 150px;
}
.variant {
background : #000;
}
ul.colors {
list-style : none outside none;
margin : 0 0 10px;
overflow : hidden;
padding : 0;
}
ul.colors li {
float : left;
margin : 2px;
}
ul.colors li a {
cursor : pointer;
display : block;
height : 35px;
width : 35px;
border-radius : 4px;
}
ul.colors .color0 {
background : none 0 0 repeat scroll #D9B346;
}
ul.colors .color1 {
background : none 0 0 repeat scroll #73E0B8;
}
ul.colors .color2 {
background : none 0 0 repeat scroll #74AFAD;
}
ul.colors .color3 {
background : none 0 0 repeat scroll #8777A1;
}
ul.colors .color4 {
background : none 0 0 repeat scroll #DA4C42;
}
ul.colors .color5 {
background : none 0 0 repeat scroll #E8A03B;
}
ul.colors .color6 {
background : none 0 0 repeat scroll #8EA83B;
}
ul.colors .color7 {
background : none 0 0 repeat scroll #FFD801;
}
ul.colors .color8 {
background : none 0 0 repeat scroll #BDB372;
}
ul.colors .color9 {
background : none 0 0 repeat scroll #35BCD2;
}
ul.colors .color10 {
background : none 0 0 repeat scroll #95a57c;
}
ul.colors .color11 {
background : none 0 0 repeat scroll #c89b6a;
}
ul.colors li a.active {
position : relative;
}
ul.colors li a.active:after {
color : #fff;
content : "\f00c";
font-family : "FontAwesome";
font-size : 10px;
right : 12px;
position : absolute;
top : 9px;
}
@media only screen and (max-width:479px) {
#style-switcher {
display : none;
}
}
@media (min-width:768px) and (max-width:979px) {
body {
padding-left : 0;
padding-right : 0;
padding : 0;
}
.navbar-inner {
padding-right : 20px;
padding-left : 20px;
}
.navbar-inner h1.brand {
margin-left : 20px;
}
.navbar-inner .btn-navbar {
margin : 20px 20px 0;
}
.navbar .nav > li {
height : 50px;
}
ul#menu-main > li > a {
line-height : 32px;
}
#main-flexslider ul.slides li p, #main-portfoliopage p, #main-blogpage p {
font-size : 42px;
}
.container {
padding-right : 20px;
padding-left : 20px;
}
.navbar-inverse .navbar-inner {
padding : 0 0 20px;
}
.nav-collapse {
text-align : center;
width : 100%;
}
.collapse.in {
padding : 20px 0 5px;
}
}
@media (max-width:767px) {
body {
padding-left : 0;
padding-right : 0;
padding : 0;
}
.navbar-inner {
padding-right : 20px;
padding-left : 20px;
}
.navbar-inverse .navbar-inner {
padding : 0 0 20px;
}
.navbar-inner h1.brand {
margin-left : 20px;
}
.navbar-inner .btn-navbar {
margin : 20px 20px 0;
}
#header-wrapper .span12 h1 {
font-size : 38px;
line-height : 42px;
}
.texteffect {
font-size : 24px !important ;
}
.container {
padding-right : 20px;
padding-left : 20px;
}
.navbar .nav > li {
height : 50px;
}
ul#menu-main > li > a {
line-height : 32px;
}
#main-flexslider ul.slides li p, #main-portfoliopage p, #main-blogpage p {
font-size : 42px;
}
.nav-collapse {
text-align : center;
width : 100%;
}
#portfolio-wrap .portfolio-item {
width : 50%;
}
.left-img {
display : none;
}
.TabsPage .sp .tabs {
height : auto;
}
}
@media (max-width:480px) {
#header-wrapper .span12 h1 {
font-size : 28px;
line-height : 32px;
}
.texteffect {
font-size : 24px !important ;
}
.navbar .nav > li {
height : 50px;
}
ul#menu-main > li > a {
line-height : 32px;
}
#main-flexslider ul.slides li p, #main-portfoliopage p, #main-blogpage p {
font-size : 26px;
}
.TabsPage .sp .tabs {
height : auto;
}
.left-img {
display : none;
}
#portfolio-wrap .portfolio-item {
width : 100%;
}
}
@media only screen and (min-device-width:320px) and (max-device-width:480px) {
section.section {
padding : 1em 0;
}
#works .container {
top : 0 !important ;
}
.max-img {
width : 100%;
}
.max-img {
margin-right : auto;
margin-left : auto;
display : block;
}
section#services h2 {
margin-bottom : 0.25em;
}
section#services h2, section#services ul {
text-align : center;
}
.navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
margin-left : auto;
margin-right : auto;
}
#main-flexslider ul.slides li p, #main-portfoliopage p, #main-blogpage p {
font-size : 28px;
}
#contact-form {
overflow : hidden;
}
#contact-form input[type="submit"] {
width : 100%;
}
}
.table-font1 {
font-family : Calibri;
font-size : 15px;
color : #ffffff;
}
.table-font2 {
font-family : Calibri;
font-size : 18px;
color : #000000;
font-weight : bold;
}
.table-font3 {
font-family : Calibri;
font-size : 20px;
color : #ffffff;
}
.footer-main {
width : 100%;
height : auto;
float : left;
}
.footer-image {
float : left;
width : 20%;
height : auto;
text-align : center;
}
.footer-image1 {
float : left;
width : 18%;
height : auto;
margin-left : 45px;
text-align : center;
}
.tb1 {
width : 100%;
}
.tb2 {
width : 80%;
border : #000 solid 1px;
}
.tb3 {
width : 3%;
}
.tb4 {
width : 11%;
}
.td1 {
text-align : center;
background-color : #e3cfcf;
border : #000 solid 1px;
padding: 4px;
}

.td2 {
background-color : #f3f1f1;
border : #000 solid 1px;
padding:2px;
/*! padding-left: 15px; */
	
}
.td3 {
vertical-align : top;
}
.td4 {
text-align : right;
}
.client-main
{
	width:100%;
	height:auto;
	float:left;
}
.client-img
{
	width:20%;
	height:auto;
	float:left;
}
.client-text
{
	width:30%;
	height:auto;
	float:left;
	
}
.product-main
{
	width:100%;
	height:auto;
	float:left;
}
.product-image1
{
	width:50%;
	height:auto;
	float:left;
}
.product-image2
{
	width:50%;
	height:auto;
	float:left;
}
.img-test
{
	width:41%;
	height:auto;

}
.img-test1
{
	width:82%;
	height:auto;	
}
.readmore-button
{
		width:80px;
		height:40px;
		padding:10px 23px 10px 23px;
		border:2px solid #000000;
		border-radius:10px;
}
.readmore-button:hover
{
		width:80px;
		height:40px;
		padding:10px 23px 10px 23px;
		border-radius:10px;
		background-color:#f3585e;
		color:#ffffff;
		text-decoration:none;
		transition-duration:800ms;
}


/* Custom CSS Styles */
#cssmenu-1 {
  width: 291px;
  background: #fcfcfc;
 font-family: 'Questrial-Regular';
  zoom: 1;
  font-size: 29px;
  border-top: 4px solid #838487;
}
#cssmenu-1:before {
  content: '';
  display: block;
}
#cssmenu-1:after {
  content: '';
  display: table;
  clear: both;
}
#cssmenu-1 a {
  display: block;
  padding: 15px 12px;
  color: #ffffff;
  text-decoration: none;
  /*! text-transform: uppercase; */
  border-top: 1px dotted #838487;
  font-size: 16px;
  line-height: 20px;
}
#cssmenu-1 > ul {
  width: 290px;
}
#cssmenu-1 ul ul {
  width: 324px;
}
#cssmenu-1 > ul > li > a {
  /*! border-right: 4px solid #009ade; */
  color: #2d2d2d;
  transition: all 0.8s ease-in;
}
#cssmenu-1 > ul > li > a:hover {
  color: #ffffff;
  padding-left: 6px;
}
#cssmenu-1 > ul > li.active a {
  background: #ededed;
}
#cssmenu-1 > ul > li a:hover,
#cssmenu-1 > ul > li:hover a {
  /*background: #403f42;*/
  color:#2d2d2d;
}
#cssmenu-1 li {
  position: relative;
  list-style: none;
}
#cssmenu-1 ul li.has-sub > a:after {
  content: '+';
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -6px;
}
#cssmenu-1 ul ul li.first {
  -webkit-border-radius: 0 3px 0 0;
  -moz-border-radius: 0 3px 0 0;
  border-radius: 0 3px 0 0;
}
#cssmenu-1 ul ul li.last {
  -webkit-border-radius: 0 0 3px 0;
  -moz-border-radius: 0 0 3px 0;
  border-radius: 0 0 3px 0;
  border-bottom: 0;
}
#cssmenu-1 ul ul {
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
}
#cssmenu-1 ul ul {
  border: 1px dotted;
  background-color: #eee;
}
#cssmenu-1 ul ul a {
  font-size: 15px;
  color: #ffffff;
  text-align: center;
  border: none;
  border-bottom: 1px dotted;
}
#cssmenu-1 ul ul a:hover {
  color: #ffffff;
}
#cssmenu-1 ul ul li {
  border-bottom: 1px solid #efefef;
}
#cssmenu-1 ul ul li:hover > a {
  background: #d22e35;
  color: #ffffff;
  transition: all 0.8s ease-in;
}
#cssmenu-1.align-right > ul > li > a {
  border-left: 4px solid #1b9bff;
  border-right: none;
}
#cssmenu-1.align-right {
  float: right;
}
#cssmenu-1.align-right li {
  text-align: right;
}
#cssmenu-1.align-right ul li.has-sub > a:before {
  content: '+';
  position: absolute;
  top: 50%;
  left: 15px;
  margin-top: -6px;
}
#cssmenu-1.align-right ul li.has-sub > a:after {
  content: none;
}
#cssmenu-1.align-right ul ul {
  visibility: hidden;
  position: absolute;
  top: 0;
  left: -100%;
  z-index: 598;
  width: 100%;
}
#cssmenu-1.align-right ul ul li.first {
  -webkit-border-radius: 3px 0 0 0;
  -moz-border-radius: 3px 0 0 0;
  border-radius: 3px 0 0 0;
}
#cssmenu-1.align-right ul ul li.last {
  -webkit-border-radius: 0 0 0 3px;
  -moz-border-radius: 0 0 0 3px;
  border-radius: 0 0 0 3px;
}
#cssmenu-1.align-right ul ul {
  -webkit-border-radius: 3px 0 0 3px;
  -moz-border-radius: 3px 0 0 3px;
  border-radius: 3px 0 0 3px;
}

@media only screen and (max-width: 480px) {
#cssmenu-1
{
	display:none;
}
}