@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,500italic,500,400italic,700,700italic,900,900italic);

body {font-family: Roboto, sans-serif;font-size: 14px; }

.main_widebanner { padding-top:0;}
.main_header {background:none; }
.main_header > .inner {min-height:60px;}
.main_header > .inner .logo img { }

.main_articles article .articlecnt .cnt {font-size: 14px;}

.whatwedo { padding:16px; }
.whatwedo > h2 {
font-family: Roboto, sans-serif;
font-size: 28px;
}
.whatwedo > ul { padding:0; margin:0; margin-left:24px; padding-top:12px; padding-bottom:0px;  }
.whatwedo > ul > li { font-size:18px; padding-top:3px; padding-bottom:3px; }
.whatwedo > ul > li a { text-decoration:none; }

.sidebanner { }
.sidebanner > .sbanner { margin-top:20px;  padding:20px; color:#ffffff; padding-bottom:60px; }
.sidebanner > .sbanner h2 { font-family: Roboto, sans-serif; font-size:24px; color:#ffffff; min-height:60px;  font-weight:300; line-height:100%; padding-left:82px;  }
.sidebanner > .sbanner a { display:block; font-size:0px; text-decoration:none; float:right;}

.sidebanner > .sbanner a:before { display:block; font-size:27px; color:#ffffff; text-decoration:none; margin-top:4px; border:solid 2px #ffffff; padding-top:5px; width:40px; height:40px; text-align: center; box-sizing: border-box; border-radius: 30px; }
.sidebanner > .sbanner a:hover:before {border:solid 2px #444444; color:#444444; }
.sidebanner > .sbanner:first-of-type { margin-top:0; }
.sidebanner > .sb1 { background:url(/WebFTP/client/100155/WebDev/side-bg1.jpg) no-repeat; }
.sidebanner > .sb2 { background:url(/WebFTP/client/100155/WebDev/side-bg2.jpg) no-repeat; }
.sidebanner > .sb3 { background:url(/WebFTP/client/100155/WebDev/side-bg3.jpg) no-repeat; }
.sidebanner > .sb4 { background:url(/WebFTP/client/100155/WebDev/side-bg4.jpg) no-repeat; }


.banner { position:relative; }
.banner .txts { position:absolute; top:0; left:0; z-index:999; margin-top:80px; margin-left:40px; max-width:450px; box-sizing: border-box; }

.banner .txts .txt1 {
background: rgba(0,0,0,0.7); padding: 12px 18px 12px 18px; line-height:120%;
font-size: 30px;
font-weight: 300;
font-style: normal;
text-transform: uppercase;
color: #fff;
}
.banner .txts .txt2 {
background: rgba(0,0,0,0.5); padding: 10px 18px 10px 18px; line-height:110%;
font-size: 24px;
font-weight: 300;
font-style: normal;
text-transform: uppercase;
color: #fff;
}
.banner .txts a {
background: #f65314;
float: right;
padding: 10px 18px 10px 18px;
vertical-align: top;
line-height: 21px;
font-size: 21px;
font-weight: 300;
text-transform: uppercase;
text-decoration: none;
color: #fff;
}
.banner .txts a:hover { background:#00a1f1 }




@media screen and (max-width: 880px) {
.banner .txts { margin-top:50px; margin-left:30px; }

.banner .txts .txt1 {
padding: 12px 18px 12px 18px; font-size: 28px; font-weight: 300;
}
.banner .txts .txt2 {
padding: 10px 18px 10px 18px; font-size: 22px; font-weight: 300;
}
.banner .txts a {
background: #f65314; padding: 10px 18px 10px 18px; font-size: 20px;
}
}

@media screen and (max-width: 710px) {
.banner .txts { margin-top:30px; margin-left:20px; }

.banner .txts .txt1 {
padding: 6px 10px 6px 10px; font-size: 24px; font-weight: 300;
}
.banner .txts .txt2 {
padding: 4px 10px 4px 10px; font-size: 20px; font-weight: 300;
}
.banner .txts a {
background: #f65314; padding: 4px 10px 4px 10px; font-size: 18px;
}
}

@media screen and (max-width: 500px) {
.banner .txts { margin-top:20px; margin-left:20px; max-width:360px;  }

.banner .txts .txt1 {
padding: 6px 10px 6px 10px; font-size: 20px; font-weight: 300;
}
.banner .txts .txt2 {
padding: 4px 10px 4px 10px; font-size: 18px; font-weight: 300;
}
.banner .txts a {
background: #f65314; padding: 4px 10px 4px 10px; font-size: 17px;
}
}

@media screen and (max-width: 380px) {
.banner .txts { margin-top:20px; margin-left:20px; max-width:360px;  }

.banner .txts .txt1 {
display:none;
}
.banner .txts .txt2 {
display:none;
}
.banner .txts a {
background: #f65314; padding: 4px 10px 4px 10px; font-size: 17px;
float:left;
}
}