/**
 *                 ________  __      __  _________
 *                 \______ \/  \    /  \/   _____/
 *                   |    |  \   \/\/   /\_____  \ 
 *                   |    `   \        / /        \
 *                  /_______  /\__/\  / /_______  /
 *                          \/      \/          \/ 
 *             WMS - Website Management Software (c) 2022
 *                      by Direct Web Solutions
 * 
 * Default stylesheets
 *
 *   Edit this sheet to add your own user defined styles to build your templates
 *   on. You can also use bootstrap styles instead of these templates with the
 *   bootstrap addon module to build bootstrap templates instead.
 *
 *   Table of Contents:
 * -----------------------------------------------------------------------------
 *
 *   1) Basic layout items
 *   2) Login styling for prebuilt login boxes
 *   3) Header
 *   4) Navigation
 *   5) Main
 *   6) Footer
 *
 * -----------------------------------------------------------------------------
 * @category    User Defined
 * @package     WMS User Website
 * @license     https://www.directwebsolutions.ca/wms/v3/license 3.0+ License
 * @version     Release: 3.0.0
 */

/*  
    1). Basic layout items 
*/
html,body{padding:0;margin:0;color:#fff;background:#0f161e;font-family:'Lato',serif;font-size:14px;font-weight:400;}
.clear, .clearfix{clear:both;}
.showcontent{display:block !important;}
#cookie_banner{z-index:100;font-size:16px;position:fixed;bottom:0;line-height:1.3em;left:0;width:100%;background:#555;color:#ccc;border-top:1px solid #3b0e1e;}
#cookie_banner .cb_content{width:93%;max-width:1130px;margin:0 auto;padding:12px;}
#cookie_banner .cb_content .cb_text{width:80%;float:left;}
#cookie_banner .cb_content .cb_button{width:20%;float:left;text-align:center;}
#cookie_banner .cb_content .cb_button button{-webkit-appearance:button;-moz-appearance:button;touch-action:manipulation;outline:0;background:none;background-color:#fff;color:#222;padding:10px 15px;border:1px solid #222;border-radius:5px;cursor:pointer;font-family:"Roboto",sans-serif;min-width:84px;}
#cookie_banner .cb_content .cb_button button:hover{opacity:0.8;}
#cookie_banner .cb_content a{color:#fff;text-decoration:underline;}
#cookie_banner .cb_content a:hover{color:#fff;text-decoration:none;}
@media screen and (max-width:755px){
    #cookie_banner .cb_content .cb_text{width:100%;float:left;}
    #cookie_banner .cb_content .cb_button{width:100%;float:left;text-align:left;margin-top:14px;}
}
.center-text{text-align:center;}
.justify-content-center{justify-content:center !important;}

/*  
    3). Header
*/
header{display:block;width:100%;position:relative;background:#0f161e;}
header .logo{background:url("../images/logo.png") 0 0 no-repeat;width:200px;height:60px;display:inline-block;}
header .content{border-bottom:1px solid rgba(255,255,255,0.4);padding:20px 0;}
header .container{width:93%;max-width:1130px;margin:0 auto;}

/*  
    4). Navigation
*/
navigation{float:right;margin-top:24px;font-family:"Montserrat",Sans-serif;font-size:14px;font-weight:600;letter-spacing:0.6px;}
navigation ul{list-style:none;padding:0;margin:0;}
navigation ul li{float:left;padding-left:8px;margin-left:8px;}
navigation ul li a{color:#fff;text-decoration:none;transition:200ms all;}
navigation ul li a:hover{color:#F7A801;transition:200ms all;}
.mobile_navigation{display:none;font-size:17px;cursor:pointer;}
.desktop_navigation{display:block;}
@media screen and (max-width:650px){
    navigation .close{display:none;}
    .noscroll{overflow:hidden;}
    .navigation-bg{display:none;z-index:200;position:fixed;top:0;left:0;right:0;bottom:0;background:#000;background:rgb(0,0,0,0.4);}
    .mobile_navigation{display:block;}
    .desktop_navigation{z-index:300;display:none;position:fixed;width:90%;background:#fff;right:0;top:0;height:100%;max-height:100vh;overflow:auto;}
    .desktop_navigation li{float:none;margin:0;padding:0;width:100%;margin:20px 0;}
    .desktop_navigation li a{color:#222;text-decoration:none;transition:200ms all;font-size:18px;display:block;width:100%;text-align:center;}
    .desktop_navigation li a:hover{color:#F7A801;transition:200ms all;}
    navigation .close{color:#fff;background:#333;margin:0;padding:40px 0;text-align:center;font-size:20px;cursor:pointer;}
}
@media screen and (min-width:651px){
    navigation .close{display:none !important;}
}

/*  
    5). Main
*/
main{display:block;color:#111;width:100%;background:#fff;}
main h1{padding:20px;margin:0;}
main p{padding:0 20px;margin:0;line-height:1.3em;}
main .container{width:93%;max-width:1130px;margin:0 auto;padding:20px 0;}

/*
    6). Footer
*/
footer .container{width:93%;max-width:1130px;margin:0 auto;padding:20px 0;}
footer a{color:#004d99;text-decoration:none;}
footer a:hover{text-decoration:underline;}