@font-face {
    font-family: 'MyriadProRegular';
    src: url("fonts/myriadpro-regular_0.eot");
    src: url("fonts/myriadpro-regular_0.eot") format('embedded-opentype'),
         url("fonts/myriadpro-regular_0.woff2") format('woff2'),
         url("fonts/myriadpro-regular_0.woff") format('woff'),
         url("fonts/myriadpro-regular_0.ttf") format('truetype'),
         url("fonts/myriadpro-regular_0.svg#MyriadProRegular") format('svg');
}

body {
font-family: 'MyriadProRegular';
 color: #868686;
  font-weight: normal;
  font-size: 14px;
  line-height: 24px;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d5cea6+0,c9c190+40,b7ad70+100;Brown+3D */
background: #d5cea6; /* Old browsers */
background: -moz-linear-gradient(top,  #d5cea6 0%, #c9c190 40%, #b7ad70 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d5cea6), color-stop(40%,#c9c190), color-stop(100%,#b7ad70)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* IE10+ */
background: linear-gradient(to bottom,  #d5cea6 0%,#c9c190 40%,#b7ad70 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5cea6', endColorstr='#b7ad70',GradientType=0 ); /* IE6-9 */

}
.container {
        background-color: #fff;
}
.padding0{ padding:0;}
.paddingleft0{ padding-left:0px;}
.padding8{ padding:8px;}
.padding10{ padding:10px;}
.paddingtop5{ padding-top:5px;}
.paddingtop20{ padding-top:20px;}
.paddingtop30{ padding-top:30px;}
.paddingtop50{ padding-top:50px;}
.paddingtopbottom0{ padding-top:0px; padding-bottom:0px;}
.paddingtopbottom8{ padding-top:8px; padding-bottom:8px;}
.paddingtopbottom10{ padding-top:10px; padding-bottom:10px;}
.paddingtopbottom12{ padding-top:12px; padding-bottom:12px;}
.paddingtopbottom15{ padding-top:15px; padding-bottom:15px;}
.paddingtopbottom20{ padding-top:20px; padding-bottom:20px;}
.paddingtopbottom30{ padding-top:30px; padding-bottom:30px;}
.paddingtopbottom40{ padding-top:40px; padding-bottom:30px;}
.margin0{ margin:0;}
margintopbottom0{ margin-top:0; margin-bottom:0;}
.margintopbottom10{ margin-top:10px; margin-bottom:10px;}
.margintopbottom20{ margin-top:20px; margin-bottom:20px;}
.margintopbottom30{ margin-top:30px; margin-bottom:30px;}
.marginleft5{ margin-left:5px;}
.margintop20{ margin-top:20px;}
.margintop30{ margin-top:30px;}
.margintop40{ margin-top:40px;}
.marginbottom20{ margin-bottom:20px;}
.marginbottom30{ margin-bottom:30px;}
.row {
  margin-right: 0;
  margin-left: 0;
}
a {
    color: #0095D7;
    text-decoration: none;
}
a:hover {
  color: #0095D7;
  text-decoration: underline;
}
p {
  margin: 0 0 5px;
  line-height: 22px;
  
}

h1, .h1 {
  font-family: 'MyriadProRegular';
  font-size: 32px;
 letter-spacing: 2px;
  color: #34b1fd;
}
h3, .h3 {
font-size: 24px;
    color: #0095D7;
    border-left: 5px solid;
    padding-left: 5px;
    -moz-box-shadow: 0px 1px 2px #A5A5A5;
    -webkit-box-shadow: 0px 1px 2px #A5A5A5;
    box-shadow: 0px 1px 2px #A5A5A5;
    padding: 5px;
}
h4, .h4 {
    font-size: 18px;
    color: #D26362;
    margin-bottom: 5px;
}
.thumbnail h3 {
    color: #fff;
    border: none;
}
.navbar-collapse.in {
    overflow-y: hidden!important;
    max-height: 453px;
}
.navbar {
  position: relative;
  min-height: 40px;
  margin-bottom: 20px;
  border: 1px solid transparent;
}
.navbar-default {
  background-color: #0095D7;
  border-color: #0073A6;
}
.navbar-default .navbar-nav > li > a {
  color: #FFF;
}
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 18px;
}
.navbar-default .navbar-nav > .active > a{
  color: #FFF!important;
  background-color: #0095D7!important;
}
.navbar-default .navbar-nav > .active > a:hover{
  color: #000!important;
  background-color: #0095D7!important;
}

.tophead-menu {
  color: #ffffff;
  font-size: 12px;
  text-align: center;
  background-color: #0095d7;
  padding: 5px 8px 5px 8px;
  float: right;
}
.tophead-menu a {
    color: #fff;
}
.thumbnail {
  display: block;
  padding: 1px 4px;
  margin-bottom: 20px;
  line-height: 1.42857143;
  background-color: #27A5F9;
  border: 0 solid #ddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: #fff;
}
.navbar-default .navbar-toggle {
  border-color: #A9D1E2;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #004D6F;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: #006EA8;
}


.nav-tabs > li.active > a{
  color: #FFF!important;
  cursor: default;
  background-color: #27A5F9!important;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
}
.tab-content {
  background-color: #27A5F9;
  color: #000;
  padding: 10px;
  min-height: 180px;
  margin-bottom: 30px;
}
.tab-content a {
    color: #000;
}
.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  background-color: #525f67;
      color: #fff;
}
.nav-tabs > li > a:hover {
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  background-color: #525f67;
}
.copyright {
  background-color: #4D4D4D;
  width: 100%;
  float: left;
  padding: 15px 5px 0px 5px;
  color: #FFF;
  font-size: 12px;
}
.copyright a {
    color: #fff;
}
.caption p {
  background-color: #4D4D4D;
  color: #fff;
  padding: 5px;
    font-size: 12px;
}
.thumbnail .caption {
  padding: 0px;
  color: #333;
}
.btn-primary {
  color: #fff;
  background-color: #27A5F9;
  border-color: #27A5F9;
  text-align: right;
  width: 100%;
}
.btn-primary:hover{
  color: #fff;
  background-color: #27A5F9;
  border-color: #27A5F9;
  text-decoration: underline;
}
.img-responsive {
    display: inherit;
    margin-left: 5px;
}
#block div {
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
-moz-border-right-colors: none;
-moz-border-top-colors: none;
background-color: #FFFFFF;
border-color: #333333 #333333 -moz-use-text-color;
border-image: none;
border-style: solid solid none;
border-width: 3px 3px medium;
bottom: 0;
color: #990000;
font-weight: bold;
padding: 10px;
position: fixed;
right: 0;
text-align: center !important;
width: 300px;
z-index: 999999;
display:none;
}
#block div h6 {
font: 24px/24px Arial, Helvetica, sans-serif;
padding: 0;
margin: 0;
}
#block div a {
font: 15px/20px Arial, Helvetica, sans-serif;
color: #990000!important;
padding: 0;
margin: 0;
}
#block div p {
color: #000;
text-align: center !important;
padding: 0;
margin: 0;
}
div#info {
font-size: 187.5%;
font-weight: bold;
margin: 100px 0;
text-align: center;
}
.readmore1 {
  text-align: right;
  width: 50%;
    transition: width 2s ease 0s;
	color:#fff;
}

.readmore1:hover {
  
  width: 57%;
 color:#fff;
}
.readmore1 a{
   background-color: #000;
    color: #fff;
    padding: 5px;
}


/***************************************************  Mobile css ***************************/

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


}


/******************************* 320 *****************************/

@media only screen and (min-width: 241px) and (max-width: 320px) {


}


/******************************* 384 *****************************/

@media only screen and (min-width: 321px) and (max-width: 384px) {

}


/******************************* 480 *****************************/

@media only screen and (min-width: 385px) and (max-width : 480px) {


}

/******************************* 568 *****************************/

@media only screen and (min-width: 481px) and (max-width: 568px) {


}

/******************************* 600 *****************************/

@media only screen and (min-width: 569px ) and (max-width: 600px) {


}

/******************************* 685 *****************************/

@media only screen and (min-width: 601px) and (max-width: 685px) {


}

/******************************* 768 *****************************/

@media only screen and (min-width: 686px ) and (max-width: 768px) {
.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 4px;
}
.navbar-default .navbar-nav > li > a {
    color: #FFF;
    font-size: 11px;
}
}

/******************************* 1024 *****************************/

@media only screen and (min-width: 770px) and (max-width : 1024px) {
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 4px;
  font-size: 13px;
}

}
/******************************* 1200 *****************************/

@media only screen and (min-width: 1025px) and (max-width : 1200px) {
.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 4px;
  font-size: 14px;
}


}



@media (min-width:769px) {
.fixed {
    height: 100px;
    left: 0;
    position: fixed;
    top: 0;
    
    width: 105%;
    z-index: 999;
}
.logos {
    float: left;
    height: 50px;
	padding-bottom: 5px;
}
.header{
 -webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */
    transition: width 2s;	

}

}

@media (max-width:768px) {
.copyright {
        text-align: center;
}
.copyright .text-right {
    text-align: center;
}
}


/********************** Dropdown Menu ************************/
ul.sub-menu {
    background: #34b1fd;
  width: 200px !important;
}
ul.sub-menu li{margin: 5px; padding: 8px !important; border-bottom: 1px solid #A9CBE6;}
ul.sub-menu li a{color:#fff; transition: all 0.5s ease-in-out 0s;}
ul.sub-menu li a:hover{color:#000; background: ##34b1fd; padding-left: 15px; transition:all 0.5s ease-in-out 0s}
ul.sub-menu li:hover a{color:#000; text-decoration:none; background: ##34b1fd;}
ul.sub-menu li:hover{background: #34b1fd; }
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 margin: 0;
 padding: 0;
 transition: all 0.5s ease-in-out 0s;
}

ul.dropdown {
 position: relative;
 z-index: 597;
 float: left;
}

ul.dropdown li {
 /*float: left;*/
 line-height: 1.3em;
 vertical-align: middle;
 zoom: 1;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
  position: relative;
  z-index: 599;
  cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 0;
 z-index: 598;
 width: 100%;
}

ul.dropdown ul li {
 float: none;
}

ul.dropdown ul ul {
 top: 1px;
 left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}
.collapse.in ul.dropdown li:hover > ul {
  position: relative;
  width: 100% !important;
}
.sidebar {
  background-color: #0095D7;
  margin-top: 20px;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  border: 1px solid #4283AE;
}
.sidebar a {
    color: #fff;
	transition: all 0.5s ease-in-out 0s;

}
.sidebar a:hover {
    color: #fff;
	padding-left:10px;
	
}
li.brdNav {
  margin-bottom: 20px;
  border-bottom: 1px dotted #FFF;
  padding-bottom: 10px;
}
.sidebar h4 {
  background-color: #4D4D4D;
  padding: 5px 10px;
  margin-left: -15px;
  margin-right: -15px;
}
.custinput{
font: 24px/24px Arial,Helvetica,sans-serif;
color:red;
text-align:center;
margin-top:100px;
}
.btn 
{
 width: 100px;
    
   
    -webkit-transition: width 2s; /* Safari */
    transition: width 2s;
}
.btn:hover {
    width: 150px;
	background-color:#34b1fd;
}

*::after, *::before {
    box-sizing: border-box;
}
*::after, *::before {
    box-sizing: border-box;
}
.site-header {
    transition: height 0.3s ease 0s;
}
figure.effect-romeo {
	-webkit-perspective: 1000px;
	perspective: 1000px;
}

figure.effect-romeo img {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,0,300px);
	transform: translate3d(0,0,300px);
}

figure.effect-romeo:hover img {
	opacity: 0.6;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-romeo figcaption::before,
figure.effect-romeo figcaption::after {
	position: absolute;
	top: 71%;
	left: 50%;
	width: 80%;
	height: 1px;
	background: #fff;
	content: '';
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
}

figure.effect-romeo:hover figcaption::before {
	opacity: 0.5;
	-webkit-transform: translate3d(-50%,-50%,0) rotate(45deg);
	transform: translate3d(-50%,-50%,0) rotate(45deg);
}

figure.effect-romeo:hover figcaption::after {
	opacity: 0.5;
	-webkit-transform: translate3d(-50%,-50%,0) rotate(-45deg);
	transform: translate3d(-50%,-50%,0) rotate(-45deg);
}

figure.effect-romeo h2,
figure.effect-romeo p {
	position: absolute;
	top: 70%;
	left: 0;
	width: 100%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

figure.effect-romeo h2 {
	-webkit-transform: translate3d(0,-50%,0) translate3d(0,-150%,0);
	transform: translate3d(0,-50%,0) translate3d(0,-150%,0);
}

figure.effect-romeo p {
	padding: 0.25em 2em;
	-webkit-transform: translate3d(0,-50%,0) translate3d(0,150%,0);
	transform: translate3d(0,-50%,0) translate3d(0,150%,0);
}

figure.effect-romeo:hover h2 {
	-webkit-transform: translate3d(0,-50%,0) translate3d(0,-100%,0);
	transform: translate3d(0,-50%,0) translate3d(0,-100%,0);
}

figure.effect-romeo:hover p {
	-webkit-transform: translate3d(0,-50%,0) translate3d(0,100%,0);
	transform: translate3d(0,-50%,0) translate3d(0,100%,0);
}
.grid {
	position: relative;
	margin: 0 auto;
	padding: 1em 0 4em;
	max-width: 1000px;
	list-style: none;
	text-align: center;
}
.grid {
	position: relative;
	margin: 0 auto;
	padding: 1em 0 4em;
	max-width: 1000px;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 10px 1%;
	
	max-width: 480px;
	max-height: 360px;
	width: 48%;
	background: #3085a3;
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure a {
	margin: 0;
	color:#fff;
}

.grid figure a {
    letter-spacing: 1px;
    font-size: 68.5%;
    text-shadow: 0px 2px 2px rgba(239, 173, 42, 0.8);
    border-bottom: 2px solid;
        font-weight: bold;
}
/*============== Tabel Start Here ==============*/
table.cntArea{font-family:Arial, Helvetica, sans-serif; font-size:13px;color:#545453; line-height:24px; border:1px dotted #d4d3d9;}
table.cntArea th {
    text-shadow: none !important;
    border: 1px solid #d4d3d9;
    border-collapse: collapse;
    padding: 3px;
    background-color: #115F82;
    color: #FFF;
    vertical-align: top;
    text-align: left;
}
table.cntArea tr{ border:1px solid #d4d3d9;text-shadow:none !important; border-collapse:collapse; padding:3px; background-color:#FFFFFF; color:#000; vertical-align:top; text-align:left;}
table.cntArea tr.alt{ border:1px solid #d4d3d9; border-collapse:collapse;text-shadow:none !important; padding:3px; background-color:#cfc2af; color:#000; vertical-align:top; text-align:left;}
table.cntArea td{ border:1px dotted #d4d3d9; border-collapse:collapse; padding:3px; vertical-align:top; text-shadow:none !important;text-align:left;}


.Customer{ font: 24px/24px Arial,Helvetica,sans-serif;
     color: #990000;
   
    margin: 115px 0 0 175px;
    padding: 0;

    
    
    }

/*============== Tabel End Here ==============*/
.imgborder {
    border: 1px solid #0095D7;
    padding: 1px;
}
.contact {
    font-size: 16px;
    line-height: 25px;
}
/*---------------*/
/***** Ruby *****/
/*---------------*/

figure.effect-ruby {
	background-color: #17819c;
}

figure.effect-ruby img {
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}

figure.effect-ruby:hover img {
	opacity: 0.5;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.effect-ruby h2 {
	margin-top: 20%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

figure.effect-ruby p {
	margin: 1em 0 0;
	padding: 3em;
	border: 1px solid #fff;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0) scale(1.1);
	transform: translate3d(0,20px,0) scale(1.1);
} 

figure.effect-ruby:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-ruby:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}
.grid li img {
    outline: none;
    border: none;
    display: block;
    max-width: 100%;
    border: 1px solid #0095D7!important;
    padding: 1px!important;
    background-color: #FFFFFF!important;
}
.grid li img:hover {
    border: 1px solid #000!important;
    padding: 1px!important;
    background-color: #000!important;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -o-transform: scale(1.03);
    transform: scale(1.03);
}
.faculty {
    background-color: rgba(199, 193, 157, 0.45);
    float: left;
    width: 100%;
    padding: 5px;
    margin-bottom: 20px;
    color: #000;
}
.faculty img {
    margin-right: 10px;
    border: 1px solid #5D1633;
}
ul.buildSitemap li {
    margin: 0 0 5px 0;
    list-style-type: none;
    background-image: url(../images/icon_red.gif);
    background-position: left 8px;
    background-repeat: no-repeat;
    padding-left: 20px;
}
/******add***************/
.pho img {
    margin: 10px!important;}
 .pho img:hover {
    opacity: 0.7;
}