/*---------------------------------------------------------
    
    File: layout.css
    Description:
        * All generic styling for web based projects
        * For generic shop styling override with shop.css.
            
    Usage:
        * All generic styling should go here. Any bespoke 
        and shop styling should go into modules dir/ shop.css 
        respectfully.
        * Additional comment headers should be added for any 
        block sections. 
        
    --------------------------------------------------------- */    
    /* CONTENT 
    ---------------------------------------------------------
        TYPE
            - GENERICS
            - LINKS
        COLOUR
        LAYOUT
        FORM ELEMENTS
            - Form Parents
        MISC    
            - arrows
            - buttons
            - bullets
            - tables 
            - horizontal rules
            
        NON MODULATED SECTIONS
            - Contact Information
            - Article (Inner page content)
            - List items 
            - Breadcrumbs
            
        EXTRA INFO
            *classes
            header, body, footer
            row, column 
            label, content
            item, photo, title, description, link   
            
    -------------------------------------------------------- */ 
    /* TYPE

    Typography section below defines font-face styles and basic styles

    -------------------------------------------------------- */     
    
    /* GENERIC */
        body {
            /*overflow-x:hidden; */
        }   
        #container {
            
        }   
        #container-shadow {
              
        }
        h1, h2, h3, h4 {
            margin-bottom:10px;
        }   
        h1 {
            color: #000000;
            font-family: 'ClarendonBold',Arial,Helvetica,sans-serif;
			font-weight:normal;
            font-size: 18px;
            margin-bottom: 5px;
        }
        h2 {
            color: #000000;
            font-family: 'ClarendonBold',Arial,Helvetica,sans-serif;
			font-weight:normal;
            font-size: 16px;
            margin-bottom: 5px;
        }
        h3 {
            color: #000000;
            font-family: 'ClarendonBold',Arial,Helvetica,sans-serif;
			font-weight:normal;
            font-size: 12px;
            margin-bottom: 5px;
        }
        h4 {
            color: #000000;
            font-family: 'ClarendonBold',Arial,Helvetica,sans-serif;
			font-weight:normal;
            font-size: 11px;
            margin-bottom: 5px;
        }
        a, p, ul li {
            
        }   
        p {
            margin-bottom:10px;
        }  
        .summary-text {
            color:#FF6600;
        }
		.text-small {
			font-size:10px !important;			
		}
		
		
		 
    /* LINKS */   
        a {
            text-decoration:none;
            color:#FF6600;
            font-weight:bold;
        }
        a:hover {
            text-decoration:underline;   
        }
		
		a.linkgreen {
			color:#95C94C !important;			
		}
		a.linkgreen:hover {
			
		}

    /* COLOUR
    -------------------------------------------------------- */     
        .highlight {
            color:#FF6600;
        }
        
        .purple {
            color:#7F2E77;
        }       
        .green {
            color:#44B5AE;
        }   
        .red {
            color:#ED1C24;
        }   
        bg.green{
            background-color:#44B5AE;
        }
        .bg-purple {
            background-color:#7F2E77;
        }   
        .bg-purple, 
        .bg-green {
            color:#FFFFFF;
        }
    
    /* LAYOUT
    -------------------------------------------------------------- */           
        #header {
            margin-top:20px;
        }    
        #body {
        }    
        #footer {
            background: #000000;
        }

        .header {
        }
        .body {
        }
        .footer {
            
        }

    /* FORM ELEMENTS
    ----------------------------------------------------------- */
    
        .formbox label {
            margin-right:10px;
        }
        
        .formbox fieldset {
            border-radius: 3px 3px 3px 3px;
            border: 1px solid #DDDDDD;
            padding:8px;
        }
        
        .formbox .error-form-field,
        .formbox .note-form-field {
            display:block;
            color:#FF6600;
        }
        
        .formbox input,
        .formbox textarea,
        .formbox select, 
        .formbox option {
    
        }
        .formbox .textbox,
        .formbox textarea,
        .formbox select {
            background-color:#e4e4e4;color:#000000;
            width:190px;height:18px;padding:5px;
            font-size:12px;font-family:Arial, Helvetica, sans-serif;    
            border:none;    
        
        }
        .formbox select {
            width:200px;
        }       
        
        .formbox textarea {
            height:125px;       
            width:275px;    
        }
        .formbox .button {
            height:20px;width:16px;
            background:url(../images/buttons/right-arrow-orange.png) no-repeat right 4px;   
            cursor:pointer !important;
            vertical-align:middle;  
            border:none;        
        }       
        .formbox select {
            height:24px;
            padding:5px;
        }
        .formbox option {
            height:14px;padding:3px;
        }
        
        .formbox .checkbox,
        .formbox .optionbutton {
            margin-right:10px;
        }
        .formbox .checkbox {
        
        }
        .formbox .optionbutton {
        
        }
        
        /*
        .formbox .alert-box {
            position:relative;
            background-color: #FF6600;
            color: #FFFFFF;
            text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
            border: 1px solid rgba(0, 0, 0, 0.1);
            border-radius: 3px 3px 3px 3px;
            display: block;
            font-size: 13px;
            font-weight: bold;
            margin-bottom: 12px;
            padding: 6px 7px;
        }
        
        .formbox .alert-box .close {
            position:absolute;
            top:0px;
            right:0px;
            margin-right:5px;
            color:#000000;
            opacity: 0.2;   
        }       
        
        .formbox .alert-box a.close:hover {
            opacity:0.4;    
            text-decoration:none;   
        }
        */
        
        .formbox #top-level-error .body {
            color:#FF6600;  
            font-weight:bold;
        }
        
        
        /* FORM LAYOUT */       
        .formbox .form-row {
            float:left;
            clear:both;
            margin-bottom:10px;
            width:576px; 
            
        }
        .formbox .form-label {
            float:left;
            width:80px;
            padding:4px 5px 0 0;
        }
        .formbox .form-field {
            float:left;
        }
        
        
        /* FIELDSETS */
        
        fieldset {
            margin-bottom:10px; 
        }
        
        legend {
            color: #4D4D4D; 
        }
        
        .formbox h5{
            color:#FF6600;
        }

        
        /* FORM PARENTS */  
        #form-registration.formbox {
        
        }           
        /* // FORM PARENTS */
        
        /* Overrides */
        #search-box.formbox .textbox {
            width:110px;
            margin-right:7px;
            vertical-align:middle;
        }
        #search-box.formbox {
            width:280px !important;
        }
        
        /* Custom form element override styling */  
                
    
    /* MISC
    -------------------------------------------------------- */ 
    
    /* ARROW/ BUTTONS */    
        .arrow-right {
            background:url(../images/arrows/arrow-right-small.png) no-repeat right center;
            padding-right:10px;
            display:inline-block;
        }
        .arrow-left {
            background:url(../images/arrows/arrow-left-small.png) no-repeat left center;
            padding-left:10px;
        }
        .button-right,
        .button-left {
            padding:3px 0;
        }       
        .button-right {
            background:url(../images/buttons/right-arrow-orange.png) no-repeat right center;
            padding-right:25px;
        }
        .button-left {
            background:url(../images/buttons/left-arrow-orange.png) no-repeat left center;
            padding-left:25px;  
        }

        /* NEW BUTTONS */
        .button-oval {      
            background-color: #E4E4E4;
            width: auto;
            border-radius: 3px 3px 3px 3px;
        }
        
        .button-oval.large {
            font-size: 18px;
            padding: 11px 48px 11px 11px;   
        }
        
        .button-oval.medium {
            font-size:14px;
            padding: 7px 40px 7px 7px;      
        }
    
        /* BULLETS */
        ul {

        }   
        ul li {
            background:url(../images/bullets/bullet-green.png) no-repeat left center; 
            padding-left:10px;
        }   
    
        /* TABLES */    
        table {}
        table tr {}
        table th {
            padding:5px;
            background-color: #E4E4E4;
            color:#666666;
        }
        table td {
            padding:5px;    
        }
        
        /* HORIZONTAL RULES */  
        .hr-rule {
            background-color:#CCCCCC;
            height:1px;
            margin:10px 0;
            clear:both;
        }
		
		
		.hide-accessible {
 			text-indent: 100%;
			white-space: nowrap;
 			overflow: hidden;
			width:0;
			height:0;
 		}
		
		.no-margin-top {
			margin-top:0 !important;			
		}
		
		.float-left {
			float:left;			
		}
		
		.float-right {
			float:right;				
		}
		
		#container.centre .column {
			/* min-height:100px; */			
		}
    
    /* NON MODULATED SECTIONS
    -------------------------------------------------------------- */
        #logo {
        }
        #contact-info {
            width:288px;
            float:left;
        }   
        #contact-info .row {
            margin-bottom:0;        
        }
        #contact-info .row .label,
        #contact-info .row .content {
            float:left;
        }       
        #contact-info .row .label {
            width:50px; 
        }   
        #contact-info .row .content {
        }
        #contact-info a {
            color:#666666;
            font-weight:normal;
        }   

    /* Article elements */  
        
    
        #article .photo {
            float:right;
            width:200px;
            margin:0 0 10px 10px;
        }
        #article .photo img,
        #article .photo p {
            float:right;clear:both;
            width:200px;padding-bottom:10px;
            font-style:italic;
        }
        
    /* Item listing */
        #list-items { width:768px; }
        #list-items .item {
            float:left;
            clear:both;
            padding-top:10px;
            width:768px;
        }
        #list-items .title,
        #list-items .description {
            float:left;
            width:645px;
        }
        #list-items .photo {
            float:right;
        }       
        #list-items .footer {
            border-bottom:1px solid #CCCCCC;
        }
        #list-items .item .footer {
            height:10px;
        }
        
    /* Breadcrumbs */
    
        ul.breadcrumbs {}       
        ul.breadcrumbs li {
            float:left;
            background-image:none;
            padding-left:0px;
            padding-right:5px;
        }       
        ul.breadcrumbs li,
        ul.breadcrumbs li a {
            color:#666666;
        }       
        ul.breadcrumbs li.active a {
            color:#FF6600;
        }
        
        #add-to-favs {
            display:block;
            padding-left:10px;  
            margin-top:10px;
            font-weight:normal;
        }
    

        
    /* -----------------------------------*/
    /* -------## Font Structure ##--------*/
    /* -----------------------------------*/

    /* Font Generics 
    -------------------------------------------------------------------- */ 
    body {
        font-family:Arial, Helvetica, sans-serif;
        font-size:12px;
        color:#666666;
    }
    
    a {
        color:#666666;
    }
    
    a:hover {
        text-decoration:underline;
    }   
        
    
        
    /* Font Replacement 
    -------------------------------------------------------------------- */ 



    /* RESETS 
    -------------------------------------------------------------------- */

        #top-nav ul li li a {
            font-size:12px;
            font-family:Arial, Helvetica, sans-serif !important;
        }
        


    
    /* Font Face Implementation 
    -------------------------------------------------------------------- */
     @font-face {
         font-family: 'ClarendonBold';
         src: url('../font/clarendonbold/clarendonbold.eot');
         src: url('../font/clarendonbold/clarendonbold.eot?#iefix') format('embedded-opentype'),
         url('../font/clarendonbold/clarendonbold.woff') format('woff'),
         url('../font/clarendonbold/clarendonbold.ttf') format('truetype'),
         url('../font/clarendonbold/clarendonbold.svg#wf') format('svg');

     }
/* 
.is_firefox body {
    background-color:Red !important;    
}

.is_ie.browser_ver_9-0 body {
    background-color:orange !important; 
}

.browser_ver_8-0 body {
    background-color:green !important;  
}

.is_ie.browser_ver_7-0 body {
    background-color:yellow !important; 
}

.is_safari body {
    background-color:pink !important;   
}

.is_chrome body{
    background-color:purple !important; 
}

.is_mac.is_safari body { 
        
}

.is_mac.is_firefox body { 
    background-color:blue !important;       
}

.is_ios.browser_ver_5-1 body {
    background-image: -webkit-linear-gradient(top, #FF6600 30%, #FFAF7A 80%) !important;
}

.is_ios.browser_ver_5-0-2 body {
    background-image: -webkit-linear-gradient(top, #FF6600 30%, #FFAF7A 80%) !important; 
}

.is_ios.plat_ver_4 body {
    background-color:#00ffff !important;
}

.is_ios.plat_ver_5 body {
    background-image:none !important;
    background-color:grey !important;   
}
*/

    .sitemaplist li {
        padding: 10px 12px;
    }

    .spriteimage { background: url('../images/websprite.png') no-repeat; }


    .sprite-bopplogo{ background-position: 0px 0px; width: 214px; height: 163px; float: right; }
    .sprite-searchbutton{ background-position: -216px -0px; width: 17px; height: 15px; float: right; position: relative; top: 3px; right: 4px;}
    .sprite-nosort {background-position: -232px -0px; width: 29px; height: 14px; float: right;}
    .sprite-nosort.lastheader {background-position: -232px -0px; width: 27px !important; height: 14px; float: right;}
    .sprite-nosort.sortedup {background-position: -262px -0px; width: 29px; height: 14px; float: right;}
    .sprite-nosort.sorteddown {background-position: -292px -0px; width: 29px; height: 14px; float: right;}
    .sprite-greenarrow {background-position: -326px -3px; width: 7px; height: 10px; position: relative; top: 2px;}
    .sprite-linkedin {background-position: -216px -19px; width: 33px; height: 36px; float: left; margin-bottom: 5px;}
    .sprite-twitter {background-position: -249px -19px; width: 44px; height: 35px; float: left; margin-bottom: 5px;}
    .sprite-blog {background-position: -293px -19px; width: 55px; height: 35px; float: left; margin-bottom: 5px;}
    .sprite-bopp-email-reg {background-position: -215px -55px; width: 152px; height: 27px; padding: 0px 4px; color: #FFFFFF; font-size: 12px; border:  none; float: left; line-height:25px; }
    .sprite-bopp-email-reg-submit {background-position: -349px -23px; width: 28px; height: 27px; float: left;}
    .sprite-login {background-position: -216px -113px; width: 215px; height: 31px; float: left; margin-left: 10px;}
    .sprite-signup {background-position: -216px -82px; width: 215px; height: 31px; float: left; }
    .sprite-openquote {background-position: -340px 0px; width: 25px; height: 17px; margin-bottom: 3px;}
    .sprite-closequote {background-position: -368px 0px; width: 25px; height: 17px; margin-left: 5px; vertical-align: -50%; }
    .sprite-morebutton {background-position: -216px -145px; width: 53px; height: 19px; position: absolute; bottom: 5px; right: 5px;}
    .sprite-redarrow-large {background-position: -386px -50px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 18px;}
    .sprite-greenarrow-large {background-position: -386px -31px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 18px;}
 	.sprite-redarrow-up {background-position: -406px -31px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 0;}
	.sprite-redarrow-down {background-position: -386px -50px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 0;}
	.sprite-greenarrow-up {background-position: -386px -31px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 0;}
	.sprite-greenarrow-down {background-position: -406px -50px; width: 20px; height: 18px; position: relative; top: 3px; margin-left: 0;}

    #header-row {
        background-color: #01498e;
    }

    #header-section, #logo-section, #topnav-section {
        padding: 10px 60px 0px;
        margin-left: 0px;
        position: relative;
    }
    
    div.header-section-bopp {
        float:right;
    }

    #header-section p.normaltext {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 14px;
        color: #231F20;
    }

    #header-section p.logintext {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #FFFFFF;
        font-weight: bold;
    }

    #header-section p.logintext a {
        text-decoration: underline;
        color: #FFFFFF;
    }
    #header-section p.logintext a:hover {
        text-decoration: none;
    }

    #logo-section h1 {
        position:absolute;
        bottom:0;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:bold;
        font-size: 28px;
        line-height: 28px;
        color: #FFFFFF;
    }

    #logo-section a {
        float:right;
    }

    #logo-section a img {
        max-width:650px!important;
    }

    .left-text {
        float: left;
    }
    .right-text {
        float: right;
    }

    #searchbar {
        float: right;
        position: relative;
        width: 190px;
        background: #FFFFFF;
        border: none;
    }
    #search-box {
        border: none;
    }
    #searchbox {
        border: 0px;
        padding:3px;
        width: 160px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #01498e;
        float: left;
        height: 14px;

    }

    #client-section, #action-section, #client-section-dashboard, #generic-section {
        padding: 20px 60px 0px;
        margin-left: 0px;
    }
	
	#action-section {
		margin-bottom:15px;		
	}

    #client-section p, #action-section p, #client-section-dashboard p, #generic-section p  {
        padding: 5px 0px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #5C5C5C;
        margin-bottom: 0px;
    }

    #client-section h2, #action-section h2, #client-section-dashboard h2, #generic-section h2 {
        font-size: 19px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        color: #000000;
        margin: 25px 0px 20px;
        text-transform: uppercase;
    }

    #client-section-dashboard {
        background: url('../images/topsection-bg.jpg') repeat-x;
        width: 840px;
        height: 114px;
        padding-top: 15px;
        position: relative;
        margin-bottom: 15px;
    }

    #client-section-dashboard h2, #generic-section h2 {
        margin: 0px;
        padding-bottom: 5px;
    }
	
	#client_search input {
		border:solid 1px #ccc;
		padding:3px;				
	}
	
	#client_search input[type="submit"], #actions_export input[type="button"] {
		background-color: #6D6E71;
		padding:4px 10px 3px 10px;
		color:#fff;
		border:none;
		cursor:pointer;				
	}

    #generic-section {
        padding-top: 0px;
    }

    #generic-section h2 {
        margin-bottom: 10px;
        margin-top: 20px;
    }
	
	#generic-section p.success,
	#generic-section p.failure,
	#generic-section p.success-big {
		font-weight:bold;
		border:solid 2px #94c948;
		padding:10px;
		margin-bottom:12px;
    }

    #client-section-dashboard p {
        margin-bottom: 3px;
        padding:  0px;
    }

    .ct-header {
        padding: 4px 7px;
        background: #01498e;

        cursor: pointer;

    }

    .ct-header span {
        margin-bottom: 0px;
        float: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #FFFFFF;
        vertical-align: top;
        font-weight:bold;
    }

    .clientpagetable, .clientdetailstable {
        border-collapse:collapse;
        float: left;
        width: 840px;
    }
    #actions-table {
        width: 510px;
    }
    #actions-table .add {
		background-image: url("../images/table-button-bg.png");
		background-repeat:repeat-x;
		color:#fff !important;
		font-weight:normal;
		width:auto !important;
		display:block;
		padding:4px 10px 3px 10px;
	}
	
	input.generic-button {
		background-color:#6d6e71;
		padding:4px 10px 3px 10px;
		color:#fff;
		border:none;
		cursor:pointer;	
	}
	
	a.link-button {
		font-weight:normal;
		font-size:14px;
		color:#fff;
		background-color:#404145;
		padding:5px 12px 5px 12px;
	}
	
	a.link-button:hover {
		text-decoration:none;		
	}

	a.link-button.green {
		background-color:#94c948;		
	}
	
		
    #sales-driver-table {
        width: auto;
    }

    #value-per-licence {
        width: 840px;
    }

    #value-per-licence td {
		padding-left:3px;
		padding-right:3px;		
	}
	
    .clientpagetable td {
        padding:  4px 7px;
        font-size: 11px;
        border-bottom: 2px solid #FFFFFF;
        color: #000000;
    }

    .clientpagetable .companyname-column {
        width: 135px;
        padding-left: 20px;
    }

    .clientpagetable .action-column {
        /* width: 100px; */
		width:auto;
        max-width: 130px;
        padding-left: 10px;
    }

    .clientpagetable .goal-column {
        /* width: 180px; */
		width:auto;		
        padding-left: 20px;
    }

    .clientpagetable th {
        border-bottom:  4px solid #FFFFFF;
        vertical-align: top;
		text-align:left;
    }

    .clientpagetable tr {
        background: #cfe7fe;
    }


    .clientpagetable .ct-header.a-header {
        color: #FFFFFF;
       	padding:  4px 10px 3px;
        font-size: 13px;
        background: #404145;
        border-left: 4px solid #FFFFFF;
        width: 80px;
    }
    .clientpagetable .ct-header.a-header.last {
        background: #FFFFFF;
        width: 50px;
    }
    .clientpagetable#actions-table .ct-header.a-header.last {
        width: 30px;
		padding:0;
    }

    .clientpagetable .a-element {
        background: #6D6E71;
        color: #FFFFFF;
        padding:  4px 10px 3px;
        font-size: 13px;
        text-align: center;
        border-left: 4px solid #FFFFFF;
        cursor: pointer;
    }

    .clientpagetable .a-element.last {
        width: 50px;
    }

    .clientpagetable .a-element.actions {
        background: url('../images/table-button-bg.png') repeat-x #FFFFFF;
    }

    #actions-table .a-element {
        width: 30px;
    }

    .clientpagetable .a-element a {
        color: #FFFFFF;
        font-weight: normal;
        text-decoration: none;
    }

    .clientpagetable .a-element a:hover {
        text-decoration: underline;
    }

    .col1 {;
        padding-left: 20px;
    }


    .clientdetailstable tr {
        background: #E7E7E8;
        border-bottom:  2px solid #FFFFFF;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #231F20;
    }

    .clientdetailstable td {
        border-bottom: 2px solid #FFFFFF;
    }

    #newclientform .error-form-field, #emailaddressform .error-form-field, #contactform .error-form-field, #eventsform .error-form-field {
        /*display:none;*/
    }
	/*
    #newclientform .error, #emailaddressform .error {
        color: red;
    }
	*/
    #contactform .error, #eventsform .error {
        color: red;
        border: 1px solid red;
    }
    #top-level-error .form-row .body {
        color: red;
    }

    .clientdetailstable td span {
        float:left;
    }

    .bopp-textbox {
        margin-left: 5px;
        float: left;
        height: 16px;
        background: #E7E7E8;
        border: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
    }


    .admin-new-client {
        float: left;
        margin-top: 10px;
		margin-bottom:20px;
    }

    .admin-new-client p, .admin-new-client select {
        float: left;
        margin-right: 5px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px !important;
    }

    .admin-new-client select {
        width: 130px;
        border: 1px solid #C9C9CB;
        background: #FFFFFF;
        padding: 2px;
        font-size: 12px;
        color: #000000;
    }

    .admin-new-client p.status {
        margin-left: 20px;
    }

    .admin-new-client-submit {
        float: right;
        margin-top: 8px;
    }

    #client-section span.bopp-button {
        background: url('../images/boppbuttonbg.jpg') no-repeat;
        width: 92px;
        height: 22px;
        padding-top: 6px;
        text-align: center;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        position: relative;
        float: left;
        margin-right: 5px;
    }

    .save-button {
        background: url('../images/savebuttonbg.jpg') no-repeat;
        width: 92px;
        height: 28px;
        text-align: center;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        border:  none;
        cursor: pointer;
        overflow: visible;
    }

    .save-button-missing-info, .calculate-button-missing-info {
        background: url('../images/savebuttonbg.jpg') no-repeat;
        width: 50px;
        height: 21px;
        text-align: center;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        border:  none;
        cursor: pointer;
        overflow: visible;
    }
    
    .calculate-button-missing-info {
        width: 80px;
    }

    #generate-report-section {
        margin-left: 0px;
        background: #BBBDBE;
        height: 50px;
        margin-top: 20px;
        padding: 10px 60px 25px;
		color:#231F20;
    }

    #generate-report-section h2 {
        color: #000000;
        font-size: 19px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
    }

    #generate-report-section p, #generate-report-section select {
        float: left;
        margin-right: 10px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 13px !important;
    }
	
	.vert-align {
		vertical-align:middle;		
	}
	
	.shift4px {
		position:relative;
		top:4px;		
	}
	
	.ui-datepicker-trigger {
		vertical-align:middle;
		cursor:pointer;			
	}
	
	#generate-report-section input[type="text"] {
		padding:3px;
		margin-right:3px;
		font-size:14px;		
	}

    #generate-report-section p {
        margin-right: 15px;
        margin-top: 4px;
        color: #000000;
    }

    #generate-report-section select, #add-action-form select {
        width: 110px;
        border: 1px solid #C9C9CB;
        background: #FFFFFF;
        padding: 2px;
        font-size: 12px;
        color: #000000;
    }

    #generate-report-section .generate-button, #generate-report-section-bopp .generate-button {
        background: #404145;
        padding: 4px 15px;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        /* position: relative;
        top: 4px; */     
		margin-right: 10px;
    }
	
	#generate-report-section-bopp {
		clear:both;
		padding-top:10px;		
	}

    #footer-bar {
        padding: 10px 50px;
        margin-left: 0px;
    }

    .footer-col {
        width: 190px;
        border-right: 1px solid #676767;
        min-height: 170px;
        float: left;
        padding: 0px 15px 0px 10px;
    }

    .footer-col a {
        font-weight: normal;
        text-decoration: none;
    }
    .footer-col a:hover {
        text-decoration: underline;
    }

    .footer-col p {
        color: #FFFFFF;
        font-size: 12px;
        font-family: Arial, Helvetica, sans-serif;
    }

    .footer-col.first {
        width: 192px;
    }

    .footer-col.last {
        border: none;
        padding: 0px 0px 0px 10px;
        width: 200px;
    }

    .footer-col h2 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 16px;
        color: #FFFFFF;
    }

    .event {
        border-bottom: 1px solid #676767;
        margin: 10px 0 0;
        padding-bottom: 5px;
    }
    .event.last {
        border-bottom:  none;
    }
    .event p {
        margin-bottom: 2px;
        color: #95C94C;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
    }

    .footer-col ul {
        list-style-type: none;
    }
    .footer-col ul li {
        background:url('../images/bullets/bullet-green.png') no-repeat 0px 5px;
        padding: 2px 15px 5px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #FFFFFF;
    }

    .footer-col ul li a {
        color: #FFFFFF;
        font-weight: normal;
        text-decoration: none;
    }
    .footer-col ul li a:hover {
        text-decoration: underline;
    }


    #footer-credits {
        margin-left: 0px;
        padding: 10px 60px 0px;
    }

    #footer-credits p {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #FFFFFF;
    }


    /* FRONT END INDEX PAGE */

    #frontend-header-image {
        margin-left: 0px;
    }

    .boldtext {
        font-weight: bold;
    }

    .italics {
        font-style: italic;
    }

    .bigbopplogo {
        position: relative;
        right: 10px;
        z-index: 10;
    }

    #frontend-header-content {
        margin-left: 35px;
    }

    #frontend-header-text {
        margin-left: 35px;
    }

    #frontend-header-text ul {
        margin-top: 20px;
    }

    #frontend-header-text ul li {
         background: url("../images/bullets/bullet-green.png") no-repeat scroll 0 5px transparent;
        color: #231F20;
        font-family: Arial,Helvetica,sans-serif;
        font-size: 12px;
        padding: 2px 15px 5px;
    }

    #frontend-header-text h2 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;		
        font-size: 20px;
        color: #000000;
        margin-top: 30px;
        margin-left: 2px;
    }

    #frontend-header-text h1 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 52px;
        color: #000000;
        margin-top: 20px;
        line-height: 48px;
        margin-left: 2px;
        margin-top: 30px;
    }

    #frontend-header-text h1 .greentext {
        color: #01498e;
    }

    #frontend-header-text p {
        margin-top: 20px;
        font-size: 12px;
        font-family: Arial, Helvetica, sans-serif;
        color: #231F20;
        padding: 0px 3px;
    }

    #frontend-header-buttons {
        margin: 20px 0px 20px 35px;
    }

    #frontend-information {
        background: transparent;
        margin-left: 0px;
        z-index: 15;
        padding:  10px 0px 0px 60px;
        position: relative;
        bottom: 60px;
    }

    .sellingpoint, .testimonial-holder {
        width: 135px;
        border: 2px dotted #000000;
        float:left;
        margin-right: 15px;
        background: #FFFFFF;
        padding: 10px 15px;
        text-align: center;
        min-height: 235px;
    }

    .sellingpoint h2, .testimonial-holder h2 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 17px;
        color: #000000;
        line-height: 18px;
        text-align: left;
        min-height: 90px;
    }

    #altered-frontend-column {
        height: 215px;
    }


    .testimonial-holder {
        width: 314px;
        margin-right: 0px;
        text-align:left;
        position: relative;
    }

    .testimonial-holder h2 {
        padding-bottom: 5px;
        border-bottom:  1px dotted #01498e;
        min-height: 20px;
        margin-bottom: 0px;
    }

    .sellingpoint img {
		margin-top:20px;
    }

    .testimonial-holder p {
        margin-bottom: 0px;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
    }

    .testimonial-holder p.greentext {
        color: #01498e;
        font-weight: bold;
    }

    .testimonial {
        padding: 10px 0px;
        border-bottom:  1px dotted #01498e;
    }

    .testimonial.last {
        border:none;
    }

    /* Dashboard page */

    #client-section .dashboard-items {
        margin-bottom: 50px;
    }

    #client-section .dashboard-item {
		cursor:pointer;		
	}

	 #client-section .dashboard-item, .findoutmore-item {
        float: left;
        width: 152px;
        border: 2px dotted #000000;
        margin-right: 15px;
    }

    #client-section .dashboard-item.last {
        margin-right: 0px;
    }

    #client-section .dashboard-item-inner, .findoutmore-item-inner {
        margin: 5px;
        background: #01498e;
        padding:  5px;
    }

    #client-section .dashboard-item-inner.greybg {
        background: #9B9C9C;
    }

    #client-section .dashboard-item-inner h2, .findoutmore-item-inner h2 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 17px;
        color: #FFFFFF;
        margin: 0px;
        text-transform: none;
    }

    #client-section .dashboard-item-inner .dashboard-number {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 17px;
        color: #FFFFFF;
        padding:  0px;
    }

    #client-section .dashboard-item-inner a, .findoutmore-item-inner a {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #FFFFFF;
        text-decoration: none;
    }
    #client-section .dashboard-item-inner a:hover, .findoutmore-item-inner a:hover {

        text-decoration: underline;
    }

    #client-section .dashboard-benefits {
        margin: 10px 0px;
    }

    #client-section .dashboard-benefits li {
        background:  url("../images/bullets/bullet-green.png") no-repeat left center;
        padding-left: 10px;
    }


    /* Actions page */

    #add-action-section {
        margin-left: 10px;
        padding: 10px 60px 10px 10px;
    }

    #add-action-section h2 {
        font-size: 19px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        color: #000000;
        text-transform: uppercase;
        margin-top: 10px;
    }

    #add-action-form .form-row {
        width: 305px;
        margin-bottom: 5px;
    }
    #add-action-form .form-field {
        width: 220px;
    }

    #add-action-form .textbox {
        width: 210px;
        height: 12px;
        background-color: #cfe7fe;
        margin-right: 2px;
    }

    #add-action-form textarea {
        width: 210px;
        height: 50px;
        background-color: #cfe7fe;
    }

    #add-action-form #targetdate {
        width: 100px;
    }

    #add-action-form select {
        /* rest of the css is up with generate-report-section select */
        width: 140px;
    }

    #add-action-form input[type=submit] {
        background: url('../images/boppbuttonbg.jpg') no-repeat;
        width: 92px;
        height: 28px;
        text-align: center;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        border:  none;
        cursor: pointer;
        overflow: visible;
    }

    #add-action-form .error-form-field, #sales-driver-form .error-form-field {
        display:none;
    }

    #add-action-form .error, #sales-driver-form .error {
        border: 2px solid red;
        color: #000000;
    }

    /* Sales Drivers page */

    #sales-driver-form .form-row, #driver-edit-form .form-row, #parameter-calculate-form .form-row {
        width: 200px;
        margin-bottom: 5px;
        float: left;
        clear:none;
    }
    
    #parameter-calculate-form {
        padding-top: 15px;
    }
    
    #parameter-calculate-form .form-row {
        width: 120px;
    }

    #sales-driver-form .form-row.shorter {
        width: 149px;
    }

    #sales-driver-form .form-row.shorter.submit {
        width: 86px;
    }
    #sales-driver-form .form-row.shorter.submit .form-field {
            width: 92px;
    }


    #sales-driver-form .form-row.shorter .textbox {
        width: 70px;
    }

    #sales-driver-form .form-label.shorter {
        width: 20px;
    }

    #sales-driver-form .form-label {
        width: 40px;
        padding-top: 0px;
    }
	
	#sales-driver-form .form-label.predictor {
        width: 50px;
        padding-top: 0px;
    }

    #sales-driver-form .form-row .form-field {
        width: 140px;
    }
    #sales-driver-form .form-row.shorter .form-field {
        width: 100px;
    }
	
	

    #sales-driver-form .textbox, #driver-edit-form .textbox, #parameter-calculate-form .textbox {
        width: 135px;
        height: 12px;
        background-color: #cfe7fe;
    }
    
    #parameter-calculate-form .textbox {
        width: 80px;
    }
    
    #sales-driver-form .small, #driver-edit-form .small, #parameter-calculate-form .small {
        width: 50px;
    }
	
	#sales-driver-form .form-field.predictor .textbox {
        width: 125px;
	}

    #sales-driver-form .form-row.radiobuttons {
        width: 160px; 
		margin-right:15px;
    }
    #sales-driver-form .form-row.radiobuttons .form-label {
        width: 70px !important;
    }
    #sales-driver-form .form-row.radiobuttons .form-field {
    	width: 85px !important;
	}    
	#sales-driver-form .form-row.radiobuttons.singlerow {
        /* width: 160px; 
		margin-right:15px; */
		width:auto !important;
    }
    #sales-driver-form .form-row.radiobuttons.singlerow {
		margin-top:5px;
		margin-right:25px;		
	}
    #sales-driver-form .form-row.radiobuttons.singlerow .form-label {
        /* width: 70px !important; */
		width:auto !important;
    }
    #sales-driver-form .form-row.radiobuttons.singlerow .form-field {
    	/* width: 85px; */
		width:auto !important;
	}
	#sales-driver-form .form-row.radiobuttons.singlerow .form-field label {
		margin-right:0;		
	}
	#sales-driver-form .form-row.radiobuttons.singlerow .note-form-field {	
		margin-right:5px;		
	}
    #sales-driver-form input[type=submit] {
        background: #404145;
        width: 87px;
        height: 25px;
        text-align: center;
        color: #FFFFFF;
        font-size: 13px;
        font-weight: normal;
        border:  none;
        cursor: pointer;
        overflow: visible;
    }

    #sales-driver-form #periodfrom, #sales-driver-form #periodto {
        margin-right: 2px;
    }

    #sales-driver-form .wc-radiobutton, #driver-details .wc-radiobutton {
        width: 15px;
        height: 15px;
        margin-bottom: 0px;
    }

    #sales-driver-form .wc-radiobutton.checked, #driver-details .wc-radiobutton.checked {
        background-position: 0 -15px;
    }

    #value-per-licence td {
        text-align: center;
    }

    #value-per-licence th.totals {
        background: #6D6E71;
        color: #FFFFFF;
    }

    #value-per-licence th.monthslot {
        color: #FFFFFF;
    }

    .tr-active {
        background: #01498e !important;
    }
    .button-active {
        background: #404145 !important;
    }

    .driver-details {
        display: none;
    }

    #value-per-licence .editable, #value-per-licence .viewable {
        display: none;
    }

    #value-per-licence .editable .edit-value {
        width: 30px;
        text-align: center;
    }

    /* About Us Page Styles */

    #generic-section {
        margin: 50px 0px;
    }

    #left-generic-section {
        margin: 50px 10px 50px 60px;

    }

    #left-generic-section .greenbg {
        background-color:#01498e;
        padding: 20px;
        color: #fff;
    }
	
    #left-generic-section .greenbg.confirmpayment {
		color:#231F20;		
	}
	
	#left-generic-section .greenbg p, #left-generic-section .borderbg p {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 16px;
        color: #fff;
    }

    #left-generic-section .borderbg {
        background-color: #FFFFFF;
        border: 1px dotted #000000;
        padding: 20px;
    }

    #left-generic-section .greentext{
        color: #01498e;
    }

    .greenbopptext {
        color: #008000;
        font-weight:bold;
    }

    .greenbopptext.nobold {
        font-weight:normal;
    }

    #right-generic-section {
        margin: 50px 60px 50px 10px;
        padding: 0px 10px;
    }

    #right-generic-section .profile {
        border-bottom: 1px dotted #000000;
        margin-bottom: 10px;
    }

    #right-generic-section .profile.last {
        border-bottom:  none;
    }

    #right-generic-section h2, #generic-section h2 {
        font-size: 16px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        color: #000000;
        margin-bottom: 5px;
    }

    #right-generic-section p, #generic-section p {
        font-size: 12px;
        font-family: Arial, Helvetica, sans-serif;
        color: #231F20;
    }

    /* Why Bopp page */

    .findoutmore-item {
        width: 43%;
        margin: 10px 25px 25px 0px;
        position: relative;
    }

    .findoutmore-item-inner {
        min-height: 120px;
        padding: 10px;
    }

    .findoutmore-item-inner a {
        position: absolute;
        bottom: 10px;
    }

    /* What they say page */

    .client-quote-holder {
        background: url('../images/client-quote-bg.jpg') no-repeat left top #01498e;
        padding: 15px 20px 15px 100px;
    }

    .client-quote-holder p {
        font-size: 14px !important;
        color:#fff !important;
    }

    .client-testimonial {
        border-bottom: 1px dotted #000000;
        padding: 10px 0px;
    }

    /* BOPP plan page */

    #boppplan-bg {
        background: #01498e;
    }

    #onepage-section {
        background: #01498e;
        margin: 20px 0px;
    }

    #onepage-footer {
        background: #01498e;
        padding: 20px 60px;
        margin-left: 0px;

    }

    #onepage-footer h2 {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 38px;
        line-height: 38px;
        color: #231F20;
    }
    #onepage-footer h2 .whitetext {
        color: #FFFFFF;
    }

    .footer-main-header {
        padding-bottom: 45px;
        border-bottom: 1px dotted #000000;
    }

    .footer-main-link {
        padding: 20px 0px;
    }

    .footer-main-link a {
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 20px;
        line-height: 20px;
        color: #231F20;
        text-decoration: none;
        font-weight: normal;
    }
    .footer-main-link a:hover {
        text-decoration:underline;
    }
    .whitetext {
        color: #FFFFFF !important;
    }


    #simplesecure {
        font-size: 20px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        color: #231F20;
        position: absolute;
        top: 26px;
        left: 60px;
    }

    .onepageplan {
        background: #FFFFFF;
        width: 750px;
        margin: 0 auto;
        padding: 15px 45px;
        -webkit-border-radius: 15px;
        border-radius: 15px;
        -webkit-box-shadow: 6px 7px 10px 2px #333333;
        box-shadow: 6px 7px 10px 2px #333333;
    }


    .desc-text {
        float: left;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight:bold;
        color: #231F20;
    }

    .period {
        float: right;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
        font-weight:bold;
        color: #231F20;
    }

    .driver-overview {
        margin: 5px 0px 15px 0px;
    }

    .driver-overview h2 {
        background: #01498e;
        padding: 3px 15px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 14px;
        color: #FFFFFF;
        text-transform: uppercase;
    }

    .driver {
        margin-bottom: 5px;
        border-bottom: 1px dotted #231F20;
    }

    .driver.last {
        border-bottom: none;
    }

    .driver-name{
        float: left;
        padding: 10px 15px;
        width: 175px;
        font-size: 14px;
        font-family: Arial, Helvetica, sans-serif;
        color: #231F20;
        font-weight: bold;
    }

    .driver-chart-overview {
        float: left;
        width: 530px;
        color: #231F20;
    }

    .driver-chart {
        width: 320px;
        float:left;
    }

    .driver-successrate {
        float: right;
        text-align: right;
        /* width: 130px; */
		width:200px;

    }

    .chart-1, .chart-2 {
        margin-bottom: 4px;
        width: 325px;

    }

    .chart-title {
        float: left;
        width: 50px;

    }

    .chart-1 .chart-bar .chart-bar-inner {
        background: #6d6e71;
        height: 15px;
    }
    .chart-2 .chart-bar .chart-bar-inner {
        background: #94C948;
        height: 15px;
    }
    .chart-2 .chart-bar .chart-bar-inner-red {
        background: #ED2725;
        height: 15px;
    }

    .chart-bar {
        float: left;
        width: 185px;
        height: 15px;
        margin-right: 10px;
    }
    .chart-value {
        float: left;
    }

    .driver-difference {
        float: left;
        padding-top: 5px;
    }

    .driver-diff-percentage {
        float: right;
		width:95px;
    }

    .driver-diff-percentage p {
        float: left;
    }

 	.driver-diff-percentage .redtext,
	.driver-diff-percentage .greentext {  
		margin-top:3px;	
	}
	
	.driver-diff-percentage .redtext {
        color: #ED2725;
    }
    .driver-diff-percentage .greentext {
        color: #94C948;
    }

    .driver-diff-percentage img {
        float: right;
		margin-right:10px;
    }

    .goals {
        color: #231F20;
    }

    .goals-left {
        float: left;
        width:583px;
    }
    .goals-right {
        float: left;
        width:165px;
        margin-left: 2px;
    }

    .goals-right h2 {
        text-align: right;
    }

    .goals h2 {
        background: #6D6E71;
        padding: 3px 15px;
        font-family: 'ClarendonBold', Arial, Helvetica, sans-serif;
		font-weight:normal;
        font-size: 14px;
        color: #FFFFFF;
        text-transform: uppercase;
        margin-bottom: 0px;
    }

    .individual-goal p, .individual-goal-date p {
        margin-bottom: 0px;
    }

    .individual-goal-date, .individual-goal {
        text-align: right;
        padding: 10px 0px;
        border-bottom: 1px dotted #231F20;
    }
    .individual-goal {
        padding: 10px 15px;
        text-align: left;

    }

    .boppexample {
        -webkit-box-shadow: 6px 7px 10px 2px #333333;
        box-shadow: 6px 7px 10px 2px #333333;
    }


    .active {
        background: #FFFFFF !important;
    }
    .active a {
        color: #000000 !important;
        text-decoration: none !important;
    }


	.subheadings {
		width:750px;
		margin-top:10px;		
	}
	
	.driver-diff-percentage {
		text-align:left;		
	}
	
	.subheadings .driver-name, 	
	.subheadings .driver-difference {
		padding:0;		
	}





    /* contact us page */

    .contact-details {
        padding-top: 20px;
    }
    .contact-details p {
        margin-bottom: 2px;
    }

    .contact-emails {
        margin: 5px 0px;
    }

    .contact-emails-inner {
        margin-top: 10px;
    }

        .formbox.boppform {
            margin-top: 20px;
        }
        .formbox.boppform label {
                margin-right:10px;

        }

        .formbox.boppform fieldset {
            border-radius: 3px 3px 3px 3px;
            border: 1px solid #DDDDDD;
            padding:8px;
        }

        .formbox.boppform .error-form-field,
        .formbox.boppform .note-form-field {
            display:block;
            color:#FF6600;
        }

        .formbox.boppform input,
        .formbox.boppform textarea,
        .formbox.boppform select,
        .formbox.boppform option {

        }
        .formbox.boppform .textbox,
        .formbox.boppform textarea,
        .formbox.boppform select {
            background-color:#FFFFFF;color:#000000;
            width:180px;height:18px;padding:5px;
            font-size:12px;font-family:Arial, Helvetica, sans-serif;
            border:1px solid #01498e;

        }
        .formbox.boppform select {
            width:200px;
        }

        .formbox.boppform textarea {
            height:125px;
            width:180px;
        }
        .formbox.boppform .button {
            height:20px;width:16px;
            background:url(../images/buttons/right-arrow-orange.png) no-repeat right 4px;
            cursor:pointer !important;
            vertical-align:middle;
            border:none;
        }
        .formbox.boppform select {
            height:30px;
            padding:5px;
        }
        .formbox.boppform option {
            height:14px;padding:3px;
        }

        .formbox.boppform .checkbox,
        .formbox.boppform .optionbutton {
            margin-right:10px;
        }
        .formbox.boppform .checkbox {

        }
        .formbox.boppform .optionbutton {

        }

        /*
        .formbox .alert-box {
            position:relative;
            background-color: #FF6600;
            color: #FFFFFF;
            text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
            border: 1px solid rgba(0, 0, 0, 0.1);
            border-radius: 3px 3px 3px 3px;
            display: block;
            font-size: 13px;
            font-weight: bold;
            margin-bottom: 12px;
            padding: 6px 7px;
        }

        .formbox .alert-box .close {
            position:absolute;
            top:0px;
            right:0px;
            margin-right:5px;
            color:#000000;
            opacity: 0.2;
        }

        .formbox .alert-box a.close:hover {
            opacity:0.4;
            text-decoration:none;
        }
        */

        .formbox.boppform #top-level-error .body {
            color:#FF6600;
            font-weight:bold;
        }


        /* FORM LAYOUT */
        .formbox.boppform .form-row {
            float:left;
            clear:both;
            margin-bottom:10px;
            width:280px;

        }
        .formbox.boppform .form-label {
            float:left;
            width:80px;
            padding:4px 5px 0 0;
            color: #000000;
        }
        .formbox.boppform .form-field {
            float:left;
            width: 195px;
        }

        .formbox.boppform input[type="submit"] {
            background: url("../images/boppbuttonbg.jpg") no-repeat scroll 0 0 transparent;
            border: medium none;
            color: #FFFFFF;
            cursor: pointer;
            font-size: 13px;
            font-weight: normal;
            height: 28px;
            overflow: visible;
            text-align: center;
            width: 92px;
        }


        /* FIELDSETS */

        fieldset {
            margin-bottom:10px;
        }

        legend {
            color: #4D4D4D;
        }

        .formbox h5{
            color:#FF6600;
        }


        /* FORM PARENTS */
        #form-registration.formbox.boppform {

        }
        /* // FORM PARENTS */

        /* Overrides */
        #search-box.formbox.boppform .textbox {
            width:110px;
            margin-right:7px;
            vertical-align:middle;
        }
        #search-box.formbox.boppform {
            width:280px !important;
        }

        /* Custom form element override styling */


    /* Events Form */

    .formbox.boppform.eventform .form-label {
        width: 160px;
    }

    .formbox.boppform.eventform .form-row {
        width: 700px;
    }

    .formbox.boppform.eventform  .form-field {
        width: 500px;
    }

    .formbox.boppform.eventform .textbox, .formbox.boppform.eventform textarea {
        width: 400px;
    }

    .a-element .submit-form.button {
        background: none;
        border: none;
        color: #FFFFFF;
        cursor:pointer;
    }

    .edit-values {
        width: 50px;
        text-align:center;
		font-size:11px;
    }

    .event-meta {
        margin-bottom: 10px;
    }

    .eventdate {
        float: left;
        font-weight: bold;
        color: #000000;
    }

    .eventlocation {
        float: right;
        font-style: italic;
        color: #000000;
    }

    .switcher {
        -webkit-border-radius: 15px;
        border-radius: 15px;
        background: #01498e;
        padding: 15px;

    }

    .switcher .form-row.radiobuttons {
        width: 650px;
    }

    .switcher .form-row.radiobuttons .form-label {
        float: left;
        width: 100px;
    }

    .switcher .form-row.radiobuttons .form-field {
        float: left;
        width: 650px;
    }

    .switcher .form-row.radiobuttons .note-form-field {
        color: #fff !important;
    }

    #requestinfo, #signup {
        float: left;
        margin-right: 10px;
        width: 20px;
    }


    #text-right {
        position:absolute; 
        right:60px; 
        top:43px;
    }
        
    div.billing-header{
        background: none repeat scroll 0 0 #01498e;
        cursor: pointer;
        padding-left: 20px;
        color: #231F20;
        font-family: Arial,Helvetica,sans-serif;
        font-size: 12px;
        font-weight: bold;
        margin-bottom: 15px;
        vertical-align: top;
        padding-top: 5px;
        padding-bottom: 5px; 
    } 
	
 	.billing-header.history {
		padding-right:20px;	
		cursor:default;	
	}
	
	.billing-header.history .date {
		float:left;
		margin-top:5px;	
	}
	
	.billing-header.history .view-button a.print {
		color:#ffffff;
		background-color:#404145;
		padding:5px 10px;
		font-weight:normal;
		display:block;
		float:right;		
	}
	
    .billing-header.history .view-button a.print:hover {
		text-decoration:none;				
	}
	
	
	.statement-history select#view_statement {
		border:solid 1px #ccc;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;
		padding:2px;
		width:190px;
		margin-top:5px;
	}
	
	   
    table.billing-table{
        background-color: #cfe7fe;
        width: 100%;  
    }
    table.billing-table tbody tr td{
        border-top: #fff 4px solid;
    }
    table.billing-table tbody tr td.breakdown{
        border-left: #fff 4px solid;
        border-right: #fff 4px solid;
        width:110px;
    }
    
    table.billing-table tbody tr td a.print{
        background: none repeat scroll 0 0 #404145;
        border: medium none;
        color: #FFFFFF;
        cursor: pointer;
        font-size: 13px;
        font-weight: normal;
        padding-top: 5px;
        padding-bottom: 5px;
        overflow: visible;
        text-align: center;
        vertical-align:middle;
        width: 70px;
        display:block;
    }
    table.billing-table tbody tr td.printtd{
        width: 70px;
        border-left: #fff 4px solid;
        border-right: #fff 4px solid;
    }
    
    div#switcher{
        margin: 35px 70px 0 70px;
    }
   div#switcher form{
       /* margin-bottom: -40px; */
   }
   #switcher select#driver,
   #switcher select#chart_type {
		border:solid 1px #ccc;
		font-size: 14px;
    	margin-right: 3px;
    	padding: 3px;
		min-width:100px;	   
   }
   #switcher select#driver {
		vertical-align:top;	   
   }
   div#chart_div{
       margin-bottom: 30px;
   }
   	#switcher #datefrom,
	#switcher #dateto {
    	font-size: 14px;
		color:#000;
		padding: 7px;
		width:135px;				   
   } 
   
   #switcher #clients-caption1 {

   }
   #switcher #clients-caption2 {

   }   
   #switcher #clients-caption3 {

   }
   #switcher #clients-caption4 {

   }    
    form input#datefrom.textbox{
        border: medium none;
        color: #808080;
        font-family: Arial,Helvetica,sans-serif;
        font-size: 12px;
        padding: 5px;
        background-color: #cfe7fe;
        height: 12px;
        margin-right: 2px;
        width: 210px;
    }
    form input#dateto.textbox{
        border: medium none;
        color: #808080;
        font-family: Arial,Helvetica,sans-serif;
        font-size: 12px;
        padding: 5px;
        background-color: #cfe7fe;
        height: 12px;
        margin-right: 2px;
        width: 210px;
    }
    #filter_submit{
        background: none repeat scroll 0 0 #404145;
        border: medium none;
        color: #FFFFFF;
        cursor: pointer;
        display: block;
        font-size: 13px;
        font-weight: normal;
        overflow: visible;
        padding-bottom: 5px;
        padding-top: 5px;
        text-align: center;
        vertical-align: middle;
        width: 70px;
    }
    #switcher #filter_submit, #date_filter_form #filter_submit{
		display:inline;
		padding-bottom: 4px;
        padding-top: 4px;
		font-size: 14px;
		margin-top:-3px;
	}
	
	div#switcher p.error{
	    color: red;
	    font-size: 13px;
	    font-weight:bold;
	}

    #accountants .error-form-field {
        width: 406px;
        background: #01498e;
        color: #000000 !important;
        text-shadow: none;
    }

    .county .error-form-field {
        width: 194px !important;
    }

	
	
    #accountants .error-form-field,
	#accinfoform .error-form-field,
	#newclientform .error-form-field, 
	#emailaddressform .error-form-field, 
	#contactform .error-form-field, 
	#eventsform .error-form-field  {
        width: 402px;
        background: #FFFFFF;
        color: red !important;
        text-shadow: none;
    }

	#accinfoform .error-form-field,
    #accountants .error-form-field,
	#newclientform .error-form-field, 
	#emailaddressform .error-form-field, 
	#contactform .error-form-field, 
	#eventsform .error-form-field {
        background: url('../images/form-error-icon.gif') no-repeat 0px 2px;
        margin-right: 5px;
        position: relative;
        top: 2px;
		padding-left:25px;
    }
	
	#newclientform .error-form-field {
		display:none;	
	}

    #accountants .error {
        border: 1px solid red;
    }

    .county .error-form-field {
        width: 190px !important;
    }

    #contactform .error-form-field {
        width: 160px;
    }

	input.error,
	textarea.error {
		border:1px solid #E17C75 !important;	
	}
        
    input.calculated {
            border:2px solid #E17C75 !important;
            font-weight:bold;
    }


    div#top-nav ul.accountants li ul.open{
        background-image: none;
        display: block;
        left: 384px;
        width: 200px;
        z-index: 9;
    }

    div#top-nav ul.accountants li ul.open li{
        background: none;
    }
	
	/*

	
	.error-form-field {
		display:none !important;	
	}
	

	*/

	#client-section input[type="text"],
	#client-section input[type="password"],
	#client-section textarea {
		background-color:#FFFFFF;	
	}
	
	/*

	pdf template

	*/

	.pdf-template h1 {
		font-family:Arial, Helvetica, sans-serif;
		font-weight:bold;
		}
		
	.pdf-template #header-row, .pdf-template #onepage-section, .pdf-template #boppplan-bg {
		background:#FFFFFF !important;
		}
		
	.pdf-template #header-row {
		text-align:center;
		}
		
	.pdf-template #header-section {
		padding:0;
		}
	.pdf-template #onepage-section {
		margin:0;
		}
		
	.pdf-template .onepageplan {
		box-shadow:none;
                -webkit-box-shadow: none;
		border: 1px solid #01498e;
		padding: 15px 25px;
    	width: 860px;
		}
		
	.pdf-template .driver {
    	margin-bottom: 3px;
		}

	.pdf-template .driver-name {
		font-size: 14px;
		padding: 0 15px;
		width: 200px;
	}
	
	.pdf-template .chart-1, .pdf-template .chart-2 {
		margin-bottom: 1px;
		width: 325px;
	}
	
	.pdf-template .chart-1 .chart-bar .chart-bar-inner {
		height: 8px;
	}
	
	.pdf-template .chart-2 .chart-bar .chart-bar-inner {
		height: 8px;
	}
	
	.pdf-template .chart-2 .chart-bar .chart-bar-inner-red {
		height: 8px;
	}
	
	.pdf-template .chart-bar {
		height: 12px;
		margin-right: 10px;
		width: 185px;
	}
	
	.pdf-template .subheadings {
		width:800px;
		margin-top:-15px;
	}
	
	.pdf-template .driver-chart-overview {
		font-size:11px;
		width:570px;
		}
	
	.pdf-template .goals-left {
		width:625px;
		}
		
	.pdf-template .goals-right {
		width:230px;
		}
		
	.pdf-template p {
		margin-bottom:0;
		}
		
	.pdf-template #onepage-footer {
		-webkit-border-radius: 15px;
		border-radius: 15px;
		margin:5px 20px;
		padding:0 30px;
	}

	p.pred_sort{
	    margin-left: 397px;
	}
	
        #client-section select#filter_month {
		border:solid 1px #ccc;
		font-size: 16px;
                margin-right: 3px;
                padding: 3px;
		min-width:200px;	   
        }
        
        @media print{
            body{ background-color:#FFFFFF; background-image:none; color:#000000 }
            #header-row{ display:none;}
            #footer{ display:none;}
            #client-section-dashboard{ display:none;}
            #switcher{ display:none;}
            h1{ margin-top:40px;}
        }

    /* Redesign
    -------------------------------------------------------------- */  

    .header-outer {
        width: 100%;
        position: absolute;
        top: 0;
        right: 50%;
        z-index: 10;
        background-image: url('/images/header-swoosh-blue.png');
        background-position: right 0;
        background-repeat: no-repeat;
    }

    .header-inner {
        position: relative;
        margin: 0 auto;
        padding: 20px 0 40px 0;
        text-align: right;
    }

    .header-inner img {
        width: 130px;
        max-width: 100%;
        height: auto;
        margin: 0 350px 0 0;
    }

    .header-outer.accountant-login {
        right:0;
        left:0;
        background-image: none;
    }

    .header-outer.accountant-login .header-inner {
        width: 960px;
        padding: 1.5rem 0;
        text-align: left;
    }

    .header-outer.accountant-login .header-inner img {
        width: auto;
        max-width: 200px;
        margin: 0;
    }

    .login-intro {
        margin: 70px 0!important;
        padding: 0!important;
        text-align: center;
    }

    .login-intro h1 {
        max-width: 600px;
        margin: 0 auto 15px auto;
        font-size: 35px;
        color: #004083; 
    }
    
    .login-intro p {
        max-width: 550px;
        margin: 0 auto 15px auto!important;
        font-size: 12px;
        line-height: 18px;
    }

    .login-intro .failure {
        color: #e17c74!important;
    }

    .login-screen {
        padding-top: 150px;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,ffffff+0,ffffff+0,f6f6f6+100 */
        background: rgb(30,87,153); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 0%,rgba(246,246,246,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(30,87,153,1) 0%,rgba(255,255,255,1) 0%,rgba(255,255,255,1) 0%,rgba(246,246,246,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
    }

    #login-box {
        width: 300px;
        padding: 20px;
        margin: 0 auto;
        background: #fff;
        border-radius: 10px;
        text-align: left;
        -webkit-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.2);
        -moz-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.2);
        box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.2);
    }

    .register-box {
        width:600px!important;
    }

    #login-box .formbox {
        margin: 0;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    #login-box .form-col {
        width:290px;
        float: left;
        display: inline-block;
        padding-right: 10px;
    }

    #login-box label {
        width: 100%;
        display: block;
        margin: 0 0 5px 0;
        font-weight: bold;
        text-align: left;
        color: #666;
    }

    #login-box span.error-form-field {
        width: auto!important;
        margin: -20px 0 15px 0!important;
        padding:10px 5px 5px 5px!important;
        background: #e17c74!important;
        border-radius: 0px 0px 5px 5px;
        -moz-border-radius: 0px 0px 5px 5px;
        -webkit-border-radius: 0px 0px 5px 5px;
    }

    #login-box label span {
        color: #e17c74;
    }

    #login-box input[type="text"], #login-box input[type="password"] {
        width: 100%;
        height: auto;
        margin: 0 0 15px 0;
        padding: 10px 5px;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        box-sizing: border-box;
        border: 1px solid #e9e9e9;
        font-size: 12px;
        color: #5C5C5C;
    }

    #login-box input[type="text"].error, #login-box input[type="password"].error {
        color: #e17c74;
    }

    #login-box input[type="submit"] {
        width: 120px;
        height: 32px;
        display: inline-block;
        background: #90c649;
        border: 0;
        outline: 0;
        border-radius: 5px;
    }

    #login-box p { 
        display: inline-block;
        margin: 0 0 0 10px!important;
        padding: 0;
    }

    #login-box p a {
        display: inline-block;
        margin-top: 10px;
    }

    .footer-outer {
        width: 100%;
        position: relative;
        padding: 50px 0;
        background: #004083;
    }

    .footer-inner {
        width: 960px;
        margin: 0 auto;
    }

    .footer-left, .footer-right {
        width: 478px;
        position: relative;
        display: inline-block;
    }

    .footer-right {
        text-align: right;
    }

    .footer-left p, .footer-right p {
        color: #fff;
    }
    
    .footer-right img {
        width: 130px;
        max-width: 100%;
        height: auto;
        margin: 0 0 30px 0;
    }

    .footer-right a {
        font-weight: normal;
        color: #fff;
        text-decoration: none;
    }

    .footer-right a:hover {
        text-decoration: underline;
    }

    /*---------------------------------------------------------
    
    END SECTION - no more CSS must be placed below this section.
    This is to eliminate CSS merge issues. Place all new and
    updated CSS above this section.
        
    --------------------------------------------------------- */    

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border-color: #01498e!important;
}