@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,500);@import url(http://www.augustview.co.za/dfb.css);

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

a{
    text-decoration: none;
}

a:hover{
    text-decoration: none;
}

body{
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
}

body p{
    line-height: 24px;
}

.container{
    width: 980px;
    float: none;
    margin: 0 auto;
    padding: 0;
}

.contentHold{
    margin: 40px 0;
}

.contentHold > ul{
    margin-top: 30px;
}

.contentHold > ul li{
    margin-bottom: 8px;
}

.contentHold > ul li > ul{
    margin: 10px 0;
}

.contentHold > ul li > ul li{
    font-size: 14px;
}

.hrHold{
    height: 33px;
    position: relative;
    padding: 31px 0 0 0;
}

.hrHold span{
    display: block;
    width: 64px;
    height: 64px;
    background-repeat: no-repeat;
    background-color: transparent;
    background-position: 0;
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0 0 0 -32px;
}

hr{
    border: none;
    border-bottom: 1px solid #005c1a;
    border-top: 1px solid #005c1a;
    margin: 0;
}

#headerSpan{
    background-color: #e7e7e7;
}

.logoHold{
    float: left;
    margin: 15px 0 5px 0;
}

.logoHold .logo{
    height: 103px;
    width: 297px;
}

.socialNavHold{
    float: right;
    margin: 10px 0 0 0;
}

.socialNavHold ul{
    margin: 0;
}

.socialNavHold ul li{
    display: inline-block
}

.socialNavHold ul li a{
    display: block;
    width: 23px;
    height: 23px;
    text-indent: -9999px;
    background-color: transparent;
    background-position: left top;
    background-repeat: no-repeat;
    margin: 0 4px;
}

.socialNavHold ul li a:hover{
    background-position: left bottom;
}

.socialNavHold ul li a.fb{
    background-image: url('../img/ico-fb.png');
}

.socialNavHold ul li a.tw{
    background-image: url('../img/ico-tw.png');
}

.socialNavHold ul li a.rss{
    background-image: url('../img/ico-rss.png');
}

.socialNavHold ul li a.em{
    background-image: url('../img/ico-mail.png');
}

.mainav{
    float: right;
    clear: right;
    margin: 25px 0 0 0;
}

.mainav ul{
    margin: 0;
    padding: 0;
}

.mainav ul li{
    display: inline-block;
    position: relative;
}

.mainav ul li a{
    display: block;
    color: #000066;
    margin: 0 5px;
    line-height: 18px;
    padding: 16px 18px 35px;
    -webkit-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
    -webkit-transition: background 300ms ease;
    -moz-transition: background 300ms ease;
    -ms-transition: background 300ms ease;
    -o-transition: background 300ms ease;
    transition: background 300ms ease;
    background-color: #e7e7e7;
    min-height: 18px;
}

.mainav ul li a:hover{
    background-color: #ddd;
}

.mainav ul li a.active{
    color: #e7e7e7;
    background-color: #262626;
    cursor: default;
}

.mainav ul li > ul{
    display: none;  
    position: absolute;
    background-color: #e7e7e7;
    z-index: 10;
    padding: 10px;
    margin: 0;
    min-width: 200px;
}

.mainav ul li > ul li{
    display: block;
    float: none;
    width: auto;
}

.mainav ul li > ul li a{
    width: auto;
    display: block;
    float: none;
    margin: 0;
    background-image: url('../img/ico-subnav-arr.png');
    background-position: 15px center;
    background-repeat: no-repeat;
    padding: 8px 5px 8px 25px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

#bannerSpan{
    border: none;
    border-top: 5px solid #292929;
    background: #2666bc;
    border-bottom: 5px solid #000066;
    padding: 30px 0 0 0;
}

.bannerHold{
    position: relative;
    margin: 0 auto;
    padding: 7px;
    background-color: #fff;
    width: 829px;
    bottom: -30px;
    -webkit-box-shadow:  0px 0px 1px 0px #333;
    box-shadow:  0px 0px 1px 0px #333;
}

.bannerHold .sliderShad{
    position: absolute;
    bottom: -22px;
    left: 0;
}

.bannerHold img{
    display: block;
}

.innerPg #bannerSpan .welcomeMsg h1{
    margin: 0 0 5px 0;
    color: #f0f0f0;
}

.innerPg #bannerSpan .welcomeMsg p{
    text-align: left;
    color: #c2c8d8;
    font-size: 16px;
    font-style: italic;
}

.thumbsHold{
    margin: 55px 0 0 0;
}

.thumbsHold ul{
    margin: 0;
    padding: 0;
    text-align: center;
}

.thumbsHold ul li{
    display: inline-block;
    margin: 0 7px;
}

.thumbsHold ul li a{
    display: block;
    padding: 3px;
    border: 1px solid #ddd;
}

.thumbsHold ul li a.active{
    border: 1px solid #888;
}

.thumbsHold ul li a img{
    display: block;
}

.welcomeMsg{
    
}

h1{
    color: #000066;
    font-weight: 400;
    font-size: 36px;
}

#contentSpan h1{
    margin: 190px 0 10px;
    text-align: center;
}

.welcomeMsg p{
    margin: 0 0 20px 0;
    text-align: center;
    color: #333;
    font-size: 18px;
}

#contentSpan h2{
    text-align: center;
    font-size: 24px;
    margin: 20px 0;
    font-weight: 500;
}

#contentSpan.belowSlider .container{
    margin-top: 170px;
}

#contentSpan .columnsHold{
    margin: 40px 0 0 0;
}

.innerPg #contentSpan .columnsHold{
    margin: 65px 0 0 0;
}

#contentSpan .columnsHold .leftCol{
    width: 605px;
    float: left;
    margin: 20px 110px 80px 0;
}

#contentSpan .columnsHold .leftCol .leftColHold{
    background: #f0f0f0;
    -webkit-border-radius: 5px 5px 0px 5px;
    border-radius: 5px 5px 0px 5px;
    margin: 0;
    padding: 0 0 10px 0;
}

.innerPg #contentSpan .columnsHold .leftCol .leftColHold{
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

#contentSpan .columnsHold .leftCol .leftColHold h2{
    color: #000066;
    font-size: 24px;
    background: #d4d8e2;
    -webkit-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    padding: 10px 20px 10px;
    margin: 0;
    text-align: left;
    line-height: 30px;
}

#contentSpan .columnsHold .leftCol .leftColHold h3{
    margin: 30px 25px 15px 25px;
}

#contentSpan .columnsHold .leftCol .leftColHold ul{
    color: #3a3a3a;
    font-size: 14px;
    padding: 0;
    margin: 0px 25px 15px 50px;
}

#contentSpan .columnsHold .leftCol .leftColHold ul.firstli{
    margin-top: 30px;
}

#contentSpan .columnsHold .leftCol .leftColHold p{
    color: #3a3a3a;
    font-size: 14px;
    padding: 0;
    margin: 30px 25px 15px 25px;
    text-align: justify;
}

#contentSpan .columnsHold .leftCol .leftColHold img{
    margin: 30px 25px 25px 25px;
    float: left;
}

#contentSpan .columnsHold .leftCol .leftColHold img.imgLrg{
    margin: 0px 25px 15px 25px;
    float: none;
}

#contentSpan .columnsHold .leftCol .leftColHold img.imgLrg.imgTop{
    margin: 30px 25px 15px 25px;
}

#contentSpan .columnsHold .leftCol .leftColHold a.readmoAngl{
    display: block;
    float: right;
    color: #000066;
    text-transform: uppercase;
    background-color: #d4d8e2;
    background-image: url('../img/readmoArr.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    -webkit-border-radius: 5px 0px 0px 0px;
    border-radius: 5px 0px 0px 0px;
    padding: 8px 15px 8px 15px;
    -webkit-transition: background 300ms ease;
    -moz-transition: background 300ms ease;
    -ms-transition: background 300ms ease;
    -o-transition: background 300ms ease;
    transition: background 300ms ease;
}

#contentSpan .columnsHold .leftCol .leftColHold a.readmoAngl:hover{
    background-color: #c2c8d8;
}

#contentSpan .columnsHold .rightCol{
    width: 265px;
    float: left;
    margin: 20px 0 0 0;
}

#contentSpan .columnsHold .rightCol .rightColHold{
    background: #f0f0f0;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    position: relative;
    padding: 55px 0 20px 0;
    margin: 0 0 60px 0;
}

#contentSpan .columnsHold .rightCol .rightColHold h4{
    margin: 0;
    padding: 0 0 15px 0;
    text-align: center;
    font-size: 24px;
    color: #000066;
    font-weight: 400;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold{
    -webkit-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    margin: 0 0 100px 0;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider{
    margin: 0 20px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider ul li{
    font-size: 14px;
    text-align: center;
    color: #3a3a3a;
    line-height: 22px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider ul li span.testimCredit{
    display: block;
    color: #6578aa;
    border-top: 1px solid #d4d8e2;
    margin: 13px 0 0 0;
    line-height: 18px;
    padding: 5px 0 0 0;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-control-nav{
    bottom: -38px;
    left: 0;
    padding: 12px 0 5px 0;
    background: #d4d8e2;
    -webkit-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-direction-nav a{
    height: 15px;
    width: 13px;
    top: auto;
    bottom: -27px;
    margin: 0;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-direction-nav a.flex-prev{
    background: url(../img/ico-testim-prev.png);
    left: 15px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-direction-nav a.flex-next{
    background: url(../img/ico-testim-next.png);
    right: 15px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-control-paging li a{
    width: 12px;
    height: 12px;
    background: #6578aa;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-control-paging li a.flex-active{
    background: #000066;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-control-paging li a:hover{
    background: #777;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold #testimSlider .flex-control-paging li a.flex-active:hover{
    background: #000066;
}

#contentSpan .columnsHold .rightCol .rightColHold .rightColHold-ico{
    background-color: transparent;
    background-position: 0;
    background-repeat: no-repeat;
    width: 65px;
    height: 65px;
    position: absolute;
    top: -21px;
    left: 50%;
    margin: 0 0 0 -33px;
}

#contentSpan .columnsHold .rightCol .rightColHold.testimHold .rightColHold-ico{
    background-image: url('../img/ico-testim.png');
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold .rightColHold-ico{
    background-image: url('../img/ico-cont.png');
}

.hrHold.hrLatestNews span{
    background-image: url('../img/ico-sat.png');
}

.hrHold.hrtestim span{
    background-image: url('../img/ico-spk.png');
}

.hrHold.hrLatestProj span{
    background-image: url('../img/ico-proj.png');
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul{
    margin: 0 25px;
    padding: 0;
    list-style: none;
    text-align: center;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li{
    margin: 0 0 20px 0;
}

.contli2, .contli3{
    border-top: 1px solid #ddd;
    padding: 15px 0 0 0;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li.contli3{
    margin: 0;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li p{
    font-size: 12px;
    color: #3a3a3a;
    line-height: 18px;
    margin: 0;
    font-weight: 700;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li p.contHeads{
    font-size: 14px;
    color: #3a3a3a;
    line-height: 18px;
    margin: 0 0 10px 0;
    font-weight: 700;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li p span{
    font-weight: 400;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li p a{
    font-weight: 400;
    color: #000066;
}

#contentSpan .columnsHold .rightCol .rightColHold.contHold #contactDets ul li p a:hover{
    font-weight: 400;
    color: #222;
    text-decoration: underline;
}

#footer{
    border: none;
    border-top: 3px solid #d4d8e2;
    background: #f0f0f0;
    border-bottom: 5px solid #fff;
    padding: 40px 0;
    text-align: center;
    position: relative;
}

#footer h2{
    color: #fff;
}

#footer .footerIcon{
    width: 74px;
    height: 64px;
    position: absolute;
    left: 50%;
    margin: 0 0 0 -37px;
    padding: 0;
    top: -32px;
}

#footer p{
    color: #fff;
}

#footer .footerIcon.footerIcon-hist{
    background-image: url('../img/ico-hist.png');
}

#footer .footerIcon.footerIcon-about{
    background-image: url('../img/ico-about.png');
}

#footer .footerIcon.footerIcon-anchor{
    background-image: url('../img/ico-anchor.png');
}

#footer .footerIcon.footerIcon-scrn{
    background-image: url('../img/ico-scrn.png');
}

#footer .footerIcon.footerIcon-route{
    background-image: url('../img/ico-route.png');
}

#footer .footerHold.servicesHold{
    
}

#footer .footerHold.servicesHold h3{
    color: #000066;
    margin: 10px 0 30px 0;
    text-align: center;
    font-size: 26px;
    font-weight: 400;
}

#footer .footerHold.servicesHold .servCol{
    float: left;
    width: 230px;
    height: auto;
    margin: 0 20px 0 0;
}

#footer .footerHold.servicesHold .servCol.servCol4{
    margin: 0;
}

#footer .footerHold.servicesHold .servCol a{
    display: block;
    border: 3px solid #d4d8e2;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background-color: #6578aa;
    background-repeat: no-repeat;
    background-position: 0 0;
    color: #f0f0f0;
    font-size: 20px;
    text-decoration: none;
    padding: 130px 0 18px 0;
    -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0);
    box-shadow: 3px 3px 3px 0 rgba(0,0,0,0);
}

#footer .footerHold.servicesHold .servCol.servCol1 a{
    background-image: url('../img/servPic1.jpg');
}

#footer .footerHold.servicesHold .servCol.servCol2 a{
    background-image: url('../img/servPic2.jpg');
}

#footer .footerHold.servicesHold .servCol.servCol3 a{
    background-image: url('../img/servPic3.jpg');
}

#footer .footerHold.servicesHold .servCol.servCol4 a{
    background-image: url('../img/servPic6.jpg');
}

#footer .footerHold.servicesHold .servCol a:hover{
    border: 3px solid #95a1bf;
    -webkit-box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.1);
    box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.1);
}

#bottomBar{
    background: #292929;
}

#bottomBar a{
    color: #888;
}

#bottomBar a:hover{
    color: #bbb;
}

#bottomBar p{
    color: #555;
    font-size: 12px;
    margin: 30px 0;
}

.copyright{
    float: left;
}

#bottomBar p.termsPriv{
    float: left;
    margin: 30px 0 30px 140px;
}

.credit{
    float: right;
}

.pgHeadHold{
    
}

.pgHeadHold h1{
    color: #e7e7e7;
}

.leftImg{
    float: left;
    margin: 0 30px 20px 0;
}

.leftImg img{
    display: block;
}

.formHold{
    width: 90%;
    margin: 0 5%;
    margin-top: 20px;
    padding-bottom: 30px;
}

.jotform-form .form-all{
    width: 100%;
}

.formHold .formRow{
    width: 97%;
    padding-bottom: 15px;
}

.formHold .formCol{
    width: 44%;
    margin-right: 5%;
    float: left;
    padding-bottom: 15px;
}

.formHold .formCol.formColR{
    width: 44%;
    margin-left: 5%;
    margin-right: 0%;
    float: left;
    padding-bottom: 5px;
}

.formHold input,.formHold select{
    padding: 2%;
    margin-bottom: 0;
}

.formHold input{
    width: 96%;
}

.formHold input, .formHold textarea{
    border: 1px solid #bbb
}

.formHold input#epi{
    width: 286px;
    margin: 0 auto;
    float: none;
    display: block;
    cursor: pointer;
}

.formHold select{
    width: 100%;
}

.formHold input#file{
    line-height: 1px;
}

.formHold #epicaptcha{
    margin: 10px auto 20px;
    padding: 10px 20px 0 20px;
    background: #fafafa;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    min-height: 90px;
}

.formHold input.btn-large{
    width: 210px;
    margin: 10px auto;
    display: block;
}

.formHold label{
    cursor: default; 
    line-height: 30px;
}

span.reqd{
    color: #c00;
    font-size: 18px;
}

.formHold label.error{
    display: block;
    color: #b94a48;
    font-size: 12px;
    margin: 0 0 0 4px;
    line-height: 20px;
    background: #f2dede;
    padding: 0 5px 2px 5px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.formHold textArea{
    width: 100%;
    resize: none;
    height: 90px;
}

.formHold #submit{
    width: 210px;
    margin: 20px auto;
    display: block;
    font-size: 25px;
}

.formHold #submit{
    width: 210px;
    margin: 20px 0;
    display: block;
    font-size: 18px;
    line-height: 24px;
}

.formHold .labelNote{
    color: #999;
    font-size: 12px;
    padding-left: 10px;
}

a.txtlink{
    color: #ff6c00;
    text-decoration: underline;
}

a.txtlink:hover{
    color: #333;
    text-decoration: none;
}

.tableHold .genTable{
    width: 100%;
    border: 1px solid #777;
    border-spacing: 0px;
}

.tableHold .genTable tr td{
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.tableHold .genTable tr td:last-child{
    border-right: none;
}

.tableHold .genTable tr:last-child td{
    border-bottom: none;
}

.tableHold .genTable tr:first-child td{
    border-bottom: 1px solid #ccc;
}