*{box-sizing:border-box;}

.col-1{width:6.25%;}.col-2{width:12.50%;}.col-3{width:18.75%;}.col-4{width:25%;}.col-5{width:31.25%;}.col-6{width:37.5%;}.col-7{width:43.75%;}.col-8{width:50%;}.col-9{width:56.25%;}.col-10{width:62.5%;}.col-11{width:68.75%;}.col-12{width:75%;}.col-13{width:81.25%;}.col-14{width:87.5%;}.col-15{width:93.75%;}.col-16{width:100%;}[class*="col-"]{border:0px solid red;padding:0px;margin:0px;font-size:100%;font-weight:bold;font-style:normal;text-align:center;float:left;}

.I{background:#2eb68b;color:#ffffff;}
.I:hover{background:#ffffff;color:#2eb68b;}
.IV{background:#000000;color:#ffffff;}
.V{background:#ff0000;color:#ffffff;}
.V:hover{background:#ffffff;color:#ff0000;}
.vi{background:#a8dcff;color:#0000ff;-webkit-border-radius:25px 25px 25px 25px;-moz-border-radius:25px 25px 25px 25px;-khtml-border-radius:25px 25px 25px 25px;border-radius:25px 25px 25px 25px;}
.ii{background:#a8dcff;color:#0000ff;}
.iii{background:#a8dcff; color:#0000ff;}
.vii{font-weight:normal;font-style:italic; background:#f0f0ff;}
.viix{font-weight:normal; xfont-style:italic; background:#f0f0ff;}

.none{display:none;} 
.center{text-align:center;}
.wide{letter-spacing:6px;}
.full-height{height:100%; background:none;}
.circle{border-radius:50%;}
.shadow{margin:2px 0 6px 0; -webkit-box-shadow:0px 6px 6px #DDDDDD; -moz-box-shadow:0px 6px 6px #DDDDDD; box-shadow:0px 6px 6px #DDDDDD; background:white; border:0; border-radius:25px;}
.ripple:active{opacity:0.5;}
.ripple{transition:opacity 0s;}

.animate-top{position:relative;animation:animatetop 2s}@keyframes animatetop{from{top:300px;opacity:0} to{top:0;opacity:1}}
.animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.fade {
-webkit-animation-name: fade;
-webkit-animation-duration: 2.5s;
animation-name: fade;
animation-duration: 2.5s;
}
.fade0{-webkit-animation-name:fade; -webkit-animation-duration:9.5s; animation-name:fade; animation-duration:9.5s; opacity:1;}
@-webkit-keyframes fade0{from{opacity:1}to{opacity:0}}
@keyframes fade0{from{opacity:1}to{opacity:0}} 
.fade-in{animation:opac 6.5s}
@keyframes w3-animate-opacity2{from{opacity:1}to{opacity:0}}
.fade-out{-webkit-animation-name:fade; -webkit-animation-duration:9.5s; animation-name:fade; animation-duration:9.5s; opacity:0;}
@-webkit-keyframes fade{from{opacity:1}to{opacity:1}to{opacity:0}}
@keyframes fade{from{opacity:1}to{opacity:1}to{opacity:0}}
.animate-fading{animation:fading 10s 1}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-opacity2{animation:opac 10.8s}
@keyframes w3-animate-opacity2{from{opacity:1}to{opacity:0}}
.spin{animation:spin 2s 1 linear}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}
.animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.animate-left{position:relative;animation:animateleft 4s}@keyframes animateleft{from{left:-600px;opacity:0} to{left:0;opacity:1}}
.animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.animate-bottom{position:relative;animation:animatetop 3s}@keyframes animatebottom{from{bottom: 600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_1{position:relative;animation:animatetop 3s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-input{transition:width 0.4s ease-in-out}
.animate-input:focus{width:100%!important}
.hover-opacity{cursor:pointer;}
.animate-bottom_TAB_101{position:relative;animation:animatetop 3s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_TAB_1{position:relative;animation:animatetop 1s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_TAB_2{position:relative;animation:animatetop 1.5s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_TAB_3{position:relative;animation:animatetop 2s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_TAB_4{position:relative;animation:animatetop 2.5s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}}
.animate-bottom_TAB_5{position:relative;animation:animatetop 3s}@keyframes animatebottom{from{top:-600px;opacity:0} to{bottom:0;opacity:1.0}


 
 
 /* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {...}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...}

@media only screen and (max-width: 750px) {
 form.col-16.album_cover {border: 0px solid green;width:100%; padding:04px;margin: 2px 0px;}
form.col-16.album_cover .cover{border: 0px solid red; padding:00px;margin:0px;}
form.col-16.album_cover button{border: 0px solid blue; cursor:default;}
form.col-16.album_cover img{border: 0px solid purple;}
form.col-16.album_cover span.col-16.description{border:20px solid black;}
.album_description{
 visibility:hidden; 	
} }
 
 
@media only screen and (max-width: 750px){body{font-size:14px;}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...}

@media only screen and (max-device-width:1920px)
{
 body{ }
}


/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}