/*
Theme Name: Literacy
Theme URI: http://flythemes.net/wordpress-themes/literacy-wordpress-theme/
Author: Flythemes
Author URI: http://flythemes.net
Description: Literacy theme is responsive WordPress theme for education, college, university, institute, organization, corporate, business and other industries. This is theme is fully responsive and compatible with the latest version of WordPress. This theme has nice features comes with the customizer. This theme is working well with the plugins like woocommerce, jetpack and contact form 7.  Check demo at: http://flythemesdemo.net/literacy/

Version: 1.0
License: GNU General Public License
License URI: license.txt
Text Domain: literacy
Tags: gray, black, dark, one-column, two-columns, right-sidebar, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, photoblogging

Literacy WordPress Theme has been created by Flythemes(flythemes.net), 2016.
Literacy WordPress Theme is released under the terms of GNU GPL
*/


*{ margin:0; padding:0; outline:none;}
body{ margin:0; padding:0; -ms-word-wrap:break-word; word-wrap:break-word; background-color:#fff; position:relative; font:400 14px/22px 'Arimo'; color:#5b5b5b;}
img{ margin:0; padding:0; border:none; max-width:100%; height:auto; }
section img{max-width:100%;}
h1,h2,h3,h4,h5,h6{ margin:0; padding:2px 0 2px;}
p{ margin:0; padding:0;}
a{ text-decoration:none; color:#060808;}
a:hover{ text-decoration:none; color:#03a9f5;}
ul{ margin:0 0 0 15px; padding:0;}
.clear{ clear:both;}
.center{ text-align:center; margin-bottom:40px;}
.middle-align{ margin:0 auto; padding:0; width:100%;}
.wp-caption{ margin:0; padding:0; font-size:13px; max-width:100%;}
.wp-caption-text, .screen-reader-text{ margin:0; padding:0;}
.sticky{ margin:0; padding:0;}
.gallery-caption{ margin:0; padding:0;}
.alignleft, img.alignleft {display: inline; float: left; margin-right:45px; margin-top:4px; margin-bottom:20px; padding:0; }
.alignright, img.alignright { display: inline; float: right; }
.aligncenter, img.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; margin-top:0; }
.comment-list .comment-content ul { list-style:none; margin-left:15px;}
.comment-list .comment-content ul li{margin:5px;}
.main-container ol{list-style-position:outside; margin-left:20px;}
.main-container ol li{margin:5px 0;}
.toggleMenu{display:none;}
.bypostauthor{ margin:0; padding:0;}
section{ padding:50px 0; position:relative;}
h2.section-title { font-family:'Oxygen'; font-size:50px; font-weight:700; padding:0 0 35px 0; text-align:center; display:table; margin-bottom:50px; color:#464646;}

#slider{ max-width:1400px; margin:0 auto; padding:0; position:relative;}
#slider .top-bar{ margin:0; padding:16px 0 20px; position:relative;}
#slider .top-bar h2{padding:10px 0 5px 25px; text-transform:uppercase; line-height:55px; font:700 55px 'Oswald'; color:#ffffff; text-align:center; background-color:rgba(0,0,0,0.3);}
#slider .top-bar p{ color:#ffffff; margin:0 0 10px 0; line-height:20px; padding:0 10px 15px; font:400 14px/25px 'Oxygen'; text-align:center; background-color:rgba(0,0,0,0.3);}

a.blog-more{ display:inline-block; font:700 20px 'Lato', sans-serif; padding:10px 30px; margin-top:21px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; -ms-border-radius:4px; margin-right:15px;}
a.read-more { padding:10px 20px; margin-top:21px; display:inline-block; font:700 20px 'Oxygen'; left:37%; position:relative; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px; -ms-border-radius:5px; text-transform:uppercase; border:2px solid #ffffff; color:#ffffff;}

.main-container{margin:0; padding:0;}
.container { width:100%!important; margin:0 auto;}

/** Topbar **/
#topbar { padding:0; background-color:/*#d6dee2*/#1E90FF;color:#ffffff;}
.top-left { margin:0px; float:left; text-align:left;padding-left:4%;/*font:500 110% 'Arimo';*/ color:#ffffff; text-align:center;}
.top-left a{  color:#ffffff; } 
.top-left p { float:left; display:inline-block; border-right:1px solid #b4bdc1; font:500 110% 'Arimo'; color:#ffffff; margin:0;text-align:center;padding:5px;}
.top-left p:last-child { border-right:none;}
.top-left p:first-child {/*margin-top:-10px;*/ }
.top-left .fa-envelope, .top-left .fa-phone { color:#ffffff!important; margin-right:10px; position:relative; top:2px;}

.top-right { margin:0; float:right;padding-right:3%; font:500 110% 'Arimo'; color:#ffffff; padding:5px 5%;}
.top-right ul { margin:0; padding:0;}
.top-right ul li p{ float:left; list-style:none; font:600 120% 'Arimo'; color:#ffffff;}
.top-right ul li a { color:#ffffff; /*padding:10px;*/}
.top-right ul li a:hover { color:#ffffff; background-color:#03a9f5;}

/** Header **/
#header { width:100%; padding:0; }
.logo h1 { padding-bottom:0; padding: 0; text-transform:uppercase; font-size:25px; font-family:'Oswald'; color:#000000; font-weight:bold;}
#header .logo .img p { font:400 12px 'Oxygen'; color:#2c3235; margin-top:5px;}
.toggle{display:none;}
.main-nav ul li a { font:400 14px 'Oxygen'; color:#4b555a;}

/**min-width:1000px**/
@media screen and (min-width:1000px){
	.main-nav ul { margin:12px 42px 12px 0; padding:30px 0 0 0; float:right;}  
	.main-nav ul li { list-style:none; display:inline-block;  position:relative;border-bottom:1px solid #c0beaa;}
	.main-nav ul li ul { display:none; width:240px; color:#fff;}
	.main-nav ul li.menu-item-has-children:hover a { background-color:#03a9f5;width:220px;}
	.main-nav ul li a {text-decoration:none; padding:28px 15px; text-align:left; /*text-transform:uppercase;*/ }
	.main-nav ul li a:hover {text-decoration:none; padding:28px 15px; color:#ffffff; background-color:#03a9f5;}
	.main-nav ul li:hover ul {display:block; position:absolute; background-color:#03a9f5; z-index:99; padding:1px 0; top:36px; }
	.main-nav ul li:hover ul li {display:block; padding-bottom: 8px; padding-top: 8px;}
	.main-nav ul li:hover ul li a { padding:8px 8px 0px 8px;  text-transform:capitalize;} 
	.main-nav ul li:hover ul li ul { display:none; width:275px;color:#fff;}
	.main-nav ul li:hover ul li:hover ul { display:block; position:absolute; z-index:999; padding:1px; left:100%; top:-30%; border-left:1px solid #c0beaa;}
	.main-nav ul li:hover ul li:hover ul li { display:block; }
	#header .main-nav ul li ul li a:hover, .main-nav ul li.current-menu-item a{ color:#ffffff;}
	#header .logo{float:left; padding-left:5%;}
#bigbar{margin:0; width:100%; display:block; text-align:center; background-color:#FF4500;font-size:80%;color:#fff;padding-top:8px;font-weight:500;padding-bottom:8px;
}
}


/* --------- Current Affairs --------- */
#current { margin:0 auto; padding:0; background-color:#171d20; max-width:1400px; }
.shaper { width:45%; height: 0; border-top: 70px solid #ff6600; border-right: 47px solid transparent; }
.handler { width:1170px; position:absolute; top:133px;}
.current-inner {padding-top:25px; padding-left:5%;}
.current-left { float:left; text-align:left;}
.current-left h3, .current-right h3  { padding-bottom:0; font:400 25px 'Oxygen'; color:#ffffff;}
.current-right { float:right; text-align:right;}
.current-right h3 a { color:#03a9f5;}
.current-right h3 a:hover { color:#ffffff;}



/** Blog post css **
-----------------------------------------------------------------*/
.comnt { height: 26px; line-height: 24px; padding: 0 0 0 5px; width:31% !important; float:left; }
.comnt a { color:#ee6133;}
.comnt a:hover { color:#626262;}
.blogposts a.blog-more{ color:#ffffff;}
.lastcols { margin-right:0 !important;}
.see-all-button {  border:1px solid #444; display:table; font-size:16px; font-weight:700; margin:50px auto 0; padding:10px 20px; text-align:center; text-transform:uppercase; transition: all 0.3s ease 0s; color:#f0efef;}
.see-all-button:hover { background:#ff8a00; border:#ff8a00 solid 1px; color:#fff;}

/* --------- Pages ------- */
.content-area{ width:100%; margin:0 auto; padding:0;}
/*.site-main{ width:100%; margin:0; padding:0; float:left;}*/
#sitefull{ width:100% !important;}
#nosidebar{ width:80%; margin:0 auto; float:none; text-align:center;}
/*#sidebar{ width:22%; margin:0; padding:0; float:right;}
#sitemain{ width:70%!important; margin:0; padding:0; float:left;}*/
.side-bar{ width:/*270px*/22%!important; margin:0; padding:0; float:right;}


/** ------ copyright css ------ **/
.copyright-wrapper {padding:20px 0; background-color:#343434;}
.copyright-wrapper .inner{width:100%; margin: auto;background-color:#343434; color:#fffafa; }
.copyright { margin:0; text-align:left; font:600 14px 'Oxygen';vertical-align:middle;}
/* ------ Contact Form ------ */

.wpcf7{ margin:0; padding:0; font:400 15px 'Oxygen'; color:#ffffff;}
.wpcf7 form{ margin:0; padding:0;}
.wpcf7 form span.last{ float:none !important;}
.wpcf7 form input[type="text"], .wpcf7 form input[type="email"], .wpcf7 form input[type="tel"], .wpcf7 form input[type="url"], .wpcf7 form input[type="date"], .wpcf7 form select, .leftdiv input[type="text"], .leftdiv input [type="url"], .leftdiv input[type="email"], .leftdiv input[type="tel"], .wpcf7 form textarea, .rightdiv textarea{ width:100%; background-color:#eff2f4; border:none; padding:10px; margin-top:15px; font:300 18px 'Oxygen'; color:#777777;}
.wpcf7 form textarea, .rightdiv textarea{height:156px; width:100%;}
.wpcf7 form input[type="checkbox"], .wpcf7 form input[type="radio"], .wpcf7 form input[type="file"]{ margin-top:10px; padding:0;}
span.wpcf7-list-item{ margin:0 15px 0 0 !important;}
.wpcf7 form input[type="submit"], #contact input[type="submit"]{font:400 15px 'Oxygen'; margin:25px 0 0 0; padding:5px 20px; border:none; color:#ffffff; border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; -webkit-border-radius:4px; cursor:pointer; background-color:#0fa5d9;}
.entry-content p input[type="submit"] { background-color:#03a9f5; border:none; padding:10px 20px; font:400 15px 'Oxygen'; color:#ffffff; border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; -webkit-border-radius:4px; cursor:pointer;}
.main-form-area p input[type="submit"] {background-color: #03a9f5; border: medium none; border-radius: 5px; color: #ffffff; display: block; font-size: 25px; margin: 2% auto 0; padding: 10px 50px; text-align: center;text-transform: uppercase; cursor:pointer;}

/* --- skills bar --- */

strong.doller { font-size:30px;}
.fa-usd { position:relative; top:-15px;}
.fa-check { font-weight:normal; position:relative; top:2px; margin-right:5px;}
.error_msg{padding:10px; background:#ffd3ce; color:#e00; border:1px #e00 solid; margin:15px 0;}
.success_msg{padding:10px; background:#dcffc5; color:#070; border:1px #070 solid; margin:15px 0;}
.spacer20{height:20px; clear:both;}
.pagination{display:table; clear:both;}
.pagination ul{list-style:none; margin:20px 0;}
.pagination ul li{display:inline; float:left; margin-right:5px;}
.pagination ul li span, .pagination ul li a{background:#171d20; color:#fff; padding:5px 10px; display:inline-block;}
.pagination ul li .current, .pagination ul li a:hover{background:#ff8a00;}
h1.entry-title, h1.page-title{padding-bottom:20px; font-size:30px; /*text-transform:uppercase;*/}
article.tag-sticky-2{background:#f6f6f6; padding:10px;}
article img{height:auto;}
article p{margin:0;}
.post-date{display:inline;}
.post-comment{display:inline;}
.post-categories{display:inline;}
.post-tags{display:inline;}
form.search-form{margin-bottom:15px;}
input.search-field, .post-password-form input[type=password]{border:1px #eee solid; padding:4px;}
input.search-submit, .post-password-form input[type=submit]{border:none; color:#ffffff; padding:4px 10px; cursor:pointer;}
form#commentform input[type="submit"]{ padding:10px 15px; border:none; cursor:pointer; margin-top:15px; color:#ffffff;}
form#commentform label{ vertical-align:top;}
aside.widget{margin-bottom:30px;}
aside.widget ul{ list-style:disc; margin-left:13px;}
.nav-previous{float:left; margin-top:10px; margin-bottom:10px;}
.nav-next{float:right; margin-top:10px; margin-bottom:10px;}
nav.post-navigation{padding:10px 0 20px;}
.webicon{font-size:20px;}
#sidebar ul li{margin:5px 0;}
.comment-list, ol.comment-list{list-style:none; margin-left:0; margin-top:20px; margin-bottom:20px;}
.comment-list ul, ol.comment-list ul{list-style:none;}
.comment-list li.comment{margin-top:20px;}
.comment-list .comment-content h1, .comment-list .comment-content h2, .comment-list .comment-content h3, .comment-list .comment-content h4, .comment-list .comment-content h5, .comment-list .comment-content h6{margin-top:15px;}
h3.widget-title{ font-size:18px; border-bottom:1px solid #cccccc; padding-bottom:15px; margin-bottom:15px; text-transform:capitalize;}
.blog-post-repeat{ border-bottom:1px solid #cccccc; margin-bottom:40px;}

/* woocommerce */
a.added_to_cart{background:#e1472f; padding:5px; display:inline-block; color:#fff; line-height:1;}
a.added_to_cart:hover{background:#000000;}
a.button.added:before{content:'' !important;}
#bbpress-forums ul li{padding:0;}
#subscription-toggle a.subscription-toggle{padding:5px 10px; display:inline-block; color:#e1472f; margin-top:4px;}
textarea.wp-editor-area{border:1px #ccc solid;}
.woocommerce input[type=text], .woocommerce textarea{border:1px #ccc solid; padding:4px;}
form.woocommerce-ordering select{ padding:5px; color:#777777;}
.woocommerce table.shop_table th, .woocommerce-page table.shop_table th{ font-family:'Oxygen'; color:#ff8a00;}
.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price{ color:inherit !important;}
h1.product_title, p.price{ margin-bottom:10px;}
a.blogthumbs img{ width:100%;}
.fa::before, fa::after{ display:table-cell; vertical-align:middle;}

/*joanne*/
#bigbar{margin:0; width:100%; display:block; height:45px; text-align:center; background-color:#FF4500;font-size:150%;color:#fff;padding-top:2px; font-weight:600;padding-bottom:6px;vertical-align:middle;}
#frameheight{min-height:380px!important; height:90%!important; width:80%; min-width:24em; padding-top:0;margin-top:-5px!important;background-color:#fff!important;}

/*Popup*/
#PopupDiv {
	top: 250px;}

#PopupDiv img {
	border: none;
        width:100% !important; min-width:24em!important;}
.footer-mega-col{
    background: black; /* For browsers that do not support gradients */    
    background: -webkit-linear-gradient(left top, black, grey); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, black, grey); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, black, grey); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, black, grey); /* Standard syntax (must be last) */
}
.footer-mega-col h3{font-size:1.2em;color:#ffffff;padding-top:5px;font-weight:600;padding-left:20px;}
.footer-mega-col .textwidget{font-size:1em;color:#d3d3d3;padding-top:0;font-weight:500;padding-left:20px;}
.footer-mega-col .textwidget a{font-size:1em;color:#d3d3d3;padding-top:0;font-weight:500;}
/*---table for footer * the Fontpage courses-----*/
table {
    border-collapse: collapse;
    border-spacing: 0;
    /*width: 80%;*/
    /*border: 1px solid #343434;*/
    margin:auto;
    padding-top:10px;
}

table th {
    border: none;
    text-align: center;
    padding: 3px;
    background-color:#F8F071;
}
table td {
    border: none;
    
    } 

/*  GO FULL WIDTH BELOW 480 PIXELS*/
/* Mobile Landscape View */
@media only screen and (max-width: 480px){
	/*  Responsive column in front SECTIONS  */
.section {
	clear: both;
	padding:2px 0;
	margin:0 auto;
        width:98%;
        text-align:center;
        text-transform: uppercase; 
        color: #FF4500;       
            
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin:0.5% 0 0.5% 1.6%;
        border:solid 1px #ddd;
        /*background-color:#F8F071;*/
        font-size:8.5px!important;
        height:auto;
        padding-top:0;
        font-weight:600;
       line-height:10px;
}
.col:first-child { margin-left:0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF FOUR  */
.span_4_of_4 {
	width: 100%;
}
.span_3_of_4 {
	width: 74.4%;
}
.span_2_of_4 {
	width: 49%;
}
.span_1_of_4 {
	width: 23.6%;
}
#frameheight{min-height:380px!important; height:90%!important; width:80%!important; min-width:24em !important; padding-top:0;margin-top:-5px!important;background-color:#fff!important;}

/*Popup*/
#PopupDiv {
	top:380px!important;
        width:95%!important; min-width:18em!important;
         margin-left:50%!important;}

#PopupDiv img {
	border: none;
        width:100%!important; min-width:18em!important;}

}

/*  Responsive column in front SECTIONS  */
@media screen and (min-width: 1000px) {
.section {
	clear: both;
	padding:0;
	margin:auto;
        width:90%;
        text-align:center;
        text-transform: uppercase; 
        color: #FF4500;  
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
        border:solid 1px #ddd;
        /*background-color:#F8F071;*/
        height:auto;
        padding-top:0;
        
}
.col img{width:290px;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF FOUR  */
.span_4_of_4 {
	width: 98%;
}
.span_3_of_4 {
	width: 74%;
}
.span_2_of_4 {
	width: 49%;
}
.span_1_of_4 {
	width: 23%;
}

}
/*  GO FULL WIDTH BELOW 480 PIXELS
@media only screen and (max-width: 480px){
	.col {  margin: 1% 0 1% 0%; }
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
}*/
/*content body*/
.pagecontent p{padding-left:5%;padding-top:10px;padding-bottom:6px; 
}
.colour{padding-left:2px; font-size: 140%; padding-top: 12px;color:#008B8B; margin-bottom:2px;margin-left:0px;
}
hr {width:50%; height: 0;
	margin-top:0.2em;
	margin-bottom: 0.2em;
        margin-left:1em; 
	border: 0;
	border-bottom: 1px solid #eee;
}

/*---Flex-table---*/

    @media only screen and (max-width: 800px) {
    	
    	/* Force table to not be like tables anymore */
    	#no-more-tables table, 
    	#no-more-tables thead, 
    	#no-more-tables tbody, 
    	#no-more-tables th, 
    	#no-more-tables td, 
    	#no-more-tables tr {
    	display: block; 
    	}
     
    	/* Hide table headers (but not display: none;, for accessibility) */
    	#no-more-tables thead tr { 
    		position: absolute;
    		top: -9999px;
    		left: -9999px;
    	}
     
    	#no-more-tables tr { border:0; }
     
    	#no-more-tables td { 
    		/* Behave  like a "row" */
    		border: none;
    		border-bottom: 1px solid #eee; 
    		position: relative;
    		padding-left: 50%; 
    		white-space: normal;
    		text-align:left!important;
    	}
     
    	#no-more-tables td:before { 
    		/* Now like a table header */
    		position: absolute;
    		/* Top/left values mimic padding */
    		top: 6px;
    		left: 6px;
    		width: 45%; 
    		padding-right: 10px; 
    		white-space: nowrap;
    		text-align:left;
    		font-weight: bold;
    	}
     
    	/*
    	Label the data
    	*/
    	#no-more-tables td:before { content: attr(data-title); }
    }