@charset "utf-8";

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

dl.inline-flex {
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 98%;      /* set the container width*/
  overflow: visible;
  }

dl.inline-flex dt {
  flex: 0 0 11%;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  font-weight:700;
  }

dl.inline-flex dd {
  flex:0 0 89%;
  margin-left: auto;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.6;
  }

dl.project-participants {
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 98%;      /* set the container width*/
  overflow: visible;
  }

dl.project-participants dt {
  flex: 0 0 30%;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  font-weight:700;
  }

dl.project-participants dd {
  flex:0 0 70%;
  margin-left: auto;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 12px;
  line-height: 1.6;
  }

dl.awards-listing dt {
  font-size: 1.2rem;
  font-weight:700;
  margin-top: 12px;
  }

dl.awards-listing dd {
  margin-left: 0;
  font-size: 1.2rem;
  line-height: 1.6;
  }

h3.deck {
  font-size:1.4rem;
  margin-bottom: 18px;
  }

.sidebar {
  font-size: 1.2rem;
  }

.uppercase {
  text-transform: uppercase;
  }

.owl-prev {
  float:left;
  width: 9px;
  cursor: pointer;
  }

.owl-next {
  float:left;
  width: 9px;
  margin-left:14px;
  cursor: pointer;
  }

.title.section {
  background-color:#FFF;
  padding:20px 30px 4px 30px;
  }

.white.section {
  background-color:#FFF;
  padding:20px 30px;
  }

.grey.section {
  background-color:#E2E3E4;
  padding:20px 30px;
  }

.black.section {
  background-color:#040100;
  padding:20px 30px;
  color:#FFF;
  }

.black.section p a{
  color: #999;
  border-bottom: 1px solid #333;
  }

.black.section p a:hover{
  color: #009CEF;
  border: none;
  border-bottom: 1px solid #666;
  }

.black.bar {
  background-color:#040100;
  padding:20px 30px;
  color:#FFF;
  }

.black.bar p{
  font-size: 1.8rem;
  font-weight: 800;
  margin-bottom: 0;
  text-align: center;
	text-transform: uppercase;
  }

.black.bar p a{
  color: #FFF;
  border-bottom: solid 1px #414141;
  }

.black.bar p a:hover{
  color: #00AEEF;
  border-bottom: solid 1px #00AEEF;
  }

.black.bar p.user-name-line {
  text-align: left ;
  }

.black.bar p.user-controls-line {
  font-size: 11px;
	text-align:left;
	font-weight:300;
	text-transform:none;
	margin-bottom:20px;
  }

@media (min-width: 600px) {
  .black.bar p.user-name-line {
  text-align: right ;
  }

.black.bar p.user-controls-line {
  font-size: 11px;
	text-align:right;
	font-weight:300;
	text-transform:none;
	margin-bottom:0;
  }
}

.cyan.bar {
  background-color:#00AEEF;
  padding:20px 30px;
  color:#FFF;
  }

.cyan.bar p{
  font-size: 1.8rem;
  font-weight: 800;
  margin-bottom: 0;
  text-align: center;
  }

.cyan.bar p a{
  color: #555;
  border: none;
  }

.cyan.bar p a:hover{
  color: #040100;
  border: none;
  }

.cyan.section {
  background-color:#00AEEF;
  padding:20px 30px;
  color:#FFF;
  }

.cyan.section p a{
  color: #FFF;
  border: none;
  border-bottom: 1px solid #FFF;
  }

.cyan.section p a:hover{
  color: #BBB;
  border: none;
  }



.magenta.bar {
  background-color:#EC008D;
  padding:20px 30px;
  color:#FFF;
  }

.magenta.bar p{
  font-size: 1.8rem;
  font-weight: 800;
  margin-bottom: 0;
  text-align: center;
  }

.magenta.bar p a{
  color: #555;
  border: none;
  }

.magenta.bar p a:hover{
  color: #040100;
  border: none;
  }

.magenta.section {
  background-color:#EC008D;
  padding:20px 30px;
  color:#FFF;
  }

.magenta.section p a{
  color: #FFF;
  border: none;
  border-bottom: 1px solid #FFF;
  }

.magenta.section p a:hover{
  color: #BBB;
  border: none;
  }


.yellow.section {
  background-color:#FFF62D;
  padding:20px 30px;
  color:#222;
  }

.yellow.section p a{
  color: #222;
  border: none;
  border-bottom: 1px solid #222;
  }

.yellow.section p a:hover{
  color: #111;
  border: none;
  }

.card {
  border-top: 12px solid #999;
  }

.footer.section {
  background-color:#999;
  padding:20px 30px;
  }

.footer.section p {
  font-size:1.2rem;
  }

.section h1, h2, h3{
  font-weight:800;
  margin-bottom:1.0rem;
  text-transform: uppercase;
  }

.section h4 {
  font-weight:600;
  margin-bottom:0;
  text-transform: none;
  }

.section h5, h6 {
  text-transform:none;
  font-weight:600;
  margin-bottom:0.5rem;
  }

.footer.section a {
  border:none;
  }

.footer.section a:hover {
  border:none;
  }

a.bold-link {
  color:#00AEEF;
  }

div.contact-card {
  text-align: center;
  border-bottom: 1px solid #999;
  margin-top:30px;
  }

div.contact-card p{
  font-size:1.2rem;
  }

h1 a {
  color:#999;
  text-decoration: none;
  border:none;
  }


h1 a:hover {
  color:#666;
  text-decoration: none;
  border:none;
  }

h2 a {
  color:#999;
  text-decoration: none;
  border:none;
  }


h2 a:hover {
  color:#666;
  text-decoration: none;
  border:none;
  }


h2.home a {
  color:#000;
  text-decoration: none;
  border:none;
  }


h2.home a:hover {
  color:#00AEEF;
  text-decoration: none;
  border:none;
  }


h2.deselected a {
  color:#DFDFDF;
  text-decoration: none;
  border:none;
  }


h2.deselected a:hover {
  color:#00AEEF;
  text-decoration: none;
  border:none;
  }

a.img-link {
  border:none;
	text-decoration: none;
  }

.top-banner {
  background-image: none;
  background-size: 1196px 420px;
  padding-top: 0;
  padding-bottom: 0;
  }

@media (min-width: 550px) {
  .top-banner {
    background: url('https://cfaconcretepros.org/images/association-banner.jpg') no-repeat center center;
    display: block;
    padding-bottom: 310px;
    }
  }

a.no-link-border {
	border:none;
  }

fieldset label {
  margin-bottom: -0.5rem;
  }

.slash-bg {
  background-repeat: no-repeat;
  }

@media (min-width: 550px) {
  .slash-bg {
    background: url(https://cfaconcretepros.org/images/row-slash.gif);
    background-repeat: no-repeat;
    background-size: 15px 25px;
    background-position: 41.2% 0%;
    }
  }

.text-right {
  text-align: left;
  }

@media (min-width: 550px) {
  .text-right {
    text-align: right;
    }
  }

.main-logo {
  float: left;
  }

@media (min-width: 550px) {
  .main-logo {
    float: right;
    }
  }


#owl-home-slider-text {
  display: none;
}

@media (min-width: 550px) {
  #owl-home-slider-text {
  display: block;
}
  }

div#owl-home-slider-text div.item div.row {
  padding-top: 180px;
  padding-left: 6px;
}

@media (min-width: 600px) {
  div#owl-home-slider-text div.item div.row {
  padding-top: 240px;
  }
}

@media (min-width: 800px) {
  div#owl-home-slider-text div.item div.row {
  padding-top: 270px;
  }
}

@media (min-width: 900px) {
  div#owl-home-slider-text div.item div.row {
  padding-top: 300px;
  }
}

#home-slider-header {
  display: none;
  text-align: right;
}

#home-slider-header h2 {
  width: 39.5%;
  color:#FFF;
  font-size: 48px;
  position:absolute;
  z-index: 1000;
  padding-top: 180px;
  padding-left: 6px;
  line-height: 1.0;
}

@media (min-width: 550px) {
div#home-slider-header {
  display: block;
}
  }

@media (min-width: 600px) {
  div#home-slider-header h2 {
  padding-top: 240px;
  }
}

@media (min-width: 800px) {
  div#home-slider-header h2 {
  padding-top: 270px;
  }
}

@media (min-width: 900px) {
  div#home-slider-header h2 {
  padding-top: 300px;
  }
}

div.schedule-session {
  border:solid 1px #DDD;
  padding:15px;
  margin-bottom:40px;
  position: relative;
  }

div.schedule-session:hover {
  background-color:#E8E8E8;
  }

span.sched-tag-box {
  display:inline;
  padding-bottom: 3px;
  margin-top:50px;
  font-size:10px;
  text-transform:uppercase;
  color:#222;
  font-weight:600;
}


span.certification-tag {
  border-bottom: 3px solid #00A9EC;
}


span.networking-tag {
  border-bottom: 3px solid #ED008A;
  }

span.tour-tag {
  border-bottom: 3px solid #ED008A;
  }

span.virtualtours-tag {
  border-bottom: 3px solid #ED008A;
  }

span.enespañol-tag {
  border-bottom: 3px solid #00A9EC;
  }

span.keynotespeakers-tag {
  border-bottom: 3px solid #ED008A;
  }

span.exhibits-tag {
  border-bottom: 3px solid #FFF62D;
  }

span.expo-tag {
  border-bottom: 3px solid #FFF62D;
  }

span.education-tag {
  border-bottom: 3px solid #231F20;
  }

span.educationtrack-tag {
  border-bottom: 3px solid #231F20;
  }

span.designtrack-tag {
  border-bottom: 3px solid #231F20;
  }

span.generalsessions-tag {
  border-bottom: 3px solid #231F20;
}

span.constructiontrack-tag {
  border-bottom: 3px solid #231F20;
  }

span.meetings-tag {
  border-bottom: 3px solid #999;
  }

div.schedule-session a {
  color: #222;
  }

div.schedule-session a:hover {
  color: #222;
  }

.link-spanner {
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;
  z-index: 1;
  }

.parallax {
  /* The image used */
  background-image: url("../images/awards-gala-track-banner.jpg");

  /* Set a specific height */
  height: 300px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  }

p.session-date {
  background-image: url("https://cfaconcretepros.org/images/calendar-icon.gif");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  padding-left: 34px;
  margin-bottom: 3px;
  line-height: 1.8;
  }

p.session-ondemand {
  background-image: url("https://cfaconcretepros.org/images/ondemand-icon.gif");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  padding-left: 34px;
  margin-bottom: 3px;
  line-height: 1.8;
  }

p.session-attendees {
  background-image: url("https://cfaconcretepros.org/images/attendees-icon.gif");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  padding-left: 34px;
  margin-bottom: 3px;
  line-height: 1.8;
  }

p.session-location {
  background-image: url("https://cfaconcretepros.org/images/marker-icon.gif");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  padding-left: 34px;
  margin-bottom: 3px;
  line-height: 1.8;
  }

p.session-speaker {
  background-image: url("https://cfaconcretepros.org/images/speaker-icon.gif");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  padding-left: 34px;
  margin-bottom: 3px;
  line-height: 1.8;
  }

.parallax-window {
  min-height: 200px;
  background: transparent;
  }



.jcarousel ul li p.user-note-top {
  font-size: 13px;
  text-align:left;
  font-weight:300;
  text-transform:none;
}

.jcarousel ul li p.user-note-btm {
  font-size: 13px;
  text-align:left;
  font-weight:600;
  text-transform:none;
  margin-top:4px;
  
}

 /* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 8000; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
  padding-top: 60px;
}

/* Modal Content/Box */
.modal-content {
	background-color: #fefefe;
	margin: 5px auto; /* 15% from the top and centered */
	border: 1px solid #888;
	width: 300px; /* Could be more or less, depending on screen size */
	padding:20px;
	z-index: 9999;
}

/* The Close Button */
.close {
  /* Position it in the top right corner outside of the modal */
  position: absolute;
  right: 25px;
  top: 0;
  color: #000;
  font-size: 35px;
  font-weight: bold;
}

/* Close button on hover */
.close:hover,
.close:focus {
  color: red;
  cursor: pointer;
}

/* Add Zoom Animation */
.animate {
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
  from {-webkit-transform: scale(0)}
  to {-webkit-transform: scale(1)}
}

@keyframes animatezoom {
  from {transform: scale(0)}
  to {transform: scale(1)}
} 


.laurel-background {
	background-image: url("https://cfaconcretepros.org/images/laurel-award-background.png");
	background-repeat: no-repeat;
	background-size: contain;
  	background-position: center;
}

.laurel-background p{
	text-align: center;
}

/* Sepia */
img.imghover {
	-webkit-filter: brightness(100%);
	filter: brightness(100%);
}
img.imghover:hover {
	-webkit-filter: brightness(110%);
	filter: brightness(110%);
}

/* Sepia */
img.iconhover {
	-webkit-filter: opacity(100%);
	filter: opacity(100%);
}
img.iconhover:hover {
	-webkit-filter: opacity(0%);
	filter: opacity(0%);
}

/* Sepia */
a.tut img {
	-webkit-filter: brightness(100%);
	filter: brightness(100%);
	box-shadow: 0 4px 10px #AAA;
}
a.tut img:hover {
	-webkit-filter: brightness(110%);
	filter: brightness(110%);
}


.track-icon {
        position: relative;
        width: 360px; /* can be omitted for a regular non-lazy image */
        max-width: 100%;
    }
.track-icon img.icon-hover {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      bottom: 0;
      object-fit: contain;
      opacity: 0;
      transition: opacity .2s;
		cursor: pointer;
    }
.track-icon:hover img.icon-hover {
      opacity: 1;
    }

div.sessionCaption {
	font-size:10px;
	margin-top:8px;
	text-align:right;
}

div.sessionCaption p {
	font-size:10px;
	margin-top:0;
	text-align:right;
}



.pill-button {
	border-radius: 20px 20px 20px 20px / 50% 50% 50% 50%;
}
