/* ---------------------------------------------------
	Single-Page Scrolling HTML5 Portfolio Template v1.0 
	Source URL: (https://www.digitaldesignjournal.com/free-single-page-scrolling-html5-portfolio-template/)
34----------------------------------------------------- */
 
 @import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
 @import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:100,100i,200,200i,300,400,400i,500,500i,600,600i,700,700i&display=swap');
 
 body {
     font-family: 'Poppins', sans-serif;
     background-image: -webkit-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: -moz-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: -ms-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     -webkit-background-size: 3px 3px;
     -moz-background-size: 3px 3px;
     background-size: 3px 3px;
 }
 
 h1,
 h2 {
     font-weight: 600;
     text-transform: uppercase;
     font-size: 40px;
 }
 
 h3,
 .h3 {
     clear: both;
     font-size: 24px;
     margin-top: 0px;
 }
 
 p {
     font-family: 'Poppins', sans-serif;
     font-size: 1.1em;
     font-weight: 300;
     line-height: 1.7em;
	 color: #313131!important;
 }
 
 a,
 a:hover,
 a:focus {
     color: inherit;
     text-decoration: none;
     transition: all 0.3s;
 }
  
 .line {
     width: 100%;
     height: 1px;
     border-bottom: 1px dashed #ddd;
     margin: 40px 0;
 }
 /* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
 
 #sidebar {
     min-width: 250px;
     max-width: 250px;
     background-color: #2c3e50!important;
     color: #fff;
     transition: all 0.3s;
     background-image: -webkit-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: -moz-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: -ms-repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     background-image: repeating-radial-gradient(center center, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 1px, transparent 100%);
     -webkit-background-size: 3px 3px;
     -moz-background-size: 3px 3px;
     background-size: 3px 3px;
     box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
 }
 
 #sidebar.active {
     margin-left: -250px;
 }
 
 #sidebar ul.components {
     padding: 20px 0;
     border-bottom: 1px solid #47748b;
 }
 
 #sidebar ul p {
     color: #fff;
     padding: 10px;
 }
 
 #sidebar ul li a {
     padding: 10px;
     font-size: 1.1em;
     display: block;
 }
 
 #sidebar ul li a:hover {
     color: #f4623a;
     background: #fff;
 }
 
 #sidebar ul li.active>a,
 a[aria-expanded="true"] {
     color: #fff;
     background: #f4623a;
 }
 
 a[data-toggle="collapse"] {
     position: relative;
 }
 
 .dropdown-toggle::after {
     display: block;
     position: absolute;
     top: 50%;
     right: 20px;
     transform: translateY(-50%);
 }
 
 ul ul a {
     font-size: 0.9em !important;
     padding-left: 30px !important;
     background: #f4623a;
 }
 
 ul.CTA {
     padding: 20px;
 }
 
 ul.CTA a {
     text-align: center;
     font-size: 0.9em !important;
     display: block;
     border-radius: 5px;
     margin-bottom: 5px;
     background: #fff;
     color: #f4623a;
 }
 
 a.article,
 a.article:hover {
     background: #f4623a !important;
     color: #fff !important;
 }
 
 .btn-info {
     color: #fff;
     background: #f4623a;
     border: none;
     position: absolute;
     left: 0px;
     border-radius: 0px!important;
     z-index: 100;
 }
 
 .btn-info:hover,
 .btn-info:focus,
 .btn-info:active,
 .btn-info.active,
 .open .dropdown-toggle.btn-info {
     color: #fff;
     background-color: #f4623a;
     border-color: #f4623a;
 }
 /* ---------------------------------------------------
    CONTENT
----------------------------------------------------- */
 
 #content {
     width: 100%;
     min-height: 100vh;
     transition: all 0.3s;
     box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
     margin-left: 290px;
     background: #fff;
 }
 
 .wrapper {
     display: flex;
     width: 100%;
     align-items: stretch;
 }
 
 hr.divider {
     max-width: 3.25rem;
     border-width: .2rem;
     border-color: #f4623a;
 }
 
 .text-primary {
     color: #f4623a!important;
 }
 
 .img-rounded {
     border-radius: 100%;
 }

 /* ---------------------------------------------------
    CAROUSEL
----------------------------------------------------- */
 
 .carousel-inner {
     height: 350px;
 }
 
 .carousel-caption {
     background-color: rgba(0, 0, 0, .5);
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     z-index: 10;
     padding: 0 0 10px 25px;
     color: #fff;
     text-align: left;
 }
 
 .carousel-indicators {
     position: absolute;
     bottom: 0;
     right: 0;
     left: 0;
     width: 100%;
     z-index: 15;
     margin: 0;
     padding: 0 25px 25px 0;
     text-align: right;
 }
 
 .carousel-control.left,
 .carousel-control.right {
     background-image: none;
 }
 
 .img-responsive,
 .thumbnail > img,
 .thumbnail a > img,
 .carousel-inner > .item > img,
 .carousel-inner > .item > a > img {
     display: block;
     width: 100%;
     height: auto;
 }
 
 svg {
	margin: 20px;
 } 
 
 footer{
    padding: 10px 0;
    text-align: center;
    background: #f1f1f1;
    margin-top: 100px;
 }
 

 /* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
 
 @media (max-width: 768px) {
     #sidebar {
         margin-left: -250px;
     }
     #sidebar.active {
         margin-left: 0;
     }
     #sidebarCollapse span {
         display: none;
     }
     #content {
         margin-left: 0px;
     }
     .carousel-inner {
         height: 260px;
     }
 }
 
 @media (min-width:992px) {
     #sidebar {
         text-align: center;
         position: fixed;
         top: 0;
         left: 0;
         display: flex;
         flex-direction: column;
         width: 17rem;
         height: 100vh
     }
     #sidebar .navbar-brand {
         display: flex;
         overflow: hidden;
         height: 170px;
         margin: 0 auto;
         width: 150px;
         float: none;
     }
     #sidebar .navbar-brand .img-profile {
         border: .5rem solid rgba(255, 255, 255, .2);
         margin: 20px auto;
         overflow: hidden;
         height: 120px;
     }
     #sidebar .navbar-collapse {
         display: flex;
         align-items: flex-start;
         flex-grow: 0;
         width: 100%;
         margin-bottom: auto
     }
     #sidebar .navbar-collapse .navbar-nav {
         flex-direction: column;
         width: 100%
     }
     #sidebar .navbar-collapse .navbar-nav .nav-item {
         display: block
     }
     #sidebar .navbar-collapse .navbar-nav .nav-item .nav-link {
         display: block
     }
 } 
 
  @media screen and (min-width: 768px) {
     .section-outer {
         padding: 1.5em 0;
     }
 }
 
 @media screen and (min-width: 992px) {
     .container {
         max-width: 930px;
     }
 }