/*
Author: Matthew Small
Date: July 2015
Theme: Flintshire Infonet Responsive Bootstrap Template 
Version: 1.2
*/

/* GLOBAL STYLES -------------------------------------------------------------------*/

.img-left {
  float: left;
  margin: 4px 12px 4px 0;
}

.img-right {
  float: right;
  margin: 4px 12px 4px 0;
}

.icon-margin{ margin: 20px 0;}
.sys_areas a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.dropdown-menu-arrow::before {
    border-bottom: 7px solid rgba(0, 0, 0, 0.2);
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    content: "";
    display: inline-block;
    right: 9px;
    position: absolute;
    top: -7px;
}

.sys_theme-simple .sys_forgotpassword-control input.sys_button{width:150px;}


.dropdown-menu-arrow::after {
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: "";
    display: inline-block;
    right: 10px;
    position: absolute;
    top: -6px;
}
	
	.sys_bold{ font-weight:bold;}
	
	.navbar-inverse h1 > a{ color:#FFFFFF;}
	.navbar-inverse h1 > a{ text-decoration:none;}
    section.sys_xchange{ background-color: #e9e9e9; }

    .navbar-inverse .navbar-nav>li>a{ color: #fff;}
    .navbar-right{ margin-right: 0;}

	h2.sys_search-title.sys_standardlist-title{display:none;}

	.w-news-item{max-height:40px; overflow: hidden; text-overflow: ellipsis;}

	ul.dropdown-menu.arrow-right.desktop-search{width:550px; padding: 12px;}

/* Login Page --------------------------*/

.sys_theme-simple.sys_logon-themed{height:140px;}

.alert{margin-top:20px;}

    /* CAROUSEL AND NEWS AREA -----------------*/

.carousel-control.left, .carousel-control.right {
  background: none !important;
  filter: progid: none !important;
  outline: 0;
 }

    .carousel-indicators{ bottom: 0;}
    .carousel-caption{ bottom: 0; background: #000; width: 100%; left: 0; right: 0; padding-top: 0; background-color: rgba(0, 0, 0, 0.75);}

	.img-responsive{min-width:100%;}

    /* NEWS STYLES -------------------------*/
    .sys_news{ border-radius: 4px; padding: 16px 12px; border: 1px solid #E3E3E3;}
    .sys_news hr{ margin: 14px 0;}
    .sys_news ul{ margin: 10px 0; padding: 0; list-style: none;}
    .sys_news h4{ margin-top: 0; margin-bottom: 16px; padding: 0; position: relative;}
    .sys_news h4 i { position: absolute; right: 0;}
    .sys_news ul li{ margin: 10px 0; max-height: 40px; overflow: hidden; line-height: 1.3em; text-overflow: ellipsis; display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical; }
    .sys_news ul li a{ color: #555;}
    .sys_news .more{ color: #2a9aae;}

.sys_pinned{ font-weight:bold;}

	
	

    .list-group h4 i{ position: absolute; right: 10px;}
    a.list-group-item:hover{ text-decoration: underline; background-color: #fff;}
    .list-group-item .heading-link{ color: #FFFFFF;}
	
	.project_banner {
    padding: 10px 0;
    text-align: center;
    color: #FFFFFF;
    font-size: 20px;
    position: absolute;
    width: 100%;
    bottom: 0;
  }


  .learning_banner{
      background-color: #13A0B5;
  }

  .xchange_banner{
      background-color: #26BB9D;

  }

  .forms_banner{
      background-color: #485D6D;
  }

    /* BUTTON STYLES ------------*/

    .btn-default{
        color: #333;
        border-color: #1acad5;
    }

    .btn-default:hover{
        background-color: #2a9aae;
        color: #fff;
    }

    .active-heading-light-blue{
        color: #FFFFFF;
        background-color:#0f9fb4; 
    }

    .active-heading-indigo{
        color: #FFFFFF;
        background-color:#0fb493 ; 
    }

    .active-heading-green{
        color: #FFFFFF;
        background-color:#485D6D ; 
    }
    .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{background: #000;}
    .desktop-search{ background-color: #1D2F3E; }

    .sys_xchange .portfolio-item .portfolio-link {
        display: block;
        position: relative;
        margin: 0 auto;
        max-width: 400px;
    }

.sys_xchange .portfolio-item .portfolio-link .caption {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        background: rgba(15,159,180,.9);
        -webkit-transition: all ease .5s;
        -moz-transition: all ease .5s;
        transition: all ease .5s;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption-employment {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        background: rgba(72,93,109,.9);
        -webkit-transition: all ease .5s;
        -moz-transition: all ease .5s;
        transition: all ease .5s;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption-xchange {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
         background: rgba(15,180,147,.9);
        -webkit-transition: all ease .5s;
        -moz-transition: all ease .5s;
        transition: all ease .5s;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption:hover {
        opacity: 1;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption .caption-content {
        position: absolute;
        top: 40%;
        width: 100%;
        height: 20px;
        margin-top: -12px;
        text-align: center;
        font-size: 20px;
        color: #fff;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption .caption-content i {
        margin-top: -12px;
    }

    .sys_xchange .portfolio-item .portfolio-link .caption .caption-content h3,
    .sys_xchange .portfolio-item .portfolio-link .caption .caption-content h4 {
        margin: 16px 0;
    }

    .sys_xchange * { z-index: 2;}

a.back-to-top {
	display: none;
	width: 50px;
	height: 50px;
	text-indent: -9999px;
	position: fixed;
	z-index: 999;
	right: 20px;
	bottom: 20px;
	background: #1d2f3e url("/SiteElements/Images/up-arrow.png") no-repeat center 43%;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
  	opacity:0.5;
}

/*----------- 404 Styles ----------------------------*/

.error-page {padding: 40px 15px;text-align: center;}
.error-actions {margin-top:15px;margin-bottom:15px;}
.error-actions .btn { margin-right:10px; }


    footer { padding: 30px 0;}
	footer .text-right a{ font-weight:bold;}

@media only screen and (min-width:769px){
  .sys_news{ min-height: 313px;}
  .sys_news_position{position: absolute; bottom: 20px;}
  
}


@media only screen and (min-width:768px) {

    body {
            padding-top: 130px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
        }
  
  	/* Language Switch Styles -------------------------*/
  
  	.sys_lang_switch{position:absolute; top:-34px; right:25px;}
  	.sys_home_container{ position:relative;}

    /* NAV BAR STYLES --------------*/

    .navbar-inverse{ background-color: #1d2f3e; border-color: #333;  color: #FFFFFF; }
    .navbar-inverse h1{ color: #fff; font-size: 24px;}
    .navbar-inverse h1 img{}
    .navbar-fixed-top .nav { padding: 0;}
    .navbar-nav>li{height: 80px;}
    .navbar-inverse .navbar-nav>li>a{height: 80px; padding-top: 30px;}

    .navbar-fixed-top .navbar-brand { padding: 0 15px; }

    .navbar-form{
    padding: 12px;
    }


    .dropdown:hover .dropdown-menu {
    /*display: block; */
    }

    .search-wrapper{
        width: 270px;
    }

    .search-wrapper .navbar-form .input-group .form-control{
        width: 220px;
    }
  
  .desktop-search-form{ display: none; padding: 12px; background-color: #1d2f3e; width: 540px; top: 80px; position: absolute; right: 0; z-index: 30;}

    .mobile-search{ display: none;}
    .mobile-search-form{display: none;}

  	.dropdown-toggle i.fa.fa-search{font-size: 16px; margin-left: 6px;}
    
  	input[type="search"] { 
            padding-right: 54px; 
            padding-top: 13px; 
            padding-bottom: 11px; 
            line-height: 16px; 
            font-size: 16px;     
            -webkit-appearance: none;
            border: 1px solid #ccc;
            padding-left: .75em;
            width: 100%;
            box-sizing: border-box;
            outline-offset: 0;
            border-radius: 0;
            margin-top: 0;
            margin-bottom: 0;}

    .sys_areas{ margin-bottom: 10px;}

    section.sys_page_content{ padding-bottom: 70px;}
    .carousel-inner>.item>a>img, .carousel-inner>.item>img, .thumbnail a>img, .thumbnail>img{ height: auto; min-height:313px;}
    .navbar-form .input-group>.form-control{width: 480px; }
  
  .panel-min-height{  position: relative; padding-bottom: 34px;}
  .learning-btn{ position: absolute; bottom: 16px; left: 50%; margin-left: -67.5px;}
  
  
  .sys_news .divider{ position: absolute; left: 110px; bottom: 16px;}

  
  section.sys_xchange{ padding: 100px 0;}

    }



/* iPad Portrait	*/
@media only screen and (min-width:768px) and (max-width:991px){
	
	.sys_other_news { margin-top:20px;}
	.sys_workforce_news{ margin-top:20px;}
	
  .project_banner {font-size:14px;}
}

@media only screen and (max-width: 767px) {

        body { padding-top: 70px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */}
  
  
  .sys_theme-simple .sys_logon-control label{width:100% !important;}
  		a.sys_lang_switch { margin-bottom: 6px; float: right; margin-top: -12px;}
    
        /* MOBILE NAVBAR STYLES ----------------------------------------------*/
        .navbar-toggle{float: left;} 
        .navbar-inverse .navbar-toggle:hover{color:#1D2F3E;}
        .navbar-inverse{ background-color: #1d2f3e; border-color: #333; color: #fff;}
        .navbar-brand{padding: 10px 10px; position: absolute; left: 50%; margin:0 0 0 -60px; font-size: 22px; color: #FFFFFF;}
        .navbar-brand img{ height: 36px; width: 30px;}   
  		 #search-dropdown {display: none;}
    
        /* MOBILE SEARCH STYLES -----------------------------------------------*/
        .mobile-search{ position: fixed; right: 23px; color: #FFF; top: 10px; font-size: 20px;}
        .mobile-search:hover{ color: #FFFFFF;}
        .mobile-search:visited{ color: #FFFFFF;}
        .mobile-search-form{display: none;}
        .mobile-search a{ color: #FFFFFF;}
    
        /* MOBILE CAROUSEL STYLES ----------------------------------------------*/
        .carousel { margin-bottom: 10px;}
        .carousel-caption{ padding-bottom: 4px}
        .carousel-inner .item .carousel-caption h4{ font-size: 12px;}
        .carousel-indicators li{ height: 6px; width: 6px; display: none;}
        .carousel-indicators li.active{height: 8px; width: 8px; display: none;}
    
        .sys_news{ text-align: center; margin-bottom: 10px;}
     
		section.sys_xchange{ padding: 10px 0;}
        .sys_xchange .portfolio-item .portfolio-link{ max-width: 360px; margin: 26px auto;}
    }