/* Link Slidess */
#slider1 { 
    position: relative; width: auto; height: 1%; 
    overflow:hidden; 
    
    padding: 0 0 10px; margin: 0;  

    display: -webkit-box; 
    display: -webkit-flex; 
	display: box;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

#slider1 .viewport {  
    width: 1030px; height: 400px; overflow: hidden; position: relative; margin: 0 0 7px; 
    border: 2px solid #3498db;
    background: rgba(52, 152, 219, 0.3);
    border-radius: 4px;
    font-size: 0.8rem;
    color: #ecf0f1;
}

#slider1 .viewport.dark {
  background: rgba(52, 152, 219, 0.7);
}

#slider1 .viewport #screen {
    position: absolute;
    bottom: 4px;
    left: 4px;

    width: 44px;

    display: -webkit-box; 
    display: -webkit-flex; 
	display: box;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

#screen > span {
    width: 100%;
}

#slider1 .viewport #screen #scr {
    display: -webkit-box; 
    display: -webkit-flex; 
	display: box;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
}

#slider1 .buttons {
    display: block;
    margin: 4px 0 0;
    padding: 20px 4px 4px 4px;
    width: 72px;
    height: auto;
    position: relative;
    
    
   border: 2px solid #3498db;
  background: rgba(52, 152, 219, 0.3);
  border-radius: 4px;
  font-size: 0.8rem;
  color: #ecf0f1;

    text-align: right;
    line-height: 1em;
    text-decoration: none; 
}

#slider1 .buttons.here { 
    border: 2px solid #2ecc71;
    background: rgba(46, 204, 113, 0.3); 
    color: #ecf0f1;
}

#slider1 #buttonset {
    display: -webkit-box; 
    display: -webkit-flex; 
	display: box;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    width: 100%;
    padding: 0 16px;
}

#linkno {
    font-size: 1rem;
    color: #e67e22;
}

#slider1 .buttons:hover{ 
   background: rgba(52, 152, 219, 0.4);
   box-shadow: 0 0 12px #3498db;
}

#slider1 .buttons.here:hover {  
    background: rgba(46, 204, 113, 0.4); 
    box-shadow: 0 0 12px #2ecc71; 
}

/*
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 240px; left: 0; top: 0; }
*/

#slider1 #overview li { 
    /* float: left; */
    
    margin: 0 20px 0 0; padding: 1px; height: 400px; width: 1030px;

    display: -webkit-box; 
    display: -webkit-flex; 
	display: box;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    
}

#slider1 #overview li div.key {
    margin: 0 0 0 1%;
    padding: 0;
    width: 12%;
    height: auto;
    min-height: 370px;

    /* border: 1px solid #e67e22; */
}

#slider1 #overview li div.key figure {
    margin: 0 auto;
    width: 55px;
    height: auto;
    border: none;
}

#slider1 #overview li div.key figure img {
    width: 100%;
    height: auto;
    border: none;
}

#slider1 #overview li div.content {
    margin: 0 1% 0 0;
    padding: 32px 44px 32px 0;
    width: 84%;
    height: auto;
    min-height: 370px;

    /* border: 1px solid #e67e22; */
}

#slider1 #overview li div.content figure {
    float: right;
    margin: 0 0 7px 7px;
    width: 140px;
    height: auto;
    border: none;
}

#slider1 #overview li div.content figure img {
    width: 100%;
    height: auto;
    border: none;
}
