@font-face {font-family: 'dosisbold'; src: url('../fonts/dosis-bold-webfont.woff2') format('woff2'), url('../fonts/dosis-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {font-family: 'dosisregular'; src: url('../fonts/dosis-regular-webfont.woff2') format('woff2'), url('../fonts/dosis-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {font-family: 'robotoregular'; src: url('../fonts/roboto-regular-webfont.woff2') format('woff2'), url('../fonts/roboto-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {font-family: 'the_girl_next_doorregular'; src: url('../fonts/thegirlnextdoor-webfont.woff2') format('woff2'), url('../fonts/thegirlnextdoor-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {font-family: 'knewaveregular'; src: url('../fonts/knewave-webfont.woff2') format('woff2'), url('../fonts/knewave-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }

body{ font-family: 'robotoregular';}

.header1{ border-bottom: 1px solid rgba(255,255,255,0.5);  position: absolute; top: 0; width: 100%; z-index: 2; padding-top: 20px; }
.logo{ float: left; position: absolute; }

.mainmenu .navbar-default{ background: none; border:0px; border-radius: 0px; font-family: 'dosisbold'; font-size: 20px; text-transform: uppercase; }
.mainmenu .navbar-default li a{ color: #fff; margin-left: 25px; padding-bottom: 27px; padding-top: 27px; position: relative; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;  }
.mainmenu .navbar-default li.active a, .mainmenu .navbar-default li a:hover, .mainmenu .navbar-default li a:focus, .mainmenu .navbar-default li.active a:hover, .mainmenu .navbar-default li.active a:focus, .mainmenu .navbar-default li.active a:focus{ background: none; color: #f58220; }
.mainmenu .navbar-default li a:after{ position: absolute; content: ''; background: #552f84; height: 4px; width: 0; bottom: -23px; left: 0; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.mainmenu .navbar-default li a:hover:after, .mainmenu .navbar-default li.active a:after{ width: 100%; }

.slider{ position: relative; }

.colorbox { position: relative; margin-top:-100px; }
.flex-container{ display: flex; display: -webkit-flex; }
.flex-box{ flex:1; -webkit-flex-1;}
.colorbox .flex-box{ flex:1; -webkit-flex-1; padding: 20px; text-align: center; color: #fff; position: relative;transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;   }
.colorbox .flex-box:nth-of-type(1){ background: #93c138; }
.colorbox .flex-box:nth-of-type(2){ background: #ed7e20; }
.colorbox .flex-box:nth-of-type(3){ background: #c01c2e; }
.colorbox .flex-box:nth-of-type(4){ background: #2889b9; }
.colorbox .flex-box h2{ font-size: 25px; text-transform: uppercase; font-family: 'dosisbold';}
.colorbox .flex-box p{ font-size: 14px; font-family: 'robotoregular'; }
.colorbox .flex-box span{ margin: 10px 0; display: inline-block; }
.colorbox .flex-box a{ text-decoration: none; color: #fff; position: relative; z-index: 4; display: block; }
 .colorbox .flex-box:after{ position: absolute; content: ''; opacity: 0; top: 0; left: 0; right: 0; bottom: 0; background:#552f84; transform:scale(0);transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;   }
.colorbox .flex-box:hover:after{opacity: 1; transform:scale(1.05); -webkit-transform:scale(1.05); z-index: 2;} 

.welcome{text-align: center; background: #fffdea; padding-bottom: 20px; }
.welcome h3{ font-family: 'knewaveregular'; font-size: 50px; color: #552f84; text-align: center; }
.welcome p{ font-size: 18px; font-family: 'dosisregular'; }
.welcome a{ border: 2px solid #fffdea; color: #552f84; display: inline-block; font-size: 16px; font-weight: bold; padding: 5px 15px; text-decoration: none; text-transform: uppercase; position: relative; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;  }
.welcome a:before{ position: absolute; content: ''; left: 1px; top: -2px; border: 2px solid #fffdea; height: 37px; width: 0; border-right: 0px; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;  }
.welcome a:after{ position: absolute; content: ''; right: 0px; top: -2px; border: 2px solid #fffdea; height: 37px; width: 0; border-left: 0px;  transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.welcome a:hover:after{ border: 2px solid #552f84; border-left: 0px;  width: 50%; }
.welcome a:hover:before{ border: 2px solid #f58220; border-right: 0px;  width: 50%; }

.trustee{ background: #552f84;   display: inline-block; padding: 20px; color: #fff; width: 100%; }
.advisor{ background: #f58220; color: #fff; padding: 20px; display: inline-block; width: 100%; }
.trusteeimg{  margin: 0 20px 0 0; text-align: center;  margin-bottom: 20px; } 
.advisorimg{  margin: 0 20px 0 0; text-align: center;  margin-bottom: 20px; } 
.trusteeimg img, .advisorimg img{ display: inline-block; }
.message h4, .vision-sec h2, .feature h2{ font-size: 18px; text-align: center;  font-family: 'dosisbold'; text-transform: uppercase; }
.message h4 { text-transform:capitalize; }
.message p{ font-size: 14px; text-align: center; padding-right: 20px; }
.message a{ color: #fff; font-style: italic; position: relative; text-decoration: none; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.message a:after{ position: absolute; content: ''; bottom: 0; width: 0; height: 1px; background: #f58220; left: 0px; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.message .trustee a:hover:after{ background: #f58220; width: 110%; }
.message .advisor a:hover:after{ background: #552f84; width: 110%; }

.programmes h2, .features h2{ text-align: center; text-transform: uppercase; color: #552f84; font-family: 'dosisregular'; }
.programmes h2 span, .features h2 span{ color: #f58220; font-family: 'dosisbold'; }
.programmes-pic{ float: left; margin-right: 30px; }
.programmes-name{ float: left; position: relative; }
.programmes-name span:nth-of-type(1){ background: #2689b9; width: 70px; height: 70px; text-align: center; line-height: 70px; display: inline-block; border-radius: 50%; color: #fff; font-size: 48px; font-family: 'knewaveregular'; }
.programmes-name span:nth-of-type(2){ color: #f58220; font-size: 30px; font-family: 'knewaveregular'; }
.programmes-name span:nth-of-type(3){ display: block; font-size: 18px; color: #552f84; padding-top: 10px; }
.programmes-name span.c2{ background: #f89939; }
.programmes-name span.c3{ background: #e71c35; }
.programmes-name span.c4{ background: #99ca3c; }
.programmes-name span.c5{ background: #fdcd08; }
.programmes-name:after{ position: absolute; content: ''; background: #2689b9; width: 2px; height: 100px; right: -20%; top: 0;}
.programmes-name.col-after:after{ background: #f89939; }
.programmes-name.col-after2:after{ background: #99ca3c; }
.programmes-name.none-after:after{ display: none;}

.features{ background: #ebeeef; padding-bottom: 20px; }
.feature-sec{ background: #2689b9; border-radius: 8px; text-align: center; color: #fff; padding: 20px 0; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.feature-sec span{ background: #fff; width: 70px; height: 70px; text-align: center; line-height: 70px; font-size:35px; border-radius: 50%;  display: inline-block; }
.feature-sec p{ font-size: 16px; font-family: 'dosisbold';  padding-top: 20px; margin-bottom: 0px; }
.owl-stage-outer{ position: relative; z-index: 2; }
.owl-carousel .owl-item img {display: inherit; width: auto; }
.owl-nav {position: absolute; top: 50%; width: 100%; margin-top: -16px; }
.owl-next{ float: right; margin-right: -40px; opacity: 0.8; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.owl-prev{ float: left; margin-left: -40px; opacity: 0.8; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.owl-prev:hover, .owl-next:hover{opacity: 1;}
.feature-sec:hover{ border-radius: 25px;  }

.footer{ background: #151515 url(../img/f-bg.png); background-position: top left; background-attachment: fixed; padding: 20px 0; position: relative; background-repeat: no-repeat; background-size: cover;}
.footer:before{position: absolute; content: ''; top: 0; left: 0; height: 4px; width: 100%;  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f58220+0,552f84+100 */
background: rgb(245,130,32); /* Old browsers */
background: -moz-linear-gradient(left, rgb(245,130,32) 0%, rgb(85,47,132) 50%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgb(245,130,32) 0%,rgb(85,47,132) 50%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgb(245,130,32) 0%,rgb(85,47,132) 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f58220', endColorstr='#552f84',GradientType=1 ); /* IE6-9 */}
blockquote{ color: #fff; font-size: 14px; border: 0px; position: relative; }
blockquote:after{position: absolute; content: ''; bottom: 10px; left: 22px; height: 2px; width: 50px; background: rgba(255,255,255,0.2); }
blockquote:before{position: absolute; content: ''; top: 10px; left: 22px; height: 2px; width: 50px; background: rgba(255,255,255,0.2); }
blockquote p{border:2px solid rgba(255,255,255,0.2); border-bottom: 0px; border-top: 0px; padding: 15px 0; position: relative; }
blockquote p:after{position: absolute; content: ''; bottom: 0px; right: 0px; height: 2px; width: 50px; background: rgba(255,255,255,0.2); }
blockquote p:before{position: absolute; content: ''; top: 0px; right: 0px; height: 2px; width: 50px; background: rgba(255,255,255,0.2); }
.footer-nav a{ display: block; color: #d1d1d1; text-decoration: none; line-height: 30px; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.footer-nav a:hover, .footer-sec a:hover, .copyrights a:hover{ color: #f58220; }
.footer-sec p, .footer-sec a, .copyrights a{ color: #d1d1d1; text-decoration: none; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.social{ margin-top: 80px; text-align: center; }
.social a{ width: 35px; height: 35px; border-radius: 50%; text-align: center; line-height: 35px; color:#fff; display: inline-block; margin-right: 10px; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; position: relative;  }
.social a:after{border-radius: 50%; box-shadow: 0 0 0 4px rgba(255,255,255,0); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.social a:nth-of-type(1){ background: #3b5998; }
.social a:nth-of-type(2){ background: #55acee; }
.social a:nth-of-type(3){ background: #007ab9; }
.social a:nth-of-type(4){ background: #dc4e41; }
.social a:hover{ background:#f58220;  }
.social a:hover:after{  -webkit-animation: socialicon 2s infinite; /* Safari 4+ */  -moz-animation: socialicon 2s infinite; /* Fx 5+ */ -o-animation: socialicon 2s infinite; /* Opera 12+ */  animation: socialicon 2s infinite; /* IE 10+, Fx 29+ */}
@-webkit-keyframes socialicon {0%   { box-shadow: 0 0 0 0px rgba(0,0,0,0); } 75% { opacity: 0; box-shadow: 0 0 0 10px #fff; } 100% { opacity: 0; } }
@-moz-keyframes socialicon {0%   { box-shadow: 0 0 0 0px rgba(0,0,0,0); } 75% { opacity: 0; box-shadow: 0 0 0 10px #fff; } 100% { opacity: 0; } }
@-o-keyframes socialicon {0%   { box-shadow: 0 0 0 0px rgba(0,0,0,0); } 75% { opacity: 0; box-shadow: 0 0 0 10px #fff; } 100% { opacity: 0; } }
@keyframes socialicon {0%   { box-shadow: 0 0 0 0px rgba(0,0,0,0); } 75% { opacity: 0; box-shadow: 0 0 0 10px #fff; } 100% { opacity: 0; } }

.copyrights{ border-top: 1px solid rgba(255,255,255,0.4); margin: 20px 0 0; padding: 10px 0 0;}
.copyrights p{ margin-bottom: 0px; color: #d1d1d1; }
.life-logo{ float: right; }

.innerslider{ background: url(../img/innerheader.jpg) no-repeat; background-position: center center; background-size: cover; position: relative;}
.innerslider:after{ position: absolute; content: ''; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0,0,0,0.3); }
.innerslider h1{ padding: 150px 0 50px; text-align: center; color: #fff; margin: 0px; font-family: 'dosisbold'; font-size: 50px; position: relative; z-index: 1; }
.content{margin: 40px 0;}
.content p{line-height: 25px;}
.vision-sec{ background:url(../img/vision-bg.jpg) no-repeat; background-position: bottom center; background-size: 100%; padding: 25px;  position: relative;  }
.vision-sec:after{ position: absolute; content: ''; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.2); }
.vision-sec h2{ color: #f58221; padding: 0px; margin: 0px 0 10px; border-bottom: 2px solid rgba(0,0,0,0.2); padding-bottom: 5px;}
.vision-sec p, .vision-sec ul li{ text-align: justify; line-height: 24px; }
.list-group li {list-style: none; padding: 0; margin: 0 0 20px; }
.vision, .mission{ background: #def2fd; padding: 20px 20px 10px; position: relative; z-index: 2; }
p.caption{ font-size: 16px; line-height: 28px; text-align: center; padding: 0 50px;}
p.caption b{ color: #f58221; }
.fa-bullseye{ color: #552f84; font-size: 20px;}
.feature h2{ background: #552f84; color: #fff;  padding: 5px 15px; font-size: 20px; margin: 0px 0 10px; display: inline-block; }
.feature ul { list-style: none; padding: 0; margin: 0; }
.feature ul li {border-bottom: 1px solid rgba(0, 0, 0, 0.05); font-size: 16px; line-height: 24px; margin-bottom: 10px; padding-bottom: 10px; padding-left: 15px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; position: relative; }
.feature ul li:after{ position: absolute; content: ''; top: 50%; margin-top: -7px; left: 0; background:#552f84; width: 5px; height: 5px; }
.feature ul li:hover{ color: #f58221; }
.salient-feature{ margin-top: 40px; }
.salient-feature img{ display: inline-block; }
.p-s{ border:1px solid rgba(0,0,0,0.05); padding: 20px; display: inline-block; background: rgba(0,0,0,0.01); transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
.p-s .programmes-name span:nth-of-type(1){ color: #333; background: #fff; }
.p-s .programmes-name span:nth-of-type(2), .p-s .programmes-name span:nth-of-type(3){ color: #fff; }
.col-sm-4:nth-of-type(1) .p-s { background: #2689b9;}
.col-sm-4:nth-of-type(2) .p-s { background: #f89939;}
.col-sm-4:nth-of-type(3) .p-s { background: #e71c35;}
.col-sm-4:nth-of-type(2) .p-s.ps1 { background: #99ca3c;}
.col-sm-4:nth-of-type(3) .p-s.ps2 { background: #fdcd08;}
.col-sm-4 .p-s:hover, .col-sm-4 .p-s.ps1:hover, .col-sm-4 .p-s.ps2:hover{transform: skewX(5deg); background: #552f84; }

.address{ background: #552f84; padding:25px; display: inline-block; text-align: center; color: #fff;}
.fa-map-marker, .fa-envelope{ font-size: 50px; display: block; color: #fff; text-align: center; }
.address p{text-align: center;}
.address a.mail{ color: #fff; text-decoration: none; font-style: inherit !important; }
.address a.mail:hover{ color: #f58220;}
.address hr{ border-color:rgba(255,255,255,0.25)}
.address a.mail:hover::after{ width: 100%;}

#map{ width: 100%; height: 450px; display: block; }
.trustee.map{padding: 0px; float: left; }
#firstHeading { color: #552f84; font-size: 18px; text-transform: uppercase; }
#bodyContent{ color: #552f84; }
.contactform{ padding: 17px 100px; padding-left: 40px;}
.contactform legend{ font-size: 25px; color: #fff; font-family: 'dosisbold'; }
.contactform input, .contactform textarea{border-radius: 0px; border:0px; }
.btn-primary {background-color: #552f84; border-color: #552f84; color: #fff; }
.btn-primary:hover {background-color: #333; border-color: #333; color: #fff; }

.salient-features{ background:#c5ddf1 url(../img/sf.png); font-family: 'dosisbold'; }
h2.sf {background: #1e8aa3 none repeat scroll 0 0; color: #fff; display: inline-block; font-size: 40px; margin:190px 0 0;text-align: center; position: relative; vertical-align: middle; width: 100%; padding: 40px 0; text-transform: uppercase; }
h2.sf:after{ position: absolute; content: ''; right: -30px; height: 1px; width: 30px; background: #fff; top: 50%; }
ul.s-feature{margin: 20px 0 ; padding: 0 20px; position: relative; }
ul.s-feature li {display: block; font-size: 15px; line-height: 15px; padding: 8px; position: relative; color: #fff; font-family: 'dosisregular'; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s; }
ul.s-feature li:before{position: absolute; content: ''; left: -20px; height: 1px; width: 20px; background: #fff; top: 50%; }
.sfline{position: relative; border-left:1px solid #fff; }

ul.s-feature li:nth-of-type(1){background: #E27A3F; }
ul.s-feature li:nth-of-type(2){background: #FD7400; }
ul.s-feature li:nth-of-type(3){background: #FFE11A; color: #333; }
ul.s-feature li:nth-of-type(4){background: #BEDB39; color: #333; }
ul.s-feature li:nth-of-type(5){background: #FFF0A5; color: #333; }
ul.s-feature li:nth-of-type(6){background: #FFB03B; color: #333; }
ul.s-feature li:nth-of-type(7){background: #FF530D; }
ul.s-feature li:nth-of-type(8){background: #BDD4DE; color: #333; }
ul.s-feature li:nth-of-type(9){background: #EFC94C; color: #333; }
ul.s-feature li:nth-of-type(10){background: #E27A3F; }
ul.s-feature li:nth-of-type(11){background: #DF5A49; }
ul.s-feature li:nth-of-type(12){background: #45B29D; }
ul.s-feature li:hover{ background: #fff; color: #333; }

.purpose{ display: flex; display: -webkit-flex; }
.purpose div {flex: 1 1 0; -webkit-flex: 1 1 0; font-size: 15px; margin: 0 10px 10px 0; border-radius: 0px; }
.purpose .btn{ white-space: inherit; }
.purpose div em{font-size: 25px; font-weight: bold; font-style: inherit; }
.fa-file-pdf-o{ color: #dd0604; }
.download{min-height: 300px; }
.download a{text-decoration: none; outline: none; }
.download h3{ padding: 15px; display: block; color: #fff; background: #552f84; transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;}
.download h3 a{ color: #fff;  display: block; }
.download h3:hover{ background: #f58220; }