@import url('https://fonts.googleapis.com/css?family=Work+Sans:300,400,500,700&display=swap');

::selection {background: #ccc;}
::-moz-selection {background: #ccc;}
::-webkit-selection {background: #ccc; color:#fff;}

html {
	font-size:14px;
    
}

body{
	color:#bbb;
	background-color: #222;
	font-family: 'Work Sans', sans-serif;
}



h1{
    margin-bottom:1rem;
    font-size:1.8rem;
    color:#f3f3f3;
}

.left-panel{
}

.logo img{
	width: 80%;
}

.logo {
    text-align:center;
    margin-left:auto;
    margin-right:auto;
    width:200px;
	margin-bottom:20px;
	margin-top:25px;
}

.btn{
    border-radius:0;
    
}


.button-clear{
          border-radius:0;
          border: solid 2px white;
          background:none;
          color:white;
          letter-spacing: 7px;
        padding: 10px 18px 10px 25px;
        text-transform:uppercase;
      }
.button-clear:hover{
          border-radius:0;
          border: solid 2px white;
          background:white;
          color:#333;
}
      
.button-clear:focus{
       box-shadow:none
           
       }
      
      
.home-name{
              color:white;
              text-transform:uppercase;
              letter-spacing: .4em;
              font-weight:bold;
              font-size:40px;
              
          }
          
.home-desc{
              color:white;
              text-transform:uppercase;
              letter-spacing: .4em;
              font-size: 15px;
          }

.full-menu ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

.full-menu ul > li{
	display: block;
	margin-bottom:6px;
}

.full-menu ul li a{
	display: block;
	color:#bbb;
}

.full-menu ul li.active > a{
	text-decoration: none;
	color:#fafafa;
}.full-menu ul li.active > a:hover{
	text-decoration: none;
	color:#fafafa;
}
.full-menu ul li a:hover{
	text-decoration: none;
	color:#fafafa;
}

.full-menu ul > li  ul{
	padding: 10px 0 10px 10px;
}

.full-menu ul > li  ul > li{
	display: block;
	margin-bottom:2px;
}

.mobile-menu{
    font-size: 17px;
}

.right-panel{
    padding:20px;
}

@media (min-width: 768px) {
    .right-panel{
        padding:45px 45px 45px 0;
        width: calc(100% - 300px);
    }
    
   .left-panel{
    position:fixed;
	width:300px;
	padding: 50px;
    }

    .logo img{
	width: 80%;
}

.logo {
    text-align:left;
    margin: 15px 0 40px 0;
    width:auto;
}

}

.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #808080;
}

 .menu-wrapper .dropdown-item{
        white-space:normal;
        padding:1rem 1rem;
    }
    
    .dropdown  .dropdown .nav-link {
    padding: 1rem 1rem;}
    
    .dropdown-menu .dropdown-menu {
        
    margin-right: 10px;
    margin-left: 10px;
    }
    
    ul ul .dropdown-toggle{
        
    }
    
.site-content{
    max-width:900px;
}
    
.form-control{
    border-radius:0;
}    
    
.gallery-item{
    float:left;
    padding:5px;
    border:0;
    width:100%;
    border-radius:0;
}

.gallery-item a:after{
    top:5px;
    bottom:5px;
    left:5px;
    right:5px;
    transition: all 0.2s ease;
}

.gallery-item > div:hover a:after{
    background:rgba(0,0,0,0.2)
}

@media (min-width: 800px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 2);
    } 
}


@media (min-width: 992px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 3);
    } 
}


@media (min-width: 1200px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 4);
    } 
}
@media (min-width: 1700px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 5);
    } 
}
@media (min-width: 2300px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 6);
    } 
}@media (min-width: 2900px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 7);
    } 
}@media (min-width: 3500px) { 
    .gallery-item, .grid-sizer {
        width: calc(100% / 8);
    } 
}