/* Custom CSS */
/** Fonts to be used **/
@import url(http://fonts.googleapis.com/css?family=Rokkitt:700);
@import url(http://fonts.googleapis.com/css?family=Raleway:300,500,600);

body {
	background:url(../images/page-bg.png) repeat-x top;
	font-weight: 500;
	color: #000000;
} /* For applying the top header colored bars, as full width (left / right */

.entry-header,
.entry-content,
.entry-summary,
.entry-meta {
	margin: 0 auto;
	max-width: 1200px;
	width: 100%;
	padding: 0;
} /** Using full available width for content area when no sidebar **/

.sidebar .entry-header,
.sidebar .entry-content,
.sidebar .entry-summary,
.sidebar .entry-meta {
	width: 100%; /*880px;*/
	padding: 0;
	margin: 0; /* 0 10px;*/
} /** Using full available width for content area when 1 sidebar **/

.no-sidebar .entry-content { max-width: 100%; }
.page-template-template-homepage-php #primary {
	width: 60%;
} /** Applying 60% for the main content area of home page **/

/*.sidebar .sidebar-container {
	width: 25%;
}*/

.two-sidebars .entry-header,
.two-sidebars .entry-content,
.two-sidebars .entry-summary,
.two-sidebars .entry-meta {
	width: 100%; /*579px;*/
	padding: 0;
	margin: 0; /*0 10px;*/

} /** Using full available width for content area when 2 sidebars **/

.two-sidebars #primary {
	width: 60%;
} /** Applying 60% to content area when both left & right sidebars are present **/

.two-sidebars .sidebar-container {
	width: 20%;
} /** Applying 20% each for left as well as right sidebar **/

.site-main .sidebar-container {
    height: auto;
    position: relative;
    /*width: 280px;*/
    z-index: 1;
	margin: 0; /* 0 10px;*/
}


.site-main .sidebar-inner {
    width: auto;
}

#sidebar-left .sidebar-inner { margin-left: 10px;} /** left margin for left sidebar **/
#sidebar-right .sidebar-inner { margin-right: 10px;} /** right margin for right sidebar **/

#primary, #sidebar-left, #sidebar-right, #tertiary, #sidebar-right-main {
	float: left;
} /** Making all content areas to float left, so 1 sidebar or 2 sidebar alignment can be handled in general **/

#sidebar-left {
	/*width: 200px;*/
	position:relative;
} /** To accomodate + sign in left sidebar )+ as absolute position **/

#sidebar-left .widget{
	background: #c0d02a;
	border-radius: 8px;
} /** This will apply the green color all widgets placed in left sidebar **/

#sidebar-left a {
	color: rgb(12, 137, 185);
	font-weight:bold;	
}

.no-sidebar #primary {
	float: none;
} /** removing Float for the main content area, when there's no sidebar **/

.site-footer .widget-area, .sidebar .site-footer, .two-sidebars .site-footer  {
    clear: both;
    display: block;
}

input[type="search"] {
    padding-right: 2px;
    width: 260px;
} /** search box at top left **/

.site-main .widget-area {
    float: none;
    width: 100%;
}


.page-template-template-homepage-php .entry-header,
.page-template-template-homepage-php .entry-content,
.page-template-template-homepage-php .entry-summary,
.page-template-template-homepage-php .entry-meta {
	width: 100%; /*690px;*/
	padding: 0;
	margin: 0; /* 0 10px;*/
} /** Using full available width for main content area on Home page template **/

.page-template-template-homepage-php .site-main .sidebar-container {
    height: auto;
    position: relative;
    width: 40%; /*380px;*/
    z-index: 1;
	margin: 0; /* 0 10px;*/
} /** Making the right sidebar on home page, to be 30% **/

/** Sub menu bg color */
.nav-menu .sub-menu, .nav-menu .children {
	background: #33BEF2;
}

/** Links **/
.entry-meta a, .entry-content a {
    color: #0c89b9;
}
a {
    color: #0c89b9;
    text-decoration: none;
}

a:hover, .entry-meta a:hover, a:active, .entry-title a:hover {
	color: #35c4f8;
}

a:visited {
	color: #0e9ad0;
}


.entry-title a {
	color: #0c89b9;
}

/** Applying Generic Fonts, colors and font-weights as needed **/
h1, h2, h3, h4, h5, h6 {
    font-family: Rokkitt,serif;
	color: #0fa5df;
}

html,
button,
input,
select,
textarea {
	font-family: 'Raleway', sans-serif;
}

b,
strong, th {
	font-weight: 600;
}

.site-description {
	font: 300 italic 24px 'Raleway', sans-serif;
	margin: 0;
}
/** footer in bg white **/
.site-footer {
    background-color: #FFF;
    color: #333;
}

/** hiding comments area **/
.comments-area {
	display: none;
}

/** Navigation menu **/
.main-navigation {
	margin: 0;
	padding: 0;
}

.navbar {
	margin-top: 5px;
	min-height: 35px;
	/*background:#0FA6DF;*/
}

ul.nav-menu {
	padding-right: 0;
}

.nav-menu li {
	background: #34BDF3;
}
.nav-menu li#menu-item-352, .nav-menu li#menu-item-661, .nav-menu li#menu-item-901 {
	background: #0FA6DF;
	border-left: solid 2px #FFF;
	float: right;
} /** ID #menu-item-331 is of "for members", to make its background a bit darker than other menu items **/

ul.nav-menu ul li, .nav-menu ul ul li {
	width: 100%;
}

ul.nav-menu ul a, .nav-menu ul ul a {
	width: 100%;
	min-width: 200px;
}

.nav-menu li#menu-item-331 a, .nav-menu li#menu-item-659 a, .nav-menu li#menu-item-899 a {
	text-transform: none;
} /** ID #menu-item-331 is of "en français", and to make its font as normal case and not all caps **/

/** For home page **/

.home .hentry h1 {
	color: #b2d235;
	font-size: 30px;
	margin: 0;
}

.home .hentry h2 {
	color: #38b1e2;
	font-size: 30px;
	margin: 0;
}

.home .hentry .inline-text {

}

.home .entry-header {
	display: none;
}

/** Reports blocks on home page **/

.HomeReportWrapper {
	position: relative;
	width: 100%;
	margin-top:.4em;
	padding:1em 0 1em 0;
	border-top: 1px solid #b9babb;
}

.HomeReportWrapper:after {
	clear:both;
}

.HomeReportBlock1, .HomeReportBlock2, .HomeReportBlock3 {
	float:left; 
	padding: 0 10px 0 0px;
	width: 33%; /*200px;*/
	font-size:80%;
	line-height: normal;
	margin-bottom: 20px;
	text-align: center;
}

.HomeReportBlock1 {
	padding-left: 0;	
}

.HomeReportBlock2 {
	/*width:230px;	*/
}

.HomeReportBlock3 {
	padding-right: 0;	
}

.home [class*="HomeReportBlock"] img {
	width: 100px;
	float: none;
	margin-right: 5px;
}

.home [class*="HomeReportBlock"] a {

}

/** 3 color blocks on home page, please note the html markup for this is inside admin>>pages>>homepage  **/
.home [class*="colorblock"] {
	width: 30.6%;
	float:left;
	margin-right: 3%;
	color: #FFF;
	display: block;
	min-height: 135px;
	padding: 2%;
}

.home .colorblock-blue { background: #33bef2; margin-right: 0;}
.home .colorblock-green { background: #c0d02a; margin-left: 2%;}
.home .colorblock-orange { background: #d8ba13;}

.home .colorblock-blue:hover { background: #579cca;}
.home .colorblock-green:hover { background: #a5b229;}
.home .colorblock-orange:hover { background: #a08a0e;}

.home [class*="colorblock"] h1, .home [class*="colorblock"] span.heading {
	font-family: Rokkitt,serif;
	font-weight: 700;
	font-size: 23px;
	display: block;
	color: #FFF;
	margin: 10px 0px 8px 10px;
	line-height: 26px;
	text-align:center;
}

.home [class*="colorblock"] span {
	font-size: 18px;
	line-height: normal;
}

.home [class*="colorblock"] a {
	color: #FFF;
	text-decoration: none;
	display: block;
	min-height: 10em;
}

.home .colorblock-wrapper {
	padding: 50px 0 30px 0;
	position: relative;
	width: 100%;
	margin: 0;
	margin-top:1.5em;
	border-top: 1px solid #b9babb;
	border-bottom: 1px solid #b9babb;
}

.home .colorblock-wrapper [class*="colorplus"] {
	position: absolute;
	top: 30px;
	width: 60px;
	height: 60px;
}

.home .colorblock-wrapper .colorplus-blue { left: 32.6%; background:url(../images/plus-blue.png) no-repeat left top;}
.home .colorblock-wrapper .colorplus-green { left: 66.2%; background:url(../images/plus-green.png) no-repeat left top;}
.home .colorblock-wrapper .colorplus-orange { left: -1%; background:url(../images/plus-orange.png) no-repeat left top;}

.home .colorblock-wrapper .text-in-block {
	display:block;
	text-align:center;
	font-size:90%;	
}

/** Sidebar widgets **/

#sidebar-right-main .widget {
	background: none;
	padding-right: 0;
	padding-top: 0;
} /** home page right sidebar **/

#sidebar-right-main .widget .widget-title {
	font-style:normal;
	margin: 0 0 10px 0;
	padding: 0px 0px 0px 10px;
	line-height: 35px;
	height: 35px;
}

#sidebar-right-main #text-2 .widget-title {
	background: #d8ba13;
	color: #FFF;
	font-family: Rokkitt,serif;
	font-weight: 700;
	font-size: 26px;
	text-transform: uppercase;
	width: 50%;
} /** This is for title of News block on home page right sidebar. Please change ID #text-2 above, in case a different widget is put in home page sidebar **/

#sidebar-right-main #text-3 .widget-title, #sidebar-right #text-5 .widget-title {
	background: #cbdb2a url(../images/twitter-logo.png) no-repeat 6px center;
	color: #FFF;
	font-family: Rokkitt,serif;
	font-weight: 700;
	font-size: 18px;
	padding-left: 46px;
} /** This is for title of Twitter block on home page right sidebar and on inside page sidebars. Please change ID #text-3 and #text-5, in case a different widget is put in home page sidebar **/

.home .hentry {
	padding-top: 0;
	margin-top: 40px;
	border-right: 1px solid #b9babb;
} /** This is for blue heading on home page **/

.page-template-default .hentry {
	padding: 0 20px;
	margin-top: 40px;
	border-right: 1px solid #b9babb;
} /** This is for blue heading on all inner pages **/

/** styling for sidebars **/
#sidebar-right .widget {
	background: none;
	padding-right: 0;
	padding-top: 0;
}

#sidebar-left .widget-title {
	color: white;
	font-family: Rokkitt,serif;
	font-weight: 700;
	font-size: 18px;
	font-style:normal;
}

#sidebar-left .sidebar-caption {
	font-size:85%;
	font-style:italic;
}

#sidebar-left .widget .colorplus-orange { 
	position: absolute;
	top: -20px;
	width: 60px;
	height: 60px;
	left: -20px; 
	background:url(../images/plus-orange.png) no-repeat left top;
} /**  orange colored + sign on top left of widget in left sidebar **/

#sidebar-right .widget-title {
	background: #d8ba13;
	color: #FFF;
	font-family: Rokkitt,serif;
	font-weight: 700;
	font-size: 18px;
	font-style: normal;
	padding: 5px 0 5px 10px;
}

.no-sidebar .hentry {
	padding-left: 20px;
	padding-right: 20px;
} /* When full width page template is used, reduce the left / right padding of text **/

.menu-toggle {
	color: #FFF;
} /** applying white color to toggled menu **/

.theme-default .nivoSliderWeptile {
	box-shadow: none !important;
} /* To remove box shadow from default theme of sidebar image slider */

/* BuddyPress page theming - Start */

.BuddyPressShortcuts {
	font-size:.9em;
	margin:10px 0 0 20px;	
}

.BuddyPressShortcuts a {
	padding:0 10px 0 10px;	
}

.BuddyPressShortcutsFirst {
	padding-left:0;	
}

/* BuddyPress page theming - End */





@media screen and (min-width: 768px) and (max-width: 910px) {
	.nav-menu li a {
		font-size: 15.5px;
		padding: 9.5px 14.5px;
	}
	
	.site-header .home-link {
		min-height: 121px;
	}
}

@media screen and (min-width: 0px) and (max-width: 979px) {
	.site-header .search-field {
		width: 30px;
	}
}

/** Setting height of header on different resolutions **/

@media (max-width: 1170px) {
	.site-header .home-link {
		min-height: 159px;
	}
	
}

@media (max-width: 1024px) {
	.site-header .home-link {
		min-height: 138px;
	}
	
	.slider-wrapper.widget-weptile-image-slider-widget-2-weptile-image-slider-widget-nivo-slider {
		width: auto !important;
	}
}

@media (max-width: 980px) {
	.site-header .home-link {
		min-height: 132px;
	}
	
	.home .hentry {
		padding: 0 20px 20px 20px;
	}
	
	.home [class*="HomeReportBlock"] img { float: none; }
	.home [class*="HomeReportBlock"] { text-align: center; }
	
	.home .colorblock-wrapper { clear: left; }
}

@media (max-width: 920px) {
	.site-header .home-link {
		min-height: 124px;
	}
	
		/** inner page sidebars **/
	
	.two-sidebars #primary, .two-sidebars .sidebar-container {
		width: 100%;
	}
	
	.page-template-default .site-main .sidebar-container { max-width: 94%; margin: 0 auto; float: none !important; }
	
	.page-template-default .hentry { border-right: none; padding: 0; }
	
	#sidebar-left .sidebar-inner { margin-left: 0; }
	
	
	.sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta, .sidebar .comment-list, .sidebar .comment-reply-title, .sidebar .comment-navigation, .sidebar .comment-respond .comment-form, .sidebar .featured-gallery, .sidebar .post-navigation .nav-links, .author.sidebar .author-info {
		max-width: 100%;
		padding: 0 !important;
	}
	
	.page-template-default #primary { max-width: 94%; margin: 0 auto; float: none !important; }
	
}

@media (max-width: 840px) {
	.site-header .home-link {
		min-height: 114px;
	}
}

@media (max-width: 768px) {
	.site-header .home-link {
		min-height: 102px;
	}
}

@media (max-width: 670px) {
	.site-header .home-link {
		min-height: 89px;
	}
}

@media (max-width: 580px) {
	.site-header .home-link {
		min-height: 76px;
	}
}


@media (max-width: 768px) {
	.home .hentry { padding: 0 10px 10px 10px;}
	.home .hentry h1, .home .hentry h2 { line-height: 30px; }
	.site-header .search-field { margin: 0 !important; height:auto; background-size: contain; }
	.site-header .search-form { right: 5px !important; }
	.site-header .search-field:focus { width: 130px !important; }
	
	.nav-menu li#menu-item-352 { float: none; border-width: 0; }
	
	/*.HomeReportBlock1, .HomeReportBlock2, .HomeReportBlock3 {
		float: none;
		width: 100%;
		display: inline-block;
		padding: 0;
	}*/
	
	#sidebar-right-main .widget{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#sidebar-right .widget {
		padding: 0px;
	}
	
	#sidebar-right .sidebar-inner { margin: 0; }
	
	.home [class*="colorblock"] {
		width: 100%;
		float: none;
		margin: 0 0 20px 0;
	}
	
	.home .colorblock-wrapper [class*="colorplus"] {
		left: -19px;
	}
	
	.home .colorblock-wrapper .colorplus-blue {
		top: 210px;
	}
	
	.home .colorblock-wrapper .colorplus-green {
		top: 390px;
	}
	
	.entry-title {
		font-size: 36px;
		line-height: 30px;
	}
	
	.entry-content h2 {
		margin: 10px 0;
		font-size: 28px;
		line-height: 30px;
	}
	
	caption, th, td {
		display: inline-table;
	}
	


}

@media (max-width: 643px) {
	.page-template-template-homepage-php #primary { width: 100%; }
	
	#primary, #sidebar-left, #sidebar-right, #tertiary, #sidebar-right-main { float: none; }
	
	.page-template-template-homepage-php .site-main .sidebar-container { width: 94%; max-width: 94%; margin: 0 auto; }
	
	.home .hentry { border-right: none; }
	
	#sidebar-right-main .widget { padding: 0px; }
	
	
}

@media (max-width: 359px) {
	.site-header .search-form { bottom: 48px; width: 97%; right: 1.5%; }
	.site-header .search-field { width: 100%; }
}