﻿/* #region AdminSidebar */
    body,html,form{
		height: 100%;
	}

	/* remove outer padding */
	.main .row{
		padding: 0px;
		margin: 0px;
	}

    .skip-content {
        display: inline-block;
        margin: 6px 0 0 30px;
        background-color: #fff;
        position: absolute;
        left: -9999em;
    }

    .skip-content:focus {
        left: 0px;
        padding: 5px;
        z-index: 10;
        outline: 12px solid #fff;
        background-color: #fff;
        text-decoration: underline;
    }

	/*Remove rounded coners*/

	nav.sidebar.navbar {
		border-radius: 0px;
	}

	nav.sidebar, .main{
		-webkit-transition: margin 200ms ease-out;
	    -moz-transition: margin 200ms ease-out;
	    -o-transition: margin 200ms ease-out;
	    transition: margin 200ms ease-out;
	}

	/* Add gap to nav and right windows.*/
	.main{
		padding: 10px 10px 0 10px;
	}

	/* .....NavBar: Icon only with coloring/layout.....*/

	/*small/medium side display*/
	@media (min-width: 768px) {

		/*Allow main to be next to Nav*/
		.main{
			position: absolute;
			width: calc(100% - 40px); /*keeps 100% minus nav size*/
			margin-left: 40px;
			float: right;
		}

		/*lets nav bar to be showed on mouseover*/
		nav.sidebar:hover + .main{
			margin-left: 200px;
		}

		/*Center Brand*/
		nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
			margin-left: 0px;
		}
		/*Center Brand*/
		nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
			text-align: center;
			width: 100%;
			margin-left: 0px;
		}

		/*Center Icons*/
		nav.sidebar a{
			padding-right: 13px;
		}

		/*adds border top to first nav box */
		nav.sidebar .navbar-nav > li:first-child{
			border-top: 1px #e5e5e5 solid;
		}

		/*adds border to bottom nav boxes*/
		nav.sidebar .navbar-nav > li{
			border-bottom: 1px #e5e5e5 solid;
		}

		/* Colors/style dropdown box*/
		nav.sidebar .navbar-nav .open .dropdown-menu {
			position: static;
			float: none;
			width: auto;
			margin-top: 0;
			background-color: transparent;
			border: 0;
			-webkit-box-shadow: none;
			box-shadow: none;
		}

		/*allows nav box to use 100% width*/
		nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
			padding: 0 0px 0 0px;
		}

		/*colors dropdown box text */
		.navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
			color: #777;
		}

		/*gives sidebar width/height*/
		nav.sidebar{
			width: 200px;
			height: 100%;
			margin-left: -160px;
			float: left;
			z-index: 8000;
			margin-bottom: 0px;
		}

		/*give sidebar 100% width;*/
		nav.sidebar li {
			width: 100%;
		}

		/* Move nav to full on mouse over*/
		nav.sidebar:hover{
			margin-left: 0px;
		}
		/*for hiden things when navbar hidden*/
		.forAnimate{
			opacity: 0;
		}
	}

	/* .....NavBar: Fully showing nav bar..... */

	@media (min-width: 1330px) {

		/*Allow main to be next to Nav*/
		.main{
			width: calc(100% - 200px); /*keeps 100% minus nav size*/
			margin-left: 200px;
		}

		/*Show all nav*/
		nav.sidebar{
			margin-left: 0px;
			float: left;
		}
		/*Show hidden items on nav*/
		nav.sidebar .forAnimate{
			opacity: 1;
		}
	}

	nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
		color: #CCC;
		background-color: transparent;
	}

	nav:hover .forAnimate{
		opacity: 1;
	}
	section{
		padding-left: 15px;
	}
/* #endregion /Admin Sidebar */

/* #region frontpage and topbar */ 
.splashJumboWrapper
{
  clear: both;
  height:98vh;
  width:100%;
  position:relative;
  color:white;  
}

.splashJumbo{
    background-image: url(../Images/OSCE_Bed.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-size: 100%;
    position: absolute;
    height:100%;
    width:100%;
}

.splashJumboOverlayWrapper{
    height:100%;
    width:100%;
    background-color:rgba(0,0,0,0.5);
    position: absolute;
}

.splashJumboOverlay
{
    font-size:44px;
    font-size: 4vw;
    position: absolute;
    text-align: center;
    width:inherit;
    top: 40%;
}

.titleItem{
    font-size:32px !important;
    padding-right:25px;
    padding-top:30px;
}
.navbar-nav > li > a.titleItem{
    font-size:32px;
    padding-right:25px;
    padding-top:30px;    
}

@media screen and (max-width: 480px) {
    .splashJumboOverlay{
        font-size:24px;
    }

    .titleItem{
        font-size:16px;
        padding-right:5px;
    }
}


.transparentTitleBar{
    margin-top: 3%;  
}

.transparentBarLogo{
   padding-left: 5vw;
}

.fontWhite {
    color:white !important;
}

.fontWhite:visited{
    text-decoration:none;
    color:white;
}

.alert-red{
    color:#e21313 !important;
}


.tile-box {
  color:#444444;
  text-decoration:none;
  position: relative;
  display: block;
  padding-left:20px;
  margin-bottom: 12px;
  border: 3px solid #E4E4E4;
  -webkit-border-radius: 25px;
  overflow: hidden;
  padding-bottom: 5px;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 25px;
  -moz-background-clip: padding;
  border-radius: 25px;
  background-clip: padding-box;
  transition: all 300ms ease-in-out; }

.tile-box .icon {
  width: 20px;
  height: 20px;
  position: absolute;
  right: 53px;
  top: 22px;
  z-index: 1; }

.tile-box .icon span {
  margin: 0;
  font-size: 60px;
  line-height: 0;
  vertical-align: bottom;
  padding: 0; }

.tile-box-hover:hover{
    background:#1465c8;
    color:#ffffff;
    border: 3px solid #ffffff;
}
.tile-box-disabled{
    color:#bbb;
}



.undecorated{
    text-decoration:none !important;
}
/* #endregion frontpage and topbar */

/* #region PanelBox */
   .panelbox.nav-tabs  {
       border-color:transparent!important;
   }
   .panelbox.nav-tabs>.active>a 
    ,.panelbox.nav-tabs>.active:hover>a 
    ,.panelbox.nav-tabs a 
    ,.panelbox.nav-tabs a:hover{
       background-color:transparent!important;
       border-color:transparent!important;
       border-radius:0px!important;
       color:white!important;
       font-size:18px!important;
   }         
    .panelGreen {
        border-color: #3D9970;
        -webkit-transition: border-color 4s ease-out;
        -moz-transition: border-color 4s ease-out;
        -o-transition: border-color 4s ease-out;
        transition: border-color 4s ease-out;
    }

    .panelGreen > .panel-heading {
        color: #ffffff;
        background-color: #3D9970;
        border-color: #3D9970;
        -webkit-transition: background-color 4s ease-out;
        -moz-transition: background-color 4s ease-out;
        -o-transition: background-color 4s ease-out;
        transition: background-color 4s ease-out;
    }
        .panelBlue {
        border-color: #0074D9;
        -webkit-transition: border-color 4s ease-out;
        -moz-transition: border-color 4s ease-out;
        -o-transition: border-color 4s ease-out;
        transition: border-color 4s ease-out;
    }

    .panelBlue > .panel-heading {
        color: #ffffff;
        background-color: #0074D9;
        border-color: #0074D9;
        -webkit-transition: background-color 4s ease-out;
        -moz-transition: background-color 4s ease-out;
        -o-transition: background-color 4s ease-out;
        transition: background-color 4s ease-out;
    }
    .panelRed {
        border-color: #e60000;
        -webkit-transition: border-color 4s ease-out;
        -moz-transition: border-color 4s ease-out;
        -o-transition: border-color 4s ease-out;
        transition: border-color 4s ease-out;
    }
    .panelRed > .panel-heading {
        color: #ffffff;
        background-color: #e60000;
        border-color: #e60000;
        -webkit-transition: background-color 4s ease-out;
        -moz-transition: background-color 4s ease-out;
        -o-transition: background-color 4s ease-out;
        transition: background-color 4s ease-out;
    }
/* #endregion PanelBox */

.scroller {
    font-size:16px;
    margin-top:10px; 
    width:270px; 
    display:none;
    background-color:#66b3ff;
    color:white;
    border:solid 1px #66b3ff;
    border-radius:10px;
    padding: 10px;    
    box-shadow:  3px 3px 1px #0059b3;
}


/* #region validation */
/* alerts (when validation fails) */
.bad input, .bad select, .bad textarea {
  border: 1px solid #CE5454;
  box-shadow: 0 0 4px -2px #CE5454;
  position: relative;
  left: 0;
  -moz-animation: .7s 1 shake linear;
  -webkit-animation: 0.7s 1 shake linear; }

.item input, .item textarea {
  transition: 0.42s; }

.item .alert {
  float: left;
  margin: 0 0 0 20px;
  padding: 3px 10px;
  color: #FFF;
  border-radius: 3px 4px 4px 3px;
  background-color: #CE5454;
  max-width: 170px;
  white-space: pre;
  position: relative;
  left: -15px;
  opacity: 0;
  z-index: 1;
  transition: 0.15s ease-out; }

.item .alert::after {
  content: '';
  display: block;
  height: 0;
  width: 0;
  border-color: transparent #CE5454 transparent transparent;
  border-style: solid;
  border-width: 11px 7px;
  position: absolute;
  left: -13px;
  top: 1px; }

.item.bad .alert {
  left: 0;
  opacity: 1;
  font-size:13px;
}
/* #endregion validation */

.inl-bl {
  display: inline-block; }

.well .markup {
  background: #fff;
  color: #777;
  position: relative;
  padding: 45px 15px 15px;
  margin: 15px 0 0 0;
  background-color: #fff;
  border-radius: 0 0 4px 4px;
  box-shadow: none; }

.well .markup::after {
  content: "Example";
  position: absolute;
  top: 15px;
  left: 15px;
  font-size: 12px;
  font-weight: bold;
  color: #bbb;
  text-transform: uppercase;
  letter-spacing: 1px; }

.scrollerSection{
    display:none;
}

.ddlLarge{
    font-size:18px;
}

.actionBar {
  width: 100%;
  border-top: 1px solid #ddd;
  padding: 10px 5px;
  text-align: right;
  margin-top: 10px; 
}

.actionBar .btn {
      margin: 0 3px;
}

.actionBar .buttonDisabled {
  cursor: not-allowed;
  pointer-events: none;
  opacity: .65;
  filter: alpha(opacity=65);
  box-shadow: none; }

.panel {
    border-style:none !important;
}