* {
    margin:0;
    padding:0;
    font-family:arial;
    box-sizing:border-box;
}

h1, h2, h3, h4 {
    margin-bottom:10px;
}

h2 {
    font-style:italic;
}

h3 {
    text-align:left;
}

p {
    margin-top:10px;
    text-indent: 0;
}

a:hover {
    color: #ff0000; /* Цвет активных ссылок */
    text-decoration:underline;
   }

.programs {
    background: rgb(240 240 250 );
    margin-top:15px;
    margin-left:auto;
    margin-right:auto;
    padding:20px 25px 10px;
    box-shadow: 5px 5px 5px rgba(0,0,100,0.3);
    width:98%;
    border-radius:10px;
}


header {
    text-align:center;
    background: rgba(0, 0, 100, .4);
    height:140px;
    /*width:90%;*/
    color:white;
    position:absolute;
    top:10px;
    right:2%;
    left:2%;
    border-radius:20px ;
    display:flex;
}

header > a {
    color:white;
}

.footer_text > p > a {
    color:white;
}

.footer_text > p > a:hover {
    color:red;
}

.header_text {
    /*background:red;*/
    width:95%;
    margin: 20px auto 20px;
    position:relative;
}

.main_menu {
    text-align:left;
    position:relative;
    bottom:0px;
}

.main_menu > a {
    color:white;
    text-decoration:none;
}

.main_menu > a:hover {
    color:red;
    /*text-decoration:underline;*/
}

footer {
    text-align:center;
    background: rgba(0, 0, 100, .4);
    height:40px;
    color:white;
    border-radius:0 ;
    position:absolute;
    bottom:10px;
    right:2%;
    left:2%;
    display:flex;
}


.footer_text {
    /*background:red;*/
    width:95%;
    padding:0;
    margin: auto;
}

.page_menu {
    margin: 10px auto 20px;
    font-weight:bold;
    width:95%;
    text-align:left;
    /*text-decoration:none;
    background:red;*/
}


.pictures {
    /*background:blue;*/
    width:95%;
    margin: auto;
    vertical-align: top;
    /*display:flex;*/
    overflow:auto;
    height:70%;
}

.main {
    position:absolute;
    top:165px;
    bottom:65px;
    left:5%;
    right:5%;
    border:none;
    overflow:auto;
}

td { 
    padding: 10px;
}

.icon {
    width:150px;
    /*height:300px;*/
    /*border-width:2px;*/
    /*border-style:solid;*/
    /*border-color:blue;
    background:cyan;*/
    margin-right:40px;
    margin-bottom:40px;
    /*border-radius:10px;*/
    display: inline-block;
    
}

.icon-folder {
    /*box-shadow: 10px 10px 5px rgba(0,0,100,0.3);*/
    width:150px;
    /*height:150px;*/
    margin-right:40px;
    margin-bottom:40px;
    display: inline-block;
    background-image: url(folder_icon.JPG);
    background-repeat: no-repeat;
    background-position: center; 
    background-size: cover;    
}


.icon-title {
    width:100%;
    padding: 5px;
    word-break: break-all;
}

.image {
    /*height:100%;*/
    width:100%;
    max-height:250px;
    /*border-radius:10px;*/
    box-shadow: 10px 10px 5px rgba(0,0,100,0.3);
    display:block;
}

.close {
    /*display:block;
    height:10px;
    width:10px;
    background:red;
    left:110px;
    top:10 px;*/
    text-align:center;
    color:white;
    /*border-bottom: solid 3px rgb(200,0,150);*/
    display: block;
    text-decoration:none;
    overflow-wrap: break-word;
}

.active {
    background:blue;
}


.heighlited {
    font-weight:bold;
    border-bottom:solid;
    /*background: rgba(0, 0, 200, .9);*/
}


.news_header {
    background: #ccc;    
    font-weight:bold;
    text-align:left;
    padding: 3 15 5;
    margin:4px 5px 0 0 ;
    text-transform:uppercase;
    display:block;
}

.news_text {
    background: #eee;
    padding: 3 15 10 ;
    display:block;
    margin:0 5px 0 0 ;
    /*height:30%;*/
}


.tree {
    width:30%;
    /*height:500px;
    border:solid;*/
    display:inline-block;
    margin:0;
    vertical-align: top;
    overflow:auto;
    font-size:12;
    font-family:courier;
}

.tree > p > a {
    text-decoration:none;
}

.tree > p > a:hover {
    text-decoration:underline;
}

.pict1 {
    width:70%;
    /*border:solid;*/
    display:inline-block;
    /*margin:0 0 0 20%;*/
    vertical-align: top;
    overflow:auto;
    margin-left:20px;
}

.folder {
    background:yellow;
    border:solid;
    box-shadow: 10px 10px 5px rgba(0,0,100,0.3);
    display:block;
}

.selected {
    font-weight:bold;    
    background: #ddd;
    color:black;
}


.tree_div {
    /*border:solid;*/
    /*height:50px;*/
    margin-left:20px;
    display:none;
}


.tree_div > p > a {
    text-decoration:none;
}

.tree_div > p > a:hover {
    text-decoration:underline;
}

.tree-link {
    text-decoration:none;
}

.overlay {
    position: fixed; 
    background-color: rgb(100, 100, 100);
    border:solid;
    top: 0;
    left: 0;
    height:100%;
    width:100%;
    display:flex;
    z-index:20;
}

.popwin {
    /*padding: 10px ;
    border: 1px solid #383738;
    background: #fefeff;
    border-radius: 15px;
    box-shadow: 0 13px 21px rgba(0,1,0,.19),0 21px 63px rgba(0,1,0,.31);*/
    margin:auto;
    position:relative ;
}

.closeButton {
    border-radius: 40px;
    text-decoration:none;
    color:rgba(255,255,255,.5);
    /*width:50px;
    height:50px;*/
    padding: 10px 20px 10px;
    background: rgba(0,0,0,.3);
    font-size:36;
    font-weight:bold;
    border:none;
    margin-right:5px;
    top:1%;
    right:1%;
    display:block;
    position:absolute;
}

.closeButton:hover {
    background-color: red; /*rgba(0,0,0,.5);*/
    color:white;
    text-decoration:none;
}

.viewphoto {
    max-width:75vw;
    max-height:95vh;
    display:block;
    position:static;
}

.PhotoNavigationLink {
    text-decoration:none;
    font-weight:bold;
}

.PrevBotton {
    position:absolute;
    display:flex;
    padding:auto;
    font-size:48;
    font-weight:bold;
    color:white;
    text-decoration:none;
    text-align:center;
    top:25%;
    left:1%;
    height:50%;
    /*width:80px;*/
    border:none;
}

.PrevBotton > a {
    /*display:block;
    height:100%;*/
    border-radius: 40px;
    text-decoration:none;
    color:rgba(255,255,255,.5);
    /*width:50px;*/
    padding: 10px 25px 10px;
    background: rgba(0,0,0,.3);
    border:none;
    margin-right:5px;
}


.NextBotton {
    position:absolute;
    display:flex;
    padding:auto;
    font-size:48;
    font-weight:bold;
    color:white;
    text-decoration:none;
    text-align:center;
    top:25%;
    right:26%;
    height:50%;
    /*width:80px;*/
    border:none;
}

.NextBotton > a {
    /*display:block;
    height:100%;*/
    border-radius: 40px;
    text-decoration:none;
    color:rgba(255,255,255,.5);
    /*width:50px;*/
    padding: 10px 25px 10px;
    background: rgba(0,0,0,.3);
    border:none;
    margin-right:5px;
}

.PrevBotton > a:hover {
    background: rgba(0,0,0,.5);
    color:white;
}

.NextBotton > a:hover {
    background: rgba(0,0,0,.5);
    color:white;
}

.loginButton {
    display:inline-block;
    border-radius:15px;
    height:30px;
}

.loginButton:hover {
    box-shadow: 0 0 7px rgba(100,0,0,0.7);
}