/*
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
*/
/* 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,dl,dt,dd,ol,nav ul,nav 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;margin:0;padding:0;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
.vertical-top{ vertical-align:top;}/* vertical align top */
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
nav.vertical ul li{ display:block;}/* vertical menu */
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/
body{
font-family:Arial, Helvetica, sans-serif;
}
.header{
background: url(../images/banner.jpg) no-repeat center top;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-position: center;
background-size: 100% 100%;
}
.logo{
background:#373645;
text-align:center;
padding: 2px 0;
}
.header-top{
padding:10px;
}
/*--menu--*/
.drp-dwn select {
padding:4px;
outline: none;
display: block!important;
width:100%;
border: none;
background:#373645;
color: #FFF;
cursor: pointer;
font-size: 0.8125em;
float: right;
}
/**** Slider *****/
div.banner-wrap {
padding: 20px 0;
}
.slider-left h1{
color: #FFF;
font-size: 0.8125em;
text-transform: uppercase;
font-weight: bold;
line-height: 0.8em;
}
.slider-left{
float: left;
width: 38.5%;
margin: 0 0 0 20px;
}
.button{
margin-top:5%;
}
.button a{
border: none;
color: #FFF;
cursor: pointer;
padding: 3px 5px;
float: right;
font-size:12px;
outline: none;
text-transform: uppercase;
background: #6E9BCA;
text-decoration: none;
-webkit-appearance: none;
}
.button a:hover{
color:#6E9BCA;
background:#fff;
}
/*--about--*/
.main{
background:#fff;
}
.about{
padding:20px 10px;
}
ul.about-top{
border-top: 2px solid #373645;
border-bottom: 2px solid #6E9BCA;
padding: 5px 0;
list-style: none;
}
ul.about-top li h2{
text-transform: uppercase;
color: #373645;
font-weight: bold;
font-size:1em;
margin-bottom: 0;
padding-right: 15%;
}
ul.about-top li p{
color: #CFCFCF;
text-transform: uppercase;
font-size:12px;
padding:10px 0;
}
.about-btn a {
border: none;
color: #FFF;
cursor: pointer;
padding: 5px 7px;
float: right;
font-size:12px;
outline: none;
text-transform: uppercase;
background: #6E9BCA;
text-decoration: none;
-webkit-appearance: none;
}
.about-btn a:hover {
background:#457db7;
}
/*--services--*/
.m_3 {
text-align: center;
position: relative;
width: 92%;
margin: 0 auto;
}
span.left_line1 {
height: 1px;
width: 26%;
display: block;
background: url(../images/border1.png) no-repeat 0px 0px;
position: absolute;
left: -1%;
bottom:10px;
}
span.right_line1 {
height: 1px;
width: 30%;
display: block;
background: url(../images/border1.png) no-repeat 0px 0px;
position: absolute;
right: -1%;
bottom: 10px;
}
.m_3 h3{
text-transform: uppercase;
color: #373645;
font-weight: bold;
font-size:1em;
margin-bottom: 0;
}
i.web{
width: 80px;
height: 80px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -494px -35px;
}
i.app{
width: 70px;
height: 100px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -675px -27px;
}
i.php{
width: 100px;
height: 100px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -48px -155px;
}
i.wordpress{
width: 90px;
height: 90px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -225px -160px;
}
h3.m_4{
font-size:0.8125em;
text-transform:uppercase;
color:#373645;
margin: 5px 0px;
}
p.m_5{
color:#B9B9B9;
text-transform: uppercase;
font-size:11px;
}
.service_grids{
padding:20px 10px;
}
.service_grid1{
margin-bottom:20px;
text-align: center;
}
.service_grid2{
text-align: center;
}
.service-btn{
margin-top:10px;
}
.service-btn a {
border: none;
color: #FFF;
cursor: pointer;
padding:5px 7px;
font-size:12px;
outline: none;
text-transform: uppercase;
background: #6E9BCA;
text-decoration: none;
-webkit-appearance: none;
}
.service-btn a:hover {
background: #457DB7;
}
/*--projects--*/
.project_top{
background: url(../images/pattern.jpg);
padding:20px 0;
margin-top: 1.5%;
}
.project_grid{
margin-bottom:20px;
text-align: center;
}
.project_grid1{
text-align: center;
}
.project_desc{
background: #FFF;
text-align: center;
padding: 10px 10px 4px 10px;
border-bottom: 1px solid #000;
}
.project_desc h3{
color: #000;
font-size: 0.85em;
text-transform: uppercase;
font-weight: bold;
}
.project_desc p{
color: #E84C3D;
font-size: 11px;
text-transform: uppercase;
font-weight: 600;
margin: 5px 0 0;
}
i.dating{
width: 90px;
height: 90px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -418px -182px;
}
i.wedding{
width: 90px;
height: 90px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -605px -178px;
}
i.travel{
width: 90px;
height: 100px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -41px -332px;
}
i.ecommerce{
width: 90px;
height: 90px;
display: inline-block;
background: url(../images/img-sprite.png)no-repeat -204px -338px;
}
p.blue{
color:#9b58b5;
}
p.green{
color:#1bbc9b;
}
p.dark{
color:#3598db;
}
.project-btn a {
border: none;
color: #FFF;
cursor: pointer;
padding: 5px 10px;
font-size:12px;
outline: none;
text-transform: uppercase;
background:#373645;
text-decoration: none;
-webkit-appearance: none;
}
.project-btn a:hover {
background:#000;
}
/*--team--*/
.team{
background:#fff;
padding:20px 10px;
}
.jcarousel ul li{
margin-bottom:20px;
}
div.jcarousel {
text-align: center;
}
h4.m_5 a{
color: #000;
font-size:0.85em;
text-transform: uppercase;
text-decoration:none;
}
h4.m_5 a:hover{
color:#6e9bca;
}
p.m_6{
color: #B9B9B9;
text-transform: uppercase;
font-size: 11px;
line-height: 1.5em;
margin-bottom: 10px;
}
.social_networks{
text-align: center;
display: inline-flex;
margin-top: 20px;
}
.social_networks ul{
width: 0px !important;
}
.social_networks ul li{
display: inline-block;
width: 0px !important;
min-height: 0 !important;
margin: 0 !important;
}
.social_networks li:first-child {
margin-left: 0;
}
i.facebook:hover, i.twitter:hover, i.linked_in:hover, i.skype:hover, i.google:hover, i.be:hover{
opacity:0.9;
}
i.facebook {
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -16px -21px #6E9BCA;
margin-right:5px;
cursor:pointer;
}
i.twitter {
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -64px -19px #6E9BCA;
margin-right:5px;
cursor:pointer;
}
i.linked_in {
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -123px -19px #6E9BCA;
margin-right:5px;
cursor:pointer;
}
i.skype {
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -357px -365px #6E9BCA;
margin-right:5px;
cursor:pointer;
}
i.google{
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -403px -364px #6E9BCA;
margin-right:5px;
cursor:pointer;
}
i.be{
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat -452px -358px #6E9BCA;
cursor: pointer;
}
/*--news--*/
.news_left{
background: #FFF;
padding: 10px;
margin: 20px 10px;
}
ul.news_list{
padding:0;
list-style:none;
}
.date {
line-height: 0.7em;
font-size: 0.8125em;
font-weight: bold;
color: #000;
text-align: center;
text-transform: uppercase;
}
span.highlight {
display: inline-block;
font-size:25px;
line-height:30px;
color: #6E9BCA;
font-weight: bold;
}
ul.news_list li.date{
float: left;
width: 15.5%;
border-right: 1px solid #ccc;
padding-right: 3%;
margin: 0 4% 0% 0;
}
span.light_color{
color: #B9B9B9;
text-transform: uppercase;
font-size:11px;
}
li.date_desc{
float: left;
width:75.5%;
}
ul.list_img{
list-style:none;
}
ul.list_img li.list_img_left{
float: left;
width: 18.5%;
margin-right: 2%;
}
ul.list_img li.hours{
color: #B9B9B9;
float: right;
text-transform: uppercase;
font-size:12px;
}
.extra {
color: #4D606E;
font-size:12px;
line-height: 1.5em;
font-weight: 600;
text-transform: uppercase;
}
time{
color:#B9B9B9;
}
span.username {
color: #000;
}
a.comment_count {
text-decoration: none;
color:#6E9BCA;
}
a.comment_count:hover {
color:#000;
}
i.audio{
width: 30px;
height: 30px;
display: inline-block;
background: url(../images/img-sprite.png) no-repeat -647px -358px;
}
i.video{
width: 34px;
height: 30px;
display: inline-block;
background: url(../images/img-sprite.png) no-repeat -703px -359px;
}
.extra_bottom {
margin-top:10px;
}
ul.news_list li.comment_section {
border-right: 1px solid #CCC;
margin-right: 4%;
padding-right: 3%;
}
i.comment1{
width: 45px;
height: 40px;
display: inline-block;
background: url(../images/img-sprite.png) no-repeat -29px -481px;
}
i.comment2{
width: 45px;
height: 40px;
display: inline-block;
background: url(../images/img-sprite.png) no-repeat -94px -477px;
}
i.comment3{
width: 45px;
height: 40px;
display: inline-block;
background: url(../images/img-sprite.png) no-repeat -165px -479px;
}
h4.m_7{
color:#000;
font-size:0.85em;
text-transform:uppercase;
}
ul.news_bottom{
list-style:none;
padding:0;
margin-top:20px;
}
p.m_8{
color: #B9B9B9;
text-transform: uppercase;
font-size:12px;
margin: 10px 0;
}
.news-btn a {
border: none;
color: #FFF;
cursor: pointer;
padding: 5px 10px;
font-size:0.8125em;
outline: none;
float:right;
background: #373645;
text-decoration: none;
-webkit-appearance: none;
}
.news-btn a:hover{
background: #6E9BCA;
color:#fff;
}
.clients{
padding:20px 0;
background:#fff;
}
/*--clients--*/
ul#flexiselDemo3 li{
width:38%;
float: left;
margin: 10px;
}
/**--footer--*/
.footer{
background:#373645;
padding:20px 10px 0 10px;
}
.footer-logo a{
text-decoration:none;
}
.footer-logo {
margin-bottom: 20px;
}
.social_footer{
margin-bottom: 20px;
}
.social_footer li:first-child {
margin-left: 0;
}
.social_footer li {
display: inline-block;
}
.social_footer li a {
display: block;
background: #6E9BCA;
}
.social_footer li a:hover{
background:#4775A3;
}
.social_footer li a i.f-fb {
background-position: -16px -21px;
}
.social_footer li a i {
width: 25px;
height: 25px;
display: block;
background: url(../images/img-sprite.png) no-repeat;
}
.social_footer li a i.f-tw {
background-position:-64px -19px;
}
.footer-search input[type="submit"] {
background: url('../images/msg.png') no-repeat 8px 6px #FFF;
padding: 7px 20px;
cursor: pointer;
position: absolute;
line-height: 1.5em;
border: 1px solid #DBDBDB;
outline: none;
-webkit-appearance: none;
}
.social_footer li a i.f-in {
background-position:-123px -19px;
}
.social_footer li a i.f-skype {
background-position:-357px -365px;
}
.social_footer li a i.f-google {
background-position:-403px -364px;
}
.social_footer li a i.f-be{
background-position:-452px -358px;
}
ul.newsletter{
list-style:none;
padding:0;
}
ul.newsletter h3{
text-transform: uppercase;
color: #6E9BCA;
font-weight: bold;
font-size:1em;
margin-bottom: 0;
}
ul.newsletter p{
color: #F0F0F0;
font-size: 0.8125em;
line-height: 1.5em;
margin: 4px 0 10px;
}
.footer-search input[type="text"] {
outline: none;
padding: 8px;
outline: none;
color: #202020;
background: #FFF;
border: none;
width: 70.33%;
line-height: 1.5em;
font-size: 0.8125em;
-webkit-appearance: none;
}
.m_12 h4 {
text-transform: uppercase;
color:#6e9bca;
font-weight: bold;
font-size:0.8125em;
margin-bottom: 0;
}
.m_12 {
text-align: center;
position: relative;
width: 92%;
margin: 0 auto;
}
li.footer-search {
margin-bottom: 20px;
}
span.left_line2 {
height: 1px;
width: 16%;
display: block;
background: url(../images/border1.png) no-repeat 0px 0px;
position: absolute;
left: -1%;
bottom: 20px;
}
span.right_line2 {
height: 1px;
width:16%;
display: block;
background: url(../images/border1.png) no-repeat 0px 0px;
position: absolute;
right: -1%;
bottom:20px;
}
.footer_bottom{
background: url(../images/footer_pattern.jpg);
padding:20px 10px;
}
.footer_grid{
margin-bottom:20px;
}
p.m_13{
color:#ccc;
font-size:0.85em;
line-height:1.5em;
margin-bottom:10px;
}
.address p{
color: #CCC;
font-size: 0.8125em;
line-height: 1.5em;
font-weight: 600;
}
.address h4{
color:#ccc;
font-size:1em;
font-weight:bold;
margin-bottom: 5px;
}
span.phno{
color:#6E9BCA;
font-size:14px;
font-weight:bold;
}
.address p span.email{
cursor:pointer;
font-size:13px;
}
.address p span.email:hover{
text-decoration:underline;
}
.copy{
text-align:center;
margin-top:20px;
}
.copy p a{
color:#6E9BCA;
}
.copy p a:hover{
text-decoration:underline;
}
.copy p{
color:#ccc;
font-size:0.85em;
font-weight:600;
}