@charset "utf-8";
/* Global Styles */

/*
html {
	background: no-repeat top left fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	}
*/
/*---------------------------------------------*/
/* */
/*---------------------------------------------*/
.mainContent {
	/*display: block;*/
    -webkit-column-break-inside: avoid; /* Chrome, Safari */
    page-break-inside: avoid; /* Firefox */
    break-inside: avoid-column; /* CSS3, IE10+ */
    /* display: table; */
	
	float: center;
    width: 95%;
/*
    padding: 10px 10px 10px 50px;
	
	font-family: Capriola Regular;
	color: f3e5e5;
	font-size: 21px;
	font-weight: 500;
	line-height: 1.8;
	text-align: justify;
*/
	/* overflow-y: auto;*/
	}

/*---------------------------------------------*/
/* Cinema links                                */
/*---------------------------------------------*/
.externalResourcesNav .externalResources {
	/*background-color: rgba(208,207,207,1.00);*/
/*	display: block;*/
	display: inline-block;
	text-align: center;
	margin-top: 0px;
	padding-top: 1%;
	cursor: pointer;
	}
.stretch {
	content: '';
	display: inline-block;
	margin-left: 2%;
	margin-right: 2%;
	}

/*---------------------------------------------*/
/* Header                                      */
/*---------------------------------------------*/
header {
	text-align: center;
	display: block;
	}
header .logo {
	text-align: left;
	padding: 10px;
	}

/*---------------------------------------------*/
/* Cookie policy                               */
/*---------------------------------------------*/
/* Container holding the image and the text */
.cookieBar {
	position: relative;
	text-align: center;
	color: white;
	}
/* Centered text */
/*
.cookieText {
	position: absolute;
	vertical-align:middle;
	display: inline-table;
	text-align: center;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 1.5vw;
	font-family: sans-serif;
	font-weight: bold;
	}
.cookieBarText {
	font-size: 10px;
	font-family: sans-serif;
	font-weight: bold;
	}
*/
.box {
	position: relative;
	text-align: center;
	display: inline-block; /* Make the width of box same as image */
	}
.box .text{
	color: white;
	/*font-size: 1.5vw;*/
	font-family: sans-serif;
	font-weight: bold;

	position: absolute;
	z-index: 999;
	margin: 0 auto;
	left: 0;
	right: 0;
	top: 5%; /* Adjust this value to move the positioned div up and down */
	text-align: center;
	width: 60%; /* Set the width of the positioned div */
	}

.canvas {
    border: solid 1px #ccc;
    background-color: #000;
	
}

.cookie-banner {
  position: fixed;
  bottom: 40px;
  left: 10%;
  right: 10%;
  width: 80%;
  padding: 5px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #eee;
  border-radius: 5px;
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}
.close {
  height: 20px;
  background-color: #777;
  border: none;
  color: gray;
  border-radius: 2px;
  cursor: pointer;
}

/*---------------------------------------------*/
/* Footer                                      */
/*---------------------------------------------*/
footer {
	text-align: center;
	display: block;
	bottom: 0;
	height : 40px;
    margin-top : 40px;
	font-family: sans-serif;
	}
footer .footerDisclaimer {
	font-family: sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: rgba(104,103,103,1.00);
	font-weight: 700;
	}
footer .footerDisclaimer span {
	color: rgba(181,178,178,1.00);
	font-weight: 400;
	}
footer .footerNote {
	font-family: sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: rgba(104,103,103,1.00);
	font-weight: 700;
	}
footer .footerNote span {
	color: rgba(181,178,178,1.00);
	font-weight: 400;
	}

/*===============================================*/
/*---------------------------------------------*/
/* Keskmine video ja teksti osa                */
/*---------------------------------------------*/
.clearer {
    clear: both;
	}
/* Vasakpoolne tühi konteiner video vertikaalse asukoha reguleerimiseks */
.leftEmpty {
    float: left;
    width: 50%;
	}
/* Parempoolne konteiner Oglikute logo jaoks */
.rightOgglie {
    float: right;
    width: 50%;
	}
/* Vasakpoolne konteiner video konteineri jaoks */
.leftSide {
    float: left;
    width: 45%;
	padding: 0 0 0 5%
	}
/* Parempoolne konteiner filmi tutvustuse konteineri jaoks */
.rightSide {
    float: right;
    width: 50%;
	}

/* Konteiner nii video kui ka teksti mõlema jaoks */
.videoText {
    height: 100%;
    min-height:100%;
    position: relative;
	}
/* Konteiner video pikkuse-laiuse proportsiooni säilitamiseks */
.leftVideo {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px; 
    height: 0;
	}
/* Konteiner youtube video enda jaoks */
.leftVideo iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border: 5px solid white;
	}

/*---------------------------------------------*/
/* Muudame kirja suurust vastavalt laiusele    */
/*---------------------------------------------*/
/*
	 320px 	— 480px: 	Mobile devices
	 481px 	— 768px: 	iPads, Tablets
	 769px 	— 1024px: 	Small screens, laptops
	1025px 	— 1200px: 	Desktops, large screens
	1201+px — 			Extra large screens, TV
-------------------------------------------------
8K UHD 		7680×4320
Ultra HD 5K 5120×2880
4K 			4096×2160
Ultra HD 	3840×2160
UWQHD+ 		3840×1600
UWQHD 		3440×1440
WQXGA 		2560×1600
WQHD 		2560×1440
UWUXGA 		2560×1080
WUXGA 		1920×1200
Full HD 	1920×1080
WSXGA+ 		1680×1050
UXGA 		1600×1200
HD+ 		1600×900
WSXGA 		1440×900	[*]
WXGA 		1366×768
SXGA 		1280×1024	[*]
XGA 		1024×768 	[*]
SVGA		800x600
VGA			640×480		[*]
			320x568
-------------------------------------------------
https://mediag.com/blog/popular-screen-resolutions-designing-for-all/
_________________________________________________
						Pixel Size 		Viewport
_________________________________________________
iPhone 8 				750 x 1334 		375 x 667
iPhone 5 				640 x 1136 		320 x 568
iPad Mini 				768 x 1024 		768 x 1024
Samsung Galaxy Note 5 	1440 x 2560 	480 x 853
Samsung Galaxy S7 		1440 x 2560 	360 x 640
Samsung Galaxy Tab 10 	800 x 1280 		800 x 1280
-------------------------------------------------
*/

/* Kirja suurus kui lehitseja ei saa laiusest aru */
.cookieBarText {
	font-size: 40px;
	font-family: sans-serif;
	font-weight: bold;
	}
/* Konteiner teksti enda jaoks */
.rightText {
    padding:10px 0 0 10%;
	}
.rightText p {
	padding-right:30px;
	font-family: Futura PT, sans-serif;
/*	color: #005180;*/
	color: white;	
	font-size: 18px;
	font-weight: 500;
/*	line-height: 30px; */
	line-height: 1.8;
	text-align: justify;
/*	overflow-y: auto;*/
	}
.bigText {
		font-family: Capriola, sans-serif;
		color: #F2D171;
		font-size: 30px;
		padding-top: 1%;
	}

/* Suurus kuni 2048px                           */
@media all and (max-width : 2048px ){
	.cookieBarText {
		font-size: 18px;
		font-family: sans-serif;
		font-weight: bold;
		}
	/* Konteiner teksti enda jaoks */
	.rightText {
		padding:0px 0 0 10%;
		}
	.rightText p {
		padding-right:30px;
		font-family: Futura PT, sans-serif;
	/*	color: #005180;*/
		color: white;
		font-size: 18px;
		font-weight: 500;
	/*	line-height: 30px; */
		line-height: 1.5;
		text-align: justify;
	/*	overflow-y: auto;*/
		}
	}

/* Suurus kuni 1280 px                         */
@media all and (max-width: 1280px) {
	.cookieBarText {
		font-size: 14px;
		font-family: sans-serif;
		font-weight: bold;
		}
	/* Konteiner teksti enda jaoks */
	.rightText {
		padding:10px 0 0 10%;
		}
	.rightText p {
    padding-right: 30px;
    font-family: Futura PT, sans-serif;
    /*color: #DFE6EA;*/
	color: white;
    font-size: 16px;
    font-weight: 500;
    /*	line-height: 30px; */
    line-height: 1.5;
    text-align: justify;
	/*	overflow-y: auto;*/
		}
	}

/* Suurus kuni 1024 px                         */
/* Siin tõmbame teksti video alla              */
@media all and (max-width: 1024px) {
	.cookieBarText {
		font-size: 14px;
		font-family: sans-serif;
		font-weight: bold;
		}
	/* Konteiner teksti enda jaoks */
	.rightText {
		padding:10px 0 0 10%;
		}
	.rightText p {
		padding-right:30px;
		font-family: Futura PT, sans-serif;
	/*	color: #005180;*/
		color: white;
		font-size: 14px;
		font-weight: 500;
	/*	line-height: 30px; */
		line-height: 1.5;
		text-align: justify;
	/*	overflow-y: auto;*/
		}
	.leftEmpty,
	.rightOgglie {
        float: none;
        width: auto;
		}
	
    .leftSide, 
    .rightSide {
        float: none;
        width: auto;
		}
	}

/* Suurus kuni 768 px                          */
/* Siin tõmbame teksti video alla              */
@media all and (max-width: 768px) {
	.cookieBarText {
		font-size: 12px;
		font-family: sans-serif;
		font-weight: bold;
		}
	/* Konteiner teksti enda jaoks */
	.rightText {
		padding:10px 0 0 10%;
		}
	.rightText p {
		padding-right:20px;
		font-family: Futura PT, sans-serif;
	/*	color: #DFE6EA;*/
		color: white;
		font-size: 14px;
		font-weight: 500;
	/*	line-height: 30px; */
		line-height: 1.5;
		text-align: justify;
	/*	overflow-y: auto;*/
		}
	.leftEmpty,
	.rightOgglie {
        float: none;
        width: auto;
		}
	
    .leftSide, 
    .rightSide {
        float: none;
        width: auto;
		}
	}

/*---------------------------------------------*/
/* Suurus kuni 480 px                          */
/* Siin tõmbame teksti video alla              */
/*---------------------------------------------*/
@media all and (max-width: 480px) {
	.cookieBarText {
		font-size: 12px;
		font-family: Capriola;
		font-weight: bold;
		}
	/* Konteiner teksti enda jaoks */
	.rightText {
		padding:10px 0 0 10%;
		}
	.rightText p {
		padding-right:30px;
		font-family: Capriola, sans-serif;
	/*	color: #DFE6EA;*/
		color: white;
		font-size: 14px;
		font-weight: 500;
	/*	line-height: 30px; */
		line-height: 1.5;
		text-align: justify;
	/*	overflow-y: auto;*/
		}
	.leftEmpty,
	.rightOgglie {
        float: none;
        width: auto;
		}
	
    .leftSide, 
    .rightSide {
        float: none;
        width: auto;
		}
	}
</style>
