/*---------------------------------------------------------------------------------------------*/
/*---General Template - Default fonts, colors, margins, padding--------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	html,body{overflow-x: hidden;}
	.tmol
	{
		max-width: 1160px;
			-webkit-box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
			-moz-box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
			box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
	}
	
	body{color: #131313; font-family: Arial, Helvetica, sans-serif; font-size: 14px; margin: 0; line-height: 1.5; background: URL(../images/bg.jpg) fixed center;}
	
	p, h1, h2, .h1, .h2, h3, h4 {padding: 0; margin: 0; font-weight: normal;}
	h1, h2, .h1, .h2, h3, h4 	{line-height: 1.2;}
	
	a {color: #972E3C;} a:hover {color: #c94a5b;}
	
	.sp{height: 40px;}
	.sp.last{height: 60px;}
	
	h1, .h1 {font-size: 1.9em; color: #4a4a4a; font-family: 'Roboto Condensed', sans-serif; text-transform: uppercase; padding-bottom: 5px; font-weight: 700;}
	h2, .h2 {font-size: 1.14em; color: #063271; font-family: 'Roboto', sans-serif; text-transform: none; padding-top: 4px;padding-bottom: 10px; }
	h3, .h3 {font-size: 0.8em;}
	
	/*.hbsp_1{}*/
	.hbsp_2{margin-bottom: 12px;}
	
	.sz{width: 1280px; margin: auto;}
	
    .vertical_horizontal{
        overflow: inherit !important;
    }

/*---------------------------------------------------------------------------------------------*/
/*---END General Template - Default fonts, colors, margins, padding----------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Header------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	.admin_content .header_wrapper{margin-top: 52px;}
	.header_wrapper{ padding: 33px 40px; background: #022255; max-width: 1080px; margin: auto;}	
	.header_wrapper .custom_read_more:hover{background: #972E3C; color: #F5F5F5;}
	
	.logo{background: URL(../images/logo.png) no-repeat; width: 404px; height: 91px; display: block; background-size: contain;}
	.slogan{color: #f5f5f5; margin: 18px 0 0 18px; font-size: 1.5em; line-height: 1em; font-family: 'Roboto Condensed', sans-serif;}
	
	/*---------------------------------------------------------------------------------------------*/
	/*---Social | Top Icons------------------------------------------------------------------------*/
	/*---------------------------------------------------------------------------------------------*/
		
		.contact{font-size: 16px;color: #000; margin-top: 13px; background: URL(../images/phone.png) left no-repeat; height: 27px; width: 125px; text-align: right; font-weight: 300; font-family:'Open Sans', sans-serif;}
		.mail{font-size: 16px;color: #000; background: URL(../images/phone.png) left no-repeat; height: 27px; width: 125px; text-align: right; font-weight: 300; font-family:'Open Sans', sans-serif;}
		.beic{width: 46px; height: 46px; margin: 0 0 0 16px;}
		.beic a{width: 66px; height: 46px; background: URL(../images/book-online.png);display: block;}
		
		.beic_fb a{width: 46px;	height: 46px; background: URL(../images/facebook.png); display: block; margin: 0 0 0 8px;}
		.beic_bo a.hover{background: URL(../images/book-online.png) 0 -46px;}
		.beic_fb a.hover{background: URL(../images/facebook.png) 0 -46px;}
	
	/*---------------------------------------------------------------------------------------------*/
	/*---END Social | Top Icons--------------------------------------------------------------------*/
	/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---END Header--------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Menu--------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	.main_menu_wrapper{background: #4A4A4A; max-width: 1160px; margin: auto; position: relative; z-index: 4;}
	
	.main_menu_wrapper a, .menu.ui-sortable a
	{
		text-decoration: none; display: block; font-weight: normal;
		text-transform: uppercase;
		color: #f5f5f5; font-size: 14px; font-family: 'Roboto', sans-serif; 
		text-align: center;
		padding: 15px;
	}
	
	.main_menu_wrapper a:hover, .main_menu a.hover, .main_menu a.active{color: #4a4a4a;	background: #f5f5f5;}
	.main_menu a.active{color: #f5f5f5;	background: #888;}
	/*---------------------------------------------------------------------------------------------*/
	/*---Submenu-----------------------------------------------------------------------------------*/
	/*---------------------------------------------------------------------------------------------*/
	
		._sm_.vertical a
		{
			text-transform: uppercase; display: block;
			margin: 0;
			width: 158px;
			border: none;
			font-size: 15px;
			color: #505050;
			background: #eee;
			font-family: 'Open Sans', sans-serif; font-weight: 300;
			text-align: left;
			padding: 13px 22px;
		}
		
		._sm_.vertical a:hover{background: #666; color: #F5F5F5;}
		
		.vertical_horizontal{background: #4a4a4a;}
		.sma, .ssma{min-width: 208px;}	
		
		.menu .hover, .vertical_horizontal
		{
			-webkit-box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
			-moz-box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
			box-shadow: 0px 0px 37px 1px rgba(0,0,0,0.75);
		}
		
	/*---------------------------------------------------------------------------------------------*/
	/*---END Submenu-------------------------------------------------------------------------------*/
	/*---------------------------------------------------------------------------------------------*/
	
/*---------------------------------------------------------------------------------------------*/
/*---END Menu----------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Social | Top Icons------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	.topi				{padding-top: 16px;}		
	.soc_icons			{margin-left: 20px;}
	.soc_icons a		{font-family: Fontawesome; font-size: 20px; text-decoration: none; color: #972E3C; border-radius: 8px; background: #eee; text-align: center; width: 42px; margin: 0 0 0 6px; display: block; line-height: 1.8;}			
	.soc_icons a:hover	{color: #F5F5F5; background: #972E3C;}	
	.aftext				{font-family: Arial, Helvetica, sans-serif; font-size: 14px; padding: 6px 0 0 8px;}		
	._bn_ a				{width: 107px;}		
	.gf					{width: 60px !important; margin-left: 22px !important;}
	.gf div				{height: 12px; width: 60px;}
	.gf div.b			{background: #000; border-top-left-radius: 8px; border-top-right-radius: 8px;}
	.gf div.r			{background: #de0000;}
	.gf div.y			{background: #ffcf00; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}

/*---------------------------------------------------------------------------------------------*/
/*---END Social | Top Icons--------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Top Full Body Responsive------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	/*.area0{} .area0 h1{} .area0 h2{}*/
	
	.area0 .image_strip_td{padding: 0;	border: none;}
	.area0 .ss_ic div{margin-left: 0 !important;}
	.area0 .is_desc_top{display: none !important;}
	
	.lac.right_arrow .ra{left: -43px;}
	.lac .plp{left: -88px;}
	.lac.left_arrow .arrow{left: 6px; position: relative;}
		
	.area0 .sp{display: none;}
		
	.admin_content .area0{overflow:visible;}
	
	.area0{border: none ;margin:0;margin: auto;}
	
	.area0 .map_position{display: none ;}
	
	.area0 ._google_map_ ._c_{padding: 0 !important;margin: 0 ;border: none;}
	
	.area0 .google_maps_logo_position{display: none;}
	
	.area0{overflow: hidden}

/*---------------------------------------------------------------------------------------------*/
/*---END Top Full Body Responsive--------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Site Content------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	.area1, .area2, .area3, .area4, .area5{max-width: 1160px; margin: auto;}
	.area1 .foreground, .area2 .foreground, .area3 .foreground, .area4 .foreground, .area5 .foreground{ padding: 60px 0;}

	.area1{background: #F5F5F5; }
	
	.area2{background: #CCC;}
	.area2 h1{color: #444;} .area2 h2{color: #666;}
	
	.area3{background: #4a4a4a; color: #f5f5f5;}
	.area3 h1{color: #fff;} .area3 h2{color: #ccc;} .area3 a{color: #F2A9B2;}
	
	.area4{background: #eee; color: #515151; border-bottom: 1px #aaa solid;}
	.area4 h1{color: #515151; font-size: 22px;}
		
	.area5{background: #CCC; color: #515151; border-top: 1px #dadada solid;}
	.area5 a{color: #666;}
	
	.area7{color: #f5f5f5; margin: auto;text-align: center; background: #4a4a4a; border-top: 1px groove #CCC; padding-top: 20px;}
	.area7 a{color: #ccc;} .area7 .sp{height: 30px;}

    .day_number .text{top: 0 !important; transform: none; line-height: 80px;}

/*---------------------------------------------------------------------------------------------*/
/*---END Site Content--------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Link Button-------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	.custom_read_more
	{
		display:inline-block; font: Arial, Helvetica, sans-serif; padding:12px 18px;mposition:relative; text-decoration: none !important;
		background: #ddd; color:#333 !important;
		border-radius: 8px;
		margin-top: 5px;
	}
	.custom_read_more:hover{background:#022255;color:#f5f5f5 !important;}

/*---------------------------------------------------------------------------------------------*/
/*---END Link Button---------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Other-------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

	._facebook_ ._c_{background: none !important;}
	
	.top_icons .icon{font-family: Fontawesome; color: #972E3C; font-size: 22px;}
	.top_icons{font-size: 19px; margin: 5px 0 4px 0; text-align: right; float: right; color: #f5f5f5; font-family: 'Oswald', sans-serif; font}
	
	.header_wrapper > .sz > .fr{margin-top: 4px; width: 262px; float: right;}
	
	.events_back_button{color: #E9E9E9 !important;} 
	
/*---------------------------------------------------------------------------------------------*/
/*---END Other---------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------------------*/
/*---Respond-----------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/

    .menufull{margin: auto; display: table;}

    @media (min-width: 1440px) and (max-width: 10000px) {
        .mml{font-size: 14px !important; padding: 15px !important;}
    }
    @media (min-width: 1366px) and (max-width: 1439px) {
        .mml{font-size: 14px !important; padding: 15px !important;}
    }
    @media (min-width: 1268px) and (max-width: 1365px) {
        .mml{font-size: 14px !important; padding: 15px !important;}
    }
    @media (min-width: 1024px) and (max-width: 1267px) {
        .mml{font-size: 13px !important; padding: 11px !important;}
    }
    @media (min-width: 788px) and (max-width: 1023px) {
        .mml{font-size: 13px !important; padding: 9px !important;}
    }
    @media (min-width: 0) and (max-width: 995px) {
        .header_wrapper .sz > .fl{
            float: none !important;
            margin: auto;
            display: table;
        }
        .header_wrapper > .sz > .fr{
            float: none;
            margin: 32px auto 0 auto;
            display: table;
        }
        .header_wrapper{
            padding: 33px 0;
        }
    }
    @media (min-width: 0) and (max-width: 500px) {
        .header_wrapper .sz > .fl{
            float: none !important;
            margin: auto;
            display: table;
        }
        .header_wrapper > .sz > .fr{
            float: none;
            margin: 32px auto 0 auto;
            display: table;
        }
        .logo{width: 100%; background-size: 100%;}
        .slogan{margin: 10px auto 0 auto; font-size: 14px;}
    }

    .main_menu_wrapper .sz{width: auto !important; max-width: 100% !important;}
    .wparea, .header_wrapper, .main_menu_wrapper, .admin_content .wp_cd{max-width: 1160px; margin: auto;}

    .d6_wrapper{
        border-color: #972e3c !important;
    }

    .d6_footer-font-settings{background-color: #972e3c !important;}

    .d6_newstitle, .d6_calendartitle, .d6_resourcetitle, .d6_bold-arial{font-family: 'Roboto Condensed', sans-serif !important; font-size: 1.14em !important; color: #063271 !important; text-transform: none; line-height: 1.2;}
    .d6_newswidgetbody .d6_bold-arial::before{content: "Hoërskool Framesby - Nuus";} .d6_newstitle{display: none !important;}
    .d6_resourcewidgetbody .d6_bold-arial::before{content: "Hoërskool Framesby - Hulpbronne";} .d6_resourcetitle{display: none !important;}
    .d6_calendarwidgetbody .d6_bold-arial::before{content: "Hoërskool Framesby - Komende Gebeure";} .d6_calendartitle{display: none !important;}
    .d6_resourcepoweredby, .d6_newspoweredby, .d6_calendarpoweredby{display: none !important;}
    .d6_footer-link::before{content: "Aangedryf deur die School Communicator";}
    .d6_wrapper{width: 100% !important;}

    ._page_registrasievorm_ .area2 .sz{
        padding: 0 !important;
    }

    ._page_registrasievorm_ .area2 .foreground{
        padding: 0 !important;
    }

/*---------------------------------------------------------------------------------------------*/
/*---END Respond-------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/