/* MyDIO CSS Document */

#big_picture {width:110px; height:100px;z-index:2000010; }
 #big_picture a.small, #big_picture a.small:visited { display:block; width:110px; height:100px; text-decoration:none; top:0; left:0; border:0;}
 #big_picture a img {border:0;}
 #big_picture a.small:hover {}
 #big_picture a .large {display:block; position:relative; width:0; height:0; border:0; top:0; left:0;z-index:2000010;}
 #big_picture a.small:hover .large {position:fixed; border-width:300px;   border-color:#FFF; top: 44px; left:700px; width:480px; height:360px; z-index:2000010;} 
 
 :root{
    --btn-border: #3b3793;

 }
 

.youtube-btn{
    background-color:white !important;
    background:white !important;
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}
.box_image{
	width:320px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
    margin-bottom:60px;
}

.no-blue-link {
	color: #FFF;
}
.iframe_wrapper
{    
width:90%;
position:relative;
    z-index: 1;
    display: inline-block;
}
.blue_text{color: #2c559c;}
.black_text{color: #000000;}
.green_text{color: #51b36d;}
.green_back{ background-color: #51b36d;}
a{
    text-decoration: none;
    color: #5c83c7;
}
.about_titles
{
font-size: 40px; line-height: 40px; font-style: normal; font-weight: 300;  text-decoration: none; padding: 25px; margin: 0; text-align: left;
}
.cover_blue{
        background:#2C559C;
        width: 100%;
        height: 40px;
        right: 0px;
        bottom: 6px;
        z-index:999;
        display: block;
        background-color:#2C559C;
        color:#2C559C;
	}
.iframe_about{
	width:90%;
	border:0px;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	background-color: #f6f6f6;
	color: #000000;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
	}
	.footer_inner
	{
		width:100%;
		background-color: #000;
		color:#FFF;
		font-size:12px;
		font-weight:400;
		line-height:22px;

		}
	.about_frame{
		max-width:700px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	}
.fade_in
{

    /*fade in effect*/
     transition: opacity 1s ease-in;
    -webkit-transition: opacity 1s ease-in;
    -moz-transition: opacity 1s ease-in;
    -o-transition: opacity 1s ease-in;

     animation: fadein 1s;
    -moz-animation: fadein 1s; /* Firefox */
   -webkit-animation: fadein 1s; /* Safari and Chrome */
    -o-animation: fadein 1s; /* Opera */

     transition-delay: 0s;
    -moz-transition-delay:0s;
    -o-transition-delay:0s;
    -webkit-transition-delay:0s;

   -webkit-animation-delay: 0s; /* Chrome, Safari, Opera */
  /*to make the text not visible untill the transition starts*/
   -webkit-opacity: 0;
   /*without this the text will disappear after the animation*/
    -webkit-animation-fill-mode: forwards;

}
tr.border_bottom td {
  border-bottom:1pt solid black;
}
#dragme
{
position:absolute;
display:none;
height:100px;
width:100px;
color:#2C559C;
text-align:center;
z-index:7000;
}
.about_text{
	font-size: 16px;
	line-height: 26px;
	font-style: normal;
	font-weight: 200;
	color: #000000; 
	text-decoration: none;
	padding-left:28px;
	padding-right:28px;
	padding-bottom:25px;
	margin: 0;
	text-align: left;
	}

#MyDIOdragme
    {
        top:300px;
        left:5px;
        position:fixed;
        opacity:0.9;
        background-color: rgb(1,1,1,0);
        background: rgba(1,1,1,0);
        height:70px;
        width:70px;
        color:#2C559C;
        text-align:center;
        z-index:7000;
    }

.box_back_image
    {
        width:100%;
        height:342px;
        margin-left:auto;
        margin-right:auto;
        text-align:center;
        background-image:url(../images/Davidcover3.jpg);
        background-size: cover;
        margin-top:15px;
    }
.description
    {
        width: 340px;
        margin-left: -10px;
        font-size:16px;
        display:none;
        margin-top: 20px;
    }
.spacer
    {
        height: 20px;
    }
.full_page
    {
        position: absolute;
        width: 100%;
        background-color:#000;
        margin: 0;
        overflow-x: hidden;
        padding: 0;
        padding-bottom:100px;
        margin-top: 0;
        margin-bottom: -8px;
        font-family: Verdana,sans-serif;
    }

.video-bg video {
    animation: slowzoom 18s ease-out infinite alternate;
    transform-origin: center;
}

@keyframes slowzoom {
    from { transform: scale(1.0); }
    to   { transform: scale(1.03); }
}

.backdrop1
    {
        height:71px;
        background-color:#fff;
        left:11px;
        width:71px;
        border-radius:50%;
        opacity:1;
    }

.draggable-dio{
	background-repeat:no-repeat;
	background-image:url(../images/connect-icons/dio_animat100n4.gif);
	background-size: 69px;
	display:block;
	height:90px;
	width:90px;
	top:-81px;
	left:-10px;
	font-size: 13px;
	font-style: bold;
	position: relative;
	text-align: center;
	color: #FFF;
	line-height: 90px;
	overflow: hidden;
	padding: 0px;
	background-position: 50% 50%;
	z-index:7000;
	cursor: pointer;

	}

#hideMe5 {
    -moz-animation: cssAnimation 0s ease-in 5s forwards;
    /* Firefox */
    -webkit-animation: cssAnimation 0s ease-in 5s forwards;
    /* Safari and Chrome */
    -o-animation: cssAnimation 0s ease-in 5s forwards;
    /* Opera */
    animation: cssAnimation 0s ease-in 5s forwards;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
@keyframes cssAnimation {
    to {
        width:0;
        height:0;
        overflow:hidden;
		opacity:0;
    }
}
@-webkit-keyframes cssAnimation {
    to {
        width:0;
        height:0;
        visibility:hidden;
				opacity:0;
    }
}


.btn-read-more:active{
	width:280px;
	background-color: #FFDE9B;
	margin-top:6px;
	color:#2C559C;
	border:#51b36d;
	}
	
.btn-white-black {
	padding: 1px 1px;
	font-size: 16.25px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	background-color:#FFF;

}	
.btn-white-black h4 
	{ 
		font-size: 18px;
	}
.btn-large-blue-white 
	{

	margin-left:auto;
	margin-right:auto;
	border-style:solid;
	border-color:#FFF;
	font-size: 16.25px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 0px;
	border-radius: 6px;
	background-color:#2C559C;
  padding: 7px 22px;

}
.insr-btn{
    position: absolute;
    margin-top: 7px;
    margin-left: 123px;
    width: 16px;
    height: 16px;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #3b3793;
    padding: 2px;
    align-content: center;
}
.links-container{
    text-align: left;
    font-size: 12px;
    width: 321px;
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    margin-right: auto;
}
.menu-btn{
    border: 1px solid white;
    border-radius: 10px;
    padding: 8;
    cursor: pointer;
}
.swiss-made{
    height: 26px;
    width: 159px;
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 9px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: -22px;
}
.button.play {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 5px 11px;
    border-color: white white white var(--btn-border);
    margin-left: 4px;
  }
.music-link-btn{
    height: 40px;
    width: 158px;
    background-color: white;
    background-repeat: no-repeat;
    border-radius: 2px;
    background-position-x: 25%;
    background-size: 56%;
    background-position-y: 5px;
    display: inline-block;
    margin-top: 1px;
    margin-right:0px;
    cursor: pointer;
}
.btn-large-blue {
	padding: 6px 6px;
	font-size: 16.25px;
	-webkit-border-radius: 1px;
	-moz-border-radius: 0px;
	border-color:#FFF;
	border-radius: 1px;
	background-color:#2C559C;
	color:#FFF;

}
	
	.btn-action{
		background-color:#51b36d;
		width:290px;
		    cursor: pointer;
		
	}
		.btn-listen{
	padding: 6px 6px;
	font-size: 16.25px;
	border-color:#FFF;
	border:0px;
	border-style:solid;
	color:#FFF;
	background-color: #C9E1C1;
	width:299px;
	height:40px;
	cursor: pointer;
	}
		.btn-action-small{
		background-color:#51b36d;
		width:170px;
		
	}
			.btn-action-x-small{
		background-color:#51b36d;
		width:140px;
		
	}
				.btn-cancel-x-small{
		background-color:#FC6;
		width:140px;
		
	}
	.bottom_fixed
	{

		position: fixed;
		bottom:6px;
		z-index:5000;
		margin-left:auto;
		margin-right:auto;

		}
	.new_img
	{

		z-index:2100;
		}
	.read-more{
		background-color:#FFF;
		color:#2C559C;
		font-size:11;
		line-height:normal;
		font-weight:400;
		margin-left:auto;
		margin-right:auto;
		padding:10px;
		width:285px;
		border-radius: 10px 10px 10px 10px;
		-moz-border-radius: 10px 10px 10px 10px;
		-webkit-border-radius: 10px 10px 10px 10px;
		border: 0px solid #000000;
		}
#new-image {
   position: relative;
    left: 0;
    right: 0;
    bottom:330px;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: contain;
}
.large_old_sakatri_img
{
	opacity:0.6;
	}
	
.btn-mydio-admin:hover {
  background-position: 0 10px;
}
.btn-mydio-admin .icon-wrapper {
  float: left;
  padding: 3px 12px 3px 0;
  margin-right: 12px;
  margin-top: 2px;
}
input.hidden {
    position: absolute;
    left: -9999px;
}


.profile-images
 	{
    cursor: pointer;
	}

.btn-text 
{
	color:#FFF;
	font-size:17px;
}

.button-frame
	{
		position:relative;
		width:290px;
		margin-left:auto;
		margin-right:auto;
	}
	
.center-object
{
	margin-left:auto;
	margin-right:auto;
}

.heart-shape{
    position: relative;
    width: 20px;
    height: 20px;
    top: 187px;
    left: 7px;
    z-index: 300;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color:rgba(81, 179, 109, 1);
}
.heart-shape:before,
.heart-shape:after{
    position: absolute;
    width: 20px;
    height: 20px;
    content: '';
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    background-color:rgba(81, 179, 109, 1);
		z-index: 151;
}
.heart-shape:before{
    bottom: 0px;
    left: -10px;
}
.heart-shape:after{
    top: -10px;
    right: 0px;
}
.fb-frame
{
width: 600px;
  margin-left: auto;
  margin-right: auto;
  /* height: 100px; */
  z-index: 400;
  position: relative;
}
.fb-btn{
	
	  position: fixed;
  top: 150px;
  /* right: 100px; */
  width: 50px;
  height: 50px;
  background-image: url(../images/connect-icons/facebook-connect@2x.png);
  background-size: cover;
  background-position: 50% 50%;
  z-index: 150;
  top: 320px;
  /* left: 100px; */
  /* alignment-baseline: middle; */
  border: 1px solid #FFF;
	
	}

@media (min-width: 200px)
{

	
}
@media (max-width: 449px)
{

}

.french_adjust
	{height:2380px;}
#dragme
{
	opacity:1;
}

.heart-shape{
    top: 10px;
  }


@media (min-width: 450px) {
 .map_cadre {width: 150px;
 height:100%;}
 .map_cadre_spend {
width: 150px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}

.map_list
{
position:relative;
width:300px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
}

@media (min-width: 550px) {
.map_cadre
{
width: 45%;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}
 .map_cadre_spend {
width: 250px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}
.map_list
{
position:relative;
width:240px;
margin-right:0px;
margin-left:auto;
text-align:left;
}


}

@media (min-width: 750px) {

 .map_cadre {
width: 500px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}

.map_cadre_spend {
width: 300px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}

.read-more{
		width:600px;
		}
.map_list
		{
position:relative;
width:240px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
.map_list_spend
{
position:relative;
width:620px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
 #big_picture a.small:hover .large {position:fixed; top: 54px; left:650px; width:360px; height:270px;z-index:2000010;} 

}

@media (min-width: 1050px) {
 .map_cadre
 {	
 	width: 800px;
	margin-left:0px;
	height:100%;
	position: fixed;
	top:44px;
	z-index:1;
}
 .map_cadre_spend
{
width: 300px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}

.map_list
{
position:relative;
width:640px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
.map_list_spend
{
position:relative;
width:640px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
 #big_picture a.small:hover .large {position:fixed; top: 54px; left:100px; width:360px; height:270px;z-index:2000010;} 
}
@media (min-width: 1250px) {
	
.iframe_about{
	width:1250px;
	height:720px;}

}

@media (min-width: 1350px) {

 .map_cadre
 {	
 	width: 1100px;
	margin-left:0px;
	height:100%;
	position: fixed;
	top:44px;
	z-index:1;
}

 .map_cadre_spend {
width: 300px;
height:100%;
margin-left:0px;
position: fixed;
top:44px;
z-index:1;
}
.map_list
{
position:relative;
width:240px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
.map_list_spend
{
position:relative;
width:620px;
margin-right:0px;
margin-left:auto;
text-align:left;
}
 #big_picture a.small:hover .large {position:fixed; top: 54px; left:100px; width:360px; height:270px; z-index:2000010;} 
}