/*  OnePagers Gradient Website Template
    Copyright (C) 2017  Hayden Ryan

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

/*
TABLE OF CONTENTS
-----------------
S1.  BODY STYLES
S2.  NAVBAR
S3.  HEADINGS
S4.  PARAGRAPHS
S5.  SECTIONS
S6.  FORMS
S7.  BUTTONS
S8.  ICONS & SQUARES
S9.  MISC
S10. FOOTER
S11. DEMO STYLES

*/

/*
---------------
S1. BODY STYLES
---------------
*/

body {
  font-family: 'Open Sans', sans-serif;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  -moz-font-feature-settings: "liga" on;
}

body a {
  color: #ffffff;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

body a:hover {
  color: #ffffff;
}

/*
-----------
S2. NAVBAR
-----------
*/

.navbar-default {
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: transparent;
}

.navbar-default li a {
  color: #ffffff !important;
}

.navbar-default .navbar-nav > .active{
  background-color: transparent;
  border-bottom: 2px solid;
  font-weight: bold;
 }
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
  background-color: transparent;
}


.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus {
  background-color: transparent;
}

.navbar-default li a:hover {
  border-bottom: 2px solid;
}

.navbar-default .navbar-nav .open .dropdown-menu>li>a, .navbar-default .navbar-nav .open .dropdown-menu {
  background-color: transparent;
  color:#ffffff;
}

.navbar-brand {
  color: #ffffff !important;
  font-weight: bold;
}

.navbar-fixed-top.scrolled {
  background-color: rgba(34, 34, 34, 0.95) !important;
  transition: background-color 1000ms linear;
}

.icon-bar {
  background-color: #ffffff !important;
}

.navbar-toggle:hover,
.navbar-toggle:focus {
  background-color: transparent !important;
}


/*
-------------
S3. HEADINGS
-------------
*/
h1 {
  font-weight: bold;
  font-size: 70px;
  padding-bottom: 25px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

h2 {
  font-weight: bold;
  font-size: 50px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

h3 {
  font-weight: bold;
  font-size: 30px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) { 
/* Make headings slightly smaller on mobile */
h1 {
  font-size: 50px;
}

h2 {
  font-size: 35px;
}

h3 {
  font-size: 25px;
}

}

/*
--------------
S4. PARAGRAPHS
--------------
*/

p {
  margin-bottom: 20px;
  margin-top: 12px;
  font-size: 18px;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  font-family: 'Merriweather', serif;
}

.lead {
  margin-bottom: 12px;
  margin-top: 12px;
  font-size: 25px;
}

/*
-------------
S5. SECTIONS
-------------
*/

.innershadow {
  -webkit-box-shadow: inset 0px 0px 14px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: inset 0px 0px 14px 0px rgba(0,0,0,0.75);
  box-shadow: inset 0px 0px 14px 0px rgba(0,0,0,0.75);
}

.section {
  color: #ffffff;
  padding-top: 50px;
  padding-bottom: 50px;
  min-height:50vh;
  background-attachment: fixed !important;
  text-align: center;
}

.section:hover {
  color: #ffffff;
}

.leadsection {
  color: #ffffff;
  padding-top: 300px;
  padding-bottom: 50px;
  min-height:75vh;
  background-attachment: fixed !important;
  text-align: center;
}

.leadsection:hover {
  color: #ffffff;
}

.leadsection a, .section a {
  text-decoration: underline;
}

/*
----------
S6. FORMS
----------
*/

input {
  color: #ffffff !important;
  background-color: transparent !important;
  border-color: #ffffff !important;
  border-width: 2px !important;
  border-radius: 25px !important;
}

input::placeholder {
  color: #cccccc !important;
}

label {
  font-size: 20px;
}

textarea {
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
  border-radius: 25px !important;
  border-width: 2px !important;
}

textarea::placeholder {
  color: #cccccc !important;
}

/*
------------
S7. BUTTONS
------------
*/

.bigger-btn {
  font-weight: bold;
  font-size: 20px;
  height: 55px;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 10px;
  margin-right: 10px;
}

.btnversion {
  font-size: 10px;
  display: block;
  margin-top: -5px;
}

.btn-trans {
  background-color: transparent;
  color: #ffffff;
  border-color: #ffffff;
  border-width: 2px;
  border-style: solid;
  border-radius: 25px !important;
  text-decoration: none !important;
}

/*
-------------------
S8. ICONS & SQUARES
-------------------
*/

.square {
  padding-top: 20px;
  padding-bottom: 20px;
}

.bigicon {
  font-size: 10em !important;
}

.contact-left {
  text-align: right;
  padding-right: 50px;
}

.contact-right {
  text-align: left;
  padding-left: 50px;
  border-left: 3px solid;

}
/*
---------
S9. MISC
---------
*/

.small {
  font-size: 13px;
}

/*
------------
S10. FOOTER
------------
*/

.footer {
  background-color: #222222;
  color: #cccccc;
  text-align: center;
  min-height: 25px;
}

.footer a {
  text-decoration: underline;
  text-decoration-style: dotted;
  color: #dddddd;
}

/*
---------------
S11. DEMO STYLES
---------------
*/

.demowell {
  text-align: center;
  min-height: 180px;
  color: #ffffff;
  border: 0px;
  padding-top: 70px;
  font-size: 20px;
  font-weight: bold;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.gradient-inverse {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
