/*
Template: SquarePixels
Platform: HTML/CSS/JQuery (not a WordPress Theme therefore you can't install it like WordPress theme)
Version: 1.0
Release Date: 09.05.2013
Author: trendyWebStar
_____________________________________________________________
TABLE OF CONTENT *
_____________________________________________________________
01 - Reset CSS
02 - Font Face
03 - Body Elements (HEADER, FOOTER, BODY ELEMENTS, NAVIGATION, GRID ...)
04 - Team members, Skills, Newsletter Signup, Search, Call To Action, Search DropDown, Tooltips
05 - Carousel & Testimonials Slider, Clients
06 - Forms
07 - Portfolio layouts
08 - Blog Layout
10 - Pricing Tables
11 - Buttons
12 - Other Body Elements
13 - Widgets (Twitter,Dribbble, Flickr, Instagram)
14 - Tabs & Accordions
15 - Dropcaps
16 - Error Messages
17 - Lists
18 - Social Widget
19 - Colored Icons
20 - Other Features Elements
_____________________________________________________________
TABLE OF CONTENT ENDS *
_____________________________________________________________
_____________________________________________________________
01-RESET CSS *
_____________________________________________________________*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,and,address,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,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,input,textarea,select{background:transparent;border:0;font-size:100%;margin:0;outline:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}del{text-decoration:line-through}hr{background:transparent;border:0;clear:both;color:transparent;height:1px;margin:0;padding:0}mark{background-color:#ffffb3;font-style:italic}input,select{vertical-align:middle}ins{background-color:red;color:white;text-decoration:none}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}
/* Clearfix */
.clear{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}* html .clearfix,:first-child+html .clearfix{zoom:1}
/*_____________________________________________________________
02-FONT FACE
_____________________________________________________________*/
@font-face {
font-family: 'linecons';
src: url('font-linecons/linecons.eot');
src: url('font-linecons/linecons.eot?') format('embedded-opentype'),
url('font-linecons/linecons.woff') format('woff'),
url('font-linecons/linecons.ttf') format('truetype'),
url('font-linecons/linecons.svg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSansLight';
src: url('main-fonts/OpenSans-Light-webfont.eot');
src: url('main-fonts/OpenSans-Light-webfont.eot?') format('embedded-opentype'),
url('main-fonts/OpenSans-Light-webfont.woff') format('woff'),
url('main-fonts/OpenSans-Light-webfont.ttf') format('truetype'),
url('main-fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSansRegular';
src: url('main-fonts/OpenSans-Regular-webfont.eot');
src: url('main-fonts/OpenSans-Regular-webfont.eot?') format('embedded-opentype'),
url('main-fonts/OpenSans-Regular-webfont.woff') format('woff'),
url('main-fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
url('main-fonts/OpenSans-Regular-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSansBold';
src: url('main-fonts/OpenSansBold-webfont.eot');
src: url('main-fonts/OpenSansBold-webfont.eot?') format('embedded-opentype'),
url('main-fonts/OpenSansBold-webfont.woff') format('woff'),
url('main-fonts/OpenSansBold-webfont.ttf') format('truetype'),
url('main-fonts/OpenSansBold-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/*_________________________________________________________________________
03-BODY ELEMENTS (HEADER, FOOTER, BODY ELEMENTS, NAVIGATION, GRID ...)
_____________________________________________________________________________*/
body {
background: #FFF;
color: #898989;
font-family: 'OpenSansRegular', 'Lucida Grande', sans-serif;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
line-height: 22px;
font-size: 12px;
}
img {
max-width: 100%;
height: auto;
}
strong { font-family: "OpenSansBold", Arial }
blockquote {
float: left;
width: 60%;
margin: 30px 15px 30px 0px;
color: #aaa;
background: url(../images/icons/quote-2.png) left no-repeat;
font: 16px/17px Georgia, Arial, sans-serif;
font-weight: normal;
font-style: italic;
padding-left: 40px;
}
blockquote.right {
float: right;
margin: 10px 0 15px 15px;
}
blockquote p {
padding-left: 15px;
line-height: 22px;
}
textarea {
overflow: auto;
vertical-align: top;
}
fieldset {
border: 0;
margin: 0;
padding: 0;
}
legend {
border: 0;
*margin-left: -7px;
padding: 0;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box
}
input[type="search"] {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
cursor: pointer;
-webkit-appearance: button;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
button,
input {
line-height: normal;
*overflow: visible;
}
button {
width: auto;
overflow: visible;
}
button,
input,
select,
textarea {
font-size: 100%;
margin: 0;
vertical-align: baseline;
*vertical-align: middle;
}
code,
pre {
display: block;
clear: both;
overflow: auto;
padding: 10px;
text-align: left;
white-space: pre;
line-height: 18px;
margin: 20px 0;
background-color: #ebebeb;
}
body.empty-space { margin-top: 85px }
.img-align-left {
float: left;
margin: 0px 10px 10px 0px;
}
a,
a > * {
color: #898989;
text-decoration: none;
}
a:hover { text-decoration: none }
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover { color: #65778c }
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a { text-decoration: underline }
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: normal;
font-variant: normal;
white-space: normal;
color: #707070;
margin-bottom: 10px;
font-family: 'Lucida Grande',Arial,Verdana, serif;
}
h1 {
font-size: 28px;
line-height: 32px;
}
h2 {
font-size: 24px;
line-height: 32px;
}
h3 {
font-size: 18px;
line-height: 30px;
}
h4 {
font-size: 18px;
line-height: 24x;
}
h5 {
font-size: 16px;
line-height: 22px;
}
h6 {
font-size: 14px;
line-height: 22px;
}
header {
height: auto;
width: 100%;
float: left;
margin: 50px 0 0 0;
}
#pre-header-panel {
width: 100%;
height: auto;
float: left;
border-bottom: 1px solid #ebebeb;
padding: 0;
}
ul#top-links {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
ul#top-links li {
float: left;
margin-right: 10px;
margin-top: 3px;
}
ul#top-links li a {
font-size: 11px;
line-height: 25px;
}
ul#top-links li a:hover { color: #3051c6 }
ul#top-links li i { margin-right: 5px }
form { margin: 0 }
ul.header-social-icons {
float: right;
list-style: none;
margin-top: 0px;
}
ul.header-social-icons li {
float: left;
border-right: 1px solid #ebebeb;
}
ul.header-social-icons li:first-child { border-left: 1px solid #ebebeb }
ul.header-social-icons li a {
float: left;
width: auto;
height: 27px;
text-align: center;
-webkit-transition: all 0.45s ease-out;
-moz-transition: all 0.45s ease-out;
-o-transition: all 0.45s ease-out;
-ms-transition: all 0.45s ease-out;
transition: all 0.45s ease-out;
padding: 5px 7px 0px 7px;
font-size: 12px;
}
ul.header-social-icons li a span {
font-size: 11px;
margin-left: 5px;
margin-right: 5px;
}
ul.header-social-icons li a:hover span {
font-size: 11px;
color: #FFF;
}
ul.header-social-icons li a.twitter:hover { background: #46d4fe }
ul.header-social-icons li a.facebook:hover { background: #37589b }
ul.header-social-icons li a.googleplus:hover { background: #de5a49 }
ul.header-social-icons li a.linkedin:hover { background: #419cca }
ul.header-social-icons li a.viadeo:hover { background: #717171 }
ul.header-social-icons li a.dribbble:hover { background: #c8346c }
ul.header-social-icons li a.skype:hover { background: #00abeb }
ul.header-social-icons li a:hover i { color: #FFF }
#header-bg{
float:left;
width:100%;
height: auto;
background: #FFF;
}
#content{float:left;position:relative;margin:0px 0 50px 0;width:100%;}
#wrapper{float:left;width:100%;background:#f5f5f5;}
#header-container{ border-bottom:1px solid #e3e3e3;padding-bottom:30px;float:left;width: 100%;}
a#logo {
float:left;
display:block;
background: url("../images/skins/blue-corporate/logo.png") no-repeat;
width: 270px;
height: 85px;
text-indent:-9999px;
margin-left:-40px;
margin-top:-20px;
}
.logo-wrapper{margin-top:0px;}
.logo-wrapper-2{margin-top:-10px;}
.home-icon-features{ margin-bottom:10px;line-height:20px;vertical-align:middle}
.home-icon-features img{float:left;margin-right:10px;width:20px;}
.home-img-features{
width:40px;
height:40px;
margin-right:20px;
margin-top:20px;
float:left;
display:block;
}
.home-txt-features{
float:left;
width:190px;
}
/*___________________________*/
/*MAIN NAVIGATION*/
/*___________________________*/
#main-navigation select { display: none }
#main-navigation select {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #eee;
cursor: pointer;
width: 400px;
padding: 10px 5px;
margin: 0px 0 30px 0;
box-shadow: 0 0 0 rgba();
color: #676767;
float: left;
}
#navigation-wrapper { float: right }
#main-navigation ul {
margin: -20px 0 0 0;
padding: 0px 0;
list-style-type: none;
float: right;
}
#main-navigation ul li:hover { visibility: inherit }
#main-navigation ul li {
position: relative;
display: inline;
float: left;
text-align: center;
}
#main-navigation ul li:last-child { background: none }
#main-navigation ul li a {
color: #898989;
line-height: 30px;
text-transform: uppercase;
display: block;
overflow: hidden;
padding: 10px 15px 10px 15px;
margin: 0px 0px 0px 0px;
font-size: 14px;
font-weight: 300;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
#main-navigation ul li a.active-page .nav_icon,
#main-navigation ul li:hover a .nav_icon { color: #FFF }
#main-navigation ul li a .nav_icon {
display: inline-block;
font-size: 30px;
color: #636466;
line-height: 0;
width: 100%;
text-align: center;
}
#main-navigation ul li { margin-right: 0px }
#main-navigation ul li:last-child { margin-right: 0px }
#main-navigation ul li a.active-page,
#main-navigation ul li a.active-page:hover {
color: #FFF;
background: #3051c6!important;
}
#main-navigation ul li:hover a {
color: #FFF;
background: #323232;
}
#main-navigation ul ul {
position: absolute;
top: -9999em;
width: 230px;
z-index: 99999;
background: #323232;
}
#main-navigation ul ul li a { text-transform: capitalize }
#main-navigation ul ul li { width: 100% }
#main-navigation ul li:hover ul {
left: 0;
top: 88px;
}
#main-navigation ul li:hover li ul { top: -9999em }
#main-navigation ul li li:hover ul {
left: 215px;
top: 0;
}
#main-navigation ul ul {
padding: 0;
margin: 0;
}
#IE #main-navigation ul ul {
margin-top:-3px;
}
#main-navigation ul ul li {
float: left;
line-height: 20px;
font-size: 12px;
}
#main-navigation ul ul li a {
background: #323232 url("../images/nav-arrow.png") -50px 40% no-repeat!important;
font-size: 12px;
padding: 10px 15px;
text-transform: uppercase;
margin: 0px;
line-height: 20px;
color: #898989!important;
font-weight: normal;
border-bottom: solid 1px #414141;
text-align: left;
}
#main-navigation ul ul li a:hover {
background:#3051c6 url("../images/nav-arrow.png") 10px 50% no-repeat!important;
color:#FFF!important;
padding-left: 25px;
}
#main-navigation ul li li:hover ul li a { border-bottom: solid 1px #414141!important }
#main-navigation ul ul li:last-child a { border-bottom: none }
/*___________________________________________________________________________*/
/* MAIN NAVIGATION VERSION 1 STICKY NAVIGATION */
/*___________________________________________________________________________*/
#header-wrapper.sticky .logo-wrapper { margin-top: 15px }
#header-wrapper.sticky #header-container {
border-bottom: none;
padding-bottom: 0px;
}
#header-wrapper.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #FFF;
box-shadow: 0 0 7px rgba(0,0,0,0.25);
z-index: 999;
padding: 15px 0 10px 0;
}
#header-wrapper.sticky #main-navigation ul { margin: -20px 0 0 0 }
#header-wrapper.sticky #main-navigation ul li:hover ul {
left: 0;
top: 142px;
}
#header-wrapper.sticky #main-navigation ul li a .nav_icon {
display: inline-block;
font-size: 20px;
color: #636466;
line-height: 0;
width: 100%;
text-align: center;
}
#header-wrapper.sticky #main-navigation ul ul {
position: absolute;
top: -9999em;
width: 230px;
z-index: 99999;
background: #323232;
}
#header-wrapper.sticky #main-navigation ul li a.active-page .nav_icon,
#header-wrapper.sticky #main-navigation ul li:hover a .nav_icon { color: #FFF }
#header-wrapper.sticky #main-navigation ul ul li a { text-transform: capitalize }
#header-wrapper.sticky #main-navigation ul ul li { width: 100% }
#header-wrapper.sticky #main-navigation ul li:hover ul {
left: 0;
top: 80px;
}
#header-wrapper.sticky #main-navigation ul li:hover li ul { top: -9999em }
#header-wrapper.sticky #main-navigation ul li li:hover ul {
left: 215px;
top: 0;
}
#header-wrapper.sticky #main-navigation ul ul {
padding: 0;
margin: 0;
}
#header-wrapper.sticky #main-navigation ul ul li {
float: left;
line-height: 20px;
font-size: 12px;
}
#header-wrapper.sticky #main-navigation ul ul li a {
background: #323232 url("../images/nav-arrow.png") -50px 40% no-repeat!important;
font-size: 12px;
padding: 10px 15px;
text-transform: uppercase;
margin: 0px;
line-height: 20px;
color: #898989!important;
font-weight: normal;
border-bottom: solid 1px #414141;
text-align: left;
}
#header-wrapper.sticky #main-navigation ul ul li a:hover {
background:#3051c6 url("../images/nav-arrow.png") 10px 50% no-repeat!important;
color:#FFF!important;
padding-left: 25px;
}
#header-wrapper.sticky #main-navigation ul li li:hover ul li a { border-bottom: solid 1px #414141!important }
#header-wrapper.sticky #main-navigation ul ul li:last-child a { border-bottom: none }
/*___________________________________________________________________________*/
/* MAIN NAVIGATION VERSION 2 */
/*___________________________________________________________________________*/
#main-navigation-2 select { display: none }
#main-navigation-2 select {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #eee;
cursor: pointer;
width: 400px;
padding: 10px 5px;
margin: 0px 0 30px 0;
box-shadow: 0 0 0 rgba();
color: #676767;
float: left;
}
#main-navigation-2 ul {
margin: 0px 0 10px 0;
padding: 0px 0;
list-style-type: none;
float: right;
}
#main-navigation-2 ul li:hover { visibility: inherit }
#main-navigation-2 ul li {
position: relative;
display: inline;
float: left;
text-align: center;
}
#main-navigation-2 ul li:last-child { background: none }
#main-navigation-2 ul li a {
color: #898989;
line-height: 30px;
text-transform: uppercase;
display: block;
overflow: hidden;
padding: 10px 15px 10px 15px;
margin: 0px 0px 0px 0px;
font-size: 14px;
font-weight: 300;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
#main-navigation-2 ul li { margin-right: 0px }
#main-navigation-2 ul li:last-child { margin-right: 0px }
#main-navigation-2 ul li a.active-page,
#main-navigation-2 ul li a.active-page:hover {
color: #FFF;
background: #3051c6!important;
}
#main-navigation-2 ul li:hover a {
color: #FFF;
background: #323232;
}
#main-navigation-2 ul ul {
position: absolute;
top: -9999em;
width: 230px;
z-index: 99999;
background: #323232;
}
#main-navigation-2 ul ul li a { text-transform: capitalize }
#main-navigation-2 ul ul li { width: 100% }
#main-navigation-2 ul li:hover ul {
left: 0;
top: 48px;
}
#main-navigation-2 ul li:hover li ul { top: -9999em }
#main-navigation-2 ul li li:hover ul {
left: 215px;
top: 0;
}
#main-navigation-2 ul ul {
padding: 0;
margin: 0;
}
#main-navigation-2 ul ul li {
float: left;
line-height: 20px;
font-size: 12px;
}
#main-navigation-2 ul ul li a {
background: #323232 url("../images/nav-arrow.png") -50px 40% no-repeat!important;
font-size: 12px;
padding: 10px 5px;
text-transform: uppercase;
margin: 0px;
margin: 0 15px;
line-height: 20px;
color: #898989!important;
font-weight: normal;
border-bottom: solid 1px #414141;
text-align: left;
}
#main-navigation-2 ul ul li a:hover {
color: #3051c6!important;
padding-left: 20px;
background: #323232 url("../images/nav-arrow.png") 5px 50% no-repeat!important;
}
#main-navigation-2 ul li li:hover ul li a { border-bottom: solid 1px #414141!important }
#main-navigation-2 ul ul li:last-child a { border-bottom: none }
/*___________________________________________________________________________*/
/* MAIN NAVIGATION VERSION 2 STICKY NAVIGATION */
/*___________________________________________________________________________*/
#header-wrapper.sticky #main-navigation-2 ul { margin: 5px 0 0px 0 }
#header-wrapper.sticky .logo-wrapper-2{float:left;margin-top: 10px;margin-bottom: 15px;}
#header-wrapper.sticky #main-navigation-2 ul li:hover ul {
left: 0;
top: 142px;
}
#header-wrapper.sticky #main-navigation-2 ul li a .nav_icon {
display: inline-block;
font-size: 20px;
color: #636466;
line-height: 0;
width: 100%;
text-align: center;
}
#header-wrapper.sticky #main-navigation-2 ul ul {
position: absolute;
top: -9999em;
width: 230px;
z-index: 99999;
background: #323232;
}
#header-wrapper.sticky #main-navigation-2 ul ul li a { text-transform: capitalize }
#header-wrapper.sticky #main-navigation-2 ul ul li { width: 100% }
#header-wrapper.sticky #main-navigation-2 ul li:hover ul {
left: 0;
top: 50px;
}
#header-wrapper.sticky #main-navigation-2 ul li:hover li ul { top: -9999em }
#header-wrapper.sticky #main-navigation-2 ul li li:hover ul {
left: 215px;
top: 0px;
}
#header-wrapper.sticky #main-navigation-2 ul ul {
padding: 0;
margin: 0;
}
#header-wrapper.sticky #main-navigation-2 ul ul li {
float: left;
line-height: 20px;
font-size: 12px;
}
#header-wrapper.sticky #main-navigation-2 ul ul li a {
background: #323232 url("../images/nav-arrow.png") -50px 40% no-repeat!important;
font-size: 12px;
padding: 10px 5px;
text-transform: uppercase;
margin: 0px;
margin: 0 15px;
line-height: 20px;
color: #898989!important;
font-weight: normal;
border-bottom: solid 1px #414141;
text-align: left;
}
#header-wrapper.sticky #main-navigation-2 ul ul li a:hover {
color: #3051c6!important;
padding-left: 20px;
background: #323232 url("../images/nav-arrow.png") 5px 50% no-repeat!important;
}
#header-wrapper.sticky #main-navigation-2 ul li li:hover ul li a { border-bottom: solid 1px #414141!important }
#header-wrapper.sticky #main-navigation-2 ul ul li:last-child a { border-bottom: none }
/*______________________________________________________________*/
/* MAIN GRID */
/*______________________________________________________________*/
.container {
margin: 0 auto;
position: relative;
width: 1100px;
}
.one,.one-half,.two-third,.one-third,.one-fourth ,.one-fifth,.one-sixth,.three-fourth{ float:left;position:relative;margin-right:3%; }
.one { width: 100%; margin-right: 0; }
.one-half { width: 45.5%; }
.two-third { width: 65.67%; }
.one-third { width: 31.33%; }
.one-fourth { width: 22.75%; }
.three-fourth { width: 74.25%; }
.one-fifth { width: 17.6%; }
.one-sixth { width: 14.1%; }
.one-half.last, .one-third.last, .two-third.last, .one-fourth.last, .three-fourth.last,.one-fifth.last,.one-sixth.last{margin-right: 0!important;}
.horizontal-line {
width: 100%;
margin: 40px 0;
float: left;
border-top: 1px solid #e3e3e3;
}
/*___________________________*/
/* MAIN GRID ENDS*/
/*___________________________*/
.intro-text{float:left;width:100%;text-align:center;}
.intro-text.no-margin{margin:20px 0 50px 0;}
.intro-text h4{
font-size: 24px;
font-family:"OpenSansRegular", Arial, Verdana;
color: #373737;
text-transform: uppercase;
line-height: 32px;
}
.intro-text h5{
font-size: 16px;
line-height: 22px;
color: #878787;
}
.intro-text h4 span{background:#3051c6;color:#FFF;padding:2px 5px;}
.intro-page{margin:0 0 50px 0;float:left;width:100%;border-bottom:1px solid #e3e3e3;padding-bottom:40px;text-align:center;}
.intro-page h4{font-family:"OpenSansRegular", Arial,Verdana;font-size:24px;color:#898989;line-height:34px;}
.intro-page h4 span{background:#3051c6;color:#FFF;padding:2px 5px;}
/*___________________________*/
/* FOOTER & COPYRIGHTS*/
/*___________________________*/
footer {
float: left;
width: 100%;
padding: 40px 0;
height: auto;
background: #222222;
position: relative;
border-bottom: 1px solid #282828;
}
footer h4 {
text-transform: uppercase;
color: #cccccc;
font-size: 14px;
margin-bottom: 10px;
letter-spacing: 1px;
}
footer ul {
list-style: none;
float: left;
width: 100%;
}
footer ul li {
width: 100%;
float: left;
display: block;
padding: 5px 0px 5px 0px;
border-bottom: 1px solid #3b3b3b;
background: url("../images/footer-list-bg.jpg") left 50% no-repeat;
}
footer ul li a {
color: #666666;
font-size: 12px;
padding-left: 15px;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
footer ul li a:hover { color: #3051c6 }
footer ul.contact-info {
list-style: none;
float: left;
width: 100%;
}
footer ul.contact-info li.contact-icon-office { background: url("../images/icons/icon-office.png") left no-repeat }
footer ul.contact-info li.contact-icon-phone { background: url("../images/icons/icon-phone.png") left no-repeat }
footer ul.contact-info li.contact-icon-mail { background: url("../images/icons/icon-mail.png") left no-repeat }
footer ul.contact-info li.contact-icon-fax { background: url("../images/icons/icon-fax.png") left no-repeat }
footer ul.contact-info li.contact-icon-maps { background: url("../images/icons/icon-maps.png") left no-repeat }
footer ul.contact-info li.contact-icon-blog { background: url("../images/icons/icon-blog.png") left no-repeat }
footer ul.contact-info li {
width: 100%;
float: left;
display: block;
padding: 5px 0px 5px 0px;
background: none;
}
footer ul.contact-info li a { padding-left: 25px }
footer ul.footer-tags {
list-style: none;
float: left;
width: 100%;
}
footer ul.footer-tags li {
background: #292929;
border-radius: 4px;
width: auto;
border: none;
float: left;
display: block;
margin: 5px;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
footer ul.footer-tags li:hover { background: #3051c6 }
footer ul.footer-tags li:hover a { color: #FFF }
footer ul.footer-tags li a { padding: 5px 10px }
#copyrights {
padding: 60px 0;
font-size: 13px;
border-top:1px solid #3b3b3b;
width:100%;
float:left;
background:#333333;
}
#copyrights a { font-weight: 300; }
#copyright a.colored{color:#3051c6; -webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;}
#copyright a.colored:hover{text-decoration:underline;}
#copyrights-nav, #copyrights-nav ul { float: right; margin-top:5px;}
#copyrights-nav li { float: left; padding: 0px 5px; }
#copyrights-nav a {
color:#666666;
padding: 5px 10px;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;}
#copyrights-nav a:hover { color:#3051c6; }
/*___________________________________________________*/
/* INTRO PAGE PANEL & BREADCRUMBS*/
/*______________________________________________________*/
section.page-top {
background: #222222;
box-shadow: inset 0px 0px 25px rgba(0, 0, 0, 0.45);
border-bottom: 5px solid #e5e5e5;
border-top: 5px solid #f0f0f0;
margin-bottom: 50px;
margin-top: -1px;
padding: 20px 0;
position: relative;
float: left;
width: 100%;
height: auto;
}
section.page-top h1 {
color: #3051c6;
display: inline-block;
padding: 0px;
position: relative;
float: left;
font-size: 26px;
line-height: 32px;
margin-top: -25px;
padding-top: 20px;
padding-right: 30px;
font-weight: 300;
text-transform: uppercase;
font-family: "OpenSansLight", Arial;
border-top: 5px solid #3051c6;
}
section.page-top ul.breadcrumb {
background: none;
margin: 0px 0 0 0;
padding: 0;
float: left;
width: 100%;
}
section.page-top ul.breadcrumb > li a:hover {
text-decoration: underline;
color: #3051c6;
}
section.page-top ul.breadcrumb > li a { color: #FFF }
section.page-top ul.breadcrumb > li {
text-shadow: none;
float: left;
margin: 0px 7px 0 0;
color: #FFF;
font-size: 11px;
}
.breadcrumb-divider {
margin: 0px 0px 0 7px;
color: #FFF;
}
#search-text {
position: relative;
margin-top: 5px;
background: #FFF url("../images/search-bg.png") 97% 50% no-repeat;
border-radius: 100px;
border: 2px solid #CCC;
}
#search-text.inner { border: 2px solid #CCC }
#search-text input {
padding: 7px 5px 0px 10px;
margin: 5px;
width: 190px;
height: 18px;
line-height: 18px;
float: left;
color: #717171;
}
/*___________________________________*/
/*TEAM MEMBERS & SKILLS*/
/*___________________________________*/
.team-member {
float: left;
max-width: 420px;
background: #FFF;
border: 1px solid #ececec;
margin-bottom: 30px;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.team-member img{width: 100%;height: auto;}
.team-member:hover { box-shadow: 0px 0px 15px #ececec }
.team-member .content { padding: 0px 15px 15px 15px }
.team-member .content .title {
color: #959595;
text-transform: uppercase;
font-weight: normal;
}
.team-member .content .about { color: #959595 }
.team-member h4 {
font-size: 14px;
margin: 10px 0 0 0;
}
.job-position {
font-style: italic;
color: #959595;
font-size: 14px;
font-family: "Georgia",Arial,Verdana;
margin: -20px 0 15px 0px;
}
.team-social-links { display: inline-block }
.team-social-links li {
display: inline-block;
list-style: none;
margin: 0px 0 10px 0px;
text-indent: -9999px;
float: left;
}
.team-social-links a {
background-repeat: no-repeat;
background-position: 0px 0px;
display: block;
height: 16px;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
width: 16px;
margin-right: 5px;
}
.team-social-links li a:hover { background-position: 0px -16px }
.team-social-links li.facebook a { background-image: url(../images/team-members-icons/facebook.png) }
.team-social-links li.twitter a { background-image: url(../images/team-members-icons/twitter.png) }
.team-social-links li.skype a { background-image: url(../images/team-members-icons/skype.png) }
.team-social-links li.linkedin a { background-image: url(../images/team-members-icons/linkedin.png) }
.team-social-links li.viadeo a { background-image: url(../images/viadeo.png) }
.team-social-links li.googleplus a { background-image: url(../images/team-members-icons/google.png) }
.team-social-links li.dribbble a { background-image: url(../images/team-members-icons/dribbble.png) }
.team-social-links li.flickr a { background-image: url(../images/team-members-icons/flickr.png) }
.team-social-links li.tumblr a { background-image: url(../images/team-members-icons/tumblr.png) }
.team-social-links li.vimeo a { background-image: url(../images/team-members-icons/vimeo.png) }
.team-social-links li.rss a { background-image: url(../images/team-members-icons/rss.png) }
.team-social-links li.mail a { background-image: url(../images/team-members-icons/mail.png) }
.title {
background: url("../images/title-bg.png") repeat-x bottom left;
margin-bottom: 40px;
overflow: hidden;
width: 100%;
position: relative;
}
.title h2{ font-size: 20px;
line-height: 30px
}
.title h2,
.title h4 {
border-bottom: 4px solid #3051c6;
float: left;
padding: 0 20px 10px 0;
margin: 0;
position: relative;
z-index: 99;font-family: "OpenSansRegular", Arial;
}
.skills li {
margin-bottom: 15px;
}
.skillbar {
background: #e5e5e5;
border-radius:100px;
height: 13px;
width: 100%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
-o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
}
.countbar {
background:#3051c6;
height: 13px;
border-radius:100px;
}
.bar_graph {
text-align: left!important;
margin: 0px!important;
}
.bar_graph li {
list-style: none!important;
}
.bar_graph li:last-child span {
margin-bottom: 0px;
}
.bar_graph li .bar-wrap {
margin-bottom:13px;
background-color: #e4e4e4;
border-radius: 300px 300px 300px 300px;
background-color: #ebebeb;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
}
.bar_graph li span {
height: 13px;
width: 0px;
display: block;
background-color: #3051c6;
border-radius: 300px 300px 300px 300px;
}
.bar_graph li p {
padding-bottom: 2px;
}
.bar_graph li strong {margin-left: 10px;}
.bar_graph li span {
overflow: visible!important;
position: relative;
}
.newsletter-txt {
margin: 30px 0;
float: left;
text-align: center;
width: 100%;
padding: 40px 0;
border-top: 1px solid #ececec;
border-bottom: 1px solid #ececec;
}
.newsletter-txt h1 {
font-weight: 300;
font-size: 20px;
}
form.newsletter-form {
width: 600px;
margin: 20px auto 0 auto;
}
form.newsletter-form input {
border: 1px solid #d0d0d0;
padding: 7px 10px 6px 10px;
background: #f3f3f3;
color: #8c8c8c;
text-shadow: 0px 1px #FFF;
font-size: 14px;
font-weight: 800;
border-radius: 4px;
width: 450px;
margin-right: 10px;
}
.call-to-action{
float:left;
height:auto;
background:#fcfcfc;
border:1px solid #e1e1e1;
padding:30px 30px 20px 30px;
margin-bottom:40px;
}
.call-to-action h2{font-size:14px;line-height: 22px;}
.call-to-action p{margin-top:10px;float:right;}
.tt-dropdown-menu {
width: 245px;
margin-top: 8px;
padding: 5px 0;
border-radius: 4px;
background-color: #fff;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0,0,0,.2);
}
.tt-suggestion {
padding: 5px 10px;
font-size: 13px;
line-height: 20px;
}
.tt-suggestion.tt-is-under-cursor {
color: #fff;
background: #1a98ce;
background: -webkit-linear-gradient(#3051c6, #1a98ce);
background: -moz-linear-gradient(#3051c6, #1a98ce);
background: -ms-linear-gradient(#3051c6, #1a98ce);
background: -o-linear-gradient(#3051c6, #1a98ce);
background: -webkit-gradient(#3051c6, #1a98ce);
background: linear-gradient(#3051c6, #1a98ce);
}
.tt-suggestion p { margin: 0 }
.gist { font-size: 14px }
.my-custom-theme {
border-radius: 5px;
background: #333;
color: #FFF;
}
.my-custom-theme .tooltipster-content {
font-size: 11px;
line-height: 15px;
padding: 8px 10px;
}
/*________________________________________________*/
/* 05- CAROUSEL , TESTIMONIALS SLIDER& CLIENTS*/
/*_________________________________________________*/
.jcarousel-container {
margin: 20px 0px 0px 0;
max-width: 100%;
padding: 0px;
float: left;
position: relative;
}
ul#projects-carousel-1,
ul#projects-carousel-2,
ul#projects-carousel-3 {
overflow: hidden;
position: relative;
list-style: none;
margin: 0;
padding: 0;
float: left;
}
ul#projects-carousel-1 li,
ul#projects-carousel-2 li,
ul#projects-carousel-3 li {
float: left;
width: 250px;
height: 275px;
margin-right: 33px;
padding: 0;
}
ul#projects-carousel-2 li .portfolio-hover-content,
ul#projects-carousel-3 li .portfolio-hover-content-flip { height: 173px }
ul#projects-carousel-2 li .portfolio-hover-content .hover-content,
ul#projects-carousel-3 li .portfolio-hover-content-flip .hover-content { padding: 25px 25px 25px 25px }
.jcarousel-next,
.jcarousel-prev {
background: #3051c6 url("../images/carousel-prev-next.png") 105% 50% no-repeat;
cursor: pointer;
height: 20px;
width: 20px;
position: absolute;
right: 0;
top: -45px;
border-radius: 2px;
}
.jcarousel-prev {
background: #3051c6 url("../images/carousel-prev-next.png") -5% 50% no-repeat;
right: 25px;
}
.jcarousel-next:hover,
.jcarousel-next:focus,
.jcarousel-next:active,
.jcarousel-prev:hover,
.jcarousel-prev:focus,
.jcarousel-prev:active { background-color: #3051c6 }
.jcarousel-clip {
overflow: hidden;
width: 100%;
}
.jcarousel-next-disabled,
.jcarousel-next-disabled:hover,
.jcarousel-next-disabled:focus,
.jcarousel-next-disabled:active,
.jcarousel-prev-disabled,
.jcarousel-prev-disabled:hover,
.jcarousel-prev-disabled:focus,
.jcarousel-prev-disabled:active {
background-color: #c9c9c9;
cursor: auto;
}
.carousel-title {
float: left;
width: 100%;
margin-bottom: 20px;
}
/*TESTIMONIALS SLIDER*/
.testimonials {
float: left;
width: 100%;
height: auto;
background: url("../images/testimonial_quote.png") 100% 100% no-repeat;
text-align: center;
margin-bottom: 40px;
}
.testimonials h5 {
text-transform: uppercase;
font-size: 13px;
color: #787878;
font-family: 'OpenSansBold', 'Arial', sans-serif;
}
.testimonials p {
font-size: 14px;
line-height: 22px;
margin-bottom: 20px;
font-family: 'OpenSansRegular', 'Arial', sans-serif;
}
.avatar_testimonials {
border: solid 5px #3051c6;
width: 82px;
height: 82px;
margin: 10px auto 20px auto;
border-radius: 300px;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
.avatar_testimonials img { border-radius: 300px }
ul#testimonials-slider {
float: left;
width: 100%;
height: auto;
list-style: none;
}
/*CLIENTS*/
ul.clients {
float: left;
width: 100%;
margin: 0 0 0px 0;
padding: 0;
margin-top: 0px;
}
ul.clients li { display: inline;}
.clients img {
-moz-transition:all 0.24s ease 0s;
-webkit-transition:all 0.24s ease 0s;
-o-transition:all 0.24s ease 0s;
}
.clients img:hover {
box-shadow: 0px 0px 20px #c2c2c2;
position: relative;
}
.clients-grid {
list-style: none;
margin: 0;
padding: 0;
float: left;
border-left: 1px solid #ddd;
border-top: 1px solid #ddd;
}
.clients-grid li {
float: left;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
padding: 0px;
line-height: 10px;
}
.clients-grid.one-fourth li {
width: 274px;
}
.clients-grid.one-fifth li {
width: 219px;
}
.clients-grid.one-sixth li {
width: 182px;
}
/*____________________________________________*/
/* 06-FORMS */
/*____________________________________________*/
.input-holder {
width: 232px;
margin-right: 50px;
float: left;
}
.input-holder.last { margin-right: 0px }
.input-msg-holder {
width: 797px;
margin-right: 50px;
float: left;
}
.simple-form input[type=text],
.simple-form textarea,
.simple-form input[type=email] {
padding: 10px 10px!important;
width: 100%;
background: #FFF;
border: 1px solid #e1e1e1;
font-size: 12px;
line-height: 20px;
color: #555;
box-shadow: inset 0px 2px 4px #f3f3f3;
-moz-box-shadow: inset 0px 2px 4px #f3f3f3;
-webkit-box-shadow: inset 0px 2px 4px #f3f3f3;
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
border-radius: 2px;
}
.simple-form input[type=text]:focus,
.simple-form textarea:focus,
.simple-form input[type=email]:focus {
background: #FFF;
border: 1px solid #bebebe;
}
.simple-form input[type=submit] {
float: left;
margin-top: 30px;
}
.simple-form textarea { max-width: 100% }
.simple-form label span { color: #3051c6 }
.simple-form label {
float: left;
margin: 10px 0 10px 0;
font-family: "OpenSansBold" , Arial, Verdana;
}
/*__________________________________________________________*/
/* 07 - Portfolio*/
/*__________________________________________________________*/
#filterable {
display: inline;
float: right;
margin-bottom: 10px;
margin-right: 0px;
}
#filterable li {
float: left;
list-style: none;
margin-left: 5px;
}
#filterable li a {
cursor: pointer;
display: block;
color: #898989;
text-decoration: none;
text-align: center;
height: auto;
padding: 0px 15px;
border-left: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
border-top: 1px solid #eaeaea;
border-bottom: 2px solid #c5c5c5;
border-radius: 4px;
font-size: 11px;
-webkit-transition: all 0.15s ease-out;
-moz-transition: all 0.15s ease-out;
-o-transition: all 0.15s ease-out;
-ms-transition: all 0.15s ease-out;
transition: all 0.15s ease-out;
background: #e7e7e7;
background: -webkit-linear-gradient(#f7f7f7, #e7e7e7);
background: -moz-linear-gradient(#f7f7f7, #e7e7e7);
background: -ms-linear-gradient(#f7f7f7, #e7e7e7);
background: -o-linear-gradient(#f7f7f7, #e7e7e7);
background: -webkit-gradient(#f7f7f7, #e7e7e7);
background: linear-gradient(#f7f7f7, #e7e7e7);
}
#filterable li a:hover {
color: #FFF;
border-left: 1px solid #2b2b2b;
border-right: 1px solid #2b2b2b;
border-top: 1px solid #2b2b2b;
border-bottom: 2px solid #151515;
background: #282828;
background: -webkit-linear-gradient(#333333, #282828);
background: -moz-linear-gradient(#333333, #282828);
background: -ms-linear-gradient(#333333, #282828);
background: -o-linear-gradient(#333333, #282828);
background: -webkit-gradient(#333333, #282828);
background: linear-gradient(#333333, #282828);
}
#filterable li a.active {
margin-top: 1px;
border-bottom: 1px solid #05228b;
border-left: 1px solid #05228b;
border-right: 1px solid #05228b;
border-top: 1px solid #05228b;
color: #FFF;
background: #05228b;
background: -webkit-linear-gradient(#3051c6, #05228b);
background: -moz-linear-gradient(#3051c6, #05228b);
background: -ms-linear-gradient(#3051c6, #05228b);
background: -o-linear-gradient(#3051c6, #05228b);
background: -webkit-gradient(#3051c6, #05228b);
background: linear-gradient(#3051c6, #05228b);
}
.filter-portfolio {
float: left;
width: 100%;
margin-bottom: 40px;
}
.portfolio-grid {
width: 1137px;
float: left;
position: relative;
margin-right: -37px;
}
.portfolio-grid ul.portfolio-items li.one-fourth {
width: 250px;
float: left;
}
.portfolio-grid ul.portfolio-items li.one-third {
width: 344px;
float: left;
}
ul#experiences {
width:0px;
}
#image-experiences {
width:344px;
text-align:left;
}
#texte-experiences {
width:688px;
margin-left:10px;
min-height:218px;
}
#image-error {
width:516px;
text-align:left;
}
#texte-error {
width:516px;
margin-left:30px;
min-height:218px;
vertical-align:middle;
}
#parexp {
min-height:188px;
}
#titre-exp {
margin-bottom:20px;
color:#222222;
}
#exp {
color:#222222;
}
.portfolio-grid ul.portfolio-items li.one-fourth .gallery-item {
background: #FFF;
margin-bottom: 30px;
width: 250px;
float: left;
position: relative;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
}
.gallery-arrow {
width: 14px;
height: 7px;
background: url("../images/gallery-arrow.png") no-repeat;
float: left;
margin-top: -7px;
margin-left: 20px;
position: relative;
z-index: 150;
}
a.gallery-title-link {
color: #437ea1;
font-size: 12px;
font-weight: bold;
margin-left: 10px;
}
a.gallery-title-link:hover { text-decoration: underline }
a.screen-roll {
display: block;
position: relative;
}
a.screen-roll {
line-height: 0;
padding: 0;
margin: 0;
}
a.screen-roll span.hover_bg {
position: absolute;
z-index: 100;
width: 100%;
height: 100%;
margin: 0px;
background: #3051c6 url('../images/thumb-hover.png') no-repeat center -40px; /* IE8 */
background: rgba(75,170,211,0.85) url('../images/thumb-hover.png') no-repeat center -40px;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */a.screen-roll: ;
filter: alpha(opacity=0);
top: 0;
left: 0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
a.screen-roll span.hover_bg_video {
position: absolute;
z-index: 100;
width: 100%;
height: 100%;
margin: 0px;
background: #3051c6 url('../images/thumb-hover-video.png') no-repeat center -40px; /* IE8 */
background: rgba(75,170,211,0.85) url('../images/thumb-hover-video.png') no-repeat center -40px;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */a.screen-roll: ;
filter: alpha(opacity=0);
top: 0;
left: 0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
a.screen-roll span.hover_bg:hover,a.screen-roll span.hover_bg_video:hover { background-position: center center }
.gallery-item-text {
padding: 10px 0;
margin-bottom: 10px;
float: left;
border-bottom: 1px solid #e6e6e6;
width: 100%;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
.isotope,
.isotope .isotope-item {
-webkit-transition-duration: 0.6s;
-moz-transition-duration: 0.6s;
-ms-transition-duration: 0.6s;
-o-transition-duration: 0.6s;
transition-duration: 0.6s;
z-index: 2;
}
.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: top, left, opacity;
-o-transition-property: top, left, opacity;
transition-property: transform, opacity;
}
.shaped-portfolio {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: transparent;
overflow: hidden;
z-index: 200;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.portfolio-item.shaped-item{ text-align: center;}
/*PORTFOLIO LAYOUT 2 - 4 COLUMNS*/
.one-fourth .portfolio-item-hover-content a.zoom {
background: #333;
color: #FFF;
border-radius: 4px;
display: block;
padding: 15px 10px;
position: absolute;
top: -100%;
left: 11%;
z-index: 250;
line-height: 0px;
transition: color 300ms, background-color 300ms, opacity 300ms;
-moz-transition: color 300ms, background-color 300ms, opacity 300ms; /* FF3.7+ */
-o-transition: color 300ms, background-color 300ms, opacity 300ms; /* Opera 10.5 */
-webkit-transition: color 300ms, background-color 300ms, opacity 300ms; /* Saf3.2+, Chrome */
}
.one-fourth .portfolio-item-hover-content a.read-more {
background: #333;
color: #FFF;
border-radius: 4px;
display: block;
padding: 15px 10px;
position: absolute;
top: -100%;
left: 51%;
z-index: 250;
line-height: 0px;
transition: color 300ms, background-color 300ms, opacity 300ms;
-moz-transition: color 300ms, background-color 300ms, opacity 300ms; /* FF3.7+ */
-o-transition: color 300ms, background-color 300ms, opacity 300ms; /* Opera 10.5 */
-webkit-transition: color 300ms, background-color 300ms, opacity 300ms; /* Saf3.2+, Chrome */
}
.one-fourth .portfolio-item-hover-content a.zoom:hover,
.one-fourth .portfolio-item-hover-content a.read-more:hover { background: #FFF;color:#262626; }
.one-fourth .portfolio-item-hover-content {
line-height: 0;
display: block;
background: transparent;
z-index: 99;
}
.one-fourth .portfolio-item-holder {
position: relative;
overflow: hidden;
height: auto;
margin-bottom: 0px;
}
.one-fourth .portfolio-item-hover-content,
.proj-img1 {
position: relative;
overflow: hidden;
}
.one-fourth .portfolio-item-hover-content .hover-options {
display: block;
font-style: normal;
position: absolute;
width: 100%;
height: 100%;
z-index: 9;
top: 0;
left: 0;
background: #3051c6;
background:rgba(75,170,211,0.95);
opacity: 0;
filter: alpha(opacity:0);
cursor: pointer;
}
/*PORTFOLIO LAYOUT 2 - 3 COLUMNS*/
.one-third .portfolio-item-hover-content a.zoom {
background: #333;
color: #FFF;
border-radius: 4px;
display: block;
padding: 15px 10px;
position: absolute;
top: -100%;
left: 22%;
z-index: 10;
line-height: 0px;
transition: color 300ms, background-color 300ms, opacity 300ms;
-moz-transition: color 300ms, background-color 300ms, opacity 300ms; /* FF3.7+ */
-o-transition: color 300ms, background-color 300ms, opacity 300ms; /* Opera 10.5 */
-webkit-transition: color 300ms, background-color 300ms, opacity 300ms; /* Saf3.2+, Chrome */
}
.one-third .portfolio-item-hover-content a.read-more {
background: #333;
color: #FFF;
border-radius: 4px;
display: block;
padding: 15px 10px;
position: absolute;
top: -100%;
left: 52%;
z-index: 10;
line-height: 0px;
transition: color 300ms, background-color 300ms, opacity 300ms;
-moz-transition: color 300ms, background-color 300ms, opacity 300ms; /* FF3.7+ */
-o-transition: color 300ms, background-color 300ms, opacity 300ms; /* Opera 10.5 */
-webkit-transition: color 300ms, background-color 300ms, opacity 300ms; /* Saf3.2+, Chrome */
}
.one-third .portfolio-item-hover-content a.zoom:hover,
.one-third .portfolio-item-hover-content a.read-more:hover { background: #FFF;color:#262626; }
.one-third .portfolio-item-hover-content {
line-height: 0;
display: block;
background: transparent;
z-index: 99;
}
.one-third .portfolio-item-holder {
position: relative;
overflow: hidden;
height: auto;
margin-bottom: 0px;
}
.one-third .portfolio-item-hover-content,
.proj-img1 {
position: relative;
overflow: hidden;
}
.one-third .portfolio-item-hover-content .hover-options {
display: block;
font-style: normal;
position: absolute;
width: 100%;
height: 100%;
z-index: 9;
top: 0;
left: 0;
background: #3051c6;
background:rgba(75,170,211,0.95);
opacity: 0;
filter: alpha(opacity:0);
cursor: pointer;
}
.portfolio-item {
float: left;
width: 100%;
margin-bottom: 30px;
border-bottom: 1px solid #e3e3e3;
position: relative;
}
.portfolio-item img{ width: 100%;height: auto;}
ul.portfolio-items li.one-third .portfolio-hover-content { height: 238px }
ul.portfolio-items li.one-fourth .portfolio-hover-content { height: 172px }
ul.portfolio-items li.one-fourth .portfolio-hover-content-flip { height: 173px }
ul.portfolio-items li.one-third .portfolio-hover-content-flip { height: 238px }
.item-holder-main {
float: left;
margin: 0px 0 -6px 0;
}
ul.portfolio-items li.one-third .portfolio-hover-content .hover-content { padding: 45px 25px 25px 25px }
ul.portfolio-items li.one-fourth .portfolio-hover-content .hover-content { padding: 25px 25px 25px 25px }
ul.portfolio-items li.one-fourth .portfolio-hover-content-flip .hover-content { padding: 25px 25px 25px 25px }
ul.portfolio-items li.one-third .portfolio-hover-content-flip .hover-content { padding: 45px 25px 25px 25px }
.portfolio-hover-content,
.portfolio-hover-content-flip {
background: #000;
background: rgba(0,0,0,0.75);
position: absolute;
top: 0;
left: 0;
width: 100%;
opacity: 0;
z-index: 500;
cursor: pointer;
display: block;
padding: 0;
margin: 0;
overflow: hidden;
text-align: center;
}
.portfolio-hover-content h5,
.portfolio-hover-content-flip h5 {
font-size: 16px;
text-transform: uppercase;
color: #ffffff;
font-weight: bold;
line-height: 24px;
font-family: "OpenSansBold", Arial;
}
.portfolio-hover-content a,
.portfolio-hover-content-flip a {
font-weight: bold;
color: #3051c6;
font-size: 14px;
text-transform: uppercase;
line-height: 20px;
margin: 0px;
}
.portfolio-hover-content p,
.portfolio-hover-content-flip p { margin-bottom: 15px }
.portfolio-hover-content a:hover,
.portfolio-hover-content-flip a:hover { border-bottom: 2px solid #3051c6 }
.portfolio-item-title {
padding: 20px 0 15px;
float: left;
width: 100%;
}
.portfolio-item:hover .portfolio-item-title { border-bottom: 1px solid #3051c6 }
.portfolio-item-title h2 {
margin-bottom: 0px;
line-height: 20px;
}
.portfolio-item-title h2 a {
color: #3051c6;
font-size: 13px;
text-transform: uppercase;
margin-bottom: 0px;
font-family: 'OpenSansBold', 'Lucida Grande', sans-serif;
text-decoration: none;
}
.portfolio-item-title h2 a:hover { text-decoration: underline }
.portfolio-item-title h4 { font-family: 'OpenSansLight', 'Lucida Grande', sans-serif;font-size: 12px; }
.portfolio-item-title h4 a:hover { color: #3051c6 }
.portfolio-item-title p { text-align: center }
.shadow-img { box-shadow: 0px 0px 15px #e4e4e4 }
ul.single-project-list { margin: 30px 0 }
ul.single-project-list li {
list-style: none;
padding: 2px 0;
}
ul.single-project-list li span {
display: inline-block;
margin-right: 10px;
margin-bottom: -2px;
height: 15px;
width: 15px;
background: #3051c6;
border-radius: 2px;
background-image: url(../images/list-icons/check.png);
background-repeat: no-repeat;
background-position: center center;
}
ul.font-icons-size li { margin: 10px 0 }
ul.font-icons-size li span {
font-size: 30px;
position: relative;
top: 4px;
margin-right: 5px;
}
ul.list li,
ul.list-2 li,
ul.list-3 li,
ul.list-2 li,
ul.list-4 li,
ul.list-5,
ul.list-6 li li {
float: left;
width: 100%;
padding: 5px 0;
}
/*__________________________________________________________*/
/* 08 - BLOG LAYOUT*/
/*__________________________________________________________*/
.blog-post-intro-text .read-more{ border-radius: 2px;}
.quote-inner {
background: #2c2c2c;
position: relative;
padding: 25px;
color: #fff;
}
.quote-inner .quote-text {
font-family: "OpenSansBold",Arial, Verdana;
color: #FFF;
margin-bottom: 15px;
transition: all 0.2s linear 0s;
-moz-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
}
.quote-inner .quote-text:hover{color:#3051c6;}
.quote-inner a.author {
font-family: "OpenSansRegular",Arial, Verdana;
color: #FFF;
letter-spacing: 1px;
transition: all 0.2s linear 0s;
-moz-transition: all 0.2s linear 0s;
-o-transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
}
.quote-inner a.author:hover { text-decoration: underline }
a.blog-post-quote {
width: 100%;
display: block;
}
span.quote-icon {
bottom: 25px;
height: 17px;
width: 19px;
display: block;
background: url(../images/icons/quote.png);
position: absolute;
right: 25px;
}
ul.post-tags {
float: left;
width: 100%;
list-style: none;
padding-top: 25px;
margin-top: 25px;
border-top: 1px solid #ebebeb;
}
ul.post-tags li {
float: left;
margin-right: 5px;
}
ul.post-tags li a {
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
font-size: 10px;
padding: 3px 7px;
background: #d2d2d2;
color: #7a7a7a;
border-radius: 2px;
}
.blog-post-intro-text .read-more {
color: #FFF;
float: left;
position: relative;
transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-webkit-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
width: auto;
cursor: pointer;
padding: 3px 10px;
font-size: 12px;
margin-top: 30px;
border-radius: 2px;
background: #646464;
}
.blog-post-intro-text .read-more:hover { background: #3051c6; }
article.blog-post .media-holder {
float: left;
width: 100%;
height: auto;
border-bottom: 4px solid #3051c6;
line-height: 10px;
}
/*-----------------------------------------------*/
/* BLOG LAYOUT 01 STARTS */
/*---------------------------------------------*/
article.blog-post {
width: 509px;
float: left;
border-bottom: 1px solid #ebebeb;
border-left: 1px solid #ebebeb;
border-right: 1px solid #ebebeb;
margin-bottom: 50px;
background: #FFF;
box-shadow: 0px 0px 15px #ececec;
}
.article-title a {
color: #646464;
text-decoration: none;
margin-bottom: 5px;
font-family: "OpenSansBold",Arial,Verdana;
float: left;
-moz-transition: all 0.¸24s ease 0s;
-webkit-transition: all 0.24s ease 0s;
-o-transition: all 0.24s ease 0s;
font-size: 20px;
line-height: 30px;
}
.article-title a:hover { color: #3051c6 }
.post-featured-img img {
max-width: none;
width: 100%;
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
}
ul.meta-data {
list-style: none;
float: left;
margin-bottom: 15px;
margin-top: 5px;
width: 100%;
}
ul.meta-data i { margin-right: 3px }
ul.meta-data li {
float: left;
margin-right: 5px;
border-right: 1px solid #b1b1b1;
line-height: 10px;
padding: 0 5px 0 0;
font-size: 11px;
}
ul.meta-data li:last-child { border-right: none }
ul.meta-data li a {
color: #999999;
margin-left: 5px;
font-size: 11px;
}
ul.meta-data li a:hover {
text-decoration: underline;
color: #437ea1;
}
.blog-post-intro {
margin:0px 20px 30px 20px;
width:100%;
}
.blog-post.layout-01 .blog-post-intro {
float: left;
margin: 0 25px;
}
.blog-post.layout-02 .blog-post-intro {
float: left;
margin: 0 25px;
width: 675px;
}
.blog-post-intro-text { float: left }
ul.post-tags li a:hover {
background: #3051c6;
color: #FFF;
}
article.blog-post.layout-01 .media-holder { line-height: 9px }
article.blog-post.layout-01 .blog-post-intro {
float: left;
width: 765px;
}
article.blog-post.layout-01 .blog-post-intro-text { float: left }
/*-----------------------------------------------*/
/* BLOG LAYOUT 02 STARTS */
/*---------------------------------------------*/
.post-meta {
float: left;
padding: 15px;
background: #3051c6;
color: #FFF;
font-weight: 800;
width: 35px;
margin-left: 25px;
margin-bottom: 25px;
font-family: 'OpenSansbold', Arial;
}
.post-meta .date {
position: relative;
transition: all 0.2s linear 0s;
}
.post-meta .month {
display: block;
font-size: 17px;
line-height: 10px;
text-align: center;
text-transform: uppercase;
margin-bottom: 4px;
padding: 0px;
}
.post-meta .post-type {
float: left;
font-size: 30px;
text-align: center;
margin-top: 10px;
border-top: 1px solid #FFF;
padding-top: 15px;
width: 100%;
}
.post-meta .day {
display: block;
font-size: 30px;
line-height: 29px;
text-align: center;
text-transform: uppercase;
}
/*-----------------------------------------------*/
/* BLOG LAYOUT 03 STARTS */
/*---------------------------------------------*/
.masonry-layout-wrapper{
width: 1137px;
float: left;
position: relative;
margin-right: -37px;
}
.blog-masonry-layout article{
float:left;
}
.article-content{
background: #fff;
padding: 20px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
width: 305px;
margin-right: 30px;
margin-bottom: 30px;
float:left;
}
.article-content .media-holder{
float:left;
width: 100%;
margin-bottom: 15px;
}
h2.article-title a{
font-size: 18px;
line-height: 26px;
}
/*-----------------------------------------------*/
/* PAGINATION STARTS */
/*---------------------------------------------*/
.pagination {
margin: 20px 0;
list-style: none;
text-align: center;
*zoom: 1;
}
.pagination:before,
.pagination:after {
display: table;
content: "";
line-height: 0;
}
.pagination:after { clear: both }
.pagination li { display: inline }
.pagination li > a,
.pagination li > span {
display: inline-block;
padding: 5px 14px;
background: #fff;
border: 1px solid #d9d9d9;
border-bottom: 2px solid #d9d9d9;
border-radius: 2px;
}
.pagination li > a:hover,
.pagination li > a:focus {
text-decoration: none;
border: 1px solid #c9c9c9;
border-bottom: 2px solid #c9c9c9;
}
.pagination .next > a,
.pagination .next > span { float: right }
.pagination .previous > a,
.pagination .previous > span { float: left }
.pagination .disabled > a,
.pagination .disabled > a:hover,
.pagination .disabled > a:focus,
.pagination .disabled > span {
color: #999999;
background: #fff;
cursor: default;
}
.pagination li > a:active {
text-decoration: none;
background: #FFF;
border-bottom: 1px solid #d9d9d9;
margin-top: 1px;
}
.sidebar .widget {
float: left;
margin-bottom: 30px;
width: 100%;
background: url("../images/title-bg.png") repeat-x bottom;
padding-bottom: 35px;
}
.sidebar h4.widget-title {
margin-bottom: 10px;
color: #999;
font-family: 'OpenSansbold', Arial;
font-size: 12px;
letter-spacing: 1.5px;
margin-bottom: 15px;
text-transform: uppercase;
text-shadow: 0px 1px #FFF;
}
.sidebar ul.post-related { margin-left: 0px }
.sidebar ul.post-related li {
padding: 8px 0px;
list-style: none;
border-bottom: 1px solid #e3e3e3;
}
.sidebar ul.post-related li .recent-post-thumb {
width: 34px;
height: 34px;
margin-right: 10px;
float: left;
margin-top: 5px;
}
.sidebar ul.post-related li a:hover { text-decoration: underline }
.sidebar ul.post-related li span.post-date {
display: block;
font-size: 11px;
color: #3051c6;
margin-top: -5px;
}
.sidebar ul.popular-tags {
list-style: none;
float: left;
width: 100%;
}
.sidebar ul.popular-tags li {
float: left;
margin-right: 5px;
margin-bottom: 5px;
}
.sidebar ul.popular-tags li a:hover { background: #3051c6 }
.sidebar ul.popular-tags li a {
transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
font-size: 11px;
padding: 3px 7px;
background: #646464;
color: #FFF;
border-radius: 2px;
}
.about-author {
margin-bottom: 40px;
margin-left:20px;
float: left;
width: 100%;
padding: 25px;
border: 1px solid #ebebeb;
border-top: 5px solid #3051c6;
background: #FFF;
box-shadow: 0 0px 7px #ebebeb;
}
.about-author-text {
float: left;
width: 380px;
}
.about-author-text h4 a {
margin-left: 5px;
font-family: "OpenSansBold", Arial;
}
.about-author-text h4 a,
.about-author-text a {
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
font-weight: 800;
text-decoration: none;
color: #898989;
}
.about-author-text h4 a:hover,
.about-author-text a:hover { color: #3051c6 }
.about-author-text p {
font-size: 13px;
font-style: italic;
}
.comment-author-avatar {
margin: 0 20px 0px 0;
padding: 0;
width: 64px;
height: 64px;
border: 5px solid #3051c6;
float: left;
z-index: 1;
border-radius: 100px;
}
.comment-author-avatar img { border-radius: 100px }
.meta-tags { padding: 15px }
/*--------------------------------------------------------------------------*/
/* BLOG COMMENTS LAYOUT */
/*--------------------------------------------------------------------------*/
.comment-list {
overflow: hidden;
margin: 0;
padding: 15px 0 0 0;
width: 100%;
}
.comment {
list-style-type: none;
margin: 0px 0 0 0;
padding: 25px 0 0 0;
}
.sub-comment {
padding-left: 40px;
border-left: 1px solid #d5d5d5;
background: url("../images/sub-comment-line.png") 0 60px no-repeat;
}
.sub-comment .comment-container .comment-meta-text {
float: left;
width: 629px;
}
.comment-container {
margin: 0;
overflow: hidden;
background: #FFF;
padding: 25px;
border: 1px solid #ebebeb;
box-shadow: 0 0px 7px #ebebeb;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
.comment:first-child {
border-top: none;
margin-top: 0;
}
.comment-avatar {
margin: 0 20px 0px 0;
padding: 0;
width: 64px;
height: 64px;
border: 5px solid #3051c6;
float: left;
z-index: 1;
border-radius: 100px;
}
.comment-avatar img { border-radius: 100px }
.comment .comment-meta {
font-size: 11px;
text-transform: uppercase;
}
.comment .comment-meta .reply {
font-size: 9px;
line-height: 16px;
letter-spacing: 1px;
font-weight: normal;
padding: 2px 5px;
border-radius: 2px;
color: #FFF;
background: #646464;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
margin: 0px 0px 0 5px;
}
.comment .comment-meta .reply:hover {
background: #3051c6;
color: #FFF;
}
.comment .author a {
color: #676767;
margin: 0;
font-weight: bold;
font-size: 13px;
}
.comment .author a:hover,
.comment .entry-date a:hover { color: #3051c6 }
.comment .entry-date a {
color: #aaa;
margin: 0 0 5px 0;
}
.comment .comment-text { margin-top: 5px }
.comment-meta-text {
float: left;
width: 670px;
}
/*_____________________________________________________________
10- PRICING TABLES
_____________________________________________________________*/
ul.pricing-box {
margin: 0;
padding: 0;
list-style-type: none;
position: relative;
}
ul.pricing-box li.one-fourth {
margin: 0;
width: 275px;
padding: 0px 0px 0px 0;
border-bottom: 1px solid #d9dee1;
float: left;
position: relative;
}
ul.pricing-box li.one-fifth {
margin: 0;
width: 220px;
padding: 0px 0px 0px 0;
border-bottom: 1px solid #d9dee1;
float: left;
position: relative;
}
ul.pricing-box li.one-third {
margin: 0;
width: 366px;
padding: 0px 0px 0px 0;
border-bottom: 1px solid #d9dee1;
float: left;
position: relative;
}
.pricing-box-container {
padding: 0px 0px 40px 0;
float: left;
}
ul.pricing-box li.one-fourth:last-child,
ul.pricing-box li.one-third:last-child,
ul.pricing-box li.one-fifth:last-child {
margin: 0 0px 0 0;
border-left: none;
}
ul.pricing-box li.one-fourth.best-plan,
ul.pricing-box li.one-third.best-plan,
ul.pricing-box li.one-fifth.best-plan {
z-index: 111;
background: #FFF;
margin: 0;
padding: 0px 0px 20px;
top: -20px;
box-shadow: 0 5px 15px rgba(0, 0, 0, .15);
}
ul.pricing-box li.one-fourth.best-plan:hover,
ul.pricing-box li.one-third.best-plan:hover,
ul.pricing-box li.one-fifth.best-plan:hover {
background: #FFF;
cursor: pointer;
box-shadow: 0 5px 25px rgba(0, 0, 0, .25);
top: -25px;
}
ul.pricing-box > li {
background: #f9f9f9;
float: left;
text-align: center;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
ul.pricing-box > li .pricing-box-container {
border: 1px solid #d9dee1;
border-bottom: none;
}
ul.pricing-box > li:last-child .pricing-box-container {
border: 1px solid #d9dee1;
border-bottom: none;
border-left: none;
}
ul.pricing-box > li:nth-child(2) .pricing-box-container {
border: 1px solid #d9dee1;
border-bottom: none;
border-left: none;
border-right: none;
}
ul.pricing-box > li.one-third:nth-child(3) .pricing-box-container {
border: 1px solid #d9dee1;
border-bottom: none;
}
ul.pricing-box li.one-fourth.best-plan .text-price { padding: 40px 0px 30px 0px }
ul.pricing-box li.one-third.best-plan .text-price { padding: 40px 0px 30px 0px }
ul.pricing-box li.one-fifth.best-plan .text-price { padding: 40px 0px 30px 0px }
ul.pricing-box > li.one-fifth:nth-child(3) .pricing-box-container {
border: 1px solid #d9dee1;
border-bottom: none;
border-right: none;
}
.text-price {
background: #1a98ce;
background: -webkit-linear-gradient(#3051c6, #1a98ce);
background: -moz-linear-gradient(#3051c6, #1a98ce);
background: -ms-linear-gradient(#3051c6, #1a98ce);
background: -o-linear-gradient(#3051c6, #1a98ce);
background: -webkit-gradient(#3051c6, #1a98ce);
background: linear-gradient(#3051c6, #1a98ce);
border-bottom: 1px solid #0783b9;
padding: 30px 0px 20px 0px;
width: 100%;
box-shadow: 0 2px 25px rgba(0, 0, 0, .20);
float: left;
}
.text-price h3 {
font-size: 48px;
font-weight: 300px;
color: #FFF;
text-shadow: 0px 2px #1a98ce;
}
.text-price span {
font-size: 13px;
font-weight: 300px;
color: #FFF;
font-style: italic;
text-shadow: 0px 2px #1a98ce;
}
.text-price-grey {
background: #3c3c3c;
background: -webkit-linear-gradient(#555555, #3c3c3c);
background: -moz-linear-gradient(#555555, #3c3c3c);
background: -ms-linear-gradient(#555555, #3c3c3c);
background: -o-linear-gradient(#555555, #3c3c3c);
background: -webkit-gradient(#555555, #3c3c3c);
background: linear-gradient(#555555, #3c3c3c);
border-bottom: 1px solid #323232;
padding: 30px 0px 20px 0px;
width: 100%;
box-shadow: 0 2px 25px rgba(0, 0, 0, .20);
float: left;
}
.text-price-grey h3 {
font-size: 48px;
font-weight: 300px;
color: #FFF;
text-shadow: 0px 2px #3c3c3c;
}
.text-price-grey span {
font-size: 13px;
font-weight: 300px;
color: #FFF;
font-style: italic;
text-shadow: 0px 2px #3c3c3c;
}
ul.pricing-box > li:hover {
background: #f0f0f0;
cursor: pointer;
}
.list-box-content ul {
float: left;
list-style: none;
margin-bottom: 40px;
}
.list-box-content ul li {
float: left;
padding: 7px 0;
width: 100%;
border-bottom: 1px solid #e1e1e1;
}
.list-box-content ul li:first-child {
border-bottom: 1px solid #e1e1e1;
border-top: 1px solid #e1e1e1;
}
/*_____________________________________________________________
11- BUTTONS
_____________________________________________________________*/
ul.button-holder {float:left;list-style:none;margin:10px 0;}
ul.button-holder li {width:100%;float:left;margin:13px 0;}
ul.button-holder.big li {width:100%;float:left;margin:20px 0;}
ul.button-holder li:first-child {margin:0px 0 13px 0;}
ul.button-holder li:last-child {margin:13px 0 0 0;}
.button {
font-size: 11px;
color:#FFF;
font-family: Arial, Verdana;
text-align: center;
text-shadow: 0 1px 0 rgba(0,0,0,0.2);
outline: none;
font-weight: 400;
text-transform: capitalize;;
cursor: pointer;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
border-bottom:1px solid;
background: #1a98ce;
background: -webkit-linear-gradient(#3051c6, #05228b);
background: -moz-linear-gradient(#3051c6, #05228b);
background: -ms-linear-gradient(#3051c6, #05228b);
background: -o-linear-gradient(#3051c6, #05228b);
background: -webkit-gradient(#3051c6, #05228b);
background: linear-gradient(#3051c6, #05228b);
border-bottom:1px solid #05228b;
}
.grey-button {
font-size: 11px;
color:#FFF;
font-family: Arial, Verdana;
text-align: center;
text-shadow: 0 1px 0 rgba(0,0,0,0.2);
outline: none;
font-weight: 400;
text-transform: capitalize;;
cursor: pointer;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
border-bottom:1px solid;
background: #353535;
background: -webkit-linear-gradient(#575757, #353535);
background: -moz-linear-gradient(#575757, #1a98ce);
background: -ms-linear-gradient(#575757, #353535);
background: -o-linear-gradient(#575757, #353535);
background: -webkit-gradient(#575757, #353535);
background: linear-gradient(#575757, #353535);
border-bottom:1px solid #252525;
}
.colored-button {
font-size: 11px;
color:#FFF;
font-family: Arial, Verdana;
text-align: center;
text-shadow: 0 1px 0 rgba(0,0,0,0.2);
outline: none;
font-weight: 400;
text-transform: capitalize;;
cursor: pointer;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
border-bottom:1px solid;
background: #353535;
background: -webkit-linear-gradient(#575757, #353535);
background: -moz-linear-gradient(#575757, #1a98ce);
background: -ms-linear-gradient(#575757, #353535);
background: -o-linear-gradient(#575757, #353535);
background: -webkit-gradient(#575757, #353535);
background: linear-gradient(#575757, #353535);
border-bottom:1px solid #252525;
}
.colored-button:hover {
background: #1a98ce;
background: -webkit-linear-gradient(#3051c6, #1a98ce);
background: -moz-linear-gradient(#3051c6, #1a98ce);
background: -ms-linear-gradient(#3051c6, #1a98ce);
background: -o-linear-gradient(#3051c6, #1a98ce);
background: -webkit-gradient(#3051c6, #1a98ce);
background: linear-gradient(#3051c6, #1a98ce);
border-bottom:1px solid #0783b9;
}
.colored-button:hover{}
.button:hover,.grey-button:hover {box-shadow: 0 0px 10px rgba(255, 255, 255, 0.35) inset;}
.button:active,.grey-button:active,.colored-button:active { box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35) inset;}
.button i.right,.grey-button i.right,.colored-button i.right {color:#FFF;margin-left:5px;}
.button i.left,.grey-button i.left,.colored-button i.left {color:#FFF;margin-right:5px;}
.button.small,.grey-button.small,.colored-button.small{ padding: 8px 16px; }
.button.big,.grey-button.big,.colored-button.big { padding: 14px 20px; }
.button.huge,.grey-button.huge,.colored-button.huge {
padding: 14px 20px;
font-size: 14px;
text-transform: uppercase;
font-weight: bold;
color: #FFF!important;
}
.button.block,.grey-button.block,.colored-button.block {
padding: 14px 20px;
font-size: 12px;
text-transform: uppercase;
font-weight: bold;
color: #FFF!important;
text-align: center;
float: left;
}
.button.block i.center,.grey-button.block i.center ,.colored-button.block i.center{
color:#FFF;
font-size: 34px;
text-transform: uppercase;
font-weight: bold;
padding: 16px 0px;
text-align: center;
display: block;
width: 100%
}
.button.round,.grey-button.round,.colored-button.round { border-radius: 4px;}
.button.circle,.grey-button.circle,.colored-button.circle { border-radius: 100px;}
.button-holder{margin:40px 0 0 0;}
.button-holder2-{margin:50px 0 0 0;}
/*_____________________________________________________________
12-OTHER BODY ELEMENTS
_____________________________________________________________*/
.revolution-slider {
width: 100%;
float: left;
position: relative;
padding: 0;
height: 485px;
margin: ¸0px 0 0 0;
overflow: hidden;
z-index: 1;
}
#home-slider-wrapper {
float: left;
margin-top: 50px;
position: relative;
width: 100%;
}
a.view_btn.yellow {
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
padding: 15px 30px;
font-size: 18px;
color: #FFF;
border-radius: 5px;
background: #f7e543;
margin: 30px 15px 30px 0;
float: left;
}
a.view_btn.green {
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
padding: 15px 30px;
font-size: 18px;
color: #FFF;
border-radius: 5px;
background: #99c24b;
margin: 30px 15px 30px 0;
float: left;
}
a.view_btn.yellow:hover,
a.view_btn.green:hover { background: #3051c6 }
.headings-titles {
margin: 10px 0 50px 0;
float: left;
width: 100%;
border-bottom: 1px solid #ebebeb;
padding-bottom: 40px;
text-align: center;
}
.headings-titles h1 {
font-family: "Georgia", Arial,Verdana;
font-style: italic;
font-size: 24px;
color: #898989;
line-height: 34px;
}
.headings-titles h4 {
font-weight: 300;
line-height: 30px;
}
#scrolltotop {
width: 48px;
height: 48px;
background: url("../images/skins/blue-corporate/top.png") top no-repeat;
margin: 0px 25px 10px 0;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
border-radius: 4px;
}
#scrolltotop:hover { background: url("../images/skins/blue-corporate/top.png") bottom no-repeat }
.big-intro {
float: left;
margin: 50px 0 50px 0;
float: left;
width: 100%;
border-bottom: 1px solid #ebebeb;
padding-bottom: 50px;
}
.big-intro h1 {
text-transform: uppercase;
letter-spacing: -2px;
margin-bottom: 20px;
color: #262626;
font-weight: 800;
font-size: 55px;
line-height: 60px;
font-family: "OpenSansBold", Arial;
}
.big-intro h1 span { color: #3051c6 }
.big-intro h4 {
font-size: 18px;
line-height: 28px;
font-style: italic;
}
.error-field {
text-align: center;
width: 100%;
float: left;
padding: 40px 0;
}
.error-field h1 {
font-size: 124px;
line-height: 134px;
color: #262626;
text-transform: uppercase;
font-family: "OpenSansBold",Arial,Verdana;
}
.error-field h3 { font-weight: 300 }
/*_____________________________________________________________
13-Widgets (Twitter,Dribbble, Flickr, Instagram)
_____________________________________________________________*/
.twitter-widget a { color: #437eb5 }
.twitter-widget a:hover { text-decoration: underline }
.twitter-widget .jta-tweet-body {
margin-top: 0px;
font-size: 11px;
}
.twitter-widget .jta-tweet-list-controls {
float: right;
margin-top: 0px;
}
.twitter-widget .jta-tweet-list-controls-button-prev,
.twitter-widget .jta-tweet-list-controls-button-next {
width: 25px;
height: 25px;
border-radius: 4px;
text-indent: -9999px;
display: inline-block;
cursor: pointer;
}
.twitter-widget .jta-tweet-list-controls-button-prev:hover,
.twitter-widget .jta-tweet-list-controls-button-next:hover { background-color: #3051c6 }
.twitter-widget .jta-tweet-list-controls-button-prev {
margin-right: 5px;
background: #959393 url("../images/tweet-prev.png") no-repeat;
}
.twitter-widget .jta-tweet-list-controls-button-next { background: #959393 url("../images/tweet-next.png") no-repeat }
.twitter-widget span.jta-tweet-timestamp {
font-size: 11px;
font-style: italic;
color: #3051c6;
margin-left: 70px;
margin-top: 10px;
width: auto;
display: block;
}
.twitter-widget .jta-tweet-timestamp a:hover { text-decoration: underline }
.dribbble-widget.inner { margin: 0px -5px 0 0px }
.dribbble-widget { margin: -7px -5px 0 0px }
.dribbble-widget ul {
float: left;
list-style: none;
}
.dribbble-widget li {
float: left;
border: 3px solid #292929;
border-radius: 4px;
display: block;
width: 72px;
height: 72px;
margin: 7px 5px 0 0;
display: block;
position: relative;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
.dribbble-widget.inner li { border: 3px solid #ededed }
.dribbble-widget li:hover { border: 3px solid #3051c6 }
.dribbble-widget li a img { border: none }
.instagram-widget div {
list-style: none;
float: left;
margin: 0px 5px 5px 0;
}
.instagram-widget div img {
margin-bottom: 5px;
border: none;
}
.instagram-widget div a {
float: left;
border: 3px solid #292929;
border-radius: 4px;
display: block;
width: 72px;
height: 72px;
display: block;
position: relative;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
.instagram-widget div a:hover { border: 3px solid #3051c6 }
.flickr-widget { margin: -7px -5px 0 0px }
.flickr-widget.inner { margin: 0px -5px 0 0px }
.flickr-widget ul {
float: left;
list-style: none;
}
.flickr-widget li {
float: left;
border: 3px solid #292929;
border-radius: 4px;
display: block;
width: 72px;
height: 72px;
margin: 7px 5px 0 0;
display: block;
position: relative;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
.flickr-widget.inner li { border: 3px solid #ededed }
.flickr-widget li:hover { border: 3px solid #3051c6 }
.flickr-widget li a img { border: none }
.twitter-wrapper {
float: left;
width: 100%;
height: auto;
padding: 5px 0;
background: #292929;
border-bottom: 1px solid #3b3b3b;
}
ul.jta-tweet-list {
float: left;
width: 100%;
height: auto;
list-style: none;
}
ul.jta-tweet-list li.jta-tweet-list-item {
float: left;
list-style: none;
overflow: hidden;
width: 100%;
}
ul.jta-tweet-list li a.jta-tweet-profile-image-link {
float: left;
margin-top: 5px;
margin-right: 15px;
}
ul.jta-tweet-list li a.jta-tweet-profile-image-link img {
border: 3px solid #1a1a1a;
border-radius: 4px;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
ul.jta-tweet-list li a.jta-tweet-profile-image-link:hover img { border: 3px solid #3051c6 }
.jta-tweet-body {
margin-top: 20px;
font-size: 11px;
}
.twitter-footer-widget span.jta-tweet-timestamp {
font-size: 11px;
font-style: italic;
color: #3051c6;
margin-left: 25px;
width: auto;
}
.twitter-footer-widget .jta-tweet-timestamp a:hover { text-decoration: underline }
.twitter-footer-widget a {
font-size: 11px;
color: #f0f0f0;
}
.twitter-footer-widget a:hover { color: #3051c6 }
.twitter-footer-widget .jta-tweet-list-controls {
float: right;
margin-top: -45px;
}
.twitter-footer-widget .jta-tweet-list-controls-button-prev,
.twitter-footer-widget .jta-tweet-list-controls-button-next {
width: 25px;
height: 25px;
border-radius: 4px;
text-indent: -9999px;
display: inline-block;
cursor: pointer;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
.twitter-footer-widget .jta-tweet-list-controls-button-prev:hover,
.twitter-footer-widget .jta-tweet-list-controls-button-next:hover { background-color: #3051c6 }
.twitter-footer-widget .jta-tweet-list-controls-button-prev {
margin-right: 5px;
background: #1a1a1a url("../images/tweet-prev.png") no-repeat;
}
.twitter-footer-widget .jta-tweet-list-controls-button-next { background: #1a1a1a url("../images/tweet-next.png") no-repeat }
/*_____________________________________________________________
13- Tabs & Accordions
_____________________________________________________________*/
.tabs-nav,
.tabs-nav-2 {
list-style: none;
margin: 0;
overflow: hidden;
padding: 0;
width: 100%;
}
.tabs-nav li,
.tabs-nav-2 li {
float: left;
line-height: 32px;
margin: 0;
overflow: hidden;
padding: 0;
position: relative;
}
.tabs-nav li.active,
.tabs-nav-2 li.active { line-height: 31px }
.tabs-nav li a,
.tabs-nav-2 li a {
background: #f8f8f8;
border: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-left: none;
color: #959393;
display: block;
letter-spacing: 0;
outline: none;
padding: 0 10px;
text-decoration: none;
text-shadow: 0 1px 0 #fff;
}
.tabs-nav li:first-child a,
.tabs-nav-2 li:first-child a { border-left: 1px solid #dddddd }
.tabs-nav li a:hover,
.tabs-nav-2 li a:hover { background: #f0f0f0 }
.tabs-nav li.active a,
.tabs-nav-2 li.active a {
background: #fff;
border-bottom: 2px solid #fff;
border-top: 1px solid #3051c6;
color: #3051c6;
}
.tabs-nav li.active a span,
.tabs-nav-2 li.active a span { color: #3051c6 }
.tabs-container,
.tabs-container-2 {
border: 1px solid #dddddd;
margin: -1px 0 20px;
overflow: hidden;
width: 100%;
}
.tab-content,
.tab-content-2 {
padding: 20px;
background: #FFF;
}
.tab-nav-3-wrapper {
float: left;
width: 100%;
}
.tabs-nav-3 {
list-style: none;
overflow: hidden;
border: 1px solid #dddddd;
border-right: none;
float: left;
width: 25%;
}
.tabs-nav-3 li {
list-style: none;
line-height: 32px;
margin: 0;
overflow: hidden;
padding: 0;
display: block;
position: relative;
}
.tabs-nav-3 li.active { line-height: 31px }
.tabs-nav-3 li a {
background: #f8f8f8;
border-bottom: 1px solid #dddddd;
color: #959393;
display: block;
letter-spacing: 0;
outline: none;
padding: 0 10px;
text-decoration: none;
text-shadow: 0 1px 0 #fff;
}
.tabs-nav-3 li:last-child a { border-bottom: none }
.tabs-nav-3 li:first-child a { border-left: none }
.tabs-nav-3 li a:hover { background: #f0f0f0 }
.tabs-nav-3 li.active a {
background: #fff;
border-top: 1px solid #3051c6;
color: #3051c6;
}
.tabs-nav-3 li.active a span { color: #3051c6 }
.tabs-nav-3 li a span { margin-right: 5px }
.tabs-container-3 {
border: 1px solid #dddddd;
background: #FFF;
float: left;
width: 74%;
}
.tab-content-3 {
padding: 20px;
background: #FFF;
}
/*ACCORDIONS*/
ul.accordion-simple {
display: inline;
float: left;
width: 100%;
margin-bottom: 30px;
}
ul.accordion-simple li.accordion-item {
float: left;
width: 100%;
border-bottom: 1px solid #f0f0f0;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
ul.accordion-simple li.accordion-item:hover { background: #3051c6 }
ul.accordion-simple li.accordion-item.selected { background: #f9f9f9 }
ul.accordion-simple li.accordion-item.selected .accordion-switch { font-weight: bold }
ul.accordion-simple li.accordion-item .accordion-switch {
cursor: pointer;
padding-top: 15px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 14px;
font-size: 12px;
color: #777;
line-height: 22px;
}
ul.accordion-simple li.accordion-item .togglegfx {
float: left;
height: 22px;
width: 22px;
background: url('../images/accordion-toggle.png') no-repeat left top;
padding-right: 15px;
margin-bottom: 11px;
margin-top: 1px;
}
ul.accordion-simple li.accordion-item.selected .accordion-switch .togglegfx { background-position: left bottom }
ul.accordion-simple li.accordion-item .accordion-content { padding: 0 20px 20px 20px }
/*--------------------------------------------------------------------------*/
/* ACCORDION */
/*--------------------------------------------------------------------------*/
ul.accordion {
display: inline;
float: left;
width: 100%;
}
ul.accordion li {
float: left;
width: 100%;
padding: 0;
}
ul.accordion .accordion-switch {
float: left;
width: 100%;
background: #eaeaea;
margin-bottom: 15px;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
cursor: pointer;
font-size: 12px;
color: #777;
line-height: 22px;
padding: 12px 0 0px 0;
border-radius: 4px;
}
ul.accordion .accordion-switch:hover { background: #dfdfdf }
ul.accordion li.accordion-item.selected .accordion-switch {
color: #FFF;
background: #3051c6;
}
ul.accordion li.accordion-item .accordion-switch {
color: #777;
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
}
ul.accordion li.accordion-item.selected .accordion-switch { color: #FFF }
ul.accordion li.accordion-item .togglegfx {
float: left;
height: 22px;
width: 22px;
background: url('../images/accordion-toggle.png') no-repeat left top;
padding-right: 15px;
margin-bottom: 11px;
margin-left: 15px;
margin-top: 1px;
}
ul.accordion li.accordion-item.selected .accordion-switch .togglegfx { background-position: left bottom }
ul.accordion li.accordion-item .accordion-content {
padding: 0 20px 20px 50px;
font-size: 12px;
line-height: 22px;
}
/*--------------------------------------------------------------------------*/
/* ACCORDION TOGGLE */
/*--------------------------------------------------------------------------*/
ul.accordion-toggle {
display: inline;
float: left;
width: 100%;
}
ul.accordion-toggle li {
float: left;
width: 100%;
padding: 0;
}
ul.accordion-toggle .accordion-switch-toggle {
float: left;
width: 100%;
background: #eaeaea;
margin-bottom: 15px;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
-o-transition: all 0.25s ease-out;
-ms-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
cursor: pointer;
font-size: 12px;
color: #777;
line-height: 22px;
padding: 12px 0 0px 0;
border-radius: 4px;
}
ul.accordion-toggle .accordion-switch-toggle:hover { background: #dfdfdf }
ul.accordion-toggle li.accordion-item-toggle.selected .accordion-switch-toggle {
color: #FFF;
background: #3051c6;
}
ul.accordion-toggle li.accordion-item-toggle .accordion-switch-toggle {
color: #777;
font-size: 12px;
letter-spacing: 1px;
text-transform: uppercase;
}
ul.accordion-toggle li.accordion-item-toggle.selected .accordion-switch-toggle { color: #FFF }
ul.accordion-toggle li.accordion-item-toggle .togglegfx {
float: left;
height: 22px;
width: 22px;
background: url('../images/accordion-toggle.png') no-repeat left top;
padding-right: 15px;
margin-bottom: 11px;
margin-left: 15px;
margin-top: 1px;
}
ul.accordion-toggle li.accordion-item-toggle.selected .accordion-switch-toggle .togglegfx { background-position: left bottom }
ul.accordion-toggle li.accordion-item-toggle .accordion-content-toggle {
padding: 0 20px 20px 50px;
font-size: 13px;
line-height: 22px;
}
/*_____________________________________________________________
15 - DROPCAPS
_____________________________________________________________*/
.dropcap-1 {
float: left;
font-size: 53px;
line-height: 48px;
margin:0 10px 0 0;
font-weight: bold;
color:#3051c6;
}
.dropcap-2 {
color: #FFFFFF;
display: block;
float: left;
font-size: 24px;
line-height: 33px;
margin: 0px 10px 0 0;
padding: 5px 0;
text-align: center;
width: 44px;
background:#3051c6;
font-weight: bold;
}
.dropcap-3 {
background:#3051c6;
border-radius: 55px 55px 55px 55px;
color: #FFFFFF;
display: block;
float: left;
font-size: 24px;
line-height: 44px;
margin: 0px 10px 0px 0;
text-align: center;
width: 44px;
border:5px solid #f5f5f5;
font-weight: bold;
}
.dropcap-4 {
float: left;
font-size: 53px;
line-height: 48px;
margin:0 10px 0 0;
font-weight: bold;
color:#333;
}
.dropcap-5 {
color: #3051c6;
display: block;
float: left;
font-size: 24px;
line-height: 33px;
margin: 0px 10px 0 0;
padding: 5px 0;
text-align: center;
width: 44px;
background:#333;
font-weight: bold;
border:4px solid #3051c6;
}
.dropcap-6 {
background:#333;
border-radius: 55px 55px 55px 55px;
color: #FFFFFF;
display: block;
float: left;
font-size: 24px;
line-height: 44px;
margin: 0px 10px 0px 0;
text-align: center;
width: 44px;
border:5px solid #f5f5f5;
font-weight: bold;
}
.dropcap-7 {
float: left;
font-size: 53px;
line-height: 48px;
margin:0 10px 0 0;
font-weight: normal;
font-family: "Georgia",Arial,Verdana;
font-style: italic;
color:#888;
}
.dropcap-8 {
color: #FFFFFF;
display: block;
float: left;
font-size: 24px;
line-height: 33px;
margin: 0px 10px 0 0;
padding: 5px 0;
text-align: center;
width: 44px;
background:#888;
font-weight: bold;
border:4px solid #3051c6;
border-radius: 4px;
}
.dropcap-9 {
background:#333;
border-radius: 55px 55px 55px 55px;
color: #FFFFFF;
display: block;
float: left;
font-size: 24px;
line-height: 44px;
margin: 0px 10px 0px 0;
text-align: center;
width: 44px;
border:5px solid #f5f5f5;
font-family: "Georgia",Arial,Verdana;
font-style: italic;
}
/*_____________________________________________________________
16 - ERROR MESSAGES
_____________________________________________________________*/
.alert-warning{
background:#fcf8e3;
padding:10px;
color:#c09853;
border:1px solid #fbeed5;
margin:10px 0;
text-shadow:0px 1px #FFF;
}
.alert-error{
background:#f2dede;
padding:10px;
color:#b94a48;
border:1px solid #eed3d7;
margin:10px 0;
text-shadow:0px 1px #FFF;
}
.alert-success{
background:#dff0d8;
padding:10px;
color:#468847;
border:1px solid #d6e9c6;
margin:10px 0;
text-shadow:0px 1px #FFF;
}
.alert-info{
background:#d9edf7;
padding:10px;
color:#3a87bd;
border:1px solid #bce8f1;
margin:10px 0;
text-shadow:0px 1px #FFF;
}
.alert-close{
width:16px;
line-height: 10px;
margin:3px 0 0 0;
padding-top: 2px;
height:14px;
color:#FFF;
float:right;
background:#333;
background:rgba(0,0,0,0.4);
text-align: center;
border-radius: 100px;
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.alert-close:hover{ background:#333;}
.simple-error,.simple-notice,.simple-success,.simple-info {
padding:15px 20px 15px 40px;
margin-bottom:1em;
border:1px solid #ddd;
}
.simple-error{
background:#fbe3e4 url(../images/icons/bg-msg.png) 5px -3% no-repeat;
border-color:#fbc2c4;
border-left:4px solid #fbc2c4;
color:#e64135;
}
.simple-notice {
background:#fff6bf url(../images/icons/bg-msg.png) 5px 70% no-repeat;
color:#514721;
border-color:#ffd324;
border-left:4px solid #ffd324;
}
.simple-success {
background:#e6efc2 url(../images/icons/bg-msg.png) 5px 105% no-repeat;
color:#264409;
border-color:#c6d880;
border-left:4px solid #c6d880;
}
.simple-info {
background:#d5edf8 url(../images/icons/bg-msg.png) 5px 32% no-repeat;
color:#205791;
border-color:#92cae4;
border-left:4px solid #92cae4;
}
.simple-error a,.simple-alert a {color:#8a1f11;}
.simple-notice a {color:#514721;}
.simple-success a {color:#264409;}
.simple-info a {color:#205791;}
.required {color:#e64135;}
.required {color:#ed1c24;}
.error {
color:#e64135;
text-align:left;
font-size:11px;
font-style:italic;
font-family:"Georgia", Verdana;
margin-top: 10px;
}
.success {
color:#FFF;
background: #acd373;
border:1px solid #85b244;
text-align:left;
font-size:13px;
font-style:italic;
font-family:"Georgia", Verdana;
margin-top: 10px;
padding:10px;
}
/*_____________________________________________________________
17 - LISTS
_____________________________________________________________*/
ul.dotted-list { margin-bottom:30px; }
ul.dotted-list li { padding: 6px 0 6px 20px;border-bottom: 1px solid #ececec;}
ul.dotted-list li a { color:#437ea1;text-decoration:none; }
ul.dotted-list li a:hover { color:#437ea1;text-decoration:underline; }
li.simple-check-list { background: url(../images/list-icons/list-check-2.png) no-repeat 0 7px }
li.simple-plus-list { background: url(../images/list-icons/list-plus.png) no-repeat 0 9px }
li.simple-star-list { background: url(../images/list-icons/list-star.png) no-repeat 0 6px }
li.simple-dott-list { background: url(../images/list-icons/list-circle.png) no-repeat 0 10px }
li.simple-dash-list { background: url(../images/list-icons/list-dash.png) no-repeat 0 10px }
li.simple-check-list-2 { background: url(../images/list-icons/list-check.png) no-repeat 0 10px }
li.simple-arrow-list { background: url(../images/list-icons/list-arrow.png) no-repeat 0 11px }
li.simple-heart-list { background: url(../images/list-icons/list-heart.png) no-repeat 0 7px }
li.simple-info-list { background: url(../images/list-icons/list-info.png) no-repeat 0 7px }
li.simple-settings-list { background: url(../images/list-icons/list-settings.png) no-repeat 0 7px }
/*_____________________________________________________________
18 - SOCIAL WIDGETS ALTERNATIVE
_____________________________________________________________*/
ul.social-widget {
list-style-type: none;
padding: 0px;
margin: 0px 0 0px 0;
float: left;
}
ul.social-widget li {
float: left;
display: inline;
margin-right: 1px;
margin-bottom: 1px;
width: 34px;
height: 34px;
text-indent: -99999px;
display: block;
-moz-transition: all 0.14s ease 0s;
-webkit-transition: all 0.14s ease 0s;
-o-transition: all 0.14s ease 0s;
}
ul.social-widget li:last-child{ margin-right: 0px;}
ul.social-widget.round li {border-radius: 100px;}
ul.social-widget li a {
display: block;
width: 34px;
height: 34px;
text-indent: -99999px;
}
ul.social-widget li.twitter { background: #595959 url("../images/social-icons/twitter.png") 50% 50% no-repeat }
ul.social-widget li.twitter:hover { background: #48c4d2 url("../images/social-icons/twitter.png") 50% 50% no-repeat }
ul.social-widget li.facebook { background: #595959 url("../images/social-icons/facebook.png") 50% 50% no-repeat }
ul.social-widget li.facebook:hover { background: #3b5998 url("../images/social-icons/facebook.png") 50% 50% no-repeat }
ul.social-widget li.rss { background: #595959 url("../images/social-icons/rss.png") 50% 50% no-repeat }
ul.social-widget li.rss:hover { background: #fe9900 url("../images/social-icons/rss.png") 50% 50% no-repeat }
ul.social-widget li.dribbble { background: #595959 url("../images/social-icons/dribbble.png") 50% 50% no-repeat }
ul.social-widget li.dribbble:hover { background: #ef5b92 url("../images/social-icons/dribbble.png") 50% 50% no-repeat }
ul.social-widget li.vimeo { background: #595959 url("../images/social-icons/vimeo.png") 50% 50% no-repeat }
ul.social-widget li.vimeo:hover { background: #41b0ff url("../images/social-icons/vimeo.png") 50% 50% no-repeat }
ul.social-widget li.skype { background: #595959 url("../images/social-icons/skype.png") 50% 50% no-repeat }
ul.social-widget li.skype:hover { background: #18b7f1 url("../images/social-icons/skype.png") 50% 50% no-repeat }
ul.social-widget li.linkedin { background: #595959 url("../images/social-icons/linkedin.png") 50% 50% no-repeat }
ul.social-widget li.viadeo { background: #595959 url("../images/viadeo.png") 50% 50% no-repeat }
ul.social-widget li.viadeo:hover { background: #717171 url("../images/viadeo.png") 50% 50% no-repeat }
ul.social-widget li.linkedin:hover { background: #71b2d0 url("../images/social-icons/linkedin.png") 50% 50% no-repeat }
ul.social-widget li.youtube { background: #595959 url("../images/social-icons/youtube.png") 50% 50% no-repeat }
ul.social-widget li.youtube:hover { background: #f45750 url("../images/social-icons/youtube.png") 50% 50% no-repeat }
ul.social-widget li.tumblr { background: #595959 url("../images/social-icons/tumblr.png") 50% 50% no-repeat }
ul.social-widget li.tumblr:hover { background: #3a5976 url("../images/social-icons/tumblr.png") 50% 50% no-repeat }
ul.social-widget li.delicious { background: #595959 url("../images/social-icons/delicious.png") 50% 50% no-repeat }
ul.social-widget li.delicious:hover { background: #3274d1 url("../images/social-icons/delicious.png") 50% 50% no-repeat }
ul.social-widget li.google-plus { background: #595959 url("../images/social-icons/google-plus.png") 50% 50% no-repeat }
ul.social-widget li.google-plus:hover { background: #d94a39 url("../images/social-icons/google-plus.png") 50% 50% no-repeat }
ul.social-widget li.flickr { background: #595959 url("../images/social-icons/flickr.png") 50% 50% no-repeat }
ul.social-widget li.flickr:hover { background: #f1628b url("../images/social-icons/flickr.png") 50% 50% no-repeat }
ul.social-widget li.pinterest { background: #595959 url("../images/social-icons/pinterest.png") 50% 50% no-repeat }
ul.social-widget li.pinterest:hover { background: #cb2027 url("../images/social-icons/pinterest.png") 50% 50% no-repeat }
/*_____________________________________________________________
19- COLORED ICONS
_____________________________________________________________*/
.colored-box {
border-radius: 10px;
background: #f5f5f5;
text-align: center;
float: left;
position: relative;
padding: 20px;
transition: all 0.1s linear;
-webkit-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
}
.colored-box:hover {
cursor: pointer;
box-shadow: 0px 0px 15px #CCC;
background: #FFF;
}
.colored-box .service-img { margin-bottom: 10px }
.colored-icon,
.colored-icon-2,
.colored-icon-3,
.colored-icon-4,
.colored-icon-5,
.colored-icon-6,
.colored-icon-7,
.colored-icon-8,
.colored-icon-9 {
border-radius: 100px;
display: inline-block;
font-size: 30px;
height: 90px;
line-height: 90px;
position: relative;
text-align: center;
vertical-align: middle;
width: 90px;
transition: all 0.1s linear;
-webkit-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
margin: 0px 0 30px 0;
cursor: pointer;
}
.center-txt,.service-img.center-txt {
width: 100%;
text-align: center;
float: left;
}
.colored-icon {
background: #333;
border: 5px solid #FFF;
color: #FFF;
}
.colored-icon-2 {
background: #f8f8f8;
border: 5px solid #f5f5f5;
color: #3051c6;
}
.colored-icon:hover {
background: #FFF;
color: #3051c6;
border: 5px solid #3051c6;
}
.colored-icon-2:hover {
background: #3051c6;
color: #FFF;
border: 5px solid #e2e2e2;
}
.colored-icon-3 {
background: #333;
border: 5px solid #3051c6;
color: #3051c6;
}
.colored-icon-3:hover {
background: #333;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-4 {
background: #3051c6;
border: 5px solid #333;
color: #FFF;
}
.colored-icon-4:hover {
background: #333;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-5 {
background: #3051c6;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-5:hover {
background: #3051c6;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-6 {
background: #3051c6;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-6:hover {
background: #3051c6;
border: 5px solid #333;
color: #FFF;
}
.colored-icon-7 {
background: #FFF;
border: 5px solid #888;
color: #888;
}
.colored-icon-7:hover {
background: #3051c6;
border: 5px solid #3051c6;
color: #FFF;
}
.colored-icon-8 {
background: #fff;
border: 5px solid #888;
color: #888;
}
.colored-icon-8:hover {
background: #FFF;
border: 5px solid #3051c6;
color: #3051c6;
}
.colored-icon-9 {
background: transparent;
border: 2px solid #666666;
color: #666666;
}
.colored-icon-9:hover {
background: transparent;
border: 2px solid #3051c6;
color: #3051c6;
}
/*___________________________________________________*/
/*20 - Other Features Elements*/
/*___________________________________________________*/
.member-info-img {
float: left;
width: 220px;
height: auto;
margin: 0px 30px 10px 0px;
}
.service-img {
float: left;
width: 48px;
height: auto;
margin: 0 30px 0px 0;
}
.service-img span {
font-size: 48px;
color: #3051c6;
}
.service-txt {
float: left;
width: 266px;
}
.service-txt h4 {
font-weight: 800;
margin-bottom: 10px;
}
.service-txt p {
font-size: 13px;
line-height: 26px;
}
.colored-features-block {
width: 100%;
float: left;
background: #424242;
height: auto;
padding: 40px 0;
margin: 50px 0 50px 0;
}
.colored-features-block-txt {
float: left;
padding: 60px 0 0 0;
}
.colored-features-block-txt h2 {
font-weight: 800;
color: #3051c6;
}
.colored-features-block-txt p { color: #FFF }
.side-nav {
background: #323232;
float: left;
padding: 20px 0;
width: 100%;
}
ul.side-nav-list {
float: left;
list-style: none;
}
ul.side-nav-list li {
float: left;
display: block;
width: 100%;
list-style: none;
border-bottom: 1px solid #3b3b3b;
-webkit-transition: all 0.35s ease-out;
-moz-transition: all 0.35s ease-out;
-o-transition: all 0.35s ease-out;
-ms-transition: all 0.35s ease-out;
transition: all 0.35s ease-out;
}
ul.side-nav-list li:hover {
background: #3051c6;
color: #FFF;
}
ul.side-nav-list li:hover a { color: #FFF }
ul.side-nav-list li:hover a i { color: #FFF }
ul.side-nav-list li a {
padding: 7px 10px 7px 15px;
float: left;
display: block;
width: 100%;
}
ul.side-nav-list li a i {
margin-right: 10px;
font-size: 15px;
}
.side-nav-title {
background: #292929;
border-bottom: 1px solid #3b3b3b;
color: #FFF;
margin-top: -20px;
margin-bottom: 0px;
padding: 10px;
}
#google-map {
height: 450px;
padding: 0px 0 0px 0;
position: relative;
width: 100%;
margin-bottom: 50px;
margin-top: -50px;
float: left;
}
#google-map:before,
#google-map:after {
background: none;
box-shadow: 0 0 5px 2px rgba(54, 55, 54, 0.25);
content: '';
left: 0;
position: absolute;
top: 0;
width: 100%;
}
#google-map:after {
bottom: 0;
top: auto;
}
ul.contact-info-widget {
list-style: none;
float: left;
width: 100%;
}
ul.contact-info-widget li {
width: 100%;
float: left;
display: block;
padding: 5px 0px 5px 0px;
border-bottom: 1px solid #e1e1e1;
background: none;
}
ul.contact-info-widget li:first-child { border-top: 1px solid #e1e1e1 }
ul.contact-info-widget li a {
padding-left: 5px;
color: #3051c6;
}
ul.contact-info-widget li i { font-size: 14px }
ul.contact-info-widget li a:hover { text-decoration: underline }
blockquote.quote-left,
blockquote.quote-right {
font-size: 15px;
line-height: 20px;
padding-left: 15px;
}
.quote-left {
float: left;
width: 170px;
margin-right: 20px;
margin-left: 0;
margin-top: 0px;
font-size: 14px;
border-right: 3px solid #CCC;
background: none;
}
.quote-right {
float: right;
width: 150px;
margin-left: 20px;
margin-top: 0px;
border-left: 3px solid #CCC;
background: none;
font-size: 14px;
}
/*______________________________________________________________*/
/* FLEX SLIDER CSS */
/*______________________________________________________________*/
.flex-direction-nav li a.flex-next,
.flex-direction-nav li a.flex-prev { width:64px;height:64px;text-indent:-9999px;display:block;position:absolute;top:42%; }
.flex-direction-nav li .flex-next {background:url("../images/skins/blue-corporate/slider-next.png") top left no-repeat;right:40px;}
.flex-direction-nav li .flex-prev { background:url("../images/skins/blue-corporate/slider-prev.png") top left no-repeat;left:40px;}
.flex-direction-nav li .flex-next:hover {background:url("../images/skins/blue-corporate/slider-next.png")bottom left no-repeat;}
.flex-direction-nav li .flex-prev:hover { background:url("../images/skins/blue-corporate/slider-prev.png") bottom left no-repeat;}
.flex-direction-nav{display: none;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}
.flex-control-nav {width: auto;position: absolute;text-align:center;display:block;z-index:250;right:35px;bottom:25px;}
.flex-control-nav li {margin: 0px 0 0 7px; display: inline-block; zoom: 1; *display: inline;text-indent:-9999px;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;width: 10px; height: 10px;display: block; background:#FFF;cursor:pointer; text-indent: -999em;border-radius:100px;}
.flex-control-nav li a:hover {background:#cacaca;}
.flex-control-nav li a.flex-active {background:#3051c6;}
.flex-caption {zoom: 1;background:#3051c6;background:rgba(75,170,211,0.7);width:auto;height:auto;position:absolute;left:0;bottom:70px;z-index:111;padding:20px; }
.flex-caption h3{color:#FFF;text-transform:uppercase;display:inline-block;margin-bottom:0;}
/*______________________________________________________________*/
/* REVOLUTION SLIDER CSS */
/*______________________________________________________________*/
.tp-caption a.button_black{
height:auto;
font-size:13px;
background:rgba(0,0,0,0.75);
padding:10px 16px;
color:#FFF;
border:2px solid #3051c6;
display:block;
}
.tp-caption a.button_black:hover{
background:#000;
color:#3051c6;
border:2px solid #000;
}
.tp-bullets.simplebullets.square-old .bullet { background:#3051c6;}
.tp-bullets.simplebullets.square-old .bullet.last { margin-right:0px;}
.tp-bullets.simplebullets .bullet.selected { background:#3051c6!important; }
.tp-bullets.simplebullets .bullet:hover { opacity:0.75; }
.tp-bannertimer { width:100%; bottom:0px;height:5px; background:#3051c6;position:absolute; z-index:9999;visibility: visible!important;display:block!important;}
.tp-bannertimer.tp-bottom { bottom:0px !important;height:5px;}
.tp-leftarrow.large { background:url("../images/skins/blue-corporate/slider-prev.png") no-repeat top left; }
.tp-rightarrow.large { background:url("../images/skins/blue-corporate/slider-next.png") no-repeat top left; }
/*______________________________________________________________*/
/* NIVO SLIDER CSS */
/*______________________________________________________________*/
.nivo-prevNav {
left:40px;
background:url("../images/skins/blue-corporate/slider-prev.png") top left no-repeat;left:40px;
}
.nivo-nextNav {
right:40px;
background:url("../images/skins/blue-corporate/slider-next.png") top left no-repeat;right:40px;
}
.nivo-prevNav:hover {
left:40px;
background:url("../images/skins/blue-corporate/slider-prev.png") bottom left no-repeat;left:40px;
}
.nivo-nextNav:hover {
right:40px;
background:url("../images/skins/blue-corporate/slider-next.png") bottom left no-repeat;right:40px;
}
.nivo-controlNav a.active {
background:#3051c6;
}
/*______________________________________________________________*/
/* CAMERA SLIDER CSS */
/*______________________________________________________________*/
.camera_bar {
bottom: 0;
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
background-color: #c2c2c2;
z-index: 3;
}
.camera_wrap .camera_pag .camera_pag_ul li {
background: #c2c2c2;
}
/*______________________________________________________________*/
/* AUDIO/VIDEO PLAYER */
/*______________________________________________________________*/
div.jp-play-bar {
background-color:#3051c6;
background:#3051c6 -webkit-gradient(linear, left top, left bottom, from(#3051c6), to(#1a98ce));
background:#3051c6 -webkit-linear-gradient(#3051c6, #1a98ce) 0 -1px repeat-x;
background:#3051c6 -moz-linear-gradient(#3051c6, #1a98ce) 0 -1px repeat-x;
background:#3051c6 -o-linear-gradient(#3051c6, #1a98ce) 0 -1px repeat-x;
background:#3051c6 linear-gradient(#3051c6, #1a98ce) 0 -1px repeat-x;
width:0;
height:100%;
}
div.jp-volume-bar-value {
background-color:#3051c6;
background:-webkit-gradient(linear, left top, left bottom, from(#3051c6), to(#1a98ce));
background:-webkit-linear-gradient(#3051c6, #1a98ce);
background:-moz-linear-gradient(#3051c6, #1a98ce);
background:-o-linear-gradient(#3051c6, #1a98ce);
background:linear-gradient(#3051c6, #1a98ce);
width:0;
height:7px;
}
/*______________________________________________________________*/
/* CUSTOM FORMS CHECKBOXES AND RADIO */
/*______________________________________________________________*/
.icheckbox_flat,
.iradio_flat {
display: block;
margin: 0 5px 0 0;
padding: 0;
width: 20px;
height: 20px;
background: url("../images/skins/blue-corporate/flat.png") no-repeat;
border: none;
cursor: pointer;
float:left;
}
/*______________________________________________________________*/
/* 3D CUTE SLIDER CSS */
/*______________________________________________________________*/
.br-next {
position: absolute;
width:64px;
height:64px;
text-indent:-9999px;
display:block;
position:absolute;
top:42%;
background:url("../images/skins/blue-corporate/slider-next.png") top left no-repeat;
right:40px;
}
.br-next:hover {
background:url("../images/skins/blue-corporate/slider-next.png")bottom left no-repeat;
}
.br-previous{
position: absolute;
width:64px;
height:64px;
text-indent:-9999px;
display:block;
position:absolute;
top:42%;
background:url("../images/skins/blue-corporate/slider-prev.png") top left no-repeat;
left:40px;
}
.br-previous:hover{background:url("../images/skins/blue-corporate/slider-prev.png")bottom left no-repeat;}
.br-slidecontrol ul li .br-control-selected{
background:#3051c6;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;width: 10px; height: 10px;display: block; cursor:pointer; text-indent: -999em;border-radius:100px;
}
.br-slideinfo .cute-caption div h4 {color:#3051c6;font-size:26px;font-weight:bold;line-height:30px;}
/*______________________________________________________________*/
/* LAYER SLIDER CSS */
/*______________________________________________________________*/
.ls-fullwidth .ls-nav-prev,.ls-fullwidth .ls-nav-next{width:64px;height:64px; z-index: 10000; top: 50%; margin-top: -20px; position: absolute;}
.ls-fullwidth .ls-nav-prev{background:url("../images/skins/blue-corporate/slider-prev.png") top left no-repeat;left:40px;}
.ls-fullwidth .ls-nav-prev:hover{background:url("../images/skins/blue-corporate/slider-prev.png") bottom left no-repeat;}
.ls-fullwidth .ls-nav-next{background:url("../images/skins/blue-corporate/slider-next.png") top left no-repeat;right:40px;}
.ls-fullwidth .ls-nav-next:hover{background:url("../images/skins/blue-corporate/slider-next.png") bottom left no-repeat;}
.ls_large_text_01 {
background:#3051c6;
padding:10px 10px;
border-radius: 2px;
font-size: 24px;
font-family:"OpenSansRegular", Arial, Verdana;
color: #FFF;
text-transform: uppercase;
}
.ls_large_text_01:hover {
background:#05228b;
}
.ls_large_text_02 {
background:#FFF;
padding:10px 10px;
border-radius: 2px;
font-size: 24px;
font-family:"OpenSansRegular", Arial, Verdana;
color: #3051c6;
text-transform: uppercase;
}
.bx-wrapper .bx-pager {
text-align: center;
font-size: .85em;
font-family: Arial;
font-weight: bold;
color: #666;
padding-top: 20px;
}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
display: inline-block;
*zoom: 1;
*display: inline;
}
.bx-wrapper .bx-pager.bx-default-pager a {
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width: 9px;
height: 9px;
background: #e1e1e1;
border: 1px solid #f5f5f5;
cursor: pointer;
text-indent: -9999px;
border-radius: 100px;
margin-right: 7px;
display: inline-block;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover{ background: #cacaca;}
.bx-wrapper .bx-pager.bx-default-pager a.active {
background: #3051c6;
border: 1px solid #3051c6;
}
/*SMOOTH SCROLL CSS*/
#ascrail2000{
background: #222222;
background: -moz-linear-gradient(left, #222222 10%, #272727 50%, #323232 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(10%,#222222), color-stop(50%,#272727), color-stop(100%,#323232));
background: -webkit-linear-gradient(left, #222222 10%,#272727 50%,#323232 100%);
background: -o-linear-gradient(left, #222222 10%,#272727 50%,#323232 100%);
background: -ms-linear-gradient(left, #222222 10%,#272727 50%,#323232 100%);
background: linear-gradient(to right, #222222 10%,#272727 50%,#323232 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#323232',GradientType=1 );
box-shadow: inset 0px 0px 5px #272727;
}
#ascrail2000 div{
background: #3051c6;
background: -moz-linear-gradient(left, #3051c6 0%, #3051c6 50%, #0b2687 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#4a4a4a), color-stop(50%,#3196c1), color-stop(100%,#067eb1));
background: -webkit-linear-gradient(left, #3051c6 0%,#3051c6 50%,#0b2687 100%);
background: -o-linear-gradient(left, #3051c6 0%,#3051c6 50%,#0b2687 100%);
background: -ms-linear-gradient(left, #3051c6 0%,#3051c6 50%,#0b2687 100%);
background: linear-gradient(to right, #3051c6 0%,#3051c6 50%,#0b2687 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3051c6', endColorstr='#067eb1',GradientType=1 );
border-radius: 100px!important;
border:1px solid #0b2687!important;
box-shadow: inset 0px 0px 5px #0b2687;
}
.testimonials-container{
width: 100%;
position: relative;
float: left;
}