/*
    Document   : babygear-usa
    Created on : Nov 5, 2009, 11:17:04 AM
    Author     : Mark
    Description:
        Purpose of the stylesheet follows.
*/

/*
   Global StyleSheet - this should be the master sheet
   Only sheets to fix browser issues should be link below this sheet
*/

/*

Stylesheet for BabyGear-USA
Mark Davies
mark@mrd-global.com
2009-10-27

*/

/*

Colours used

LightYellow         #FFFFE0 - 255 255 224
LightGrey           #D3D3D3 - 211 211 211
Teal                #1E1975 -   0 128 128
White               #FFFFFF - 255 255 255
Black               #000000 -   0   0   0
Red                 #FF0000 - 255   0   0
Yellow              #D3EB93 - 255 255   0
Light Green*        #64CDAA - 100 205 170
Arrow Green*        #ccdabc - 204 218 188
Light Teal*         #D7B9C9 - 215 185 201
Light Blue/Silver*  #C9C3ED - 201 195 237
MidnightBlue        #191970 -  24  24 112

Colors with * are not named colors.

Change Log For external files:
1) Drop arc remove code in header.php - last line
2) Teal background goes to Blue 1E1975
3) Teal Image border goes to Blue 1E1975
4) Left border goes to dark green 5aa60e
5) Drop the left border on the main page(s)

Use the following colour

*/

*{margin:0;padding:0;border:none;}

html, body
{
    font-size:100%;
    font-family:arial,sans-serif;
    color: #000000;
    background-color:#FFFFFF;
    height:100%;
}

.bodytext
{
    font-size: .75em;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 20px;
    padding: 10px 10px 0px 10px;
    color: #555555;
}

.hidden { display: none; }
.unhidden { display: block; }

.floatleft
{
    float: left;
    margin: 5px 20px 5px 0px;
    border: 0;
    padding: 0px;
}

.floatright
{
    float: right;
    margin: 10px 20px 2px 20px;
    border: 0;
    padding: 0px;
}

.first
{
    margin-top: 10px;
}

.last
{
    margin-bottom: 10px;
}

.paddinglast li
{
    padding-bottom: 8px;
}

.makered
{
    color: #f00;
}

.makedarkgreen
{
    color: #050;
}

.makebold
{
    font-weight: bold;
}

.makecenter
{
    text-align: center;
}

.makeblue
{
    color: #00a;
}

.makered
{
    color: #a00;
}

.makeroblue
{
    color: #66f;
}

.makebigger
{
    font-size: 1.2em;
}

.makeunderline
{
    text-decoration: underline;
}


.items li { color: #444444; padding: 5px;}
.items li ul li { padding: 1px;}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Everything is driven from the container object
*/
#container
{
    width: 800px;                   /* we have selected 800px as the default width */
    height: 100%;                    /* force the length of the page to build a left bound to the page */
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Common Elements
*/
.space
{
    margin-top: 20px;
}

.spaceleft {
    margin-left: 10px
}

.spaceleft70 {
    margin-left: 70px
}
.nojustify
{
    text-align: left;
}

.justify
{
    text-align: justify;
}

.buttons
{
    color: #000000;
    font:bold .9em Arial;
    background: #ccdabc;
    padding: 6px 8px 6px 8px;

    border-width: 2px;
    border-style: solid;
    border-color: #ccc #888 #555 #bbb;
    text-decoration: none;
}

.buttons:hover
{
    background-color: #C9C3ED;
    border: solid 2px #D3EB93;
    color: #191970;
}

.buttons:active
{
    background-color: #C9C3ED;
    border: solid 2px #FF0000;
    color: #ff0000;
}

.bodyheader
{
    font-family: "Arial Black", sans-serif;
    text-transform: uppercase;
    color: #1E1975;
    font-size: 14pt;
    letter-spacing: 0.05em;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Common Content Section
*/
.contentcallout
{
    color: #000000;
    padding-top: 0px;
    font-size: 1em;
    border: 0px;    /* needed for ie */
    margin-left: 0px;
    /*margin-right: 250px;*/
}

.contentcallout-float-right-275
{
    margin-right: 275px;
}

.contentcallout-300
{
    width: 300px;
}


.contentcallout-550
{
    width: 550px;
}

.contentcallout-750
{
    width: 750px;
}

.contentcallout-navigate
{
    /*
    font-size: .9em;
    */
    background-color: #1E1975;
    color: #ffffff;
    font-weight: bold;
    border: outset 2px #1E1975;
    margin-bottom: 2px;
    padding: 2px 0px 2px 10px;

    font-family: "Arial Black", sans-serif;
    text-transform: uppercase;
    /*color: #1E1975;*/
    font-size: 12pt;
    letter-spacing: 0.05em;
}

.contentcallout-content
{
    font-size: .7em;
    color: #444444;
    background-color: #ffffff;
    padding: 0px 10px 0px 10px;

    border: 0;
    text-align: justify;
    margin-top: 2px;
}

.contentcallout-footerimage
{
    font-size: .7em;
    color: #444444;
    height: 80px;
    background-color: #ffffff;
    padding: 0px;
    border: solid 2px #1E1975;
    margin-top: 4px;
}

.contentcallout-content a:link, .contentcallout-content a:visited
{
    text-decoration: none;
    color: #444488;
    background-color: transparent;
    border-bottom:1px #f0f0f0 solid;
}

.contentcallout-content a:hover
{
    color: #00007f;
    background-color: #D3EB93;
    text-decoration: underline;
}

.contentcallout-content a:active
{
    color: #D3EB93;
    background-color: #FF0000;
    text-decoration: underline;
}

.contentcallout-content h1
{
    font-size: 1.3em;
    color: #111144;
}

.contentcallout p
{
    margin-top: 15px;
    margin-bottom: 20px;
}

.contentcallout li
{
    margin: 0px 0px 0px 15px;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Common Forms Section
*/
.formclass
{
    color: #00007f;
    font-size: 1.1em;
    text-decoration: underline;
    margin-bottom: 10px;
}

.smalltext
{
    font-size: .6em;
}

.jobtitle
{
    font-size: 1.0em;
    margin: 0px 0px 20px 0px;
}

.first h3
{
    margin-top: 5px;
}

.forminfo
{
    font-size: .75em;
    color: #070;
    margin-left: 5px;
}

.formwarning
{
    font-size: .75em;
    color: #f70;
    margin-left: 5px;
}

.formerror
{
    font-size: .75em;
    color: #f00;
    margin-left: 5px;
}

.formsenderror
{
    font-weight: bold;
    font-size: .7em;
    color: #f00;
    margin-left: 0px;
}

.formsent
{
    font-size: 1.1em;
    margin-left: 20px;
    font-weight: bold;
    color: #7070ff;
}

.mailing
{
    color: #44f;
}

.boldlink a:link
{
    color: #0000ff;
}

.boldlink a:visited
{
    color: #0000ff;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a generic header section
*/
#header1
{
    /*background-color: #FFFFFF;*/
    background-image:url(../images/header.png);
    border: 0px;
    height: 120px;
    border-bottom: 3px solid #000;

}
/*--------------------------------------------------------------------------*/
#header1image a
{
    margin-left: 16px;
    float: left;
    height: 112px;
    width: 272px;
    margin-top: 4px;
    background-image:url(../images/logos.png);
}

#header1image a:hover {
    background-position: 0px -112px; width: 272px; height: 112px;
}

#header1image a:active {
    background-position: 0px -112px; width: 272px; height: 112px;
}

/*--------------------------------------------------------------------------*/
#header1menu
{
    float: right;
    width: 180px;
    margin-right: 5px;
    margin-top: 16px;
}

/*==========================================================================*/
/*==========================================================================*/
/*
      We have a code for the menu section
*/
.menu_head {
    color: #1E1975;
    font-family: "Arial Black", sans-serif;
    font-size: 1.2em;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
}

.menu_head:hover {
    color: #0000ff;
}

.menuborder {
    border: 1px solid #1E1975;
}

.socialmedia
{
    border: 0px;
    margin: 0;
    padding: 100px 0px 0px 0px;
    font-size: 14px;
    font-weight: bold;
    color: #1E1975;
}

#menu
{
    float: right;
    width: 140px;
    height: 30px;
    margin: -78px 30px 0px 0px;
    padding: 0px;
    border: 0px;
}
#menu ul
{
    list-style: none;
    margin: 0;
    float: left;
    width: 140px;
}

#menu a
{
    display: block;
    background-image:url(../images/buttons/Rentals.png);
    color: #1E1975;
    text-decoration: none;
    text-align: center;
    line-height: 30px;
}

#menu a:hover
{
    color: #0000ff;
    background-position:left bottom;
}

#menu a:active
{
    color: #ff0000;
    background-position:left bottom;
}

#menu li
{
    font: .85em arial, helvetica, sans-serif;
    position: relative;
}

#menu ul ul ul
{
    position: absolute;
    top: 0;
    left: 100%;
}

#menu ul ul
{
    position: absolute;
    z-index: 500;
}

div#menu ul ul
{
    display: none;
}

div#menu ul li:hover ul
{display: block;}

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}

/*==========================================================================*/
/*==========================================================================*/
/*
     Header2 holds the date, breacrumb and search elements
*/
#header2
{
    background-color: #1E1975;
    border-top: 6px solid #1E1975;
    font-size: .70em;
    color: #D3D3D3;
    /*overflow: auto;*/
}

.header2table
{
    text-align: left;
    width: 99%;
}

.header2table-first
{
    width: 80px;
    padding-left: 15px;
    vertical-align: top;
    padding-top: 5px;
}

.header2table-bc
{
    padding-left: 5px;
    vertical-align: top;
    padding-top: 5px;
}

.header2-right
{
    width: 300px;
    /*text-align: right;*/
}


.breadcrumb     /* Style of breadcrumb */
{
    color: #D3D3D3;
    background-color: transparent;
    text-decoration: none;
}

.breadcrumb a:link, .breadcrumb a:visited
{
    text-decoration: none;
    color: #D3D3D3; text-decoration: none;
    background-color: transparent;
}

.breadcrumb a:hover
{
    color: #D3EB93;
    text-decoration: underline;
}

.breadcrumb a:active
{
    text-decoration: underline;
    color: #FF0000;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a generic footer section
*/
#footerbox
{
    clear: both;
    width: 780px;
    height: 40px;
    text-align: right;
}

.footerimage
{
    position: relative;
    margin-left: 20px;
    background-image: url(../images/contentcap.png);
    background-repeat: no-repeat;
    background-position: left top;
}

.footer
{
    color: #000000;
    font:bold .7em Arial;
    vertical-align: baseline;
    text-align: right;
    text-decoration: overline;
}

.footerlink a:link, .footerlink a:visited
{
    color: #000000;
    background-color: transparent;
    text-decoration: none;
}

.footerlink a:hover
{
    color: #0000FF;
    background-color: #D3EB93;
    text-decoration: underline;
}

.footerlink a:active
{
    color: #D3EB93;
    background-color: #FF0000;
    text-decoration: underline;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a generic main section
*/
#maincontent
{
    margin-top: 0px;                   /* required to move the left border into the arc */
    padding-left: 20px;                 /* give some space off the left */
    padding-top: 40px;                  /* starts the text lower than the lef border does */
    padding-bottom: 60px;               /* starts the text lower than the lef border does */
    border-left: solid 0px #5AA60E;       /* apply the left border from within this ID - no separate NAV section required */
}

#maincontentright
{
    float: right;
    width: 300px;
    background-color: #ffffff;
}

/*--------------------------------------------------------------------------*/
#maincontentbox /* Used for the main images on the home page */
{
    position: relative;
    width: 775px;
    height: 216px;
    margin: 0px;          /* centers the image in the space */
    padding: 0px 0px 0px 28px; /*was 33 for 164px */
    background-image: url(../images/green_box_home.png);
    background-repeat: no-repeat;
    background-position: left top;
}

.mainimagebox
{

    float: left;
    margin: 23px 8px 0px 0px;
    width: 174px;
    height: 174px;
    background-image:url(../images/images_main.png);

    border: 0;
}

.mainimagebox1
{
    background-position: 0px 0px; width: 174px; height: 174px;
}

.mainimagebox1:hover
{
    background-position: 0px -174px; width: 174px; height: 174px;
}

.mainimagebox2
{
    background-position: -174px 0px; width: 174px; height: 174px;
}

.mainimagebox2:hover
{
    background-position: -174px -174px; width: 174px; height: 174px;
}

.mainimagebox3
{
    background-position: -348px 0px; width: 174px; height: 174px;
}

.mainimagebox3:hover
{
    background-position: -348px -174px; width: 174px; height: 174px;
}

.mainimagebox4
{
    background-position: -522px 0px; width: 174px; height: 174px;
}

.mainimagebox4:hover
{
    background-position: -522px -174px; width: 174px; height: 174px;
}


/*--------------------------------------------------------------------------*/
#mainsubimagebox  /* used for the wide boxes below the main boxes */
{
    position: relative;
    width: 790px;
    height: 90px;
    margin-left: 5px;
    margin-top: 0px;
}
.mainsubimage
{
    float: left;
    margin: 0px;
    width: 357px;
    height: 87px;
    background-image:url(../images/images_sub_main-l.png);
}

.mainsubimage1
{
    margin-left: 23px;
    background-position: 0px 0px; width: 357px; height: 87px;
}

.mainsubimage1:hover
{
    background-position: 0px -87px; width: 357px; height: 87px;
}

.mainsubimage2
{
    margin-left: 9px;
    background-position: -357px 0px; width: 357px; height: 87px;
}

.mainsubimage2:hover
{
    background-position: -357px -87px; width: 357px; height: 87px;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a section for the sitemap layout
*/
.sitemap
{
}

.sitemap ul
{
    margin: 5px 0px 5px 20px;
    list-style-type: square;
}

.sitemap li
{
    list-style-type: square;
    padding: 1px 4px 1px 4px;
}

.sitemap a:link, .sitemap a:visited
{
    font-weight: bold;
    padding: 1px 4px 1px 4px;
    text-decoration: none;
    color: #444444;
    background-color: transparent;
    border: solid 2px transparent;
}

.sitemap a:hover
{
    font-weight: bold;
    padding: 1px 4px 1px 4px;
    background-color: #C9C3ED;
    border: solid 2px #D3EB93;
    color: #191970;
}

.sitemap a:active
{
    padding: 1px 4px 1px 4px;
    font-weight: bold;
    background-color: #C9C3ED;
    border: solid 2px #FF0000;
}

.validations a
{
    background-color: #FFFFF0;
    font-size: 2em;
}



/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a stuff for the content pages
*/
#contentback
{
    margin-top: 0px;
    margin-left: 20px;
    border: 0px;
}

#contentmenubox /* left navigation panel */
{
    float: left;
    width: 186px;
    border-top: 1px solid #c0c0c0;
    background-color: #D3EB93;
}

.contentmenubgimage {
    width: 186px;
    height: 30px;
    margin-bottom: 0px;
}

#contentmenulist {
        background-color: #5aa60e;
}

/*--------------------------------------------------------------------------*/
#contenttext /* main text */
{
    margin-left: 200px;
    padding-left: 20px;                 /* give some space off the left */
    padding-top: 14px;                  /* starts the text lower than the lef border does */
    padding-bottom: 15px;               /* starts the text lower than the lef border does */
}

/*--------------------------------------------------------------------------*/
#contentmenuimagebox /* Used for the main images on the content pages */
{
    width: 180px;
    height: 256px;
    padding-left: 6px;
    padding-bottom: 0px;
    padding-top: 15px;
    background-color: #5aa60e;

}

.contentmenuimage
{
    float: left;
    margin: 0px 3px 6px 3px;
    width: 76px;
    height: 76px;
    border: 2px solid #1E1975;
    color: #ffffff;
    font-size: 0.55em;
    background: #1E1975;
    text-decoration: none;
    text-align: center;
    vertical-align: baseline;
    font-family: Arial, sans-serif;
    text-transform: uppercase;
}

.contentmenuimage:hover
{
    border: 2px solid #D3EB93;
    background-color: #D3EB93;
    color: #1E1975;
}

.contentmenuimage:active {
    border: 2px solid #FF0000;
    background-color: #D5ED97;
    color: #ff0000;
}

.locationimage
{
    float: right;
    margin: 10px 0px 10px 10px;
    padding: 2px;
    border: 1px solid #1E1975;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      We have a generic content menu section

      we call the menu using
            <div class="arrowgreen" style="margin-top:1em"> for green or
            <div class="arrowgreen altblue" style="margin-top:1em"> for blue

            Also, set the selected class for a selected menu item
*/
.arrowgreen{
    width: 162px; /*width of menu*/
    border-style: solid solid none solid;
    border-color: #94AA74;
    border: 1px;
    border-width: 1px;
    margin-left: 11px;
    margin-bottom: 10px;
}

.arrowgreen ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.arrowgreen li a{
    font: bold 11px Arial, sans-serif;
    /*text-transform: uppercase;*/
    display: block;
    background: transparent url(../images/arrowgreen.png) 100% 0;
    height: 24px; /*Set to height of bg image- padding within link (ie: 32px - 4px - 4px)*/
    padding: 4px 0 4px 10px;
    line-height: 24px; /*Set line-height of bg image- padding within link (ie: 32px - 4px - 4px)*/
    text-decoration: none;
}

.arrowgreen li a:link, .arrowgreen li a:visited {
    color: #1E1975; /*#5E7830;*/
}

.arrowgreen li a:hover{
    color: #5E7830; /*#26370A;*/
    background-position: 100% -32px;
}


.arrowgreen li a.selected{
    color: #1E19BD; /*#26370A;*/
    background-position: 100% -64px;
}
/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Location Map
*/
.selectionmap p
{
    font-size: .8em;
}

.selectionmap img
{
    margin-top: 10px;
    width: 550px;
    height: 367px;
    background-color: #FFFFF7;
    border: solid 3px #000080;
}

.treetabletree
{
    vertical-align: top;
    border-right: solid 3px #000;
    padding-right: 3px;
}

.treetablecontent
{
    padding-left: 4px;
    vertical-align: top;
}

.rounded-corner
{

    overflow: auto;
    margin: 10px 0px 10px 0px;
    /*width: 570px;*/
    text-align: left;
    border-collapse: collapse;
    font-size: 1em;
    color: #000;
}

.rounded-corner-jobs
{
    font-size: 1em;
}

.rounded-corner-500
{
    width: 500px;
}


.rounded-corner-570
{
    width: 570px;
    font-size: .8em;
}

.rounded-corner-550
{
    width: 550px;
    font-size: .8em;
}

.rounded-corner-550 td
{
    text-align: center;
}

.rounded-corner-650
{
    width: 650px;
}

.rounded-center-bold
{
    font-weight: bold;
}

.rounded-corner-margin
{
    margin: 20px 5px 20px 0px;
}


.rounded-corner thead th.rounded-left
{
    background: #b9c9fe url('../images/table-images/left.png') no-repeat left top;
}
.rounded-corner thead th.rounded-right
{
    background: #b9c9fe url('../images/table-images/right.png') no-repeat right top;
}
.rounded-corner th
{
    padding: 8px;
    font-weight: bold;
    font-size: .8em;
    color: #039;
    background: #b9c9fe;
    text-align: center;
    line-height: 1.1em;
}
.rounded-corner td
{
    padding: 8px;
    background: #e8edff;
    border-top: 1px solid #fff;
    line-height: 1.8em;
    font-size: .8em;
}
.rounded-corner thead th.rounded-center-align, .rounded-corner tbody td.rounded-center-align
{
    text-align: center;
}

.rounded-corner thead th.rounded-left-align, .rounded-corner tbody td.rounded-left-align
{
    text-align: left;
}

.rounded-corner thead th.rounded-right-align, .rounded-corner tbody td.rounded-right-align
{
    text-align: right;
}

.rounded-corner tfoot td.rounded-foot-left
{
    line-height: .5em;
    color: #669;
    background: #e8edff url('../images/table-images/botleft.png') no-repeat left bottom;
}
.rounded-corner tfoot td.rounded-foot-right
{
    line-height: .5em;
    color: #669;
    background: #e8edff url('../images/table-images/botright.png') no-repeat right bottom;
}

.rounded-corner tbody tr:hover td
{
    background: #d0dafd;
}

.rounded-corner a:link, .rounded-corner a:visited
{
    text-decoration: none;
    color: #00007f;
    background-color: transparent;
}

.rounded-corner a:hover
{
    color: #00007f;
    background-color: #D3EB93;
    text-decoration: underline;
}

.rounded-corner a:active
{
    color: #D3EB93;
    background-color: #FF0000;
    text-decoration: underline;
}

.rounded-state
{
    color: #00009F;
    font-size: 1.2em;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Media Page
*/
.articleheading {
    padding: 5px 0px 5px 0px;
}

.articletitle {
    padding-top: 5px;
}

.articledescription {
    padding-top: 5px;
    padding-left: 10px;
    margin-right: 10px;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Support Page
*/
.legal p
{
    margin-top: 5px;
    font-size: .8em;
}

.footnote
{
    margin-top: 0px;
    font-size: .85em;
}

.underline
{
    text-decoration: underline;
}

.job table
{
    border: 1px;
    padding: 2px;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Forms
*/
.theforms label
{
    font-weight: bold;
    color: #1E1975;
}

.theforms p
{
    margin-bottom: 10px;
    color: #00007f;
    font-size: .8em;
    /*width: 410px;*/
}

.FormSearchInput
{
    color: #000000;
    font:bold 1.15em Arial;
    background: #ccdabc;
    /*border: 2px outset #d7b9c9*/

    border-width: 2px;
    border-style: solid;
    border-color: #ccc #888 #555 #bbb;
}

.FormSearchInput:hover
{
    background-color: #C9C3ED;
    border: solid 2px #D3EB93;
    color: #191970;
}

.FormSearchInput:active
{
    background-color: #C9C3ED;
    border: solid 2px #FF0000;
    color: #ff0000;
}

.forminput {
    margin-top: 3px;
    border: solid 1px #1E1975;
    width: 400px;
    background-color: #FFFFff;
    font-size: .9em
}

.forminput-120 {
    width: 120px;
}

.forminput-200 {
    width: 200px;
}

.forminput-message
{
   /*height: 300px;*/
    /*width: 550px;*/
    vertical-align: top;
    font-size: 1.1em
}

.forminput:hover, .forminput:focus
{
    border: solid 1px #D3EB93;
}

.forminput:active
{
    border: solid 1px #FF0000;
}

.changeinput {
    margin-left: 10px;
    border: solid 1px #1E1975;
    background-color: #F0F0F0;
    font-size: 1em
}

.changeinput300
{
    width: 300px;
}

.changeinputmid
{
    width: 160px;
    background-color: #F0F0F0;
    border: solid 1px #000000;
}

.changeinputmid:hover
{
    border: solid 1px #D3EB93;
}

.formsubmit
{
    background: transparent;
    width: 120px;
    height: 30px;
    background-image:url(../images/buttons/Submit.png);
}

.formsubmit:hover
{
    background-position:left bottom;
}

.myfileinput a
{
    display: block;
    width:80px;
    height:22px;
}

.browseinputImage
{
    width: 314px;
    margin-left: 5px;
}

.myfileinputfile
{
    position: relative;
    left: 0px;
    top: -22px;
}

/*==========================================================================*/
/*==========================================================================*/
/*==========================================================================*/
/*
      Special buttons
*/

.web-buttons-backtomap
{
    display:block;
    background-image:url(../images/buttons/BackToMap.png);
    width:120px;
    height:30px;
}

.web-buttons-backtomap:hover
{
    background-position:left bottom;
    border: 0px;
}

.web-buttons-logout
{
    margin-bottom: 10px;
    border: 0px;
    display:block;
    background-image:url(../images/buttons/Logout.png);
    width:120px;
    height:30px;
}

.web-buttons-logout:hover
{
    background-color: transparent;
    background-position:left bottom;
}

.web-buttons-login
{
    margin-bottom: 10px;
    border: 0px;
    display:block;
    background-image:url(../images/buttons/Login.png);
    width:120px;
    height:30px;
}

.web-buttons-login:hover
{
    background-position:left bottom;
}

.web-buttons-jobapplication-box
{
    padding: 5px 0px 0px 30px;
    width:120px;
    height:30px;
}

.web-buttons-jobapplication
{
    display:block;
    background: transparent;
    text-decoration: none;
    background-image:url(../images/buttons/JobApply.png);
    width:120px;
    height:30px;
}

.web-buttons-jobapplication:hover
{
    background-position:left bottom;
    text-decoration: none;
}


/*==========================GOOGLE PART===================================*/
/**
 * Default theme
 *
*/
/* Slight reset to make the preview have ample padding. */
.cse .gsc-control-cse,
.gsc-control-cse {
    padding: 0px;
    width: 250px;
}
.cse .gsc-branding,
.gsc-branding {
    display: none;
}
/* Selector for entire element. */
.cse .gsc-control-cse,
.gsc-control-cse {
    background-color: #1E1975;
}
.cse .gsc-control-cse:after,
.gsc-control-cse:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}
.cse .gsc-resultsHeader,
.gsc-resultsHeader {
    border:none;
}

.gsc-input {
    border: 1px solid;
    border-color: #ffffff;

}

.gsc-input:hover {
    border: 1px solid;
    border-color: #D3EB93;

}

/* Search button */
.cse input.gsc-search-button,
input.gsc-search-button {
    font-family:arial,sans-serif;
    padding-bottom: 0px;
    font-size: 12px;
    color: #1E1975;
    border: 0;

    background: transparent;
    width: 60px;
    height: 22px;
    background-image:url(../images/buttons/GSearch.png);
}
.cse:hover input.gsc-search-button:hover,
input.gsc-search-button:hover {
    color: #00f;

    background-image:url(../images/buttons/GSearch.png);
    background-position:left bottom;

}
/* Inactive tab */
.cse .gsc-tabHeader.gsc-tabhInactive,
.gsc-tabHeader.gsc-tabhInactive {
    border-bottom: none;
    color: #666666;
    background-color: #e9e9e9;
    border: 1px solid;
    border-color: #e9e9e9;
    border-bottom: none;
}
/* Active tab */
.cse .gsc-tabHeader.gsc-tabhActive,
.gsc-tabHeader.gsc-tabhActive {
    background-color: #FFFFFF;
    border: 1px solid;
    border-top: 2px solid;
    border-color: #e9e9e9;
    border-top-color: #FF9900;
    border-bottom: none;
}
/* This is the tab bar bottom border. */
.cse .gsc-tabsArea,
.gsc-tabsArea {
    margin-top: 1em;
    border-bottom: 1px solid #e9e9e9;
}
/* Inner wrapper for a result */
.cse .gsc-webResult.gsc-result,
.gsc-webResult.gsc-result {
    padding: .25em;
    border: 1px solid;
    border-color: #ffffff;
    margin-bottom: 1em;
}
/* Result hover event styling */
.cse .gsc-webResult.gsc-result:hover,
.gsc-webResult.gsc-result:hover {
    border: 1px solid;
    border-color: #FFFFFF;
}
/*Promotion Settings*/
/* The entire promo */
.cse .gs-promotion.gs-result,
.gs-promotion.gs-result {
    background-color: #FFFFFF;
    border: 1px solid;
    border-color: #336699;
}
/* Promotion image */
.cse .gs-promotion.gs-result .gs-promotion-image,
.gs-promotion.gs-result .gs-promotion-image {}
/* Promotion title */
.cse .gs-promotion.gs-result a.gs-title:link,
.gs-promotion.gs-result a.gs-title:link {
    color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:visited,
.gs-promotion.gs-result a.gs-title:visited {
    color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:hover,
.gs-promotion.gs-result a.gs-title:hover {
    color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:active,
.gs-promotion.gs-result a.gs-title:active {
    color: #0000CC;
}
/* Promotion snippet */
.cse .gs-promotion.gs-result .gs-snippet,
.gs-promotion.gs-result .gs-snippet {
    color: #000000;
}
/* Promotion url */
.cse .gs-promotion.gs-result .gs-visibleUrl,
.gs-promotion.gs-result .gs-visibleUrl {
    color: #008000;
}