@import url('../font-awesome/css/font-awesome.css');

@import url('bootstrap.min.css');

/* Global Styles */

* {

	margin: 0;

	padding: 0;

}

html, body {

	height: 100%;

}

body {

	padding-top: 0; /* body padding for fixed top nav */

	color: #33343d;

	font-family: 'Roboto';

	background: #fff;

	font-size: 16px;

}

img {

	max-width: 100%;

	height: auto;

}

a {

	color:#CC0000;

}

a:hover {

	color: #990000;

}

.full {

	width: 100%;

	float: left;

}

.body ul, .body ol {

	margin: 0 20px;

}

/* Global Styles End */

/**************************header start**************************/

header {

	width: 100%;

	float: left;

}

.logo {

	width: 100%;

	float: left;

	margin: 15px 0;

}

.up {

	width: 100%;

	float: left;

	padding: 15px 0;

	background: #191a25;

	color: #FFF;

}

.phone {

	float: left;

	font-size: 16px;

}

.phone i {

	color: #ffce1c;

}

.email {

	float: right;

	font-size: 18px;

}

.email i {

	color: #ffce1c;

}

/**************************header end**************************/

/**************************MENU START*****************************/

.navbar-brand {

	height: auto;

}

.navbar-nav {

	float: right;

}

.navbar-default {

	background: #fff;

	width: 100%;

	float: left;

	margin: 0;

	min-height: 0;

}

.nav>li>a {

	position: relative;

	display: block;

    font-size: 12px;

    padding: 51px 5px;

	color: #000 !important;

	font-weight: normal;

	text-transform: capitalize;

	-webkit-transform: skew(-15deg);

	-moz-transform: skew(-15deg);

	-o-transform: skew(-15deg);

	font-weight: normal;

	float: left;

}

.nav>li>a span {

	-webkit-transform: skew(15deg);

	-moz-transform: skew(15deg);

	-o-transform: skew(15deg);

	float: left;

}

.nav>li>a:hover {

	background-color: #ffce1c !important;

}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {

	background-color: #ffce1c !important;

}

.navbar-toggle {

	background-color: #42403a !important;

	border: 1px solid #fff !important;

}

.navbar-default .navbar-toggle .icon-bar {

	background-color: #fff;

}

.navbar-nav.navbar-left:first-child {

	margin-left: -15px;

}

.navbar-collapse {

	padding-right: 0;

	padding-left: 0;

}

/**********************************sub menu{if required}*****************************/

.nav li ul {

	list-style-type: none;

}

.nav li ul {

	position: absolute;

	margin: 0 0 0 0;

	display: none;

	z-index: 99;

	width: 250px;

	padding: 0 0;

	float: left;

	top: 119px;	

}

.nav li:hover ul {

	display: block;

}

.nav li ul li {

	float: left;

	text-align: left;

	background: #fff;

	width: 100%;

}

.nav li ul li:last-child {

	border-bottom: none;

}

.nav li ul li a {

	color: #000;

	padding: 10px 15px;

	font-size: 17px;

	text-transform: capitalize;

	width: 100%;

	float: left;

	border-bottom: #000 1px dashed;

	background:#eee;

}

.nav li ul li:last-child a {

	border-bottom: none;

}

.nav li ul li a:hover {

	color: #000;

	text-decoration: none;

	background-color: #ffce1c !important;

}

/****************************sub menu********************************/

/**************************MENU END*****************************/

/**************************banner start**************************/

.banner {

	width: 100%;

	float: left;

}

.carousel-inner > .item > img {

	width: 100%;

}

.carousel-caption {

	right: 0;

	left: 0;

	bottom: 150px;

	text-align: left;

}

.banner h1 {

	margin: 0;

	font-size: 60px;

	font-weight: bold;

	color: #ffce1c;

	text-shadow: #000 2px 2px 2px;

}

.banner p {

	margin: 0;

	font-size: 20px;

	color: #fff;

	text-shadow: #000 1px 1px 1px;

}

.banner .more span {

	background: #ffce1c;

	color: #000;

}

/**************************banner end**************************/

/**************************body start**************************/

.body {

	width: 100%;

	float: left;

	padding: 40px 0;

	overflow: hidden;

}

.titel {

	background: #191a25;

	padding: 10px 60px 10px 40px;

	margin-bottom: 20px;

	float: left;

	-webkit-transform: skew(-15deg);

	-moz-transform: skew(-15deg);

	-o-transform: skew(-15deg);

	margin-left: -15px;

}

.titel h2 {

	margin: 0;

	font-size: 40px;

	font-weight: bold;

	color: #FFF;

	-webkit-transform: skew(15deg);

	-moz-transform: skew(15deg);

	-o-transform: skew(15deg);

}

.titel h2 span {

	color: #83b3e4;

	text-transform: uppercase;

}

.more {

	background: #191a25;

	float: left;

	overflow: hidden;

	color: #FFF;

	margin-top: 20px;

}

.more span {

	background: #7bbbe7;

	float: left;

	-webkit-transform: skew(-15deg);

	-moz-transform: skew(-15deg);

	-o-transform: skew(-15deg);

	padding: 13px 45px 13px 35px;

	margin-left: -15px;

}

.more i {

	padding: 8px 15px;

	font-weight: bold;

}

.more:hover {

	color: #191a25;

}

.more:hover i {

	color: #ffce1c;

}

.volunteer {

	width: 100%;

	float: left;

	padding: 80px 0;

	background: url(../images/vlntrbg.jpg) no-repeat;

	background-size: cover;

}

.volunteer h1 {

	width: 100%;

	float: left;

	margin: 0;

	font-size: 60px;

	font-weight: bold;

	text-transform: uppercase;

}

.volunteer .more {

	background: #fff;

	float: right;

	color: #000;

	margin-top: 10px;

	font-weight: bold;

}

.volunteer .more span {

	background: #ffce1c;

}

.volunteer .more:hover {

	color: #fff;

}

.slider-sec {

	width: 100%;

	float: left;

	position: relative;

	margin-top: 15px;

}

.marquee {

	margin: 0 auto;

}

.marquee .owl-item {

	text-align: center;

	cursor: all-scroll;

}

.marquee .owl-item .item {

	width: 94%;

	float: left;

	background: url(../images/secbg.png) no-repeat left top;

	overflow: hidden;

	padding: 30px 0;

	margin: 0 3%;

	box-shadow: #eee 0px 0px 2px inset;

}

.white_box {

	background: #FFF;

	padding: 20px 80px 20px 50px;

	border-left: 5px #ffce1c solid;

	-webkit-transform: skew(-16deg);

	-moz-transform: skew(-16deg);

	-o-transform: skew(-16deg);

	box-shadow: #999 0px 0px 5px;

	margin-right: -40px;

	float: right;

	width: 400px;

	text-align: left;

}

.white_box_in {

	width: 100%;

	float: left;

	-webkit-transform: skew(16deg);

	-moz-transform: skew(16deg);

	-o-transform: skew(16deg);

	color: #000;

}

.white_box_in h3 {

	width: 100%;

	float: left;

	margin: 0 0 10px 0;

	font-size: 17px;

	letter-spacing: 1px;

	line-height: 22px;

	color: #000;

	font-weight: bold;

}

.white_box_in p {

	width: 100%;

	float: left;

	margin: 5px 0;

	font-size: 14px;

	color: #000;

}

.white_box_in p i {

	color: #7bbbe7;

}

.white_box_in .more {

	background: #191a25;

	color: #FFF;

	padding: 0px 0 0 15px;

	margin: 10px 0 0 0;

	font-size: 14px;

}

.white_box_in .more span {

	background: #191a25;

	padding: 7px 20px 7px 20px;

	margin-left: -25px;

}

.white_box_in .more:hover span {

	background: #ffce1c;

	color: #000;

}

.white_box_in .more i {

	padding: 10px 15px;

}

.marquee .owl-controls .owl-prev {

	width: 56px;

	height: 52px;

	float: left;

	position: absolute;

	z-index: 999;

	right: 35px;

	top: -90px;

	background: url(../images/pre.jpg) no-repeat center;

	color: transparent;

	display: none;

}

.marquee .owl-controls .owl-next {

	width: 56px;

	height: 52px;

	float: left;

	position: absolute;

	z-index: 999;

	right: 0;

	top: -90px;

	background: url(../images/nxt.jpg) no-repeat center;

	color: transparent;

	display: none;

}

.owl-carousel .animated {

	-webkit-animation-duration: 1000ms;

	animation-duration: 1000ms;

	-webkit-animation-fill-mode: both;

	animation-fill-mode: both;

}

.owl-carousel .owl-animated-in {

	z-index: 0;

}

.owl-carousel .owl-animated-out {

	z-index: 1;

}

.owl-carousel .fadeOut {

	-webkit-animation-name: fadeOut;

	animation-name: fadeOut;

}

 @-webkit-keyframes fadeOut {

 0% {

 opacity: 1;

}

 100% {

 opacity: 0;

}

}

@keyframes fadeOut {

 0% {

 opacity: 1;

}

 100% {

 opacity: 0;

}

}

.owl-height {

	-webkit-transition: height 500ms ease-in-out;

	-moz-transition: height 500ms ease-in-out;

	-ms-transition: height 500ms ease-in-out;

	-o-transition: height 500ms ease-in-out;

	transition: height 500ms ease-in-out;

}

.owl-carousel {

	display: none;

	width: 100%;

	-webkit-tap-highlight-color: transparent;

	z-index: 1;

}

.owl-carousel .owl-stage {

	position: relative;

	-ms-touch-action: pan-Y;

}

.owl-carousel .owl-stage:after {

	content: ".";

	display: block;

	clear: both;

	visibility: hidden;

	line-height: 0;

	height: 0;

}

.owl-carousel .owl-stage-outer {

	position: relative;

	overflow: hidden;

	-webkit-transform: translate3d(0px, 0px, 0px);

}

.owl-carousel .owl-controls .owl-nav .owl-prev, .owl-carousel .owl-controls .owl-nav .owl-next, .owl-carousel .owl-controls .owl-dot {

	cursor: pointer;

	cursor: hand;

	-webkit-user-select: none;

	-khtml-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	user-select: none;

}

.owl-carousel.owl-loaded {

	display: block;

}

.owl-carousel.owl-loading {

	opacity: 0;

	display: block;

}

.owl-carousel.owl-hidden {

	opacity: 0;

}

.owl-carousel .owl-refresh .owl-item {

	display: none;

}

.owl-carousel .owl-item {

	position: relative;

	min-height: 1px;

	float: left;

	-webkit-backface-visibility: hidden;

	-webkit-tap-highlight-color: transparent;

	-webkit-touch-callout: none;

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	user-select: none;

}

.owl-carousel .owl-item img {

	display: inline-block;

	-webkit-transform-style: preserve-3d;

}

.owl-carousel.owl-text-select-on .owl-item {

	-webkit-user-select: auto;

	-moz-user-select: auto;

	-ms-user-select: auto;

	user-select: auto;

}

.owl-carousel .owl-grab {

	cursor: move;

	cursor: -webkit-grab;

	cursor: -o-grab;

	cursor: -ms-grab;

	cursor: grab;

}

.owl-carousel.owl-rtl {

	direction: rtl;

}

.owl-carousel.owl-rtl .owl-item {

	float: right;

}

.donate {

	width: 100%;

	float: left;

	padding: 80px 0;

	background: url(../images/dntbg.jpg) no-repeat;

	background-size: cover;

}

.donate h1 {

	width: 100%;

	float: left;

	margin: 0;

	font-size: 60px;

	font-weight: bold;

	text-transform: uppercase;

}

.donate .more {

	background: #fff;

	float: right;

	color: #000;

	margin-top: 10px;

	font-weight: bold;

}

.donate .more span {

	background: #191a25;

	color: #fff;

}

.donate .more:hover span {

	color: #ffce1c;

}




.emergency {

	width: 100%;

	float: left;

	padding: 80px 0;

	background: url(../images/emergbg.jpg) no-repeat;

	background-size: cover;

}

.emergency h1 {

	width: 100%;

	float: left;

	margin: 0;

	font-size: 60px;

	font-weight: bold;

	text-transform: uppercase;
	
	 color: #fff;

}

.emergency .more {

	background: #fff;

	float: right;

	color: #000;

	margin-top: 10px;

	font-weight: bold;

}

.emergency .more span {

	background: #191a25;

	color: #fff;

}

.emergency .more:hover span {

	color: #ffce1c;

}



.portfolio_part {

	width:100%;

	float: left;

	overflow: hidden;

	position: relative;

	margin: 0;

	margin:0;

}

.portfolio_part img {

	width:100%;

}

.portfolio_part:hover {

	-webkit-transition: all 0.5s ease-in-out;

	-moz-transition: all 0.5s ease-in-out;

	-ms-transition: all 0.5s ease-in-out;

	-o-transition: all 0.5s ease-in-out;

	transition: all 0.5s ease-in-out;

	z-index: 99;

	position: relative;

}

.portfolio_part:hover .triangle {

	bottom: 0px;

}

.triangle {

	width: 100%;

	height: 100%;

	display: block;

	background: rgba(0,0,0,0.7);

	cursor: pointer;

	position: absolute;

	bottom: 100%;

	-webkit-transition: bottom linear 0.2s;

	-moz-transition: bottom linear 0.2s;

	-ms-transition: bottom linear 0.2s;

	-o-transition: bottom linear 0.2s;

	transition: bottom linear 0.2s;

}

.triangle span {

	bottom: 45%;

	position: absolute;

	width: 100%;

	float: left;

	text-align: center;

}

.triangle span a {

	color: #FFF;

	border: 1px #96cc4e dashed;

	padding: 10px;

	margin: 0 5px;

	font-size: 20px;

}

.triangle span a:hover {

	color: #96cc4e;

}



.magnet {

	width: 100%;

	float: left;

}

.magnet-item{

	width:31.3%;

	float:left;

	margin:1%;

	border:1px #ccc solid;

	border-bottom-width:3px;

}

.magnet-item hr {

    margin-top: 5px;

    margin-bottom: 5px;

    border: 0;

    border-top: 1px solid #ccc;

}

/**************************body end**************************/



/**************************footer start**************************/

.up_footer {

	width: 100%;

	float: left;

	padding: 40px 0;

}

.link {

	width: 100%;

	float: left;

	margin: 5px 0;

	font-size: 14px;

}

.link h3 {

	font-size: 24px;

	color: #7bbbe7;

	font-weight: bold;

	margin: 0 0 30px 0;

}

.link ul {

	list-style-image: url(../images/li.png);

	margin: 0 20px;

}

.link_work {

	width: 100%;

	float: left;

}

.link_work a img {

	margin: 3px;

}

footer {

	width: 100%;

	float: left;

	background: #191a25;

	padding: 15px 0;

	font-size: 14px;

	color: #FFF;

	text-align: center;

}

footer a {

	border-right: 1px #fff solid;

	padding: 0 10px;

	font-size: 14px;

	color: #FFF;

	text-transform: uppercase;

}

footer a:last-child {

	border-right: none;

}

/**************************footer end**************************/

.registration_form {
    width: 100%;
    float: left;
    background: #f2f2f2;
    padding: 15px;
    border: 1px #191a25 solid;
    box-shadow: 0 0 0 17px #f2f2f2;
    margin-top: 20px;
}

/****************************media quary start********************************/

@media (max-width: 1520px) {

.carousel-caption {

	bottom: 90px;

}

}

@media (max-width: 1199px) {

.nav>li>a {

	position: relative;

	display: block;

	font-size: 10px;

	padding: 51px 1px;

	color: #000 !important;

	font-weight: normal;

	text-transform: capitalize;

	-webkit-transform: skew(-15deg);

	-moz-transform: skew(-15deg);

	-o-transform: skew(-15deg);

	font-weight: normal;

	float: left;

}

.volunteer h1 {

	font-size: 46px;

}

.volunteer .more {

	margin-top: 0;

}

.carousel-caption {

	bottom: 50px;

}

}

 @media (max-width: 991px) {

.logo {

	width: 100%;

	float: left;

	text-align: center;

}

.navbar-header {

	background: #ffce1c;

}

.navbar-nav {

	float: left;

	width: 100%;

	margin: 5px 0;

}

.nav>li>a {

	padding: 5px 20px;

	-webkit-transform: skew(0deg);

	-moz-transform: skew(0deg);

	-o-transform: skew(0deg);

	float: left;

	width: 100%

}

.nav>li>a span {

	-webkit-transform: skew(0deg);

	-moz-transform: skew(0deg);

	-o-transform: skew(0deg);

	float: left;

}

.nav li ul {

	position: relative;

	margin: 0 5% 10px 5%;

	display: block;

	width: 90%;

	float: left;

	right: 0;

	top: 0;

}

.nav li ul li a {

	padding: 5px 20px;

	background: #eee;

}

.volunteer h1 {

	font-size: 34px;

}

.more span {

	padding: 8px 20px 8px 30px;

}

.more i {

	padding: 3px 12px;

}

.link {

	min-height: 300px;

}

.volunteer {

	padding: 50px 0;

}

.donate h1 {

	width: 100%;

	float: left;

	margin: 0;

	font-size: 34px;

	font-weight: bold;

	text-transform: uppercase;

}

.donate {

	padding: 50px 0;

}

.donate .more {

	margin-top: 0;

}

.carousel-caption {

	bottom: 0;

	background: rgba(0,0,0,0.5);

	padding: 20px;

}

}

@media (max-width: 767px) {

.volunteer h1 {

	font-size: 42px;

	margin-bottom: 15px;

}

.more {

	float: left !important;

}

.donate h1 {

	font-size: 42px;

	margin-bottom: 15px;

}

.link {

	min-height: 0;

	margin-bottom: 20px;

}

.link h3 {

	font-size: 22px;

	margin: 0 0 10px 0;

}

footer a {

	border: none;

	padding: 2px 0;

	width: 100%;

	float: left;

}

.carousel-caption {

	background: rgba(0,0,0,1);

	padding: 15px;

	position: relative;

}

.banner h1 {

	font-size: 36px;

}

.banner p {

	font-size: 16px;

}

.up span{

	width: 100%;

	float: left;

	padding:2px 0;

}

}

@media (max-width: 500px) {

.phone {

	width: 100%;

	float: left;

	text-align: center;

	padding: 2px 0;

}

.email {

	width: 100%;

	float: left;

	text-align: center;

	padding: 2px 0;

}

.titel {

	padding: 5px 20px;

	-webkit-transform: skew(0);

	-moz-transform: skew(0);

	-o-transform: skew(0);

	margin-left: 0;

}

.titel h2 {

	font-size: 34px;

	-webkit-transform: skew(0);

	-moz-transform: skew(0);

	-o-transform: skew(0);

}

.owl-nav {

	display: none;

}

.white_box {

	padding: 20px;

	border: 5px #ffce1c solid;

	-webkit-transform: skew(0);

	-moz-transform: skew(0);

	-o-transform: skew(0);

	margin-right: 0;

	float: left;

	width: 100%;

}

.white_box_in {

	-webkit-transform: skew(0);

	-moz-transform: skew(0);

	-o-transform: skew(0);

}

.marquee .owl-item .item {

	width: 100%;

	background: url(../images/secbgfull.jpg) no-repeat left top;

	background-size: cover;

	padding: 15px;

	margin: 0;

}

}

 @media (max-width: 520px) {
.more {
    font-size: 14px;
}

}

@media (max-width: 380px) {

.titel h2 {

	font-size: 30px;

}

}



@media(max-width:1199px) {

.portfolio_part img {

	width: 312px;

}



}

@media(max-width:991px) {

.portfolio_part img {

	width: 242px;

}

}

@media(max-width:767px) {

.magnet-item{

	width: 32%;

	margin: 0.5%;

}

}



@media(max-width:520px) {

.magnet-item{

	width:80%;

	margin:1% 10%;

}

.portfolio_part img{

	width:100%;

}

}





/****************************media quary end********************************/