html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p,
a, em, img, strong,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
text-decoration:none;
vertical-align: baseline;
background: transparent;
font-family: Helvetica, Arial, sans-serif;
}
html {
height: 100%;
width: 100%;
}
/*body {
width:100%;
height: 100%;
background-color: #f3f7f9;
text-align:left;
}
#container{
background-color: #c4d4dc;
width: 1889px;
border: #aec2cd 1px solid;
-moz-box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 3px 3px 4px #444;
box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 0 0 15px 2px #aec2cd;
-moz-box-shadow: 0 0 15px 2px #aec2cd;
box-shadow: 0 0 15px 2px #aec2cd;
}*/
body{
background-color: #f3f7f9;
width: 1889px;
border: #aec2cd 1px solid;
-moz-box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 3px 3px 4px #444;
box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 0 0 15px 2px #aec2cd;
-moz-box-shadow: 0 0 15px 2px #aec2cd;
box-shadow: 0 0 15px 2px #aec2cd;
/* margin-left: -270px;*/
}
/***** HEADER ***********/
#header{
width: 1889px;
height:245px;
background: url(../images/header_bg.png) no-repeat;
background-repeat: no-repeat;
position: relative; z-index: 99999;
}
#header h1 a {
display: block; width: 313px; height: 96px; float: left;
background: none; text-indent: -9999px;
margin-left: 430px; margin-top: 30px;
}
#header_right{
float: left;
margin-left: 420px;
margin-top: 30px;
/*background: red;*/
width: 350px;
height:300px;
}
#header_right input.quote_fr, #header_right input.quote_en{
width: 222px;
height: 37px;
margin-left: 23px;
border: 0;
text-indent: -9999px;
cursor: pointer;
float: left;
}
#header_right input.quote_fr {
background: url(../images/cybens_quote.png) no-repeat;
}
#header_right input.quote_en {
background: url(../images/cybens_quote_en.png) no-repeat;
}
#header_right input.contact{
position: relative;
width: 74px;
height: 38px;
margin-left: 172px;
margin-top: 10px;
border: 0;
text-indent: -9999px;
cursor: pointer;
clear: both;
float: left;
background: url(../images/contact_button.png) no-repeat;
background-position: 0 -38px;
}
#header_right input.contact:hover{
/*background-position: 0 0px; height: 37px; margin-bottom: 1px;*/
}
#header .contact_box{
position: relative;
display: block;
padding: 2px 2px 2px 2px;
background: url(../images/contact_border.png) repeat;
float:left;
margin-top: -6px;
visibility: hidden;
}
#header .contact_details{
position: relative;
width: 240px;
height:165px;
background: #1d72b4;
}
#header .contact_details a{
color:#d5e0ed;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
text-decoration: underline;
}
#header .contact_details h1{
color:#fefefe;
font-family: 'OpenSansRegular', sans-serif;
font-size: 11.5pt;
padding: 5px 0 0 10px;
}
#header .contact_details p{
margin: 5px 0 0 10px;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
color:#d5e0ed;
}
#header .contact_details ul{
margin: 10px 0 0 0;
}
#header .contact_details ul li{
list-style: none;
color:#d5e0ed;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
margin: 4px 0 0 5px;
}
#header .contact_details ul li img{
float: left;
}
#header .contact_details ul li span{
margin: 0 0 0 5px;
font-family: 'OpenSansRegular', sans-serif;
}
/****** NAVIGATION ***************/
#header ol#nav {
width: 607px; height: 90px; float: left; position: relative;
background: url(../images/nav_bg.png) no-repeat;
margin-top: -177px;
margin-left: 420px;
padding-top: 12px;
padding-left: 28px;
}
#header ol#nav>li+li {
padding-left: 2px;
background: url(../images/nav_border.png) no-repeat;
}
#header ol#nav li {
float: left; list-style: none;
height:58px;
}
#header ol#nav li a {
display: block; min-width: 107px; height: 38px; padding: 20px 0 0 0;
font-size: 10.5pt; color: #fff; text-decoration: none; text-align: center;
font-weight: 600;
font-family: "Arial Bold", sans-serif;
-webkit-font-smoothing: antialiased;
text-shadow: 0 3px 3px #333;
background: url(../images/nav_item_hover.png) no-repeat;
background-size: 0 0;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='../images/nav_item_hover.png',
sizingMethod='scale');
-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='../images/nav_item_hover.png',
sizingMethod='scale');
}
#header ol#nav li a:hover{
background-size: 100% 100%;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='../images/nav_item_hover.png',
sizingMethod='scale');
-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='../images/nav_item_hover.png',
sizingMethod='scale');
}
#header ol#nav li a.active {
background: url(../images/nav_item_hover.png);
}
/************** SLIDER **************************/
#slider{
display:block;
position: relative;
width: 1889px;
height:539px;
margin-bottom: 1px;
margin-top: -64px;
background: url(../images/home_slide.png) no-repeat;
z-index: 4;
}
#slider .desc{
display: block;
position:absolute;
width:520px;
height:200px;
margin:0px 0 0 439px;
margin-top: 195px;
}
#slider .desc h1{
color:#024468;
font-family: 'OpenSansRegular', sans-serif;
font-size: 24pt; /* 24pt;*/
font-weight:lighter;
margin: 10px 0 0 12px;
text-transform: uppercase;
}
#slider .desc p{
color:#525252;
font-family: 'OpenSansRegular', sans-serif;
font-size: 12pt;
font-weight:lighter;
margin: 10px 0 0 12px;
}
#details{
width: 1889px;
min-height:349px;
background: #fff url(../images/details_bg.png) no-repeat;
}
#content{
position:relative;
width: 1889px;
height: auto;
}
/************ SERVICES ***********/
#services{
width:1200px;
min-height: 132px;
padding: 10px 0 0 410px;
}
#services .software,.web,.mobile,.marketing{
}
#services ul{
width: 100%;
height: 100%;
float:left;
margin-top: 10px;
}
#services li{
width: 253px;
height: 123px;
background: url(../images/c_box.png) no-repeat;
background-position: 0 0;
float: left;
list-style: none;
margin-left: 1px; cursor: pointer;
}
#services li:hover{
background-position: -251px 0;
}
#services li h1{
color:#fff;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10.5pt;
text-transform: uppercase;
padding-top: 9px;
padding-left: 40px;
margin: 0 auto;
}
#services li .desc_cat{
width: 245px;
height: 77px;
margin-left: 3px;
margin-top: 10px;
overflow: hidden;
}
#services li .desc_cat img{
float: left;
margin-left: 5px;
margin-top: 8px;
}
#services li .desc_cat img.withpad{
margin-left: 12px; margin-right: 14px;
}
#services li .desc_cat .desc_text{
width: 120px;
float: left;
font-family: 'OpenSansRegular', sans-serif;
color: #a6bed2;
font-size: 7.5pt;
padding-top: 5px;
padding-left: 2px;
}
#presentation{
width: 1200px;
min-height: 429px;
margin: 0 0 0 355px;
overflow: hidden;
}
#presentation img{
float: left;
}
#presentation .about{
float: left;
width:300px;
}
#presentation .about a{
color: #5d8da5;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
font-weight: bold;
}
#presentation .about h1{
color:#003f62;
font-family: 'OpenSansRegular', sans-serif;
font-size: 14pt;
margin-top: 30px;
text-transform: uppercase;
}
#presentation .about h2{
color: #5d8da5;
font-family: 'OpenSansRegular', sans-serif;
font-weight: lighter;
font-size: 14pt;
}
#presentation .about p{
margin-top: 20px;
color:#4d4d4d;
font-family: 'OpenSansRegular', sans-serif;
font-size: 9pt;
}
#presentation .about span{
color:#4d4d4d;
font-family: 'OpenSansRegular', sans-serif;
font-size: 9pt;
}
#presentation img.right_img{
margin: 85px 0 0 20px;
}
/************ FOOTER *********************/
#footer{
display: block;
position: relative;
width: 1889px;
max-height: 86px;
background: #003457 url(../images/footer.png) no-repeat;
padding:15px 0 15px 0;
z-index: 99999;
}
#footer ul{
display: block;
width: 450px;
height: 20px;
margin-left: 345px;
float: left;
}
#footer ul li{
display: block;
list-style: none;
float: left;
height: 18px;
margin: 0 5px 0 5px;
}
#footer ul li a{
display: block; height: 18px; padding: 0 0 0 12px;
font-family: 'OpenSansRegular', sans-serif;
font-weight: lighter;
color: #fff;
font-size: 9pt;
text-decoration: none;
}
#footer ul>li+li {
padding-left: 2px;
background: url(../images/footer_nav_border.png) no-repeat;
}
#footer .follow{
float: left;
margin-left: 380px;
}
#footer .follow span{
float: left;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
color: #fff;
margin: 5px 7px 0 0;
}
#footer .follow a{
display: block;
float: left;
text-indent: -9999px;
}
#footer .follow a.facebook{
width: 28px;
height: 28px;
background: url(../images/facebook_icon.png) no-repeat;
}
#footer .follow a.linkedin{
width: 28px;
height: 28px;
background: url(../images/linkedin_icon.png) no-repeat;
}
#footer .follow a.googleplus{
width: 28px;
height: 28px;
background: url(../images/googleplus_icon.png) no-repeat;
}
#footer .copyright{
display: block;
margin-left: 362px;
font-family: 'OpenSansRegular', sans-serif;
font-size: 8.5pt;
color:#65a0c6;
}
/******* SERVICES PAGE ********************************************/
#back_page_wrapper{
display:block;
position: absolute;
width: 1889px;
height:222px;
margin-bottom: 1px;
margin-top: -64px;
background:url(../images/back_page_h_bg.png) ;
z-index: 4;
}
#page_wrapper{
position: relative;
display: block;
width:1070px;
height:1500px;
background: #fff;
z-index: 9999;
margin:0 auto;
border: #aec2cd 1px solid;
-moz-box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 3px 3px 4px #444;
box-shadow: 3px 3px 4px #444;
/*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";*/
-webkit-box-shadow: 0 0 15px 2px #aec2cd;
-moz-box-shadow: 0 0 15px 2px #aec2cd;
box-shadow: 0 0 15px 2px #aec2cd;
}
#page_wrapper h1{
color:#0d486e;
font-family: 'OpenSansRegular', sans-serif;
text-transform: uppercase;
font-size: 14pt;
font-weight: bold;
padding: 0 0 0 0;
margin: 35px 0 10px 40px;
}
#page_wrapper .intro{
width: 1030px;
height: 330px;
max-height:330px;
overflow: hidden;
margin: 0 auto;
background:url('../images/intro_bg.png');
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-khtml-border-radius: 20px;
border-radius: 20px;
behavior: url(../css/border-radius.htc);
border-radius: 20px;
}
#page_wrapper .intro span{
display: block;
position: relative;
padding: 45px 15px 5px 45px;
height: 65px;
font-family: 'OpenSansRegular', sans-serif;
font-weight: lighter;
font-size: 14pt;
color: #525252;
z-index: 2;
}
#page_wrapper .intro .left{
float: left;
width: 600px;
max-width: 605px;
height: 210px;
max-height: 210px;
padding: 0 0 0 40px;
overflow: hidden;
margin-right: 5px;
}
#page_wrapper .left ol{
}
#page_wrapper .left ol li{
list-style: none;
line-height: 35px;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10.5pt;
color:#525252;
}
#page_wrapper .intro img{
position: relative;
float:left;
margin-top: -74px;
z-index: 1;
}
#page_wrapper .services_panel{
margin: 40px 0 0 0;
}
#page_wrapper .services_panel ul{
list-style: none;
margin-left: 5px;
}
#page_wrapper .services_panel ul li{
display: inline-block; border: #d5e0ed 1px solid;
width: 495px; /*background: cyan;*/
padding-left: 30px;
}
#page_wrapper .services_panel ul li h1{
color:#0d486e;
font-family: 'OpenSansRegular', sans-serif;
text-transform: uppercase;
font-size: 12pt;
font-weight: bold;
margin: 5px 5px 8px 5px;
padding: 0 0 0 0; /*background: #65a0c6;*/
}
#page_wrapper .services_panel ul li img{
display: block;
float: left;
width:170px;
height:160px; /*background: #00FF00;*/
}
/*#page_wrapper .services_panel ul li span{*/
.service_box{
display: block;
float: left;
/*background: #DEB101;*/
width: 315px; height: 195px;
padding: 5px 0 0 5px;
font-family: 'OpenSansLight', sans-serif;
font-size: 9pt;
line-height: 18px;
color: #565656;
}
/*#page_wrapper .services_panel ul li span p{*/
.service_box p{
display: block;
}
.service_box .sameas{
visibility: hidden;
}
#bref{
width:550px;
height:350px;
float: left;
margin: 0 auto;
}
#bref ul{
list-style:disc;
padding-left: 60px; color:#565656;
}
#bref ul li{
font-family: 'OpenSansRegular', sans-serif;
font-size: 10.5pt;
border:0;
padding-left: 0px; line-height:23px;
}
#bref ul li span{
font-family: 'OpenSansRegular', sans-serif;
font-size: 10.5pt;
}
#technologies{
float: left; margin-top: -35px;
}
/********* ABOUT PAGE **********************/
#page_wrapper.about{
background: #fff url('../images/header_bg_about.png') repeat-x;
}
#page_wrapper.about h1{
color:#0d486e;
font-family: 'OpenSansRegular', sans-serif;
text-transform: uppercase;
font-size: 16pt;
font-weight: bold;
}
#page_wrapper.about .presentation{
width: 1030px;
height: 330px;
/*background: red;*/
margin: 0 auto;
float: none;
}
#page_wrapper.about .presentation img{
float: left;
}
#page_wrapper.about .presentation .aboutus h1{
font-family: 'OpenSansRegular', sans-serif;
font-weight: bold;
font-size: 16pt;
color: #0d486e;
padding: 0 0 0 0;
margin: 15px 0 5px 0;
}
#page_wrapper.about .presentation .aboutus{
display: block;
float: left;
width: 600px;
color:#565656;
font-size: 10pt;
}
#page_wrapper.about .presentation .aboutus p{
display: block;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10pt;
line-height: 18px;
margin-top: 10px;
line-height: 20px;
}
#page_wrapper .whychooseus_panel{
margin: 40px 0 0 0;
width: 990px; /*770px;*/
float: left;
}
#page_wrapper .whychooseus_panel ul{
list-style: none;
margin-left: 5px;
}
#page_wrapper .whychooseus_panel ul li{
display: block;
width: 980px; /*695px;*/
padding-left: 30px;
}
#page_wrapper .whychooseus_panel ul li h1{
color:#0d486e;
font-family: 'OpenSansRegular', sans-serif;
text-transform: uppercase;
font-size: 12pt;
font-weight: bold;
margin: 5px 5px 8px 5px;
padding: 0 0 0 0;
}
#page_wrapper .whychooseus_panel ul li img{
display: block;
float: left;
width:120px;
height:120px; /*background: #00FF00;*/
}
#page_wrapper .whychooseus_panel ul li .asubspan{
display: block;
float: left;
width: 850px; /*515px;*/ height: 180px;
padding: 5px 0 0 5px;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10pt;
line-height: 18px;
color: #565656;
}
#page_wrapper .whychooseus_panel ul li .asubspan p{
display: block;
}
#page_wrapper .recentproj{
display: block;
float: left;
width: 200px;
}
/********* CONTACT PAGE **********************/
#page_wrapper.contact{
background: #fff url('../images/header_bg_about.png') repeat-x;
height:752px;
}
#contact_hand{
width:260px;
height:214px;
position: absolute;
/* margin: -100px 0 0 810px;*/ margin: -100px 0 0 810px;
background: url('../images/contact_hand.png') no-repeat;
}
#contact_form_container{
width:500px;
margin:-50px 0 0 30px;
background: none;
border-right: #aec2cd 0px solid;
float: left;
}
#contact_form_container h1{
font-family: 'OpenSansRegular', sans-serif;
font-weight: bold;
font-size: 16pt;
color: #0d486e;
padding: 0 0 0 0;
margin: 0px 0 10px 0px;
}
#contact_details{
float:left;
position: relative;
background: none;
width: 350px; background: white;
margin:39px 0 0 -9px;
z-index: -8;
border: #aec2cd 1px solid;
-moz-box-shadow: 3px 3px 4px #444;
-webkit-box-shadow: 3px 3px 4px #444;
box-shadow: 3px 3px 4px #444;
/*-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#444444')";*/
-webkit-box-shadow: 0 0 15px 2px #aec2cd;
-moz-box-shadow: 0 0 15px 2px #aec2cd;
box-shadow: 0 0 15px 2px #aec2cd;
}
#contact_details a{
color:#555;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10pt;
}
#contact_details ul{
margin: 10px 0 0 0;
}
#contact_details ul li{
list-style: none;
display: block;
color:#555;
font-family: 'OpenSansRegular', sans-serif;
font-size: 9pt;
margin: 4px 0 0 5px;
height: 33px; background: none;
}
#contact_details ul li img{
float:left;
margin-right: 10px; width: 27px; height: 27px;
}
#contact_details ul li span{
margin: 0px 0 0 5px;
padding-top: 2px;
display: block;
font-family: 'OpenSansRegular', sans-serif;
font-size: 10pt;
}
#contact_details ul li span .subspan{
margin: 0px 0 0 0px;
padding-top: 0px; font-family: 'OpenSansRegular', sans-serif; display: inline;
}
#contact_details .logoimg{
visibility: hidden; position: absolute;
}
#contact_details h1{
font-family: 'OpenSansRegular', sans-serif;
font-weight: bold;
font-size: 12pt;
color: #0d486e;
padding: 0 0 0 0;
margin: 5px 0 10px 7px;
}
#newsletter_box{
width: 515px; height: 180px; position: relative;float: left;margin:50px 0 0 -5px;
}
#newsletter_box h1{
font-family: 'OpenSansRegular', sans-serif;
font-weight: bold;
font-size: 10pt;
color: #000;
padding: 0 0 0 0;
margin: -15px 0 10px 0px;
}
#newsletter_box ul{
margin: 0 0 0 15px;
list-style: circle;
font-family: 'OpenSansRegular', sans-serif;
font-size: 9pt;
line-height: 20px;
}
.cybaddress{
display: none;
}
#noscript_recaptcha_iframe{
height:300px; width:500px; border:0px;
}