I am trying to figure out why none of my css is being applied when previewing my code. I've checked my file tree and made sure everything is linked, but it just shows up as plain text. I am using html/css/bootstrap 3.0.2 and jquery CDN. I also tried changing the order of the links, but nothing I do seems to work. I've included a portion of my code to be as clear as possible as to what is going on. Any help or suggestions is greatly appreciated.
====================================================================
Fonts
====================================================================
***/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700);
@import url('font-awesome.css');
/***
====================================================================
Reset
====================================================================
***/
* {
margin:0px;
padding:0px;
border:none;
outline:none;
}
/***
====================================================================
Global Settings
====================================================================
***/
body {
font-family: 'Open Sans', sans-serif;
font-size:14px;
color:#353535;
line-height:1.6em;
font-weight:500;
background:#ffffff;
-webkit-font-smoothing: antialiased;
}
a{
text-decoration:none;
cursor:pointer;
color:#000000;
}
a:hover,a:focus,a:visited{
text-decoration:none;
outline:none;
}
h1,h2,h3,h4,h5,h6 {
position:relative;
margin:0px;
background:none;
}
h1 {
font-size:24px;
}
h2 {
font-size:20px;
}
h3 {
font-size:18px;
}
p{
font-size:14px;
line-height:1.6em;
}
/***
====================================================================
Sidebar
====================================================================
****/
#sidebar{
position:fixed;
left:0px;
top:0px;
width:250px;
height:100%;
padding:0px 20px;
border-right:2px solid #cccccc;
z-index:10;
}
#sidebar .mCSB_inside > .mCSB_container{
margin-right:12px !important;
}
#sidebar .mCS_no_scrollbar .mCSB_container{
margin-right:0px !important;
}
#sidebar .menu-box{
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
overflow:auto;
padding:0px 0px 30px;
background:rgba(0,0,0,0.80);
transition:all 1000ms ease;
-moz-transition:all 1000ms ease;
-webkit-transition:all 1000ms ease;
-ms-transition:all 1000ms ease;
-o-transition:all 1000ms ease;
}
#sidebar .menu-box .logo{
position:relative;
text-align:center;
margin-bottom:35px;
padding:30px 20px 10px;
}
#sidebar .menu-box .logo img{
position:relative;
display:inline-block;
max-width:100%;
}
#sidebar .menu-box .sticky-menu{
position:relative;
}
#sidebar .menu-box .sticky-menu > ul{
position:relative;
display:block;
margin:0px;
padding:0px;
border-top:1px solid rgba(255,255,255,0.20);
}
#sidebar .menu-box .sticky-menu > ul > li{
position:relative;
display:block;
padding:3px 0px;
border-bottom:1px solid rgba(255,255,255,0.20);
font-size:20px;
color:#ffffff;
text-align:right;
}
#sidebar .menu-box .sticky-menu > ul > li > a{
position:relative;
display:block;
padding:7px 30px 7px 0px;
color:#ffffff;
font-size:13px;
font-weight:600;
line-height:20px;
text-transform:uppercase;
transition:all 300ms ease;
-moz-transition:all 300ms ease;
-webkit-transition:all 300ms ease;
-ms-transition:all 300ms ease;
-o-transition:all 300ms ease;
}
#sidebar .menu-box .sticky-menu > ul > li a .fa{
position:absolute;
right:-10px;
top:0px;
width:24px;
text-align:right;
color:#ffffff;
opacity:0;
font-size:12px;
display:block;
line-height:34px;
transition:all 500ms ease;
-moz-transition:all 500ms ease;
-webkit-transition:all 500ms ease;
-ms-transition:all 500ms ease;
-o-transition:all 500ms ease;
}
#sidebar .menu-box .sticky-menu > ul > li.current a .fa,
#sidebar .menu-box .sticky-menu > ul > li:hover a .fa{
right:6px;
opacity:1;
}
#sidebar .menu-box .sticky-menu > ul > li > a:hover,
#sidebar .menu-box .sticky-menu > ul > li.current > a,
#sidebar .menu-box .sticky-menu > ul > li.current-menu-item > a{
color:#cccccc;
}
#sidebar .copyright{
position:fixed;
left:0px;
bottom:5px;
width:250px;
height:30px;
font-size:13px;
color:#ffffff;
line-height:30px;
text-align:center;
}
#sidebar .copyright a{
color:#ffffff;
}
/*** <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.11.2.min.js" integrity="sha256-Ls0pXSlb7AYs7evhd+VLnWsZ/AqEHcXBeMZUycz/CcA=" crossorigin="anonymous"></script>
<title>Grest Fitness| Homepage</title>
<!-- Stylesheets -->
<link href="style.css/css/bootstrap.css" rel="stylesheet">
<link href="style.css/css/style.css" rel="stylesheet">
<link href="css/responsive.css" rel="stylesheet">
<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
<link rel="icon" href="images/favicon.png" type="image/x-icon">
<!-- Responsive -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script><![endif]
<[if lt IE 9]><script src="js/respond.js"></script>
<body class="hidden-bar-wrapper">
<div class="page-wrapper">
<!-- Preloder -->
<div id="preloder" class="preloader">
<div class="loader"></div>
</div>
<!-- Εnd Preloader -->
<!-- Main Header-->
<header class="main-header header-style-one">
<!--Header-Upper-->
<div class="header-upper">
<div class="outer-container">
<div class="inner-container clearfix">
<!-- Logo Box -->
<div class="logo-box">
<div class="logo"><a href="index.html"><img src="https://via.placeholder.com/180x78" alt="" title=""></a></div>
</div>
<!-- Logo -->
<div class="mobile-logo pull-left">
<a href="index.html" title=""><img src="https://via.placeholder.com/230x46" alt="" title=""></a>
</div>
<!-- Header Social Box -->
<div class="header-social-box clearfix">
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-twitter"></a>
<a href="#" class="fa fa-instagram"></a>
<a href="#" class="fa fa-linkedin"></a>
</div>
<div class="outer-box clearfix">
<!-- Hidden Nav Toggler -->
<div class="nav-toggler">
<div class="nav-btn"><button class="hidden-bar-opener">Menu</button></div>
</div>
<!-- / Hidden Nav Toggler -->
</div>
<div class="nav-outer clearfix">
<!--Mobile Navigation Toggler-->
<div class="mobile-nav-toggler"><span class="icon"><img src="images/icons/burger.svg" alt="" /></span></div>
<!-- Main Menu -->
<nav class="main-menu navbar-expand-md">
<div class="navbar-header">
<!-- Toggle Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse clearfix" id="navbarSupportedContent">
<ul class="navigation clearfix">
<li><a href="index.html">Home</a></li>
<li class="dropdown"><a href="#">About Us</a>
<ul>
<li><a href="about.html">About Us</a></li>
<li><a href="timetable.html">Time Table</a></li>
<li><a href="commingsoon.html">Comming Soon</a></li>
<li><a href="body-builder.html">Section Page 01</a></li>
<li><a href="body-builder-2.html">Section Page 02</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Trainers</a>
<ul>
<li><a href="trainer.html">Trainer 01</a></li>
<li><a href="trainer-2.html">Trainer 02</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Shop</a>
<ul>
<li><a href="shop-left.html">Shop Left Sidebar</a></li>
<li><a href="shop-right.html">Shop Right Sidebar</a></li>
<li><a href="shop-single.html">Product Single</a></li>
<li><a href="shopping-cart.html">Shopping Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Blog</a>
<ul>
<li><a href="blog.html">Our Blog</a></li>
<li><a href="blog-classic.html">Blog Classic</a></li>
<li><a href="blog-detail.html">Blog Detail One</a></li>
<li><a href="blog-detail-two.html">Blog Detail Two</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</div>
<!--End Header Upper-->
