/* css - dantonag.it */

html
{
    height: 100%;
}

body
{
    /*background-color: #d0e0f0;*/
    background-image: url("../images/bg/NriKz8.jpg");
    margin: 0;
    padding: 0;
    height: 100%;
    /*min-height: 100vh; */
}

.headerDiv
{
    padding-top: 0;
    background-color: white;
    min-height: 32px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.pageLogo
{
    font-family: 'Oleo Script', cursive;    
}

.pageLogoTinder
{
    font-family: 'Raleway', sans-serif;
}

.siteSubtitle
{
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;
    float:right;
    padding-top: 6px;
    margin-right: 14px;
}

.grid {
    margin: 0 auto;
    margin-top: 20px;
}

@media only screen 
and (min-device-width : 374px) 
and (max-device-width : 736px) 
{
    .grid
    {
        margin-top: 5px;
    }
}

.grid-item 
{
    width: 320px;
    margin-bottom: 10px;
}

.mainContainer
{
    width:65%;
    /*border: black 1px solid;*/
    padding-top: 0;

    margin: 0 auto;     

    min-height: calc(100vh - 43px);
}

/* mobile devices */

@media only screen 
and (min-device-width : 374px) 
and (max-device-width : 736px) 
{
    .mainContainer
    {
        width:98%;
    }
}

.instabox
{
    max-width: 320px;
    width: 320px;
    text-align: justify;
    text-justify: inter-word;
}

.infoBox
{
    /*padding: 4px;*/
}

img 
{ 
    max-width: 100%; 
    height: auto; 
}

img:hover 
{
    opacity: 0.6;
    filter: alpha(opacity=60);
}

img { cursor: pointer; }

a {outline : none;}
a { color: #1090d0; } 
a, u {
    text-decoration: none;
}

/* one box of data */

.itemBox
{
    border-radius: 20px;
    overflow: hidden;
    border: #d0d0d0 1px solid;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
    min-height: 480px;
    height: 490px;
    background-color: white;

    margin: 0 auto;

    position: fixed;
    /*position: absolute;*/

    margin-bottom: 10px;
}

.itemBox:hover 
{
    border: #b0b0b0 1px solid;
}

.likesbox
{
    font-family: 'PT Sans', sans-serif;
    font-size: 10px;
    position:absolute;
    right:20px;
}

.boxText
{
    width: 305px;
    font-family: 'PT Sans', sans-serif;
    font-size: 14px;
    margin: 8px;
}

.yes,
.no {
    position: absolute; left: 0; top: 200; right: 0; bottom: 0; opacity: 0;
    min-height: 200px;
}

.no {
    background-image: url("../images/no.png");
}

.yes {
    background-image: url("../images/yes.png");
}

.endofdeck
{
    margin-top: 40px;
}

/* heart animation */

.button{cursor:pointer;width:30px;height:30px;float:left;position:relative;z-index:1;-webkit-transition:all 0.1s ease-out;-moz-transition:all 0.1s ease-out;-ms-transition:all 0.1s ease-out;-khtml-transition:all 0.1s ease-out;transition:all 0.1s ease-out}
.button:after{content:"";width:30px;height:30px;position:absolute;top:0px;left:0px;display:none}
.button:active{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-khtml-transition:scale(0.8);transform:scale(0.8)}
.button.right{float:right}
.button a{display:block;width:100%;height:100%}
.button-like{background-image:url("../images/heart/heart.png")}
.button-like:before{background-image:url("../images/heart/sprite-heart.png");background-position:0px 0px;content:"";width:65px;height:55px;position:absolute;top:50%;left:50%;margin-left:-32px;margin-top:-31px;display:none}
.button-like:after{background-image:url("../images/heart/hearted.png")}
.button-like.liking{background-image:none}
.button-like.liking:before{display:block;-webkit-animation:heart-sprite 0.3s steps(11) both;-moz-animation:heart-sprite 0.3s steps(11) both;-ms-animation:heart-sprite 0.3s steps(11) both;-khtml-animation:heart-sprite 0.3s steps(11) both;animation:heart-sprite 0.3s steps(11) both}
.button-like.liking:after{display:block;-webkit-animation:heart-beat 0.45s ease-in-out;-moz-animation:heart-beat 0.45s ease-in-out;-ms-animation:heart-beat 0.45s ease-in-out;-khtml-animation:heart-beat 0.45s ease-in-out;animation:heart-beat 0.45s ease-in-out}
.button-like.liked:after{display:block}
.button{cursor:pointer;width:30px;height:30px;float:left;position:relative;z-index:1;-webkit-transition:all 0.1s ease-out;-moz-transition:all 0.1s ease-out;-ms-transition:all 0.1s ease-out;-khtml-transition:all 0.1s ease-out;transition:all 0.1s ease-out}
.button:after{content:"";width:30px;height:30px;position:absolute;top:0px;left:0px;display:none}.button:active{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-khtml-transition:scale(0.8);transform:scale(0.8)}.button.right{float:right}.button a{display:block;width:100%;height:100%}.button-like.slow.liking:before{-webkit-animation:heart-sprite 1.2s steps(11) both;-moz-animation:heart-sprite 1.2s steps(11) both;-ms-animation:heart-sprite 1.2s steps(11) both;-khtml-animation:heart-sprite 1.2s steps(11) both;animation:heart-sprite 1.2s steps(11) both}.button-like.slow.liking:after{-webkit-animation:heart-beat 1.6s ease-in-out;-moz-animation:heart-beat 1.6s ease-in-out;-ms-animation:heart-beat 1.6s ease-in-out;-khtml-animation:heart-beat 1.6s ease-in-out;animation:heart-beat 1.6s ease-in-out}@-webkit-keyframes heart-beat{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-ms-transform:scale(1.5);-khtml-transition:scale(1.5);transform:scale(1.5)}50%{-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-khtml-transition:scale(0.9);transform:scale(0.9)}80%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-khtml-transition:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}}@-moz-keyframes heart-beat{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-ms-transform:scale(1.5);-khtml-transition:scale(1.5);transform:scale(1.5)}50%{-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-khtml-transition:scale(0.9);transform:scale(0.9)}80%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-khtml-transition:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}}@-ms-keyframes heart-beat{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-ms-transform:scale(1.5);-khtml-transition:scale(1.5);transform:scale(1.5)}50%{-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-khtml-transition:scale(0.9);transform:scale(0.9)}80%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-khtml-transition:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}}@-khtml-keyframes heart-beat{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-ms-transform:scale(1.5);-khtml-transition:scale(1.5);transform:scale(1.5)}50%{-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-khtml-transition:scale(0.9);transform:scale(0.9)}80%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-khtml-transition:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}}@keyframes heart-beat{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-ms-transform:scale(1.5);-khtml-transition:scale(1.5);transform:scale(1.5)}50%{-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-khtml-transition:scale(0.9);transform:scale(0.9)}80%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-khtml-transition:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-khtml-transition:scale(1);transform:scale(1)}}@-webkit-keyframes heart-sprite{from{background-position:0px 0px}to{background-position:715px 0px}}@-moz-keyframes heart-sprite{from{background-position:0px 0px}to{background-position:715px 0px}}@-ms-keyframes heart-sprite{from{background-position:0px 0px}to{background-position:715px 0px}}@-khtml-keyframes heart-sprite{from{background-position:0px 0px}to{background-position:715px 0px}}@keyframes heart-sprite{from{background-position:0px 0px}to{background-position:715px 0px}}

/* floating div */

.floatingText
{
    text-align: center;
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;
    color: black;
}

#fade-wrapper 
{
	position: fixed;
	height: 100%;
	width: 100%;
	background: white;
    z-index: 100;
    margin: 0;
    padding: 0;
    position: 0;
}

@media only screen and (max-device-width: 736px) 
{ 
	#fade-wrapper
	{
		font-size: 24px;
	}
}

.Center-Container 
{
  position: relative;
  height: 100%;
  width:100%;
}

.Absolute-Center 
{
  width: 70%;
  height: 25%;
  overflow: hidden;
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  /*border: solid black;*/
}

/* footer */

#footer 
{
    background:white;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    font-family: 'PT Sans', sans-serif;
    font-size: 12px;

    height:30px;
    width:65%;
    margin: 0 auto;

    padding-top: 13px;
    padding-left: 20px;

    /*margin-top: 30px;*/
}