/*
Theme Name: Niwro
Theme URI: http://www.brandified.co.uk/blank
Author: Brandified
Author URI: http://brandified.co.uk
Description: Custom blank theme
Version: 6.0
*/


/* Styles */


body {
	font-family: 'Muli', sans-serif;
	font-size: 18px;
	line-height: 1.4em;
	background: #fff;
	color: #29297C;
	padding: 0;
	margin: 0;
}


h1, h2, h3, h4, h5, h6 {
	font-family: verveine, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-weight: 700;
}

h1 {
	font-size: 50px;
	line-height: 1.1em;
}

p {
	margin-bottom: 20px;
	line-height: 1.5em;
}

strong {
	font-weight: 700;
}

a {
	color: #EDA4BA;
}

a:hover {
	color: #EDA4BA;
}

a.button {
	display: block;
	background: #F0BC41;
	color: #0F4936;
	text-decoration: none;
	padding: 15px 20px;
	border-radius: 15px;
	margin-top: 30px;
	margin-bottom: 30px;
}


a.fancybutton {
		display: block;
		background: #fff;
		color: #0F4936;
		font-weight: bold;
		text-decoration: none;
		padding: 20px 20px;
		border-radius: 15px;
		margin-top: 30px;
		margin-bottom: 30px;
		text-align: left;
		padding-left: 90px;
		background-position: left 20px center;
		background-repeat: no-repeat;
		background-size: 40px auto;
	}
	
	a.fancybutton span {
			opacity: 0.6;
			font-weight: normal;
		}


a.iaithtoggle {
	border-radius: 100px;
	padding: 15px 20px;
	border: 2px solid #fff;
	background: #ED09C5;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	position: fixed;
	top: 20px;
	right: 20px;
}

/* Structure */

#page {
	display: block;
}
#primary {
	
}
#content {
}

#colophon {
	clear: both;
	display: block;
	width: 100%;
}

/* Columns */

* {
    box-sizing: border-box;
}


[class*="col-"] {
    float: left;
    padding: 15px;
    /* border: 1px dashed #777777; */
}


.row::after {
    content: "";
    clear: both;
    display: table;
}

@media only screen and (min-width: 600px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}

.col-centered {
	margin-left: auto !important; 
	margin-right: auto !important; 
	float: none !important; 
	padding: 0px !important;
}

.width1100 {
	width: 100%;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}


.width700 {
	width: 100%;
	max-width: 640px;
	float: left;
	padding-right: 60px;
}

.width400 {
	width: 100%;
	max-width: 400px;
	float: left;
}


.fullwidth {
	float: left;
	width: 100%;
}


/* Re-usable Structure Classes */


/* Alignment */
.alignleft {
	display: inline;
	float: left;
}
.alignright {
	display: inline;
	float: right;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}


/* Header */

#site-title {
	font-size: 30px;
	font-weight: bold;
}

#site-title a {
	color: #fff;
}

#site-description {
	font-size: 1em;
	font-weight: normal;
	margin: 0 0 1em;
}

#header-wrap {
	background: #999999;
	margin-bottom: 40px;
	height: 100vh;
	min-height: 500px;
}

#header-top {
	float: left;
	width: 100%;
	margin-top: 0px;
}

#header-wrap h1.header-title {
	font-weight: 600;
	font-size: 46px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	color: #fff;
	line-height: 1.2em;
}

#header-title {
	float: left;
	margin-top: 35vh;
}

#logo {
	width: 100%;
	max-width: 300px;
	float: left;
}

/* Menu */

#nav-wrap {
	
}

#nav {
	overflow: hidden;
	display: inline-block;
	float: right;
}
#nav ul {
	list-style: none;
	display: inline-block;
	float: right;
}
#nav li {
	float: left;
	position: relative;
}
#nav a {
	display: block;
	line-height: 2em;
	padding: 0 1em;
	font-size: 19px;
	font-weight: 500;
	text-decoration: none;
	color: #fff;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}
#nav ul ul {
	box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	display: none;
	float: left;
	position: absolute;
	top: 2em;
	left: 0;
	z-index: 99999;
}
#nav ul ul ul {
	left: 100%;
	top: 0;
}
#nav ul ul a {
	background: #dedede;
	line-height: 1em;
	padding: .5em .5em .5em 1em;
	width: 10em;
	height: auto;
}
#nav li:hover > a,
#nav ul ul :hover > a {
	
}
#nav ul ul a:hover {
	
}
#nav ul li:hover > ul {
	display: block;
}


/* Content */

/* Homepage */

#featured {
	margin-top: 30px;
}

#featured div {
	text-align: center;
	min-height: 260px;
	background: #c0c0c0;
	display: table;
}

#featured div h3 {
	vertical-align: middle;
	color: #fff;
	font-family: 'Raleway', sans-serif;
	display: table-cell;
	font-size: 24px;
	line-height: 1.2em;
}




/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-header {
	background: #F206C5;
	color: #fff;	
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	padding: 20px;
}

.modal-header h1 {
	font-size: 34px;
	text-align: left;
	padding-left: 15px;
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 30px auto; /* 15% from the top and centered */
  width: 80%; /* Could be more or less, depending on screen size */
  height: 100vh - 20;
  border-radius: 30px;
  overflow: scroll;
}

.modal-body {
	padding: 20px;
	min-height: 300px;
	overflow: auto;
}

/* The Close Button */
.close {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: rgba(255,255,255,0.6);
  text-decoration: none;
  cursor: pointer;
}


.content-form {
	text-align: left !important;
}

.content-form section {
	background: #E1F7F1;
	padding: 30px 15px;
	border-radius: 10px;
	margin-bottom: 15px;
	overflow: auto;
}


.content-form input, .content-form textarea {
	width: 100%;
	background: #fff;
	border: 2px solid #B9B9ED;
	border-radius: 5px;
	padding: 10px;
}

.content-form p label {
	text-align: left;
	font-weight: 500;
}

.bold-label {
	font-weight: 600 !important;
}

.content-form label input, .content-form label span {
	display: inline-block;
}

span.wpcf7-list-item-label {
	color: rgba(0,0,0,0.2);
}

.wpcf7-checkbox {
	padding-top: 20px;
}

.content-form label input {
}

.content-form span {
	color: rgba(0,0,0,0.8);
	font-size: 16px;
}


input[type="checkbox"], input[type="radio"] {
	width: 20px !important;
}

.wpcf7-list-item {
	display: inline-block;
	margin: 0 0 0 0em !important;
	}

.wpcf7-list-item {
	width: 100%;
	margin-top: 5px !important;
	padding: 5px 10px !important;
	border-radius: 5px;
	background: #F2F0FF;
}

.section-pink {
	background: #ffe4ec !important;
}

.section-pink input, .section-pink textarea {
	background: #fff;
	border: 2px solid #f2cdd9;
}

.section-yellow {
	background: #fdf0d1 !important;
}

.section-yellow input, .section-yellow textarea {
	background: #fff;
	border: 2px solid #ead5a3;
}




.content-form h2 {
	font-size: 26px;
	font-weight: 700;
	font-family: 'Muli', sans-serif;
	padding-left: 15px;
	padding-right: 15px;
	width: 100%;
	float: left;
}

.content-form select {
	width: 100%;
}

.content-form .wpcf7-submit {
	background: #29297C;
	border: 2px solid #29297C !important;
	color: #fff;
	display: inline-block;
	float: right;
	width: 250px;
	border-radius: 15px;
	padding: 15px 20px;
	font-size: 20px;
	font-weight: 600;
}

.wpcf7-spinner {
	width: 100%;
	display: block !important;
}

.wpcf7-file {
	background: #fff6e1 !important;
}

span.contentimage {
	color: #104936;
}



.sticky {
}
.entry-meta {
	clear: both;
	display: block;
}
.single-author .entry-meta .byline {
	display: none;
}
#content nav {
	display: block;
	overflow: hidden;
}
#content nav .nav-previous {
	float: left;
	width: 50%;
}
#content nav .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}
#content #nav-above {
	display: none;
}
.paged #content #nav-above,
.single #content #nav-above {
	display: block;
}
#nav-below {
	margin: 1em 0 0;
}
.page-link {
	clear: both;
	margin: 0 0 1em;
}
.page .edit-link {
	clear: both;
	display: block;
}

/* Notices */
.post .notice,
.error404 #searchform {
	background: #eee;
	display: block;
	padding: 1em;
}



#error-page {
	padding: 80px 20px 80px 20px;
}

#error-page img {
	margin-bottom: 20px;
	max-width: 200px;
}

#error-page h1 {
	font-size: 30px; 
	line-height: 1em; 
	margin-bottom: 20px;
}


/* Images */

a img {
	border: none;
}
p img {
	margin-bottom: 0.5em; /* a small bottom margin prevents content floating under images */
}
/*
Resize images to fit the main content area.
- Applies only to images uploaded via WordPress by targeting size-* classes.
- Other images will be left alone. Use "size-auto" class to apply to other images.
*/
img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
.attachment img,
.widget-area img,
.wp-caption {
	max-width: 100%; /* When images are too wide for containing element, force them to fit. */
	height: auto; /* Override height to match resized width for correct aspect ratio. */
}
img.alignleft {
	margin-right: 1em;
}
img.alignright {
	margin-left: 1em;
}
.wp-caption {
	padding: .5em;
	text-align: center;
}
.wp-caption img {
	margin: .25em;
}
.wp-caption .wp-caption-text {
	margin: .5em;
}
.gallery-caption {
}
.wp-smiley {
	margin: 0;
}


/* Forms */

#searchform label {
	display: none;
}
#searchform input#s {
	width: 60%;
}


/* Class for labelling required form items */
.required {
	color: #cc0033;
}


/* =Comments */

article.comment {
	display: block;
}
#respond input[type=text] {
	display: block;
	width: 60%;
}
#respond textarea {
	display: block;
	margin: 0 0 1em;
	width: 80%;
}
#respond .form-allowed-tags {
	clear: both;
	width: 80%;
}
#respond .form-allowed-tags code {
	display: block;
}


/* =Widgets */

.widget {
	display: block;
}
.widget-area .widget_search {
	overflow: hidden;
}
.widget-area .widget_search input {
	float: left;
}


/* Footer */

#footer-wrap {
	background: #c0c0c0;
	padding: 30px 0px;
	margin-top: 30px;
	text-align: center;
}





/* MOBILE MENU */





nav:not(.mm-menu)
{
	display: none;
}

.header
{
	display: none;
	text-align: center;
}
.header
{
	background: #777;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	line-height: 40px;
	position: fixed;

	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	width: 100%;
	height: 40px;
	padding: 0 50px;
}
.header.fixed
{
	position: fixed;
	top: 0;
	left: 0;
}
.footer.fixed
{
	position: fixed;
	bottom: 0;
	left: 0;
}
.header a
{
	background: center center no-repeat transparent;
	background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC );

	display: block;
	width: 40px;
	height: 40px;
	position: absolute;
	top: 0;
	left: 10px;
}




@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }
}



@media only screen and (max-device-width: 480px) {
  /* define mobile specific styles come here */

 html, body {
 	width: 100%;
 	height: 100%;
 	max-width: 100%;
 }

nav#nav {
  	display: none;
  }

#header-wrap {
	margin-top: 40px;
}

.header {
  	display: block;
  	z-index: 999999999999;
  }

  li.menu-item a {
  		font-size: 22px;
  }

}