/*  */


/* -------------------------------- */
/* BASIC SETUP */
/* -------------------------------- */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body  {
    background-color: #fff;
    color: #904b9b;
    font-family: 'Lato', 'Arial', sans-serif;
    font-weight: 300;
    font-size: 20px;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

/*.clearfix {zoom: 1}
.clearfix:after {
    content: '.';
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

/* -------------------------------- */
/* REUSABLE COMPONENTS */
/* -------------------------------- */

.row{
    max-width: 1140px;
    margin: 0 auto;
}

.cover{
    max-width: 1140px;
    margin: 0 auto;
}



section{
    padding: 80px 0;
}

.box {
    padding: 1%;
}

/*-----------HEADINGS-------------*/

h1, 
h2 {
    font-weight: 300;
    text-transform: uppercase;
   
}

h1 {
    margin-top: 0;
    margin-bottom: 20px;
    color: #fff;
    font-size: 120%;
	font-weight: 300;
    word-spacing: 4px;
    letter-spacing: 1px;
}

h2 {
    font-size: 180%;
    word-spacing: 2px;
    text-align: center;
    margin-bottom: 30px;
    letter-spacing: 1px;
}

h3 {
	text-align: center;
    font-size: 130%;
    margin-bottom: 15px;
    color: #7b0a7b;
}

h2:after {
    display: block;
    height: 2px;
    background-color:#6e15c7;
    content: " ";
    width: 500px;
    margin: 0 auto;
    margin-top: 30px;
}

/* -------------------------------- */
/* BACKGROUND IMAGE SLIDESHOW */
/* -------------------------------- */



/* -------------------------------- */
/* PARAGRAPH */
/* -------------------------------- */

.long-copy {
    line-height: 145%;
    width: 65%;
    margin-left: 15%;
    text-align: center;
}

.long-copy-align-left  {
    line-height: 145%;
    width: 65%;
    color: #64696d;
    margin-left: 15%;
    text-align: left;
}

.long-copy-align-justfied {
    line-height: 145%;
    width: 90%;
    color: #64696d;
    margin-left: 5%;
    margin-right: 5%;
    text-align: justify;
}



.long-copy-align-left-white  {
    line-height: 145%;
    width: 65%;
    color: #ffffff;
    margin-left: 15%;
    text-align: left;
}

.long-copy-align-justified-white  {
    line-height: 145%;
    width: 90%;
    color: #ffffff;
    margin-left: 5%;
    margin-right: 5%;
    text-align: justify;
}



.long-copy-rss {
    width: 200%;
	margin-left: -50%;
	margin-bottom: 30px;	
    text-align: center;
}

.box p {
    font-size: 90%;
    line-height: 145%;
}



/*-----------ICONS-------------*/

/*.icon-big {
    font-size: 350%;
    display: block;
    color: #e67e22;
    margin-bottom: 10px;
}

.icon-small {
    display: inline-block;
    width: 30px;
    text-align: center;
    color: #e67e22;
    font-size: 120%;
    margin-right: 10px;
    
    /*secrets to align text and icons
    line-height: 120%;
    vertical-align: middle;
    margin-top: -5px;*/
    
}*/

/*-----------LINKS-------------*/

a:link,
a:visited {
    color: #9ff4ff;
    text-decoration: none;
    padding-bottom: 1px;
    border-bottom: 1px solid #9306c7;
    transition: border-bottom 0.2s, colour 0.2s;
}

a:hover,
a:active {
    color: #86ffd0;
    border-bottom: 1px solid transparent;
}

/*-----------BUTTONS-------------*/
/*.btn:link, 
.btn:visited,
input[type=submit] {
    display: inline-block;
    padding: 10px 30px;
    font-weight: 300;
    text-decoration: none;
    border-radius: 200px;
    transition: background-color 0.2s, border 0.2s, color 0.2s;
}

*/

a {
    color: #ff8bbc;
}

/* -------------------------------- */
/* HEADER */
/* -------------------------------- */


header{
background-image: ('../img/IMG_0222.jpg'); /* fallback for old browsers */
background-image: -webkit-linear-gradient(to left, rgba(216, 67, 181, 0.72) , rgba(5, 9, 62, 0.66)), url(../img/IMG_0222.jpg); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, rgba(110, 65, 232, 0.85) , rgba(239, 79, 79, 0.78)), url(../img/IMG_0222.jpg); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background-size: cover;
    background-position: center;
    height: 100vh;
}
/*

#cf {
   background-size: cover;
    background-position: center;
    height: 100vh;
  margin:0 auto;
}

#cf img {
   background-size: cover;
    background-position: center;
    height: 100vh;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

 @keyframes cf3FadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

#cf3 img.top {
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 8s;
animation-direction: alternate;
}

*/

/* -------------------------------- */
/* HEADER */
/* -------------------------------- */


.logo {
    height: 120px;
    width: auto;
    margin-top: 20px;
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.logo-color {
    margin-top: 8px;
    height: 30px;
    width: auto;
	float: left;
    margin: 15px 25px;
}

.logo-white {
    height: 50px;
    width: auto;
    margin: 8px 0;
}

.logo-color { display: none; }

.project-logos {
    width: 30%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.project-logos {
    text-align:center;
}

.project-logos-inline {
    width: 20%;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.hero-text-box{
    position: absolute;
    width: 740px;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.main-nav {
    float: none;
    list-style: none;
	text-align: center;
}

.main-nav li {
    display: inline-block;
    margin-left: 20px;
    margin-top: 55px;
	text-align: center;
}

.main-nav li a:link,
.main-nav li a:visited {
    padding: 10px 15px;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 80%;
    border-bottom: 2px solid transparent;
    transition: border-bottom 0.2s;
}

.main-nav li a:hover,
.main-nav li a:active {
    border-bottom: 2px solid #8a04a2;
}



/*  Mobile navi  */
.mobile-nav-icon {
    float: right;
    margin-top: 20px;
    cursor: pointer;
    display: none;
}

.mobile-nav-icon i {
    font-size: 160%;
    color: #ffffff;
}



/* -------------------------------- */
/* STICKY NAVIGATION */
/* -------------------------------- */


.sticky {
	position: fixed; 
	top: 0;
	left: 0;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.85);
	z-index: 2;
}

.sticky .main-nav li a:link,
.sticky .main-nav li a:visited {
    padding: 2px 0px;
    color: #90008a;
	z-index: 2;
}

.sticky .main-nav li {
    margin-top: 15px;
	margin-bottom: 15px; 
	z-index: 2;
}

.sticky li {
    display: inline-block;
    margin-left: 10px;
    margin-top: 55px;
}


.sticky .logo { display: none; }
.sticky .logo-color { display: block; }



/* -------------------------------- */
/* SOCIAL LINKS */
/* -------------------------------- */


.social-links {
    list-style: none;
    float: none;
    position: absolute;
    width: 1140px;
    top: 55%;
    left: 50%;
    transform: translate(-15%, 70%);
}



.social-links li {
    display: inline-block;
    margin-right: 30px;
}



.social-links li a:link,
.social-links li a:visited {
    text-decoration: none;
    border: 0;
    color: #ffffff;
    transition: 0.2s;
    
}

.social-links li a:link,
.social-links li a:visited {
    font-size: 400%;
}

.ion-social-facebook,
.ion-social-twitter,
.ion-social-googleplus,
.ion-social-instagram
.ion-social-youtube {
    transition: 0.2s;
}


.ion-social-facebook:hover {
    color: #3b5998;
}

.ion-social-twitter:hover {
    color: #00aced;
}

.ion-social-googleplus:hover {
    color: #dd4b39;
}

.ion-social-instagram:hover {
    color: #517fa4;
}

.ion-social-youtube:hover {
    color: #bb0000;
}

/*a.twitter-timeline {
  /* Buttonish 
  display: block;
  padding: 6px 12px 6px 30px;
  margin: 10px 0;
  border: #ccc solid 1px;
  border-radius: 3px;
  background: rgba(248, 248, 248, 0.19);
  background-size: 1em 1em;

  /* Text
  font: normal 12px/18px Lato, Arial, sans-serif;
  color: #ffffff;
  white-space: nowrap;
}

a.twitter-timeline:hover,
a.twitter-timeline:focus {
  background-color: #dedede;
}

/* Color Highlight for keyboard navigation

a.twitter-timeline:focus {
  outline: none;
  border-color: #0089cb;

/* -------------------------------- */
/* ABOUT */
/* -------------------------------- */
.section-about {
	background: linear-gradient(to bottom, rgba(239, 252, 246, 0.87) , rgba(228, 238, 248, 0.88))
}

.span-1-of-3-inset {
	width: 30%;
	margin-left: 25px;
}



blockquote-about {
    padding: 1%;
    font-style: normal;
	font-size: 80%;
    line-height: 155%;
    position: relative;
	margin: 50px;
      display: inline-block;
    margin-right: 20px;
}


blockquote-about-centred {
	margin-left: 20px;
}

.structure {
    width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.governance {
    width: 30%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* -------------------------------- */
/* RSS FEEDWIND WIDGET */
/* --------------------------------
.rss-links {
    list-style: none;
    float: left;
    position: absolute;
    width: 1140px;
	background-color: rgba(255, 255, 255, 0.53);
	@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,300italic" rel="stylesheet" type="text/css");
}


iframe {
  margin-top: 20px;
  margin-bottom: 30px;
}


* -------------------------------- */
/* RSS FEEDWIND WIDGET */
/* --------------------------------
.rss-links {
    list-style: none;
    float: left;
    position: absolute;
    width: 1140px;
	@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,300italic" rel="stylesheet" type="text/css");
	
}



/* /* This adds the ability to utilize Google WebFonts in your FeedWind widget
@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,300italic" rel="stylesheet" type="text/css");

/* This is the styling for main feed container - NOTE: the background-color affects the footer background
.fw-container {
 text-align: left;
 padding: 5px;
 font-family: 'Lato', Helvetica, sans-serif;
 border: 1px solid #0E4FAE;
 border-radius: 4px;
 box-sizing: border-box;
 background-color:rgba(255, 255, 255, 0.55);
}

/* This is the styling for the header container
.feed-header {
 margin: 8px 200px 8px 200px;
 color: #fff;
 font-size: 1px;
 background-color: rgba(255, 255, 255, 0.55);
 background-repeat: repeat-x;
}

a.fw-feed-item-url {
 text-decoration: none;
}

.fw-feed-item {
 display:block;
 }

/* This is the styling for the main Feed Title in the header container
.fw-feed-title {
 margin: 10px 20px 10px 20px;
 font-weight: bold;
 text-align: center;
 text-shadow: 2px 1px 0px #000080;
 display:block;
}

/* This is the styling for the Feed Title link in the header container
.fw-feed-title a:link {
 color: #fef;
 text-decoration: none;
}

/* This is the styling for a "visited" Feed Title link in the header container
.fw-feed-title a:visited {
 color: #ddd;
 text-decoration: none;
}

/* This is the styling for a Feed Title link on "mouseover" (also known as "hover") in the header container
.fw-feed-title a:hover {
 color: #ffdd6a;
 text-decoration: none;
}

/* This is the styling for an "active" Feed Title link in the header container
.fw-feed-title a:active {
 color: #9f0074;
 text-decoration: none;
}

/* This is the styling for the feed body (i.e all Feed Items) container. */
/* WARNING: be careful adding Left or Right Padding as you can lose the scrollbar when the L/R padding is set to more than 8px; the scrollwheel on a mouse still works however, but the scrollbar can disappear after 8px of padding either side. Use Margins instead add space around the content container.*/


/* This is the styling for the Feed Item content in the body container*/
/*.fw-feed-item-content-module {
 margin: 10px;
 height: 70px;
 width: 200;
 padding: 8px;
 border-bottom: 2px solid #bbceeb;
 box-shadow: 0px 1px 1px #222;
 background-color: rgba(247, 247, 247, 0.55);
}

/* This is the styling for the Feed Item Title in the body container*/
/*.fw-feed-item-title {
 display:block; 
}

/* This is the styling for an "unvisited/unclicked" Feed Item Title link in the body container*/
/*.fw-feed-item-title a:link{
 margin: 20px 0 10px 0px!important;
 color: #9f0074;
 text-decoration: none;
 font-size: 14px;
}

/* This is the styling for a "visited/clicked" Feed Item Title link in the body container*/
/*.fw-feed-item-title a:visited{
 color: #39f;
 padding: 20px 0 0 0;
 text-decoration: none;
}

/* This is the styling for a Feed Item Title link on "mouseover" (also known as "hover") in the body container*/
/*.fw-feed-item-title a:hover{
 color: #39c;
 text-decoration: none;
 padding: 20px 0 0 0;
}

/* This is the styling for an active Feed Item Title link in the body container*/
/*.fw-feed-item-title a:active{
 color: #09f;
 text-decoration: none;
 padding: 20px 0 0 0;
}

/* This is the styling affecting a Feed Item Date for a feed item in the body container*/
/*.fw-feed-item-date {
 display:block;
 margin: 0 20px 0 3px;
 padding: 0 2px 0 3px;
 color: #999;
 font-size: 10px;
 text-align: right;
}

/* This is the styling affecting a Feed Item Description, Thumbnail or Video Player link for a feed item in the body container*/
/*.fw-feed-item-link {
 margin: 0 0 0 3px;
 padding: 0 2px 0 3px;
 color: red;
 text-decoration:none;
 }
/* This is the styling affecting an "unvisited/unclicked" Feed Item anchor for a feed item in the body container*/
/*.fw-feed-item-link a{
 color: #123456;
 text-decoration: none;
}

/* This is the styling affecting an "unvisited/unclicked" Feed Item Link anchor for a feed item in the body container*/
/*.fw-feed-item-link a:link{
 color: #666666;
 text-decoration: none;
}

/* This is the styling affecting an "visited/clicked" Feed Item Link anchor for a feed item in the body container*/
/*.fw-feed-item-link a:visited{
 color: #666666;
 text-decoration: none;
}

/* This is the styling for a Feed Item Title Link Anchor on "mouseover" (also known as "hover") for a feed item in the body container*/
/*.fw-feed-item-link a:hover{
 color: #666666;
 text-decoration: none;
}

/* This is the styling affecting an "active" Feed Item Link anchor for a feed item in the body container*/
/*.fw-feed-item-link a:active{
 color: #666666;
 text-decoration: none;
}

/* This is the styling for the Description in a Feed Item (i.e. the text of a Feed Item in Thumbnail mode, or text+images in Full HTML mode)*/
/*.fw-feed-item-description {
 font-size: 12px;
 text-align: left;
 margin: 10px;
 color: #666;
 font-weight: 300;
 word-wrap: break-word;
 text-decoration:none;
 display:block;
}

/* This is the styling for a Feed Item Thumbnail - Thumbnail size and layout/orientation can be set here. This does not affect a YouTube video thumbnail.*/
/*.fw-feed-item-image {
 width: 150px;
 height: 120px;
 float: left;
 text-align: left;
 margin: 10px 10px 10px 10px;
}

.fw-feed-item-image-module {
 margin: 0px 20px 20px 20px;
}

/* This styling allows you to create a footer and style it. By default the footer size is set to zero. */
/*.fw-branding {
 height: 32px;
 background-color: rgba(247, 247, 247, 0.55);
} 

/* These control the scrollbar and scrollbar background colors */
/* NOTE: the ! important tag is used here to override any other CSS controlling the scrollbar appearance */
/* .jspTrack{background: #aec5e8 !important;} */
/* Adjust vertical scroll bar dimension (width)*/
/* .jspVerticalBar {width: 63px !important;} */
/* Change the attributes of the scrollbar background */
 /* .jspDrag{background: #4e82d0!important;} */
/*Note: It is not possible to use every CSS command in a FeedWind custom CSS. For example, -repeat commands for wrapper images in the header are not supported. We cannot cover every eventuality as there are so many potentially available CSS operators and parameter combinations. Usually, the easiest way to find out if your CSS works with FeedWind is by adding a new item into the CSS and refreshing your web page to see how it appears.-------------------------------- */

/* -------------------------------- */
/* COVER IMAGES */
/* -------------------------------- */

.volunteer-cover {
background-image: url('../img/DSC05844.jpg'); /* fallback for old browsers */
background-image: -webkit-linear-gradient(to left, rgba(216, 67, 181, 0.88) , rgba(5, 9, 62, 0.96)), url(img/DSC05844.jpg); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, rgba(203, 53, 139, 0.78) , rgba(146, 173, 138, 0.71)), url(../img/DSC05844.jpg); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background-size: cover;
    background-position: center;
    height: 100vh;
}


/* -------------------------------- */
/* PROGRAMMES */
/* -------------------------------- */
.section-programmes {
    margin-bottom: 30px;
	background: linear-gradient(to bottom, rgba(244, 234, 245, 0.87) , rgba(255, 255, 255, 0.69))
}

.YWT {
 background-color: rgba(184, 230, 173, 0.2);
    padding: 10px 10px;
}


.Outreach {
 background-color: rgba(173, 216, 230, 0.2);
    padding: 10px 10px;
}


.Arts {
 background-color: rgba(230, 223, 173, 0.2);
    padding: 10px 10px;
}


.Youth-Projects  {
background-color: rgba(78, 195, 199, 0.2);
    padding: 10px 10px;
}

.Interagency {
 background-color: rgba(230, 175, 173, 0.2);
    padding: 10px 10px;
}


.Employment {
 background-color: rgba(215, 173, 230, 0.2);
    padding: 10px 10px;
}


.Health {
 background-color: rgba(157, 149, 244, 0.2);
    padding: 10px 10px;
}

.Prog-imgs{
    padding: 30px;
    width: 65%;
}

/* -------------------------------- */
/* FEATURES */
/* -------------------------------- */
.section-features {
    margin-bottom: 30px;
}

.long-copy {
    margin-bottom: 30px;
}

/*.section-features {
    background-color: rgba(146, 0, 159, 0.46);
} */

/*




/* -------------------------------- */
/* FACILITIES */
/* -------------------------------- */
/*.section-testimonials {
    background-image: linear-gradient(rgba(221, 10, 10, 0.8), rgba(0, 0, 0, 0.8)), url(img/back-customers.jpg);
    background-size: cover;
    color: #fff;
    background-attachment: fixed;
}*/

.section-facilities {
    margin-top: 40px;
    padding: 50;
	background: linear-gradient(to bottom, rgba(255, 254, 242, 0.62) , rgba(237, 237, 237, 0.96))
}

.facilities-showcase {
    list-style: none;
    width: 100%;
}

.facilities-showcase li {
    display: block;
    float: left;
    width: 25%;
}

.facilities-photo {
    width: 100%;
    margin: 0;
    overflow: hidden;
    background-color: #000;
}

.facilities-photo img {
    opacity: 0.7;
    width: 100%;
    height: auto;
    transform: scale(1.15);
    transition: transform 0.5s, opacity 0.5s;
}

.facilities-photo img:hover {
    transform: scale(1.05);
    opacity: 1;
} */

/* -------------------------------- */
/* TRAINING & DEVELOPMENT */
/* -------------------------------- */
 

.section-training {
}

.section-training {
    background-image: url('../img/Training.png'); /* fallback for old browsers */
    background-image: -webkit-linear-gradient(rgba(199, 14, 255, 0.65), rgba(0, 0, 0, 0.9)), url('../img/Training.png'); /* Chrome 10-25, Safari 5.1-6 */
   	background-image: linear-gradient(rgba(199, 14, 255, 0.65), rgba(0, 0, 0, 0.9)), url('../img/Training.png');
    background-size: cover;
    color: #fff;
    background-attachment: absolute;

}

/*
.steps-box:first-child {
    text-align: right;
    padding-right: 3%;
    margin-top: 30px;
}

.steps-box:last-child {
    padding-left: 3%;
    margin-top: 70px;
}

.app-screen {
    width: 40%;
}

.works-step {
    margin-bottom: 50px;
}

.works-step: last-of-type {
    margin-bottom: 80px;
}

.works-step div {
    color: #e67e22;
    border: 2px solid #e67e22;
    display: inline-block;
    border-radius: 50%;
    height: 55px;
    width: 55px;
    text-align: center;
    padding: 5px;
    float: left;
    font-size: 150%;
    margin-right: 25px;
}

.btn-app:link,
.btn-app:visited {
    border: 0;
}

.btn-app img {
    height: 50px;
    width: auto;
    margin-right: 10px;
}


/* -------------------------------- */
/* GALLERY */
/* -------------------------------- */

.box img {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

.section-gallery {
    margin-bottom: 45px;
	background: linear-gradient(to bottom, rgb(229, 252, 252) , rgb(255, 255, 255))
	
}


/* -------------------------------- */
/* VOLUNTEERING */
/* -------------------------------- */

.section-volunteering {
    background-image: url('../img/DSC05844.jpg'); /* fallback for old browsers */
    background-image: -webkit-linear-gradient(rgb(0, 0, 0), rgba(192, 199, 130, 0.4)), url('../img/DSC05844.jpg'); /* Chrome 10-25, Safari 5.1-6 */
    background-image: linear-gradient(rgb(0, 0, 0), rgba(192, 199, 130, 0.4)), url('../img/DSC05844.jpg');
    background-size: cover;
    color: #fff;
    background-attachment: absolute;
	width:100%;
}

blockquote {
    padding: 1%;
    font-style: italic;
    line-height: 145%;
    position: relative;
    margin: 20px;
}

blockquote:before {
    content: "\201C";
    font-size: 500%;
    display: block;
    position: absolute;
    top: -5px;
    left: -5px;
}

cite {
    font-size: 90%;
    margin-top: 25px;
    display: block;
}


cite img {
    height: 45px;
    border-radius: 50%;
    margin-right: 10px;
    vertical-align: middle;
}


/* -------------------------------- */
/* ADVOCACY */
/* -------------------------------- */

.section-advocacy {
    background-image: linear-gradient(rgba(0, 134, 217, 0.81), rgba(10, 0, 0, 0.78)), url('../img/IMG_8620.jpg');
 background-size: cover;
    color: #fff;
    background-attachment: absolute;
}

   

/*.advocacy-box {
    background-color: #fff;
    border-radius: 5px;
    width: 90%;
    margin-left: 5%;
    box-shadow: 0 2px 2px #efefef;
}

.advocacy-box div {
    padding: 15px;
    border-bottom:2px solid #e8e8e8;
}

.advocacy-box div:first-child {
    background-color: #fcfcfc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;    
}

.advocacy-box div:last-child {
    text-align: center;
    border: 0;
}

.advocacy-price {
    font-size: 300%;
    margin-bottom: 10px;
    font-weight: 100;
    color: #e67e22;
}


/* -------------------------------- */
/* FORM */
/* -------------------------------- */

/*
.contact-form {
    width: 60%;
    margin: 0 auto;
}

input[type=text], 
input[type=email],
select,
textarea {
    width: 70%;
    padding: 7px;
    border-radius: 3px;
    border: 1px solid #ccc;
}

textarea {
    height: 100px;
}


input[type=checkbox] {
    margin: 10px 5px 10px 0;
}

*:focus {outline: none;}

/* -------------------------------- */
/* FOOTER */
/* -------------------------------- */

div.footer {
        position:absolute;
        bottom:0px;
    }


footer {
    background-image: linear-gradient(rgb(0, 0, 0), rgba(83, 0, 80, 0.62));
    background-color: rgba(80, 0, 49, 0.97);
    padding: 100px;
    font-size: 90%;
    text-align: center;
	display: block;
    color: rgba(200, 208, 214, 0.67);
}

.footer-nav {
    list-style: none;
    float: left;
}


.logo-white-footer{
    text-align: center;
    transform: scale(15%);
}

.logo-white-footer {
    height: 60px;
    display: inline-block;
    width: auto;
    margin: 10px 20px;
}

/*.social-links {
    list-style: none;
    float: right;
}

.footer-nav li,
.social-links li {
    display: inline-block;
    margin-right: 20px;
}


.footer-nav li:last-child,
.social-links li:last-child {
    display: inline-block;
    margin-right: 20px;
}

.footer-nav li a:link,
.footer-nav li a:visited,
.social-links li a:link,
.social-links li a:visited {
    text-decoration: none;
    border: 0;
    color: #888;
    transition: 0.2s;
    
}

.footer-nav li a:hover,
.footer-nav li a:active {
    color: #ddd;
}

.social-links li a:link,
.social-links li a:visited {
    font-size: 160%;
}

.ion-social-facebook,
.ion-social-twitter,
.ion-social-googleplus,
.ion-social-instagram {
    transition: 0.2s;
}


.ion-social-facebook:hover {
    color: #3b5998;
}

.ion-social-twitter:hover {
    color: #00aced;
}

.ion-social-googleplus:hover {
    color: #dd4b39;
}

.ion-social-instagram:hover {
    color: #517fa4;
}


footer p {
    color: #888;
    text-align: center;
    font-size: 90%;
    margin-top: 20px;
}