/* Light blue theme for plugins (exetcises) */

/*
	.theme-lb
	
	Based on the css from findpairs;

	Sets up general css-vars for a lightblue theme which
	we shall try to use in the findpairs, minitest and truefalse plugins.

	Any css that should be shared between all three exercises should go in here.

	First time trying CSS vars, seems to be the way to go!
*/

.theme-lb 
{	
}

/*
	Css classes that should be used in all plugins using .theme-lb 
*/

.theme-lb 
{
  background-color:  var(--lblue-2);
}

.theme-lb.modal-content{
  width: max-content;
  overflow-y: auto;
  overflow-x: hidden;
}

/* @media (max-width: 767.9px){
  .theme-lb.modal-content{
    width: max-content;
  }
}

@media (min-width: 768px){
  .theme-lb.modal-content{
    width: max-content;
  }
}

@media (min-width: 1023.9px){
  .theme-lb.modal-content{
    width: 100%;
    height: 75%;
  }
} */
/* .theme-lb .frame.frame-lg{
  width: var(--frame-lg);
} */
.theme-lb.frame-lg{
  width: var(--frame-lg);
}


.theme-lb .frame.frame-sm{
  width: var(--frame-sm);
}

/* Small frame idea
.theme-lb .frame
{
	background-color:  var(--lblue-2);
  border:    1px solid var(--black);
  overflow:                  hidden;
  width: var(--frame-sm);
} 
*/

.theme-lb button {
	color: var(--white);
	border-radius: 3px;
}

.theme-lb .bg-blue
{
/*  color: var(--white);*/
  background-color: var(--lblue-1);
}

.theme-lb .bg-blue-2
{
/*  color: var(--white);*/
  background-color: var(--lblue-2);
}

.theme-lb .bg-blue-3
{
/*  color: var(--white);*/
  background-color: var(--lblue-3);
}

.theme-lb .bg-green
{
/*  color: var(--white);*/
  background-color: var(--green);
}

.theme-lb .bg-red
{
/*  color: var(--white);*/
  background-color: var(--red);
}

.theme-lb input[type=text]
{
  background-color: var(--white);
}

.modal-header 
{
  z-index: 999;
  font-size:        large;
  color:            var(--white);
  background-color: var(--blue-1);
  padding: 5px 0px;
}

.modal-container
{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.help{
  margin-left: auto;
}

/* Also exists in orjhlab */

.maincontent {
	/* background-clip: content-box; */
	background-color: var(--lblue-2);
}

.theme-lb .btn.btn-danger{
  background-color: var(--red);
  border-color: var(--lred);
}

.theme-lb .btn.btn-primary{
  background-color: var(--blue-1);
  border-color: var(--blue-1);
}