@charset "UTF-8";
/* CSS Document */

@font-face{font-family:'RealheadSemi';src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc-Semilight.ttf) format('truetype');src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc-Semilight.woff) format('woff');font-weight:400;}
@font-face{font-family:'RealheadLight';src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc-Light.ttf) format('truetype');src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc-Light.woff) format('woff');font-weight:400;}
@font-face{font-family:'RealheadReg';src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc.ttf) format('truetype');src:url(/media/website_pages/designfuturescouncil.com/animation/fonts/RealHeadOffc.woff) format('woff');font-weight:400;}


	 html {
        height:100%;
        overflow-x:hidden;
    }
    
    /*html {
		scroll-behavior: smooth;
	}*/
    
  body {

      height:100%
    } 
	
	h1, h2, h3, h4, h5 {
		font-family:RealheadSemi;
	}
    
    h1 {
        font-size:2.1875rem;
    }
    
    h2 {
        font-size:1.6;
    }
    
    h3 {
        font-size:1.2;
    }
    
    h1 {
        color:#6F7070;
    }
	
	
	p, li {
		font-size:1.15rem;
		font-family:RealheadLight;
		color:#6F7070;
	}
	
	body.modal-open {
    overflow: visible;
}

.modal-dialog {
max-width:650px;
}
	
	.formRow {
background:#ffffff;
}
    
    .redarrow {
        color:#C02033;
    }
	
	a {
		text-decoration:none;
		color:#C02033;
		font-family:RealheadSemi;
	}
	
	a:hover {
		text-decoration:none;
		color:#486879;
	}
	
	
	/* Navbar Styles */
    
    .logo-main {
        width:70px;
		z-index:1031;
        left:8px;
		opacity:0%;
 animation: mymove 5s 1;
  animation-delay: 10s;
  animation-fill-mode: forwards;
    }
	
	@keyframes mymove {
  from {top: -100px;}
  to {top: 0px; opacity:100%;}
}
    
    .logo-main img {
        width:100%;
        height:auto;
    }
	
	nav {
	
	}
	
	nav h3 {
		color:#6F7070;
		font-size:1.4rem;
		font-family:RealheadReg;
	}
    
    .bg-light {
        background:rgba(253,252,252,1)!important;
    }
	
	.nav-item {
		font-size:1.125rem;
		margin-left:2rem;
        line-height:1.2rem;
	}
	
	hr {
  border-top: 2px dotted #678FA7;
}
	
	.navbar-toggler {
		background-color:rgba(255,255,255,0);
		border:none!important;
	}
	
	button:focus {
		outline:none!important;
	}
	
	.animated-icon1 {
width: 30px;
height: 25px;
position: relative;
margin: 0px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}

.animated-icon1 span {
display: block;
position: absolute;
height: 3px;
width: 100%;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}

.animated-icon1 span {
background: #C02033;
}


.animated-icon1 span:nth-child(1) {
top: 0px;
}

.animated-icon1 span:nth-child(2) {
top: 10px;
}

.animated-icon1 span:nth-child(3) {
top: 20px;
}

.animated-icon1.open span:nth-child(1) {
top: 11px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);
}

.animated-icon1.open span:nth-child(2) {
opacity: 0;
left: -60px;
}

.animated-icon1.open span:nth-child(3) {
top: 11px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);
}
    
    #linkbox {
        width:80%;
        margin:0 auto;
        display: flex;
  flex-wrap: nowrap;
    }
	
	.linkholder {
		width:50%;
		margin:20px;
	}
          
          .demo-gap {
              background:#ffffff;
          }
    
    
    .sect-head {
        background:#486879;
        color:#fff;
        padding:10px 0;
    }
    
    .sect-head h2 {
        font-weight:100;
        line-height:6.5rem;
        font-family:RealheadLight;
    }
    
    .sect-body {
        color:#486879!important;
        background:#F0F7FA;
        margin-top:8px;
        padding:50px 0 30px 0;
    }
    
    
    
    .sect-body h3 {
        font-family:RealheadLight;
        font-size: 2rem;
    }
    
    /* Event Styles */
    .eventb span {
        visibility:hidden;
        display:none;
    }
    
    /*Lottie Hero Styles */
    
    .heroblock {
	position:relative;

        /* The image used */
  background-image: url("/media/website_pages/designfuturescouncil.com/animation/splash-bg.jpg");
/*z-index:10;*/
  /* Set a specific height */
  min-height:900px;

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



.anim {
position:absolute;
top:2%;
left:50%;
transform: translate(-50%, -2%);
/*width:80vw;
height:80vh;*/
}

          .parallax1 {
               /* The image used */
  background-image: url("/media/website_designs/27/images/parallax1-2000x1333.jpg");

  /* Set a specific height */
  min-height: 700px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
          }
          
       .parallax2 {
               /* The image used */
  background-image: url("/media/website_pages/designfuturescouncil.com/animation/slanted-building.jpg");

  /* Set a specific height */
  min-height: 700px;

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

/* Small Devices */
@media (max-width: 767.98px) { 

.anim {
top:2%;
left:50%;
transform:translate (-2%, -50%);
/*width:100vw;
height:100vh;*/
}

.caretdwn {
position:absolute;
bottom:3%;
width:100%;
text-align:center;
}

.caretdwn img {
width:25px;
height:auto;
}

.heroblock {
height:40vh;
}


}
    
    /*Member News Styles*/
    
    .sect-body-mn {
        
        background:#ffffff;
        padding:0 15px 30px 15px;
        margin-top:8px;
    }
    
    .memnews {
        padding:0;
        margin:0;
    }
    
    .memnews img{
        display:block;
        width:100%;
        height:auto;
    }
    
    .spkr-box {
              position:relative;
              margin:0;
              cursor:pointer;
          }
          
          
          
          .spkr-box .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(255,255,255,0.8);
}
          
          .spkr-box:hover .overlay {
  opacity: 1;
}
    
          
          .text {
              font-family:RealheadLight;
		  width:90%;
  color: #425C65;
  font-size: 1.3rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
    
    .text button {
        background:rgba(255, 255, 255, 0.0);;
        color:#425C65;
        border:1px solid #425C65;
        border-radius:10px 0;
        padding:5px 20px;
        font-size:1rem;
        margin-top:20px;
    }
	
	
	
	
	/*footer styles */
    
    #sticky-footer {
  flex-shrink: none;
      
}
		  
.footer {
   /*position: absolute;
    bottom: 0;
    right:0;
    left:0; */
    padding:0;
    min-height:100px;
    line-height: 40px;
    background-color: #ffffff;
    padding: 20px;
}
.ft-logo {
    width: 85px;
    margin: 0 auto;
	padding-bottom:3px;
}
.ft-logo img {
    width: 100%;
    height: auto;
}
	
	.footer p, .footer a {
		font-size:1.25rem;
	}
	
	.social-cont {
		width:200px;
		margin:0 auto;
	}
	
	.social {
		width:30px;
	}
	
	.social img {
		width:100%;
		height:auto;
	}
    
    /* Mobile Media Query */
	
@media (max-width: 767.98px) { 
    
    h1 {
        font-size:1.7rem;
    }
    
    p, li {
        font-size:1.1rem;
    }
    
     #linkbox {
        width:100%;
  flex-wrap: wrap;
    }
	
	.linkholder {
	padding-top:3rem;
		width:100%;
		margin:10px;
	}
    
    .sect-body-mn {
        padding:0 15px;
        
    }
    
    .sect-head {
        padding:20px 0;
    }
    
    .sect-head h2 {
        font-weight:100;
        font-size:1.2rem;
        line-height:1.2rem;        
    }
    
    .sect-body h3 {
        font-size: 1.25rem;
    }
    
    .memnews {
        margin:10px 0 0 0;
    }
    
    .spkr-box .overlay {
  opacity: 1;
  background-color: rgba(255,255,255,0.80);
}
    
    .text button {
        background:#425C65;
        font-size:1rem;
        margin-top:20px;
		color:#ffffff;
    }
    
    .eventb span {
        visibility:visible;
        display:inline;
        color:#C02033;
    }
	
	 .heroblock {
  /* Set a specific height */
  min-height: 600px;
  background-attachment: scroll;
  background-position: top;
  background-size: 150% auto;

}

.parallax1 {
   min-height: 500px; 
   background-attachment: scroll;
  background-position: top;
  background-size: 200% auto;
          }
          
       .parallax2 {   
  min-height: 500px;
  background-attachment: scroll;
  background-position: top;
  background-size: 200% auto;
          }   
	
	
	}