:root {
	--primary: #279cd8;
	--secondary: #E95153;
    --yellow: #F5C800;
	--bluegrey: #e0e0e0;
	--tertiary: #344552;
	--pink: #b6346a;
	--darkgreeen: #41c11e;
	--lime: #bbd330;
	--white: #FFF;
    --black: #575757;
	--red: #e63322;
	--darkred: #bc2019;
	--lightgrey: #E2E2E2;
	--murkeyyellow: #dbbc7a;
    --borderradius:5px;
    --border-width: 2.5px;
}
body{font-size: 1.5rem !important; font-family: 'Open Sans', sans-serif !important; color:#575757 !important;}
p { line-height: 1.5 !important; margin-bottom: 3rem !important; }
h1, h2, h3, h4, h5, h6 {font-family: 'Open Sans', sans-serif; }
.login-container {position: relative;}
.nav-btns {position: absolute; right:30px; top:-50px; z-index: 2;}
.black-holder {background: #000; background-image: url(../images/brand/bg.jpg); background-size: cover; background-position: top; color: #FFF;}
.black-holder h1 {font-family: 'Open Sans', sans-serif; padding:20px 4rem; background-color:#FFF; border-radius:7px; font-size:4rem; margin:3rem auto; color: var(--tertiary);}
.black-holder .modal {color: #000;}
.content-left{background-color: var(--primary); padding:5rem 3rem; border-radius: 15px; font-size:18px;}
.dash-row {margin-left:-15px; margin-right: -15px;}

.pageFooter{ width:100%; background-color: #ECECEC; font-size:15px; text-align: center; padding:30px 20px; position: relative;}
.pageFooter a { color: var(--black); text-decoration: none;}
.pageFooter p {	margin: 0;}
.pageFooter img {position: absolute; bottom: 0; right: 0; max-width: 65px;}

.flex-contain {display: flex; align-items:center; justify-content: space-between;}
.flex-contain .navbar-clear {margin-right:-5rem;}
.logos {padding:0;} .logos img {max-width: 120px; margin-left: -5px;}
.the-100 {max-width:100%;}
.main-hold {display: flex; align-items: center; padding-bottom: 3rem;}
.login-box {}
.the-login-panel{position:relative; background-color: var(--primary); border-radius: 50%; height: 40vw; width: 40vw; max-width:600px; max-height:600px; display: flex; flex-direction: column; justify-content: center; padding: 3rem;}
.admin-login-panel{background-color: var(--secondary) !important;}
.the-generate-password-panel{position:relative; background-color: var(--primary); max-width:600px; max-height:600px; display: flex; flex-direction: column; justify-content: center; padding: 3rem;}

#loginForm input.form-control {position:relative; background-color: transparent; border: 1px solid #FFF; border-radius: var(--borderradius); right:-5px; color: #FFF; height: 38px;}
#loginForm ::placeholder { color: #FFF; opacity: 1; /* Firefox */}
#loginForm :-ms-input-placeholder {color: #FFF;}
#loginForm ::-ms-input-placeholder { /* Microsoft Edge */color: #FFF; }

.panel-heading{color: #575757 !important;}
.the-login-panel-heading h4.the-login-panel-title {text-transform:none; color:#FFF; font-size:4rem; letter-spacing: 1px; text-align: center; margin-bottom:25px; font-weight: bold; }
.the-login-panel .form-horizontal .control-label {text-align:right; font-size:20px; color:#FFF; font-weight:700; padding-right: 0; padding-top:5px; padding-bottom: 5px;}
.btn-login.btn-primary {background-color:var(--secondary) !important; color:#FFF; border-radius:3px; text-transform:none; font-size:14px; font-weight:bold; padding:6px 10px;}
.btn-login.btn-primary:hover {background-color:#000 !important; color:#FFF;}

.btn-login.btn-secondary {background-color:var(--primary) !important; color:#FFF; text-transform:none; font-size:14px; font-weight:bold; padding:6px 10px; border:1px solid #FFF !important;}
.btn-login.btn-secondary:hover {background-color:var(--secondary) !important; color:#FFF;}

.the-login-panel-footer .pull-right {margin-right:50px;}
.register-link.btn-primary {border:1px solid #FFF !important;}
.cap input {position:relative; left:-10px;}
.btn-hold {padding-right:30px; padding-left:11px;}
.btn-hold p {margin-top: 10px; font-size:18px; padding-right: 40px;}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {background-color:var(--yellow); color: var(--black);}
.table-bordered > tbody > tr:hover > td {background-color:var(--bluegrey);}
.table-bordered th {background-color:var(--primary); color:#FFF;}
.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {background:none; background-color: var(--secondary);}
.pageContent .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus, .dropdown-menu>li:hover>a, .pageContent .btn-primary {background:none;
    background-color: var(--secondary);
    /*background-image: -webkit-gradient(linear, left 0%, left 100%, from(#B3B3B3), to(#B3B3B3));
    background-image: -webkit-linear-gradient(top, #B3B3B3 0%, #B3B3B3 100%);
    background-image: -moz-linear-gradient(top, #B3B3B3 0%, #B3B3B3 100%);
    background-image: linear-gradient(to bottom, #B3B3B3 0%, #B3B3B3 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff103e96', endColorstr='#ff103e96', GradientType=0); background-color: #B3B3B3; */color:#FFF;}
.pageContent .btn-primary:hover {border:none;}
a.btn.btn-primary {background-image:none; background-repeat:no-repeat; background-color:var(--primary); color:#FFF; border-radius:3px; border:none; padding:8px 15px; font-size:15px; font-weight:bold; text-transform:none; box-shadow:none;}
.btn.btn-primary:hover {background-color: var(--secondary);}

a.btn.btn-secondary {background-image:none; background-repeat:no-repeat; background-color:var(--secondary); color:#FFF; border-radius:3px; border:1px solid #FFF !important; padding:8px 15px; font-size:15px; font-weight:bold; text-transform:none; box-shadow:none;}
.btn.btn-secondary:hover {background-color: var(--secondary);}

.navbar-clear {margin-bottom: 0;}
.topDetails {background-color: var(--primary);}
@media screen and (max-width: 991px) { .navbar-clear { clear:both; float:none; margin-top:0; right:0;} }
.project-navbar .navbar-nav {float:right;}

.navbar-clear .navbar-nav > li > a {padding: .5rem 1.5rem; color:#fff; border:var(--border-width) solid var(--primary); background-color:var(--primary); margin-right: 10px; font-weight: 600; font-size: 18px;}
.navbar-clear .navbar-nav > li.active > a, .navbar-clear .navbar-nav > li:hover > a { border:var(--border-width) solid var(--primary); background-color: var(--white); color: var(--black);}
.navbar-clear .nav .open > a, .navbar-clear .nav .open > a:hover, .navbar-clear .nav .open > a:focus { background-color: var(--white); color: var(--black);}

.project-navbar .navbar-nav > li > .dropdown-menu {    background-color: var(--primary); color: #fff; border-radius: 0;}
.project-navbar .dropdown-menu > li > a {border-bottom: 1px solid var(--primary); padding: 6px 20px; background-color: var(--primary); color: #FFF; border-radius: 0;}
.project-navbar .dropdown-menu > li:hover > a {border:var(--border-width) solid var(--primary); background-color: var(--white); color: var(--black);}

/* learner dark nav */
.flex-contain .navbar-clear .dropdown-menu li > a, .flex-contain .navbar-nav > li > .dropdown-menu {background-color: #011627; color: #FFF; border-radius: 0;}
.flex-contain .navbar-clear .dropdown-menu li > a {border-bottom: 1px solid #2e3f4d; padding:6px 20px;}
.flex-contain .navbar-clear .dropdown-menu li:last-child > a {border-bottom: none;}
.flex-contain .navbar-clear .dropdown-menu li > a:hover  {background-color: var(--primary); color: #FFF;}

.flex-contain .navbar-clear li > a:hover img, .navbar-clear .nav .open > a:hover img, .navbar-clear .nav .open > a:focus img, .navbar-clear .navbar-nav > li.active > a img {filter: invert(1);}

/* admin dark nav */
.admin-contain {margin-top: 2rem; margin-bottom: 2rem;}

/* progress bullets */
.pr-flex {background-color: #e0e0e0; padding:10px 20px; margin:10px 0; font-size: 1.3rem; display: flex; align-items: center; justify-content: space-between;}
.pr-flex h3 {font-size: 2rem !important;}
.pr-flex h6 {font-size: 1.3rem !important; margin: 0 !important;}
.pr-flex i {margin-left: 5px; width:15px; height: 15px; border-radius: 15px; background-color: var(--primary); border:var(--border-width) solid var(--primary);}
.pr-flex i::before {content: " ";}
.pr-flex i.completed-circle {color:var(--primary); }
.pr-flex i.incomplete-circle {background-color:var(--white);  border: var(--border-width) solid var(--primary);}
.pr-flex > div {display: flex; justify-content: space-between;}
.pr-flex .lab {white-space: nowrap;}

.menu-tile{margin-bottom: 0; border-radius:0; padding:5px 15px; margin-top:10px;}
.dropdown-menu {min-width:210px;}
/* #loginerroralert{position: absolute; width: 200px; left: -42px; font-size: 13px; bottom: 10rem;} */

/* resources */
.a-resource {background-color: #f2f3f4; border-radius: 10px; margin-bottom: 10px;}
.a-resource > div {padding:10px 40px;}
.a-resource h3 { font-weight: 900; color: var(--tertiary); font-size:2.6rem; margin:0; margin-top:15px}
.a-resource p {font-size:2rem !important; color: var(--tertiary);}
.flex-resource {display:flex; align-items: flex-end; justify-content: space-between;}
.flex-resource p {align-self: flex-start;}
.flex-resource a {background-color: var(--primary); border:var(--border-width) solid var(--primary); padding:15px; border-radius: 50%; color: #FFF; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; margin-top:-10px;}
.flex-resource a:hover {color: var(--primary); background-color: #FFF; text-decoration: none;}

/* learning journey begin */
button.btn.filter-button {padding: 1px 10px; text-transform: uppercase; font-size: 1.3rem; border-radius: 0; border: none;}
#jrn-total {display:flex; flex-direction: row; flex-wrap:wrap; margin:0px -15px;}
.journey-block {color:#000; margin-bottom:0; position:relative;}
.journey-closer {position:absolute; width:10px; left:0; bottom:0; height:99px; background-color:#FFF; z-index:3; display:none;}
.journey-block .title {border-radius: 0px; }
.journey-block .title h3 {margin:0px; font-size: 2.6rem; color: var(--tertiary); font-weight: 900;}
.journey-block .title h3 .badge {position:relative; top: -5px; margin-left:5px;}
.journey-block .title h6 {color: var(--primary); font-size: 18px; font-weight: 900; margin-bottom:5px;}
/* .journey-block h3 {margin:0; padding:10px 0px; font-weight: bolder; font-size:30px; font-family: 'Limejuice', sans-serif; } */
.journey-block .the-progress-bar { background-color:#dcdcdc; color:#000; font-weight:300; font-size:14px; padding:1px 5px 2px 5px; margin:10px 0px; position:relative;}
.journey-block .the-progress-bar .the-complete-bar {width:40%; position: absolute; top:0; left:0; background-color:#9C0; height:100%; z-index:1;}
.journey-block .the-progress-bar .pc {position:relative; z-index:2;}
.journey-block .badge {border-radius:3px; padding:2px 5px; text-transform:uppercase; font-weight:300; font-size:12px;}
.title { /*border-left:10px solid #39C; */border-bottom:none;}
.learning-journey {margin-bottom: 5vw;}
/* .journey-details { padding: 0 10rem;border-left:10px solid #39C; background-color: #E5E5E5;} */
.all-modules {margin:0 10px;}
.modules-row {display: flex;}
.modules-row > div {width:18%; margin:1%;}
.agency img {max-height:70px; margin-top:40px;}

#bundle_accordion h4 {justify-content: center; padding-top:5px; color:var(--tertiary); font-size:2.4rem; line-height: 2.8rem; font-weight: 900; display: flex; align-items: flex-start;} 
#bundle_accordion .module-data h4 { font-size: 1.6rem;}
.alert{border:1px solid rgba(255,255,255,.6); border-radius:0;}
.alert.alert-dark {background-color:var(--primary); color:#FFF;} .alert.alert-light { color:#FFF; background-color:var(--primary);} .alert-black {background-color:#393534; color:#FFF !important;} .alert-progress {background-color:#f5e248; color:#000;}
.alert-progress h5 {color:#000;} .alert-black h5, .alert-dark h5, .alert-light h5 {color:#FFF;}
.alert.alert-info-dark{background-color:var(--tertiary);}
.panel-title > a {color:#FFF;} .panel-title a:hover {color:var(--primary);}
.block-description { padding:20px 20px 0 20px; color: #000}
.a-block {position: relative; z-index: 40; display:flex; align-items:stretch; align-content:stretch; flex-wrap:wrap; flex-direction:row;}
.a-module {width:100%; display:flex; flex-direction:column; border: var(--border-width) solid var(--primary); align-content:stretch; align-items:stretch; justify-content:space-between; overflow: hidden; text-align: center;
margin-bottom:15px; margin-top:15px; position:relative;}
.a-module h4 {margin-top:0; margin-bottom: 5px;  text-align: center;}
.a-module .left-bar {position:absolute; width:30px; left:-30px; top:65px; /*border-bottom:10px solid #39C;*/ display:none; z-index:2;}
.a-module .right-bar {position:absolute; width:30px; right:-30px; top:65px; /*border-bottom:10px solid #39C;*/ display:none; z-index:2;}
.journey-block .a-block:last-child .a-module .right-bar {display:none;}
.left-bar img {position:absolute; top:-6px; right:-19px;}
.a-module .details {position: relative; padding-top:6px; flex-basis: auto; flex-grow: 1;}
.details--access {font-size: 1.3rem; line-height: 1.5rem;} .details--access span {text-transform: uppercase;}
.a-module .details a:hover {color:var(--secondary);}
.a-module a {display:block; color: var(--primary); text-decoration: none; margin:7px 0;}
.a-module a span.more {text-decoration: underline; font-size: 1.5rem;} .a-module a span.more i {font-size: 1rem;}
.a-module .module-data {padding:5px 10px 15px 10px; position:relative; font-weight: 600; display: flex; flex-direction: column; flex-grow: 1; align-items: stretch;font-size: 20px; line-height: 23px;; font-weight: normal;}
.a-module .i-bg {width: 25px; height: 20px; display: flex; position: absolute; right: 10px; top:5px; align-items: center; justify-content: center; transition: all ease .3s; font-size: 24px;display:none; }
.a-module .i-bg i {color:#FFF;} 
.a-block + .clearfix {/*border-bottom:10px solid #39C;*/ position:relative; margin:0px -15px;}
.blocker {border-left:10px solid #252525; height:15px; width:10px; position:absolute; bottom:0px; left:-10px;}
.blocker-right {/*border-right:10px solid #39C; */height:15px; width:10px; position:absolute; bottom:0px; right:0px;}
.a-module img.lock {position: absolute; right:-5px; bottom:-5px; width:40px;}

.a-module.not-started {background-color: #ECECEC;}
.a-module.progress {background-color: var(--primary); color: var(--white);}
.a-module.progress a {color: var(--white);}
.a-module.progress .badge {background-color: var(--white); color: var(--black);}
.a-module.progress .launch {background-color: var(--white); color: var(--black);}

.a-module.active-module {background-color: var(--primary); color: var(--white);}
.a-module.active-module a {color: var(--white);}
.a-module.active-module .badge {background-color: var(--white); color: var(--black);}
.a-module.active-module .launch {background-color: var(--white); color: var(--black);}

/* learning journey end */

/* launch buttons */
.a-module .launch {text-transform:none; font-weight: 600 !important; display: flex; align-items: center; justify-content: space-between; background-color:var(--primary); color:var(--black); font-size:21px; padding:5px; margin:0 10px 10px 10px; }
.a-module .launch.disabled {opacity:0.5; cursor: not-allowed; color:#FFF;}
.a-module .launch i {margin-left:2rem;}
/*.a-module .launch.launch-completed {background-color:var(--primary); color:#FFF;}
.a-module .launch.launch-failed {background-color:var(--red); color:#FFF;}
.a-module .launch.launch-progress {background-color:#fddf0b; color:#000;}
.a-module .launch.launch-progress .i-bg i {color:#000;}*/
.a-module .launch:hover {background-color:var(--secondary); color:#FFF;}
.a-module .launch.disabled:hover {background-color:var(--primary); color:#FFF; }
/*.a-module .launch:hover .i-bg {transform:scale(.8,.8) rotate(45deg);}
.the-no {position:absolute; right:0; bottom:5px; height:20px; width:20px;}
/* launch buttons end */

/* learner side */
.admin-control-block.learner{background:none; border:none; border-radius: 0; box-shadow: none; margin-bottom:3rem;}
.admin-control-block.learner .control-block {background-color: #e0e0e0; padding: 1rem 10px;}
.btn.btn-primary.btn-blue, .learner-container .input-group-addon.btn.btn-default  {background:none; border:var(--border-width) solid var(--primary); background-color: var(--primary); font-size: 18px; color:#FFF; padding:5px 10px 4px 10px; border-radius: 0; margin-right: 10px; text-transform: none; width:auto;}
.btn.btn-primary.btn-blue.btn-active {border:2px solid var(--primary); background-color: #FFF; color: var(--primary);}
.btn.btn-primary.btn-blue:hover, .learner-container .input-group-addon.btn.btn-default:hover {background-color: var(--secondary);border:var(--border-width) solid var(--secondary); color:#FFF;}
.learner-container .input-group-sm > .form-control{height:36px; font-size:16px; padding: 5px 10px; margin-right: 10px; border-radius: 0;}
.learner-container .input-group-addon.btn.btn-default {margin-right: 10px; display: inline-block; padding:2px 17px 3px 17px; height:auto; font-size: 18px; text-shadow: none; font-weight: 700; border-radius: 0;}
.learner-container .input-group-addon.btn.btn-default .glyphicon {top:3px; margin-right: 5px;}
.learner-container .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {border-radius: 0; display: inline-block; float: none; margin-right: 10px;}
.learner-container .input-group-sm > .form-control.large-input {width:40%;}
.learner-container .input-group {display: block;}
label.managed-label {font-weight: 900; text-align: left; font-size:16px !important; padding-bottom: 0 !important;}
.flex-row-bottom {display: flex; align-items: flex-end;}
.btn-group.managed-btn-group {padding-bottom: 6px;}

.footer-nav-btns {/*padding:2rem 30px 1rem 30px; border-top: 1px solid #e0e0e0;*/}


/* progress in learning journey */
.glyphicon-stop {transform: rotate(-30deg);}
.glyphicon-stop{color:#E2E2E2; margin-right:5px;} .glyphicon-stop.green {color:var(--primary);} .glyphicon-stop.yellow {color:#ffcc00;}  .glyphicon-stop.red {color:var(--red);} 
.progress {background-image:none; background-color:var(--primary);}
.progress-bullets {padding:12px; font-size:12px; color:#BBB;} .progress-bullets i {margin-left:3px;}
.progress-bullets .green {color:var(--primary);} .progress-bullets .yellow {color:#FCCA03;}

/* badges */
.details .badge {padding: 1px 9px; font-size:1.2rem; border-radius: 0px; text-transform: uppercase; color:#FFF;}
.badge.badge-progress {background-color:var(--darkgreeen); border:var(--border-width) solid var(--darkgreeen); }
.badge.badge-failed {background-color:var(--darkred); border:var(--border-width) solid var(--darkred); }
.badge.badge-completed {background-color:var(--primary); border:var(--border-width) solid var(--primary); }
.badge.badge-not-started {background-color:var(--white); border:var(--border-width) solid var(--primary); color: var(--black);}
.badge.badge-access-status {background-color:var(--primary); border:var(--border-width) solid var(--primary);}
/* badges end */

/* dashboard summaries */
.tab-content-style {margin-top:0;}
.blockdiv {border-radius: var(--borderradius); padding:10px 20px 10px 20px; margin-bottom: 15px; position: relative; background-color: #CCC; cursor: default; color: var(--white); transition:all ease .2s;}
.blockdiv.blockdiv-total{background-color: #279cd8; color: #FFF;}
.blockdiv.blockdiv-completed{background-color: #30a2a1;}
.blockdiv.blockdiv-pending{background-color: #706f6f;}
.blockdiv.blockdiv-progress{background-color: #a84d98; color: #FFF;}
.blockdiv.blockdiv-login{background-color: #FFF; color:#000; border:1px solid #CCC;}
.blockdiv.blockdiv-module{background-color: var(--darkgreeen); color:#FFF;}
.blockdiv.blockdiv-module-cs {background-color: var(--secondary);}
.blockdiv.blockdiv-module-cs0{background-color: #818181; color:#FFF;}
.blockdiv.blockdiv-module-cs1{background-color: var(--darkgreeen); color:#FFF;}
.blockdiv.blockdiv-module-cs2{background-color: var(--primary); color:#FFF;}
.blockdiv.blockdiv-module-cs3{background-color: var(--darkred); color:#FFF;}
.blockdiv.blockdiv-module-cs4{background-color: var(--primary); color:#FFF;}
.blockdiv h5 {width:80%; margin:6px;}
.blockdiv span {display: block; font-weight: normal; }
.blockdiv span.the-data {font-size:3.3rem;  font-weight: bold;}
.blockdiv.blockdiv-module span.the-data {font-size:2.4rem;}
.blockdiv.blockdiv-module h5 {width:80%;}
.blockdiv i {position: absolute; right:20px; top:30%; font-size:3rem; width:40px; text-align: center; transition:all ease .3s; }
/* .blockdiv:hover {background-color: #CCC; color:#000; transition: all ease .6s;}
.blockdiv:hover i {right:30px;} */

.panel {border-radius: 0;}

.learner-heading { font-weight:bold; margin:2rem 0 2rem 0; font-size:3.5rem; color:var(--tertiary);}
.relt {position: relative;}
.agency {position: absolute; right:20px; top:0; transform:translateY(-30%);}

/* assessment */
#ua_assessment_container .list-group-item, #ua_assessment_container .list-group-item.active, #ua_assessment_container  .list-group-item.active:hover, #ua_assessment_container  .list-group-item.active:focus {padding:10px 15px;}
#ua_assessment_container .list-group-item .glyphicon {padding:4px 10px; width:35px;}
.flex-contain .nav .caret {color: var(--black) !important; border-top-color: var(--black); border-bottom-color: var(--black);}
.flex-contain .nav .active > a .caret, .flex-contain .nav .active > a:hover .caret, .flex-contain .nav .active > a:focus .caret, .flex-contain .nav a:hover .caret {color: var(--primary) !important; border-top-color: var(--primary) ; border-bottom-color: var(--primary) ;}
.flex-contain .nav .active > a .caret, .flex-contain .nav .active > a:hover .caret, .flex-contain .nav .active > a:focus .caret, .flex-contain .nav a:hover .caret {color: var(--primary) !important; border-top-color: var(--primary) ; border-bottom-color: var(--primary) ;}

.tooltip-inner{
    max-width: none;
}

.page-content {margin-bottom: 4rem;}

@media screen and (max-width:1400px){
    #loginerroralert { left:-6rem;}
}

@media screen and (max-width: 1100px) { 
    .main-hold {flex-wrap: wrap; flex-direction: column;}
    .the-login-panel {width:50vw; height: 50vw; margin-top:3rem; min-width:400px; min-height: 400px;}
    .page-content{margin-top: 0;}
    .flex-contain .navbar-clear {margin-right:0;}
    
    .modules-row > div {width:30%; margin:1.5%;}
}

@media screen and (max-width: 991px) { 
    .the-login-panel {width:70vw; height: 70vw;}
    .black-holder h1 {margin-top: 5rem;}
    .nav-btns {top:-10px;}
    .logos {padding-top:1rem;}
    .logos img {margin-left:0px;}
    .footer-nav-btns a {margin-bottom: 10px; margin-right: 10px;}
    .footer-nav-btns {padding:20px 10px; padding-bottom: 0;}
    .pr-flex {margin-bottom: 10px;}
}

@media screen and (max-width: 768px){
    .a-block {width:100%; margin:0 10px;}
    .journey-block .title h3, .journey-block .title h6 {padding-left: 10px; padding-right: 10px;}
    .learner-container .input-group-sm > .form-control.large-input {width:100%; margin-bottom: 10px;}
    .buttons-mobile {padding-left:15px;}
    .buttons-mobile .btn  {font-size: 1.3rem !important;}
    .flex-row-bottom {display: block;}
    .managed-btn-group {padding-left:4px !important; padding-top:10px;}
    .flex-contain {display: block;}
    .flex-contain .nav {padding: 0 10px;}
    .flex-contain .nav > li {margin-bottom: 10px; display: inline-block;}
    .flex-contain .nav > li a {display: block;}
    .agency {position: static; text-align: left; margin:0 10px;}
    .navbar-nav .open .dropdown-menu {position: absolute;}

    #loginerroralert {position: static; width: 100%;}
    .the-login-panel {width:90vw; min-height: 90vw; max-height: 100%;}
    .the-login-panel {width:auto; height: auto; min-width:auto; min-height: auto; max-width: auto; max-height: auto; border-radius:15px; margin-left:auto; margin-right: auto;}
    .login-box {width:100%;}
    .btn-hold {padding: 0;}
    
    .modules-row > div {width:48%; margin:1%;}
    .learning-journey {margin-bottom: 5rem;}
    .project-navbar .navbar-nav {float: none; margin-bottom: 3rem;}
    .admin-control-block {padding: 0;}
}