*
{
padding: 0px;
margin: 0px;
}
html {
display: block;
margin: 0px auto;
max-width: 2000px;
}
a.learnmore:link
{
color: rgba(0, 159, 205, 1);
text-decoration: none;
}
a.learnmore:visited
{
color: rgba(0, 159, 205, 1);
text-decoration: none;
}
a.learnmore:hover
{
color: #FF7059;
text-decoration: none;
}
/*HOME PAGE 100% SLIDER*/
.oneHundredPercentHome { /*SETS UP BACKGROUND at 100%*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 593px;
display: block;
background-color: #FFFFFF;
clear:both;
overflow: hidden;
position: relative;
background-position: cover;
}
.transHeading { /*Main Gradient*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
height: 100%;
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
background: linear-gradient(to top right, rgba(0,234,123,.7), rgba(0,159,205,.7));
z-index: 0;
}
/*--HEADING ANIMATION--*/
@keyframes slipperyToo { /*MAKES TEXT FLOAT UP*/
0% {left:0px; top:30px;}
100% {left:0px; top:0px;}
}
@-webkit-keyframes slipperyToo { /*MAKES TEXT FLOAT UP*/
0% {left:0px; top:10px;}
100% {left:0px; top:0px;}
}
.transHeading .block960 {
position: relative;
animation-name: slipperyToo;
-webkit-animation-name: slipperyToo;
animation-duration: 1s;
}
.transHeading2 {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
height: 100%;
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
background: rgba(0, 159, 205, 1); /*#009fcd;*/
}
.transHeading3 {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
height: 100%;
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
background-color: rgba(0, 159, 205, .8);
/*background: url(images/city.jpg);*/
}
.landingPage {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
height: 100%;
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
background: rgba(0, 159, 205, .85)
/*OLD COLOUR rgba(72, 166, 210, .7);*/
}
h1.whiteHeading {
position: relative;
top: 0px;
text-align: left;
font-family: "Montserrat", sans-serif;
font-size: 78px;
font-weight: 600;
line-height: 82px;
z-index: 1;
color: #FFFFFF;
margin: 230px 2% 10px 12%;/*same style as .heroHeading*/
max-width: 1170px;
left: 0;/*centres absolute div*/
right: 0;/*centres absolute div*/
text-shadow: 0px 0px 30px rgba(10,18,32,.3);
box-sizing: border-box;
}
h1.whiteHeading2 {
position: relative;
margin: 0px auto 0px auto;
top: 130px;
padding: 0px 0px 0px 0px;
font-size: 117px;
width: 960px;
display: block;
max-width: 960px;
color:#FFF;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
line-height: 107px;
text-align: center;
/*text-shadow: 1px 1px 180px #474747;*/
z-index: 1;
text-transform: uppercase;
font-kerning: normal;
}
.feature {
position: relative;
z-index: 1;
color: #FFFFFF;
width: 100%;
text-align: left;
margin: 0px 2% 20px 12%;
padding: 0px 0px;
box-sizing: border-box;
max-width: 660px;
top: 0px;
font-size: 22px;
font-family: "Montserrat","Open sans", sans-serif;
text-shadow: 0px 0px 15px rgba(51,35,35,.3);
font-weight: 400;
line-height: 1.5;
display: block;
float: left;
}
#featureImg {
width: 380px;
float: right;
height: 489px;
position: relative;
top: 60px;
background-image: url(../banking_software/images/solutions.png);
background-size: 100%;
}
.oneHundredPercent { /*FIXED HEIGHT & SETS UP BACKGROUND at 100% !NO PADDING!*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 593px;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
overflow: hidden;
position: relative;
}
.full {
margin: 0px 0px 0px 0px;
height: auto;
min-height: 100%;
width: 100%;
min-width: 960px;
overflow: hidden;
}
.block960Container {
margin: 0px auto;
padding: 0px 0px 0px 0px;
width: 960px;
height: auto;
clear: both;
display: block;
overflow: auto;
}
.block960Containerborder {
margin: 0px auto;
padding: 0px 0px 0px 0px;
width: 960px;
height: auto;
clear: both;
display: block;
overflow:auto;
border-right: solid 1px #F0F0F0;
border-left: solid 1px #F0F0F0;
}
.block960{ /*THIS ONE HAS A FIXED HEIGHT. IMPORTANT. DON'T CHANGE. INTENDED FOR TOP OF EVERY PRODUCT PAGE*/
margin: 0px auto;
padding: 0px 0px 0px 0px;
width: 960px;
height: 593px;
clear: both;
display: block;
}
.block940Header { /*ONLY USE THIS IN THE INTRO SECTION*/
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 940px;
height: auto;
display: block;
}
.block940Header h1.normal {
padding: 0px 0px 20px 0px;
}
.block940 {
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 940px;
height: auto;
display: block;
}
.block940 h1.normal {
padding: 0px 0px 20px 0px;
}
.block940 img {
padding: 0px 0px 50px 0px;
display: block;
float: left;
}
.block960White {/*USE THIS BLOCK ON A BLUE 100% BACKGROUND*/
margin: 100px auto 100px auto;
padding: 100px 0px 100px 0px;
width: 940px;
height: auto;
display: block;
background-color: #FFFFFF;
box-shadow: 0px 1px 30px 0px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 1px 30px 0px rgba(0,0,0,0.2);
}
.block960White h2.wsj {/*SETS 620PX TEXT IN 960 DIV*/
margin: 0px 160px 0px 160px;
}
.block960White p.normal {
margin: 0px 160px 0px 160px;
}
.block960White img {
margin: 0px auto 0px auto;
padding: 0px 160px 40px 160px;
display: block;
}
.block700 {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 700px;
height: auto;
display: block;
float: left;
}
.block700 img {
margin: 0px auto 0px auto;
display: block;
}
/*NEWS BLOCKS*/
.block700News {
margin: 0px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 700px;
height: auto;
display: block;
overflow: hidden;
}
.block700News h1.normal {
margin: 100px 0px 30px 80px;
display: block;
float: left;
clear: both;
color:#009fcd;
}
.block700News h2.wsj {
margin: 60px 10px 10px 80px;
padding: 0px 0px 10px 0px;
height: auto;
clear:both;
display: block;
}
.block700News h2.wsj:first-child {
margin: 20px 10px 10px 80px;
height: auto;
clear:both;
float:left;
}
.block700News h2.wsj a.wsj {
color: #10284d;
}
.block700News p.normal {
margin: 10px 10px 10px 80px;
}
.block620News {
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 620px;
height: auto;
display: block;
clear:both;
overflow: auto;
}
.block620News h1.normal {
margin: 80px 10px 0px 10px;
padding: 0px 0px 0px 0px;
height: auto;
clear:both;
display: block;
text-align: center;
}
.block620News h2.wsj {
margin: 50px 10px 10px 10px;
padding: 0px 0px 10px 0px;
height: auto;
clear:both;
display: block;
}
.block620News h2.wsj:first-child {
margin: 100px 10px 10px 10px;
height: auto;
clear:both;
float:left;
}
.block620News h2.wsj a.wsj {
color: #10284d;
}
.block620News p.normal {
margin: 10px 10px 10px 10px;
}
/*END OF NEWS BLOCKS*/
.block620 { /*CENTERED DIV*/
margin: 10px 170px 10px 170px;
padding: 0px 0px 0px 0px;
width: 620px;
height: auto;
display: block;
float: left;
box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.block620 img {
margin: 10px auto 10px auto;
display: block;
}
.block620 h1.normal {
padding-bottom: 30px;
}
.block620Read { /*CENTERED DIV*/
margin: 10px 170px 50px 170px;
padding: 0px 0px 0px 0px;
width: 620px;
height: auto;
display: block;
float: left;
}
.block620Read img {
margin: 10px auto 10px auto;
display: block;
}
.block620Read h1.normal {
padding-bottom: 50px;
}
.block620Top { /*CENTERED DIV*/
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 100%;
height: auto;
display: block;
}
.block620Top img {
margin: 10px auto 10px auto;
display: block;
}
/*PRODUCT, SOLUTION, AND SUPPORT DIVS*/
.topSolutionSection {
margin: 0px auto;
padding: 0px 0px 50px 0px;
display: block;
width: 960px;
height: auto;
float: left;
clear: both;
border-bottom: 4px solid #F5F5F5;
}
.topSolution {/*CENTERED DIV*/
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
width: 620px;
height: auto;
display: block;
}
.topSolution img {
margin: 0px auto 10px auto;
display: block;
}
.topSolution h1.normal {
padding: 0px 10px 20px 10px;
}
/*SUPPORT PAGES*/
.section960Grey { /*USED AS FIRST GREY INTRO BLOCK ON PRODUCT PAGES !HAS A 100% WIDTH*/
margin: 0px auto;
padding: 20px 0px 30px 0px;
padding: 40px 0px 50px 0px;
display: block;
width: 100%;
min-width: 960px;
height: auto;
clear: both;
background-color: #FAFAFA;
border: 1px solid #F0F0F0;
overflow: auto;
/*position: relative;
top: -20px;*/
}
.sectionSupport {/*!TOP TWO BARS OF SERVICES PAGES WITH TITLE AND ADDITIONAL INFO*/
margin: 0px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 100%;
min-width: 960px;
height: auto;
float: left;
clear: both;
background-color: #F6F6F6;
background-color: rgba(0, 159, 205, 1);
background-color: ;
box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
-moz-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
}
.sectionSupport p.normal {
padding: 20px 20px 20px 20px;
text-align: center;
color: #FFFFFF;
font-size: 13px;;
font-weight: 300;
}
.sectionSupport ul.navigationList a.goblue {
color: #FFFFFF;
}
.sectionSupport ul.navigationList {
margin-top: 30px;
}
.sectionSupport ul.navigationList li {
color: #FFFFFF;
font-size: 13px;
font-weight: 300;
}
.sectionSupport a.goblue {
color: #FFFFFF;
}
.supportIntro { /*INTRODUCTION SECTION OF SUPPORT PAGES*/
margin: 20px auto 20px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 960px;
clear: both;
height: auto;
}
.oneHundredPercentSupport { /*SETS UP BACKGROUND at 100% WITH A FIXED 365PX HEIGHT FOR TOP OF SUPPORT PAGES*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 365px;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
overflow: hidden;
position: relative;
}
.transHeadingSupport { /*TRANSPARENT OVERLAY FOR SUPPORT PAGES*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
height: 100%;
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
background: linear-gradient(to bottom left, rgba(0,234,123,.7), rgba(0,159,205,.7), rgba(128,238,236,.8));
z-index: 0;
}
h1.mainTitle {
font-family: 'Montserrat', Helvetica Neue, Arial, sans-serif;
font-weight: 600;
font-size: 64px;
text-align: center;
color: #FFFFFF;
padding-bottom; 30px;
}
p.subHeading {
font-family: 'Montserrat', Helvetica Neue, Arial, sans-serif;
font-weight: 400;
font-size: 18px;
text-align: center;
color: #FFFFFF;
position: relative;
top: 150px;
}
.pushMainTitleDown {
position: relative;
top: 130px;
}
.blockSupportLeft { /*LEFT TITLE BAR ON SUPPORT PAGES*/
margin: 0px auto;
padding: 0px 0px 0px 0px;
width: 60%;
max-width: 1080px;
height: 110px;
clear: both;
display: block;
float: left;
border-right: 2px solid #FFFFFF;
}
.blockSupportRight {
margin: 0px auto;
padding: 0px 0px 0px 0px;
min-width: 380px;
width: 39%;
max-width: 700px;
height: 110px;
display: block;
float: left;
}
.blockSupportRight p.normal{
margin: 0px auto;
padding: 28px 10px 0px 10px;
max-width: 380px;
color: #FFFFFF;
}
.blockSupportRight p.normal a.goblue {
color: #FFF;
}
.blockSupportLeft h1.normal {
margin: 0px auto;
padding: 30px 10px 0px 10px;
max-width: 620px;
text-align: center;
color: #FFF;
font-size: 34px;
font-weight: 300;
letter-spacing: 1px;
}
.oneHundredPercentSuccess { /*SETS UP BACKGROUND at 100% WITH A FIXED HEIGHT*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 365px;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
overflow: hidden;
position: relative;
}
.block540 {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 540px;
display: block;
float: left;
/*background-color: #FBFBFB;*/
}
.block540 img {
margin: 0px auto 0px auto;
display: block;
max-width: 500px;
/*max-height: 367px;*/
}
.block540Test {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 540px;
height: auto;
display: block;
float: left;
background-color: #FBFBFB;
height: 367px;
}
.block540Test img {
margin: 0px auto 0px auto;
display: block;
}
/*-----------------------------------*/
.fullWidthContainer { /*SETS UP BACKGROUND at 100% FOR .halfWidth DIVs ONLY*/
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 100%;
display: block;
background-color: #fff;
clear: both;
float: left;
position: relative;
max-width: 2000px;
}
.halfWidthBlackL {
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #001921;
/*background-color: #3A3A3A;*/
float: left;
background-image: url(../banking_software/images/geo-man.png);
background-size: 70%;
background-repeat: no-repeat;
background-position: -40px -50px;
}
.halfWidthBlackL h2.wsj {
color: #FFFFFF;
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
}
.halfWidthBlackL h2.wsj a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthBlackL h2.architecture {
color: #FFFFFF;
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
padding: 0px 0px 10px 0px;
}
.halfWidthBlackL p.normal {
color: #FFFFFF;
margin: 0px 80px 15px 10px;
width: 380px;
float: right;
font-weight: 300;
display:block;
}
.halfWidthBlackL p.normal a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
/*HALFWIDTHBLACK WITH RIGHT SIDE TEXT*/
.halfWidthBlackR {
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #001921;
/*background-color: #3A3A3A;*/
float: left;
overflow: hidden;
}
.halfWidthBlackR h2.wsj {
color: #FFFFFF;
width: 380px;
margin: 160px 10px 15px 80px;
float: left;
}
.halfWidthBlackR h2.wsj a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthBlackR p.normal {
color: #FFFFFF;
margin: 0px 10px 15px 80px;
width: 380px;
float: left;
}
.halfWidthBlackR p.normal a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthBlackR img {
width: 100%;
height: auto;
min-width: 480px;
margin: 0px auto 0px auto;
}
/*HALFWIDTHGREY IMAGE*/
.halfWidthGreyR {/*SHOULD ALWAYS BE A FULL BLEED IMAGE*/
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #F6F6F6;
float: left;
overflow: hidden;
}
.halfWidthGreyR img {
width: 100%;
height: auto;
max-height: 593px;
min-width: 480px;
max-width: 600px;
margin: 0px auto 0px auto;
}
.halfWidthGreyR h2.architecture {
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
padding: 0px 10px 10px 0px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
text-transform: uppercase;
letter-spacing: 8px;
font-weight: 300;
font-size: 22px;
}
.halfWidthGreyR h2.wsj {
color: #10284d;
width: 380px;
margin: 160px auto 15px auto;
}
.halfWidthGreyR h2.wsj a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthGreyR p.normal {
color: #10284d;
margin: 0px auto 10px auto;
width: 380px;
}
.halfWidthGreyR p.normal a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
@media screen and (min-width: 960px) {
img.diagram {
min-width: 380px;
max-width: 440px;
margin: -10px 0px 0px 0px;
padding: 0px 20px 0px 20px;
display: block;
position: relative;
float: left;
top: 200px;
width: 100%;
}
}
.attribution { /*ATTRIBUTE FOR PHOTOS*/
position: absolute;
bottom: -12px;
display: block;
clear: both;
color: rgba(220, 220, 220, 1);
font-style: normal;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
}
.attribution a {
color: rgba(220, 220, 220, 1);
}
.halfWidthGreyL {/*SHOULD ALWAYS BE A FULL BLEED IMAGE*/
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #F6F6F6;
float: left;
overflow: hidden;
}
.halfWidthGreyL h2.architecture {
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
padding: 0px 10px 10px 0px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
text-transform: uppercase;
letter-spacing: 8px;
font-weight: 300;
font-size: 22px;
}
.halfWidthGreyL h2.wsj {
color: #10284d;
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
}
.halfWidthGreyL h2.wsj a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthGreyL p.normal {
color: #10284d;
margin: 0px 80px 15px 10px;
width: 380px;
float: right;
}
.halfWidthGreyL p.normal a.goblue {
color: #FFFFFF;
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
/*HALF WIDTH WHITE STYLING*/
.halfWidthWhiteL {
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #FFFFFF;
/*background-color: #3A3A3A;*/
float: left;
}
.halfWidthWhiteL h2.wsj {
width: 380px;
margin: 160px 80px 15px 10px;
float: right;
}
.halfWidthWhiteL h2.wsj a.goblue {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthWhiteL p.normal {
margin: 0px 80px 15px 10px;
width: 380px;
float: right;
}
.halfWidthWhiteL p.normal a.goblue {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthWhiteR {
min-width: 480px;
width: 50%;
height: 593px;
display: block;
background-color: #FFFFFF;
float: left;
}
.halfWidthWhiteR img {
max-height: 593px;
min-width: 480px;
margin: 0px auto 0px auto;
display: block;
}
.halfWidthWhiteR h2.wsj {
width: 380px;
margin: 160px 10px 15px 80px;
float: left;
}
.halfWidthWhiteR h2.wsj a.goblue {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
.halfWidthWhiteR p.normal {
margin: 0px 10px 15px 80px;
width: 380px;
float: left;
}
.halfWidthWhiteR p.normal a.goblue {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
}
/*-----------------------------------*/
#pickYourSoftware {
margin: 60px 478px 20px 10px;
padding: 10px 0px 0px 0px;
width: 468px;
height: 100%;
display: block;
float: left;
/*border-right: 4px solid #F5F5F5;*/
}
/*BLOCK460 REQUIRED MORE WHITE SPACE AROUND TEXT*/
.block460L { /* 2 COLUMN BLOCKS*/
margin: 10px 10px 10px 10px;
padding: 20px 0px 20px 0px;
width: 460px;
height: 100%;
display: block;
float: left;
/*border-right: 2px solid #F5F5F5;*/
/*background-color: #F8F8F8;
border-radius: 5px;*/
clear: both;
}
.block460L img {
margin: 0px auto 0px auto;
display: block;
}
.block460L h2.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 35px 15px 0px;
}
.block460L h3.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 35px 15px 0px;
}
.block460L p.normal {/*REQUIRED EXTRA PADDING*/
padding: 0px 35px 15px 0px;
}
.block460L p.footnote {/*REQUIRED EXTRA PADDING*/
padding: 0px 35px 15px 0px;
}
.block460L ul.banking {/*REQUIRED EXTRA PADDING*/
padding: 0px 20px 20px 60px;
}
.block460L p.h3normal {
padding-right: 35px;
padding-left: 10px;
}
.block460L h3.smallCaps {
padding-right: 35px;
padding-left: 10px;
}
.block460R { /* 2 COLUMN BLOCKS*/
margin: 10px 10px 10px 10px;
padding: 20px 0px 0px 0px;
width: 460px;
height: auto;
display: block;
float: left;
/*border-left: 2px solid #F5F5F5;*/
height: 100%;
}
.block460R img {
margin: 0px auto 0px auto;
display: block;
}
.block460R h2.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 0px 15px 35px;
}
.block460R h3.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 0px 15px 35px;
}
.block460R p.normal {/*REQUIRED EXTRA PADDING*/
padding: 0px 0px 15px 35px;
}
.block460R ul.banking {/*REQUIRED EXTRA PADDING*/
margin: 0px 0px 0px 40px;
padding: 0px 0px 20px 60px;
}
.block460R h3.smallCaps {
padding-left: 35px;
padding-right: 10px;
}
.block460R p.h3normal {
padding-left: 35px;
padding-right: 10px;
}
.interchangeCard {
width: 380px;
height: auto;
display: block;
float: right;
margin: 10px 10px 10px 10px;
padding: 50px 0px 40px 0px;
background-color: #FFFFFF;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
z-index: 1;
position: relative;
boder-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-top: 5px solid rgba(190, 172, 229, 1);
transition: all 100ms linear;
}
.interchangeCard:hover {
box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, .23);
-webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, .23);
-moz-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, .23);
z-index: 3;
}
.pinkBackground .interchangeCard h2.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 0px 5px 30px;
color: #10284d !IMPORTANT;
}
.interchangeCard h3.wsj { /*REQUIRED EXTRA PADDING*/
padding: 0px 0px 15px 30px;
}
.interchangeCard p.normal {/*REQUIRED EXTRA PADDING*/
padding: 0px 10px 15px 30px;
}
p.facilitator {
margin: 0px;
padding: 0px 10px 15px 0px;
font-size: 14px;
line-height: 1.5em;
color: rgba(0, 159, 205, 1);
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: left;
max-width: 620px;
}
.interchangeCard p.facilitator {/*REQUIRED EXTRA PADDING*/
padding: 0px 30px 15px 30px;
}
.interchangeCard ul.banking {/*REQUIRED EXTRA PADDING*/
margin: 0px 0px 0px 35px;
padding: 0px 0px 20px 60px;
}
.interchangeCard h3.smallCaps {
padding-left: 30px;
padding-right: 10px;
}
.interchangeCard p.h3normal {
padding-left: 30px;
padding-right: 10px;
}
.block380 {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 380px;
height: auto;
display: block;
float: left;
}
.block380 img {
margin: 10px auto 0px auto;
display: block;
}
.block300 {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 300px;
height: auto;
display: block;
float: left;
}
.block300 p.h3normal {
padding: 10px 20px 10px 20px;
}
.block300 h3.smallCaps {
padding: 10px 20px 10px 20px;
}
.block300Home {
margin: 20px 10px 20px 10px;
padding: 0px 0px 0px 0px;
width: 300px;
height: auto;
display: block;
float: left;
background-color: #F6F6F6;
height:300px;
}
.block300 img {
margin: 65px auto 0px auto;
display: block;
}
.block300 img.interchangeSpeaker {
background: #efefef;
padding: 0px 0px 0px 0px;
margin: 0px 0px 20px 0px;
height: 300px;
width: 300px;
}
.block220 {
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
width: 220px;
height: auto;
display: block;
float: left;
}
.block220 img.interchangeSpeaker {
background: #efefef;
padding: 0px 0px 0px 0px;
margin: 0px 0px 20px 0px;
height: 180px;
width: 220px;
}
/*PRODUCT OPTION BLOCKS*/
/*-----DETAILS BLOCKS-----*/
.detailsTitle {
margin: 20px 10px 0px 0px;
padding: 0px 0px 0px 0px;
width: 940px;
display: block;
float: left;
height: auto;
}
.detailsHeadFirst { /* ONLY USE AS TOP ROW OF DETAILS SHEET */
margin: 0px 20px 0px 0px;
padding: 0px 0px 0px 0px;
width: 220px;
display: block;
float: left;
height: auto;
border-top: 1px solid #F2F2F2;
clear: both;
}
.detailsHead {
margin: 50px 20px 0px 0px;
padding: 0px 0px 0px 0px;
width: 220px;
display: block;
float: left;
height: auto;
border-top: 1px solid #F2F2F2;
clear:both;
}
.detailsFourFirst {/*ONLY USE AS TOP ROW OF DETAILS SHEET*/
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 179px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
.detailsFour {
margin: 50px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 178px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
.detailsFour ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsTwoFirst {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 359px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
.detailsTwo {
margin: 50px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 359px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
.detailsTwo ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsOneFirst {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 719px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
.detailsOneFirst p.specs {
width: 479px;
}
.detailsOneFirst ul {
width: 479px;
}
.detailsOne p.specs {
width: 479px;
}
.detailsOne ul {
width: 479px;
}
.detailsOne ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsOneFirst ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsTwoFirst ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsThreeFirst ul.specsList:first-child {
padding: 18px 20px 5px 40px;
}
.detailsOne {
margin: 50px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 719px;
display: block;
float: left;
height: auto;
border-left: 1px solid #F2F2F2;
border-top: 1px solid #F2F2F2;
}
/*----END OF DETAILS BLOCKS-----*/
.smoothScroll {
height: 30px;
width: 140px;
border: 2px solid #FFFFFF;
display: none;
float: left;
border-radius: 25px;
background-color: rgba(0, 0, 0,.15);
clear: both;
position: relative;
top: 145px;
margin: 0px 0px 0px 20px;
transition: background 300ms ease-in-out;
-webkit-transition: background 300ms ease-in-out;
-moz-transition: background 300ms ease-in-out;
}
.smoothScroll:hover {
background: rgba(255,255,255,.20);
}
p.smooth {
color: #FFFFFF;
text-align: center;
font-size: 12px;
line-height: 30px;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: center;
max-width: 620px;
text-transform: uppercase;
}
.downloadTheEbook {
height: 40px;
width: 220px;
border: 2px solid #FFFFFF;
display: block;
float: left;
position: relative;
top: 195px;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
background-color: rgba(0, 0, 0,.15);
transition: background 300ms ease-in-out;
-webkit-transition: background 300ms ease-in-out;
-moz-transition: background 300ms ease-in-out;
}
.downloadTheEbook:hover {
background: rgba(255,255,255,.20);
}
p.jobExpired {
margin: -20px 0px 20px 0px;
padding: 0px 0px 0px 0px;
font-size: 19px;
line-height: 1.5em;
color: rgba(0, 159, 205, 1);
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: left;
max-width: 620px;
font-style: italic;
}
/*DIVIDER*/
.divider { /*LARGE SECTION DIVIDER*/
margin: 10px auto 60px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 100%;
height: 40px;
clear: both;
float: left;
/*border-bottom: 1px solid #E3E3E3;*/
}
.divider2 { /*SMALL CONTENT DIVIDER*/
margin: 10px auto 10px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 960px;
height: 40px;
clear: both;
float: left;
}
/*SECTION BREAK*/
.section960 {
margin: 0px auto;
padding: 60px 0px 60px 0px;
display: block;
width: 960px;
height: auto;
float: left;
clear: both;
border-bottom: 1px solid #F0F0F0;
}
.section960Centered {
margin: 0px auto;
padding: 60px 0px 60px 0px;
display: block;
width: 100%;
height: auto;
float: left;
clear: both;
border-bottom: 4px solid #F5F5F5;
text-align: center;
}
.section960Centered p.normal {
text-align: center;
}
.section960Two {
margin: 0px;
padding: 60px 0px 60px 0px;
display: block;
width: 960px;
height: auto;
float: left;
clear: both;
}
.section1400Home {
margin: 0px auto;
padding: 0px 0px 0px 0px;
/*CHANGES
min-width: 960px;
max-width: 1400px;
width: 100%;
/*width: 1400px;*/
/*height: 593px;*/
width: 960px;
height: 100%;
min-height: 593px;
clear: both;
display: block;
box-shadow: 0px 2px 30px 0px rgba(0,0,0,0.35);
}
.section960Home { /* FIRST CONTENT DIV ON THE HOME PAGE*/
margin: 0px auto 0px auto;
padding: 100px 0px 100px 0px;
display: block;
width: 960px;
clear: both;
float: left;
height: auto;
background-color: rgba(255,255,255,.86);
border-bottom: 1px solid #f2f2f2;
}
.section960Home h1.normal {
text-align: center;
padding-bottom: 10px;
margin: 0px 0px 0px 0px;
}
.section960Home p.center {
margin: 0px auto;
text-align: center;
}
.section960Grey { /*USED AS FIRST GREY INTRO BLOCK ON MOST PAGES*/
margin: 0px auto;
padding: 20px 0px 30px 0px;
padding: 40px 0px 50px 0px;
display: block;
width: 100%;
min-width: 952px;
height: auto;
clear: both;
background-color: #FAFAFA;
border: 1px solid #F0F0F0;
overflow: auto;
/*position: relative;
top: -20px;*/
}
.successStrip {
margin: 0px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 100%;
min-width: 960px;
height: 190px;
float: left;
clear: both;
border-bottom: 4px solid #F5F5F5;
border-top: 4px solid #F5F5F5;
background-color: #FCFCFC;
}
.successStrip img {
margin:0px auto;
display: block;
position: relative;
top: 50%;
transform: translateY(-50%);
/*margin: 0px auto;
display: block;
vertical-align: middle;
max-height: 120px;*/
}
/*STYLES FOR BROCHURE BUTTON*/
.brochureStrip {
margin: 0px auto 0px auto;
padding: 125px 0px 125px 0px;
display: block;
width: 100%;
min-width: 960px;
height: auto;
float: left;
clear: both;
background: url(images/contact-us.jpg);
}
.brochureStrip2 {
margin: 0px auto 0px auto;
padding: 20px 0px 20px 0px;
display: block;
width: 100%;
min-width: 960px;
height: auto;
float: left;
clear: both;
background-color: rgba(0, 159, 205, 1);
/* border-top: 4px solid #F2F2F2; */
border-bottom: 4px solid #F2F2F2;
}
.brochureButton2 {/*SMARTPHONE CALL US BUTTON*/
margin: 10px 10px 10px 10px;
padding: 0px 0px 0px 0px;
height: 60px;
width: 186px;
display: block;
border-radius: 5px;
float: right;
/*background: #FFFFFF;*/
transition: background 500ms ease-out;
-webkit-transition: background .5s ease-out;
-moz-transition: background 500ms ease-out;
}
.brochureButton2 img {
margin: 5px -15px 0px 10px;
display: block;
float: left;
}
.brochureButton2:hover {
color: #FFFFFF;
}
.brochureButton2:hover p.download{
color: #FFFFFF;
}
.brochureStrip3 {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 100%;
min-width: 960px;
height: auto;
float: left;
clear: both;
background-color: rgba(0, 159, 205, 1);
}
.contactButton {
margin: 10px 10px 10px 10px;
padding: 0px 20px 0px 20px;
height: 60px;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 300;
font-size: 18px;
display: block;
float: right;
color: #FFFFFF;
background-color: #009FCD;
border: 4px solid #FFFFFF;
border-radius: 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
transition: all 100ms ease-in-out;
}
.cta2 {/*Right padding for contact button*/
margin-right: 170px;
}
.contactButton img {
margin: 5px 10px 0px 10px;
display: block;
float: left;
}
.contactButton:hover {
background: #10284d;
color: #FFFFFF;
}
.contactButton:hover p.download{
color: #FFFFFF;
}
.freeDownloadButton {
padding: 0px 20px 0px 20px;
height: 40px;
max-width: 220px;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 300;
font-size: 18px;
display: block;
color: #FFFFFF;
background-color: rgba(237,64,136,1);
border: 0px solid #FFFFFF;
border-radius: 30px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
transition: all 200ms ease-in-out;
position: absolute;
left: 0;
right: 0;
margin: auto;
top: 270px;
z-index: 2;
}
.freeDownloadButton:hover {
background: #10284d;
color: #FFFFFF;
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
.freeDownloadButton:hover p.download{
color: #FFFFFF;
}
h3.freeDownloadHeading {
margin: 20px 0px 0px;0px;;
padding: 0px 0px 20px 0px;
font-size: 20px;
font-weight: 600;
color: #10284d;
font-family: Helvetica, "Helvetica Neue", 'Open Sans', sans-serif;
text-align: left;
}
p.normal.freeDownloadTitle {
position: absolute;
top: 30px;
width: 100%;
text-align: center;
color: rgba(237,64,136,1);
}
img.freeDownloadBG {
width: 100%;
object-fit: cover;
margin: 0px auto 50px auto;
}
img.freeDownload {
width: 160px;
position: absolute;
top: 22%;
left: 37%;
z-index: 1;
margin: 0 auto;
}
p.download {
margin: 0px auto 0px auto;
padding: 0px 10px 0px 10px;
/*color: #3a3a3a;*/
color: #FFFFFF;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-size: 18px;
font-weight: 300;
text-align: left;
text-align: center;
transition: color 300ms ease-out;
-webkit-transition: color 300ms ease-out;
-moz-transition: color 300ms ease-out;
position: relative;
top: 50%;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.brochureButton {
margin: 10px 10px 10px 10px;
height: 160px;
width: 212px;
display: block;
border-radius: 10px;
float: left;
border: 4px solid #F6F6F6;
background: #FFFFFF;
transition: background 500ms ease-out;
-webkit-transition: background .5s ease-out;
-moz-transition : background 500ms ease-out;
}
.brochureBasket {
margin: 0px auto;
overflow: auto;
width: 720px
}
.brochureBasket2 {
margin: 0px auto;
overflow: auto;
width: auto;
}
.brochureButton:hover {
background: #FF7059;
color: #FFFFFF;
}
.brochureButton:hover p.download{
color: #FFFFFF;
}
.brochureButton img{
margin: 13px auto 0px auto;
display: block;
}
/*VIDEO STYLES*/
.largeVideo {
padding: 50px 0px 80px 0px;
display: block;
float: left;
width: 960px;
height: auto;
background-color: #F6F6F6;
}
.largeVideo h1.normal {
margin: 0px auto 32px auto;
padding: 0px 90px;
text-align: center;
font-size: 30px;
display: block;
}
.largeVideo iframe {
display: block;
margin:0px auto 0px auto;
width: 780px;
height: 439px;
}
@media screen and (max-width: 600px) {
.largeVideo {
width: 100%;
}
.largeVideo iframe {
width: 100%;
}
}
.theatre {/*USE AS SEPARATE, STAND-ALONE VIDEO SECTION*/
width: 960px;
margin: 0px auto 0px auto;
padding: 20px 0px 30px 0px;
height: auto;
display: block;
overflow: auto;
z-index: 0;
}
.theatre iframe {
margin: 0px auto;
display: block;
height: 500px;
width: 780px;
box-shadow: 0px 10px 20px rgba(0,0,0,0.19), 0px 6px 6px rgba(0, 0, 0, .23);
-webkit-box-shadow: 0px 10px 20px rgba(0,0,0,0.19), 0px 6px 6px rgba(0, 0, 0, .23);
-moz-box-shadow: 0px 10px 20px rgba(0,0,0,0.19), 0px 6px 6px rgba(0, 0, 0, .23);
z-index: 3;
}
/*IMG STYLES*/
img.management {
float: left;
margin: 0px 10px 0px 10px;
width: 140px;
}
p.managementTeam {
margin: 0px 10px 0px 10px;
padding: 0px 0px 50px 0px;
width: 440px;
font-size: 14px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: left;
float: left;
}
/*DETAILS SECTION*/
.details960 {
margin: 0px auto;
padding: 60px 0px 0px 0px;
display: block;
width: 960px;
height: auto;
float: left;
}
.fullImgBackground {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 593px;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
overflow: hidden;
position: relative;
}
@media screen and (max-width: 960px) {
.imgBackground {
width: 100%;
max-width: none;
min-width: 0px;
}
}
.fullImgStrip {
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;
min-width: 960px;
width: 100%;
height: 350px;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
overflow: hidden;
position: relative;
}
/*USE THIS .block380OnImg ON .fullImgBackground*/
.blockOnImg {
margin: 140px 80px 15px 0px;
padding-bottom: 60px;
width: 380px;
height: auto;
min-height: 225px;
display: block;
float: left;
background: rgba(53, 53, 58, .92);
/*background: #323237;*/
}
.blockOnImg h2.wsj {
color: white;
padding: 60px 40px 15px 40px;
}
.blockOnImg p.normal {
color: #FFFFFF;
padding: 0px 40px 15px 40px;
}
.blockOnImg p.normal a.goblue {
color: #FFFFFF;
}
/*********COLOURED BACKGROUNDS**********/
/*CHANGE BACKGROUND COLOUR TO GRAY*/
.greyBackground { /*SETS UP GREY BACKGROUND WITH TOP AND BOTTOM PADDING at 100%*/
margin: 0px auto 0px auto;
padding: 60px 0px 60px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color: #F6F6F6;
clear:both;
float: left;
}
.purpleBackground { /*SETS UP GREY BACKGROUND WITH TOP AND BOTTOM PADDING at 100%*/
margin: 0px auto 0px auto;
padding: 60px 0px 60px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color:rgba(190, 172, 229, 1);
clear:both;
float: left;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-moz- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
z-index: 2;
position: relative;
}
.pinkBackground { /*SETS UP GREY BACKGROUND WITH TOP AND BOTTOM PADDING at 100%*/
margin: 0px auto 0px auto;
padding: 60px 0px 60px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color:rgba(255, 171, 235, 1);
clear:both;
float: left;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-moz- box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
z-index: 1;
position: relative;
}
.pinkBackground h2.wsj {
color: #FFFFFF;
}
.interchangeOverlay { /*INTERCHANGE*/
display: inline-block;
background: -webkit-linear-gradient(11deg, rgba(106, 247, 235, .8) 0%, rgba(0, 159, 205, .9) 42%, rgba(255,171,235,.7) 55%, rgba(190,172,229,.7));
background: -o-linear-gradient(11deg, rgba(106, 247, 235, .8) 0%, rgba(0, 159, 205, .9) 42%, rgba(255,171,235,.7) 55%, rgba(190,172,229,.7));
background: -moz-linear-gradient(11deg, rgba(106, 247, 235, .8) 0%, rgba(0, 159, 205, .9) 42%, rgba(255,171,235,.7) 55%, rgba(190,172,229,.7));
background: linear-gradient(11deg, rgba(106, 247, 235, .8) 0%, rgba(0, 159, 205, .9) 32%, rgba(190,172,229,.86) 56%, rgba(255, 171, 235, .95) 100%);
padding: 60px 0px;
width: 100%;
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
-webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
-o-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
.whiteBackground { /*SETS UP 100% WHITE BACKGROUND WITH ADEQUATE TOP AND BOTTOM PADDING*/
margin: 0px auto 0px auto;
padding: 80px 0px 80px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color: #FFFFFF;
clear:both;
float: left;
border: none;
/*box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
-moz-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);*/
}
/*CHANGE BACKGROUND COLOUR TO BLUE*/
.blueBackground { /*SETS UP BLUE BACKGROUND at 100%*/
margin: 0px auto 0px auto;
padding: 100px 0px 100px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color: #001921;
clear:both;
float: left;
}
.blueBackground h2.wsj {
color: #FFFFFF;
}
.blueBackground p.normal {
color: rgba(255, 255, 255, 1)
}
.blueBackground p.h3normal {
color: #FFFFFF;
font-weight: 300;
}
.blueBackground960 { /*CONSTRAINS TEXT TO 960*/
margin: 0px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 960px;
height: auto;
}
.blueBackground960 h2.wsj {
margin: 0px 0px 0px 10px;
padding: 0px 0px 15px 0px;
font-size: 32px;
font-weight: 700;
color: #FFFFFF;
font-family: 'Open Sans', arial,verdana, sans-serif;
font-style: normal;
text-align: left;
}
.blueBackground960 p.normal {
color: #FFFFFF;
margin: 0px 0px 0px 10px;
padding: 0px 0px 15px 0px;
font-size: 18px;
line-height: 28px;
font-family: 'Open Sans', verdana, sans-serif;
font-weight: 400;
text-align: left;
}
.blueBackground960 a:link {
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px solid #CBEEFA;
box-shadow: inset 0 -2px 0 #CBEEFA;
}
.blueBackground960 a:visited {
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px solid #CBEEFA;
box-shadow: inset 0 -2px 0 #CBEEFA;
}
.blueBackground960 p a:hover {
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px solid #CBEEFA;
box-shadow: inset 0 -2px 0 #CBEEFA;
}
.blueBackground960 p a:active {
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px solid #CBEEFA;
box-shadow: inset 0 -2px 0 #CBEEFA;
}
/*BLOCKQUOTE OPTIONS*/
.blockQuote { /*SETS UP BACKGROUND at 100% WITH LOTS OF TOP AND BOTTOM PADDING*/
background-color: rgba(240, 240, 240, 1);
margin: 0px auto 00px auto;
padding: 60px 0px 60px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
clear: both;
float: left;
}
p.quote { /*STYLES BLOCKQUOTE TEXT*/
margin: 0px auto 0px auto;
padding: 40px 0px 40px 0px;
color: rgba(0, 159, 205, 1);
font-family: "Helvetica Neue", "Open sans", sans-serif;
font-size: 32px;
line-height: 1.3em;
font-kerning: normal;
font-weight: 200;
text-align: center;
font-style: italic;
width: 90%;
}
.greyBlockQuote { /*SETS UP GREY BACKGROUND at 100%*/
margin:0px auto 0px auto;
padding: 150px 0px 150px 0px;
min-width: 960px;
width: 100%;
height: auto;
display: block;
background-color: #E2E2E2;
clear:both;
float: left;
}
p.attribute {
margin: 0px 0px 0px 0px;
padding: 10px 0px 10px 0px;
font-family: "Open Sans", "Helvetica Neue", Georgia, "sans-serif";
color: rgba(140, 140, 140, 1);
font-size: 18px;
text-align: right;
font-style: italic;
padding-right: 50px;
font-weight: 200;
}
/*3 COLUMN BLOCKS*/
.threeColumn {
margin: 10px 10px 10px 10px;
padding: 10px 0px 0px 0px;
height: auto;
width: 300px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
display: block;
float: left;
}
.threeColumn h2.wsj {
padding: 0px 0px 10px 0px;
line-height: 35px;
font-size: 22px;
text-align: center;
}
.threeColumn img {
width: 300px;
margin: 0px;
padding:0px;
}
/*6 COLUMN BLOCKS*/
.sixColumn {
margin: 10px 10px 10px 10px;
padding: 10px 0px 0px 0px;
height: auto;
width: 140px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
display: block;
float: left;
}
.sixColumn h2.wsj {
padding: 0px 0px 10px 0px;
line-height: 28px;
font-size: 22px;
text-align: center;
}
.sixColumn img {
width: 140px;
margin: 0px;
padding:0px;
}
/*RELATED PRODUCT BLOCKS*/
nav.relatedProducts {
margin: 50px auto 50px auto;
height: auto;
width: 640px;
display: block;
/*background-color: #F6F6F6;*/
clear: both;
overflow: auto;
}
.relatedProducts h1.normal {
margin: 20px 10px 20px 10px;
}
.smallIcons {
margin: 20px 10px 0px 10px;
padding: 0px 0px 0px 0px;
height: 220px;
width: 140px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
display: block;
float: left;
}
.smallIcons h2.wsj {
padding: 0px 0px 10px 0px;
line-height: 28px;
font-size: 22px;
text-align: center;
}
.smallIcons img {
width: 140px;
margin: 0px;
padding:0px;
}
/*NEW 3 COLUMN BUTTONS*/
/*PUT THESE BUTTONS IN A .block940 DIV
TO AVOID CLEARING*/
div.button3 {
margin: 80px 20px 80px 0px;
padding: 0px 0px 0px 0px;
background-color: #FFAE23;
height: 60px;
width: 300px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
line-height: 60px;
display: block;
float: left;
/* IF WE WANT TO USE A CSS3 BUTTON TRANSITION
transition: background 1s;
For Safari 3.1 to 6.0
-webkit-transition: background 0.5s; */
}
div.button3:hover {
background: #E59D1F;
}
div.button3 a {
text-decoration: none;
color: white;
}
/*NEW 2 COLUMN BUTTONS*/
/*PUT THESE BUTTONS IN A .block940 DIV
TO AVOID CLEARING*/
div.button2 {
margin: 80px 20px 80px 0px;
padding: 0px 0px 0px 0px;
background-color: #FFAE23;
height: 60px;
width: 220px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
line-height: 60px;
display: block;
float: left;
/* IF WE WANT TO USE A CSS3 BUTTON TRANSITION
transition: background 1s;
/*For Safari 3.1 to 6.0*/
-webkit-transition: background 0.5s;
}
div.button2:hover {
background: #E59D1F;
}
div.button2 a {
text-decoration: none;
color: white;
}
.bt { /*MORE INFO BUTTON*/
position: relative;
display: inline-block;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #c5c5c5;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
margin-bottom: 25px;
margin-top: 22px;
height: 27px;
line-height: 25px;
font-size: 14px;
font-weight: 600;
padding: 0 25px;
color: #343434;
-webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
background: #ffffff;
background: -moz-linear-gradient(top, white 8%, white 8%, #f9f9f9 9%, #f1f1f1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(8%, white), color-stop(8%, white), color-stop(9%, #f9f9f9), color-stop(100%, #f1f1f1));
background: -webkit-linear-gradient(top, white 8%, white 8%, #f9f9f9 9%, #f1f1f1 100%);
background: -o-linear-gradient(top, white 8%, white 8%, #f9f9f9 9%, #f1f1f1 100%);
background: -ms-linear-gradient(top, white 8%, white 8%, #f9f9f9 9%, #f1f1f1 100%);
background: linear-gradient(to bottom, white 8%, white 8%, #f9f9f9 9%, #f1f1f1 100%);
}
/*NEW LINK STYLE*/
a.goblue:link {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
color: #474747;
}
a.goblue:visited {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDff;
color: #474747;
}
a.goblue:hover {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
color: #474747;
}
a.goblue:active {
text-decoration: none;
box-shadow: inset 0 -2px 0 #8CEDFF;
color: #474747;
}
a.nothing:link
{
text-decoration: none;
color: #10284d;
}
a.nothing:hover
{
text-decoration: none;
color: #10284d;
}
a.nothing:visited
{
text-decoration: none;
color: #10284d;
}
/*KEEPS H2 LINKS THE BLUE H2 COLOUR*/
h2 a.goblue:link {
color: #000000;
}
h2 a.goblue:visited {
color: #000000;
}
h2 a.goblue:hover {
color: #000000;
}
h2 a.goblue:active {
color: #000000;
}
h3.smallCaps {
margin: 0px;
padding: 0px 0px 15px 0px;
font-size: 18px;
font-weight: 600;
text-transform: uppercase;
color: #10284d;
color: #AAA;
font-family: Helvetica, "Helvetica Neue", 'Open Sans', sans-serif;
text-align: left;
}
p.h3normal { /*STYLES P TAGS UNDER H3*/
margin: 0px;
padding: 0px 0px 15px 0px;
font-size: 14px;
line-height: 22px;
color: #474747;
font-family: 'Open Sans', verdana, sans-serif;
font-weight: 400;
text-align: left;
}
p.intro {
margin: 0px;
padding: 0px 10px 15px 10px;
font-size: 20px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: left;
}
/*p.intro { CENTERED TEXT
margin: 10px auto 10px auto;
width: 620px;
padding: 0px 0px 15px 0px;
font-size: 16px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: center;
}*/
p.intro a.goblue {
color: #474747;
}
p.intro a.goblue:link {
color: #474747;
}
p.intro a.goblue:visited {
color: #474747;
}
p.intro a.goblue:hover {
color: #474747;
}
p.intro a.goblue:active {
color: #474747;
}
/*NEW NAVIGATION UNORDERED LIST STYLES*/
ul.navigationList {
padding: 0px 0px 10px 40px;
margin: 0px;
list-style: none;
}
ul.navigationList li {
padding: 0px 0px 5px 0px;
margin: 0px;
font-size: 16px;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
}
/*NEW UNORDERED LIST STYLES*/
ul.specsList {
padding: 5px 20px 10px 40px;
}
ul.specsList li {
margin: 0px;
padding: 0px 0px 0px 0px;
font-size: 14px;
color: #474747;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.6em;
text-align: left;
}
ul.banking {
padding: 0px 20px 20px 60px;
}
ul.banking li {
margin: 0px;
padding: 0px 0px 0px 0px;
font-size: 14px;
color: #474747;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.6em;
text-align: left;
}
ul.banking ul {
padding: 0px 0px 10px 50px;
margin: 0px 0px 0px 0px;
}
ol.banking {
padding: 0px 20px 20px 60px;
}
ol.banking li {
margin: 0px;
padding: 0px 0px 10px 0px;
font-size: 16px;
color: #474747;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.6em;
text-align: left;
}
ol.banking ul {
padding: 0px 0px 0px 50px;
margin: 0px 0px 0px 0px;
}
/*2 AUTO-GENERATED COLUMNS*/
div.autoColumn2 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
}
/*3 AUTO-GENERATED COLUMNS*/
div.autoColumn3 {
margin: 0px;
padding: 10px 0px 0px 0px;
-webkit-column-count: 3; /* Chrome, Safari, Opera */
-moz-column-count: 3; /* Firefox */
column-count: 3;
}
/*STYLES TABLE ON BLUE BACKGROUND*/
.tableOnBlue {
border-collapse: collapse;
margin: 10px 10px 10px 10px;
display: block;
float: left;
color: white;
font-family: 'open sans', sans-serif;
}
h1.typeArt { /*INTERCHANGE - LARGEST FONT SIZE*/
margin: 50px 0px 30px 0px;
padding: 0px 0px 0px 0px;
font-size: 80px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.1;
text-align: center;
color: #10284d;
font-kerning: normal;
color:rgba(150, 132, 189, 1);
color: rgba(255,255,255,1);
color: rgba(34,51,52,1);
font-kerning: normal;
}
.blackBG {
margin: 0px auto;
padding: 16px 0px 22px 0px;
width: 100%;
height: auto;
float: left;
clear: both;
background: rgba(34,51,52,1); /* SIT Black */
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
-webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
z-index: 3;
position: relative;
min-width: 960px;
}
.advantageBlue {
background: linear-gradient(360deg, rgba(15,184,173,1) 0%, rgba(0,159,205,1) 51%) !IMPORTANT;
}
.SITBlue {
background: rgba(0, 159, 205, 1) !IMPORTANT;
}
.SITBlack {
background-color: #223334;
}
.interchangeStrip h2.wsj {
margin: 0px auto;
max-width: 620px;
letter-spacing: 3px;
text-align: left;
}
h2.interchange2017TextArt {
font-family: "Museo Slab", "museo-slab", "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
color: #FFFFFF;
font-size: 110px;
margin: 50px 2% 20px 2%;
}
.theEventDate {
font-family: "Museo Sans", "museo-sans", "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 100;
color: #FFFFFF;
font-size: 64px;
margin: 10px 2%;
}
.event {
font-family: "Museo Sans", "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 100;
margin: 10px 2%;
color: #233334;
text-align: center;
padding: 0px 0px 20px 0px;
}
h2.event {
font-size: 60px;
}
h3.event {
font-size: 22px;
max-width: 780px;
margin: 0px auto;
padding-bottom: 50px;
}
p.registerNow
{
margin: -10px 2% 0px 2%;
padding: 10px 5px 0px 40px;
color: rgba(255, 255, 255, 1);
font-family: "Flood Std","flood-std", "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
font-size: 24px;
text-align: left;
max-width: 620px;
display: inline-block;
background: #ea220f;
}
/* Interchange colours 2017*/
/*
Interchange yellow: rgba(206, 169, 0, 1);
Interchange red: rgba(234,34,15, 1);
Interchange light blue: rgba(0,182,202, 1);
Interchange black: rgba(34,51,52, 1);
*/
a.interchangeRegistration {
margin: 20px 2% 20px 2%;
background-color: rgba(255,255,255,.90);
color: white;
width: 480px;
color: rgba(34,51,52, 1);
padding: 0px 10px 10px 10px;
text-decoration: none;
text-align: left;
font-family: "Museo Sans", museo-sans, "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-size: 16px;
border: 4px solid rgba(34,51,52, 1);
transition: all 200ms ease-in-out;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
font-weight: 600;
cursor: pointer;
display: block;
text-decoration: none;
}
a.interchangeRegistration:hover {
background-color: rgba(255, 255, 255,.75);
box-shadow: none;
/*color: rgba(255,255,255, 1);*/
/*border: 2px solid rgba(255, 255, 255, 1);*/
}
a.interchangeRegistration:active {
background-color: rgba(48, 73, 81, 1);
}
a.button1 {
margin: 20px 2% 20px 2%;
background-color: rgba(255,255,255,.90);
color: rgba(34,51,52, 1);
padding: 10px 20px 10px 20px;
text-decoration: none;
text-align: left;
font-family: "Museo Sans", museo-sans, "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-size: 16px;
border: 4px solid rgba(34,51,52, 1);
transition: all 200ms ease-in-out;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
font-weight: 600;
cursor: pointer;
text-decoration: none;
display: block;
float: left;
clear: both;
position: relative;
top: 130px;
}
a.button1:hover {
background-color: rgba(255, 255, 255,.70);
box-shadow: none;
/*color: rgba(255,255,255, 1);*/
/*border: 2px solid rgba(255, 255, 255, 1);*/
}
/*
a.button1:active {
background-color: rgba(48, 73, 81, 1);
color: #FFFFFF;
}
*/
.interchangeNormal {
margin: 0px auto;
font-family: "Museo Sans", museo-sans, "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
max-width: 620px;
text-align: left;
font-size: 18px;
color: rgba(34,51,52,.7);
padding-bottom: 20px;
}
h3.interchangeNormal {
font-size: 22px;
}
.tableOnBlue tr td {
vertical-align: top;
border: 1px solid white;
padding: 20px 20px 20px 20px;
line-height: 20px;
font-size: 14px;
}
.tableAgenda {/*INTERCHANGE*/
border-collapse: collapse;
width: 780px;
margin: 10px auto 0px auto;
display: block;
color: rgba(0, 159, 205, 1);
font-family: 'Open Sans', Helvetica Neue, Helvetica, sans-serif;
font-weight: 400;
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
animation-duration: 2s;
box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.22);
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
z-index: 2;
transition: all 100ms;
}
/* ANIMATION ONLY HAPPENS ON LOAD
@-webkit-keyframes fadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}*/
.tableAgenda tr td:first-child { /*INTERCHANGE*/
vertical-align: top;
padding: 20px 20px 20px 20px;
line-height: 20px;
font-size: 14px;
width: 50%;
}
.tableAgenda tr td.inform { /*INTERCHANGE*/
vertical-align: middle;
padding: 20px 20px 20px 20px;
line-height: 0px;
color: rgba(0, 159, 205, 1);
font-size: 10px;
text-align: center;
font-weight: 600;
text-transform: uppercase;
}
.tableAgenda tr td.colHeader { /*INTERCHANGE*/
vertical-align: middle;
padding: 20px 20px 20px 20px;
line-height: 0px;
color: rgba(0, 159, 205, 1);
font-size: 11px;
text-align: left;
font-weight: 600;
text-transform: uppercase;
}
.tableAgenda tr td { /*INTERCHANGE*/
vertical-align: top;
border: 1px solid #54EEF3;
padding: 20px 20px 20px 20px;
line-height: 1.3em;
font-size: 14px;
background-color: rgba(255, 255, 255,1);
}
.birdsSessionContainer {
width: 779px;
margin: 0px auto 0px auto;
display: block;
color: rgba(0, 159, 205, 1);
font-family: 'Open Sans', Helvetica Neue, Helvetica, sans-serif;
font-weight: 400;
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
animation-duration: 2s;
box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.22);
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
z-index: 2;
transition: all 100ms;
border-bottom: 1px solid rgba(255,171,235,1);
border-left: 1px solid rgba(255,171,235,1);
border-right: 1px solid rgba(255,171,235,1);
padding: 0px 0px 0px 0px;
line-height: 1.3em;
font-size: 14px;
background-color: rgba(255, 255, 255, 1);
overflow: auto;
border-collapse: collapse;
}
.birdSession {
padding: 20px;
margin-right: -5px;
width: 220px;
display: inline-block;
border-right: 1px solid rgba(255,171,235,1);
background: rgba(255, 171, 235, .15);
font-style: italic;
font-weight: 300;
}
.birdSession:nth-child(3) {
border-right: none;
}
.agendaSpeaker {
font-family: 'Open Sans', Helvetica Neue, Helvetica, sans-serif;
font-weight: 600;
font-size: 10px;
}
.tableAgenda tr td.interchangePink { /*INTERCHANGE*/
background: #CDA900;
color: #FFF;
}
th.interchangePink { /*INTERCHANGE*/
background: #CDA900;
padding: 20px 20px 20px 20px;
color: #FFF;
border-radius: 4px 4px 0px 0px;
-webkit-border-radius: 4px 4px 0px 0px;
-moz-border-radius: 4px 4px 0px 0px;
}
.tableOnWhite {
border-collapse: collapse;
margin: 10px 10px 10px 10px;
display: block;
font-family: 'open sans', sans-serif;
}
.block960White .tableOnWhite {
margin: 10px 160px 0px 160px;
}
.tableOnWhite tr td {
vertical-align: top;
border: 4px solid #E5E5E5;
padding: 20px 20px 20px 20px;
line-height: 20px;
font-size: 14px;
color: #9caeb4;
}
p.redCaps { /*STYLES FIRST COLUMN IN A TABLE*/
font-size: 18px;
font-weight: 400;
line-height: 26px;
text-transform: uppercase;
color: #E62F21;
font-family: 'Open Sans', sans-serif;
font-style: normal;
text-align: left;
}
p.whiteCaps { /*STYLES FIRST COLUMN IN A TABLE*/
font-size: 18px;
font-weight: 400;
line-height: 26px;
text-transform: uppercase;
color: #FFFFFF;
font-family: 'Open Sans', arial,verdana, sans-serif;
font-style: normal;
text-align: left;
}
.sitBlueBold {
color: #006699;
font-weight: 700;
list-style: none;
}
p.footnote {
margin: 0px;
padding: 0px 10px 15px 10px;
font-size: 10px;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Hevletica, Verdana, sans-serif;
font-weight: 400;
text-align: left;
font-style: italic;
}
.discontinued {/*Use on div when noting a product discontinuation*/
background: rgba(39,58,76, 1);
width: 100%;
clear: both;
margin: 0px auto;
padding: 255px 0px 255px 0px;
width: 100%;
height: auto;
display: inline-block;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, .24);
z-index: 3;
position: relative;
min-width: 960px;
}
.discontinued p.normal {
margin: 10px auto;
color: #FFFFFF;
text-align: center;
font-size: 14px;
font-weight: 300;
max-width: 780px;
}
.discontinued h2.architecture {
margin: 20px auto 0px auto;
padding-bottom: 0px;
color: #FFFFFF;
text-align: center;
max-width: 780px;
}
img.not4sale {
width: 110px;
display: block;
margin: 0 auto;
}
/*END OF NEW CSS*/
a.button:link
{
text-decoration: none;
color: white;
}
a.button:visited
{
text-decoration: none;
color: white;
}
a.button:hover
{
text-decoration: none;
color: white;
}
a.tophead:link
{
color: white;
text-decoration: none;
}
a.tophead:visited
{
color: white;
text-decoration: none;
}
a.tophead:hover
{
color: red;
text-decoration: none;
}
.lebovic
{
font-size: 14px;
padding-left: 1px;
padding-right: 1px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 600;
color: #474747;
}
address
{
margin: 0px;
padding: 0px;
font-family: verdana, sans-serif;
font-size: 9px;
color: gray;
margin-left: 15px;
}
a img {
border: none;
}
img.right
{
margin: 0px;
padding: 0px;
padding-top: 8px;
border: none;
padding-top: 30px;
padding-bottom: 30px;
padding-left: 30px;
}
img.center
{
margin: auto;
display: block;
}
div.calendar
{
padding: 0px;
margin-top: 0px;
margin-bottom: 10px;
margin-right: 0px;
background-image: url('images/calendar.jpg');
background-repeat: no-repeat;
margin-left: 0px;
float: left;
width: 60px;
height: 65px;
background-position-y: center;
clear:both;
display: block;
float: left;
}
p.year
{
text-align: center;
margin: 0px;
padding: 0px;
font-family: arial,Verdana, sans-serif;
font-size: 10px;
color: #006699;
font-weight: bold;
letter-spacing: 1px;
padding-top: 8px;
padding-left: 0px;
padding-right: 0px;
}
p.month
{
text-align: center;
color: #006699;
margin: 0px;
padding: 0px;
padding-top: 3px;
font-family: arial,verdana, sans-serif;
font-size: 10px;
font-weight: bold;
padding-left: 1px;
padding-right: 0px;
}
p.day
{
text-align: center;
color: #006699;
margin: 0px;
padding: 0px;
padding-top: 0px;
font-family: arial, sans-serif;
font-size: 15px;
font-weight: bold;
padding-left: 0px;
padding-top: 2px;
padding-right: 0px;
}
.jobref
{
font-size: 10px;
letter-spacing: 0px;
color: #888888;
text-transform: lowercase;
display: none;
}
i
{
font-style: italic;
}
u
{
font-size: 11px;
padding-left: 1px;
padding-right: 1px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: bold;
text-decoration: none;
}
h3.finder
{
margin: 0px;
padding: 0px;
color: #006699;
font-family: georgia,serif, sans-serif;
font-weight: bold;
font-size: 12px;
text-align: left;
padding-bottom: 0px;
background-color: white;
border-bottom: solid 3px #F0F0F0;
}
p.finder
{
color: #94A6C2;
font-family: georgia,serif, sans-serif;
font-weight: normal;
font-size: 12px;
text-align: left;
margin: 0px;
padding: 0px;
padding-bottom: 3px;
padding-top: 3px;
}
img {
font-family: "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
font-size: 8px;
color: #bbbbbb;
font-weight: 300;
}
a.img:link
{
text-decoration: none;
color: black;
border: none;
}
a.img:visited
{
color: black;
text-decoration: none;
border: none;
}
a.img:hover
{
text-decoration: none;
color: crimson;
border: none;
}
a.newsbrief:link
{
text-decoration: none;
color: #474747;
border-bottom: dashed 1px #C0C0C0;
}
a.newsbrief:visited
{
color: black;
text-decoration: none;
border-bottom: dashed 1px #C0C0C0;
}
a.newsbrief:hover
{
text-decoration: none;
color: black;
border-bottom: solid 1px black;
}
a.banking:link
{
text-decoration: none;
color: gray;
}
a.banking:visited
{
color: gray;
text-decoration: none;
}
a.banking:hover
{
text-decoration: none;
color: crimson;
}
a.sidebar:link
{
font-weight: bold;
text-decoration: none;
color: #79D402;
}
a.sidebar:visited
{
font-weight: bold;
color: #79D402;
text-decoration: none;
}
a.sidebar:hover
{
font-weight: bold;
text-decoration: none;
color: black;
}
.printonly
{
display: none;
}
p.footfoot
{
margin: 0px auto;
text-align: center;
line-height: 20px;
font-family: arial, sans-serif;
color: #DDD;
font-size: 12px;
font-style: normal;
padding: 30px 0px 30px 0px;
display: block;
clear: both;
min-width: 960px;
}
li.tight
{
padding: 2px;
font-family: 'open sans', verdana,sans-serif;
color: #404040;;
font-size: 12px;
line-height: 14px;
}
h1.header
{
text-align: left;
margin: 0px;
padding: 0px;
padding-left: 2px;
padding-top: 3px;
font-weight: bold;
letter-spacing: 0px;
font-family: verdana, sans-serif;
font-style: normal;
font-size: 9px;
/* color: #FDF5E6; */
color: #E0E0E0;
text-transform: uppercase;
}
ul.usergroup
{
font-size: 16px;
}
li.usergroup
{
padding-bottom: 15px;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-size: 16px;
}
a.underline:link
{
color: #006699;
text-decoration: underline;
}
a.underline:visited
{
color: #006699;
text-decoration: underline;
}
a.underline:hover
{
color: #A00000;
text-decoration: underline;
}
p.news
{
text-align: left;
padding: 0px;
margin: 0px;
padding-left: 0px;
padding-right: 10px;
margin-right: 10px;
font-size: 18px;
line-height: 28px;
color: #000;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;;
margin-bottom: 10px;
margin-top: 5px;
font-weight: 400;
width: 930px;
margin-left: 10px;
}
h1.normal /*NEED TO CHANGE FIRST INSTANCES TO h1.center BEFORE CHANGING TEXT-ALIGN TO LEFT*/
{
margin: 0px 10px 0px 10px;
padding: 0px 0px 0px 0px;
font-size: 50px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.2;
text-align: center;
color: #10284d;
font-kerning: normal;
}
h1.center
{
margin: 0px 0px 0px 0px;
padding: 0px 10px 20px 10px;
font-size: 50px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.2;
text-align: center;
color: #10284d;
text-align: center;
font-kerning: normal;
}
h1.normalTwo /*SAME AS H1 BUT WITH BOTTOM PADDING FOR BODY CONTENT BLOCKS*/
{
margin: 10px 0px 0px 0px;
padding: 0px 10px 20px 10px;
font-size: 50px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.2;
text-align: left;
color: #10284d;
}
h1.successStory {/*ADDITIONAL PADDING-TOP IS COMING FROM SECTION960*/
margin: 0px 0px 0px 0px;
padding: 0px 0px 30px 0px;
font-size: 50px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.2;
text-align: center;
color: #10284d;
}
h1.theatreTitle {/*ADDITIONAL PADDING-TOP IS COMING FROM SECTION960*/
margin: 0px auto 0px auto;
padding: 0px 0px 30px 0px;
font-size: 50px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
font-weight: 600;
line-height: 1.2;
text-align: center;
color: #10284d;
max-width: 620px;
display: block;
}
h2.details
{
margin: 0px;
padding: 0px 10px 0px 10px;
font-size: 50px;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
line-height: 1.2;
text-align: left;
color: #10284d;
}
h3.softwareType {
margin: 0px 10px 20px 10px;
padding: 0px 0px 0px 0px;
font-size: 38px;
font-weight: 300;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
color: #009FCD;
}
h3.details
{
margin: 0px;
padding: 10px 0px 20px 0px;
font-size: 20px;
color: #6a6a6a;
font-style: italic;
font-weight: 400;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", Arial, sans-serif;
text-align: left;
line-height: 1.2;
}
h3.detailsTopic {
margin: 0px;
padding: 16px 10px 20px 10px;
font-size: 16px;
color: #009fcd;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.4;
text-align: left;
}
.professionalTitle {
margin: 0px 0px 2px 0px;
padding: 0px 0px 10px 0px;
font-size: 11px;
font-weight: 600;
color: #009FCD;
font-family: Helvetica, "Helvetica Neue", 'Open Sans', sans-serif;
text-align: left;
}
.companyTitle {
margin: -10px 0px 5px 0px;
padding: 0px 0px 10px 0px;
font-size: 11px;
font-weight: 300;
color: rgba(0, 159, 205, 1);
font-family: Helvetica, "Helvetica Neue", 'Open Sans', sans-serif;
text-align: left;
}
p.interchangeBio { /*STYLES P TAGS UNDER H3*/
margin: 0px;
padding: 0px 0px 15px 0px;
font-size: 12px;
color: #474747;
font-family: 'Open Sans', verdana, sans-serif;
font-weight: 400;
text-align: left;
}
h2.architecture {
padding: 0px 10px 10px 0px;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
color: #10284d;
text-transform: uppercase;
letter-spacing: 8px;
font-weight: 300;
font-size: 22px;
}
h2.wsj {
margin: 0px 0px 0px 0px;
padding: 0px 10px 10px 0px;
font-size: 28px;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
font-kerning: normal;
color: #10284d;
}
h2.wsjCenter {
margin: 0px 0px 0px 0px;
padding: 0px 10px 10px 0px;
font-size: 28px;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: center;
color: #10284d;
}
h2.framed {
margin: 20px 0px 0px 0px;
padding: 0px 10px 0px 10px;
font-size: 20px;
font-weight: 300;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: center;
color: #10284d;
text-transform: uppercase;
letter-spacing: 7px;
line-height: 1.3em;
}
h3.wsj {
margin: -5px 0px 0px 0px;
padding: 0px 10px 10px 0px;
font-size: 28px;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
color: #CCC;
}
h2.wsjWhite {
margin: 0px 0px 0px 0px;
padding: 0px 10px 15px 0px;
font-size: 26px;
font-weight: 600;
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
color: #FFFFFF;
}
h3.jobIDNumber {
font-family: "Helvetica Neue", Helvetica, "Nimbus-Sans", "Open Sans", sans-serif;
text-align: left;
color: rgba(0, 159, 205,1);
font-weight: 500;
margin: -10px 10px 15px 10px;
font-size: 18px;
}
a.wsj:link
{
color: #006699;
text-decoration: none;
}
a.wsj:visited
{
color: #006699;
text-decoration: none;
}
a.wsj:hover
{
color: #006699;
text-decoration: none;
}
h2.definition
{
margin-left: 20px;
font-size: 16px;
letter-spacing: 1px;
font-weight: normal;
color: #63705F;
/* color:#5A8CD6; */
font-family: georgia,verdana, sans-serif;
font-style: normal;
margin-bottom: 0px;
margin-right:0px;
padding-bottom: 0px;
padding-top: 5px;
border-bottom: solid 1px #EEE;
padding-left: 0.3em;
margin-top: 18px;
}
/*
h3.definition
{
margin-left: 5px;
padding-left: 6px;
font-size: 14px;
font-weight: bold;
color: #006699;
font-family: arial,verdana, sans-serif;
font-style: normal;
margin-bottom: 5px;
margin-right:0px;
padding-bottom: 0px;
border-bottom: solid 1px #F0F0F0;
margin-top: 5px;
padding-top: 2px;
display: inline;
}
*/
h2.highlight
{
margin: 0px;
padding: 3px;
margin-left:0px;
font-size: 16px;
font-weight: bold;
color: #006699;
font-family: arial, sans-serif;
font-style: normal;
margin-bottom: 8px;
background-color: #E1EAF3;
}
h2.fake
{
float: left;
margin: 0px;
padding: 0px;
font-size: 2px;
line-height: 2px;
}
p.fake
{
clear: left;
padding: 0px;
margin: 0px;
font-size: 10px;
line-height: 10px;
}
.normal
{ /* REMOVED p from p.normal */
margin: 0px;
padding: 0px 0px 15px 0px;
font-size: 16px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: left;
/*max-width: 620px;*/
}
p.center {
margin: 0px auto;
padding: 0px 10px 15px 0px;
font-size: 18px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: center;
/*width: 780px;*/
max-width: 720px;
}
p.homeCenter {
margin: 0px auto;
padding: 0px 20px 15px 20px;
font-size: 16px;
line-height: 1.5em;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 400;
text-align: center;
display: block;
max-width: 700px;
}
p.choose {
margin: 0px auto 20px auto;
padding: 0px 5px 0px 5px;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-size: 14px;
font-weight: 400;
text-align: center;
color: rgba(0, 159, 205, 1);
}
.sixColumn {
margin: 10px 10px 10px 10px;
padding: 10px 0px 0px 0px;
height: auto;
width: 140px;
font-family: "open sans", sans-serif;
font-size: 18px;
text-align: center;
font-weight: 400;
display: block;
float: left;
}
.chooseButtonStrip {
margin: 0px auto 6px auto;
padding: 10px 0px 10px 0px;
width: 100%;
height: auto;
clear: both;
display: block;
overflow:auto;
background: rgba(242,242,242, 1);
min-width: 960px;
box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
-moz-box-shadow: 0px 3px 6px rgba(0,0,0,0.13);
}
.chooseButton {
margin: 10px 10px 10px 10px;
height: 160px;
width: 140px;
display: block;
border-radius: 2px;
float: left;
border: 0px solid #F2F2F2;
background: #FFFFFF;
transition: background 500ms ease-out;
-webkit-transition: background .5s ease-out;
-moz-transition : background 500ms ease-out;
box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.12);
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.12)
}
.chooseButton:hover {
background: rgba(237, 90,95,1);
color: #FFFFFF;
}
.chooseButton:hover p.choose{
color: #FFFFFF;
}
.chooseButton img {
margin: 15px auto 5px auto;
padding: 0px 0px 0px 0px;
display: block;
width: 80px;
height: 80px;
border-radius: 0px;
/*background: rgba(0, 159, 205, 1);*/
/*background: #FF7059;*/
/*transition: background 300ms ease-out;*/
}
/*
.chooseButton:hover img {
background: #FFFFFF;
}
*/
p.specs {
margin: 0px;
padding: 10px 20px 5px 20px;
font-size: 14px;
color: #474747;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.3em;
text-align: left;
}
p.specs:first-child {
padding: 20px 10px 5px 20px;
}
ul.specsList {
padding: 5px 20px 10px 40px;
}
ul.specsList ul {
padding: 4px 10px 8px 40px;
}
ul.specsList li {
margin: 0px;
padding: 0px 0px 0px 0px;
font-size: 14px;
color: #474747;
font-weight: 400;
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
line-height: 1.6em;
text-align: left;
}
*::selection {
color: #333;
background: #c8eff5;
}
.highlight {
background: #c8eff5;
}
p.boxy, p.boxer
{
text-align: left;
padding: 0px;
margin: 0px;
margin-left: 15px;
font-size: 12px;
line-height: 20px;
color: #333;
font-family: verdana, sans-serif;
margin-bottom: 10px;
margin-top: 5px;
padding: 15px;
background-color: #E0E9F0;
background-color: #F5F6FA;
font-style: italic;
}
p.interview
{
margin: 30px 0px 20px 0px;
padding: 0px;
display: inline-block;
text-align: left;
font-size: 14px;
line-height: 20px;
font-weight: 800;
color: #10284d;
font-family: "Open Sans", "Helvetica Neue", Helvetica, Verdana, sans-serif;
}
p.deflist
{
margin-left:20px;
font-size: 28px;
/* color: #E49602; */
color: #5D6E7E;
font-family: georgia,arial,verdana, sans-serif;
padding: 8px;
font-weight: bold;
display: inline;
/* background-color: #FAFAFA; */
background-color: #F2E2E3;
border-top: 1px solid #F0F0F0;
border-left: 1px solid #F0F0F0;
border-right: 1px solid #D0D0D0;
border-bottom: 1px solid #D0D0D0;
margin-top: 10px;
margin-bottom: 10px;
background-image: url('images/small_letter.jpg');margin-right:0px
}
.deflist
{
padding: 0px;
margin: 0px;
margin-top: 10px;
margin-bottom: 10px;
}
/*
div.block
{
margin-left: 20px;
background-color: yellow;
padding: 10px;
}
*/
/*
table.prevnext
{
margin: 0px;
padding: 0px;
margin-left: 12px;
margin-top: 25px;
border: solid 1px #E0FFE0;
background-color: #Fafafa;
}
*/
p.definition
{
padding: 0px;
margin-left: 22px;
padding-left: 0.3em;
font-size: 12px;
line-height: 18px;
color: #333;
font-family: verdana, sans-serif;
margin-bottom: 8px;
margin-top: 0px;
border: none;
padding-top: 5px;
}
p.defletterhead
{
padding: 10px;
margin: 0px;
font-size: 12px;
margin-left: 5px;
padding-left: 15px;
line-height: 18px;
color: #333;
font-family: verdana, sans-serif;
margin-bottom: 22px;
margin-top: 0px;
background-color: #F8F8F8;
border: none;
padding-top: 5px;
}
/*
p.prevnexthead
{
padding: 0px;
margin: 0px;
font-size: 12px;
line-height: 20px;
color: #006699;
font-family: verdana, sans-serif;
text-align: right;
font-weight: bold;
padding: 5px;
}
p.prevnext
{
padding: 0px;
margin: 0px;
font-size: 14px;
line-height: 20px;
color: #707090;
font-family: arial,verdana,sans-serif;
text-align: left;
padding: 5px;
}
*/
sup {
height: 0;
line-height: 1;
position: relative;
top: -0.6em;
vertical-align: baseline !important;
vertical-align: bottom;
}
body
{
margin: 0px;
padding: 0px;
}
p.choice1
{
margin: 0px;
margin-top: 0px;
margin-left: 5px;
padding: 0px;
font-family: verdana,arial, sans-serif;
font-size: 10px;
font-weight: normal;
color: gray;
background-color: #FFFFFF;
letter-spacing: 0px;
text-align: right;
}
a.solutions:link
{
color: #006699;
text-decoration: none;
border-bottom: solid 1px #E0E0E0;
}
a.solutions:visited
{
color: #006699;
text-decoration: none;
border-bottom: solid 1px #F0F0F0;
}
a.solutions:hover
{
color: black;
text-decoration: none;
border-bottom: solid 1px crimson;
}
/* a:link
{
color: #000066;
text-decoration: none;
}
a:visited
{
color: #000066;
text-decoration: none;
}
a:hover
{
color: red;
text-decoration: underline;
}
*/
h2.choice1
{
margin: 0px;
padding-right: 30px;
font-family: arial, sans-serif;
font-size: 12px;
font-weight: normal;
text-align: right;
color: #E0E3EA;
}
table.left
{
margin-left: 15px;
padding-top: 3px;
border: none;
padding-right: 10px;
}
table.right
{
margin-left: 3px;
padding-top: 3px;
border: none;
padding-right: 3px;
}
figcaption {
font-size: 10px;
color: #474747;
font-family: "Open Sans", "Helvetica Neue", Hevletica, Verdana, sans-serif;
font-weight: 400;
text-align: right;
font-style: italic;
}
/*-------------Background Images-----------*/
#tools {
background-image: url(images/theRightTools2.jpg);
height: 593px;
background-size: 100%;
}
#houses {
background-image: url(images/houses-tiltshift.jpg);
height: 593px;
background-size: 100%;
}
#sit {
background-image: url(images/building_SIT.jpg);
height: auto;
background-size: 100%;
}
#solution {
background-image: url(images/solutions.png);
width: 300px;/*Native is 600px for retina*/
height: 662px;
background-repeat: no-repeat;
display: block;
float: right;
background-size: 100%;
margin-top: -120px;
}
#createNewProducts {
background-image: url(images/create-new-products1.jpg);
height: 593px;
background-size: 100%;
}
#accountingEntries {
background-image: url(images/accounting-entries.jpg);
height: 593px;
background-size: 100%;
}
#onlineBankingMobile {
background-image: url(images/online_banking_mobile.jpg);
height: 593px;
background-size: 100%;
}
#strictAuditTrail {
background-image: url(images/strict-audit-trail.jpg);
height: 593px;
background-size: 100%;
}
#medicalCollection {
background-image: url(../banking_software/images/medical-collection-statements.jpg);
background-size: 100%;
min-height: 500px;
background-repeat: no-repeat;
}
.angle { /*RIGHT ANGLE*/
display: inline-block;
padding-right: .7em;
background-image: url(images/learn-more.svg);
background-repeat: no-repeat;
background-size: 5px 10px;
background-position: 100% 60%;
}
#specButton {
width: 220px;
height: 30px;
background-color: rgba(30,30,50,.2);
border-radius: 50px;
-webkit-border-radius: 5px 5px 5px 5px;
position: relative;
top: 150px;
clear: both;
text-decoration: none;
margin-left: 0px;
display: block;
float: left;
border: none;
}
a#specButton:hover {
background-color: rgba(0,0,0,.2);
}
#collectionAgency {
background-image: url(images/Collection-Agency-Software.jpeg);
background-size: cover;
background-position: center;
}
#leader {
background-image: url(../banking_software/images/align-with-a-leader.jpg);
background-size: cover;
background-position: center;
}
#insurance {
background-image: url(../banking_software/images/insurance-software.jpeg);
background-size: cover;
background-position: top right;
}
#interchange-2017 {
background: url(images/Hero-image-interchange-2017.png);
background-size: cover;
background-position: center;
}
/*SHARPSPRING*/
.signUpForm {
background: rgba(240,240,240,.98);
padding: 60px;
margin: 60px auto;
float: none;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
width: 40%;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.collectorWebinarInfo {
width: 100%;
display: block;
margin: 20px auto 40px auto;
float: none;
}
.collectorWebinarInfo h1 {
text-align: left;
padding-bottom: 15px;
text-align: center;
}
.collectorWebinarInfo h2 {
font-weight: 500;
font-size: 18px;
color: #999999;
margin: 0px auto;
padding-bottom: 15px;
max-width: 80%;
}
.collectorWebinarInfo p {
margin: 0px 10px;
}
.benefit {
width: 45%;
display: inline-block;
padding: 60px 0px 30px 0px;
vertical-align: top;
margin: 20px;
border-top: 3px dotted #8dc0ba;/*cactus colour*/
}
.benefit h2 {
color: rgba(0, 159, 205, 1);
margin: 0px 10px;
}
.benefit p {
margin: 0px 10px;
}
p.formIntro {
margin: -20px 0px 0px 0px;
padding: 0px 10px 15px 0px;
font-size: 15px;
line-height: 1.5em;
color: rgba(0,159,205, 1);
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
font-weight: 600;
text-align: left;
max-width: 620px;
}
#cactus {
background-image: url(images/clean-background.jpg);
background-size: cover;
background-position: center;
width: 100%;
min-width: 960px;
}
#webinarBG {
background-image: url(images/webinarBG.jpg);
}
#webinarLearnImg{
position: absolute;
top: -80px;
height: 120px;
width: 200px;
display: inline-block;
vertical-align: bottom;
background-image: url(images/signUpHere.png);
background-size: contain;
background-repeat: no-repeat;
z-index: 999 !important;
}
.backgroundPattern1 {
background-image: url(images/bg-pattern-texture-1.png);
background-repeat: repeat;
}
/*Style for homepage redesign*/
html {
position: relative;
min-height: 100%;
}
body {
min-height: 100%;
padding-bottom: 0px;
overflow: auto;
}
.container {
overflow: auto;
max-width: 1200px;
margin: 0px auto;
}
p, h1, h2, h3, h4, h5, h6 {
color: #434649; /*black*/
}
#mainNavContainer {
/*background-color: rgba(241,241,241,1); */
position: relative;
}
nav#mainNav {
display: block;
height: 50px;
width: 100%;
margin: 0px auto;
line-height: 50px;
font-size: 0px;
margin: 0 auto;
max-width: 1170px;
min-width: 960px;
}
nav#mainNav ul li {
display:inline-block;
width: auto;
height: 50px;
box-sizing: border-box;
transition: all 200ms ease-in-out;
border: 0px solid #009FCD;
-moz-box-sizing: border-box;
-moz-transition: all 200ms ease-in-out;
-webkit-box-sizing: border-box;
-webkit-transition: all 200ms ease-in-out;
}
nav#mainNav ul li:hover {
border-bottom: 3px solid #009fcd;
}
nav#mainNav a {
margin:0px 20px;
font-size: 14px;
text-decoration: none;
font-family: "Montserrat", "Open Sans", Helvetica, Arial, sans-serif;
color: #484848;
}
a#logo{
background-image: url(../banking_software/images/portfolio-plus-logo.svg);
width: 100px;
height: 32px;
display: inline-block;
background-repeat: no-repeat;
background-size: contain;
position: relative;
top: 0px;
margin-right: 15px;
box-sizing: border-box;
}
h1.heroHeading {
position: relative;
top: 0px;
text-align: left;
font-family: "Montserrat", sans-serif;
font-size: 48px;
font-weight: 600;
line-height: 58px;
z-index: 1;
color: #FFFFFF;
margin: 240px 2% 20px 12%;
max-width: 1170px;
left: 0;/*centres absolute div*/
right: 0;/*centres absolute div*/
text-shadow: 0px 0px 30px rgba(10,18,32,.3);
box-sizing: border-box;
}
h6.pageDesc {
position: relative;
z-index: 1;
color: #FFFFFF;
width: 100%;
text-align: left;
margin: 0px 2% 20px 12%;
padding: 0px 0px;
box-sizing: border-box;
max-width: 660px;
top: 0px;
font-size: 18px;
font-family: "Montserrat","Open sans", sans-serif;
text-shadow: 0px 0px 15px rgba(51,35,35,.3);
font-weight: 400;
line-height: 1.5;
display: block;
float: left;
}
nav.choiceNav {
width: 100%;
margin: 0 auto;
box-sizing: border-box;
position: relative;
display: flex;
}
.container {
width: 100%;
box-sizing: border-box;
max-width: 1170px;
overflow: auto;
min-width: 960px; /*Based on original website restrictions*/
}
.whitePatternBG {
width: 100%;
box-sizing: border-box;
overflow: auto;
min-width: 960px; /*Based on original website restrictions*/
background: url(images/webinarBG.jpg);
padding: 60px 0px 80px 0px;
}
.bluePatternBG {
width: 100%;
box-sizing: border-box;
overflow: auto;
min-width: 960px; /*Based on original website restrictions*/
background: url(images/webinarBG-blue.png);
/*
background-color: rgba(0, 159, 205, 1);
background-blend-mode: multiply;
*/
padding: 90px 0px;
background-repeat: repeat-x repeat-y;
overflow: hidden;
}
.lightsOut { /*Dark Background*/
width: 100%;
box-sizing: border-box;
overflow: auto;
min-width: 960px; /*Based on original website restrictions*/
background: #323323;
padding: 60px 0px 80px 0px;
}
.whitesOut { /*White Background*/
width: 100%;
box-sizing: border-box;
overflow: auto;
min-width: 960px; /*Based on original website restrictions*/
background: #FFFFFF;
padding: 60px 0px 80px 0px;
}
/*.crooked {
transform: rotate(2deg);
-ms-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
}
.level {
transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
position: relative;
left: 0;
top: 0;
}
*/
.choiceThird {
display: inline-block;
width: 29%;
margin: 30px 2% 30px 2%;
background-color: #FBFDFD;
box-sizing: border-box;
transition: all 200ms ease-in-out;
cursor: pointer;
vertical-align: top;
padding-bottom: 10px;
position: relative;
left: 0px;
border: 2px solid #F6F6F6;
flex: 1;
}
.choiceThird:hover {
box-shadow: 0px 6px 12px rgba(0, 159, 205, .25);
}
.finger {
cursor: pointer;
}
.flexThis {
display: flex;
}
.choiceFourth {
display: inline-block;
width: 20.5%;
margin: 30px 2% 30px 2%;
background-color: #FBFDFD;
box-sizing: border-box;
transition: all 200ms ease-in-out;
cursor: pointer;
padding-bottom: 10px;
vertical-align: top;
border: 2px solid #F6F6F6;
flex: 1;
}
.choiceFourth:hover {
box-shadow: 0px 10px 17px 3px rgba(0, 0, 0, .25);
}
.choiceImg {
width: 100%;
text-decoration: none;
}
.choiceIcon {
height: 80px;
width: 80px;
margin: 20px auto;
display: block;
text-decoration: none;
}
h6.choiceTitle {
font-family: "Montserrat", sans-serif;
font-size: 20px;
text-align: center;
margin: 20px 10px 10px 10px;
font-weight: 400;
color: #009fcd;
}
.choiceFourth .choiceTitle {
font-size: 16px;
}
.choiceFourth .choiceDescription {
margin-top: 10px;
}
.choiceFourth a.learnMoreArrow{
text-align: center;
}
a.learnMoreArrow:after {
content: " >";
}
a.learnMoreArrow {
font-family: "Montserrat", sans-serif;
font-size: 16px;
font-weight: 300;
margin: -5px 20px 30px 20px;;
display: block;
color: rgba(0, 159, 205, 1);
text-decoration: none;
}
a.learnMoreArrow:hover {
color: rgba(0, 159, 205, .7);
}
a.learnMoreArrow:visited {
color: rgba(0,159,205, 1);
}
.choiceThird a.learnMoreArrow {
margin: 20px auto;
text-align: center;
width: 130px;
}
.choiceDescription {
font-family: "Montserrat", sans-serif;
font-size: 12px;
text-align: center;
margin: 30px 20px 30px 20px;
line-height: 1.5;
font-weight: 400;
}
.choiceHalf {
display: inline-block;
width: 45%;
margin: 30px 2% 30px 2%;
background-color: #F0F8FF;
box-sizing: border-box;
transition: all 200ms ease-in-out;
padding-bottom: 10px;
}
.choiceHalf .choiceImg {
height: 300px;
}
.contentHalf {
display: inline-block;
width: 45%;
margin: 30px 2% 30px 2%;
background-color: #F0F8FF;
box-sizing: border-box;
transition: all 200ms ease-in-out;
vertical-align: top;
}
.contentHalf .contentImg {
width: 100%;
height: 350px;
}
.blueFog {/*Adds blue shadow to card*/
transition: all 200ms ease-in-out;
}
.blueFog:hover {
box-shadow: 0px 6px 12px rgba(0, 159, 205, .25);
}
.noBG {
background-color: rgba(0,0,0,0);
}
.breathe {
margin-top: 50px;
padding-top: 50px;
}
.contentTitle {
font-family: "Montserrat", sans-serif;
font-size: 28px;
text-align: left;
margin: 20px;
}
.contentCopy {
font-family: "Montserrat", sans-serif;
font-size: 16px;
text-align: left;
margin: 30px 20px;
}
.learnMore {
color: #FFFFFF;
display: block;
margin: 0 auto;
width: 240px;
text-align: center;
height: 40px;
line-height: 40px;
border-radius: 20px;
position: absolute;
bottom: -10px;
z-index: 55;
left: 0;/*centres absolute div*/
right: 0;/*centres absolute div*/
transition: all 200ms ease-in-out;
text-decoration: none;
font-family: "Montserrat", "Open Sans", Helvetica, Arial, sans-serif;
font-weight: 500;
font-size: 16px;
box-sizing: border-box;
background-color: rgba(16,40,77,1); /*#10284d;*/
box-shadow: 0px 12px 20px 2px rgba(0, 159, 205, .3);
}
.learnMore:visited {
color: #FFFFFF;
}
.learnMore:hover {
background-color: rgba(0, 159, 205, 1);
background-color: white;
color: rgba(16,40,77,1);
box-shadow: 0px 5px 10px rgba(0, 159, 205, .4);
}
.left {
text-align: left;
}
.ruler{
}
.ruler:before {
content:"";
border-top: 2px dotted #EEEEEE;
max-width: 1170px;
margin: 0 auto;
width: 100%;
height: 2px;
display: block;
}
/* Slideshow container */
.slideshow-container {
/*max-width: 1000px;*/
position: relative;
margin: auto;
height: 625px;
background-color: #FAFAFA;
width: 100%;
box-sizing: border-box;
}
.heroContainer { /*Tied to height of .slideshow-container*/
position: relative;
margin: 0px auto;
height: 625px;
/*height: 650px;*/
clear: both;
box-sizing: border-box;
background: linear-gradient(to top right, rgba(0,234,123,.7), rgba(0,159,205,.7));
}
.mySlides {
display: none;
height: 100%;
width: 100%;
}
/* Next & previous buttons */
.prev, .next {
cursor: pointer;
position: absolute;
top: 50%;
width: auto;
margin-top: -22px;
padding: 16px;
color: white;
font-weight: bold;
font-size: 18px;
transition: 0.6s ease;
}
a.lefty, a.righty {
display: inline-block;
font-size: 18px;
padding: 10px;
color: rgba(0, 159, 205, 1);
background-color: rgba(248, 248, 248, .8);
cursor: pointer;
}
.sliderArrow {
background-image: url(images/slider-arrow-left.svg);
width: 39px;
height: 39px;
margin-left: 2%;
margin-right: 2%;
background-size: 40px;
background-repeat: no-repeat;
background-position: 50% 50%;
background-color: rgba(16, 40, 77, .0);
border-radius: 25px;
z-index: 1;
}
@media screen and (max-width: 600px) {
.prev, .next {
top: 85%;
z-index: 10;
}
}
.spinIt {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
transform: rotate(180deg);
}
/* Position the "next button" to the right */
.next {
right: 0;
}
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
background-color: rgba(255,255,255,.0);
box-shadow: 0px 0px 45px rgba(255,255,255,.9);
-webkit-box-shadow: box-shadow: 0px 0px 45px rgba(255,255,255,.9);
}
/* Caption text */
.text {
color: #f2f2f2;
font-size: 15px;
padding: 8px 12px;
position: absolute;
bottom: 8px;
width: 100%;
text-align: center;
display: none;/*slider code for caption*/
}
/* Number text (1/3 etc) */
.numbertext {
color: #f2f2f2;
font-size: 12px;
padding: 8px 12px;
position: absolute;
display: none;
}
/* The dots/bullets/indicators */
.dot {
height: 13px;
width: 13px;
margin: 0 2px;
background-color: #D0D4D9;
border-radius: 50%;
display: inline-block;
transition: background-color 0.6s ease;
}
.active, .dot:hover {
background-color: #7B8995;
}
.dot2 {
height: 13px;
width: 13px;
margin: 0 2px;
background-color: #D0D4D9;
border-radius: 50%;
display: inline-block;
transition: background-color 0.6s ease;
}
.active, .dot2:hover {
background-color: #7B8995;
}
.switch {
position: relative;
right: 300px;
}
/* Fading animation */
.fade {
-webkit-animation-name: fade;
-webkit-animation-duration: 1.5s;
animation-name: fade;
animation-duration: 1.5s;
}
@-webkit-keyframes fade {
from {opacity: .4}
to {opacity: 1}
}
@keyframes fade {
from {opacity: .4}
to {opacity: 1}
}
.originalFooter {/*Not used. Testing only.*/
height: 100px;
background-color: #f0f8ff;
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
display: block;
margin: 0 auto;
padding: 16px;
}
.footerBlock {
display: inline-block;
}
/*Contact Page Form - Salesforce*/
textarea:focus, input:focus{
outline: none;
}
.contactForm {
width: 100%;
max-width: 480px;
overflow: auto;
padding: 0px 0px 0px 0px;
margin: 50px auto;
}
.contactForm input:focus {
background-color: #FFFFFF;
border: 2px solid #009fcd;
}
.contactForm input.text{
display: block;
position: relative;
text-align: left;
top: 1px;
float: left;
clear: both;
width: 100%;
min-height: 50px;
font-size: 16px;
color: #10284d;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
padding-left: 10px;
margin: 0px 0px 20px 0px;
-webkit-appearance: none;
appearance: none;
-moz-appearance: none;
border: 1px solid #c9c9c9;
background-color: #FAFAFA;
vertical-align: middle;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.contactForm input::placeholder, textarea::placeholder {
color: rgba(200, 200, 200, 1);
overflow: auto;
}
.contactForm textarea {
height: 200px;
width: 100%;
resize: none;
display: block;
float: left;
clear: both;
border: 1px solid #c9c9c9;
background-color: #FAFAFA;
min-height: 50px;
font-size: 16px;
color: #10284d;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
padding: 10px 0px 0px 10px;
margin: 0px 0px 20px 0px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.contactForm textarea:focus {
background-color: #FFFFFF;
border: 2px solid #009FCD;
}
.contactForm .submitButton {
width: 100%;
display: block;
float: left;
height: 40px;
color: #10284d;
background-color: #FFFFFF;
border: 2px solid #10284d;
border-radius: 3px;
font-size: 16px;
margin: 15px auto 0px auto;
text-transform: uppercase;
padding-left: 0px;
transition: all 200ms ease-in-out;
}
.submitButton:hover {
background-color: #10284d; /*New Black*/
color: #FFFFFF;
}
.formLabel {
display: block;
float: left;
clear: both;
min-height: 50px;
line-height: 50px;
font-size: 16px;
color: #10284d;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
padding-left: 10px;
margin: 0px 20px 0px 0px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.formSelect {
height: 50px;
min-width: 165px;
display: inline-block;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: rgba(200,200,200,1);
font-size: 13px;
box-sizing: border-box;
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
border: 1px solid #c9c9c9;
background-color: #FAFAFA;
vertical-align: middle;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
padding-left: 10px;
margin: 0px 0px 20px 0px;
}
/*Hides labels -- Accessibility*/
.visuallyHidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.consentBox {
display: block;
float: left;
position: relative;
padding-top: 15px;
}
/* The container */
.consentContainer {
display: block;
position: relative;
padding-left: 35px;
margin-bottom: 0px;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* Hide the browser's default checkbox */
.consentContainer input {
position: absolute;
cursor: pointer;
opacity: 0;
}
/* Create a custom checkbox */
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 25px;
width: 25px;
background-color: #eee;
}
/* On mouse-over, add a grey background color */
.consentContainer:hover input ~ .checkmark {
background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.consentContainer input:checked ~ .checkmark {
background-color: #009FCD;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
content: "";
position: absolute;
display: none;
}
/* Show the checkmark when checked */
.consentContainer input:checked ~ .checkmark:after {
display: block;
}
/* Style the checkmark/indicator */
.consentContainer .checkmark:after {
left: 9px;
top: 5px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
/*-----Images-----*/
#slide1 {
background: url(../banking_software/images/bank-software.jpg) no-repeat center center fixed;
background-size: cover;
-webkit-background-size:cover;
-moz-background-size: cover;
overflow: hidden;
background-position: center;
background-attachment: fixed;
height: 100%;
background-repeat: no-repeat;
}
#slide2 {
background-image: url(../banking_software/images/debt-collection-software.jpg);
background-size: cover;
overflow: hidden;
background-position: center;
height: 100%;
background-attachment: fixed;
background-repeat: no-repeat;
}
@media screen and (max-width: 600px) {
#slide1 {
background-image: url(../banking_software/images/bank-software-sm.jpg);
}
#slide2 {
background-image: url(../banking_software/images/debt-collection-software-sm.jpg);
}
}
#slide3 {
background-image: url(../banking_software/images/DICE-2018.jpg);
background-size: cover;
background-repeat: no-repeat;
overflow: hidden;
background-attachment: fixed;
background-position: bottom;
height: 100%;
z-index: 0;
/*background-attachment: fixed;*/
}
#slide4 {
background-image: url(../banking_software/images/Hero-image-interchange-2017.png);
background-size: cover;
background-repeat: no-repeat;
overflow: hidden;
background-attachment: fixed;
background-position: bottom;
height: 100%;
/*background-attachment: fixed;*/
}
/*--HEADING CONTAINER & ANIMATION*/
@keyframes slippery { /*MAKES TEXT FLOAT UP*/
0% {left:0px; top:30px;}
100% {left:0px; top:0px;}
}
@-webkit-keyframes slippery { /*MAKES TEXT FLOAT UP*/
0% {left:0px; top:30px;}
100% {left:0px; top:0px;}
}
.headingContainer {
display: block;
box-sizing: border-box;
max-width: 1170px;
margin: 0px auto;
position: relative;
animation-name: slippery; /*FLOAT UP*/
-webkit-animation-name: slippery;
animation-duration: 1s;
}
.transHeading .block960 {
}
#debtCollectionHero1 {
background-image: url(../banking_software/images/debt-collection-software-hero.jpg);
-webkit-background-size:cover;
-moz-background-size: cover;
overflow: hidden;
background-position: center;
background-attachment: fixed;
height: 100%;
background-repeat: no-repeat;
}
@media only screen and (max-width: 960px) {/*Fixes Mobile image size issue*/
#slide1 {
background-attachment: scroll;
}
#slide2 {
background-attachment: scroll;
}
#slide3 {
background-attachment: scroll;
}
#slide4 {
background-attachment: scroll;
}
}
/*Material Design: BOX SHADOWS FOR Z-HEIGHT {
when @ z-index 1 {
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
when @ z-index 2 {
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
when @ z-index 3 {
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
when @ z-index 4 {
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
when @ z-index 5 {
box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}
}*/
/* Material Shadow Classes */
.level1 {
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.level2 {
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
.level3 {
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
.level4 {
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
.level5{
box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}
/*Modal signup form | Brochure Lightbox*/
/* Full-width input fields */
#mc_embed_signup input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
font-family: 'Open Sans';
}
/* Set a style for all buttons */
button {
color: white;
padding: 14px 20px;
margin: 8px 10px;
font-size: 16px;
position: relative;
top: 50%;
border: 4px solid #FFFFFF;
cursor: pointer;
width: 50%;
border-radius: 0px;
}
/* Extra styles for the cancel button */
.cancelbtn {
padding: 14px 20px;
background-color: #f44336;
display:none;
}
.signupbtn {
background-color: rgba(0,159,205,1);
border: 4px solid rgba(0, 159,205,1);
transition: all 200ms ease-in-out;
-webkit-transition: all 200ms ease-in-out;
}
.signupbtn:hover {
background: #FFFFFF;
color: rgba(0,159, 205,1);
}
/* Float cancel and signup buttons and add an equal width */
.cancelbtn,.signupbtn {
float:left;
width:100%;
margin: 20px 0px 10px 0px;
}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 9999; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.75); /* Black w/ opacity */
padding-top: 60px;
overflow-y: auto;
}
/* Add padding to container elements */
.modalContainer {
padding: 60px 40px 30px 40px;
margin: 0px auto;
max-width:460px;
}
/* Used for second HubSpot modal event handler */
.modalContainer2 {
padding: 60px 40px 30px 40px;
margin: 0px auto;
max-width:460px;
}
/* Modal Content/Box */
.modal-content {
display: block;
background-color: #fefefe;
margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
width: 60%; /* Could be more or less, depending on screen size */
max-width: 600px;
min-width: 400px;
animation-name: slideDown;
animation-duration: 1s;
position: relative;
-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 1s; /* Firefox < 16 */
-ms-animation: fadein 1s; /* Internet Explorer */
-o-animation: fadein 1s; /* Opera < 12.1 */
animation: fadein 1s;
}
.hs-form-iframe {
margin: 0px auto;
}
/*MAILCHIMP FORM OVERRIDES*/
#mc_embed_signup {
background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
#mc_embed_signup .buttonPopup{
margin: 0px;
padding: 0px;
width: 100%;
background-color: #009fcd;
border: 4px solid #009fcd;
color: #FFFFFF;
border-radius: 0px;
-webkit-border-radius: 0px;
height: 50px;
font-weight: 300;
font-size:16px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
display: block;
}
#mc_embed_signup .buttonPopup:hover {
background-color: rgba(255,255,255,.3);
color: #009fcd;
border: 4px solid #009FCD;
}
@keyframes fadein {
from { opacity: 0; top: -50px;}
to { opacity: 1; top: 0px;}
}
}
.modal-content label {
font-family: "Open Sans", "Helvetica Neue", Helvetica, "Nimbus-Sans", sans-serif;
}
/* The Close Button (x) */
.close {
position: absolute;
right: 25px;
top: 15px;
color: #009fcd;
color: #DDD;
font-size: 40px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: red;
cursor: pointer;
}
/* Clear floats */
.clearfix::after {
content: "";
clear: both;
display: table;
}
/* Change styles for cancel button and signup button on extra small screens */
@media screen and (max-width: 300px) {
.cancelbtn, .signupbtn {
width: 100%;
}
}
/*NEW MENU 2018*/
/*custom menu items*/
.menuTopic {
font-family: Montserrat, "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
font-weight: 600;
text-transform: uppercase;
text-align: center;
padding: 24px 16px;
text-decoration: none;
font-size: 14px;
color: rgba(0, 159, 205, 1);
border-bottom: 1px solid #EEEEEE;
}
#logo {
background-image: url(../images/SIT-logo.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 8px 4% 0px 4%;
width: 40px;
height: 30px;
text-decoration: none;
transition: all 200ms ease-in-out;
}
/*Menu*/
.topnav {
overflow: hidden;
background-color: #EFEFEF;
font-family: Montserrat, "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
box-sizing: border-box;
z-index: 10;
}
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 16px;
}
.active {
background-color: #009FCD;
color: white;
}
/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
display: none;
color: #333333;
}
/* Dropdown container - needed to position the dropdown content */
.dropdown {
float: left;
overflow: hidden;
box-sizing: border-box;
z-index: 11;
}
/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
font-size: 14px;
border: none;
outline: none;
color: #333333;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
font-weight: 500;
width: auto;
box-sizing: border-box;
height: 46px;
transition: 100ms ease-in-out;
-webkit-transition: 100ms ease-in-out;
-moz-transition: 100ms ease-in-out;
}
.dropdown .dropbtn:hover {
border-bottom: 4px solid #00EA7B;
}
.dropdown-content {
display: none;
position: absolute;
background-color: rgba(255,255,255, .96);
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 10;
transition: all 200ms ease-in-out;
-webkit-transition: all 200ms ease-in-out;
width: 100%;
left: 0px;
padding-bottom: 30px;
}
.splitItUp /*3 col.*/ {
width: 33%;
display: inline-block;
box-sizing: border-box;
vertical-align: top;
padding-right: 20px;
padding-left: 20px;
}
.dropdown .dropbtn #searchBar:hover {
}
/* GOOGLE SEARCH */
#searchBar {
margin: 0px 0px 0px 0px;
width: 100px;
height: 30px;
font-size: 14px;
font-family: "Montserrat", "Open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
padding: 0px 10px 0px 10px;
border-radius: 2px;
-webkit-border-radius: 6px;
-moz-border-radius: 2px;
border-style: none;
border: 2px solid #E4EAEE;
background-color: rgba(255,255,255,.7);
display: block;
float: left;
transition: width 500ms;
-webkit-transition: width 500ms;
box-sizing: border-box;
position: relative;
top: -6px;
}
input#searchBar::placeholder {
color: rgba(51,51,51,.2);
}
#searchBar:focus {
outline: none;
box-shadow: 0px 8px 16px rgba(0,234,123,.3);
background-color: rgba(255,255,255,.9);
position: absolute;
top: 46px;
left: 0;
height: 595px;
z-index: 12;
width: 100%;
color: rgba(51,51,51,1);
text-align: center;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
font-family: "Montserrat", "Open Sans", Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 48px;
padding: 0px 10%;
font-weight: 600;
}
#searchBar:focus::placeholder {
color: rgba(0, 159, 205, 1);
}
@media screen and (max-width: 600px) {
#searchBar {
width: 100%;
}
#searchBar:focus {
font-size: 26px;
height: 100%;
position: fixed;
}
}
@media screen and (max-width: 960px) /* Two Col.*/ {
.splitItUp {
width: 49%;
}
}
.dropdown-content a {
float: none;
color: #666666;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
box-sizing: border-box;
height: 35px;
font-size: 13px;
transition: color 100ms ease-in-out;
-webkit-transition: color 100ms ease-in-out;
}
@media screen and (max-width: 600px) {
.dropdown-content a {
font-size: 16px;
}
}
.topnav a:hover, .dropdown:hover .dropbtn {
/*background-color: pink;*/
color: #009FCD;
}
.dropdown-content a:hover {
color: #00EA7B;
}
.dropdown:hover .dropdown-content { /*HIDES DD*/
display: block;/*block*/
}
@media screen and (max-width: 600px) {
.topnav a:not(:first-child), .dropdown .dropbtn {
display: none;/*none*/
}
.topnav a.icon {
float: right;
display: block;
}
}
@media screen and (max-width: 600px) {
.topnav.responsive {
position: relative;
}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
.topnav.responsive .dropdown {
float: none;
}
.topnav.responsive .dropdown-content {
position: relative;
}
.topnav.responsive .dropdown .dropbtn {
display: block;
width: 100%;
text-align: left;
}
}
@media screen and (max-width: 600px) {
.menuTopic {
font-size: 16px;
}
.splitItUp {
width: 100%;
}
}
#newHeader {
display: none;
}
/* MEDIA QUERIES for < 960px */
@media screen and (max-width: 960px) {
.oneHundredPercent {
min-width: 0px;
box-sizing: border-box;
}
.oneHundredPercentSuccess, .oneHundredPercentSupport {
min-width: 0px;
box-sizing: border-box;
}
.whitePatternBG {
min-width: 0px;
width: 100%;
object-fit: cover;
background-position: center;
}
.whiteBackground {
width: 100%;
min-width: 0px;
}
.container {
width: 100%;
box-sizing: border-box;
max-width: 1170px;
overflow: auto;
min-width: 0px;
margin: 0px;
padding:0px;
}
nav.choiceNav{
width: 100%;
box-sizing: border-box;
margin: 0px;
padding: 0px;
display: block;
}
.choiceThird {
width: 80%;
margin: 20px auto;
box-sizing: border-box;
display: block;
}
.choiceThird .choiceImg {
max-width: 400px;
margin: 40px auto;
display: block;
}
.choiceThird .choiceDescription {
font-size: 16px;
font-family: "montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
max-width: 400px;
margin: 0px auto;
padding-left: 5%;
padding-right: 5%
}
.block960 {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.block960Container {
min-width: 0px;
padding: 0px;
width: 100%;
box-sizing: border-box;
}
.fullWidthContainer {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.section960 {
min-width: 0px;
width: 100%;
box-sizing: border-box;
overflow: hidden;
}
.section960Two {
min-width: 0px;
width: 100%;
box-sizing: border-box;
padding-left: 0px;
margin-left: 0px;
}
.section960Grey {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.greyBackground {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.section960Two{
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.largeVideo {
min-width: 0px;
width: 100%;
}
.successStrip {
width: 100%;
min-width: 0px;
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
-webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
.sectionSupport {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.supportIntro {
min-width: 0px;
width: 100%;
box-sizing: border-box;
}
.blockSupportLeft {
width: 100%;
min-width: 0px;
box-sizing: border-box;
margin: 0px;
padding: 0px 0px 15px 0px;
border-right: 0px;
height: auto;
}
.blockSupportRight {
width: 100%;
min-width: 0px;
max-width: none;
}
.blockSupportRight p.normal {
margin-bottom: 25px;
color: #333333;
font-weight: 300;
font-size: 18px;
}
.blockSupportRight p.normal a.goblue {
color: #333333;
}
.sectionSupport ul.navigationList {
width: 100%;
margin: 0px auto;
padding: 40px 5%;
}
.sectionSupport ul.navigationList li a.goblue {
color: #333333;
font-weight: 500;
font-size: 16px;
width: 90%;
display: block;
height: 60px;
padding: 15px;
border: 4px solid #FFFFFF;
box-sizing: border-box;
box-shadow: none;
-webkit-box-shadow: none;
transition: all 100ms ease-in-out;
-webkit-transition: all 100ms ease-in-out;
max-width: 400px;
margin: 0 auto;
}
.sectionSupport ul.navigationList li a.goblue:hover {
background-color: #10284d;
color: #FFFFFF;
}
.blockSupportRight {
width: 100%;
min-width: 0px;
background-color: #EFEFEF;
height: auto;
}
.transHeading {
width: 100%;
min-width: 0px;}
.block940Header {
width: 100%;
max-width: 620px;
box-sizing: border-box;
}
.block940Header h1.normal, .block940Header p.center {
text-align: left;
margin: 0px 5%;
}
/*paragraphs*/
p, p.normal, p.center, p.h3normal, p.managementTeam {
font-size: 16px;
margin-left: 5%;
margin-right: 5%;
text-align: left;
max-width: none;
padding-left: 0px;
padding-right: 0px;
}
h1.normal, h1.successStory, h1.mainTitle, h1.center {
max-width: 90%;
font-size: 38px;
}
h2, h2.wsj, h2.architecture {
font-size: 24px;
}
.block940 {
width: 100%;
min-width: 0px;
box-sizing: border-box;
}
.block700 {
width: 100%;
min-width: 0px;
box-sizing: border-box;
}
.block700News {
width: 100%;
min-width: 0px;
box-sizing: border-box;
padding-bottom: 150px;
}
.block700News .calendar {
width: 100%;
margin: 0 auto 0px auto;
background-position: center;
background-size: contain;
display: none;
}
.block700News h1.normal {
margin: 100px 5% 30px 5%;
color:#009fcd;
}
.block700News h2.wsj {
margin: 60px 5% 10px 5%;
}
.block700News p.normal {
margin: 0px 5% 20px 5%;
}
.block700News iframe {
width: 90%;
margin: 0px auto;
display: block;
float: none;
box-sizing: border-box;
}
.block700News img {
width: 90%;
}
.block620 {
width: 100%;
padding-bottom: 100px;
min-width: auto;
max-width: auto;
}
.block620 .managementTeam {
width: auto;
margin: 0px 5%;
}
.block620News {
width: auto;
}
.block540 {
width: 100%;
margin: 0px;
box-sizing: border-box;
}
.block380 {
width: 90%;
margin: 0px;
box-sizing: border-box;
margin: 0px auto;
}
.block300 {
width: 100%;
margin: 20px 0px;
box-sizing: border-box;
padding:0px;
}
.block300 h3.smallCaps {
margin: 0px 5%;
padding: 0px 0px 15px 0px;
}
.block300 p.h3normal {
margin: 0px 5%;
padding: 0px 0px 15px 0px;
}
.contactForm {
width: 80%;
}
.youTubeVideo {
width: 100%;
display: block;
margin: 0px auto;
padding: 0px;
box-sizing: border-box;
margin: 20px 0px 50px 0px;
}
.googleMap {
width: 90%;
margin: 50px auto 0px auto;
display: block;
}
img.management {
margin: 20px auto 30px auto;
float: none;
width: 40%;
max-width: 200px;
}
.halfWidthBlackL {
width: 100%;
padding: 100px 0px 100px 0px;
box-sizing: border-box;
min-height: 0px;
height: auto;
background-image: url(../banking_software/images/geo-man.png);
background-size: 50%;
background-repeat: no-repeat;
min-width: 0px;
}
.halfWidthBlackR {
width: 100%;
padding: 0px 0px 100px 0px;
box-sizing: border-box;
min-height: 0px;
height: auto;
min-width: 0px;
}
.halfWidthBlackR img {
max-height: 500px;
max-width: 600px;
object-fit: cover;
display: block;
padding: 10px 4%;
object-position: 50% 50%;
box-sizing: border-box;
min-height: 0px;
min-width: 0px;
}
.halfWidthGreyL {
width: 100%;
padding: 100px 0px 20px 0px;
box-sizing: border-box;
min-width: 0px;
height: auto;
}
.halfWidthGreyR {
width: 100%;
padding: 100px 0px 80px 0px;
box-sizing: border-box;
min-width: 0px;
height: auto;
}
.halfWidthGreyL p.normal {
margin: 0px auto;
float: none;
}
.halfWidthGreyR p.normal {
margin: 0px 4%;
float: none;
}
.halfWidthGreyR h2.wsj {
margin: 0px 4%;
float: none;
}
.block620 {
width: 100%;
min-width: 0px;
padding: 0px;
margin: 0px;
box-sizing: border-box;
}
.block620Read {
width: 100%;
min-width: 0px;
padding: 0px;
margin: 0px;
box-sizing: border-box;
}
.block620Read h2.wsj {
margin-top: 60px;
}
.block540 img {
width: 70%;
margin: 20px auto 50px auto;
float: none;
padding; 10%;
display: block;
box-sizing: border-box;
max-height: 500px;
object-fit: cover;
}
.block540 p.normal {
margin-left: 5%;
margin-right: 5%;
}
.block380 p.normal {
margin-left: 5%;
margin-right: 5%;
}
.block460L {
width: 100%;
min-width: 0px;
box-sizing: border-box;
}
.block460R {
width: 100%;
min-width: 0px;
box-sizing: border-box;
}
.block460R h2.wsj, .block460R h3.smallCaps, .block460R p.h3normal {
padding-left: 0px;
margin: 0px 5%;
}
.block460L h2.wsj, .block460L h3.smallCaps, .block460L p.h3normal {
padding-left: 0px;
margin: 0px 5%;
}
.block460R p.normal {
padding: 0px;
}
.blockQuote {
width: 100%;
min-width: 0px;
}
h2.wsj {
margin-left: 5%;
margin-right: 5%;
}
h3.smallCaps {
margin-left: 5%;
margin-right: 5%;
padding-left: 0px;
}
.halfWidthBlackL h2.architecture, .halfWidthBlackR h2.architecture, .halfWidthBlackL p.normal,
.halfWidthGreyR h2.wsj,
.halfWidthGreyL h2.wsj,
.halfWidthGreyR p.normal,
.halfWidthGreyL p.normal,
.halfWidthGreyL h2.architecture,
.halfWidthGreyR h2.architecture,
.halfWidthBlackL h2.wsj,
.halfWidthBlackR h2.wsj{
padding: 0px 0px;
margin: 0px 5% 15px 5%;
float: none;
box-sizing: border-box;
width: auto;
}
.halfWidthGreyR img.diagram {
max-width: 500px;
object-fit: cover;
display: block;
padding: 10px 4%;
object-position: 50% 50%;
box-sizing: border-box;
min-height: 0px;
min-width: 0px;
}
.details960 {display: none;}
.divider {display: none;}
.divider2 {display: none;}
.brochureStrip3 {
width: 100%;
min-width: 0px;
box-sizing: border-box;
padding-top: 60px;
padding-bottom: 60px;
}
.brochureStrip3 p.normal {display: none !Important;}
button.contactButton {
width: 90% !important;
box-sizing: border-box;
margin: 0px auto 0px auto;
}
.contactButton {
width: 90%;
box-sizing: border-box;
margin: 0px auto;
float: none;
clear: both;
margin-bottom: 20px;
text-decoration: none;
}
.brochureStrip3 a {text-decoration: none;}
a.nothing {
text-decoration: none;
}
img.diagram {
margin: 0px auto 0px auto;
box-sizing: border-box;
width: 80%;
min-width: 0px;
max-width: 100%;
transform: none;
float: none;
}
h1.whiteHeading {
font-size: 48px;
line-height: 54px;
margin: 250px 4% 20px 4%;
text-align: center;
}
h1.heroHeading { /*same size as .whiteheading*/
font-size: 48px;
line-height: 54px;
margin: 250px 4% 20px 4%;
text-align: center;
}
h1.mainTitle {
font-size: 48px;
line-height: 54px;
}
p.feature {
font-size: 22px;
width: auto;
margin: 0px 4%;
float: none;
text-align: center;
}
p.quote {
font-size: 22px;
}
/*Handling Large Images*/
#insurance {display: none;}
#leader {
background-size: cover;
height: 400px;
width: 100%;
padding: 20px auto 100px auto;
float: none;
}
#interchange-2017 {
height: 100%;
object-fit: cover;
}
#medicalCollection {
height: 100%;
background-size: cover;
min-height: 100%;
background-position: 80%;
background-repeat: no-repeat;
}
.full { /*MAIN IMG*/
margin: 0px auto 0px auto;
height: auto;
min-height: 100%;
width: 100%;
min-width: 0px;
object-fit: cover;
overflow: auto;
object-position: 50%;
object-fit: cover;
}
}
/*Smallest Screen Sizes*/
@media screen and (max-width: 600px) {
h1.heroHeading {
font-size: 30px;
line-height: 36px;
padding: 0px 20px;
margin: 200px auto 30px auto;
}
h1.whiteHeading {
font-size: 38px;
line-height: 44px;
}
h1.mainTitle {
font-size: 36px;
}
h1.normal {
font-size: 28px;
width: auto;
}
h6.pageDesc {
font-size: 16px;
margin: 0px 5%;
float: none;
width: auto;
padding: 0px;
min-width: 0px;
text-align: center;
}
p.feature {
font-size: 18px;
}
}
/*End of Media Queries*/