/**
 * @file
 * Stark layout method
 *
 * To avoid obscuring CSS added to the page by Drupal or a contrib module, the
 * Stark theme itself has no styling, except just enough CSS to arrange the page
 * in a traditional "Header, sidebars, content, and footer" layout.
 *
 * This layout method works reasonably well, but shouldn't be used on a
 * production site because it can break. For example, if an over-large image
 * (one that is wider than 20% of the viewport) is in the left sidebar, the
 * image will overlap with the #content to the right. The exception to this
 * is IE6 which will just hide the navigation block completely in these
 * instances due to a positioning bug.
 */

@import url('https://www.cncd.be/squelettes/theme/assets/vendor/bootstrap/bootstrap.min.css');

@import url('/sites/all/themes/cncd/fonts.css');
@import url('https://use.fontawesome.com/releases/v5.3.1/css/all.css');

body  {   
  font-family: 'BonnieSmConPro-Normal', sans-serif, Arial;
  font-size:16px;
  color:#555;
  margin:0px;
}

#page-wrapper { 
  padding:0px;
  margin: 0px;
}
#page {
  padding: 0px; 
}

#main-wrapper {
  margin: 25px auto;
  padding: 0px 10px;
  min-width: 300px;
  max-width: 720px;
  border-width: 0px;
  border-style: solid;
  border-color:#CCCCCC;}


#header .section {
  margin:0px; 
  padding:20px 0px;
}
/*
#logo {
  margin: 0px auto;
  width: 50%;
  display: block;
}
*/
#header .section a img  {
  padding:10px;
  margin: 10px auto;
  display: block;
}


#main #content .column { 
max-width: 1140px;
 width:98%;
margin:0px  auto;
}


h1.title {
font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial; 
text-transform:uppercase; 
letter-spacing: 2px;
color:#2c2c2c;
text-align:center;
font-weight:normal;
font-size:20px;
margin : 20px auto; }


.form-text {
display: inline-block;}
.form-number {
  width: unset;display: inline-block;}

.entity-civicrm-event > .group-footer {
  margin: 5px auto;
  padding: 5px;
  width: 300px;
  background: #EEE;
  border: 1px solid #CCC;
}

#breadcrumb {display:none}
#sidebar-first,
#sidebar-second {
  float: left;
  position: relative;}


#block-system-main-menu .content {
  max-width: 1200px;
  margin-left: auto; 
}

#navigation .section {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

#navigation,
.block-menu {
  background: #222;
  color: #fff;
  font-weight: 400;
  text-transform: uppercase;
  line-height: 46px;
  padding: .3rem 1rem;
  margin-bottom: 10px;
}


#main-menu,
.menu {
  list-style: none;
  list-style-type: none;
  list-style-image: none;
  list-style-position: outside;
}
/*
#main-menu ul,
.menu ul {
  position: relative;
  display: inline;
  padding-left: 10px;
}
*/
#main-menu li,
.menu li {
  position: relative;
  display: inline;
}
#navigation a,
.menu li a,
.block-menu a {
  color: #fff;
  text-decoration-line: none;
  transition-property: color, background-color, border-color;
  transition-duration: .2s;
  transition-timing-function: ease-in;
}

.menu li a:hover {
  color: #76b82b !important;
}


#navigation h2,
.block-menu h2 {
  display: none;
}
 
.menu-690 {
  margin-left: 1em;
}

.menu-696 {
  background: #ff9300;
  margin-right: 1em;
  float: right; 
}

/*
#block-system-main-menu > div > ul > li:first-child > a:before {
  content: "\f015  ";
}
*/
/* Messages / Status */
.status {
  max-width: 720px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Form */
.webform-client-form {
  padding: 10px; background: #fff; opacity:.8;filter: alpha(opacity=80);
  border: 1px solid #CCC;
}
.webform-component-fieldset {
  background: #F5F5F5;
  padding: 10px;

}
.form-wrapper {
  margin: 10px;
}

/* --- Hack Fontawesome --- */

.fa::before,
.far::before,
.fas::before {
  font-size: 110%;
  color: #76b82b;
  letter-spacing: 5px;
}


/* From www.cncd.be */
#footer {
  margin-top: 40px;
  background-color: #000;
  color: #fff;
}
#footer .section {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.copyright{
  color:#fff;
  background:#222;
  border-top:none;
  padding:10px 10px 5px;
  margin: 0 auto;
  font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial;
  text-transform :uppercase;
  font-weight:400;
  letter-spacing:1px;
}
.copyright li{
    margin-left: 5px;
    padding: 0px 5px;
    list-style: none;
    font-size: 13px;
}

a, a:link, a:visited {
    text-decoration: none;
    color: #76b82b;
    font-weight: 400;
}

legend {  
  font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial;
  font-weight:400;
  text-transform:uppercase;
  color: #555;
  letter-spacing:1px;
  font-size: 20px;
    display: inherit;
    width: inherit;
    max-width:inherit;
}


label, label.option {
  font-family:'BonnieSmConPro-Normal', sans-serif, Arial; 
  font-weight:400; 
  font-size: 90%;
}

label.option{ padding: 10px 5px; margin:0px; }

fieldset { margin: 40px auto 0px auto; border: 1px solid #CCC}


.form-item .form-type-radio:hover{ 
  color: #76b82b; }

.form-item label {
  letter-spacing:1px;
  font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial;
  text-transform :uppercase;
  font-weight:400;
  letter-spacing:1px;
}



.webform-progressbar {padding: 25px 0px;}
.webform-progressbar-page-label {font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial; font-weight: 400; letter-spacing:1px;text-transform:uppercase;}
.webform-progressbar-page {color: #CCCCCC;}
.webform-progressbar-page.current {color:#76b82b;}
.webform-progressbar-page-number {color:#76b82b;}


.webform-component-textfield, .webform-component-email, .webform-component-select
{float: left; width: 100%; display:block; overflow:hidden; }

.webform-component-textfield label, .webform-component-email label, .webform-component-select label
{float: left; width: 25%;}

.webform-component-textfield input[type=form-text], .webform-component-textfield input[type=email], .webform-component-textfield select[type=form-select]
 {float: left; width: 75%; }



input.form-submit, input.webform-submit {
  font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial;
  font-weight:400;
  text-transform:uppercase;
  font-size: 16px;
  letter-spacing:2px;
  box-shadow: none;
  border-radius: 0 !important;
  background:#ffffff;
  color:#ff9300;
  border:1px solid #ff9300;
  padding: 7px 12px;
  margin : 0px auto;
}

input[type=form-submit] {font-weight:400;}

input {padding: 7px 5px 7px 5px; font-size: 14px; color: #272727; }

input.webform-submit:hover {color:#FFF; background:#ff9300; padding: 7px 12px;}
input.button-primary:hover {background:orange; color:#FFF;}



table{
  background: #FFFFFF;
  width: 50%;
  margin : 20px auto;}

table > caption {
  display:none;
  background-color: #FFFFFF;
  font-family:'BonnieSmConPro-SemiBold', sans-serif, Arial; font-weight: 400; letter-spacing:2px;text-transform:uppercase
}

table > tbody > tr > td {background: #FFFFFF; border-color: #F5F5F5;}