@import url(reset.css);

/*============================================================================== 
    Element styles:                                                              
--------------------------------------------------------------------------------*/

body {
    min-width: 960px;
    background: #3ea7e3 url('../images/main_bg.png') repeat-x;  /* 0097e1 */
    color: #505050;
    font-family: arial, helvetica, sans-serif;
    font-size: 100%;
    text-align: center;
}

h1 {
    margin-bottom: 20px;
    color: #333333;
    font-family: 'Adamina', serif;
    font-size: 210%;
    font-weight: bold;
}

h2 {
    padding-bottom: 20px; /* Using margin here causes IE6 issue */
    color: #2c90dc;
    line-height: 150%;
    font-family: 'Adamina', serif;
    font-size: 140%;
}

h3 {
    margin-bottom: 1em;
    color: #545454;
    font-size: 120%;
}

h4 {
    margin-bottom: 10px;
    color: #545454;
    font-size: 110%;
    font-weight: bold;
}

ul {
    margin-bottom: 10px;
}
    ul li {
        margin-top: 5px;
    }
    
    ul.level2 {
        margin-left: 1em;
    }
        ul.level2 li{
            list-style-type: circle;
            list-style-position: outside;
            background: none;
            padding: 0;
        }

ol {
    list-style-type: decimal;
    list-style-position: outside;
    margin-left: 40px;
    margin-bottom: 20px;
}
    ol li {
        margin-bottom: 5px;
    }
    ol.sparse li {
        margin-bottom: 12px;
    }
    ol.olAlt {
        margin-left: 0;
        list-style-position: inside;
    }

table p {
    margin-bottom: 10px;
    margin-top: 10px;
}
    table.features td {
        vertical-align: middle;
    }
    table.features th {
        background: #efefef;
        font-weight: bold;
        width: 100%;
        font-size: 90%;
        padding-top: 6px;
        border: solid 1px #e0e0e0;
    }
    table.s .version {
        text-align: center;
    }

p {
    margin-bottom: 10px;
}

b, strong {
    font-weight: bold;
}

em {
    font-style: italic;
}

a {
    border-bottom: dotted 1px #909090;
    text-decoration: none;
    font-weight: bold;
    font-size: 90%;
}
a:link          { color: black; }  /* unvisited link */
a:visited    { color: #616161; }  /* visited link */
a:hover        { color: #616161; }  /* mouse over link */
a:active      { color: #616161; }  /* selected link */

a.imageLink {
    border: none;
}

.headingLink {
    display: inline-block;
    padding: 0;
    line-height: 120%;
    margin-bottom: 0.3em;
}

hr {
    margin: 30px 0;
    line-height: 0;
    padding: 0;
    height: 0px;
    border: none;
    border-top: solid 1px #cfcfcf;
}

/*============================================================================== 
    Wrapper styles:                                                              
--------------------------------------------------------------------------------*/

#wrapper { /* Container for the entire webpage */
    width: 960px;
    height: 100%;
    position: relative;
    background: white;
    box-shadow:         0px 3px 9px -1px black; /* CSS3 */
    -moz-box-shadow:    0px 3px 6px -1px black; /* Firefox - A bit small, or it gets gigantic */
    -webkit-box-shadow: 0px 3px 9px -1px black; /* Chrome, Safari, Opera */
    text-align: left;
    line-height: 130%;
    margin: 15px auto 0px auto;
}

/*============================================================================== 
    Header styles:                                                              
--------------------------------------------------------------------------------*/
   
#header {
    min-height: 125px;
    position: relative;
    background: url('../images/header_bg.jpg') repeat-x left bottom;
    border-left: solid 1px white;
    border-right: solid 1px white;
}
    #header a {
        border-bottom: none;
    }
    
    #upperHeader {
        min-height: 100px;
    }
        #headerLogo { /* Intaver logo image in the header */
            position: relative;
            margin-top: 17px;
            margin-left: 25px;
        }
        
        #moreNavigation { /* Container for search AND top-right menu */
            float: right;
            text-align: right;
            width: 590px;
            min-height: 88px;
            padding-right: 24px;
            padding-top: 15px;
            background: url('../images/header_slit.png') no-repeat left 94%;
        }        
            #moreNavigation  .extraNav li { /* List elements of the top-right menu */
                margin-left: 15px;
                padding-left: 15px;
                font-size: 80%;
                border-left: solid 1px #e0e0e0;
            }
            
            #moreNavigation  .extraNav li.firstItem {
                border: none;
            }
        
            #mainSearch { /* Container for the header search form */
                margin-top: 9px;
            }        
                #mainSearch input { /* All input elements in the header search form */
                    float: right;
                    margin-left: 3px;
                }
                
                #searchInput { /* Text-field input of the header search form */
                    height: 20px;
                    padding: 0px 2px;
                }

                #searchTagline { /* 'Powered by Google' text */
                    float: right;
                    margin-right: 5px;
                    font-size: 80%;
                    width: 100px;
                    line-height: 100%;
                }
                
                #searchTagline a { /* The 'Google' link in 'Powered by Google' */
                    border: none;
                }
                
    #nav { /* Main navigation bar right below the header */
        height: 37px;
        width: 100%;
        position: absolute;
        bottom: 0px;
        color: white;
        background: url('../images/nav_bg.png') repeat-x;
    }
        #nav * {
            float: left;
        }
        #nav.liteHeader {
            text-align: center;
        }
        #nav.liteHeader *{
            float: none;
        }
        #awmAnchor-menu {
            height: 10px;
            width: 10px;
        }
        #homeLink { /* Text below Intaver logo image */
            position: relative;
            top: 8px;
            margin-left: 65px;
            padding-right: 35px;
            margin-right: 20px;
            border-right: solid 1px white;
            font-size: 80%;
            font-weight: normal;
            color: white;
            border-bottom-style: none;
        }
        #homeLink.liteHeader {
            border: none;
        }

/*============================================================================== 
    Content styles:                                                              
--------------------------------------------------------------------------------*/
   
#content { /* Container for verything between the header and footer */
    width: 958px;
    overflow: hidden;
    position: relative;
    border-left: solid 1px white;
    border-right: solid 1px white;
}
    #content a:link          { color: #545454; }  /* unvisited link */
    #content a:visited    { color: #909090; }  /* visited link */
    #content a:hover        { color: #909090; }  /* mouse over link */
    #content a:active      { color: #909090; }  /* selected link */
    
    #content h1 {
        line-height: 125%;
    }
    
    #feature { /* Splash screen showing product name, boxes, buttons, etc */
        padding: 17px 1%;
        height: 288px;
        overflow: hidden;
        background: url('../images/feature_bg.jpg') no-repeat left -14px;
    }
        #productDisplay { /* Container for box images and version names */
            width: 630px;
            overflow: hidden;
        }
            #productDisplay h1 { /* The very large heading in the feature */
                margin: 0;
                text-align: center;
                line-height: 130%;
                font-size: 22pt;
                margin-top: -5px;
                margin-bottom: 3px;
            }
            
            #boxSectionEnt {
                position: relative;
                margin-top: -3px;
            }
                #cloudImageLink {
                    position: absolute;
                    display: block;
                    top: 14px;
                    left: 146px;
                    width: 96px;
                    height: 168px;
                }

        #featureActions { /* Container for buy, try, tutorial, etc */
            float: right;
            width: 238px;
            height: 300px;
            padding-top: 5px;
            position: relative; /* To absolutely position tutorial link */
            font-size: 80%;
        }
            #tryText {
                margin-top: 0px;
                margin-bottom: 15px;
                color: #424242;
                line-height: 142%;
                font-size: 100%;
            }
            
            #tutorialLink {
                display: block;
                width: 205px;
                height: 33px;
                position: absolute;
                bottom: 0px;
                color: white !important;
                border: none;
                background: url('../images/tutlink_bg.png') no-repeat;
                font-family: 'Adamina', serif;
                font-size: 100%;
                font-weight: normal;
            }    
                #tutorialLink span {
                    position: relative;
                    top: 7px;
                    left: 17px;
                }
                
    #announcement {
        padding: 11px 20px 10px 20px;
        margin-bottom: 9px;
        border-bottom: solid 1px #cbcbcb;
        background: white url('../images/announce_bottom.jpg') repeat-x left bottom;
        text-align: center;
        font-size: 90%;
    }
        #announcement a {
            font-size: 100%;
        }
        
        #announcement span, 
        #announcement img {
            vertical-align: middle;
        }

        #announceIcon {
            margin-right: 10px;
        }
   
    #CaptivateContent {
        text-align: center;
    }
   
    #contentInner1 { /* This is the sidebar. However in HTML you would
                           not recognize it as the sidebar. This approach
                           is used for cross-browser compatibility. */
        max-height: 100%;
        position: relative;
        right: 710px;
        border-style: solid solid solid none;
        border-color: #d6d6d6;
        border-width: 1px;
        background: #F2F2F2;
        text-align: left;
    }
        #foldedCorner { /* Folded top right corner image in the sidebar */  
            display: block;
            position: absolute;
            top: -1px;
            right: -1px;
        }

    #primaryContent {
        display: inline-block;
        vertical-align: top;
        position: relative;
        width: 679px;
        left: 710px;
        font-size: 95%;
    }        
        #mainTable {
            width: 626px;
        }
        
        #mainTable p b {
            padding-top: 20px;
        }
		
		#translations {
			margin-top: 10px;
			text-align: right;
		}

    #secondaryContent { /* Sidebar content. This does not change the visual
                              appearance of the sidebar, though. For this you
                              must use 'contentInner1' */
        display: inline-block;
        width: 210px;
        padding: 25px 20px 20px 25px;
        vertical-align: top;
        position: relative;
        left: 708px;
        line-height: 150%;
        font-size: 80%;
    }

        #secondaryContent h3 {
            margin-top: 25px;
            font-size: 120%;
            font-weight: bold;
        }

        #secondaryContent h3.firstHeading {
            margin-top: 0px;
        }

        #secondaryContent li,
        .basicList li {
            padding-left: 18px;
            margin-bottom: 5px;
            margin-left: 5px;
            background: url('../images/bullet.gif') no-repeat left 0.5em;
            list-style-type: none;
        }
        
        #secondaryContent table {
            margin-left: -15px;
        }
        
        #secondaryContent * table {
            margin-left: 0px;
        }
        
        #secondaryContent .richList li{
            margin-left: 30px;
            position: relative;
            background: none;
            margin-bottom: 20px;
        }
            #secondaryContent .richList li img{
                position: absolute;
                left: -30px;
                top: 3px;
            }

/*============================================================================== 
    Footer styles:                                                              
--------------------------------------------------------------------------------*/
#footer {
    color: #b5b5b5;
    border-bottom: solid 1px #606060;
    border-right: solid 1px #707070;
    border-left: solid 1px #606060;
    background: #3e3e3e url('../images/footer_bg_dark.jpg') repeat-x;
    font-size: 15px;
}
    #footer a {
        border-bottom: none;
        font-size: 12px;
    }
    #footer a:link        { color: #49c3ff; } /* unvisited link */
    #footer a:visited  { color: #dfdfdf; } /* visited link */
    #footer a:hover      { color: #dfdfdf; } /* mouse over link */
    #footer a:active    { color: #dfdfdf; } /* selected link */

    #upperFooterCol1 {
        display: inline-block;
        width: 249px;
        padding: 14px 0px;
        vertical-align: top;
        text-align: center;
    }
        #upperFooterCol1 div {
            vertical-align: middle;
            position: relative;
            top: 3px;
            left: -2px;
        }
        
        #upperFooterCol1 a {
            border: none;
            font-size: 85%;
        }
        #upperFooterCol1 a:link         { color: #cccccc; } /* unvisited link */
        #upperFooterCol1 a:visited   { color: #cccccc; } /* visited link */
        #upperFooterCol1 a:hover       { color: #cccccc; } /* mouse over link */
        #upperFooterCol1 a:active     { color: #cccccc; } /* selected link */

    #upperFooterCol2 {
        display: inline-block;
        width: 651px;
        padding: 15px 0px;
        padding-left: 57px;
        margin-left: -4px;
        background: #3e3e3e url('../images/footer_bg.jpg') repeat-x;
        vertical-align: top;
        font-size: 95%;
        line-height: 115%;
    }
        #upperFooterCol2 .extraNav {
            margin-bottom: 10px;
        }

        #upperFooterCol2 .extraNav li {
            margin-right: 30px;
        }
        
        #address {
            font-size: 90%;
        }

#lowerFooter {
    width: 960px;
    margin: 10px auto 30px auto;
    color: #b1dbef;
    text-align: left;
    font-size: 12px;
}
    #lowerFooter a {
        float: right;
        margin-left: 20px;
        color: white;
        border: none;
        line-height: 100%;
    }    

/*============================================================================== 
    Style classes:                                                              
--------------------------------------------------------------------------------*/

/* class: featured-reseller
   Provides emphasis for resellers that we would like highlighted on the page*/
.featured-reseller {
	background-color: #f5f5f5;
}

/* class: checklist
   Any list element with this class name will get green checkmark bullets */
.checklist li {
    padding-left: 20px;
    margin-bottom: 8px;
    background: url('../images/bullet_check.jpg') no-repeat left 0.4em;
    list-style-type: none;
}

/* class: extraNav 
   Any list element with this class name will become horizontal, to prepare
   the list for becoming an extra navigation menu on the page */
.extraNav li {
    display: inline;
}

/* class: boxSection 
   Formats a container for holding a box image and product version title */
.boxSection {
    display: inline;
    float: left;
    margin: -8px 0px 0px 19px;
}
    .boxSectionCaptions {
        position: relative;
        float: left;
        top: -63px;
    }
    
    .productCaption {
        display: inline;
        float: left;
        text-align: center;
        color: #404040;
        line-height: 1.3em;
        font-size: 0.75em;
        font-weight: bold;
		margin-left: 22px;
    }
    
    .productCaption-lite {
        width: 169px;
    }
    
    .productCaption-pro {
        width: 168px;
    }

    .productCaption-ent {
        width: 172px;
        margin-left: 65px;
        margin-top: 7px;
    }

/* class: productName
   To be used in conjunction with boxSection. Formats the version title of
   the box product. E.g., can be used on text "RiskyProject Lite" */
.productName {
    width: 124px;
    margin-bottom: 3px;
    position: relative;
    left: 35px;
    color: ##4A4A4A;
    text-align: center;
    line-height: 120%;
    font-size: 12pt;
    border: none;
}
    .productName a { 
        font-size: 12pt;
        border: none; 
    }

/* class: featureButton
   Styles the Buy and Trial buttons on the homepage feature. */
.featureButton {
    display: block;
    width: 205px;
    height: 62px;
    margin-bottom: 15px;
    margin-top: 5px;
    border: none;
    background: url('../images/feature_button.png') no-repeat;
    text-align: center;
    font-family: 'Adamina', serif;
    font-size: 110%;
    font-weight: normal;
}
    .featureButton * {
        position: relative;
        top: 10px;
        font-size: 17px;
    }
    #content a.featureButton:link        { color: white; } /* unvisited link */
    #content a.featureButton:visited  { color: white; } /* visited link */
    #content a.featureButton:hover      { color: white; } /* mouse over link */
    #content a.featureButton:active    { color: white; } /* selected link */

/* class: primarySection
   In a TWO column design, this is one of the sections that holds
   primary content. There can optionally be a color marker on the 
   top-left. */
.primarySection {
    overflow: hidden;
    width: 642px;
    padding: 10px 20px 15px 25px;
    margin-bottom: 10px;
    position: relative;
    border-top: solid 1px #cbcbcb;
    border-right: solid 1px #cbcbcb;
    border-left: solid 1px #d0d0d0;
    border-bottom: solid 1px #d0d0d0;
    background: white url('../images/section_bg.jpg') repeat-x;
}
    .lastPrimarySection {
        height: 211px;
    }
    
    .primarySection .listCol1 { /* The first list column inside a primary section. */
        width: 45%;
        padding-right: 5%;
    }
    .twoColumnList ul {
    float: left;
    width: 50%;
    }

/* class: primarySectionW
   In a ONE column design, this is one of the sections that holds
   primary content. There can optionally be a color marker on the 
   top-left. */
.primarySectionW {
    overflow: hidden;
    padding: 12px 1.9%;
    margin-bottom: 10px;
    position: relative;
    border-top: solid 1px #cbcbcb;
    border-right: solid 1px #cbcbcb;
    border-left: solid 1px #d0d0d0;
    border-bottom: solid 1px #d0d0d0;
    background: white url('../images/section_bg.jpg') repeat-x;
}

/* class: headingMarker
   The color rectangle on the top left of a primary section.*/
.headingMarker {
    display: block;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 1.1em;
}

/* A table that holds risk breakdown structure data. */
.riskBreakdown table{
    margin: 0 auto;
}

/* The dataTable is any table that holds actual tabular data, not
   to be used for layout purposes. */
.dataTable {
    margin-bottom: 1em;
}   
    .dataTable th {
        padding: 0.1em 10px;   
        border: solid 1px #e0e0e0;
        background: #f6f6f6;
        font-size: 0.8em;
    }
    .dataTable td {
        padding: 0px 10px;   
        border: solid 1px #e0e0e0;
    }

    .dataTable-subHeader {
        background: #909090;
        color: white;
    }

/* Logos on the reseller/partners page */
.resellerLogo {
    width: 120px;
}

/*============================================================================== 
     Reusable non-container classes                                                         
--------------------------------------------------------------------------------*/

.newInline {
    background: #449900;
    color: white;
    padding: 0.2em 10px;
    font-size: 0.8em;
}

.firstItemV {
    padding-top: 0;
    margin-top: 0;
}
.lastItemV {
    padding-bottom: 0;
    margin-bottom: 0;
}

.firstItemH {
    padding-left: 0;
    margin-left: 0;
}
.lastItemH {
    padding-right: 0;
    margin-right: 0;
}

.emBox {
    background: #efefef;
}

.olAligned {
    margin-left: 20px;
}

/* Applied to primarySection(W) that has very little content */
.minContent {
    height: 400px;
}

/* Text that should be stronger than strong. */
.important {
    color: red; 
    font-weight: bold;
}

/* Another way to emphasize text. */
.em2 {
    text-decoration: underline;
}

/* Text that should be a bit lighter than usual. */
.lightText {
    color: #a0a0a0;
}

/* A list that needs to be sparser than usual. */
.basicList-sparse li {
    padding-left: 18px;
    margin-bottom: 12px;
    margin-left: 5px;
    background: url('../images/bullet.gif') no-repeat left 0.5em;
    list-style-type: none;
    line-height: 150%;
}

/* Text that comes after some data to explain terms, conditions, etc
   and is located OUTSIDE the data container */
#content .finePrint {
    margin-top: -10px;
    font-size: 80%;
}

/* Text that comes after some data to explain terms, conditions, etc
   and is located INSIDE the same container as the data */
#content .finePrintInner {
    padding: 0.5em 0;
    line-height: 120%;
    font-size: 80%;
}
    #content .finePrintInner p{
        margin-bottom: 0.5em;
        margin-top: 0;
    }
    
    #content .finePrintInner a{
        font-size: 1em;
    }

/* Styles the product price throughout most of the site. */
.productPrice {
    font-weight: bold;
    color: green;
}

/* Emphasizes an image on its own line by centering it. */
.emImage {
    text-align: center;
    margin-bottom: 9px;
}

/* For images that are larger than the content area. */
img.widestImage {
    width: 900px; 
}

/* On an image page, contains the navigation links like Back, Next, etc */
.imagePagination {
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* On an Image page, formats the navigation links like Back, Next, etc */
.paginationNavLink {
    margin-right: 50px;
}

/*============================================================================== 
     Reusable container classes
--------------------------------------------------------------------------------*/

/* An image container that has a captiion. */
.imagecap{
    text-align: center;
}

/* This is the container that will separate different parts of content
   from each other. If you have a heading and then a paragraph, for example,
   and then another heading anf paragraph after that, you can separate them
   by putting each into a subsection container. */
.subsection {
    margin-bottom: 27px;
    overflow: hidden;
}
    .subsection  h4 {
        border-bottom: solid 1px #e0e0e0;
    }
    .subsection  .image {
        float: right;
        text-align: center;
        margin-left: 20px;
    }
    .subsection  .imageL {
        float: left;
        text-align: center;
        margin-right: 10px;
        z-index: 1000;
    }

/* This is an obsolete class. */
.twoColSubsection {
    margin-bottom: 10px;
    overflow: hidden;
}
    .twoColSubsection .tcsCol1 {
        float: left;
        width: 46%;
        padding: 1.5% 2%;
    }
    
    .twoColSubsection .tcsCol2 {
        float: right;
        width: 46%;
        padding: 1.5% 2%;
    }

/* Styles for a TWO column grid. There are three main components:
   1. The gridx-y class which wraps around the grid cells (dimbox containers)
   2. The dimbox containers for setting dimensions and position of grid cells
   3. The core containers for setting padding and holding the actual content 
   
   The different dimbox sizes and core variations can be used interchangeably
   to create many kinds of grid layouts with two columns. */
.grid2-1 {
    overflow: hidden;
}
    /* Cell 1 of 2 - Dimbox and Core variations :*/
    
    .dimbox40-2-1 {
        float: left;
        width: 40%;
    }
    .dimbox2-1 {
        float: left;
        width: 50%;
    }
    .dimbox60-2-1 {
        float: left;
        width: 60%;
    }
    .dimboxA-2-1 {
        float: left;
        width: 70%;
    }
    .dimboxB-2-1 {
        float: left;
        width: 30%;
    }
    .dimbox30-2-1 {
        float: left;
        width: 30%;
    }
    .dimbox20-2-1 {
        float: left;
        width: 20%;
    }
    .dimbox80-2-1 {
        float: left;
        width: 80%;
    }
        .core2-1 {
            padding: 2% 3%;
        }
        .coreAltA2-1 {
            padding: 2% 3%;
            text-align: center;
        }
        .coreWide2-1 {
            padding: 0;
        }
        .coreBarer2-1 {
            padding: 1% 1%;
        }
        .coreBare2-1 {
            padding: 0;
        }
        .coreThick2-1 {
            padding: 3% 3%;
            padding-right: 4%;
        }
        .coreThickest2-1 {
            padding: 5% 5%;
        }
        
    /* Cell 2 of 2 - Dimbox and Core variations :*/
    
    .dimbox40-2-2 {
        float: left;
        width: 40%;
    }
    .dimbox2-2 {
        float: left;
        width: 50%;
    }
    .dimbox60-2-2 {
        float: left;
        width: 60%;
    }
    .dimboxA-2-2 {
        float: left;
        width: 30%;
    }
    .dimboxB-2-2 {
        float: left;
        width: 70%;
    }
    .dimbox70-2-2 {
        float: left;
        width: 70%;
    }
    .dimbox80-2-2 { 
        float: left;
        width: 80%;
    }
        .core2-2 {
            padding: 2% 3%;
        }
        .coreAltA2-2 {
            padding: 2% 3%;
            text-align: center;
        }
        .coreWide2-2 {
            padding: 0;
        }
        .coreBarer2-2 {
            padding: 1% 1%;
        }
        .coreBare2-2 {
            padding: 0;
        }
        .coreThick2-2 {
            padding: 3% 3%;
            padding-right: 4%;
        }
        .coreThickest2-2 {
            padding: 5% 5%;
            padding-right: 4%;
        }
    
/* Styles for a THREE column grid. There are three main components:
   1. The gridx-y class which wraps around the grid cells (dimbox containers)
   2. The dimbox containers for setting width, height, and position of grid cells
   3. The core containers for setting padding and holding the actual content 
   
   The different dimbox sizes and core variations can be used interchangeably
   to create many kinds of grid layouts with three columns. */
.grid3-1 {
    overflow: hidden;
}
    /* Cell 1 of 3 - Dimbox and Core variations :*/
    
    .dimbox3-1 {
        float: left;
        width: 33%;
    }
    .dimbox20-3-1 {
        float: left;
        width: 20%;
    }
        .core3-1 {
            padding: 2% 3%;
        }
        .coreCenter3-1 {
            text-align: center;
        }
        .coreBarer3-1{
            padding: 1% 1%;
        }
        .coreBare3-1{
            padding: 0;
        }

    /* Cell 2 of 3 - Dimbox and Core variations :*/
    
    .dimbox3-2 {
        float: left;
        width: 34%;
    }
    .dimbox50-3-2 {
        float: left;
        width: 50%;
    }
    .dimbox60-3-2 { 
        float: left;
        width: 60%;
    }
        .core3-2 {
            padding: 2% 3%;
            padding-left: 5%;
        }
        .coreCenter3-2{
            text-align: center;
        }
        .coreBarer3-2{
            padding: 1% 1%;
        }
        .coreBare3-2{
            padding: 0;
        }

    /* Cell 3 of 3 - Dimbox and Core variations :*/
    
    .dimbox3-3 {
        float: left;
        width: 33%;    
    }
    .dimbox20-3-3 {
        float: left;
        width: 20%; 
    }
    .dimbox30-3-3 {
        float: left;
        width: 30%;
    }
        .core3-3 {  
            padding: 2% 3%;
        }
        .coreBarer3-3 { 
            padding: 1% 1%;
        }
        .coreBare3-3 {  
            padding: 0;
        }
        .coreCenter3-3 { 
            text-align: center;
        }

/* Footer fix for mobile screens */
@media (max-device-width: 480px){
    #upperFooterCol2,
    #upperFooterCol2 a{
        font-size: 8px;
    }
}