/* Datalou main site styles, last updated 02-22-16 --- */

/********************************************
        Tag Resets
********************************************/
#custom-vdesign
footer{  background: #666666 none repeat scroll 0 0;    color: #ffffff;    padding-bottom: 0px;     padding-top: 15px; float:left; width:100%;}
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section {margin: 0; padding: 0; border: 0; }
/********************************************
        Normalize CSS
        http://necolas.github.com/normalize.css/
********************************************/
*{ border-radius: 0px !important;}

html {
    height: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    min-height: 100%;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
}
a.get-started{font-family: "open_sansbold", "Helvetica Neue", Helvetica, sans-serif;
              text-decoration:none;
              color: #000;
}

h1.welcome-to-datalou{
    font-family: "open_sanslight", "Helvetica Neue", Helvetica, sans-serif;
    font-weight:100; 
    text-decoration:none;
    color: #fff;
}


h2.where-brands{
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    text-decoration:none;
    color: #fff;
}
ul.menu-options{
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    text-decoration:none;
    color: #fff;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
audio,
canvas,
video {
    display: block;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

b,
strong {
    font-weight: bold;
}

abbr[title] {
    border-bottom: 1px dotted;
}

input,
textarea,
button,
select {
    margin: 0;
    font-size: 100%;
    line-height: normal;
    vertical-align: baseline;
    color: #666;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
}

input[type="checkbox"],
input[type="radio"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

textarea {
    overflow: auto;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}



.dashboard{
    height:600px ;
    width:600px ;
    virtical-align:bottom ; 
    display:inline-block ;
    background: url('../images/dashboard.png') no-repeat 0 0 ;
    margin: 0 10px 0px 0px !important;

}
.pdfmailexcel{
    height:33px;
    width:47px;
    virtical-align:bottom;
    display:inline-block;
    background: url('../images/xls_r.png')no-repeat 0 0;
    margin: 0 10px 0px 0px !important;
}
.pdfmailexcel:hover {
    background: url('../images/xls.png');

}
.pdfling{
    height:33px;
    width:47px;
    virtical-align:bottom;
    display:inline-block;
    background: url('../images/pdf_r.png')no-repeat 0 0;
    margin: 0 5px 0px 0px !important;
}
.pdfling:hover {
    background: url(../images/pdf.png);
}
.mailing{
    height:33px;
    width:55px;
    virtical-align:bottom;
    display:inline-block;
    background: url('../images/email_r.png')no-repeat 0 0;

    margin: 0 5px 0px 0px !important;
}

.mailing:hover {
    background: url('../images/email.png');
}
.checkboxp{
    margin: 0px 0px 0px 75px !important;
    width: 15px;
}
.check_label{
    margin: 0em 0em -1.1em 2em !important;
}
.check-label-h{
}
.check-labelh{
    margin: 0em 0em -1.1em 0em !important;
}
.check-label-selectall{
    margin: -22px 0px -1.1px 19px !important;
}
.checkboxp-selectall {
    margin: -16px 0px 12px 84px !important;
    width: 15px; 
}
.check-label-dselectall{
    margin: -30px 0px 0px 0px !important;
}
.checkboxp-dselectall {
    margin: -17px 0px 0px 84px !important; 
    width: 15px; 
}
.checkboxp-selectall-header {
    margin: -16px 0px 12px 110px !important;
    width: 15px;
}
.checkboxp-dselectall-header{
    margin: -17px 0px 0px 110px !important;
    width: 15px;
}
.cust-row{
    margin-right: -15px;
    margin-left: -15px;
    text-align: center;
}

/* ******************************************
        Web Fonts
****************************************** */

@font-face {

    font-family: 'open_sansregular';
    src: url('fonts/opensans-regular-webfont.eot');
    src: url('fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/opensans-regular-webfont.woff') format('woff'),
        url('fonts/opensans-regular-webfont.ttf') format('truetype'),
        url('fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'open_sanslight';
    src: url('fonts/Open_Sans/OpenSans-Light.ttf');
    font-weight: lighter;
    font-style: normal;
}
@font-face {
    font-family: 'open_sansbold';
    src: url('fonts/Open_Sans/OpenSans-Bold.ttf');
    font-weight: lighter;
    font-style: normal;
}

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,300,400,600,700);


/* ******************************************
        Custom Styles
****************************************** */

/*	  For details on font-size:100% see here:
      http://filamentgroup.com/lab/how_we_learned_to_leave_body_font_size_alone/

          For details on line-height:1 see here:
      http://meyerweb.com/eric/thoughts/2008/05/06/line-height-abnormal/

          For details on text-size-adjust:100% see here:
          https://developer.mozilla.org/en-US/docs/CSS/text-size-adjust
*/

html {
    font-size: 100%;
    line-height: 1;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    background-color: #fff;
    font-size: 12px;
}
/*a, a:link, a:visited {
        text-decoration:underline;
        color:#d6692a;
        font-style:normal;
}
a:hover, a:active {
        color:#959c9c;
        font-style:normal;
}*/
p {
    font-size: 0.9em; /* 17px / 16 = 1.063em */
    line-height: 1.5; /* 1.3 / 1.063 = 1.223 */
    margin: .612em 0;
    color: #333;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
}
p.date {
    font-size: 0.7em; /* 17px / 16 = 1.063em */
    line-height: 1; /* 1.3 / 1.063 = 1.223 */
    margin: .612em 0;
    color: #666;
}
.barone p strong, .bartwo p strong, .barthree p strong, .sidebar p strong {
    text-transform: uppercase;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 100;
    color: #333;
}
h1 {
    font-size: 2.8em;
    line-height: 1.25;
    margin-bottom: 0.4em;
}
h1 span.smallh1 {
    font-size: 0.4em;
    color: #333;
}
h2 {
    font-size: 2em;
    line-height: 1.25;
    margin-bottom: 0.5em;
}
#search-supplier h1 {
    color: #ebe83f;
}

#home { font-family: 'Open Sans', sans-serif !important;
        text-align: center;
        background: #333 url(../images/search-supplier-s.jpg) no-repeat center top;
        -webkit-background-size: 100%;
        -moz-background-size: 100%;
        background-size: 100%;
        width: 100%; height: 0px;
        margin-top: 0;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 51%;
        padding-left: 0;
}

/*#dashboard {

    position: relative; 	
    background: #333 url(../images/dashboard-1.png) no-repeat center top;
     Preserve aspet ratio 
    min-width: 100%;
    min-height: 569px;
    background-repeat: repeat-y;
    background-position: top;
    
    repeat-y center top
}*/
#dashboard {
    background: url(../images/dashboard-1.png) repeat-y center top;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    background-size: 100%;
    width: 100%;
    height: 579px;
    margin-top: 0%;
    padding-top: 10%;
    padding-right: 0;
    padding-bottom: 2.5%;
    padding-left: 0;
    float: left;
    clear: both;
}
#dashboard #home-yellow-translucent h2 {
    color: #484848;
    font-size: 20px;
    line-height: 1em;
    font-weight: 300;
    text-align: center;
    width: 100%;
}
#dashboard #home-yellow-translucent h1 {
    color: #484848;
    font-size: 60px;
    line-height: 0.85em;
    font-weight: 300;
    text-align: center;
    width: 100%;
}

#dashboard #home-yellow-translucent #content-container {
    margin-top: 10px;
    padding-top: 0px;
    padding-bottom: 10px;
    margin-top: 10%;
    height: auto;
}



#home #home-yellow-translucent {
    background: url(../images/home-yellow.png) repeat-y center top;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    background-size: 100%;
    width: 100%; height: auto;
    margin-top: 6%;
    padding-top: 10%;
    padding-right: 0;
    padding-bottom: 2.5%;
    padding-left: 0;
    float: left; clear: both;
}
#home #home-yellow-translucent #content-container { margin-top: 0px; padding-top: 0px; padding-bottom: 10px; margin-top: -6%; height: auto; }

#home #home-yellow-translucent h1 { color: #fff; font-size: 60px; line-height: 0.85em; font-weight: 300; text-align: center; width: 100%;  }
#home #home-yellow-translucent h2 { color: #fff; font-size: 20px; line-height: 1em; font-weight: 300; text-align: center; width: 100%; }
#home #home-yellow-translucent p  { color: #000; font-size: 10px; line-height: 1em; text-transform: uppercase; text-align: center; padding: 5px 1px; background-color: #fff; margin: 25px auto; width: 25%; max-width: 80px; min-width:75px; }

h2.center, h3.center, h4.center, p.center,.center { text-align: center; }

div.centerbox {
    margin-left: auto;
    margin-right: auto;
    display: table;
    padding-bottom: 45px;
}
/*h1, h2 {
        text-shadow: 0 1px 1px rgba(0, 0, 0, .25);
}*/
h3 {
    font-size: 1.1em;
    line-height: 1.5;
    margin-bottom: 0.8em;
    text-transform: uppercase;
}
h4 {
    font-size: 0.9em;
    line-height: 1.5;
    margin-bottom: 0.5em;
}
#header-banner, .header-group  {
    margin-bottom: 8px;
}

#intro.header-group, #about.header-group { margin: 0px; padding-top: 50px; padding-bottom: 65px; float: left; clear: both; width: 100%; }
#intro.header-group p, #deliver.header-group p, #about.header-group p { font-size: 16px; }
#intro.header-group p + h2 { padding-top: 30px !important; }
#about.header-group p + h2 { padding-top: 30px !important; }
#intro.header-group h3, #deliver.header-group h3, #about.header-group h3 { line-height: 1.125em; }

#contact.header-group { min-width: 100% !important; float: left; clear: both; margin-left: 0px; margin-right: 0px; }

#contact.header-group >h2 { color: #fff; background-color: #ebe83f; width: 100%; min-height: 20px; padding: 33px 0 33px 0; margin-bottom: 0px; text-align: center !important; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); }

.iframeWrapper {
    width: 100%;
    position: relative;
    padding-bottom: 35%;
    padding-top: 0px;
    height: 0;
    text-align: center !important;
    clear: both;
}

.iframeWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none !important;
    overflow: hidden !important;
}

#deliver { color: #fff; font-family: 'Open Sans', sans-serif !important;
           text-align: center;
           background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
           -webkit-background-size: 100%;
           -moz-background-size: 100%;
           background-size: 100%;
           width: 100%; height: 0;
           margin-top: 0;
           padding-top: 0;
           padding-right: 0;
           padding-bottom: 51%;
           padding-left: 0;
           float: left; clear: both;
           margin-left: 0px
}

#intro .group, #deliver .group, #about .group, #contact .group { max-width: 940px; margin-right: auto; margin-left: auto; float: none; clear: both; }


#deliver .group, #deliver .group h2, #deliver .group h3, #deliver .group p { color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.87); clear: both; }

#deliver .group { max-width: 940px; padding-top: 2%; padding-bottom: 2%; margin: 0px auto 0px auto; height: auto; clear: both; }

#deliver.header-group h3, #about.header-group h3 { font-size: 25px; margin-top: 25px; margin-bottom: 5px; }

#header-banner h1, #header-banner p, .header-group h1, .header-group p {
    text-align: center;
}
#header-banner h1, .header-group h1 {
    font-weight: 100;
    font-size: 2em;
    margin: 0px;
}
#header-banner p, .header-group p {
    font-weight: 100;
    font-size: 0.75em;
    margin: 0px;
}
#quote {
    float: right;
    width: 45%;
}
#quote p em {
    font-style: normal;
    font-size: 1em;
    color: #d1f4fb;
    padding-top: 12px;
}
#quote p {
    font-size: 1.8em;
    line-height: 1.2em;
    color: #CCCCCC;
    margin:0;
}
p.breadcrumbs {
    color: #999;
    font-size: 0.8em;
}
.wrapper {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 0;
    padding-right: 0.65em;
    padding-bottom: 0;
    padding-left: 0.65em;
}
.clearfloat {
    clear:both;
    height:0;
    font-size:1px;
    line-height:0px;
}

/* Navigation */
#container-nav-home {
    padding-right: 0;
    padding-bottom: 0.75em;
    padding-left: 0;
    background-color: transparent;
}
#container-nav {
    padding-top: 0.75em;
    padding-right: 0;
    padding-bottom: 0.75em;
    padding-left: 0;
    background-color: #fff;
}

#topnav { }
#topnav figure#logo, #topnav-home figure#logo {
    float: left;
}
#topnav figure#logo a, #topnav-home figure#logo a {
    text-decoration: none;
    padding: 0;
}
#topnav figure#logo a:hover, #topnav-home figure#logo a:hover {
    background-color: transparent;
}
#topnav ul {
    list-style: none;
    margin-top: 0.65em;
    margin-right: 0;
    margin-bottom: 0.25em;
    margin-left: 0;
    padding-top: 0.75em;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    float: right;
    font-size: 90%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #343434;
}

#topnav li {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #343434;
}

#topnav a {
    display: block;
    font-size: 1em;
    color: #9C9C9C;
    text-decoration: none;
    padding-top: 0.975em;
    padding-right: 1em;
    padding-bottom: 0.975em;
    padding-left: 1em;
}

#topnav a:hover {
    background-color: #484848;
}
#topnav a.select {
    color:#d6692a;
}
#topnav nav, #topnav-home nav {
    height: 0;
    overflow: hidden;
}
#topnav nav img, #topnav-home nav img {
    margin: 0px;
    padding: 0px;
    float: none;
    vertical-align: bottom;

}
#topnav-home ul {
    list-style: none;
    margin-top: 0.65em;
    margin-right: 0;
    margin-bottom: 0.25em;
    margin-left: 0;
    padding-top: 0.75em;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    float: right;
    font-size: 90%;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #343434;
}

#topnav-home li {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #343434;
}

#topnav-home a {
    display: block;
    font-size: 0.8em;
    color: #ebe83f;
    text-decoration: none;
    padding-top: 0.975em;
    padding-right: 1em;
    padding-bottom: 0.975em;
    padding-left: 1em;
}

#topnav-home a:hover { background-color: #484848; }
#topnav-home a.select {	color:#d6692a; }

#home #container-nav { background-color: transparent !important; margin-top: 0px !important; }
#home #container-nav #topnav { margin-top: 0px !important; }
#home #topnav a { color: #fff; }

#home #topnav a:hover {	background-color: transparent; color: #ebe83f; }
#home #topnav a.select { color:#d6692a; }


#topnav,
#banner,
#content-container,
#contact,
#colophon
#header-banner, .header-group { margin: 0 5%; }

#content-container, .header-group {	margin-top: 3em; padding-bottom: 30px; }

.header-group + #header-banner { margin-top: 3em; }


.funtions-row { text-align: center !important; margin: 5px auto 5px auto; padding: 15px 0 20px 0; clear: both; width: 100% }
.funtions-row input, .funtions-row input.buttom { float: none !important; clear: none !important; display: inline-block; margin-bottom: 10px; }

.columns {
    width: 100%; max-width: 960px;
    margin-right: auto; margin-left: auto;
    text-align: left;
    margin-top: 20px; margin-bottom: 0px;
    clear: both !important;
}

.columns .col {
    display: inline-block;
    margin: 0 0 20px;
    width: 49.5%;
    max-width: 460px;
    position: relative;
    vertical-align: top;
    float: left;
}

.columns .col img { width: 100%; height: auto; clear: both; margin-bottom: 5px; }

.columns .three { width: 100% }

.columns .three .col { display: inline-block;	width: 32.5%; }

.columns .col h4.heading {
    color: #999;
    text-transform: uppercase;
    width: 95%;
    margin: 0 0 10px -10px;
    font-size: 1.125em;
    line-height: 1.25em;
    /* padding: 0.65em; */
    padding: 7px 7px 7px 8px !important;
    background-color: #f6f4f5;
    border: 1px solid #CCCCCC;
    clear: both;
}

.columns .col a { color: #239fdb; text-decoration: none; }
.columns .col a:hover { color: #999; text-decoration: underline; }

.columns .col h2, .columns .col h3, .columns .col p { text-align: left; }
.columns .col h2, .columns .col h3 { font-size: 1.25em;  }
.columns .col p { font-size: 0.9em; margin-bottom: 1.5em; width: 95%; }

.columns .col + .col { float: right; margin-right: 0px; }

.columns .three .col + .col { float: left; margin-left: 1.25%; }
.columns .three .col + .col + .col { float: right; margin-right: 0px; }

.columns .col .funtions-row { text-align: justify !important; padding-top: 0px; margin-top: 0px; }

.columns .col .funtions-row input.button { margin: 0 0 5px 0; border: #ccc solid 1px; background-color: #fff; font-size: 0.75em; line-height: normal; width: auto !important; height: auto !important; min-width: 70px; padding-top: 5px !important; padding-bottom: 5px !important;  }

.columns .col .funtions-row input.button:hover, h2.funtions-row input.button:hover { background-color: #ccc; }
.columns .col .funtions-row input.button + input.button + input.button { float: right !important; }

.header-group h2.funtions-row { }
.header-group h2.funtions-row input.button { margin: 0 0 5px 0px !important; border: #ccc solid 1px !important; background-color: #fff !important; font-size: 0.4em !important; line-height: normal !important; width: auto !important; height: auto !important; min-width: 60px !important; padding-top: 5px !important; padding-bottom: 5px !important; vertical-align: middle !important; }
.header-group h2.funtions-row input.button:hover { background-color: #ccc !important; }

article.sidenav {
    float: left;
    width: 99%;
}
article.sidenav p.bar {
    background-color: #999;
    float: left;
    width: 0.35em;
    margin-right: 2px;
    padding-top: 0.65em;
    padding-right: 0.1em;
    padding-bottom: 0.65em;
    padding-left: 0.1em;
}
article.sidenav p.bar.select {
    background-color: #ebe83f;
}

article.sidenav p {
    margin: 0px;
    padding: 0px;
    float: left;
    width: 95%;
}
article.sidenav p a, article.sidenav p a:link, article.sidenav p a:visited {
    display: block;
    background-color: #525252;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    padding-top: 0.65em;
    padding-right: 0.1em;
    padding-bottom: 0.65em;
    padding-left: 0.5em;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 5px;
    margin-left: 0px;
}
article.sidenav p a:hover, article.sidenav p a:active {
    background-color: #999;
}
article.sidenav p a.chosen {
    background-color: #ebe83f !important;
    color: #333;
    text-transform: capitalize;
}
#sidebar {
    float: left;
    width: 35%;
}
#sidenavbars {
    float: left;
    width: 35%;
}
article.barone, article.bartwo, article.barthree {
    float: left;
    width: 32%;
    margin-left: 8px;
}

article.content {
    float: left;
    width: 60%;
    margin-left: 10px;
}
article.news {
    float: left;
    width: 99%;
    margin-bottom: 15px;
}
article.news img {
    float:left;
    width: 200px;
    margin-right:15px;
}
article.colfirst, article.colsecond {
    padding: 0.125em;
    float: left;
    width: 44%;
    margin-bottom: 15px;
    margin-top: 12px;
    margin-right: 5px;
}
article.colone, article.coltwo, article.colthree {
    padding: 0.125em;
    float: left;
    width: 30%;
    margin-bottom: 15px;
    margin-top: 12px;
    margin-right: 5px;
}
article.searchone {
    padding: 0.125em;
    float: left;
    width: 35%;
    margin-bottom: 15px;
    margin-top: 12px;
    margin-right: 5px;
}
article.searchtwo {
    padding: 0.125em;
    float: left;
    width: 25%;
    margin-bottom: 15px;
    margin-top: 12px;
    margin-right: 5px;
}
article.searchthree {
    padding: 0.125em;
    float: left;
    width: 25%;
    margin-bottom: 15px;
    margin-top: 12px;
}
article.formone, article.formtwo {
    padding: 0.125em;
    float: left;
    width: 45%;
    margin-bottom: 10px;
    margin-top: 12px;
    margin-right: 5px;
}
article.smallone, article.smalltwo, article.smallthree, article.smallfour {
    padding: 0.125em;
    float: left;
    width: 23%;
    margin-bottom: 10px;
    margin-top: 12px;
    margin-right: 5px;
}

article.floatright {
    padding: 0.125em;
    float: left;
    width: 46%;
    margin-bottom: 10px;
    margin-top: 12px;
    margin-right: 5px;
    text-align: center;
}
article.icon {
    float: left;
    width: 23%;
    margin-bottom: 15px;
    margin-top: 12px;
    padding: 0.125em;
}
article.icon img {
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
}
article.icon h4 {
    text-align: center;
}
.footercontainer {
    margin: 0 9%;
}
.col-foot1{
    float: left;
    width: 50%;
}
.col-foot2{
    float: right;
    width: 50%;
    text-align: right;
}
.footerinner {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: 0.8rem;
    background-color: #efefef;
}
.col-foot1-inner{
    float: left;
    left: 10%;
    margin-left: 100px;
}
.col-foot2-inner{
    float: right;
    right: 10%;
    margin-right: 100px;
}
.col-foot2-inner a:hover{
    color: #666666 !important; 
}
#footer {
    padding-top: 50px;
    padding-bottom: 50px;
    color: #999;
    bottom: 0;
    font-size: 0.7em;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    text-transform: uppercase;
}
#footer a {
    color: #999;
}
#footer a:hover {
    color: #ebe83f;
}
#footer ul {
    list-style: none;
    padding: 0;
    margin: 0 -7.5px;
}
#footer ul > li {
    display: inline-block;
    margin: 0 7.5px;
}

@media only screen and (min-width: 768px) {
    #footer .social-icons {
        float: right;
    }
}

/*#content-container figure:hover {
                 bottom: .25em;
}*/
article.icon:hover {

    border-radius: 1em;
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 1.325em .15em rgba( 0, 0, 0, .1 );
}
article.bio {
    float: left;
    width: 30%;
    margin-right: 1em;
}
.bio img {
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    padding: .5em; /* 3/4 of 1.3 */
}
/*#container-footer {
        padding-top: 3em;
        padding-bottom: 1.5em;
        margin-top: 5em;
}*/
#colophon {
    color: #999;
}
span.orange {
    color:#d6692a;
}
#content-container ul, .header-group ul {
    margin-left: 1em;
    font-size: 0.9em;
    line-height: 1.5;
    margin-bottom: 45px;
}
#content-container li, .header-group li {
    color:#d6692a;
    margin-bottom: 0.5em;
}
#content-container li span, .header-group li span {
    color: #30302f;
}

img {
    max-width:100%;
    height:auto;
}

#sidenav {
    float: left;
    width: 18%;
}
nav#side {
    font-size: 90%;
}
nav#side ul {
    list-style-type: none;
    margin: 0px;
}
nav#side li {
    margin-bottom: 0.6em;
}
nav#side li a {
    display: block;
}
nav#side a, nav#side a:link, nav#side a:visited {
    text-decoration: none;
    color: #666;
}
nav#side a:hover, nav#side a:active {
    color: #CF692A;
}
nav#side a.chosen {
    color: #CF692A;
}
nav#side ul ul {
    margin-left: 0.75em;
}
nav#side ul li ul li {
}
nav#side img {
    float: left;
    width: auto;
    margin-right: 0.5em;
    clear:both;
}
#thumbs {
    float: right;
    width: 80%;
}
article.thumb {
    float: left;
    width: 48%;
    margin-bottom: 1em;
    margin-right: 0.5em;
}

.thumb img {
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    padding: .1em; /* 3/4 of 1.3 */
}

.thumb img:hover {
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 1.325em .13em rgba( 0, 0, 0, .1 );
}
#thumbslanding {
    float: right;
    width: 80%;
}
article.thumbsmall {
    float: left;
    width: 32%;
    margin-bottom: 1em;
    margin-right: 0.2em;
}
.thumbsmall img {
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    padding: .2em; /* 3/4 of 1.3 */
}

.thumbsmall img:hover {
    background: #fff;
    -moz-box-shadow: 0 0 1.325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 1.325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 1.325em .13em rgba( 0, 0, 0, .1 );
}
.thumbsbig img {
    background: #fff;
    -moz-box-shadow: 0 0 .125em .03em rgba( 0, 0, 0, .2 );
    -webkit-box-shadow: 0 0 .125em .03em rgba( 0, 0, 0, .2 );
    box-shadow: 0 0 .125em .03em rgba( 0, 0, 0, .2 );
}
#thumbsmain {
    float: left;
    width: 70%;
}
article.thumbsbig {
    margin-bottom: 2.25em;
    margin-right: 0.04em;
}

#description {
    float: left;
    width: 30%;
    margin-bottom: 2em;
}
article.descp {
    margin-bottom: 1em;
}
#portfolio-container {
    float: right;
    width: 80%;
}
#sidenav-container {
    float: left;
    width: 20%;
}
#arrows {
    margin-bottom: 0.7em;
}
/* Advanced Checkbox Hack */

body {
    -webkit-animation: bugfix infinite 1s;
}

@-webkit-keyframes bugfix {
    from {padding: 0;}
    to {padding: 0;}
}

#topnav input[type=checkbox], #topnav-home input[type=checkbox] {
    position: absolute;
    top: -999em;
    left: -999em;
}

#topnav label {
    display: block;
    background: url("../images/icon-menu.png") no-repeat right center;
    text-indent: -999em;
    cursor: pointer;
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;
    padding: 5px;
}
#topnav-home label {
    display: block;
    background: url("../images/icon-menu-light.png") no-repeat right center;
    text-indent: -999em;
    cursor: pointer;
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;
    padding: 5px;
}

#topnav input[type=checkbox]:checked ~ nav, #topnav-home input[type=checkbox]:checked ~ nav {
    height: auto;
    overflow: visible;
}
/* Advanced Checkbox Hack */


/********************************************
        Fluid Media
********************************************/

figure {
    position: relative;
}

figure img,
figure object,
figure embed,
figure video {
    display: block;
    max-width: 100%;
}
#portfolio figure,.box {
    border: 0;
    -ms-interpolation-mode: bicubic;
}

img {
    border: 0;
    -ms-interpolation-mode: bicubic;
}

/*
interpolation-mode
http://css-tricks.com/ie-fix-bicubic-scaling-for-images/
*/
/* Float Clearing http://nicolasgallagher.com/micro-clearfix-hack */

.group:after {
    content: " "; /* 1 */
    display: table; /* 2 */
    clear: both;
}

/* ******************************************
    Media Queries for screen less than 45em (720px)
****************************************** */

@media screen and (max-width: 45em) {
    body {
        font-size: 90%
    }
    #container-header-marketplace {
        background: #333 url("../images/marketplace-s.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding: 14% 0;
    }
    #container-header-login {
        background: #333 url("../images/login-s.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding: 14% 0;
    }
    #container-header-coffee {
        background: #333 url("../images/coffeehouse-s.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding: 14% 0;
    }
    #search-supplier {
        background: #333 url("../images/search-supplier-s.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding-top: 8%;
        padding-right: 0;
        padding-bottom: 80%;
        padding-left: 0;
    }

    #home-yellow {
        background: #333 url("../images/home-yellow.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding-top: 8%;
        padding-right: 0;
        padding-bottom: 85%;
        padding-left: 0;
    }


    #topnav ul, #topnav-home ul {
        width: 100%;
        padding: 0;

    }
    #banner {
        max-width: 40em;
    }
    h1 {
        font-size: 2em;
    }
    #container-nav {
        padding-top: 0.15em;
        padding-right: 0;
        padding-bottom: 0;
        padding-left: 0;
    }
    #topnav label, #topnav-home label {
        padding-top: 2em;
    }
    #topnav,
    #banner,
    #contact,
    #colophon,
    #topnav-home {
        margin: 0 4%;
    }
    #header-banner, .header-group,
    #content-container {
        margin-right: 5%;
        margin-left: 5%;
    }

    article.icon {
        width: 50%;
    }
    #quote {
        float: right;
        width: 65%;
    }

    .name, .email {
        float: none;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    article.bio {
        width: 100%;
        float: none;
    }
    .bio img {
        margin-bottom: 1em;
    }
    /*#container-footer {
            padding-top: 2em;
            margin-top: 4em;
    }*/
    nav#side img {
        max-width: 50%
    }
    #thumbsmain {
        float: none;
        width: 100%;
    }
    #description {
        float: none;
        width: 100%;
    }
    #portfolio-container {
        float: none;
        width: 100%;

    }
    #sidenav-container {
        float: none;
        width: 100%;
    }
    article.searchone, article.formone, article.formtwo,
    article.smallone, article.smalltwo, article.smallthree, article.smallfour,
    article.colone, article.coltwo, article.colthree,
    article.colfirst, article.colsecond {
        padding: 0.125em;
        float: left;
        width: 30%;
        margin-bottom: 15px;
        margin-top: 12px;
        margin-right: 5px;
    }
    article.searchtwo {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }
    article.searchthree {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }
    form.floatbuttons input.button {
        float: none;
        width: 100%;
        margin-bottom: 8px;
    }
}
/* ******************************************
                Media Queries for screen wider than 30em (480px)
        ****************************************** */

@media screen and (min-width: 30em) {

    nav#side img {
        max-width: 50%
    }
    #sidenav {
        float: none;
        width: 100%;
    }


}

/* ******************************************
                Media Queries for screen less than 320px
        ****************************************** */

@media screen and (max-width: 20em) {

    header#banner p {
        font-size: 1.5em;
    }
    #quote {
        float: right;
        width: 95%;
    }
    article.icon {
        width: 100%;
    }
    #sidenav {
        float: none;
        width: 100%;
    }
    #thumbs, #thumbslanding, #thumbsmain {
        float: none;
        width: 95%;
    }
    nav#side img {
        display: none;
    }
    article.thumb, article.thumbsmall {
        float: none;
        width: 100%;
    }
    #description {
        float: none;
        width: 100%;
    }


}
/* ******************************************
        Media Queries for screen less than 530 px
****************************************** */

@media screen and (max-width: 33.125em) {


    #thumbs, #thumbslanding, #thumbsmain {
        float: none;
        width: 98%;
    }
    article.thumb, article.thumbsmall {
        float: none;
        width: 100%;

    }
    #description {
        float: none;
        width: 100%;
    }
    #sidenav {
        float: none;
        width: 100%;
    }
    h2 {
        font-size: 1.7em;
    }

    article.searchone, article.formone, article.formtwo,
    article.smallone, article.smalltwo, article.smallthree, article.smallfour,
    article.colone, article.coltwo, article.colthree,
    article.colfirst, article.colsecond {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }
    article.searchtwo {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }
    article.searchthree {
        float: none;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }



}
/* ******************************************
        Media Queries for screen wider than 45em (720px)
****************************************** */

@media screen and (min-width: 45em) {
    body {
        font-size: 0.8em;
    }
    #container-header-marketplace {
        background: #333 url("../images/marketplace-l.jpg") no-repeat top center;
        padding: 9% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
    }
    #container-header-login {
        background: #333 url("../images/login-l.jpg") no-repeat top center;
        padding: 9% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
    }
    #container-header-coffee {
        background: #333 url("../images/coffeehouse-l.jpg") no-repeat top center;
        padding: 9% 0;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
    }
    #search-supplier {
        background: #333 url("../images/search-supplier-l.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding-top: 8%;
        padding-right: 0;
        padding-bottom: 23%;
        padding-left: 0;
    }
    #home-yellow {
        background: #333 url("../images/home-yellow.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding-top: 8%;
        padding-right: 0;
        padding-bottom: 35%;
        padding-left: 0;
    }
    #topnav, #topnav-home {
        padding: 0;
    }
    #topnav img, #topnav-home img {
        margin: 0 1.25em 0 0;
    }
    #topnav nav, #topnav-home nav {
        height: auto;
    }
    #topnav label, #topnav-home label {
        display: none;
    }
    #topnav ul, #topnav-home ul {
        border: 0;
        margin: 0;
    }
    #topnav li, #topnav-home li {
        border: 0;
        display: inline;
    }
    #topnav a, #topnav-home a {
        display: inline-block;
    }


    /* Contact Form */

    .name, .email {
        float: left;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .name {
        padding-right: .65em;
    }

    .email {
        padding-left: .65em;
    }

    .send {
        width: 48.6%;
    }
    #topnav,
    #banner,
    #contact,
    #colophon,
    #topnav-home {
        margin: 0 9%;
    }
    #header-banner, .header-group, #content-container {
        margin-right: 9%;
        margin-left: 9%;
    }
    #yellow-banner {
        margin-right: 0%;
        margin-left: 0%;
    }
    #yellowbanner h1 {
    }
    #bg {
        /*background-color: rgba(235, 232, 63, 0.6);
        color: rgba(235, 232, 63, 0.6);*/

        background: rgba(235, 232, 63, 0.6);
        background: rgb(235, 232, 63);
        filter:alpha(opacity=60); /* IE */
        -moz-opacity:0.6; /* Mozilla */
        opacity: 0.6; /* CSS3 */
        width:100%;
        height:150px;
    }

}

/* ******************************************
        Media Queries for screen wider than 60em (960px)
****************************************** */

@media screen and (min-width: 60em) {

    .name, .email {
        padding-right: 1.3em;
        padding-left: 0;
        clear: both;
    }

    .message textarea {
        width: 50%;
    }

    .send {
        width: 25%;
        margin-left: 50%;
    }

    /* Form Fixes, IE7 and below */

    .ie .message textarea {
        *width: 49.9%;
    }

    .ie .send {
        *margin-left: 46.7%;
    }

    #home-yellow {
        background: #333 url("../images/home-yellow.jpg") no-repeat top center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        padding-top: 8%;
        padding-right: 0;
        padding-bottom: 30%;
        padding-left: 0;
    }
}
/* ******************************************
        Media Queries for screen less than 60em (960px)
****************************************** */

@media screen and (max-width: 60em) {

    article.thumbsmall {
        float: left;
        width: 48%;
    }
    #thumbsmain {
        float: none;
        width: 100%;
    }
    #description {
        float: none;
        width: 100%;
    }

    #sidenav-container {
        float: none;
        width: 100%;
    }
    article.searchone, article.searchtwo, article.searchthree,
    article.colone, article.coltwo, article.colthree,
    article.colfirst, article.colsecond {
        float: none; clear: both;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }

    article.formone, article.formtwo,
    article.smallone, article.smalltwo, article.smallthree, article.smallfour {
        float: none; clear: both;
        width: 100%;
        margin-bottom: 15px;
        margin-top: 12px;
    }

    form.searchform article.smalltwo input#search.button { float: left !important; }
    form.searchform article.smallthree input#search.button { float: left !important }

    #sidebar {
        float: none;
        width: 100%;
        margin-bottom: 45px;
    }
    #sidenavbars {
        float: none;
        width: 100%;
    }
    article.content, article.news img {
        float: none;
        width: 100%;
    }
    article.barone, article.bartwo, article.barthree {
        float: none;
        width: 100%;
        margin-bottom: 25px;
    }

}

/* ******************************************
           Form Styles Basic Layout
****************************************** */


form {
    padding: 0 0 1.3em;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
}

form ul {
    list-style: none;
    padding: 1.3em 0 0;
}

form li {
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0.65em;
    padding-left: 0;
}

legend {
    font-size: 1.25em;
    line-height: 1.45;
}


legend, label {
    font-weight: 200;
    /*text-transform: uppercase;*/
    color: #999999;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
}
.loginformcenter {
    text-align: center;
}
.login {
    background: #fff;
    -moz-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    -webkit-box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    box-shadow: 0 0 .325em .13em rgba( 0, 0, 0, .1 );
    padding: 2em; /* 3/4 of 1.3 */
    text-align: left;
    display: inline-block;
    width: 100%;
}
.loginimg {
    text-align: center;
    margin-bottom: 15px;
}
form.loginform {
}
form.loginform label {
    float: left;
    width: 1em;
    font-size: 0.9em;
    line-height: 18px;
    padding: 0.65em;
    background-color: #f6f4f5;
    border: 1px solid #CCCCCC;
}
form.loginform input {
}
form.loginform input,
form.loginform textarea {
    float: left;
    width: 16em;
    font-size: 0.9em;
    height: 40px;
    font-weight: 200;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-bottom-style: solid;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    border-left-style: none;
    vertical-align: middle;
    padding-left: 0.65em;
}
form input.button {
    background-color: #ebe83f;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    text-transform: uppercase;
    width: 8em;
    text-align:center;
    height:40px;
}
form.floatbuttons input.button, form.floatbuttons input.buttonsmall {
    float:left;
    margin-right: 10px;
}
form input.buttonsmall {
    background-color: #ebe83f;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    text-transform: uppercase;
    width: 9em;
    text-align: center;
    height: 40px;
    font-size: 0.7em;
}
form input.check {
    width: 2em;
    height: auto;
}
form.searchform label {
    /* previous styles font-size: 0.9em;
            line-height: 1.25;
            padding: 0.65em;
            background-color: #f6f4f5;
            border: 1px solid #CCCCCC; */
    font-size: 0.9em;
    line-height: 1.25;
    padding: 7px;
    height: 19px;
    background-color: #f6f4f5;
    border: 1px solid #CCCCCC;
}

form.searchform select {
    width: 100%;
}
form.searchform input,
form.searchform textarea,
form.searchform select,
select {
    /* previous styles font-size: 0.9em;
            line-height: 1.25;
            font-weight: 200;
            padding: 0.65em;
            font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
            border: 1px solid #CCCCCC; */
    font-size: 0.9em;
    line-height: 1.25em;
    padding: 7px;
    height: 35px;
    background-color: #fff;
    border: 1px solid #CCCCCC;
}


/* style search select pulldowns - 02-16-16 ----- */
form.searchform select {
    display: inline-block;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #CCCCCC;

    background-image: url(../images/dropdown.png);
    background-repeat: no-repeat;
    background-position: right center;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius:	0px;

}

form.searchform select option { color: #333; background: #fff; /* style the dropdown bg color */ }

form.searchform select:hover { border: 1px solid #239fdb;
                               background-image: url(../images/dropdown-hover.png);
                               background-repeat: no-repeat;
                               background-position: right center;
}


input.button {	}

/* label edit - 11-18-15 ----- */
table.basic td { padding-top: 7px; padding-bottom: 7px; }

table.data { line-height: 1.25; margin-bottom: 25px; }
table.data th { white-space: nowrap; }

/* form.searchform edits - 11-18-15 ----- */
form.searchform article.colone label, form.searchform article.coltwo label, form.searchform article.colthree label, form.searchform article.colfour label { margin-bottom: 7px !important; width: 93% !important; }

form.searchform article.colfirst label, form.searchform article.colsecond label { padding: 7px !important; margin-bottom: 7px !important; /* width: 93% !important; */ }
form.searchform article.colfirst input, form.searchform article.colsecond input { padding: 7px !important; margin-bottom: 7px !important; }
form.searchform article.colfirst .select-wrapper, form.searchform article.colsecond .select-wrapper { margin-bottom: 7px !important; width: 95% !important; }

form.searchform article.searchone label, form.searchform article.searchtwo label, form.searchform article.searchthree label { margin-bottom: 7px !important; }

form.searchform article.smallone label, form.searchform article.smalltwo label, form.searchform article.smallthree label, form.searchform article.smallfour label { padding: 7px !important;margin-bottom: 7px !important; /* width: 93% !important; */}
form.searchform article.smallone input, form.searchform article.smalltwo input, form.searchform article.smallthree input, form.searchform article.smallfour input { padding: 7px !important;margin-bottom: 7px !important; /* width: 93% !important; */ }
form.searchform article.smallone .select-wrapper, form.searchform article.smalltwo .select-wrapper, form.searchform article.smallthree .select-wrapper, form.searchform article.smallfour .select-wrapper { width: 93.5% !important; margin-bottom: 7px !important; }

form.searchform article.formone label, form.searchform article.formtwo label { padding: 7px !important; margin-bottom: 7px !important; }
form.searchform article.formone input, form.searchform article.formtwo input { padding: 7px !important; margin-bottom: 7px !important; }
form.searchform article.formone .select-wrapper, form.searchform article.formtwo .select-wrapper { margin-bottom: 7px !important; width: 95% !important; }

input#file + span.smaller { clear: both; display: block; padding-top: 5px; }

/* label edit - 11-18-15 ----- */
form.basic label, form.basic-long label  {
    float: left;
    /* width: 12em; */
    width: 130px;
    font-size: 0.9em;
    line-height: 1.25;
    /* padding: 0.65em; */
    padding: 7px 7px 8px 7px !important;
    /* height: 19px; */
    background-color: #f6f4f5;
    border: 1px solid #CCCCCC;
}

/* lineup labels in firefox, all versions */
@-moz-document url-prefix() {
    form.basic label, form.basic-long label { padding: 7px !important; }
}

/* input addition - 11-18-15 ----- */
form.basic input, form.basic-long input {
    float: left;
    /* width: 150px; */
    font-size: 0.9em;
    line-height: 1.25;
    padding: 7px !important;
    background-color: #fff;
    border: 1px solid #CCCCCC;
    max-height: 35px;
}

form.basic input.button, form.basic-long input.button, form.searchform input.button { background-color: #ebe83f; border: none; max-width: 120px !important; text-align: center; }
form.basic input.button:hover, form.basic-long input.button:hover, form.searchform input.button:hover { background-color: #ccc; border: none; max-width: 120px !important; }

form.searchform article.smalltwo input#search.button { float: right; }
form.searchform article.smallthree input#search.button { float: left; }

.clearfloat + h2.center { margin-top: 35px; }

table.reports { width: 100%; }
table.reports td { width: 50%; vertical-align: top; }

table.reports td label { width: 54%; float: left; }
table.reports td input, table.reports td .select-wrapper { float: left; max-width: 32% !important; }

table.reports td .select-wrapper select.custom-select, table.reports td .select-wrapper select { width: 100%; }


select.custom-select { }

form.basic-long label {
    float: left;
    width: 17em;
    font-size: 0.9em;
    line-height: 1.25;
    padding: 0.65em;
    background-color: #f6f4f5;
    border: 1px solid #CCCCCC;
}
td.special, tr.special {
    /*border: 1px solid #CCCCCC;*/
}
form.basic-long input,
form.basic-long textarea {
    float: left;
    width: 19em;
    font-size: 0.9em;
    line-height: 1.25;
    font-weight: 200;
    /* padding: 0.65em; */
    padding: 7px !important;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-bottom-style: solid;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    border-left-style: none;
}
form.basic-long input.checkbox {
    float: left;
    width: 1em;
    font-size: 0.9em;
    line-height: 1.25;
    font-weight: 200;
    padding: 0.65em;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-bottom-style: solid;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    border-left-style: none;
    margin-right: 4px;
    margin-left: 4px;
}

form.basic input,
form.basic textarea {
    float: left;
    width: 19em;
    font-size: 0.9em;
    line-height: 1.25;
    font-weight: 200;
    /* padding: 0.65em; */
    height: 35px; /* added height on 11-18-15 */
    padding: 7px !important;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-bottom-style: solid;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    border-left-style: none;
}

form.basic input.button {
    float: left;
    width: 8em;
    margin-right: 12px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}
form.basic-long input.button {
    float: left;
    width: 8em;
    margin-right: 12px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}

input,
textarea {
    display: block;
    width: 100%;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;}

label {
    display: block;
}
/* custom forms */
/* Start Dropdown Select */
.select-wrapper {
    float: left;
    display: inline-block;
    border: 1px solid #d8d8d8;
    cursor: pointer;
    background-image: url(../images/dropdown.png);
    background-repeat: no-repeat;
    background-position: right center;
}

/* 11-18-15 edits ----- */
.select-wrapper, .select-wrapper select {
    /*	width: 99%; */
    color: #999;
    width: 273px;
    padding-right: 11px; padding-left: 3px;
    height: 33px;
    margin-left: -1px;
    position: relative;
    line-height: 33px;
    font-size: 0.9em;
    font-weight: 200;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-color: #ccc;
}

form.searchform .select-wrapper { margin-left: 0px !important; width: 95% !important; }

.select-wrapper:hover {
    border-color: #239fdb;
    background-image: url(../images/dropdown-hover.png);
    background-repeat: no-repeat;
    background-position: right center;
}
.select-wrapper .holder {
    display: block;
    margin: 0 35px 0 5px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    z-index: -1;
}
.select-wrapper select {
    margin: 0;
    position: absolute;
    z-index: 2;
    cursor: pointer;
    outline: none;
    opacity: 0;
    /* CSS hacks for older browsers */
    _noFocusLine: expression(this.hideFocus=true);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
}
/* End Dropdown Select */



/* Start Checkboxes */



/* End Checkboxes */
div.formrows {display: table-cell; vertical-align: middle; height: 50px; border: 1px solid red; float:left; }div.formrows label {float: left; padding: 0.65em; background-color: #f6f4f5; border: 1px solid #CCCCCC; font-size: 0.9em; line-height: 18px; }
div.formrows input {font-size: 0.9em; height: 36px; float: left; width: 19em; font-weight: 200; font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif; border-bottom-style: solid; border-top-color: #CCCCCC; border-bottom-color: #CCCCCC; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-right-style: solid; border-right-color: #CCCCCC; border-left-style: none; padding-top: 0.65em; padding-bottom: 0.65em; padding-left: 0.65em; padding-right: 0em; }
table.data {border: 1px solid #CCC; border-collapse:collapse; color: #333; }
table.data th {font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif; background-color: #666666; padding:8px; border: 1px solid #ccc; text-align: left; color: #fff; font-weight: normal; text-transform: uppercase; }
table.data td {padding:8px; border: 1px solid #ccc; }
table.data td.urlstyle:hover { text-decoration: underline; color: blue; background-color: whitesmoke; }
table.data td.nonBorder { border-top: 2px solid #ffffff; }
table.data input,
table.data textarea {
    font-size: 0.9em;
    line-height: 1.25;
    font-weight: 200;
    font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif;
    border-bottom-style: solid;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    border-left-style: none;
    padding-top: 0.65em;
    padding-bottom: 0.65em;
    padding-left: 0.65em;
    padding-right: 0em;
}
.basic td {
    padding-bottom: 5px;
}
table.basic {
    margin-bottom: 15px;
}
.centerTable {
    text-align: center;
    margin: 0px auto;
}
.centerTable td {
    padding-top: 5px;
    padding-right: 0px;
    padding-bottom: 10px;
    padding-left: 0px;
    text-align: left;
}
span.smaller {
    font-size: 0.8em;
    color: #666;
}
/**
 * 1. Remove default vertical scrollbar in IE 6/7/8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    padding-bottom: 6%;
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

.send {
    display: inline-block;
    max-width: 30em;
    font-size: 1em;
    line-height: 1;
    font-weight: 200;
    color: #fff;
    text-decoration: none;
    padding: 0.75em;
    border: 0;
    border-radius: 1.3em;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, .65);
    background-color: #EB5A28;
    margin-top: 0.65em;
    margin-right: 0.26em;
    margin-bottom: 0.65em;
    margin-left: 0.26em;
}

.send:hover {
    background: #6f6f6f;
}

.send:active,
.send:focus {
    background: #555;
}
.name, .email {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/*3/21/2016*/
.custom-padding-b{
    padding-left: 3px !important;
    padding-right: 3px !important;
}
.custom-padding-r{
    padding-right: 3px !important;
}
.custom-padding-l{
    padding-left: 3px !important;
}
.custom-portfolio{ background-color: #fff !important;
                   border: 1px solid #ccc !important;
                   font-size: 0.4em !important;
                   height: auto !important;
                   line-height: normal !important;
                   margin: 0 0 5px !important;
                   min-width: 60px !important;
                   padding-bottom: 5px !important;
                   padding-top: 5px !important;
                   vertical-align: middle !important;
                   width: auto !important;
                   text-transform: uppercase;
                   color:#666 !important;
}
.custom-portfolio:hover{background:#ccc !important;}
h3.custom-font{font-size:2.7em !important; }
#vendor-grid_c7 {width: 14% !important;}
h2.grayout { background: #f6f4f5 none repeat scroll 0 0;border: 1px solid #cccccc;padding: 5px;color: #999 !important;}
#custom-vdesign h2{font-size: 20px;text-transform: uppercase;}/*font-weight: bold;*/
#custom-vdesign h1,#custom-vdesign h2,#custom-vdesign h3,#custom-vdesign h4,#custom-vdesign h5,#custom-vdesign h6,#custom-vdesign .h1,#custom-vdesign .h2,#custom-vdesign .h3,#custom-vdesign .h4,#custom-vdesign .h5,#custom-vdesign .h6 {color: #3a3a3a;}/*font-weight: bold;*/
#custom-vdesign .about p {text-align: justify;}
#custom-vdesign p {color: #000;font-size: 18px;font-weight: normal;text-align: justify;}
#custom-vdesign a {outline: medium none !important;}
#custom-vdesign .rightside {text-align: left;}
#custom-vdesign .margin-left {font-size: 16px;margin-bottom: 0px;margin-left:21px; }/*40px;*/
#custom-vdesign .margin-left a {color: #959595;text-decoration: none;transition: all 0.5s ease 0s;}
#custom-vdesign .margin-left a:hover {color: #000;}
#custom-vdesign .colum6::after {background: #e1e1e1 none repeat scroll 0 0;content: "";float: left;height: 100%;position: absolute;right: 0;top: 0;width: 1px;}
#custom-vdesign .newspaper { float: left; padding: 50px 0 0; width: 100%;}
#custom-vdesign .gallerypage {  padding: 50px 0 0 !important;}
#custom-vdesign .headingstyle{ margin-top:90px; background:none !important; padding-bottom:0;}
.form-inline .input-group .input-group-addon{}
.custom-label label{    float: left; background: none; border: 0; margin: 0; padding: 4px 6px;font-size:1em;}
.custom-input input { float: left; width: auto;}
.check-input input { float: left; width: 20px !important;}
.customownerlabel label{font-size:1em;}

#Customer_custom_report_freq{ padding: 10px 20px 0 !important;}
#Vendor_vendor_your_company{ padding: 11px 10px 0 !important;}
#ui-datepicker-div{width: 344px;}
.grid-view table {border: 1px solid rgb(204, 204, 204); border-radius: 5px; float: left; margin: 20px 0 0; width: 100%; table-layout: fixed; } .grid-view table.data tr td {border: 1px solid rgb(204, 204, 204);    color: rgb(100, 100, 100); padding:8px;    font-size: 14px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;}
.errorMessage{color:red;margin-bottom:4px !important;margin-top:4px !important;}
#ddbcashreceipt-grid_c2{width: 20% !important;}
#ddbcashreceipt-grid_c3, #ddbcashreceipt-grid_c5, #ddballspend-grid_c6, #ddbhousespend-grid_c6 {width: 6% !important;}
#ddbcashreceipt-grid_c4, #ddballspend-grid_c5, #ddbhousespend-grid_c5{width: 9% !important;}
#ddballspend-grid_c4, #ddbhousespend-grid_c4,#ddballspendfuzz-grid_c3{width: 9% !important;}
#ddbhousespendfuzz-grid_c4,#ddballspendfuzz-grid_c4{width: 11% !important;}
#ddballspend-grid_c2, #ddbhousespend-grid_c2,{width: 12% !important;}
#fileupload-grid_c0, #filehistory-grid_c0,#ddbhousespendfuzz-grid_c3{width: 8% !important;}
#fileupload-grid_c2, #filehistory-grid_c2{width: 12% !important;}
#fileupload-grid_c4, #filehistory-grid_c4{width: 15% !important;}
#fileupload-grid_c3, #filehistory-grid_c3{width: 12% !important;}
#fileupload-grid_c5, #filehistory-grid_c5{width: 14% !important;}
#ReportForm_from_date,#ReportForm_to_date{cursor:pointer;}

/* Vendor Grid */
#vendor-grid_c2{width:10% !important;}

/* Agency Grid */
#agency-grid_c3{width:8% !important;}
#agency-grid_c1{width:11% !important;}
#agency-grid_c4, #agency-grid_c5{width:14% !important;}
#agency-grid_c2{width:17% !important;}

/* Customer Grid */
#customer-grid_c1{width:17% !important;}
#customer-grid_c2{width:8% !important;}
#customer-grid_c3{width:11% !important;}
#customer-grid_c4, #customer-grid_c5{width:14% !important;}

/* Customer Alias Grid */
#customeralias-grid_c2{width:17% !important;}
#customeralias-grid_c3, #customeralias-grid_c4{width:14% !important;}

/* Supplier Search Result Grid */
#vendorresult-grid_c7{width:8% !important;}
#vendorresult-grid_c8{width: 11% !important;}

/*
#rlevel, #rquality, #rdelivery, #rbudget, #ragain, #rsatisfied, #certification_custom, #Customer_custom_certification, #Customer_custom_sup_dive_report, #Customer_custom_report_freq, #Vendor_vendor_type, #Vendor_vendor_woman_or_small, #Vendor_vendor_your_company, .uplaodFile, #Vendor_vendor_hubzone, #Vendor_vendor_certified, #RoleAction_roac_supplier, #RoleAction_roac_agency, #RoleAction_roac_com_management, #RoleAction_roac_com_profiles, #RoleAction_roac_com_alias, #RoleAction_roac_bids, #RoleAction_roac_bids_search, #RoleAction_roac_ratings, #RoleAction_roac_supp_alias, #RoleAction_roac_agen_alias, #RoleAction_roac_holiding_com, #RoleAction_roac_agen_network, #RoleAction_roac_classification, #RoleAction_roac_certification, #RoleAction_roac_department, #RoleAction_roac_industry, #RoleAction_roac_ethnicity, #RoleAction_roac_commodity, #RoleAction_roac_naics, #RoleAction_roac_coffe, #RoleAction_roac_ddb_fuzz, #RoleAction_roac_saatchi_fuzz, #RoleAction_roac_phcg_fuzz, #RoleAction_roac_reports,#RoleAction_roac_internaluser,#RoleAction_roac_networkuser,#RoleAction_roac_internalrolemgt,#RoleAction_roac_networkrolemgt,#RoleAction_roac_suppliersearch, #RoleAction_roac_suppliermatch,#RoleAction_roac_upload_files,#RoleAction_roac_supplierfilemapping,#RoleAction_roac_vendorsourcetablemanage,#RoleAction_roac_supplier_profile_type{
    border: 1px solid #e1e8ed;
    border-left: 0px;
    float: left;
    margin: 0;
    padding: 7px;
    width: 100%;
}
*/

#rlevel, #rquality, #rdelivery, #rbudget, #ragain, #rsatisfied, #certification_custom, #Customer_custom_certification, #Customer_custom_sup_dive_report, #Customer_custom_report_freq, #Vendor_vendor_type, #Vendor_vendor_woman_or_small, #Vendor_vendor_your_company, .uplaodFile, #Vendor_vendor_hubzone, #Vendor_vendor_certified {
    border: 1px solid #e1e8ed;
    border-left: 0px;
    float: left;
    margin: 0;
    padding: 7px;
    width: 100%;
}

.label{background-color:none !important; }
.button-column{width: 100px !important;}
.offset5{ margin-left: 37.8%;}
.checkbox input[type="checkbox"]{ height: inherit; width: auto; float: left; margin-left: 0px;}
.checkbox  span {float: left; color: rgb(102, 102, 102); margin-left: 20px; margin-top: 2px; }
.pass-error {color: red; padding-top: 5px; }
button.btn-primary, input[type="submit"],input[type="button"], a.btn-primary {background-color: rgb(235, 232, 63); border-style: none; border-width: 0; height: 40px; text-align: center; text-transform: uppercase; width: 8em; color: rgb(102, 102, 102); transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; text-decoration: none; line-height: 40px; margin: 0px; padding: 0px;}
button.btn-primary:hover, input[type="submit"]:hover,input[type="button"]:hover, button.btn-primary:focus, input[type="submit"]:focus, input[type="button"]:focus,button.btn-primary:active, input[type="submit"]:active,input[type="button"]:active, a.btn-primary:hover, a.btn-primary:active, a.btn-primary:focus {background-color: rgb(204, 204, 204); color: rgb(102, 102, 102); }
.link-button{text-decoration: none !important;}
.form-control{ box-shadow: none; width: 100% !important;}
.login_form{  margin: 0 auto; width: 260px; }
.heading-help {font-size: 2em; line-height: 1.25; margin-bottom: 0.5em; font-weight: bold;}
.menu{ margin-top: 12px;}
.nav.main-menu{ float: right;}
.menu .navbar-default{ background: no-repeat;; border: 0px; margin:0; min-height: inherit; border-radius: 0px;}
.menu .navbar-default li{ display: inline-block;}
.menu .navbar-default li a{ color: rgb(156, 156, 156); text-decoration: none; text-transform: uppercase; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.menu .navbar-default li a:hover{ background: rgb(72, 72, 72); }
.menu ul.dropdown-menu {padding: 0px;}
.menu ul.dropdown-menu li{ width: 100%; font-size: 12px; }
.menu ul.dropdown-menu li a{ padding: 8px 10px; }
.basicsform .form-group {margin-bottom: 10px; width: 100%; }
.form-inline .input-group .input-group-addon, .form-inline .input-group .input-group-btn{ width: 145px; text-align: left;}
.input-group{ width: 100%;}
.header{ padding: 20px 0;}
.side-menu ul{ border-bottom: 0px;}
.side-menu li{ display: block; width: 100%; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.side-menu li a{  background-color: rgb(82, 82, 82); color: rgb(255, 255, 255); display: block; margin: 0 12px 5px; padding: 0.65em 0.1em 0.65em 0.5em; text-decoration: none; text-transform: uppercase; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.side-menu li a:hover{ background-color: rgb(153, 153, 153); border: 1px solid rgb(153, 153, 153); }
.side-menu li.active a, ul.nav-tabs li.active a{ background-color: rgb(235, 232, 63) !important; color: rgb(51, 51, 51); border: 1px solid rgb(235, 232, 63); }
.side-menu li.active span.bar {background-color: rgb(235, 232, 63); }
.side-menu li span.bar {background-color: rgb(153, 153, 153); float: left; margin-right: 2px; padding: 1.44em 0.1em; width: 9px; }
.breadcrumb{ background: none; padding-left: 0px; margin-bottom: 0px;}
.breadcrumb li a{  color: rgb(153, 153, 153);
                   font-size: 12px; text-decoration: none;}

table.data {border: 1px solid #CCC; border-collapse:collapse; color: #333; }
table.data th {font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif; background-color: #666666 !important; padding:8px; border: 1px solid #ccc; text-align: left; color: #fff; font-weight: normal; text-transform: uppercase;	}
table.data th a{ color:#fff; text-decoration: none;}
table.data tr.even {background-color: #e4e4e4; padding:8px; border: 1px solid #ccc; }
table.data tr.odd {background-color: #d6d5d6; } table.data input,
table.data textarea {font-size: 0.9em; line-height: 1.25; font-weight: 200; font-family: "open_sansregular", "Helvetica Neue", Helvetica, sans-serif; border-bottom-style: solid; border-top-color: #CCCCCC; border-bottom-color: #CCCCCC; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-right-style: solid; border-right-color: #CCCCCC; border-left-style: none; padding-top: 0.65em; padding-bottom: 0.65em; padding-left: 0.65em; padding-right: 0em; }
a.dcon{ text-decoration: none;}
.input-group-addon{ background-color: rgb(246, 244, 245); border: 1px solid rgb(204, 204, 204);}

label {background-color: rgb(246, 244, 245); border: 1px solid rgb(204, 204, 204); font-size: 1.3em; height: 33px; line-height: 1.25;padding: 7px; margin-bottom: 7px; }
.space{ margin: 30px 0; }
.grid-view .summary{ text-align: left; margin-bottom: 10px; color: rgb(153, 153, 153);}
.exceptionbutton{width: 18em !important;}

.main-container >.container > .reporttable th { background:#333; color: #fff; }
.main-container >.container > .reporttable tr:hover th {color: #333; background: #f1f1f1; }
.reporttable tr td, .reporttable tr:last-child th { text-align: right; }
.reporttable tr:first-child th { text-align: center; }
.reporttable tr td:first-child { text-align: left;  }
.newheadstyle{ float: left; width: 100%; text-transform: uppercase; }
.newscontent{text-align: justify;}
/* by nitin for map contact */
	.map-outer{position:relative;}
	.m-contact-form{
		position:absolute; 
		top:120px; 
		left:100px; 
		z-index:999;    
		background: #fff;
		padding: 30px;
		}
	#wrapper { position: relative; }
   #over_map { position: absolute; top: 11px; left: 367px; z-index: 99; background:#fff; height:79px; padding:15px; box-shadow:rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; border-radius: 2px; }
 .contact-btn .con-link {
    margin-top: 5px;
    text-align: center;
    color: #3a84df;
    font-size: 11px;
    font-family: Roboto,Arial;
    max-width: 55px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
  .contact-btn .cont-icon{ 
	background:url(../images/contact-icon.png) no-repeat 0 0; 
	background-size: 30px;  
	width: 30px;
    height: 20px;
    display: block;
    margin: 0 auto;
   
} 
.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px!important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}
.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: #999;
}
.form-control::-webkit-input-placeholder {
  color: #999;
}
.form-control::-ms-expand {
  background-color: transparent;
  border: 0;
}
textarea.form-control {
  height: auto;
}
.cont-form{overflow:hidden; max-width:400px;  width:100%;}
.cont-row:before,
.cont-row:after{
	clear:both;
	display:block;
	content:".";
	height:0;
	visibility:hidden;
}
.cont-row{margin-left:-5px; margin-right:-5px;}
.cont-item{padding:8px 5px; float:left; display:block; box-sizing:border-box;}
.cont-item.col-2{ max-width:50%; width:100%; }
.cont-item.col-1{ max-width:100%; width:100%; }
.cont-title{text-align:left; margin-bottom:25px;}
.cont-title >strong{padding:8px 15px; display:inline-block; background:#000; color:#fff; font-size:20px; }
.cont-punch{margin-bottom:15px;}
#mycontactonhomeform{margin:0; padding:0;}

/* Responsive Media Queries  --------*/
@media only screen and (max-width: 1120px) {

    #home {
        background: #333 url(../images/search-supplier-s.jpg) no-repeat center top;
        -webkit-background-size: 107%;
        -moz-background-size: 107%;
        background-size: 107%;
        padding-bottom: 54%;
    }

    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 107%;
        -moz-background-size: 107%;
        background-size: 107%;
        padding-bottom: 54%;
    }

    #home #home-yellow-translucent { margin-top: 5.5%; padding-top: 10%; padding-bottom: 2.25%; }
    #home #home-yellow-translucent #content-container { margin-top: 0px; padding-top: 0px; padding-bottom: 9px; margin-top: -6%; height: auto; }

    #home #home-yellow-translucent h1 { font-size: 70px; }
    #home #home-yellow-translucent h2 { font-size: 20px; }
    #home #home-yellow-translucent p  { font-size: 10px; padding: 5px }

}

@media only screen and (max-width: 1120px) {


    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 109%;
        -moz-background-size: 109%;
        background-size: 109%;
        padding-bottom: 58%;
    }

}

@media only screen and (max-width: 1024px) {
    #intro .group, #deliver .group, #about .group, #contact .group  { max-width: 90%; margin-right: auto; margin-left: auto; }
}

@media only screen and (max-width: 920px) {
    .columns .col .funtions-row input.button + input.button + input.button { float: none !important; }

    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 115%;
        -moz-background-size: 115%;
        background-size: 115%;
        padding-bottom: 60%;
    }

    .iframeWrapper {
        padding-bottom: 50px;
        padding-top: 20px;
        min-height: 300px;
    }

}

@media only screen and (max-width: 900px) {
    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        min-height: 50px;
        -webkit-background-size: 125%;
        -moz-background-size: 125%;
        background-size: 125%;
        padding-bottom: 64%;
    }

}

@media only screen and (max-width: 850px) {
    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 125%;
        -moz-background-size: 125%;
        background-size: 125%;
        padding-bottom: 66%;
    }

    .iframeWrapper {
        padding-bottom: 50px;
        padding-top: 20px;
        min-height: 320px;
    }

}


@media only screen and (max-width: 819px) {
    #home {
        background: #333 url(../images/search-supplier-s.jpg) no-repeat top center;
        -webkit-background-size: 110%;
        -moz-background-size: 110%;
        background-size: 110%;
        padding-bottom: 55%;
    }

    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 135%;
        -moz-background-size: 135%;
        background-size: 135%;
        padding-bottom: 68%;
    }


    #home #home-yellow-translucent { margin-top: 5.5%; padding-top: 9%; padding-bottom: 2.25%; }
    #home #home-yellow-translucent #content-container { margin-top: 0px; padding-top: 3px; padding-bottom: 9px; margin-top: -6%; height: auto; }

    #home #home-yellow-translucent h1 { font-size: 60px; }
    #home #home-yellow-translucent h2 { font-size: 16px; }
    #home #home-yellow-translucent p  { font-size: 10px; }

    #intro p, #deliver p, #about p, #contact p  { font-size: 16px !important; }
    #intro h3, #deliver h3, #about h3, #contact h3  { font-size: 22px !important; }
}

@media only screen and (max-width: 790px) {
    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 145%;
        -moz-background-size: 145%;
        background-size: 145%;
        padding-bottom: 73%;
    }

}

@media only screen and (max-width: 730px) {
    #deliver {
        background: #131305 url(../images/We_Deliver.jpg) no-repeat center top;
        -webkit-background-size: 155%;
        -moz-background-size: 155%;
        background-size: 155%;
        padding-bottom: 80%;
    }

}

@media only screen and (max-width: 719px) {
    #home #topnav label { background-image: url(../images/icon-menu-white.png); }
    #home #topnav nav ul { background-color: rgba(0, 0, 0, 0.7) !important; text-align: left !important; }
    #home #topnav nav ul li a:hover { background-color: rgba(0, 0, 0, 0.5) !important; }

}

@media only screen and (max-width: 680px) {
    #deliver { min-height: 80px; }

}

@media only screen and (max-width: 670px) {
    #home #home-yellow-translucent h1 { font-size: 48px; }

    #deliver { height: auto; padding-bottom: 50px; }

}
@media (max-width: 1024px) {
    #topnav a{
        padding-right: 0px;   
    }
}

@media only screen and (max-width: 650px) {

    .columns { width: 99% !important; clear: both; }
    .columns, .col, .columns .col { width: 99% !important; clear: both; min-width: 99% !important; margin-left: 0px; }
    .columns .col + .col { float: left; margin-left: 0px; }
    .columns .three .col + .col { float: left; margin-left: 0px; }
    .columns .three .col + .col + .col { float: left; margin-left: 0px; }
    .columns .col p { width: 97%; }
    .columns .col h4.heading { width: 100%; }

    #deliver { min-height: 160px; }
}


@media only screen and (max-width: 580px) {
    #deliver { min-height: 190px; }

}

@media only screen and (max-width: 550px) {
    #deliver { min-height: 200px; }

}

@media only screen and (max-width: 530px) {
    #home #home-yellow-translucent h1 { font-size: 40px; }
    #home #home-yellow-translucent h2 { font-size: 15px; }

    #intro p, #deliver p, #about p, #contact p  { font-size: 14px !important; }
    #deliver { min-height: 220px; }

}

@media only screen and (max-width: 480px) {
    #deliver { min-height: 230px; }

}

@media only screen and (max-width: 470px) {
    #home {
        background: #333 url(../images/search-supplier-s.jpg) no-repeat top center;
        -webkit-background-size: 125%;
        -moz-background-size: 125%;
        background-size: 125%;
        padding-bottom: 64%;
    }
    #deliver { min-height: 240px; }

}

@media only screen and (max-width: 440px) {
    #home #home-yellow-translucent h1 { font-size: 36px; }
    #home #home-yellow-translucent h2 { font-size: 14px; }
    #home #home-yellow-translucent { margin-top: 5.25%; padding-top: 9%; padding-bottom: 0%; }
    #home #home-yellow-translucent #content-container { padding-bottom: 3px; }

    #deliver { min-height: 270px; }

}

@media only screen and (max-width: 420px) {
    #deliver { min-height: 305px; }

}

@media only screen and (max-width: 410px) {
    #deliver { min-height: 330px; height: auto; }

}

@media only screen and (max-width: 399px) {
    #home {
        background: #333 url(../images/search-supplier-s.jpg) no-repeat top center;
        -webkit-background-size: 131%;
        -moz-background-size: 131%;
        background-size: 131%;
        padding-bottom: 67%;
    }
    #deliver { min-height: 350px;	}

    #home #home-yellow-translucent h1 { font-size: 32px; }
}

@media only screen and (max-width: 350px) {
    #home {
        background: #333 url(../images/search-supplier-s.jpg) no-repeat top center;
        -webkit-background-size: 165%;
        -moz-background-size: 165%;
        background-size: 165%;
        padding-bottom: 84%;
    }

    #deliver {
        min-height: 370px;
    }


    /* ******************************************
        IE 8 and below, legacy browser style fixes
    ****************************************** */
    /* Figures/Images */
    .ie #portfolio figure {
        width: 100%;
        box-sizing: border-box;
    }

    /* "*" hack applies only to IE7 and below */
    .ie #portfolio figure {
        *width: auto;
    }

    /* Navigation */
    /* IE8 .checked class for checkbox.js */
    #topnav input[type=checkbox].checked ~ nav, #topnav-home input[type=checkbox].checked ~ nav {
        height: auto;
        overflow: visible;
    }

    /* Always show nav, IE7 and below */
    .ie #topnav nav, .ie #topnav-home nav {
        *height: auto;
        *overflow: visible;
    }

    /* Hide navicon, IE7 and below */
    .ie #topnav label, .ie #topnav-home label {
        *background: none;
    }

    /* box-sizing polyfill, IE7 and below */
    .ie .wrapper,
    .ie .name,
    .ie .email,
    .ie input,
    .ie textarea {
        *behavior: url("http://www.hediej.com/js/boxsizing.htc");
    }

    /* Clearfix */
    .group {
        *zoom: 1;
    }
}
    /********************************************
        Text box search
********************************************/
body{}
.frmSearch {border: 1px solid #a8d4b1;background-color: #c6f7d0;margin: 2px 0px;padding:40px;border-radius:4px; }
#parent-list{float:left;list-style:none;margin-top:-3px;padding:0;width:200px;
             position: absolute; z-index: 10; max-height: 280px;overflow:scroll; top:37px;border:#cccdce 1px solid}
#parent-list li{padding: 10px; background: #f0f0f0; border-bottom: #bbb9b9 1px solid; }
#parent-list li:hover{background:#ece3d2;cursor: pointer; }
#Vendor_vendor_parent{padding: 10px;border: #cccdce 1px solid;border-radius:4px;}

#error-modal {
    margin-left: 10px;
    margin-top: 40px;
    display: inline-block;
    width: 500px;
    background: none repeat scroll 0 0 #f5f5f5;
    color:#000;
    position: fixed !important;
}

#error-modal > p {
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    padding:15px 15px 0;
    color:#000;
    border-radius:5px;
}

#error-modal li {
    list-style-type: none;
    border-bottom:1px solid #eee;
    margin-left: 10px;
}

#error-modal li#indent {
    margin-left: 30px !important;
}

#report-modal {
    border: 1px solid #CCC;
    border-collapse:collapse;
    color: #333;
}

#report-modal th {
    padding:8px;
    border: 1px solid #ccc;
}

#report-modal td {
    padding:8px;
    border: 1px solid #ccc;
}