@charset "UTF-8";
/* =============================================================================================
                              ________  __      __  _________
                              \______ \/  \    /  \/   _____/
                                |    |  \   \/\/   /\_____  \ 
                                |    `   \        / /        \
                               /_______  /\__/\  / /_______  /
                                       \/      \/          \/ 
                          WMS - Website Management Software (c) 2022
                                   by Direct Web Solutions

    The following document, also known as the Default.css file, is developed for the
    sole use of directwebsolutions.ca by the team at Direct Web Solutions. This design 
    was developed by us and is considered the property of our company. Please do not 
    steal the code from this template as we have worked hard on it to make our 
    business successful. If you would like to take parts of the css for use in
    your own project, you may do so, but copying all of it or cloning our website 
    would be grounds to pursue legal action. Thanks for understanding and have a 
    great day!
    
    ~ Darryn Fehr,
    Direct Web Solutions
    
    ----------------------------------------------------------------------------------------
    
                                       Table of Contents

    1).     Reset Common Elements
    2).     Basic Layout Properties
    3).     Header & Navigation
    4).     Main Content Area
    5).     Footer Elements
    6).     Animations
    7).     Mobile Overides

    ----------------------------------------------------------------------------------------
    @category    User Defined
    @package     WMS User Website
    @license     https://www.directwebsolutions.ca/wms/v3/license 3.0+ License
    @version     Release: 3.0.1
============================================================================================= */

/*  =======================================
        1). Reset Common Elements
    =======================================*/
*{padding:0;margin:0;box-sizing:border-box;text-rendering:optimizeLegibility;}
html,body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;width:100%;padding:0;height:100%;margin:0;outline:none;text-rendering:optimizelegibility;background:#222d3a;color:#cccccc;font-family:'Open Sans',sans-serif;font-size:14px;line-height:1.50em;}
header,main,footer,p,h1,h2,h3,h4,h5,h6{display:block;padding:0;margin:0;box-sizing:border-box;text-rendering:optimizeLegibility;}
div{padding:0;margin:0;box-sizing:border-box;text-rendering:optimizeLegibility;}

/*  =======================================
        2). Basic layout properties
    =======================================*/
.browserupgrade{max-height:41px;position:fixed;top:0;width:100%;overflow:hidden;padding:10px;background:#fffee0;color:#2d2c05;text-align:center;}
.browserupgrade a:link,.browserupgrade a:visited,.browserupgrade a:active{text-decoration:none;color:#8284bc;}
.browserupgrade a:hover{text-decoration:underline;}
.only-show-on-mobile,.only-show-on-mobile-inline{display:none;}
.clear{clear:both;}
.container{width:98%;max-width:1150px;margin:0 auto;}
#upgrade_spacer{height:41px;}
.clear, .clearfix{clear:both;}
.small_login_box{max-width:300px;text-align:center;}
.small_login_box .username{padding-bottom:20px;font-size:17px;font-weight:700;}
.small_login_box .login_options .login_button:hover{background-color:#F3F4F6 !important;text-decoration:none;transition-duration:0.1s;}
.small_login_box .login_options a:focus{outline:1px transparent;}
.small_login_box .login_options a:before{display:none;}
.small_login_box .login_options a:-webkit-details-marker{display:none;}
.small_login_box .login_options a.login_button{text-decoration:none;display:block;border:1px solid rgba(27,31,35,0.15);border-radius:6px;box-shadow:rgba(27,31,35,0.04) 0 1px 0,rgba(255,255,255,0.25) 0 1px 0 inset;box-sizing:border-box;color:#24292E;cursor:pointer;font-family:-apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size:16px !important;font-weight:500;padding:6px !important;transition:background-color 0.2s cubic-bezier(0.3,0,0.5,1);text-align:center;width:100%;}
.small_login_box .login_options a.register_button{text-decoration:none;display:block;border:1px solid rgba(27,31,35,0.15);border-radius:6px;box-shadow:rgba(27,31,35,0.04) 0 1px 0,rgba(255,255,255,0.25) 0 1px 0 inset;box-sizing:border-box;color:#fff !important;background:#2d9148;cursor:pointer;font-family:-apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size:16px !important;font-weight:500;padding:6px !important;transition:background-color 0.2s cubic-bezier(0.3,0,0.5,1);text-align:center;margin-top:5px;width:100%;}
.small_login_box .login_options a.register_button:hover{color:#fff !important;background:#217036 !important;}
.small_login_box .social_logins{padding:10px 0;text-align:center;font-size:10px;color:#999;}
.small_login_box .social_logins ul{list-style:none;padding:0;margin:0;text-align:center;}
.small_login_box .social_logins ul li{display:inline !important;padding:0;margin:0 3px;}
.small_login_box .social_logins ul li a{display:inline-block !important;width:auto !important;padding:15px !important;font-size:18px !important;border:1px solid #ccc;border-radius:4px;text-decoration:none;}

/*  =======================================
        3). Header & Navigation
    =======================================*/
header{color:#fff;display:block;position:relative;width:100%;}
header ::selection,header ::-moz-selection{background:transparent;}
header .content{width:100%;background:#1f2428 url("../images/banners/cityscape.webp") center center/cover no-repeat;}
header .top-bar{z-index:3;background:#1f2d3d;color:#fff;padding:10px;border-bottom:1px solid #3f5267;}
header .top-bar .top-bar-right-items{float:right;padding-top:7px;list-style:none;font-size:11px;color:#c5c5c5;}
header .top-bar .top-bar-right-items a:link,header .top-bar .top-bar-right-items a:visited,header .top-bar .top-bar-right-items a:active{outline:0;color:#f7f7f7;text-decoration:none;}
header .top-bar .top-bar-right-items a:hover{text-decoration:underline;}
header .top-bar .top-bar-right-items li{display:inline-block;border-right:1px solid #EE4F1E;padding:0 14px;}
header .top-bar .top-bar-right-items li:last-of-type{border-right:none;padding-right:0;}
header .top-bar .top-bar-right-items li i{padding-right:5px;}
header .top-bar .top-bar-socials{float:left;list-style:none;color:#fff;font-family:'Font Awesome 5 Free';}
header .top-bar .top-bar-socials a:link,header .top-bar .top-bar-socials a:visited,header .top-bar .top-bar-socials a:active{display:block;text-align:center;width:34px;height:34px;padding:7px;outline:0;font-size:12px;color:#fff;text-decoration:none;}
header .top-bar .top-bar-socials a:hover{background:#4c5764;border-radius:100%;}
header .top-bar .top-bar-socials li{display:inline-block;padding:0 5px;white-space:nowrap;text-align:center;position:relative;}
header .head{padding:20px 0;}
header .head .logo{z-index:4;display:inline-block;width:214px;height:58px;background:url("../images/logo.webp") 0 0 no-repeat;}
header .head .navigation{z-index:5;position:relative;margin-top:11px;float:right;list-style:none;background:rgba(0,0,0,0.3);border:1px solid transparent;border-radius:5px;}
header .head .navigation .navigation-li{float:left;}
header .head .navigation .navigation-li .primary-link{outline:0;display:inline-block;padding:8px 12px;text-decoration:none;color:#fff;border-bottom:1px solid transparent;}
header .head .navigation .navigation-li:hover .primary-link{outline:0;background:rgba(0,0,0,0.3);}
header .head .navigation .navigation-li .active-primary-link{border-bottom:1px solid #689c49;}
header .head .navigation .navigation-li:hover .active-primary-link{border-bottom:1px solid #87c165;}
header .head .navigation .navigation-li .dropdown-container{display:none;position:absolute;top:38px;width:100%;min-height:100px;padding-top:10px;color:#222;left:0;}
header .head .navigation .navigation-li .dropdown-container .dropdown-content{background:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,.175);-moz-box-shadow:0 6px 12px rgba(0,0,0,.175);box-shadow:0 6px 12px rgba(0,0,0,.175);}
header .head .navigation .dropdown-menu:hover .dropdown-container{display:block;z-index:6;}
header .head .navigation .navigation-li .small-dropdown-container{display:none;position:absolute;top:38px;width:50%;min-width:282px;min-height:100px;padding-top:10px;color:#222;right:0;}
header .head .navigation .navigation-li .small-dropdown-container .dropdown-content{background:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,.175);-moz-box-shadow:0 6px 12px rgba(0,0,0,.175);box-shadow:0 6px 12px rgba(0,0,0,.175);}
header .head .navigation .dropdown-menu:hover .small-dropdown-container{display:block;z-index:6;}
header .head .navigation .navigation-li .about-links ul{list-style:none;padding:0;margin:0;padding-top:8px;line-height:1em;}
header .head .navigation .navigation-li .about-links ul li{float:none;display:block;width:100%;margin:0px;}
header .head .navigation .navigation-li .about-links ul li a{padding:10px;text-decoration:none;color:#222;display:block;text-transform:none;font-size:16px;}
header .head .navigation .navigation-li .about-links ul li a:hover{background:#e6f4ff;color:#605e84;}
header .head .navigation .navigation-li .dropdown-content .drop-padding{position:relative;width:100%;padding:20px;}
header .head .navigation .navigation-li .dropdown-content .drop-colum{width:50%;float:left;}
header .head .navigation .navigation-li .dropdown-content .col-t{font-size:14px;text-transform:uppercase;font-weight:700;font-family:Open Sans,sans-serif;}
header .head .navigation .navigation-li .dropdown-content .col-s{margin-top:12px;}
header .head .navigation .navigation-li .dropdown-content .drop-colum ul{list-style:none;padding:0;margin:0;padding-top:8px;line-height:1em;}
header .head .navigation .navigation-li .dropdown-content .drop-colum ul li{float:none;display:block;width:100%;margin-top:4px;}
header .head .navigation .navigation-li .dropdown-content .drop-colum ul li a{padding:0;text-decoration:none;color:#222;display:inline-block;text-transform:none;font-size:16px;}
header .head .navigation .navigation-li .dropdown-content .drop-colum ul li a:hover{background:#fff;color:#605e84;}
header .head .navigation .navigation-li .dropdown-content .drop-colum ul li i{padding-right:6px;color:#999;}
header .head .navigation .user_menu{list-style:none;margin:0;padding:0;text-align:left;}
header .head .navigation .user_menu li{list-style:none;margin:0;padding:0;text-align:left;margin-top:3px;}
header .head .navigation .user_menu li i{padding-right:10px;}
header .head .navigation .user_menu li a{display:block;color:#222;text-decoration:none;border:1px solid #ccc;border-radius:4px;padding:10px 13px;}
header .head .navigation .user_menu li a:hover{background:#f7f7f7;}
header .head .navigation .user_menu li a.logout{color:#fff;border:1px solid #d64d5b;background:#d6404f;}
header .head .navigation .user_menu li a.logout:hover{background:#bf3d4a;}
header .head .avatar{width:80%;margin:0 auto;text-align:center;max-width:120px;margin-bottom:10px;}
header .head .avatar img{width:100%;height:auto;box-sizing:border-box;border-radius:50%;}
header .head .navigation .close{display:none;color:#222;width:100%;border-bottom:1px solid #444;background:#fff;padding:14px;cursor:pointer;text-align:center;font-size:16px;}
header .head .navigation .close:hover{background:#444;}
header .head .hamburger{display:none;float:right;margin-right:0;padding:16px;font-size:19px;cursor:pointer;text-transform:uppercase;}

/*  =======================================
        4). Main Content Area
    =======================================*/
main{display:block;background:url("../images/background.webp") 0 0 repeat #f4f2f7;color:#222;width:100%;}
main .padding{padding:30px 10px;}
main a{color:#214C5A;text-decoration:none;}
main a:hover{text-decoration:underline;}
main .breadcrumbs{margin-bottom:10px;padding-bottom:0;border-bottom:1px solid #fff;}
main .breadcrumbs .breadcrumb{border-bottom:1px solid #ccc;list-style:none;padding:0;margin:0;padding-bottom:10px;}
main .breadcrumbs .breadcrumb li{display:inline;}
main .breadcrumbs .breadcrumb li + li::before{content:"\f105";font-family:'Font Awesome\ 6 Free';font-weight:900;padding-left:4px;padding-right:4px;}
main .breadcrumbs .breadcrumb a{color:#214C5A;text-decoration:none;}
main .breadcrumbs .breadcrumb a:hover{text-decoration:underline;}
main .notice{border:1px solid #ffffcc;background:#faf8e1;padding:7px;margin-bottom:15px;margin-top:15px;}
main .information{border:1px solid #b6d4fe;background:#cfe2ff;padding:7px;margin-bottom:15px;margin-top:15px;}
main .header{margin-top:20px;}
main .textblock{padding-top:20px;text-align:justify;}
main .textlist{margin:10px 0;margin-left:40px;}
main .textlist li{padding-top:5px;text-align:left;}
main .textlist li ul{margin-left:20px;}
main .standard-box{padding:12px;border:1px solid #ccc;color:#222;background:#fff;border-radius:4px;}

/*  =======================================
        5). Footer Elements
    =======================================*/
footer{color:#222;}
footer .prefoot{background:#222d3a;color:#ccc;border-top:1px solid #265266;}
footer .prefoot .padding{margin-top:30px;margin-bottom:20px;border-top:4px double #37485c;border-bottom:4px double #37485c;}
footer .social{width:99%;box-sizing:border-box;overflow:hidden;margin:0 auto;margin-top:12px;margin-bottom:32px;max-width:1150px;}
footer .social ul{overflow:hidden;margin:0 auto;list-style:none;text-align:center;}
footer .social ul a{color:#fff;text-decoration:none;display:block;padding:8px 0;}
footer .social ul i{padding-right:10px;}
footer .social ul li{text-align:center;margin:0;background:#2a3848;list-style:none;display:block;float:left;height:auto;border-right:1px solid #222D3A;width:33.333333%;}
footer .social ul .facebook:hover{background:#214379;}
footer .social ul .twitter:hover{background:#42a4d7;}
footer .social ul .linkedin:hover{background:#1a96d5;}
footer .prefoot .row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
footer .prefoot .row .col-sm{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%;}
footer .prefoot .row .col-sm .language_selector{text-align:center;padding-top:14px;font-size:16px;}
footer .prefoot .row .col-sm .language_selector select{cursor:pointer;font-size:16px;margin:0;width:120px;padding:5px 35px 5px 5px;font-size:16px;border:1px solid #37485c;color:#6d849e;border-radius:4px;height:34px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:url("../images/language_selection_blue.webp") 96% / 15% no-repeat #222d3a;}
footer .prefoot .row .col-sm .language_selector select::-ms-expand{display:none;}
footer .prefoot .row .border-right{border-right:1px solid #37485c;}
footer .prefoot .row .heading{font-size:16px;font-weight:600;font-family:"Open Sans";color:#9bc682;margin-bottom:0;padding-left:20px;padding-top:20px;display:inline-block;}
footer .prefoot .row .logo{width:100%;max-width:214px;height:58px;margin:0 auto;background-image:url("../images/logo-alt.webp");background-repeat:no-repeat;background-size:100%;margin-top:40px;}
footer .prefoot .row .menu{padding:20px;list-style:none;padding-top:0;float:none;margin:0;line-height:1.54em;}
footer .prefoot .row .menu .menu-item{display:block;font-size:14px;margin-left:0;text-align:left;font-family:"Open Sans";list-style-type:none;margin-top:15px;}
footer .prefoot .row .menu .menu-item a{transition:.2s linear;color:#fff;text-decoration:none;}
footer .prefoot .row .menu .menu-item a:hover{transition:.2s linear;color:#effbe7;}
footer .copyright{padding:10px;line-height:1.4em;font-size:12px;padding-top:13px;padding-bottom:13px;color:#ccc;}
footer .copy{padding-top:4px;padding-bottom:4px;}
footer .top{cursor:pointer;background:#000;background:rgba(0,0,0,0.5);border-radius:4px;color:#fff;float:right;padding:4px 8px;}
footer .bottom{background:#fff;border-bottom:1px solid #dddddd;line-height:1.4em;font-size:12px;color:#9aa6ca;}
footer .bottom a{color:#9aa6ca;text-decoration:none;transition: .2s linear;}
footer .bottom a:hover{color:#23527c;transition: .2s linear;}
footer .bottom .padding{padding:0 10px;}
footer .bottom .quicklinks{list-style:none;margin:0;padding:0;padding-top:20px;padding-bottom:20px;}
footer .bottom .quicklinks li{display:inline-block;margin-right:13px;}
footer .bottom .quicklinks li:last-of-type{margin:0;}
footer .bottom .supported{float:right;}
footer .bottom .supported .cpanel{display:inline-block;margin-right:14px;background:url("../images/cpanel.webp") 0 0 no-repeat;background-size:100%;width:110px;height:44px;}
footer .bottom .supported .payments{display:inline-block;background:url("../images/payments-accepted.webp") 0 0 no-repeat;background-size:100%;width:110px;height:44px;margin-top:8px;}
footer .slide-bar{margin-top:30px;font-family:'hkgrotesk';color:#ccc;}
footer .slide-bar .row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;}
footer .slide-bar .row .rowitem{border-right:1px solid #37485c;-ms-flex:0 0 33.33333%;flex:0 0 33.33333%;max-width:33.33333%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center;padding-top:2rem;padding-bottom:2rem;}
footer .slide-bar .row .rowitem:last-of-type{border-right:none}
footer .slide-bar .row .rowitem .icon{width:18px;height:18px;vertical-align:text-bottom;margin-right:1.5rem;}
footer .slide-bar .row .rowitem .service-col{text-align:left;}
footer .slide-bar .row .rowitem .service-col .title{font-weight:800;color:#fff;font-family:'hkgroteskbold';text-transform:uppercase;}

/*  =======================================
        6). Animations
    =======================================*/
@-webkit-keyframes fade{from{opacity:.4}to{opacity:1}}
@keyframes fade{from{opacity:.4}to{opacity:1}}

/*  =======================================
        7). Mobile Overrides
    =======================================*/
@media screen and (max-width:810px){
    footer .prefoot .row .col-sm{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%;margin-bottom:20px;}
    footer .prefoot .row .logo{display:none;}
    footer .prefoot .row .clogs{clear:both;}
    footer .slide-bar .row .rowitem, footer .prefoot .row .border-right{border:none;}
    footer .prefoot .row .hidemsmallone{display:none;}
    footer .slide-bar .row .rowitem{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%;padding-top:10px;padding-bottom:10px;}
    footer .prefoot .row .col-sm .language_selector{text-align:left;padding-left:20px;}
}
@media screen and (max-width:805px){
    header .head .navigation-bg{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#000;background:rgb(0,0,0,0.4);}
    header .head .navigation{position:fixed;margin-top:0;float:none;background:#fff;border:0;border-radius:0;top:0;right:0;bottom:0;width:400px;border-left:2px solid #000;height:100%;display:none;overflow-y:scroll;}
    header .head .navigation .close{display:block;color:#fff;background:#222;}
    header .head .navigation .user_menu{padding-bottom:20px;}
    header .head .navigation .navigation-li{position:relative;width:100%;display:block;box-sizing:border-box;}
    header .head .navigation .navigation-li .primary-link{display:block;color:#222;border:0;}
    header .head .navigation .navigation-li:hover .primary-link{outline:0;background:#eee;}
    header .head .navigation .navigation-li .active-primary-link{border:0;background:#f3f3f3;}
    header .head .navigation .navigation-li:hover .active-primary-link{border:0;background:#e1e1e1;}
    header .head .navigation .caret{float:right;}
    header .head .navigation .mobile-caret{display:block;position:absolute;width:100%;min-height:37px;z-index:10;top:0;}
    header .head .navigation .navigation-li .dropdown-container{display:none;position:relative;top:0;padding:0;;}
    header .head .navigation .navigation-li .small-dropdown-container{display:none;position:relative;top:0;width:100%;padding:0;}
    header .head .navigation .navigation-li .dropdown-container .dropdown-content{border:0;border-top:1px solid #eee;border-radius:0;}
    header .head .navigation .dropdown-menu:hover .dropdown-container{display:none;}
    header .head .navigation .dropdown-menu:hover .small-dropdown-container{display:none;}
    header .head .navigation .navigation-li .small-dropdown-container .dropdown-content{border:0;border-top:1px solid #eee;border-radius:0;}
    header .head .navigation .navigation-li .dropdown-content .drop-padding{padding:20px;}
    header .head .navigation .navigation-li .dropdown-content .drop-colum{width:100%;float:none;}
    header .head .navigation .showmobilemenuitem{display:block !important;}
    header .head .navigation .activeli{background:#eee;}
    header .head .navigation .navigation-li .dropdown-content .col-t{font-size:16px;margin:16px 0;}
    header .head .navigation .navigation-li .dropdown-content .drop-colum ul{list-style:none;padding:0;margin:0;padding-top:0;line-height:1em;padding-bottom:20px;}
    header .head .navigation .navigation-li .dropdown-content .drop-colum ul li a{padding:5px;display:block;font-size:16px;}
    header .head .navigation .navigation-li .about-links ul{padding-bottom:0;}
    header .head .navigation .navigation-li .about-links ul li{padding:0;padding-bottom:10px;}
    header .head .navigation .navigation-li .about-links ul li a{font-size:16px;}
    header .head .navigation .navigation-li .about-links ul li a:hover{background:#fff;color:#605e84;}
    header .head .hamburger{display:inline-block;}
    .small_login_box{max-width:300px;text-align:center;margin:0 auto;}
    .mobile-account-menu{padding-top:10px;padding-bottom:10px;color:#222;width:238px;margin:0 auto;}
    .only-show-on-mobile-inline{display:inline-block;}
    .only-show-on-mobile{display:block;}
    .remove-on-mobile{display:none !important;}
    .remove-on-mobile ul{display:none !important;}
    .remove-on-mobile li{display:none !important;}
    .noscroll{overflow:hidden;}
    .showcontent{display:block !important;}
}
@media screen and (max-width:570px){
    main .mobile-clear{clear:both;}
    footer .bottom .quicklinks{margin:0 auto;text-align:center;}
    footer .bottom .supported{padding-top:0;float:none;margin:0 auto;text-align:center;}
}
@media screen and (max-width:553px){
    header .head .navigation{border:0;left:0;width:100%;}
    header .top-bar .right .removeonmobile{display:none;}
    header .top-bar .top-bar-right-items li{border-right:none}
}
@media screen and (max-width:452px){
    footer .prefoot .row .hidemsmalltwo{display:none;}
    footer .slide-bar .row .rowitem{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%;}
}