/*
--------------------------------------
        Cascading Style Sheets 
            Θρησκευτικά
            Γ' Γυμνασίου
            21-0190-01
            ΙΤΥΕ ΔΙΟΦΑΝΤΟΣ
            Μάρτιος 2018
--------------------------------------
*/

/*
--------------------------------------
        General Styles 
--------------------------------------
*/
div, dl, dt, dd, ul, ol, li {
	margin: 0;
	padding: 0;
	border-width: 0;
}
.text-brown{
	color:#813838;
}
body {
    color: #000;
    background-color: #fff;
	font-family: "Calibri", sans-serif;
	font-size: 12pt;
    margin: 0;
    padding: 0;
    text-align: justify;
}
.page-container p {
	margin:auto;
	padding-right: 0;
	text-indent: 2%;
}
.par-title{
	font-size:17px;
	text-align:left;
	color:#000;
	text-indent: 0;
	font-family: Calibri;
}
.par-p{
	font-size:12px;
	text-align:left;
	color:#000;
	text-indent: 0;
	font-family: Calibri;
}
.par-p span{
	 font-style: italic;
}
.no-indent{
    text-indent: 0;
}
.indent {
	font-style: normal;
	padding-left:15px;
    padding-top: 25px;
    padding-right: 50px;
    padding-bottom: 0px;
    font-size:17px;
	line-height:150%;
	text-indent:2%
}
.indent1{
	text-indent:4%;
}
.indent2{
	text-indent:8%;
}
.index-law{
    font-family: "Arial", sans-serif;
    font-size: 9.8pt; 
    line-height: 2;
    padding: 25%;
	text-indent:0%
}
.notes{
    background-color: #E8E1EC;
    border: solid 1px #604A7C;
    padding: 2%;
    margin-top: 8%;
}
.notes > div{
    background-color: #604A7C;
    color: #fff;
	font-family: "Calibri", sans-serif;  
    font-size: 16pt;
    font-weight: bold;
    height: 20%;
    margin: auto;    
    padding-top: 1%;
    padding-bottom: 1%;
    position: relative;
    text-align: center;    
    top: -35px;
    width: 30%;    
}
.notes ul{
    list-style-type: none;
    margin-left: 3%;
}
.notes ul li::before{
    content: "-";
    margin-right: 1%;
}
.notes2{
    background-color: #FBEBDA;
    border: solid 1px #984A22;
    padding: 2%;
    margin-top: 8%;
}
.footnote{
    font-size: 10pt;
    text-align: right;
    margin-bottom: 2%;
}
.footnote span{
    font-style: italic;
}
#ol-start-5{
    list-style: none;
    counter-reset: item 4;
  }
#ol-start-5 li::before {
    counter-increment: item;
    content: counter(item)".";
    margin-right: 1%;
  }
.exercises{
    background-color: #FBD4B3;
    border: solid 1px #984A22;
    margin-bottom: 2%;
    margin-top: 6%;    
    padding: 2%;
}
.exercises ol{
    list-style-position: inside;
}
.exerc-title{
    background-color: #984A22;
    color: #fff;
    font-weight: bold;
    margin: auto;
    padding:1%;
    position: relative;
    text-align: center;
    top:-30px;
    width: 30%;
}
.exerc-title-2{
    background-color: #984A22;
    color: #fff;
    font-weight: bold;    
    margin: auto;
    padding:1%;
    position: relative;
    text-align: center;
    top:-30px;
    width: 50%;
}
.purple{
	color:#604A7C;
	font-size:20px;
}
.box{
	background-color: #F3F3F4;
    border: solid 1px #000000;
    margin-top: 0.5%;    
    padding: 0 1% 3%;
	height:210px;
	width:411px;

}
.black-box{
	background-color: #fff;
    border:2px solid  #000000;
	width:700px;
	padding:15px;
}
.orange-box{
	background-color: #FBEBDA;
    border: solid 1px #000000;
	height:643px;
	width:700px;
	padding:5px;
}
.orange-box-2{
	background-color: #FBEBDA;
    border: solid 1px #000000;
	height:380px;
	width:700px;
	padding:5px;
}
.orange-box-3{
	background-color: #FBEBDA;
    border: solid 1px #000000;
	height:250px;
	width:700px;
	padding:5px;
}
.orange-box-4{
	background-color: #FBEBDA;
    border: solid 1px #000000;
	height:450px;
	width:700px;
}
.orange-box-5{
	background-color: #FBD4B3;
    border: solid 1px #000000;
	height:315px;
	width:700px;
}
#poem{
    width: 91%;
    height: 500px;
    background: url('../images/img3_14.jpg') no-repeat;
	background-size: cover;
	padding:25px;
	padding-left:15px;
    padding-top: 25px;
    padding-right: 50px;
    padding-bottom: 0px;
	font-size:17px;
}
#poem-5{
	width: 91%;
    height: 550px;
    background: url('../images/img5_23.jpg') no-repeat;
	background-size: cover;
	padding:25px;
	padding-left:15px;
    padding-top: 25px;
    padding-right: 50px;
    padding-bottom: 0px;
	font-size:17px;
}
.work{
    background-color: #fff;
    border: solid 1px #604A7C;
    margin-bottom: 2%;
    margin-top: 9%;    
    padding: 1%;
	padding-left:0%;
}

.work-title{
    background-color: #604A7C;
    color: #fff;
    font-weight: bold;    
    margin: auto;
    padding:2%;
    position: relative;
    text-align: center;
    top:-54px;
    width: 97%;
	font-size:22px;
}
.line-space{
	line-height:1.5;
}

.laugh-title{
	background-color: #604A7C;
    color: #fff;
    font-weight: bold;
	font-size:20px;
    margin: auto;
    padding:2%;
    position: relative;
    text-align: center;
    top:-23px;
    width: 28%
}
.column {
	background-color: #604A7C;
    height: 90px;
    margin-left: 84%;
	margin-top: -12%;
    width: 15px;
	background-color: #984A22;
}

.cinema-title{
	background-color: #FBD4B3;
    color: #984A22;
    font-weight: bold;
    margin: auto;
    padding:2%;
    text-align:center;
    top:-12px;
    width: 20%;
	border:1px solid #984A22;
	border-radius: 12px;
	margin-left: 73%;
	margin-top: -9%;
}

/*
--------------------------------------
        Heading Styles 
--------------------------------------
*/
.thematic{
    background-color: #604A7C;
    border-radius: 8px; 
    display: table; 
    font-weight: bold;
    height: 40px;
    left: -20px;
    position: relative;
    top: 20px;    
    text-align: center;
    width: 30%;
    margin-bottom:2px; 
}
.thematic p{
    color: #fff;
    display: table-cell;
    vertical-align: middle;    
}
.header{
    background-color: #CBC0D9; 
    border-radius: 8px;    
    display: table;
    width: 90%;
    height: 100px;    
    text-align: center;
}
.header-columns{
    background-color: #604A7C;
    height: 150px;
    margin-left: 20%;
    width: 38px;
}
.ch3 h4{
	text-align:center;
}
.page-container h1{
    background-color: #CBC0D9;
    border-radius: 15px;    
    color: #604A7C;
	font-family: "Calibri", sans-serif;
    font-size: 18pt;
    display: table-cell;
    vertical-align: middle;
	padding-right:1%;
}

.page-container h1 span{
    font-size: 28pt;
    font-weight: bold;
}
.ch7 h1 span{
	font-size: 14pt;
    font-weight: normal;
}
.page-container h2{ 
    background-color: #604A7C;
    border-radius: 8px;
    color: #fff;
	font-family: "Calibri", sans-serif;    
    font-size: 16pt;
    height: 20%;
    margin: auto;    
    padding-top: 1%;
    padding-bottom: 1%;
    text-align: center;
    width: 30%;
}
.page-container h3{
    background-color: #604A7C;
    border-radius: 8px;  
    color: #fff;
    font-size: 16pt;  
    padding: 1%;
    text-align: center;    
}
.h3-number{
    background-color: #B1A1C8;
    border-radius: 3px;    
    bottom: -35px;
    font-weight: bold;
    left: -10px;
    padding: 1% 0;
    position: relative;    
    text-align: center;
    width: 8%;
}
.page-container h4{
    background-color: #CBC0D9;
    border-radius: 5px;
    color: #604A7C;
    font-size: 14pt;
    font-weight: normal;    
    margin: 3% 0 2% 0;
    padding: 1%;    
    text-align: left;    
}
.page-container h5{
    font-size: 12pt; 
    margin: 3% 0% 2% 0;
}
.page-container h5 span {
	font-weight:normal;
}
.page-container h6{
    font-size: 12pt;
}

/*
--------------------------------------
        Page container 
--------------------------------------
*/
.page-container{
    background-color: #fff; 
	margin: 20px auto;
    overflow: auto;    
	padding: 100px;    
	width: 700px; 
	line-height:150%; 
}
/*
--------------------------------------
        Images 
--------------------------------------
*/
.page-container img {
	display: block;
}
.icons img{
    display:inline-block;
}

.figure{
    margin: 2%;
}
.figcaption {
    font-size: 10pt;
    text-align: center;
	line-height:125%;
	padding:4px 0;
}
.figcaption span{
    font-style: italic;
}
#image{
	background-color:#E8E1EC;
	padding-top:2%;
	padding-bottom:3%;
	top:1%;
	width:70%;
}

/*
--------------------------------------
        Floats and alignment 
--------------------------------------
*/
.center {
    margin-left: auto;
    margin-right: 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;
}
#text-align{
	text-align:center;
}
.center-text{
	text-align: center;
	font-size:17px;
}

/*
--------------------------------------
        Height, Width and Padding Styles
--------------------------------------
*/
.widthinherit{
    width: inherit;
}
.padding-top-2{         
    padding-top:2%;
}
.padding-left-2{         
	padding-left:2%;
}
.padding-left-3{ 
	padding-left:3%;
}
.padding-left-8{        
	padding-left:8%;
}
.padding-left-12{            
	padding-left:12%;
}
.padding-left14{
	padding-left:14%; 
}
.padding-left-48{ 
	padding-left:48%;             
}
.padding-left-63{               
	padding-left:63%;
}
.padding-right-8{           
	padding-right:8%;
}
.padding-right-12{                 
	padding-right:12%;
}
/*
--------------------------------------
        Lists
--------------------------------------
*/
.contents > li {
    font-weight: bold;
    list-style-type: upper-roman;
    margin: 2% 0 2% 3%;
    text-align: justify;
}
.contents ol > li {
    font-weight: normal;    
    list-style-type: none;    
}
.contents li p{
    font-weight: normal;
}
.roman {
    counter-reset: list;
}
.roman > li {
    font-weight: normal;        
    list-style: none;
    margin-left: -10px;
}
.roman > li:before {
    content: counter(list, lower-roman )"." ;
    counter-increment: list;
    margin-right: 2%;    
    text-align: justify;
}
.dashed-list{
    list-style-type: none;    
}
.dashed-list li::before{
    content: "-";
    margin-right: 1%;
    margin-left: 3%;    

}
.disc > li {
	list-style-type:disc;
	font-weight:normal;
	margin-left:25px;
}
.lists > li {
	list-style-type:disc;
	font-weight:normal;
	margin-left:25px;
	font-size:12px;
	font-family: Calibri;
}
.lists span{
    font-style: italic;
}
.list {
	list-style-type:none;
}

/*
--------------------------------------
        Tables
--------------------------------------
*/

.table-5{
	border-collapse: collapse;
	background-color:#FBEBDA;
	border:solid 1px #000;
	width:700px;
	height:300px;
}
.table-5 td{
    border-top: 1px solid;
    padding-top: 2%;
    padding-left:8%;
	padding-right:8%;
	padding-bottom:2%;
}

.table-5 tr > td:first-child{
    border-right: 1px solid;
}

/*
--------------------------------------
        Cover
--------------------------------------
*/

.cover1{
    margin: 0 auto;
    width: 650px;
}
.cover2{
    margin: 0 auto;
    width: 720px;
}

.per .page-container{
    min-height: 900px;
    overflow: hidden;
}

.book-title-1{
    font-size: 18pt; 
    
    padding-top: 25%;
	text-align: center;  
	margin-bottom:30px;  
}
.book-title-2{
    font-size: 18pt; 
    font-weight: bold;
    margin: 10% 0 0 0;    
	text-align: center;    
}
.book-title-3{
    font-size: 18pt;   
    font-weight: normal;    
    padding-bottom: 45%; 
	text-align: center;
}
.book-title-5{
    font-size: 14pt;
	font-weight: bold; 
    padding-top: 22%;    
	text-align: center;    
}
.book-title-6{
    font-size: 16pt;
	font-weight:normal; 
    padding-top: 25%;    
    padding-bottom: 35%;
	text-align: center;    
}
.book{
	color:#604A7C;
	background-color:#fff;
	font-size:22px;
	font-family: "Calibri" sans-serif;
	text-align:center;
}
.small{
	font-size:14pt;
}
.publication {
	font-size: 14pt;
	text-align: center;
}
.institute {
	font-size: 14pt;
    margin-top: 25%;
	text-align: center;
}
#periex{
	font-family: "Calibri", sans-serif;
	font-size:11,5pt;
	line-height:140%;
	padding-top:1%;
	no-indent
}


#periex a:link {
	color:#000000;
	text-decoration:underline;
	text-decoration-color:#000000;
	font-size:12pt;
	font-weight:italic;
}
#periex a:hover{
	color:#000000;
	text-decoration:underline;
	text-decoration-color:#000000;
	font-size:12pt;
	font-weight:italic;
}
#periex a:visited {
	color:#000000;
	text-decoration:underline;
	text-decoration-color:#000000;
	font-size:12pt;
	font-weight:italic;
}

img[src^="icons/"]  {
	width:26px;
	padding:0 3px;
	display:inline;
	}