/* The Grocer Broker */
  /* Updated 17/12/14 */

  /* Main layout sections */
  html, body { height:100%;}

  body { margin:0px auto; color:#4e4b47; font-family: 'Open Sans', Arial, sans-serif; background: #ecebeb }
  img { border:0; display:block; max-width:100%; max-height:auto!important; }
  p img { display:inline; }
#sitewrap {background:url(../images/grocer-broker-bg.jpg) no-repeat; background-attachment:fixed; background-size:100%; }
  div.wrap { position:relative; }
  div.subwrap { margin:0px auto; max-width: 1000px; position:relative; }
  #logo { text-align: center; padding: 50px 0; }
  #logo img { margin: 0px auto; }
  #nav { clear:both;position: relative; z-index: 100;}
  #nav div.subwrap { position: relative; z-index: 100; }
  #section { position: relative; }
  #content { clear: both; padding: 0 0 50px 0; }
  #footer { clear: both; padding: 30px 0px; }
  iframe { max-width:100%;}

fieldset { border:0; }

  hr { border: 0; border-top: 1px dotted #7c9726; }

  .left { float:left; }
  .right { float: right; }
  /* Joomla Custom Module Antidote */ div.custom.left, div.custom.right { float: none; }
  .w33 { width: 33%; }
  .w34 { width: 34%; }
  .w35 { width: 35%; }
  .w49 { width: 49%; }
  .w50 { width: 50%; }
  .w55 { width: 55%; }
  .h100 { height: 100%; min-height: 100%; }
  .sub480 { max-width:480px; }
  .rel { position: relative; }
  .abs { position: absolute; }
  .fixed { position: fixed; }
  .clearing { clear:both; }

  .burnt    { background-color:#e67604!important; }
  .orange   { background-color:#ffa60c!important; }
  .skyblue  { background-color:#76c9fb!important; }
  .green    { background-color:#7c9726!important; }
  .white    { background-color:#fff!important; }
  .black    { background-color:#000!important; }
  .grey   { background-color:#5e84aa!important; }
  .litegrey { background-color:#8f95a1!important; }
  .ghost    { background-color:#ecebeb!important; }
  .burntshowthru { background-color: rgba(230,118,4,0.60); color:#fff!important; text-shadow: 0px 1px #c2540a; text-align:center; padding: 12px 0; }
  #nav.burntshowthru {padding: 0;}
  .boxshadow { -webkit-box-shadow: 0px 0px 7px 0px rgba(194, 84, 10, 1);
  -moz-box-shadow: 0px 0px 7px 0px rgba(194, 84, 10, 1);
  box-shadow: 0px 0px 7px 0px rgba(194, 84, 10, 1); }
  .ie8 .greyshowthru, .ie7 .greyshowthru, .ie6 .greyshowthru { background-color: #e67604; /* IE8 and below */ }
  .highlight  { border: 1px solid #ffa60c; margin: 20px 0;  padding: 10px 20px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
  .highlight h4 { text-align: center; color:#ffa60c!important; }
  /* Joomla Custom Module Antidote */ div.custom.burntshowthru { background: none;  }
  /* Joomla Custom Module Antidote */ div.custom.boxshadow { box-shadow: 0; -moz-box-shadow: 0px; -webkit-box-shadow: 0px; }

  /* Main Fonts */
  h1 { display: table; text-align: center; font-weight:400; color:#ffa60c; margin: 0px auto 15px auto; padding: 10px 0px; font-size:38px; }
  h2 { font-weight:400; color:#7b9726; margin: 10px 0px 10px 0px; font-size:27px; text-align: center; }
  h3 { font-weight:400; color:#888; margin: 20px 0px 5px 0px; font-size:19px; }
  h4 { font-weight:400; color:#76c9fb; padding: 10px 0px; margin: 0;  font-size:17px; }
  h5 { font-weight:700; color:#8f95a1; margin: 5px 0px 0px 0px; font-size:15px; }
  p  { font-weight:400; color:#222; margin: 5px 0px 15px 0px; font-size:17px; line-height: 27px; }
  ul, ol   { font-weight:400; color:#222; font-size:17px; line-height:27px; }
  a  { color: #7c9726; text-decoration:underline; }
  a:hover  { color: #76c9fb; text-decoration:none; }
  a:active { color: #7c9726; text-decoration:none; }


div.articlebottom h1,div.articlebottom h2,div.articlebottom h3,div.articlebottom h4,div.articlebottom h5,div.articlebottom h6,div.articlebottom p { text-align: center; }

  #logo h2 { font-family: 'Open Sans', Georgia, serif; font-size: 70px; text-align:left; color:#414752; margin: 0px; padding: 0px; }
  #logo h2 a { text-decoration:none; color: #414752; }

  .topsection h3 { color:#fff; text-decoration: none; font-weight: 600; font-size:16px; text-transform:uppercase; margin:5px 0; }
  .topsection h3 a { color:#8f95a1; text-decoration: none; }
  .topsection h3 a:hover { color:#7c9726; }

  /* Main Menu Navigation */
  #nav img { display: inline; }
  #nav h3.menuToggle { display: none; }
  #nav #js-mainnav{background:transparent !important; border:0px !important; float:none !important;box-shadow:none;}
  #nav .subwrap > .moduletable{height:100%;}
  #nav ul { margin: 0px; padding: 0px 0px; font-size:15px; text-align: center; }
  #nav ul li { list-style:none; display:inline-block; font-weight: 600;  margin: 0px!; padding: 0px 0px; border-right: 1px solid #db5604 !important; }
  #nav ul li:last-child { border-right: 0; }
  #nav ul li a { font-size: 17px !important; padding: 12px 15px!important; margin: 0px 0px 0px 0px!important; display:block; color: #fff !important; text-decoration:none;border-left:0px !important;font-weight:600 !important;}
  #nav ul li a:hover {color:#ffeed4!important}
  #nav ul ul {margin:0px!important;}
  #nav ul ul li {border-right:0px !important; text-align: left; opacity:0.9;}
  #nav ul ul li a{color:#fff !important;font-size: 14px!important; background: #ffa60c!important; padding: 7px 10px!important; border-bottom: 1px solid #e67604!important;}
  #nav ul ul li a:hover {background:#e67604!important; color:#fff!important;}
  #nav ul ul li a.mega.last{border-bottom:none!important;}
  #js-mainnav.megamenu .js-megamenu { font-family: 'Open Sans', sans-serif; }
  #nav .megaMenuToggle { color:#fff; font-weight: 600; }


  #js-mainnav.megamenu.blackwhite ul.level0 li:hover, #js-mainnav.megamenu.blackwhite ul.level0 li.active, #js-mainnav.megamenu.blackwhite ul.level0 li.over, #js-mainnav.megamenu.blackwhite ul.level0 li.haschild-over{background:transparent;box-shadow:none;}
  #js-mainnav.megamenu.blackwhite ul.level0 li.mega span.mega, #js-mainnav.megamenu.blackwhite ul.level0 li.mega a.mega, #js-mainnav.megamenu.blackwhite .megaMenuToggle{color:#fff;border-left:0px;}
  #content > div.item-page > div.page-header, #content > div.blog > div.page-header { overflow:hidden;position:absolute;width:100%;}
  #content > div.item-page > div.page-header h1,#content > div.blog > div.page-header h1, #banner > div.page-header h1 {color:#fff;position:relative;font-size:7vw;text-shadow:2px 2px #333;font-family:'Open Sans';padding-top:17%;width:100%;padding-left:0px;right:5%; text-align: right;}

  /* Bottom */
  div.bottom {max-width: 700px; margin: 20px auto; padding-top: 20px; border-top: 1px dotted #aaa; }
  div.bottom p {font-size:14px; line-height: 21px; text-align: center; }

  /* RSForm */
  #bottomsection .enquireNow{background:#c2540a;color:#fff;text-align:center;}
  #bottomsection .enquireNow .rsform-block{margin:10px 0px;}
  #bottomsection .enquireNow > form{font-size:15px;text-align:left;max-width:570px;margin: 10px auto 20px auto;padding:0px;}
  #bottomsection .enquireNow .rsform-input-box, #bottomsection .enquireNow .rsform-text-box, #bottomsection .enquireNow input[type="password"], #bottomsection .enquireNow .rsform-select-box{padding: 5px 10px;width:100%;border-radius:3px;background-color:#e5e5e5;color:#222;border:0;margin-bottom: 0px!important}
  #bottomsection .enquireNow .rsform-text-box{resize:none;height:100px;padding:5px 10px;}
  #bottomsection .enquireNow input[type="submit"]{text-transform:uppercase;font-weight:bold;padding:10px 32px;border:0px;color:#fff;margin: 5px 0px;border-radius:3px;background:#7c9726;}
  #bottomsection .enquireNow h4{font-size:21px;text-transform:uppercase;color:#fff;padding: 30px 0 0 0 ;}
  div.rsform-block-pagetitle,div.rsform-block-pageurl,div.rsform-block-bugoff {display:none;}
  div.bottom.content { margin-bottom: 20px; }
  div.bottom.content #userForm input, div.bottom.content #userForm textarea {width: 90%; }

  /* Content */
  #section div.item { padding-top: 15px; }
  div.item-page div.contentsection { margin-top: 20px; }
  div.cols-3 div.pull-none { max-height: 220px; overflow:hidden; }
  div.pull-none img { width: 100%; height:auto; }

  #content .subwrap{padding-top:50px;}
  span.highlight { font-size: 26px; line-height:21px; }

  .displaycsv_sortable{width: 100%;max-width:800px;min-width:600px;font-size: 13px; margin: 15px auto; border-spacing: 0; border-collapse: collapse;}
  .displaycsv_sortable td{ border: 1px solid #ecebeb; padding: 6px 4px; }
  .displaycsv_sortable tr:hover{background: #eee;}
  .displaycsv_sortable th {font-weight:bold;background: #ffa60c; border: 1px solid #ffa60c; text-align: center;color:#fff;padding: 6px 4px;}

  #section{overflow:hidden;}
  #section img { max-width: 100%; max-height: auto!important; }
  #section p.readmore { text-align: center; background: url(../images/bg-readmore.png) no-repeat; line-height: 17px; }
  #section p.readmore a { color:#76c9fb; font-size:12px; text-transform:uppercase; font-weight:700; text-align: center; text-decoration: none; padding:0 20px; background: #fff; }
  #section p.readmore a:hover { color:#7c9726; }
  #section p.readmore a:active { color:#222; }
      
  #section .cols-2 h2, #article .cols-3 h2 { font-size:18px; text-transform:uppercase; }
  #section h1 a { color:#ffa60c; text-decoration:none; }
  #section h2 a { color: #7b9726; text-decoration:none; }
  #section h2 a:hover { color: #757b87; text-decoration:none; }
  #section h2 a:active { color: #6b0107; text-decoration:none; }
  #section div.item-image img { display:inline }
  #section div.contentsection div.item-image { margin-bottom: 10px; }

  .logoscroll{padding:20px 0;}
  .logoscroll{}
  .logoscroll .djslider{border:10px solid #fff;background:#fff;}
  
  ul.breadcrumb {list-style:none;padding:0px;margin: 0px 0px 10px 0px; }
  ul.breadcrumb li{display:inline; font-size:15px;color:#aaa; margin: 0px 6px 0px 0px; padding: 0;}
  ul.breadcrumb li a{text-decoration:none;color:#aaa;margin: 0px 4px; }
  ul.breadcrumb li a:hover {text-decoration:underline;color:#ffa60c; }
  ul.breadcrumb li:first-child {text-transform:uppercase; margin: 0px; padding: 0;font-weight:700;}

  #content div.subwrap div.moduletable { text-align: center; }
  ul.category-module {display:inline-block;list-style:none;padding: 0px 10px;margin: 0px auto 20px auto; text-align: center; border: 1px solid #ffa60c; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
  ul.category-module li{display:inline-block; font-size:15px;color:#aaa; margin: 0px; padding: 0px;border-left: 1px solid #ffa60c;}
  ul.category-module li a{text-decoration:underline;font-weight: 600;color:#ffa60c;margin: 0px; padding: 4px 10px; display:block }
  ul.category-module li a:hover {text-decoration:none;color:#7c9726; }
  ul.category-module li:first-child {border-left: 0}
  ul.category-module li:hover {}

/* Tags */
  div.tagspopular ul, div.tags {padding: 0px; margin: 10px 0px 15px 0px; text-align: center; }
  div.tagspopular ul li, div.tags a.label {display:inline-block;list-style:none;padding: 0px 0px;margin: 3px auto; text-align: center; border: 1px solid #ffa60c; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size:12px; background: #fcedce;}
  div.tagspopular ul li a, div.tags a.label {text-decoration:none;font-weight: 600;color:#ffa60c;margin: 0px; padding: 1px 8px 3px 8px; display:block }
  div.tagspopular ul li a:hover {text-decoration:underline;color:#7c9726; }
  div.tagspopular ul li:hover {background: #e2ecc1; border-color:#7c9726;}
  div.tags a.label {display:inline-block }

div.tag-category ul.category.list-striped {padding: 0!important; margin:0!important; }
div.tag-category ul li.cat-list-row0 { display:inline; float: left!important; width: 48%!important; clear:both; padding: 0!important; margin:0!important; }
div.tag-category ul li.cat-list-row1 { display:inline; float: right!important; width: 48%!important; }
div.tag-category ul h3 a { margin: 30px 0px 20px 0; font-size: 27px; display:block; }

/* 3 Column Layout */
  div.cols-3 div.column-1 { float: left; width: 30%; margin-right:5%; margin-bottom:20px; position:relative; clear:both; }
  div.cols-3 div.column-2{ clear:none; float: left; width: 30%; margin-right:5%; margin-bottom:20px; position:relative; }
  div.cols-3 div.column-3 { float: left; width: 30%; margin-right:0%; margin-bottom:20px; position:relative; }
  div.cols-3 h2, div.tag-category h3 { font-size:16px!important; line-height: 22px; text-align: left; color:#ffa60c; font-weight: 600; margin-bottom: 0; }
  div.cols-3 h2 a, div.tag-category h3 a { color:#ffa60c!important; text-decoration: none;  }
  div.cols-3 p, div.tag-category p {  font-size: 12px; margin: 4px 0px; line-height: 155%; }
div.cols-3 p.readmore { margin-top: 10px; }

  /* 2 Coloumn Layout */
  div.cols-2 { width: 100%; }
  div.cols-2 div.column-1 { clear:both; float: left; width: 48%; }
  div.cols-2 div.column-2 { width: 48%; float: right; margin-right:0%; }
  div.cols-2 div.headersection { float: left; width: 40%; }
  div.cols-2 div.contentsection {float: right; width: 56%; }
  div.cols-2 h2 {  }

  /* 1 Column Layout */
  div.cols-1 div.column-1 { display: block;padding-top:0px; }

.pagination { clear:both;
	margin: 18px 0;
}
.pagination ul {
	display: inline-block!important;
	*display: inline!importantv;
	*zoom: 1;
	margin: 50px 0 0 0; padding: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.pagination ul > li {
	display: inline!important;
}
.pagination ul > li > a,
.pagination ul > li > span {
	float: left;
	padding: 4px 12px;
	line-height: 18px;
	text-decoration: none;
	background-color: #fff;
	border: 1px solid #ddd;
	border-left-width: 0;
}
.pagination ul > li > a:hover,
.pagination ul > li > a:focus,
.pagination ul > .active > a,
.pagination ul > .active > span {
	background-color: #f5f5f5;
}
.pagination ul > .active > a,
.pagination ul > .active > span {
	color: #999;
	cursor: default;
}
.pagination ul > .disabled > span,
.pagination ul > .disabled > a,
.pagination ul > .disabled > a:hover,
.pagination ul > .disabled > a:focus {
	color: #999;
	background-color: transparent;
	cursor: default;
}
.pagination ul > li:first-child > a,
.pagination ul > li:first-child > span {
	border-left-width: 1px;
	-webkit-border-top-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-left-radius: 4px;
}
.pagination ul > li:last-child > a,
.pagination ul > li:last-child > span {
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	border-bottom-right-radius: 4px;
}

  /* Portfolio Section */
  #projects-filter ul{line-height:20px;}
  .projects-wrapper{margin-left:0px;margin-right:0px;}
  .projects-wrapper .isotope-item.column-4{width:25%;height:auto;}
  .projects-wrapper .isotope-item.column-3{width:32%;height:auto;margin-right:10px;margin-bottom:15px;}
  .projects-wrapper .isotope-item.column-2{width:48%;height:auto;margin-right:10px;}
  .projects-wrapper .project-img, .project-wrapper .project-img{position:relative;height:100%;}
  .projects-wrapper .isotope-item .project-img img{width:100%;max-height:200px;}
  .projects-wrapper .project-item-meta h4 a{color:#ffa60c;text-decoration:none;font-weight:600;}
  .projects-wrapper .project-item-meta p{margin:5px 0 10px 0;line-height:20px;}
  .projects-wrapper .isotope-item{margin-left:0px;margin-right:0px;margin-bottom:0px;}
  .projects-filter li a{text-decoration:none;}
  .projects-filter a.selected, .projects-filter a.selected:hover{background:#7c9726;}

  /* Footer */
  #footer p { clear:both; color:#8f95a1; font-size: 12px; line-height:130%; margin: 0px 0px 10px 0px; text-align: center; }
  #footer ul { margin: 0px 0px; padding: 0px; font-size:12px; color:#8f95a1; text-align: center; }
  #footer ul li { margin:0px; padding: 0px; list-style:none; display:inline; text-align: center; }
  #footer ul li a { color: #8f95a1; text-decoration:none; border-left: 1px solid #8f95a1; padding: 0px 6px 0px 7px; }
  #footer ul li a:hover { color:#d3c098; border-bottom:0px; }
  #footer ul li:first-child a { border-left: 0; padding-left:0; }

  .scrollup { width:40px; height:40px; opacity:0.9; position:fixed; bottom:50px; z-index:99999; left:50px; display:none; text-indent:-9999px; background: url(../images/icon_top.png) no-repeat; }

#bottomsection div.util-item { width: 190px!important; height: 92px; }
#scroller .item a {-webkit-box-shadow:none!important; -moz-box-shadow:none!important; box-shadow:none!important;}

  /* +++++++++++++++++ */

  @media only screen and (max-width: 960px){
    #topsection { position: relative; height: 55px; padding-bottom: 30px; }
    #nav ul li a { font-size: 15px; padding: 10px 10px!important; }
    #section { top: 0px; }
    #content .subwrap{padding-left:5%;padding-right:5%;}
    #bottomsection{ top:0px; }
    .projects-wrapper .isotope-item.column-4{width:33.333333333%;}
    #projects-filter{padding-left:10px;}
  }

  /* Standard iPad */
  @media screen and (max-width: 767px) {
    div#topsection { padding-bottom: 30px;height: auto;  }
    div#content { margin: 0px 0px; } 

    div#logo { float: none; margin: 0px auto; padding: 30px 0px; width: 100%; }
    div#logo h2 { text-align: center; font-size: 10vw }

    #nav ul li a { font-size: 14px !important; }

    /* Form */
    #bottomsection .enquireNow > form{max-width:80%;margin: 10px auto 20px auto;padding:0px;}
    #bottomsection .enquireNow .rsform-text-box{width:95%!important;}
    #bottomsection .enquireNow input[type="submit"]{margin-left:0px;}
  }

  @media only screen and (max-width: 690px){
    div.left, div.right { clear: both; float: none; width: 96%; margin-left: auto; margin-right: auto; }
    
    h1 { font-size: 34px; padding-bottom: 20px; line-height: 38px; }  
    div.cols-4 h2 { font-size:24px!important; line-height: 27px; }  
    p { font-size:16px; line-height: 24px; }
    
    #content > div.item-page > div.page-header h1{font-size:10vw;}
    
    /* 3 Coloumn Layout */
    div.cols-3 div.column-1 { clear: both; float: none; width: 100%; margin-right:0%; }
    div.cols-3 div.column-2 { clear: both; float: none; width: 100%; margin-right:0%; }
    div.cols-3 div.column-3 { clear: both; float: none; width: 100%; margin-right:0%; margin-top: 15px; }
    div.cols-3 div.pull-none { max-height: 2200px; overflow:hidden; }
    
    /* 2 Coloumn Layout */
    div.cols-2 { width: 100%; }
    div.cols-2 div.column-1, div.cols-2 div.column-2 { clear:both; float: none; width: 100%; }
    div.cols-2 div.headersection { float: left; width: 36%; }
    div.cols-2 div.contentsection {float: right; width: 60%; }
    div.cols-2 h2 { font-size:23px; line-height: 27px; }

    div.cols-4 p.readmore, div.cols-3 p.readmore, div.cols-2 p.readmore { position:relative; margin-bottom: 30px; }
    
    #section div.clearing, #section div.clearfix { height: auto; }
    div.headersection, div.contentsection {float: none; width: 100%; }
    .feedback .formControlLabel{width:100%!important;}
    div.pagination{width:90%;}

    #userForm input, div.bottom.content #userForm textarea { margin-top: 5px; width: 95%!important; }

  }

  @media only screen and (max-width: 580px){
    #sitewrap {background-size: 200%;}
    div#logo h2 { text-align: center; font-size: 17vw }
    #nav h3.menuToggle { display: inline-block; float: right; padding: 12px 28px 0px 10px; margin: 0px 5%; font-size: 16px; font-weight: 700; text-transform: uppercase; color:#fff; background: url(../images/menuToggle.png) no-repeat right 10px;  }
    .topsection h3 { font-size:13px; margin: 0; }

    div.item { padding-top: 20px; }

  ul.category-module li { font-size: 12px; border-left: 0; display: block; border-bottom: 1px solid #ffa60c; }
  ul.category-module li:last-child { border-bottom: 0; }
  ul.category-module li a { text-decoration:none; }
  
    /* 2 Coloumn Layout */
    div.cols-2 { width: 100%; }
    div.cols-2 div.column-1, div.cols-2 div.column-2 { clear:both; float: none; width: 100%; }
    div.cols-2 div.headersection, div.cols-2 div.contentsection { float: none; width: 100%; }
    div.cols-2 h2 { font-size:28px; line-height: 32px; margin-bottom: 25px; }
    h1, div.blog h1 { text-align: center; }
    
    div.tag-category ul li.cat-list-row0,div.tag-category ul li.cat-list-row1 { display:block; float: none!important; width: 100%!important; clear:both; margin-bottom: 55px!important; }

    .feedback .rsform-text-box{width:90%!important;}
    .feedback .formControlLabel{width:100%!important;}

    /* Portfolio */
    .projects-wrapper .isotope-item.column-4{width:50%;}

  }

  @media only screen and (max-width: 480px){
    div#topsection { padding: 10px 0px; }
    div#logo h2 { line-height: 100%; margin-top: 15px; }
    div#nav { position: relative; }
    #content > div.item-page > div.page-header h1{font-size:15vw; right: 0; text-align: center; padding-top: 20%; }
    div.pagination{width:100%;}
  }

  /* Smaller Smartphones */
  @media only screen and (max-width:400px){
      #bottomsection .enquireNow form{max-width:300px;}
      #bottomsection .enquireNow .rsform-text-box{width:300px;}
  }