/* ================================================================================ 
   =====                            CSS STYLES FOR                            ===== 
   =====                        SCHOOLWEBSITE.NU SKIN                         ===== 
   ================================================================================ */


/* ================================================================================ 
                                  GENERAL SETTINGS
   ================================================================================ */
   
   
@font-face { 
	font-family: "Ionicons"; 
	src: url("fonts/Ionicons/ionicons.eot"); 
	src: url("fonts/Ionicons/ionicons.eot#iefix") format("embedded-opentype"), 
		 url("fonts/Ionicons/ionicons.ttf") format("truetype"), 
		 url("fonts/Ionicons/ionicons.woff") format("woff"), 
		 url("fonts/Ionicons/ionicons.svg#Ionicons") format("svg");
	font-weight:normal;
	font-style:normal; 
}
 

html {
    height:100%;               /* om hoogte op 100% te zetten in geval van te weinig content */
    margin:0px; 
    padding:0px; 
    overflow-y:scroll;         /* Altijd een scrollbalk afdwingen i.v.m. verspringingen */
}

body {
	text-align: left;
	font-family:'Ruda', sans-serif;
	font-size:14px;
	line-height: 1.5;
	color:#4b4b4b;
	background-color:#f0f1f1 !important;
	background-image:none !important;
}

#Body { height:100%;}    /* Achtergrondkleuren + afbeeldingen hier */

#Form { height:100%; min-height:100%;}      /* om hoogte op minimaal 100% te zetten, mag wel groter */


/* HEADINGS */
H1, H2, H3, H4, H5 {
	font-family:'Ruda', sans-serif;
    color: #707173 !important;
    font-weight: 700;
    margin: 0 0 10px 0;}
H1 {font-size:24px;}
H2 {font-size:20px;}
H3 {font-size:16px;}
H4 {font-size:14px;}
H5 {font-size:12px;}

/* LINKS */ 
A:link      {color:#4b4b4b; text-decoration:none; transition:color 0.3s ease;}
A:visited   {color:#4b4b4b;}
A:hover     {color:#4b4b4b; text-decoration:underline;}
A:active    {color:#4b4b4b;}

/* TABLES */
table {font-size:inherit;}               /* om de lettergrootte in de editor gelijk te zetten */
table tr {}
table tr th {}
table tr td { vertical-align:top;}

/* DNN SPECIFIC */
.Head, .SubHead, .SubSubHead, .Normal, .NormalTextBox, .NormalRed, .NormalBold, .CommandButton { font-family: inherit; color:inherit; line-height:inherit; font-size:inherit}
.Head { font-size:15px;}          /* style for module titles */
.SubHead {font-size:14px;}        /* style of item titles on edit and admin pages */
.SubSubHead { font-size:13px;}    /* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */
.NormalBold { font-weight:bold;}

.CommandButton {}                  /* text style for buttons and link buttons used in the portal admin pages */
A.CommandButton:link {}            /* hyperlink style for buttons and link buttons used in the portal admin pages */
A.CommandButton:visited {}
A.CommandButton:hover {}    
A.CommandButton:active {}

.StandardButton {}                 /* button style for standard HTML buttons */

/* COMMON  ISSUES */
img {border:0px;}                  /* geen standaard rand bij afbeeldingen wanneer er gelinkt wordt */

input[type=submit], input[type=button] {}
input[type=submit]:hover, input[type=button]:hover {}

* { transition:background-color 0.3s ease;}


/* Clearfix */
.clear{clear:both; display:block; height:0; overflow:hidden; visibility:hidden; width:0;}
.clearfix:after{clear:both; content:'.'; display:block; font-size:0; height:0; line-height:0; visibility:hidden; width:0;}
* html .clearfix,:first-child+html .clearfix{zoom:1;}   

/* Button */
.Button, 
.dnnPrimaryAction, 
a.dnnPrimaryAction, 
.wrContactForm #dnn_ButtonContactFormSend, 
.NewsItem a.NewsLink{
height: 38px; line-height: 38px; border: 1px solid #c8d200; background: none; background-color: #c8d200; color: #fff !important; padding: 0 10px; border-radius: 5px; display: inline-block; text-decoration: none !important; font-size: 16px; transition: background-color 0.225s ease; cursor: pointer; text-shadow: none; box-shadow: none; }

.Button:hover, 
.dnnPrimaryAction:hover,
a.dnnPrimaryAction:hover, 
.wrContactForm #dnn_ButtonContactFormSend:hover, 
.NewsItem a.NewsLink:hover{background: none; background-color: #fff !important; color: #c8d200 !important; border-color: #c8d200;}

.Button:before{font-family: "Ionicons"; display: inline-block; padding-right: 10px; vertical-align: middle; font-size: 18px;}
.Exit:before{content: "\f124";}



/* ================================================================================ 
                                     MAIN LAYOUT
   ================================================================================ */
.ControlPanel { }

#Wrapper { margin:0px auto; min-height:100%; background-color:#f1f1f1; text-align:left;}
.InnerWrapper { margin:0px auto; padding: 0 20px; max-width:960px; position:relative; box-sizing:border-box; -webkit-box-sizing:border-box;}


/* HEADER SECTION  */
#Header { height: 120px; padding: 0 40px; background-color: #fff; color: #bcbcbc; box-shadow: 1px 1px 6px rgba(0,0,0,0.2); position: relative; margin-bottom:30px; }
#Header #Logo { position: relative; display: inline-block; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); max-height:100px;}
#Header .ProfileWrapper{position: absolute; right: 40px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}


/* SEARCH  */
#Search { text-align:right;}
#Search .SkinObject{font-family: "Ionicons"; font-size:18px; vertical-align:middle;}   
#Search .NormalTextBox { -webkit-appearance:none;}
#Search .NormalTextBox:focus { outline:none} 
#Search .searchSkinObjectPreview, #Search .searchInputContainer a.dnnSearchBoxClearText  {display:none !important;  }

/* LOGIN  */	
#Login { text-align:right; }
#Login a.LoginKey {font-family: "Ionicons"; font-size:18px; opacity:0; transition:opacity 0.3s ease;}
#Login a.LoginKey:hover { text-decoration:none; opacity:1;}

/* MENU SECTION */
#Menu { position:relative;  background-color:#3b76b1; width:100%;}


/* BREADCRUMB SECTION */ 
#Breadcrumb, 
.BreadcrumbWrapper {padding:15px 15px 0px 15px; font-size:13px;}
.BreadcrumbElementSeparator, 
.BreadcrumbSectionSeparator{font-family:"Ionicons"; font-size:10px; padding:0px 5px;}

a.Breadcrumb {color:#ff9933;}


/* ICR Breadcrumb */
.BreadcrumWrapper{ display:block; padding:35px 0 15px 10px; font-size:20px; line-height:1.25;}
.BreadcrumWrapper .Breadcrumb { text-transform: capitalize;}
.BreadcrumbElementSeparator, .BreadcrumbSectionSeparator { display:inline-block; padding:0 3px;}

/*sidebars
.HiddenSideBar, .HiddenArtSideBar { display:none;}
.HiddenSideBar.active, .HiddenArtSideBar.active { display:block;}*/

/* PANES SECTION */
#Content { }
#Content .Container { margin-bottom:40px;}

.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth { float:left; margin-right:4%; box-sizing:border-box; -webkit-box-sizing:border-box;}
.one-half.last, .one-third.last, .two-third.last, .one-fourth.last, .three-fourth.last, .one-fifth.last, .two-fifth.last, .three-fifth.last, .four-fifth.last, .one-sixth.last, .five-sixth.last  { margin-right:0;}

.one-half { width:48%;}
.one-third { width:30.66%;}
.two-third { width:65.33%;}
.one-fourth { width:22%;}
.three-fourth { width:74%;}
.one-fifth {width:16.8%}
.two-fifth { width:37.6}
.three-fifth { width:58.4%}
.four-fifth { width:79.2%}
.one-sixth {width:13.33%}
.five-sixth {width:82.66%}

.block{margin-bottom:20px;}
.block.fullblock{ -webkit-box-sizing: border-box; box-sizing: border-box; box-shadow: 1px 1px 6px rgba(0,0,0,0.2); background-color: #fff;}
.block .DnnModule{padding:15px;}

.CreditsPane{text-align:right; font-size:11px;}


/* FOOTER SECTION */
#Footer {}
#Footer A:link      { }
#Footer A:visited   { }
#Footer A:hover     { }
#Footer A:active    { }


/*SocialMedia*/
.SocialMediaIcons {padding:10px 0;}
.SocialMediaIcons a {font-family: "Ionicons"; margin:0 10px 0 0; font-size:32px; line-height:1; display:inline-block; vertical-align:top; zoom:1; *display:inline; }
.SocialMediaIcons a:hover { text-decoration:none} 


/* Mainpage search */
.SearchWrapper{}
.SearchWrapper .SearchTitle{color: #707173 !important; font-size: 24px; font-weight: 700; margin: 0 0 10px 0;}
.SearchWrapper .SearchContent{background-color:#f1f1f1; border-radius:5px; padding:15px;}
.SearchWrapper .SearchContent #txtSearch{font-family:'Ruda', sans-serif; font-size:14px; border:2px solid #c8d200; border-radius:5px; padding:10px; width: calc(100% - 104px);}
.SearchWrapper .SearchContent #txtSearch:focus{outline:0;}
.SearchWrapper .SearchContent .CustomSubmit{font-family:'Ruda', sans-serif; font-size:14px; color:#fff; background-color:#c8d200; border:2px solid #c8d200; border-radius:5px; cursor:pointer; padding:10px 15px; font-weight:bold;}
.SearchWrapper .SearchContent .CustomSubmit:hover{color:#c8d200; background-color:#fff;}




/* ================================================================================ 
                                 MOBILE MENU
   ================================================================================ */   

#MobileMenu * {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);  -webkit-touch-callout: none;  -webkit-user-select: none;  -moz-user-select: none; -ms-user-select: none; user-select: none;}
.MobileMenuHeader {font-size:50px; font-family: "Ionicons"; line-height:50px; cursor:pointer; color:#274052; display:none; }
.MobileMenuHeader.active { color:#fff; transition:all .12s ease-in-out;}

#MobiNav { margin:0; text-align:left; display:none; padding:0; }
#MobiNav ul {list-style:none; margin:0; padding:0 0 0 20px;}
#MobiNav li {list-style:none; margin:0; padding:0 0 0 10px;}
#MobiNav .item { min-height:40px; line-height:40px; border-bottom:1px solid #f0f0f0; position:relative; }
#MobiNav .item a {color:#000 !important}
#MobiNav .item a:hover, #MobiNav .item.selected > a { text-decoration:none; color:#fff !important}
#MobiNav .item.haschild:after { position:absolute; top:0px; right:0px; margin:5px 4px 0 0;  height:30px; width:30px; display:block; font-size:32px; line-height:0.75; color:#fff !important; background-color:#707173; text-align:center; cursor:pointer;  transition:all .12s ease-in-out; content:"+"; cursor:pointer;}
#MobiNav .item.haschild:hover:after { background-color:#274052;cursor:pointer;}
#MobiNav .item.haschild.active:after { content:"-";cursor:pointer;} 
#MobiNav .item .subLevel {display:none;} 
#MobiNav .item.haschild.active > .subLevel {display:block;}
#MobiNav .subLevel .item.first {border-top:1px solid #f0f0f0;}
#MobiNav .item.last {border-bottom:0;}


/* ================================================================================ 
                                 SCROLL 2 TOP
   ================================================================================ */
#back-to-top, .touch-device #back-to-top:hover { background-color:#ccc; background-color:rgba(177, 177, 177, .7); bottom:10px; display:none; height:45px; position:fixed;	right:10px; text-shadow:none; transition:all .2s ease; width:45px; z-index:980;	line-height:45px; text-align:center; font-family: "Ionicons"; font-size:28px;}
#back-to-top:hover {background-color:#000; text-decoration:none;}


/* ================================================================================ 
                                 PUBLICATIE MODULE
   ================================================================================ */
/* ARTICLE LIST */
#Wrapper.SchoolWiki .pubArticleList {}
#Wrapper.SchoolWiki .pubArticleList .pubItem {margin-bottom:15px;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubThumbNail{height: 60px;width: 60px; border-radius: 10px; background-position: center center; background-size: cover; display:inline-block; vertical-align:top; margin:10px 10px 10px 0px;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent {display:inline-block; vertical-align:top; width:calc(100% - 74px); padding:10px 0px;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubTitle { display:block; font-weight:bold; text-decoration:none; font-size:15px;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubTitle:hover{text-decoration:underline;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubSummary {padding-bottom:10px;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubMetaData {display:block; font-size: 13px; color: #ccc; line-height:26px;}

#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubLink{display:inline-block; color:#fff; background-color:#c8d200; border:1px solid #c8d200; border-radius:5px; padding:2px 10px; text-decoration:none;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubLink:hover{color:#c8d200; background-color:#fff; border:1px solid #c8d200;}
#Wrapper.SchoolWiki .pubArticleList .pubItem .pubContent .pubLink:after{font-family: "Ionicons"; content:"\f125"; display: inline-block; padding-left: 10px; vertical-align: middle; font-size: 14px;}

#Wrapper.SchoolWiki .pubArticleList .pubControls {margin-bottom: 20px;}
#Wrapper.SchoolWiki .pubArticleList .PagingTable{margin-top:20px;}



/* ARTICLE DETAILS */
#Wrapper.SchoolWiki .pubArticleDetails {}
#Wrapper.SchoolWiki .pubArticleDetails .pubMetaData {display:block; font-size: 13px; color: #ccc; line-height:20px; margin-bottom:5px;}
#Wrapper.SchoolWiki .pubArticleDetails .pubReturnLink a, 
#Wrapper.SchoolWiki .pubArticleDetails a.pubReturnLink {display:inline-block; color:#fff; background-color:#c8d200; border:1px solid #c8d200; border-radius:5px; padding:2px 10px; text-decoration:none; margin:10px 0px; font-size:15px;}
#Wrapper.SchoolWiki .pubArticleDetails .pubReturnLink a:before,
#Wrapper.SchoolWiki .pubArticleDetails a.pubReturnLink:before{font-family: "Ionicons"; content:"\f124"; display: inline-block; padding-right: 10px; vertical-align: middle; font-size: 15px;}
#Wrapper.SchoolWiki .pubArticleDetails .pubReturnLink a:hover,
#Wrapper.SchoolWiki .pubArticleDetails a.pubReturnLink:hover{color:#c8d200; background-color:#fff; border:1px solid #c8d200;}

/* ARTICLE VIEWER */
.pubArticleViewer {}
.pubArticleViewer .pubItem {}
.pubArticleViewer .pubItem .pubTitle {font-size:14px; font-weight:bold;}
.pubArticleViewer .pubItem .pubMetaData {font-size:11px; color:#999;}

.pubArticleViewer.Populair { background-color:#f1f1f1; padding:15px; border-radius:5px; }
.pubArticleViewer.Populair .pubItem { display: inline-block; vertical-align:middle; width: 48%; float: left; padding: 5px 0px;}
.pubArticleViewer.Populair .pubItem:nth-child(2n+1){margin-right:4%;}
.MenuPane .pubArticleViewer.Populair .pubItem {width:100%; margin-right:0;}
.pubArticleViewer.Populair .pubItem:hover{text-decoration:none;}
.pubArticleViewer.Populair .pubItem:before{font-family:"Ionicons"; content:"\f30f"; display:inline-block; vertical-align:middle; color:#c8d200; padding-right:10px;}
.pubArticleViewer.Populair .pubItem:hover:before{color:#707173;}

/* COMMENT VIEWER */
.pubCommentViewer .pubItem {}
.pubCommentViewer .pubItem .pubMetaData {font-size:11px; color:#999;}

/* SIDEBAR */
.MenuPane .DnnModule{padding:0px; font-size:15px;}
.MenuPane ul.pm_block_normallist li a{padding: 7px 0px; display:inline-block; vertical-align:middle;}
.MenuPane ul.pm_block_normallist li a:before{font-family: "Ionicons"; content: "\f30f"; display: inline-block; vertical-align: middle; color: #c8d200; padding-right: 10px;}
.MenuPane ul.pm_block_normallist li a:hover:before{color:#707173;}

.pmsb_wrap { }
.pmsb_wrap .pm_block {}
.pmsb_wrap .pm_block .pm_block_header,
 .MenuPane h1{ font-size:18px; color:#707173;}
.pmsb_wrap .pm_block ul { }
.pmsb_wrap .pm_block ul li {  }
.pmsb_wrap .pm_block ul li a,
.pmsb_wrap .pm_block ul li span {  }

.OuterNavBlock.pm_block.sb_searchinputbox{display:none;}
.OuterNavBlock{margin-bottom:20px;}

.TagCloudItem span{color:#4b4b4b !important;}
.TagCloudItem span:hover{text-decoration:none; color:#c8d200 !important;}

.pubFileBox {margin-top:10px;}

/* ================================================================================ 
                                CONTAINER LAYOUT'S
   ================================================================================ */
.Container {}
.ContainerHeader { }
.ContainerContent {}
.ContainerFooter {}


/* ================================================================================ 
                                   QUICK FIXES
   ================================================================================ */

/* -- footer fixed to bottom -- */ /*
#Wrapper { position: relative;}
#Panes { padding-bottom: 100px; }            
#Footer { position: absolute; width: 100%; height: 100px; bottom: 0px; margin-top: 20px;}
*/


.DnnModule.DnnModule-ICRArticles {margin-top:-30px;}


/* ================================================================================ 
                                   MEDIA QUERIES
   ================================================================================ */
   
@media only screen and (max-width: 768px) {	
	.InnerWrapper { max-width:480px}
	.MobileMenuHeader, .MobileMenuHeader.active ~ #MobiNav {display:block;}
	.RadMenu, .RadPanelBar  {display:none;}	
	.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth {float:none; margin-right:0; width:100%;}	
}