﻿
@font-face {
   font-family: Lato;
   src: url(../fonts/Lato/Lato-Regular.ttf);
}
@font-face {
   font-family: Lato-Light;
   src: url(../fonts/Lato/Lato-Light.ttf);
}

@font-face {
   font-family: Lato-Bold;
   src: url(../fonts/Lato/Lato-Bold.ttf);
}
@font-face {
   font-family: Lato-Italic;
   src: url(../fonts/Lato/Lato-Italic.ttf);
}

body, html
{
    position:relative;
    height: 100%;
    width:100%;
    margin: 0;
    padding: 0;
    font-size:14px;
    font-family: 'Lato', Arial, sans-serif;
    
}

strong, b
{
    font-family: Lato-Bold;}

/*==============*/
/*** Carousel ***/
/*==============*/
.carousel, .item, .active 
{ 
     height: 100%; 
 } 
 
.homeBannerContainer
{
    position:relative;
     }

/*.carousel-caption
{
    font-size:1em;
    bottom: 40px;}

.carousel-indicators {
    bottom: 25px;}*/
        
    
 
/**** Header ***/

#header
{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    background: url(../gif/topRibbon.PNG), linear-gradient(180deg, #0e306d 50%, rgba(0,0,0,0) 100%);
    background:url(../gif/topRibbon.PNG), linear-gradient(to bottom, rgba(14,48,109,1) 25%, rgba(14,48,109,0.8) 50%, rgba(14,48,109,0.5) 75%, rgba(0,0,0,0) 100%);
    background-position: left top, left top;
    background-repeat: no-repeat, no-repeat;
    background-size: contain, cover;
        padding: 15px 0;
        z-index:99;
        
        }
        
#mainCarousel .item img
{
    width:100%;}
    
.nav .dropdown .glyphicon-menu-down
{
    font-size: 9px;
    top:-1px;}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover,
.navbar-default .navbar-nav>li>a:focus
{
    color:#ffffff;
    background:#1b79db;
    }
    
.dropdown-menu
{
    background:transparent;
    color:#ffffff;
    min-width: 200px;
    padding: 0;
    border-radius: 0;
        border-top: none;
    }

.dropdown-menu>li{
        border-top: 1px solid transparent;}
.dropdown-menu>li>a
{
    color:#ffffff;
    padding: 8px 15px;
    background: rgba(27,121,219, 0.6);
        transition: color .2s linear 0s, padding-left .2s linear 0s;
    -moz-transition: color .2s linear 0s, padding-left .2s linear 0s;
    -ms-transition: color .2s linear 0s, padding-left .2s linear 0s;
    -o-transition: color .2s linear 0s, padding-left .2s linear 0s;
    -webkit-transition: color .2s linear 0s, padding-left .2s linear 0s;
    }
    
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    color: #ffffff;
    text-decoration: none;
    padding-left:25px;
    background-color: rgba(51,147,198, 0.6);
    background-color: rgba(29,126,203, 0.6);
    background-color: rgba(55,150,201, 0.6);
    background: rgba(27,121,219, 1);
}
.topRibbon
{
    width:100%;}
.homeBannerContainer .navbar
{
    background:none;
    border:none;
    }
    
.carousel-control
{
    width:10%;} 
#mainCarousel .glyphicon-menu-left
{
    top: 45%;
    background-color: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    padding: 8px;
/*    left: -15%;*/
    font-size:20px;
    }
    
#mainCarousel .glyphicon-menu-right
{
    top: 45%;
    background-color: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    padding: 8px;
    /*right: -15%;*/
    font-size:20px;
    }

.carousel-caption .mainTitle
{
    position:relative;
    text-align:center;
    display: block;
    }
 
 .mainTitle img
{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    }
 .mainTitle h3   
    {
        padding: 4%;
        font-size: 150%;
            text-transform: uppercase;
    }
    
.carousel-caption p
{
    margin:20px 0;}
    
.banner-btn a
{
    border: 1px solid #ffffff;
    background: transparent;
    color: #ffffff;
    border-radius: 0px;
    }
    /***/
/*.carousel-caption .mainTitle2
{
    background: url(../images/border2.PNG);
    background-position: left top, left top;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    text-align:center;
    }
 
 .mainTitle2 h3   
    {
        margin: 0;
    padding: 5%;
}
    */
        
.navbar-brand>img {
    width: 70%;
    margin-bottom:15px;
}

.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand
    {
        padding:0 15px;
        }
nav .form-group
{
    float:right;
    margin-right:2%;
    margin-top:15px;
    }   
nav .form-group input
{
    width:auto;
    display:none;
    background: transparent;
    color: #ffffff;
    border: 1px solid #ffffff;}
    
nav .form-group span
{
    color:#ffffff;
    padding-left: 8px;
    line-height:2;
    }
   
.navbar-default .navbar-nav>li>a
{
    color:#ffffff;
    text-transform:uppercase;
    font-size:14px;
    padding: 8px 15px;
    border-bottom:1px solid rgba(255,255,255,.7);
    }
    
.navbar-default .navbar-nav>li:first-child>a
{
    border-top:1px solid rgba(255,255,255,.7);
    }
.form-group span:hover {
    cursor: pointer;
}   
nav .form-group:hover input {
    display: inline-block;
}
nav .form-group input:focus
{
    display:inline-block;}
    
    
@media screen and (max-width: 767px)
{
    #header
    {
        position: initial;
        background:#0e306d;
    }
    .carousel-caption p
    {
        display:none;}
        
    .navbar
    {
        margin-bottom:0;
        }
        
    .navbar-default .navbar-nav .open .dropdown-menu>li>a
    {
        color:#ffffff;}
}
@media screen and (min-width: 768px)
{  
    #header {
        padding: 30px 10px;
        
    }
      
    .carousel-caption p {
        font-size: 1.3rem;
    }
    
    .banner-btn a
    {
        font-weight: 500;
        padding: 8px 18px;
        font-size: 16px;
        }
     
   .navbar-brand>img {
        width: 80%;
        margin-bottom:0;
    }   
    .navbar-nav
    {
        margin-right: 0;
        margin-top: -35px;
        /*margin-bottom: 50px;*/
        }
        
   .navbar-default .navbar-nav>li>a
    {
        padding: 8px;
        border-bottom:none;
        }
    
    .navbar-default .navbar-nav>li:first-child>a
    {
        border-top:none;
        }
    .navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand
    {
        margin-left:0;
        }
        
   nav .form-group
    {
        margin-right:0;
        margin-top:0;}
        
   #mainCarousel .glyphicon-menu-left, #mainCarousel .glyphicon-menu-right
    {
        font-size:30px;
        }  
        
        
   .navbar-right .dropdown-menu
   {
       left:-1.5px;}  
}

@media screen and (min-width: 992px)
{
    .carousel-caption {
        right: 30%;
        left: 30%;
        font-size:1.8rem;
        padding-bottom:8.5%;
        
    }
    .mainTitle h3   
    {
        padding:3.5%;
        font-size: 110%;
    }
    
        .navbar-nav
    {
        margin-right: 1%;
        margin-top: -50px;
        
        }
        
    .navbar-default .navbar-nav>li>a
    {
        font-size:15px;
        padding: 15px;
        }
        
    .navbar-brand>img {
        width: 90%;
    }
    
    nav .form-group
    {
        margin-right:2%;} 
    
}

@media screen and (min-width: 1200px)
{
     .mainTitle h3   
    {
        font-size: 140%;
    }
    
   .carousel-caption p {
        font-size: 1.8rem;
    }
    
   .navbar-nav
    {
        margin-top: -60px;
        }
    .navbar-default .navbar-nav>li>a
    {
        font-size:16px;
        border-bottom:none;
        }
    
    .navbar-default .navbar-nav>li:first-child>a
    {
        border-top:none;
        }      
    .navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand
    {
        margin-left:8%;
        padding:0 30px;
        }
        
   .navbar-brand>img {
        width: auto;
    }  
}
/*.homeBannerContainer .navbar
{
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border: none;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    background: -webkit-linear-gradient(-90deg, #0e306d 50%, rgba(0,0,0,0) 100%);
    background: -moz-linear-gradient(180deg, #0e306d 50%, rgba(0,0,0,0) 100%);
    background: linear-gradient(180deg, #0e306d 50%, rgba(0,0,0,0) 100%);
    background-position: 50% 50%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    padding:20px 15px 30px;
    
    }*/

.navbar-brand {
    height: auto;
        padding: 0 30px;
}
.header-items
{
    position: fixed;
    top:0;
    right:0;
    margin: 15px 20px;
    z-index:100;}

#maincontent
{
    margin:3% 0;
    }
.homeIcons
{
    text-align: center;
    }
    
.homeIcons img
{
    display: inline-block;    
    }
.homeIcons p
{
    margin: 25px 0 15px;
    font-family: Lato-bold;
    text-transform: uppercase;
    }
    
.homeIcons a
{
    font-weight: bold;
}

.homeIcons .readBtn
{
    font-weight: bold;
    margin-bottom: 25px;}

.homeIcons:hover img
{
    -webkit-transform:scale(0.9,0.9);
    transform:scale(0.9,0.9);}
/*@keyframes rotate {
     from{-webkit-transform:rotate(0deg);}
    to{-webkit-transform:rotate(360deg);}
}

.homeIcons:hover img {

        -webkit-animation-name: rotate;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: rotate;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    
    
} */   
footer
{
    background:#1c325a;
    text-align:left;
    padding:25px 30px 15px;
    color:#ffffff;
    }   

.copyright
{
    float:right;
    padding:0 15px;
    text-transform: uppercase;}
.copyright p
{
    display: inline-block;
    padding: 0 15px;}

.copyright a
{
    color: #ffffff;
    text-decoration: none;}    
    
.copyright a:hover
{
    color:#3c8ebd;}
@media only screen and (max-width: 767px) {
  
  footer
{

    text-align:center;
}

.copyright
{
        float:none;}
  .copyright p
  {
      display: block;}
}


/**************/

/**** Subpage ***/

.subPageBanner
{
    position:relative;
    }

.subPageBanner img
{
    width:100%;}

.subpageTitle
{
    position:absolute;
    bottom:5%;
    color: #ffffff;
    width:100%;
    }
    
.subpageTitle h3
{
    font-size:1.8rem;
    text-transform:uppercase;
    }
.subpageTitle p
{
    font-size:1.05rem;
    
    }
#maincontentSub
{
    margin:5% 0;
    }
    
.subImg{}
.subImg img
{
    width:100%;}
    
.subPgContent{}
.subPgContent h3
{
    margin-top: 20px;
    margin-bottom: 30px;}
.subPgContent p
{
    /*margin-bottom:10%;*/
    text-align: justify;}
    
@media screen and (min-width: 768px)
{
    .subPgContent h3
    {
        margin-top: 0;
        }
        
    .subpageTitle
    {
        width: 750px;
        }
        
    .subpageTitle h3
    {
        font-size:2.2rem;
        }
    .subpageTitle p
    {
        font-size:1.1rem;
        }
}

@media screen and (min-width: 992px)
{
    .subPgContent h3
    {
        margin-top: 0;
        }
        
    .subpageTitle
    {
        width: 970px;
        }
       .subpageTitle h3
    {
        font-size:2.2rem;
        }
    .subpageTitle p
    {
        font-size:1.2rem;
        }
}

@media screen and (min-width: 1200px)
{
    .subPgContent h3
    {
        margin-top: 0;
        }
        
    .subpageTitle
    {
        width: 1170px;
        }
    
    .subpageTitle h3
    {
        font-size:2.8rem;
        }
    .subpageTitle p
    {
        font-size:1.5rem;
        }
}

/********* Products ************/

.productHeader
{
    position: static!important;
    background: url(../gif/topRibbon.PNG), linear-gradient(to bottom, rgba(16,55,120,1) 50%, rgba(20,44,87,1) 100%)!important;
    background-position: left top, left top!important;
    background-repeat: no-repeat  !important;
    background-size: contain, cover!important;
    padding-bottom: 5px!important;
    }
.productBanner  
{
    position:relative;
    }
.productBanner img
{
    width:100%;
    min-height:98px;
    overflow:hidden;
    }    
.productPgTitle
{
    position: absolute;
    top: 50%;
    text-align: center;
    color: #ffffff;
    text-transform: uppercase;
    }
.productPgTitle h3
{
    display: inline;
    padding: 10px 15px;
    border-top: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    font-size: 1.5em;
    }
.productInfo
{
    padding: 20px 25px;
    border: 8px solid #ebebeb;
    margin-bottom: 30px;
    -webkit-transition: all 0.5s linear;
    transition: all 0.5s linear;}
    
.productInfo:hover {
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
}
.productInfo a
{
        text-decoration: none;
    color: #333;
    }
.productTitle
{
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 15px;
    text-transform: uppercase;
    white-space: nowrap;}
.productImg
{
    overflow: hidden;}
.productImg img
{
    width: 100%;
    margin: auto;
    -webkit-transition: all 350ms ease;
    transition: all 350ms ease;}
.productImg:hover img {
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
.productDesc
{
    margin-top: 20px;
    text-align: justify;
    max-height: 60px;
    overflow: hidden;}
    
.pager
{
    text-align: right;}
    
.pager li:first-child
{
    margin-right: 10px;
    }
    
.pager li>a, .pager li>span
{
    border-radius: 0;
    border:2px solid #ddd;
        padding: 10px 10px;
    font-size: 20px;
    float:none!important;
    }
    
@media screen and (min-width: 768px)
{}

@media screen and (min-width: 992px)
{
    .productTitle {
        font-size: 1.1rem;}
        
    .productPgTitle h3
    {
        font-size: 1.8em;
        }
}

@media screen and (min-width: 1200px)
{
    .productPgTitle h3
    {
        font-size: 2em;
        }
    
    .productTitle {
        font-size: 1.2rem;}
    }
    
.contactForm
{
    margin-top: 4%;
    margin-bottom: 3%;}
    
    
.imgGall
{
    padding: 0 10px;
    }

    
/***** video Gallery ****/

.video-list-thumbs{}
.video-list-thumbs > li{
    margin-bottom:12px;
}
.video-list-thumbs > li:last-child{}
.video-list-thumbs > li > a{
	display:block;
	position:relative;
	background-color: #1c325a;
	color: #fff;
	padding: 8px;
	border-radius:3px
    transition:all 500ms ease-in-out;
    border-radius:4px
}
.video-list-thumbs > li > a:hover{
	box-shadow:0 2px 5px rgba(0,0,0,.3);
	text-decoration:none
}
.video-list-thumbs h2{
	bottom: 0;
	font-size: 14px;
	height: 33px;
	margin: 8px 0 0;
}
.video-list-thumbs .glyphicon-play-circle{
    font-size: 60px;
    opacity: 0.6;
    position: absolute;
    right: 39%;
    top: 31%;
    text-shadow: 0 1px 3px rgba(0,0,0,.5);
    transition:all 500ms ease-in-out;
}
.video-list-thumbs > li > a:hover .glyphicon-play-circle{
	color:#fff;
	opacity:1;
	text-shadow:0 1px 3px rgba(0,0,0,.8);
}
.video-list-thumbs .duration{
	background-color: rgba(0, 0, 0, 0.4);
	border-radius: 2px;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	left: 12px;
	line-height: 13px;
	padding: 2px 3px 1px;
	position: absolute;
	top: 12px;
    transition:all 500ms ease;
}
.video-list-thumbs > li > a:hover .duration{
	background-color:#000;
}

.video-gall
{
    padding:8px;}
.video-gall img
{
    width:100%;}

@media (min-width:320px) and (max-width: 480px) { 
	.video-list-thumbs .glyphicon-play-circle{
    font-size: 35px;
    right: 36%;
    top: 27%;
	}
	.video-list-thumbs h2{
		bottom: 0;
		font-size: 12px;
		height: 22px;
		margin: 8px 0 0;
	}
}

/***** Video Modal ***/

.vModel-dialog
{
    top: 20px;
}
.vModel-content
{
    background-color: transparent;
}
.vModel-content > .modal-body
{
    padding: 8px;
    background-color: #1c325a;
    background-color: #b3b3b3;
    border-top-left-radius: 6px;
}


.vModel-close
{
    position: absolute;
    right: 0%;
    top: -37px;
    color: #ffffff;
    text-shadow: none;
    opacity: 1;
    outline: none;
    font-size: 30px;
    z-index: 99;
    background-color: #1c325a !important;
    padding: 2px 5px !important;
    border: 3px solid #b3b3b3 !important;
    
}

.vModel-close:hover, .vModel-close:focus
{
    color: #ffffff;
    
}

.vModel-content .modal-footer
{
    padding: 15px;
    background-color: rgba(28,50,90,.7);
    border-radius: 6px;
    border-top: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.videoTitle
{
    text-align: center;
    color: #ffffff;
    font-size: 1.2em;
    font-weight: bold;
}

@media only screen and (max-width: 768px)
{
    .vModel-dialog
    {
        top: 40px;
    }


.location-map
{
    width: 100%;
    height: 100%;
    position: relative;
}

.location-container 
{
    height: 30vw;
    min-height: 300px;
}

/**** Search Template ****/

.Searchcontent {
    margin-top: 4%;
    margin-bottom: 3%;
}

.searchResult {
    margin-bottom: 15px;
}

.s_title {
    font-weight: bold;
    font-size: 17px;
    color: #1a7bc9;
}

.s_url {
    font-weight: bold;
    color: green;
}

.s_abstract {
    overflow: hidden;
    max-height: 20px;
}


.location-map {
    width: 100%;
    min-height: 300px;
}