.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
font-family: Railway, sans-serif; }
.navbar-inverse .navbar-nav .nav-link {
color: rgba(255, 255, 255, 0.75); }
header {
position: absolute;
z-index: 1000;
left: 0;
right: 0;
top: 0; }
.img-of-adm {
  text-align: center;
}

h1 {
        padding-top: 8rem;
        text-align: center;
	font-family: Raleway, sans-serif;
	font-size: 35px;
        color: #292b2c;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
	line-height: 36px;
}



.img-of-adm img {
  border-radius: 50%;
  padding: 5px;
  border: 5px solid #efefef;
  width: 100%;
  height: 200px;
  box-shadow: 2px 2px 5px #888888;
  margin-left: -50px;
  background-color: #fff;
}
.title {
  padding-top: 2rem;
  font-family: Raleway, sans-serif;
  text-align: center;
  line-height: 1.1; 
  color: #4a4a4a;
  font-size: 2.2rem;
  font-weight: 800;
  margin-bottom: 2rem; 
}
.title span {
  color: #336699;
    font-weight: 800;
}

.malee {
  font-size: 18px;
  margin-left: 10px;
  border: 1px solid #00f;
  padding: 3px 7px;
  border-radius: 50%;
  position: absolute;
  margin-top: 5px;
  color: blue
}
.femalee {
  font-size: 18px;
  margin-left: 10px;
  border: 1px solid #ff007f;
  padding: 3px 6px;
  border-radius: 50%;
  position: absolute;
  margin-top: 5px;
  color: #ff007f

}

footer .navbar.navbar-toggleable-md > .container .nav-item.nav-link:hover {
  background-color: #336699;
  color: #fff;
  border-radius: 10px;
  transition: all 0.3s ease-in-out;
}
.navbar-text:hover {
  background-color: #292b2c !important;
  color: #fff !important;
  border-radius: 0 !important;

}
header .navbar.navbar-toggleable-md {
padding: 1rem 0 0 0; }
@media (max-width: 991px) {
header .navbar.navbar-toggleable-md {
padding: 0; }
.img-of-adm img {
  margin-left: 0;
} 
.mybtn {
  margin-left: 0;
}

}
header .navbar-inverse .navbar-brand {
line-height: 2.5rem; }
header .navbar-brand {
margin-left: 0; }
header .navbar-brand .slogan {
font-size: 0.64rem;
text-transform: uppercase;
position: relative;
display: block;
line-height: 1;
font-weight: normal;
top: -1.5rem;
letter-spacing: 1px;
text-align: right; 
}
@media (max-width: 991px) {
header .navbar-brand .slogan {
top: -0.75rem;
font-size: 0.63rem;
font-weight: normal;
letter-spacing: normal; } 
}
.myheader {
width: 100%;
height: 120px;
background: rgba(51, 102, 153, 0.8);             /*******THE COLOR  ↓ ************/                                                                                                               /**THE IMAGE OF HEADER  ↓ **/
background-image: -webkit-linear-gradient(315deg, rgba(51, 102, 153, 0.9) 0%, rgba(51, 102, 153, 0.9) 20%, rgba(51, 102, 153, 0.9) 50%, rgba(51, 102, 153, 0.9) 60%, rgba(51, 102, 153, 0.9) 100%), url(https://www.chat-avenue.com/images/header.jpg);
background-position: 0 0, 50% 0;
background-repeat: no-repeat;
background-size: cover;}
.navbar.navbar-toggleable-md .bg-inverse {
background: transparent !important; }
.navbar.navbar-toggleable-md > .container {
text-align: center;
}
.navbar.navbar-toggleable-md .nav-item.nav-link {
letter-spacing: -0.5px;
line-height: 3.5rem;
border-bottom: none;
font-weight: 500;
color: #fff;
opacity: 0.9;
text-transform: uppercase;
margin: 0;
padding: 0 1rem; }
@media (max-width: 991px) {
.navbar.navbar-toggleable-md {
padding: 0; }
.ambb {
margin-right: 10px;
}
.navbar.navbar-toggleable-md > .container .navbar-brand{
margin-right: 0 !important;
}
.navbar.navbar-toggleable-md > .container {
width: 100%; }
.navbar.navbar-toggleable-md > .container .navbar-toggler {
margin-top: 0.5rem;
margin-bottom: 0;
height: 48px; }
.navbar.navbar-toggleable-md > .container .nav-item.nav-link {
margin: 0;
height: 3.5rem;
line-height: 3.5rem; }
.navbar.navbar-toggleable-md > .container .navbar-brand {
position: relative;
height: 4rem;
line-height: 4rem;
padding: 0;
font-size: 1.75rem;
letter-spacing: 0;
margin-right: 10px;
}
.navbar.navbar-toggleable-md > .container .navbar-collapse {
background: #336699;
background: rgba(51, 102, 153, 1);
padding-bottom: 1px;
margin-bottom: 1px; }
.navbar.navbar-toggleable-md > .container .navbar-collapse,
.navbar.navbar-toggleable-md > .container .collapsing,
.navbar.navbar-toggleable-md > .container .collapse.show {
position: relative; } }
@media (max-width: 991px) {
header .navbar.navbar-toggleable-md > .container .nav-item.nav-link {
border: 1px solid transparent;
border-bottom-color: #aaa; }
header .navbar.navbar-toggleable-md > .container div.navbar-nav a.nav-item.nav-link:last-child {
border-bottom-color: #aaa; } }
.brand {
font-weight: 800;
font-size: 2rem;
letter-spacing: 1px;
padding: 0; }
.brand i.brand {
width: 1em;
font-size: 1.33333333rem;
line-height: 1rem;
display: inline-block;
margin-right: 2px; }
.brand-light {
font-weight: 300;
letter-spacing: 0;
}
header .navbar-item.navbar-brand {
margin-top: 1.3rem; }
header .navbar a.brand {
line-height: 1;
height: 4rem;
margin-right: 0; }
header .navbar-inverse .navbar-toggler {
border-color: rgba(255, 255, 255, 0.3); }
@media (min-width: 769px) {
.hero-cover.home,
.hero.home,
.hero.home .content {
min-height: 480px;
height: 50vh; } }
.section {
padding-top: 3rem;
padding-bottom: 3rem; }

.section h3 {
	font-family: Raleway, sans-serif;
	font-size: 20px;
        color: #48698A;
	font-style: normal;
	font-variant: small-caps;
	font-weight: bold;
	line-height: 20px;
}

footer .navbar.navbar-toggleable-md > .container .nav-item.nav-link {
border-color: transparent;
padding: 0 0.5rem;
line-height: 3rem;
height: 3rem;
letter-spacing: 0;
font-size:14px;
font-family:Raleway, sans-serif;
transition: all 0.3s ease-in-out;
}
.nav-link small{
  border-color: transparent;
padding: 0 0.5rem;
line-height: 3rem;
height: 3rem;
letter-spacing: 0;
font-size:13px;
font-family:Raleway, sans-serif;

}
.footer.bg-inverse {
background-color: #373737 !important; }
 nav {
padding-top: 0;
padding-bottom: 0; 
}
.demopadding {
margin:15px auto;
text-align:center;
}
.icon {
position:relative;
text-align:center;
width:0px;
height:0px;
padding:17px;
border-top-right-radius:  20px;
border-top-left-radius:   20px;
border-bottom-right-radius: 20px;
border-bottom-left-radius:  20px;
-moz-border-radius:     20px 20px 20px 20px;
-webkit-border-radius:    20px 20px 20px 20px;
-khtml-border-radius:     20px 20px 20px 20px;
color:#FFFFFF;
}
.icon i {
font-size:15px;
position:absolute;
left:9px;
top:10px;
}
.icon.social {
float:left;
margin:0 5px 0 0;
cursor:pointer;
color:#6d6e71;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
}
.fb:hover {
background:#37589b ;
color:white;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
-webkit-filter: drop-shadow(0 1px 10px rgba(0,0,0,.8));
-moz-filter:  drop-shadow(0 1px 10px rgba(0,0,0,.8));
-ms-filter:     drop-shadow(0 1px 10px rgba(0,0,0,.8));
-o-filter:    drop-shadow(0 1px 10px rgba(0,0,0,.8));
filter:       drop-shadow(0 1px 10px rgba(0,0,0,.8));
}
.tw:hover {
background:#46d4fe ;
color:white;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
-webkit-filter: drop-shadow(0 1px 10px rgba(0,0,0,.8));
-moz-filter:  drop-shadow(0 1px 10px rgba(0,0,0,.8));
-ms-filter:     drop-shadow(0 1px 10px rgba(0,0,0,.8));
-o-filter:    drop-shadow(0 1px 10px rgba(0,0,0,.8));
filter:       drop-shadow(0 1px 10px rgba(0,0,0,.8));
}
.gp:hover {
background:#de5a49 ;
color:white;
transition: 0.5s;
-moz-transition: 0.5s;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
-webkit-filter: drop-shadow(0 1px 10px rgba(0,0,0,.8));
-moz-filter:  drop-shadow(0 1px 10px rgba(0,0,0,.8));
-ms-filter:     drop-shadow(0 1px 10px rgba(0,0,0,.8));
-o-filter:    drop-shadow(0 1px 10px rgba(0,0,0,.8));
filter:       drop-shadow(0 1px 10px rgba(0,0,0,.8));
}
.icon.social.fb i {
left:13px;
top:10px;
}
.icon.social.tw i {
left:11px;
}
.icon.social.gp i {
left:11px;
}

.section{
font-family:Raleway, sans-serif;
}
#navbarContent a:hover{
}
body{
overflow-x:hidden;
}
.containerw {
height:200px;
width:100%;
position:absolute;
background:red;
overflow:hidden;
z-index: -1;
}
@media (min-width: 668px){
.containerw img{
width:100%;
}
.st1{
margin-left:50px !important;
}
}
.maincontentdiv{
position:relative;
height:90%;
width:85%;
-moz-border-radius:15px;
border-radius:15px;
overflow:hidden;
}
@media only screen and (max-width: 768px) {
.maincontentdiv{
display:none;
}
.ambb{
margin-right:7px;
}
}
@media (min-width: 768px) and (max-width: 1440px) {
.maincontentdiv{height:90vh;}
}
@media (min-width: 1442px){
.maincontentdiv{height:900px!important;}
}
@media (min-width: 1020px){
.navbar.navbar-toggleable-md .nav-item.nav-link{
padding:0 0.8rem !important;
}
}
@media (max-width: 1199px){
  .img-of-adm img {
    height: 180px;
  }
  .navbar.navbar-toggleable-md > .container{
    padding: 0;
  }
  .nav-link small {
    font-size: 14px;
  }
}
@media (max-width: 991px) {
.img-of-adm img {
  height: 165px;
}
header .navbar-item.navbar-brand {
  margin-top: 1.3rem;
}
.mybtn {
  margin-left: 0;
}
}
@media (max-width: 767px) {
.img-of-adm img {
  width: 200px;
  height: 200px;
  text-align: center;
}
.mybtn {
  margin-bottom: 30px;
}
.img-of-adm {
  text-align: center;
}

.title {
  font-size: 2.2rem;
}
}
header .navbar-item.navbar-brand {
  margin-top: 0.9rem;
}
@media (max-width: 991px) {
header .navbar-item.navbar-brand {
  margin-top: 1.1rem;
}
}