/*
--------------------------------------
        Cascading Style Sheets 
            Θρησκευτικά
            Α' Γυμνασίου
            21-0188-01b
            ΙΤΥΕ ΔΙΟΦΑΝΤΟΣ
            Μάρτιος 2018
--------------------------------------
*/

/*
--------------------------------------
        General Styles 
--------------------------------------
*/
div, dl, dt, dd, ul, ol, li {
	margin: 0;
	padding: 0;
	border-width: 0;
}
body {
    color: #000;
    background-color: #fff;
	font-family: "Calibri", sans-serif;
	font-size: 12pt;
    margin: 0;
    padding: 0;
    text-align: justify;
}
p {
	margin-left: 0;
	margin-top: 0px;
	margin-bottom: 0;
	padding-right: 0;
}
.indent{
    text-indent: 1%;
}
/*
--------------------------------------
        Heading Styles 
--------------------------------------
*/
h1{
    background: linear-gradient(#F6F9FD, #BDD7F0);
    color: #D2232A;
    font-family: "Calibri", sans-serif;
    font-size: 18pt;
    font-weight: bold;
    margin-bottom: 2%;
    margin-right: 7%;
    margin-top: 7%;    
    padding-bottom: 2%;
    padding-right: 5%;
    padding-top: 1%;
    text-align: right;
}
h1 span{
    color: #298DCC;
}
h2{
    background: linear-gradient(#F4F8FD, #BDD7F0);
    color: #D2232A;    
    font-size: 13pt;
    padding: 1% 0;    
    text-align: center;
}
h3{
    color: #D7193E;
    font-size: 14pt;  
    padding: 1%;
    text-align: center;
}
h4{
    color: #D7193E;
    font-size: 14pt;
    text-align: right;
}
h5{
    background-color: #298DCC;
    color: white;
    font-size: 12pt;     
    margin: 1% 0;
    padding: 0.5%;
}
h6{
    font-size: 12pt;
    margin-top: 1%;
    margin-bottom: 1%;    
}

.ch3 h4{
    color: #298DCC;
    font-size: 13pt;
    text-align: right;
} 
.red-title{
    color: #D7193E;    
    font-size: 13pt;
    font-weight: bold;
    text-align: right;    
}
.blue-title{
    color: #298DCC;
    font-weight: normal;
    font-size: 12pt;
}
/*
--------------------------------------
        Page container 
--------------------------------------
*/
.page-container{
    background-color: #fff; 
	margin: 20px auto;
    overflow: auto;    
	padding: 100px;    
	width: 700px;   
}
/*
--------------------------------------
        Images 
--------------------------------------
*/
.cover img, .figure img {
	display: block;
    width:100%;
}
.figure {
    margin: 2%;
}
.figcaption {
    font-size: 10pt;
    padding: 1%;
    text-align: right;
}
.figcaption span {
    font-style: italic;
}
#image24 {
    color:white;
    left: 50%;    
    margin-top: -50px;     
    position:absolute;
    transform: translate(-50%, -50%);
}

/*
--------------------------------------
        Floats and alignment 
--------------------------------------
*/
div.center {
    margin: auto;
}
.fright {
    float: right;
}
.fleft {
    float: left;
}
.clear-both {
    clear: both;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
.clear-left {
    clear: left;
}
.clear-right{
    clear: right;
}
.tcenter{
    text-align: center;
}
.tright{
    text-align: right;
}
.tleft{
    text-align: left;
}
/*
--------------------------------------
        Exercises: 
Για το πλαίσιο των ασκήσεων
--------------------------------------
*/
.exercises {
    background-color: #B9D6F0;
    margin: 1%;
    padding: 1% 1% 1% 0;
}
.exercises p.subtitle{
    color: #000;
    font-size: 12pt;
    font-weight: bold;
    font-style: normal;
    padding-left: 3%;
    text-align: left;
}
.exerc-title{
    font-size: 13pt;
    font-weight: bold;
    padding-bottom: 1%;
    text-align: center;
}
.exercises ul > li::before {     
	content: "•";
    margin-right: 2%;
}
.exercises ul > li{
    list-style-type: none;
    margin-left: 3%;
}
.exercises ul::before{
    margin: -20px;
}
.exercises ol li{
    margin-left: 35px;
}
/*
--------------------------------------
        Notes: 
Για το πορτοκαλί πλαίσιο
--------------------------------------
*/
.notes{
    background-color: #FDD1B0;
    font-size: 10pt;
    margin: 1%;    
    padding: 1%;
}
.notes-title{
    font-weight: bold;
    margin: 0;
    text-align: center;
} 
.notes-subtitle{
    font-weight: bold;
    text-align: left;
} 
/*.notes ul li{*/
/*    margin-left: 35px;*/
/*}*/
ol.contents > li {
    font-weight: bold;
    list-style-type: upper-roman;
    margin: 2% 0 2% 3%;
    text-align: justify;
}
.contents ul > li {
    font-weight: normal;    
    list-style-type: none;    
}
.contents li p{
    font-weight: normal;
}
.contents ul > li::before {
	content: "•";
    margin-right: 1%;    
}
.contents ul > li > ul > li{
    font-weight: normal;    
    margin-right: 4%;
    list-style-type: none;    
}
.contents ul > li > ul > li::before {
	content: "-";
    margin-right: 1%;    
    margin-left: 4%;     
}
.notes ol {
    margin-left: 2%;
}

/*
--------------------------------------
        Width and Padding Styles
--------------------------------------
*/
.widthinherit{
    width: inherit;
}
.width100{
    width: 100%;
}
.width85{
    width: 85%;
}
.width80{
    width: 80%;
}
.width75{
    width: 75%;
}
.width70{
    width: 70%;
}
.width65{
    width: 65%;
}
.width60{
    width: 60%;
}
.width50{
    width: 50%;
}
.width47{
    width: 47%;
}
.width45{
    width: 45%;
}
.width42{
    width: 42%;
}
.width38{
    width: 38%;
}
.width35{
    width: 35%;
}
.width30{
    width: 30%;
}
.width25{
    width: 25%;
}
.width20{
    width: 20%;
}
.width15{
    width: 15%;
}
.width10{
    width: 10%;
}
.padding-30{
    padding: 30%;
}
.padding-top-60{
    padding-top:60%;
}
.padding-top-50{
    padding-top:50%;
}
.padding-top-40{
    padding-top:40%;
}
.padding-top-35{
    padding-top:35%;
}
.padding-top-32{
    padding-top:32%;
}
.padding-top-30{
    padding-top:30%;
}
.padding-top-25{
    padding-top:25%;
}
.padding-top-22{
    padding-top:22%;
}
.padding-top-20{
    padding-top:20%;
}
.padding-top-17{
    padding-top:17%;
}
.padding-top-13{
    padding-top:13%;
}
.padding-top-12{
    padding-top:12%;
}
.padding-top-11{
    padding-top:11%;
}
.padding-top-10{
    padding-top:10%;
}
.padding-top-5{
    padding-top:5%;
}
/*
--------------------------------------
        General Styles
--------------------------------------
*/
.italics{
    font-style: italic;
}
.poem-center{
    margin: auto;
    width: 42%;
}
.poem-center p{
    font-style: italic;
	text-align:left;
}
.poem p{
    font-style: italic;
    margin: auto;
}
.footnote{
    font-size: 9pt;
    font-style: normal;    
    text-align: right;
}
.footnote span{
    font-style: italic;
}
.two-column{
    column-count: 2;
}
#table-xrisma{
    width: 100%;
}
#table-xrisma th{
    background-color:  #D1D2D4;
    padding: 1%;    
}
#table-xrisma td{
    background-color:  #E7E7E8;
    font-style: italic; 
    padding: 1%;
    width: 50%;    
}
.subtitle{
    color: #298DCC;    
    font-size: 12pt;
    font-style: italic;
    font-weight: bold;    
    text-align: right;
}
p.subtitle ~ p.footnote{
    color: #298DCC;   
}
ul li{
    list-style-type: none;   
}
ul li::before{
    content: "•";
/*    margin-left: 3%;*/
    margin-right: 2%; 
}
#p121-poem{
    width: 100%;
    height: 300px;
    background: url('../images/img5_13.jpg') no-repeat;
}
.ch6 .figcaption{
    text-align: left;
} 
#table-p143{
    width: 100%;      
}
#table-p143 th{
    background-color: #B9D6F0;    
    color: #2C6494;
    padding: 1%;    
    text-align: center;    
}
#table-p143 td{
    background-color: #B9D6F0;    
    padding: 1%;
    width: 50%;
}
#believe{
    font-style: italic;
    padding-left: 3%;
}
/*
--------------------------------------
        Parartima
--------------------------------------
*/
.par p{
    font-size: 9pt;
}
.par li{
    font-size: 9pt;    
    list-style-type: disc;
    list-style-position: outside;
    margin-left: 3%;
}
.par li::before{
    content:"";
    margin-left: 0;
    margin-right: 0;
}
.par a{
    color: #298DCC;
}
.par-title{
    font-weight: bold;
    font-size: 14pt;
    text-align: center;
}
.par-subtitle{
    color: red;
    font-size: 9pt;
    font-weight: bold;
    margin: 3% 0 2% 0;
}
.theme-unit{
    font-size: 9pt;
    font-weight: bold;
}



/*
--------------------------------------
        Index
--------------------------------------
*/
.cover{
    margin: 0 auto;
    width: 900px;
}
.book-title-1{
    font-size: 18pt; 
    margin: 15%;
	text-align: center;    
}
.book-title-2{
    font-size: 18pt; 
    font-weight: bold;
    margin: 10% 0 5% 0;    
	text-align: center;    
}
.book-title-3{
    font-size: 18pt;   
    padding-top: 2%;
    padding-bottom: 25%; 
	text-align: center;
}
.book-title-4{
	text-align: center;    
}
.book-title-5{
    font-size: 14pt;
	font-weight: bold; 
    margin-top: 25%;    
	text-align: center;    
}
.book-title-6{
    font-size: 16pt;
	font-weight: bold; 
    margin-top: 5%;    
	text-align: center;    
}
.book-title-7{
    font-size: 12pt;     
	text-align: center;    
}
.book-title-8{
    font-size: 12pt; 
    margin-top: 5%;  
    margin-bottom: 5%;
	text-align: center;    
}
.publication {
	font-size: 14pt;
	text-align: center;
}
.institute {
	font-size: 14pt;
    margin-top: 45%;
	text-align: center;
}
.date {
	font-size:14pt;
	text-align:center;
}
.shadow{
	box-shadow: 5px 5px 5px #D1D2D4;    
}
.per .footnote{
    font-style: italic;    
    letter-spacing: 3px;
    margin: 5% 0;
}
.index-heading{
    color: #298DCC;
    font-size: 20pt;
    font-weight: bold;
}
.chapters{
    background-color: #298DCC;
    color: #fff;
    font-size: 16pt;
    font-weight: bold;
    padding: 2%;
}
.index-law{
    font-family: "Arial", sans-serif;
    font-size: 9.8pt; 
    line-height: 1.5;
}
.margin{
    margin:2%;
}

img[src^="icons/"]  {
	width:26px;
	padding:0 3px;
	display:inline;
	}