
body{
	padding:0;
	margin:0;
	background:#ccc;
	position:relative;
	font-family: 'Open Sans', sans-serif;
}
body a{
    transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
a:hover{
	text-decoration:none;
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
h1,h2,h3,h4,h5,h6{
	margin:0;	
	font-family: 'Open Sans', sans-serif;
}	
p {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  letter-spacing: 1px;
  font-size: 1em;
  color:black;
  line-height: 1.9em;
  }
ul{
	margin:0;
	padding:0;
}
label{
	margin:0;
}
.no-padding {
 padding-left: 0;
 padding-right: 0;	
}
.upArrow{
  width: 40px;
  height: 40px;
  position: fixed;
  right: 15px;
  top:78%;
  text-align: center;
  line-height: 35px;
  cursor: pointer;
  display: none;
  background:#0075bd;
}

/*----topMenu start---*/
.topMenu {
 background: f2dede;
 color:#000;	
}
.topMenuText {
 color:#000;
 font-size: 14px;
 font-weight: 700; 
 padding: 10px 0;	
}
.topMenuInfo ul {
 padding: 0;
 margin: 0;
 float: right; 	
}
.topMenuInfo ul li {
 list-style: none;
 display: inline-block;	
}
.topMenuInfo ul li a {
  padding: 10px 30px;
  background: #007bc4;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  margin-right: 3em;
  display: block;
}
/*---navbar start--*/
.logoleft {	
 display: none;	
}
.navbar-default {
  background:#6daae1;
  border: none;
  border-radius:0;
  margin:0;
}
.navbar-nav {
 padding: 11px 0; 
}
.navbar-default .navbar-nav>li>a {
  color:black;
  padding:10px 15px;
  margin: 0 5px 0 0;
  font-weight:600;
  text-transform:uppercase;
}
.navbar-default .navbar-nav>.active>a, 
.navbar-default .navbar-nav>.active>a:focus, 
.navbar-default .navbar-nav>.active>a:hover {
  color:white;
  padding:10px 15px;
  background:#007bc4;
  transition:All 0.5s;
}
.navbar-default .navbar-nav>li>a:focus, 
.navbar-default .navbar-nav>li>a:hover {
  color:white;
  padding:10px 15px;
  background:#007bc4;
}
.logoCenter {
  position: absolute;
  left:44%;
  top: -38%;
}
.dropdown-menu {
 background: #fff; 
 padding: 0;
 margin: 10px 0 0 0;
}
.dropdown-menu>li>a {
  padding: 10px 20px;
  font-weight:600;
  text-transform:uppercase;
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
  background:#007bc4;
  color:#fff;
 
/* Hello Mohar Technologies,
Thanks for concerning me for the UI developer. I am looking for such an opprtunity where I can grow my Angular, HTML, CSS, Boostrap skills. It would be great if your company provide me such a platform. So, I can apply for the UI developer position.
My basic information:
Experience: 1 year
CTC: 4 lacs/ PA
Notice period: Ready to join immediately
Thank you!
 */ 
}
.navbar-default .navbar-nav>.open>a, 
.navbar-default .navbar-nav>.open>a:focus, 
.navbar-default .navbar-nav>.open>a:hover {
  background: #007bc4;
  color:white;
  display: block;
}
.dropdown:hover .dropdown-menu {
  display: block;
  margin-top:0px;
 }
.navbar-right .dropdown-menu {
 right:auto;
 left: auto; 
} 

/*----banner strat--*/
/* Video overlay and content */
.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  pointer-events: none; /* Allows right click menu on the video */
  background: url($overlay_pattern) left top repeat;
  opacity: $overlay_opacity;
}
audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
    width: 100%;
} 

/*----shortInfo----*/
.shortInfo {
 padding: 50px 0;
 background: #fafafa;	
}
.shortInfo h3{
	font-size: 35px;
	text-align: center;
    text-transform: capitalize;
    color: #212121;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 1.5em;
    margin: 0 0 20px 0;
}
.child{
	color:#007bc4;
}
.child1{
	color:#dd127b;
}
.child2{
	color:#00913f;
}
.child3{
	color:#e77712;
}
.child4{
	color:#9d261d;
}
.child5{
  color:#d64d3a;
}
.child6{
  color:#3ab2c4;
}
.child7{
  color:#014691;
}
.child8{
  color:#0192df;
}
figure.snip1104 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 1%;
  min-width: 220px;
  max-width: 310px;
  width: 100%;
  background: #000000;
  color: #ffffff;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  margin: 0 0 30px 0;
}

figure.snip1104 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

figure.snip1104 img {
  max-width: 100%;
  position: relative;
  opacity: 0.4;
}

figure.snip1104 figcaption {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

figure.snip1104 h2 {
  position: absolute;
  left: 40px;
  right: 40px;
  display: inline-block;
  background: #007bc4;
  -webkit-transform: skew(-10deg) rotate(-10deg) translate(0, -50%);
  transform: skew(-10deg) rotate(-10deg) translate(0, -50%);
  padding: 12px 5px;
  margin: 0;
  top: 50%;
  text-transform: uppercase;
  font-weight: 400;
}
figure.color1 h2 {
  background:#dd127b; 
}
figure.color2 h2 {
  background:#e77712; 
}
figure.color3 h2 {
  background:#9d261d; 
}


figure.snip1104 h2 span {
  font-weight: 800;
}

figure.snip1104:before {
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  content: '';
  position: absolute;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-transform: rotate(110deg) translateY(-50%);
  transform: rotate(110deg) translateY(-50%);
}

figure.snip1104 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}

figure.snip1104.blue {
  background: #123851;
}

figure.snip1104.blue h2 {
  background: #0a212f;
}

figure.snip1104.red {
  background: #581a14;
}

figure.snip1104.red h2 {
  background: #36100c;
}

figure.snip1104.yellow {
  background: #7f5006;
}

figure.snip1104.yellow h2 {
  background: #583804;
}

figure.snip1104:hover img,
figure.snip1104.hover img {
  opacity: 1;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

figure.snip1104:hover h2,
figure.snip1104.hover h2 {
  -webkit-transform: skew(-10deg) rotate(-10deg) translate(-150%, -50%);
  transform: skew(-10deg) rotate(-10deg) translate(-150%, -50%);
}

figure.snip1104:hover:before,
figure.snip1104.hover:before {
  -webkit-transform: rotate(110deg) translateY(-150%);
  transform: rotate(110deg) translateY(-150%);
}
.imgText {
     background: #007bc4;
    color: white;
    padding: 10px 20px;
    font-size: 25px;
    width: 60%;
    margin: 0 auto;
    text-align: center
}

.funnyDayTitle {
 color:#000;
 font-size: 35px;
 font-weight: 700;
 margin: 0 0 10px 0;
 text-align: center;	
}
.funnyDayText {
 color: #333; 
 font-size: 14px;
 text-align: center;
 line-height: 2;
 margin: 0 0 10px 0;
}
.funnyDayVisit {
  text-align: center;
  line-height: 2;	
}
/*-----funnyDayInfo----*/
.funnydayPadding {
 padding: 0;	
 background: #d9edf7;
}
.funnydayPadding1 {
 padding: 0 25px 15px;	
 background: #d9edf7;
}
.funnyDayImg {
 width: 100%;
 overflow: hidden;
 padding: 0;
 position: relative;	
}
.funnyDayImg img {
 width: 100%;
 height: 530px;
 transition: all 0.5s;	
}
.funnyDayImg:hover img {
 transform: scale(1.3);	
}
.funnyDayInfoTitle {
 color: #000; 
 font-size: 22px;
 font-weight: 700;
 line-height: 2;
 margin:20px 0 10px 0;
}
.funnyDayInfoList ul {
 padding: 0;
 margin: 0;	
}
.funnyDayInfoList ul li {
 list-style: none;
 padding: 0 0 10px 0;
 color:#333;
 font-size: 14px;	
}

/*----footer strat----*/
.footer {
 padding: 50px 0 0 0;
 background:#121b24; 
}
.footer_start {
 margin-bottom: 20px; 
}
.footer_start h3{
 font-size:25px;
 color:#c0c0c0;
 font-weight:400;
 margin-bottom:30px;
}
.footer_start p {
 color:#c0c0c0;
 margin-bottom:40px; 
}
.footer_start ul {
 margin:0;
 padding:0; 
}
.areas li {
list-style: none;
border-bottom: 1px solid #202b37;
margin-bottom: 7px;
padding-bottom:10px;
}    
.areas a {
 display: table-cell;
}

.footer_start a {
 color:#c0c0c0;
 font-weight:300;
 font-size:15px; 
}
.footer_start:hover a {
 text-decoration: none;	
}

.footer_start i {
 font-size:16px;
 color:#c0c0c0;
 margin-right:5px;
}
.areas i {
 font-size:16px;
 color:#c0c0c0;
 margin:2px 15px 0 0;
 float: left;
}
.social_link li {
 list-style: none;
 display: inline-block;
}

.social_link i{
 font-size:14px;
 color:#c0c0c0;
 border:1px solid #202b37;
 line-height:10px;
 padding: 10px;
 width:36px;
 height:36px;
 text-align: center;
}

/*----footer_bottom strat---*/
.footer_bottom {
 padding:20px 0;
 background: rgb(18, 27, 36);
border-top: 1px solid rgb(32, 43, 55);
}
.footer_bottom p {
 color: rgb(192, 192, 192);
 text-align: center;
 font-size:14px;
 font-weight:400;
}


@media(max-width:767px) {
.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>li>a:hover {
  padding: 5px 10px;
 }  
.navbar-default {
 padding: 5px 0;
 } 
.navbar-default .navbar-toggle {
 border-color:#000; 
 } 
.navbar-default .navbar-toggle .icon-bar {
 background-color: #000;  
 }
.navbar-default .navbar-toggle:focus, 
.navbar-default .navbar-toggle:hover {
 background: none;
 }
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border:none;
  box-shadow: none;
 } 
.topMenuInfo ul {
  float: none; 
 }
.logoCenter {
 display: none; 
 }
.logoleft { 
 display: block; 
 position: absolute;
 top: 0;
 padding: 0;
 }
.navbar-nav {
 padding: 0; 
 }
.navbar-default .navbar-nav>li>a{
 margin: 0; 
 }
}

@media(min-width: 768px)  and (max-width: 992px) {
.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>li>a:hover {
  padding: 8px;
  margin: 0;
 }   
.logoleft {
  display: none;
 } 
.logoCenter img {
  width: 120px; 
 }
.logoCenter {
    left: 45%;
    top: -26%;
 } 
}

@media(min-width:992px) and (max-width: 1024px) {
.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>li>a:hover {
  padding: 10px;
  margin: 5px;
 }

.logoCenter {
 left: 40%;
 }

}