/*
Theme Name: RiskCafe
Author: Respondto Digital
Author URI: http://www.respondto.co.za
Description: Custom theme for RiskCafe
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
.qcenter {
	text-align:center;
        font-size:8pt;
}
.textcenter {
	text-align:center;
}
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


/* CUSTOM STYLES */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);
@import url(http://fonts.googleapis.com/css?family=Merriweather:400,300,700);

html{ height: 100%; }
body{ height: 100%; font-family: 'Merriweather', serif; font-size: 15px; color: #555555; }
p{ margin: 0em 0em 1em 0em; line-height: 1.3em; }
strong{ font-weight: 700; }
h3{ font-size: 1.2em; color: #bf1e2e; font-weight: 700; }
a{ color: #bf1e2e; text-decoration: underline; }
a:hover{ text-decoration: none; }

#watermark{ position: fixed; background: url('images/watermark.png') no-repeat; width: 880px; height: 882px; z-index: -5; }
.clear{ clear: both; }
.container{ max-width: 750px; margin: 0 auto; }

.centercontainer{ padding-top: 10%; }
#logo{ background: url('images/logo.png') no-repeat; width: 295px; height: 106px; margin: 0 auto; }
.logomain{ font-family: 'Open Sans', sans-serif; font-weight: 600; font-size: 2em; margin: 0.2em 0em 0.5em 0em; color: #f69c30; text-align: center; padding-top: 10%; }
.logomain .bold{ font-family: 'Merriweather', serif; font-weight: 200; color: #FFFFFF; }

#menu-tray{ display: none; }
#nav, #page-nav{ font-family: 'Open Sans', sans-serif; font-weight: 300; background: #ebebeb; position: relative; top: -3em; z-index: 500; height: 45px; }
#page-nav{ top: 0em; }
#nav .menu-main-menu-container, #page-nav .menu-main-menu-container{ float: right; position: relative; left: -50%; }
#nav .menu-icon, #page-nav .menu-icon{ background: url('images/menu-icon.png') no-repeat; width: 28px; height: 27px; position: absolute; left: 1em; top: 0.5em; cursor: pointer; }
#menu-main-menu{ position: relative; left: 50%; padding: 1em 0em 1em 0em; }
#menu-main-menu li{ display: inline-block; * display: inline; margin: 0em 1em 0em 1em; }
#menu-main-menu li a{ text-decoration: none; color: inherit; text-transform: uppercase; }
#menu-main-menu li a:hover{ color: #bf1e2e; }
#menu-main-menu li.current-menu-item{ font-weight: 400; color: #bf1e2e; }

.vline{ background: url('images/vline.png') no-repeat; width: 10px; height: 170px; margin: 4em auto 4em auto; }

#landingpage{ background: #aa1a28; height: 100%; position: relative; }
#introduction{ text-align: center;  }
#introduction .title{ color: #bf1e2e; text-align: center; font-size: 1.5em; margin-bottom: 1em;font-family: 'Open Sans', sans-serif; }
#introduction .subtitle{ color: #555555; }
#what-we-do{ text-align: center; }
#what-we-do .header{ background: url('images/what-we-do-header.png') no-repeat; width: 181px; height: 180px; margin: 0 auto 2em auto; }
#what-we-do .title{ color: #bf1e2e; text-transform: uppercase; margin-bottom: 1em; font-family: 'Open Sans', sans-serif; }
#what-we-do .row{ display: table;  border-spacing: 20px;}
#what-we-do .third{ display: table-cell;}
#news{  }

#news{ text-align: left; }
#news .header{ background: url('images/latest-news.png') no-repeat; width: 180px; height: 182px; margin: 0 auto 2em auto; }
#news .title{ color: #bf1e2e; text-align: center; text-transform: uppercase; margin-bottom: 1em; font-family: 'Open Sans', sans-serif; }
#news .row{ display: table;  border-spacing: 20px;}
#news .third{ display: table-cell;}

#team{ text-align: center }
#team .header{ background: url('images/the-team.png') no-repeat; width: 184px; height: 171px; margin: 0 auto 2em auto; }
#team .title{ color: #bf1e2e; text-transform: uppercase; margin-bottom: 1em; font-family: 'Open Sans', sans-serif; }
#team .row{ display: table;  border-spacing: 20px;}
#team .third{ display: table-cell;}

#careers{ text-align: center; }
#careers .header{ background: url('images/careers.png') no-repeat; width: 183px; height: 171px; margin: 0 auto 2em auto; }
#careers .title{ color: #bf1e2e; text-transform: uppercase; margin-bottom: 1em; font-family: 'Open Sans', sans-serif; }
#careers .row{ display: table;  border-spacing: 20px;}
#careers .third{ display: table-cell;}

#contact-us{  }
#contact-us p{ text-align: center; }
#contact-us .header{ background: url('images/contact.png') no-repeat; width: 182px; height: 181px; margin: 0 auto 2em auto; }
#reports .title{ color: #bf1e2e; text-align: center; font-size: 1.5em; margin-top: 2em; margin-bottom: 2em; font-family: 'Open Sans', sans-serif; }
#reports .subtitle{ color: #555555; }
#reports .header{ border-bottom: 1px solid #000000; font-size: 1.3em; color: #bf1e2e; text-align: center; padding: 0em 0em 1em 0em;}
#reports .subheader{ color: #bf1e2e; text-align: center; margin: 1em 0em 1em 0em;}

.mid-block{ padding: 3em 0em 3em 0em; text-align: center; }
.mid-block .alt{ font-family: 'Open Sans', sans-serif; font-size: 1.2em; }
.mid-block .main{ font-family: 'Open Sans', sans-serif; font-weight: 600; font-size: 2em; margin: 0.2em 0em 0.5em 0em; }
.mid-block .main .bold{ font-family: 'Merriweather', serif; font-weight: 700; }
.mid-block .footer-img{ max-width: 383px; margin: 0 auto; padding: 0px 10px 0px 10px;}
.mid-block .footer-img img{ width: 100%; }

.orange-block{ background: #f69c30; color: #FFFFFF; }
.orange-block .main{ color: #bf1e2e; }
.orange-block .main .bold{ color: #FFFFFF; }

.red-block{ background: #bf1e2e; color: #FFFFFF; }
.red-block .main{ color: #f69c30; }
.red-block .main .bold{ color: #FFFFFF; }

.links{ text-align: center; font-family: 'Open Sans', sans-serif; color: #363636; padding: 1em 0em 1em 0em;}
.links a{ text-decoration: none; color: inherit; }

.smallline, .smallblackline{ border-bottom: 1px solid #f69c30; width: 110px; margin: 0 auto 1em auto; }
.smallblackline{ border-bottom: 1px solid #000000; margin: 3em auto; }

.ui-accordion-header{ text-transform: uppercase; text-align: center; }
.ui-state-default.ui-accordion-header-active{ border-top: 1px solid #000000; border-bottom: none; color: #bf1e2e; }
.ui-state-default{ border-bottom: 1px solid #000000; color: #555555; font-family: 'Open Sans', sans-serif; }

.careers-below{ color: #bf1e2e;}
.report-links{ color: #bf1e2e;}
.report-links a{ text-decoration: none; color: inherit; }

.resourcebutton{
	float: left;
	color: #FFFFFF;
	background: #bf1e2e;
	text-decoration: none;
	padding: 10px 15px 10px 15px;
	margin: 1em 0em 2em 0em;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
	cursor: pointer;
}

#portal{}
#portal .error{ color: #bf1e2e; }
#portal label{ width: 100%; display: block; margin-top: 1em; }
#portal input[type="text"], #portal input[type="password"]{ width: 100%; display: block;
	background: #ebebeb;
	padding: 10px 15px 10px 15px;
	margin: 1em 0em 0.5em 0em;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
	border: none;
}
#portal input[type="submit"]{
	color: #FFFFFF;
	background: #bf1e2e;
	text-decoration: none;
	padding: 10px 15px 10px 15px;
	margin: 1em 0em 2em 0em;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-khtml-border-radius: 10px;
	border: none;
	cursor: pointer;
}

#floatingmenu{ position: fixed; right: 0; top: 12%; z-index: 600; }
#floatingmenu li{ border-right: 15px solid #bf1e2e; margin: 0px 0px 2px 0px; }
#floatingmenu li a{ font-family: 'Open Sans', sans-serif; padding: 10px 20px 10px 20px; display: block; width: 100%; background: #ebebeb; color: #363636; text-decoration: none;
	position: relative;
	right: -150px;
}
#floatingmenu li:hover a{ right: 0px; }
#floatingmenu li.current_page_item{ border-right: 15px solid #f69c30; }

.ui-accordion .ui-accordion-icons{ padding-left: 0em;}


@media only screen and (max-width: 767px) {
	
	.centercontainer{ padding-top: 30%; }
	.logomain{ font-size: 1.5em; }
	.container{ width: 92%; margin: 0 auto; }
	#what-we-do .row, #what-we-do .third {display: block; width: 100%;}
	#what-we-do .third{ margin-top: 2em; }
	#team .row, #team .third {display: block; width: 100%;}
	#team .third{ margin-top: 2em; }
	#careers .row, #careers .third {display: block; width: 100%;}
	#careers .third{ margin-top: 2em; }

	#menu-tray{ display: block; background: url('images/menu-tray.png') no-repeat; width: 28px; height: 27px; position: absolute; right: 1em; top: 0.5em; z-index: 600; cursor: pointer; }
	#nav .menu-main-menu-container, #page-nav .menu-main-menu-container{ float: none; position: relative; padding-top: 3em; }
	#menu-main-menu li, #menu-main-menu li a{ display: block; width: 100%; }
	#menu-main-menu li{ margin: 0em; }
	#menu-main-menu li a{ padding: 1em 1em 1em 5em;}
	

}
