:root {
    --main-dk-green:#00492a;
    --main-lt-green:#78bc73;
    --main-brown:   #cec5bc;
    --warm-grey-5:  rgb(191, 182, 172);
    --warm-grey-2:  rgb(233,227,219);
    --mustard:      rgb(212,209,15);
    --titleBGColour:rgba(0, 0, 0, 0.5);
}

.panelp h2 {
    color:black;
}

.panelp.lightGreenBGColor {
    color:black;
}

.brownBGColour {
    background-color:var(--main-brown);
}

.TurquioseBGColour {
    background-color:   rgb(0,138,176);
    color:              white;
}

.TurquioseFGColour {
    color:              rgb(0,138,176);
}

.greenBGColour {
    background-color:   rgb(65, 173, 73);
    color:              white;
}

.lightGreenBGColor, .a.lightGreenBGColor:focus {
    background-color:var(--main-lt-green);
    transition-duration:400ms;
}

a.lightGreenBGColor:hover {
    background-color:rgb(65, 173, 73);
    transition-duration:200ms;
}

.panelp.lightGreenBGColor, .panelp.lightGreenBGColor h2 {
    color:white;
}

.greenFGColour {
    color:              var(--main-lt-green);
}

.darkGreenBGColour {
    background-color:   var(--main-dk-green);
}

.darkGreenFGColour {
    color:              var(--main-dk-green);
}

div.darkGreenBGColour, div.darkGreenBGColour h2 {
    color               :white;
}

.darkGreenBGColour h3 {
    color               : var(--warm-grey-2);
}

.darkGreenBGColour input,.darkGreenBGColour select {
    color:black;
}

.mustardBTN {
    font-weight:bold;
    font-variant-caps:  all-small-caps;
    background-color:   var(--mustard);
    color:              var(--main-dk-green);
    transition-duration:400ms;
}

.mustardBTN:hover {
    background-color:   rgb(233, 209, 98);
    transition-duration:200ms;
}

.mustardBTN:active, .mustardBTN:focus, .mustardBTN:active:focus {
    background-color:   rgb(176, 163, 66);
    transition-duration:200ms;
}

.main40BG {
    background-color:rgb(119,166,148);
    color:white;
}

.main20BG {
    background-color:rgb(179,205,194);
}

.warmGrayBG {
    background-color: var(--warm-grey-5);
}

.warmLightGrayBG {
    background-color:var(--warm-grey-2);
}

.btn-success {
    background-color:var(--main-lt-green);
    color:white;
    font-weight:bold;
    box-shadow:0 1px 2px rgba(255,255,255,0.25) inset, 0 -1px 2px rgba(0,0,0,0.25) inset;
    border:none;
    margin-left:0.5vw;
    transition-duration:400ms;
    border-radius:5px!important;
    z-index:5001;
}

.btn-success:hover{
    background-color:#75a272;  
    transition-duration:200ms;
}

.btn-primary{
    background-color:rgb(0,138,176);
    transition-duration:400ms;
}

.btn-primary:hover{
    background-color:rgb(12, 65, 79);
    transition-duration:200ms;
}

a .greenBGColour, #social_media_wrapper > a > .fa {    
    background-color:#78bc73;
    transition-duration:400ms;
}

.btn.darkGreenBGColour {
    transition-duration:500ms;
}

.btn.darkGreenBGColour:hover {
    background-color:forestgreen;
    transition-duration:400ms;
}


#social_media_wrapper > a > .fa.contactIcon {
    background-color:   var(--main-dk-green);
    color:              white;
}

a:hover .greenBGColour, #social_media_wrapper > a:hover > .fa {
    background-color    :#75a272;
    transition-duration :200ms;
}

.navbar-default .navbar-nav > li > a {
    color               :var(--main-dk-green);
}

.pageTitle {
    position:relative;
    color               :var(--main-lt-green);
    text-align          :center;
    padding-top         :5vw;
    padding-bottom      :5vw;
    font-weight         :600;
    font-variant-caps   :titling-caps;
    animation-duration  :1.5s;
    animation-delay     :0.25s;
    overflow            :hidden;
    margin              :0;
}

.pageTitle > span {    
    position:absolute;
    top:0;left:0;bottom:0;right:0;
    margin              :-7px;
    background-position :center center;
    background-size     :cover;
    background-repeat   :no-repeat;
    z-index             :-1;
    -webkit-animation-name: darken;
    -webkit-animation-duration:2s;
    -webkit-animation-fill-mode:forwards;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count:1;
    -webkit-animation-timing-function:ease-out;
    animation-name      :darken;
    animation-duration  :2s;
    animation-delay     :1s;
    animation-fill-mode :forwards;
    animation-iteration-count:1;
    animation-timing-function:ease-in-out;
}

.panel-success > .panel-heading {
    background-color    :var(--main-dk-green);
    color               :white;
}

.panel-success .panel-body {
    background-color    :var(--warm-grey-2);
}

@keyframes darken {
    from {       
        -webkit-filter  :blur(0) brightness(1);
        filter          :blur(0) brightness(1);
    }
    to{        
        -webkit-filter  :blur(5px) brightness(0.35);
        filter          :blur(5px) brightness(0.35);
    }
}

 .comparisonTable tbody > tr {
     border-bottom      :5px solid var(--main-lt-green);
 }

 .glyphicon-remove-sign {
     color              :var(--warm-grey-5);
 }

  .glyphicon-ok-sign {
      color             :var(--main-lt-green);
  }


  a > .glyphicon-info-sign {
      font-size         :xx-large;
      color             :white;
  }
  

  .pricingDiv table > thead > tr:first-child {
      background-color  :var(--main-dk-green);
  }

@media (min-width: 1280px) {
    .pageTitle {        
        font-size       :48px;
        padding-left    :0;
    }

    .navbar-default .navbar-nav > li > a {
        font-size       : 1vw;
    }
}

@media (max-width:767px){
    a > .glyphicon-info-sign  {
        font-size       :x-large;
    }

    .pageTitle {
        text-align      :center;
        padding         :25px;
    }
}