/* EireCodeCamp page CSS */


/* Custom fonts */
@import url('https://fonts.googleapis.com/css?family=Boogaloo|Josefin+Sans');

html {
    width: 100%;
    min-height: 100%;
}

body {
  font-family: 'Josefin Sans', sans-serif;
  font-size:1.8em;
  background: #F5F5F5;  /* Eggshell */
  width: 100%;
  min-height: 100%;  /* needed to fix overlapping- took AGES to fix!! */
  padding-top: 200px;
}

@media(max-width:767px) {
    .navbar {
        padding: 10px 0;
        transition: background .3s ease-in-out,padding .3s ease-in-out;
    }
    .navbar .navbar-form {
        width: 200px;
        padding-left:0;
        padding-right:0;
        margin-top:-40px; /* move search box up on smaller screen */
    }

    .top-nav-collapse {
        padding: 0;
    }
}

@media(max-width:549px) {
    .navbar .navbar-form {
        width: 185px;
        padding-left:0;
        padding-right:0;
    }
}

@media(min-width:548px) {/* improve search box on smaller screens*/
    .navbar {
        padding: 20px 0;
        transition: background .3s ease-in-out,padding .3s ease-in-out;
    }
    .navbar .navbar-form {
        width: 250px;
    }
    .top-nav-collapse {
        padding: 0;
    }
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #FF533D;
}

.navbar .navbar-form {
    padding-top: 0;
    padding-bottom: 0;
    margin-right: 0;
    margin-left: 0;
    border: 0;
    box-shadow: none;
}

/* Reset the top navigation */

.navbar-default{
  background-color: #0F1626;
  color:#FFF;
}

/* changes text in nav + a little spacing to the right */
.navbar-default .navbar-nav > li > a{
  margin-top:35px;
  color:#FFF;
  font-size:1.2em;
  margin-right: 10px;
}

/* sets up the colors for the active page/section */
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus{
  color:#FFF;
  background-color:#FF533D;
  border-radius: 0.5em;
}

/* when hovering over the other menu items */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus{
  transition: background-color 0.3s ease; /* fade effect */
  background-color:#F5F5F5;
  border-radius: 0.5em;
  color: #FF533D;
}

/* for the site logo */
.navbar-brand {
  padding: 0px;
  position:relative;
  margin: -10px 65px 4px 5px;
  width: 80px;
  height: auto;
}

#searchbox{
  width:auto;
}

/* change default color for search icon */
#searchsite{
  background-color:#FF533D;
}

/* change hover color for search icon */
#searchsite:hover{
  background-color:#AB987A;
}

/* move search to line up better with the nav buttons */
.navbar-form{
  margin:40px 50px 0px 0px;
}

.glyphicon-home{
  font-size:0.8em;
}

.intro-section {
    height: 100%;
    padding-top:30px;
    padding-bottom:100px;
    text-align: justify;
    background: #F5F5F5;
}

.about-section {
    min-height: 100%;
    padding-top:150px;
    padding-bottom:100px;
    text-align: justify;
    background: #AB987A; /* diff */
}

.tutorials-section {
    min-height: 100%;
    padding-top:150px;
    padding-bottom:100px;
    text-align: justify;
    background: #F5F5F5;
}


.tools-section {
    min-height: 100%;
    padding-top:150px;
    padding-bottom:100px;
    text-align: justify;
    background: #AB987A;
}

.faqs-section {
    min-height: 100%;
    padding-top:150px;
    padding-bottom:100px;
    text-align: justify;
    background: #F5F5F5;
}

.contact-section {
    min-height: 100%;
    padding-top:150px;
    padding-bottom:100px;
    text-align: justify;
    background: #AB987A;
}

.page-scroll{
  text-align:center;
  font-size: 1.5em;
}

.home{
  font-size: 1.8em;
  margin-left:70%;
  color: #FF533D;
  border-radius:50%;
}

/* Carousel custom styling */
#carousel-ecc{
  margin-bottom: 35px;
}

.carousel-caption > h3{
  color: #F5F5F5;
  background-color:#0F1626;
  padding: 15px;
  border-radius: 5px;
  opacity: 0.9;
}


/* Custom styling for the About section*/

/* Making the code box */
#mycode{
  background-color:black;
  padding: 20px;
  color:#0F0;
  text-align:left;
  text-transform: uppercase;
  font-family: Monaco, Consolas, "Lucida Console", "Courier New";
}
/* getting the block to blink */
.myblink{
  animation: blinker 1s linear infinite;
}

@keyframes blinker {  
  50% { opacity: 0; }
}
/* get numbered lines without the dots after the numbers */
#mycode ol { 
    counter-reset: item;
    list-style-type: none;
}
#mycode li { display: block; }
#mycode li:before { 
    content: counter(item) "  "; 
    counter-increment: item 
}

#developer{
  position:relative;
  float:right;
  max-width: 620px;
  height:auto;
  padding:15px;
}

#profile{
  position:relative;
  padding: 20px;
  float:right;
}

#aboutAccordian .panel-heading{
  background: #0F1626;
  color: #F5F5F5;
  padding:8px;
  margin: 2px
}

#aboutAccordian h4{
  font-size: 1.1em;
  padding:15px;
}

/*
  NAVY BLUE 0F1626
  LEATHER   AB987A
  CORAL     FF533D
  EGGSHELL  F5F5F5
  */

/* For the FAQs*/
#proposalAccordiansub1 .panel-heading{
  background: #FF533D;
  color: #F5F5F5;
  padding:8px;
  margin: 2px
}

#proposalAccordiansub1 h4{
  font-size: 1.2em;
  padding:15px;
}

/* Custom style for the contact section */

.clublink:link, .clublink:visited{
  font-weight:bold;
  color:#0F1626;
}

.clublink:hover{
  font-weight:bold;
  color:#000;
}

.btn-link{
  text-align:center;
  font-family: Boogaloo, sans-serif;
  background-color:#F5F5F5;
  color:#0F1626;
  padding:15px;
  margin: 15px;
  font-size:1.4em;
  width:300px;
  height:auto;
}

.btn-link:hover{
  background-color:#FF533D;
  color:#F5F5F5;
  text-decoration:none;
}

.btn-warning {
  background-color: #0F1626;
  border:2px solid #070A1F;
  color:#F5F5F5;
  font-size:1.2em;
}

.btn-danger{
  background-color: #FF533D;
  border:2px solid #BB3227;
  color:#F5F5F5;
  font-size:1.2em;
}

/*
  NAVY BLUE 0F1626
  LEATHER   AB987A
  CORAL     FF533D
  EGGSHELL  F5F5F5
  */