.logo {
	/* background-color:#dfdfdf; */
	width: 100%;
	max-width: 1000px;
	text-align:center;
	font-family:Arial;
	font-size:18pt;
	height:50px;		
	color:#3b5999;
	border: #3b5999 2px solid;
	border-bottom-width:0px;
}

.desktop
{
	width: 100%;
	max-width: 1000px;
	height: auto;
    max-height: 600px;
    border: #3b5999 2px solid;
    /* background-color: white; */
}

.footer {
	/* background-color:#dfdfdf; */
	width: 100%;
	max-width: 1000px;
	height:50px;		
	text-align:center;
	font-family:Arial;
	font-size:18pt;
	color:#3b5999;
	border: #3b5999 2px solid;
	border-top-width:0px;
}  

/* .top {
    transform: rotateX(90deg) translateZ(0.05em);
    height: 0.1em;
    line-height: 0.1em;
}

.right {
    transform: rotateY(90deg) translateZ(1.95em);
    width: 0.1em;
}

.left {
    transform: rotateY(-90deg) translateZ(0.05em);
    width: 0.1em;
}

.bottom {
    transform: rotateX(-90deg) translateZ(1.95em);
    height: 0.1em;
    line-height: 0.1em;
} */


body {
    /* background-color: rgb(155, 156, 179); */

    font-family: Verdana, Tahoma, sans-serif;
}


.coin {
    font-size: 4em;
    width: 1em;
    margin: 0em auto;
    transform-style: preserve-3d;
    transform: rotateX(0deg) rotateY(0deg);
    perspective: 800px;
}

.side {
    position: relative;
    width: 1em;
    height: 1em;
    /* background: rgb(105, 6, 6); */
    border: 0px solid transparent;
    text-align: center;
    line-height: 1em;
    display: block;
    backface-visibility: hidden;
}

.back {
    transform: rotateY(-180deg) translateZ(0.0em) translateY(-1.0em);
    background-image: url('../images/Cc_logo_circle.png');
    background-repeat: no-repeat;
}

.front {
    transform: translateZ(0.0em);
    background-repeat: no-repeat;
}

.by .front {
    background-image: url('../images/Cc-by_new.png');
}


.sa .front {
    background-image: url('../images/Cc-sa.png');
}

.nc .front {
    background-image: url('../images/Cc-nc.png');
}

.nd .front {
    background-image: url('../images/Cc-nd.png');
}

.title {
    position: absolute;
    font-size: 20px;
    width: 100%;
    height: 1em;
    line-height: 1em;
    text-align: center;
    bottom: 3em;
    left:-0.25em;
    font-family: Impact, 'Arial Narrow Bold', sans-serif;
    transform-style: preserve-3d;
    backface-visibility: hidden;
}

.header {
    height: 50px;
    background-image: url(../images/CC_logo_full.png);
    background-position: top right;
    background-repeat: no-repeat;
    margin: 5px;
    width:100%;
    min-width: 600px;
    vertical-align: middle;
    line-height: 50px;
    color: #3b5999;
}

.listBasic li {
    list-style-type: none;
    margin-bottom:20px;
}
.listBasic li>div {
    display: flex;
    align-items:center;
}

.listBasic img {
    margin-right:10px;
    flex-shrink: 0;
}


.mouseHand {
    cursor:pointer;
    transition: opacity 0.25s ease;
}

.mouseHand:hover {
    opacity:0.5;
}

.responsive {
    display: block;
    width: 100%;
    max-width: 600px;
    /* height: 100%;
    max-height: 70vh; */
}

/* WebKit and Opera browsers */
@-webkit-keyframes spinner {
    from {
        -webkit-transform: rotateY(0deg);
    }

    to {
        -webkit-transform: rotateY(-360deg);
    }
}

/* all other browsers */
@keyframes spinner {
    from {
        -moz-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }

    to {
        -moz-transform: rotateY(-360deg);
        -ms-transform: rotateY(-360deg);
        transform: rotateY(-360deg);
    }
}


.spinner {
    -webkit-animation-name: spinner;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 6s;

    animation-name: spinner;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-duration: 6s;

    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.spinner:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}


.divInDialog h2{
    font-size: 2em;
    text-align: center;
    padding: 40px 20px;
    background: linear-gradient(to bottom,rgba(0,181,218,1) 0%,rgba(0,165,200,1) 100%);
    color:white;
    font-family: Verdana,sans-serif;
}

.divInDialog{
    /* width:100%;
    max-width: 500px; */
    height: 70vh;
    overflow-y: auto;
}

.divInDialog h3{
    font-size: 2em;
    text-align: center;
    padding: 20px 20px;
    font-weight: bolder;
    font-family: Verdana,sans-serif;
}

.divInDialog ul {
    font-size: 19px;
    list-style: none;
    font-family: Georgia, Helvetica, sans-serif;
}

.divInDialog li {
    margin:20px 20px;
}

.center{
    text-align: center;
}