@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600|Open+Sans+Condensed:300,700&subset=latin,greek);
div, table, td, button, p, ul, li {font-family:'Open Sans',Arial,sans-serif;}
h1, h2, h3, h4, h5 {font-family:'Open Sans',Arial,sans-serif;}
.red{color:#cf2121;}
h1.home{font-size:19px; font-weight:700; border-bottom:1px solid #ccc; text-transform:uppercase;}
h2.home{font-size:17px; font-weight:600;}
.txt{FONT-WEIGHT: normal; FONT-SIZE: 13px;}
FONT {FONT-SIZE: 15px;}
.SmallText{FONT-SIZE: 13px; COLOR: #222222;}
.LangBar{FONT-SIZE: 15px; COLOR: #ffffff;}
a {COLOR: #333399;TEXT-DECORATION: none;}
a:hover{COLOR: #ff0000;} 
a.Portal{FONT-SIZE: 13px; COLOR: #333399;TEXT-DECORATION: none;}
a.Nav {FONT-SIZE: 13px;COLOR: #333399; TEXT-DECORATION: none;}

/*Top string*/
.top {width:100%; padding:6px 0; background-color:#0d1846; margin:-10px 0 20px -10px; position:fixed; z-index:10;}
.topstring {margin:0 auto; font-size:13px; font-weight:normal; color:#ccc;}
/*.topstring img {display:inline-block; position:relative; margin:0; padding:0;}*/
.topstring a, .topstring-part.language a {color:#fff;}
.topstring a:hover {color: #ccc;}
.language {overflow:hidden; text-align:center; font-size:120%; background-color:#465F8C; vertical-align:middle;}
.language a {display:block; margin:0 auto; width:22px; height:22px; line-height: 22px;}
.topstring-part {display:inline-block; margin:0 5px; vertical-align:middle; padding:5px; }

/* Google Search*/
.gsc-control-cse, .gsc-control-cse-el {padding:0!important; border:none!important; background-color:#0d1846!important;}
.gsc-input-box {padding-top: 0!important;}

/*Google map pin popover*/
.gm-style-iw-d {line-height: 22px; margin-right:10px; margin-bottom:10px; margin-top:-20px; padding-top:0px; font-weight: bold;}

.social {margin:0 10px;float:right;padding:5px 0;}
.social-icon, .social-icon-text {display:block;float:left;margin-right:8px;width:18px;opacity: 1.0;}
.social-icon img {vertical-align:middle; display:inline-block; border:none;}
.social-icon:hover {cursor:pointer; opacity: 0.5;filter:alpha(opacity=50);}
.social-icon-text {width:auto; white-space:nowrap;}
.social-icon-text:hover {cursor: auto; opacity: 1.0;filter:alpha(opacity=100);}

.fb {background-position: 0 0;}
.fb:hover {background-position: 0 -36px;}
.twitter {background-position: -288px 0;}
.twitter:hover {background-position: -288px -36px;}
.gplus {background-position: -108px 0;}
.gplus:hover {background-position: -108px -36px;}

/*Header - Menu*/
ul.menu {display:block;margin: 15px 0 20px 0;padding:0;text-indent:0;border-bottom:3px solid #C00; width:100%; overflow:hidden;}
ul.menu li {display:block;padding:5px 0 10px;margin-right:37px;float:left;font-size:16px;letter-spacing:0;list-style-type:none;text-indent:0;}
ul.menu li.selected a {color:#C00; font-weight:700;}
ul.menu a {color:#0d1846; font-weight:400; }
ul.menu a:hover {color:#C00; }
.MainMenu {FONT-WEIGHT: bold; FONT-SIZE: 12px; padding:5px; background-color:#0d1846; color:#FFFFFF; text-align:center;}
a.MainMenu {margin:0px;	padding:5px 17px; color:#FFFFFF; border-right:1px solid #B4B7DC;/*background-color: #E2E6F1;*/}
a.selected {background-color: #C3C3E1;}
a.MainMenu:hover {background-color: #C3C3E1; color:#FFFFFF;}
.sidemenu {background-color: #fff; margin: 0 auto; line-height:18px;}
.sidemenutitle {color: #cf2121; padding:0 0 5px; margin-bottom:20px; font-weight: 400; text-transform: uppercase; font-size: 16px!important; border-bottom:1px solid #ccc;}
.ad {padding:10px; background-color:#336699;}
.SmallWight{FONT-WEIGHT: bold; FONT-SIZE: 8pt; COLOR: #ffffff;}
.SmallBlack {FONT-SIZE: 8pt;}
table.accommodationsearch td {text-align:left; vertical-align: middle; white-space:nowrap;}
.SmallGrey {FONT-WEIGHT: bold; FONT-SIZE: 8pt;  COLOR: #c3c3e1;}

/*Main body*/
.main_container {width:100%;}
table.content {display:block; border:none; width:980px; margin:0 auto; position:relative; z-index:2; top:50px; padding:0; background-color: rgba(255, 255, 255, 0.9);}
h1.page-title {font-size:28px; letter-spacing: -.01em;}
h2.page-title {font-size:23px;}
h3.page-title {font-size:18px;}
h4.page-title {font-size:17px;}
div#list-overview.tab-pane.fade.show.active div.lead li {font-size: 1.25rem!important; font-weight: 300;}
div#list-overview.tab-pane.fade.show.active div.lead h2 {font-size: 1.5rem!important; font-weight: 500; margin-top:15px}
div#list-overview.tab-pane.fade.show.active div.lead h3 {font-size: 1.4rem!important; font-weight: 500; margin-top:15px}
div.lead h3 {font-size: 1.4rem!important; font-weight: 500; margin-top:15px}
div.lead h4 {font-size: 1.2rem!important; font-weight: 500; margin-top:15px}
div#list-overview.tab-pane.fade.show.active div.lead br {line-height: 15px;}

/* Shadowbox*/
#sb-container {z-index: 1021!important;}

/* Article view styles*/
.photo {width:150px;float:left;margin-right:5px;border:1px solid #cccccc;}
.photoframe {width:150px;height:150px;float:left;margin-right:10px;margin-bottom:10px;text-align:center;}
h3.article {font-size:17px;color:#333333;margin:0px 0px 15px 0px;padding:0px;}
h4.article {font-size:15px;border-bottom:1px solid #cccccc;}
.releasedate {float:right;margin-left:10px;font-size:70%;font-weight:normal;color:#999999;}
.mainimage {width:100%;height:380px;border:1px solid #cccccc;overflow:hidden;}

/* Photopass */
div.photopass {
	display:block;
	height:110px;	
	text-align:center;
	border:1px solid #ccc;
	margin:5px 0 5px; 
	color:#666; 
	}
div.photopass:hover {
	background-color:#CCC;
	}
div.photopass a {
	display:block;
	margin-top:60px;
	font-size:80%;
	font-weight:bold;
	}

/*Locpage map image*/
/*div.main_image {width:100%;overflow:hidden;margin:10px 0;}
/*div.main_image img.main_image {width:100%;}

/*Hotel search results thumbs*/
div.thumb {display:block;width:265px;height:172px;cursor: pointer; float:right; margin: 0 0 5px 15px; background-position:center; background-repeat:no-repeat; overflow:hidden;}
.hotelthumbs {background-size:cover;}
.logothumbs {background-size:contain;}
div.thumb img {display:block; margin:0 auto;}
.friendlyurl {font-size:10px; float:left; padding:6px 0px 5px 0px}
.addtomytrip {font-size:10px;text-align:right;float:right; padding:5px 0px 5px 0px;}

/*Card titles*/
div.card > div.card-body > h3.card-title {font-size: 145%;}

/*Location Details*/
.info-item {display:block;float:left;width:auto;padding:3px 5px;margin:5px 5px 0 0;background-color:#DFDFDF;text-transform:uppercase;font-size:85%;border-radius:3px;}
.info-item:hover, .info-item a:hover {background-color: #666;color:#fff;}
.copyrightholder {color:#FFF;position:relative; float: right; width: auto; background: rgba(0,0,0,.4); background-blend-mode: overlay; padding: 10px 12px; margin-top: -43px; z-index: 10;}
.copyrightholder a {color:#FFF;}

/*Modals*/
.modal-back {
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color: rgba(0,0,0,0.6);
	z-index:20;
}
.modal_old {
	display:block;
	position: relative;
	z-index:21;
	width:60%;
	height:auto;
	overflow: auto;
	top:45px;
	margin: 0 auto;
	padding:60px;
	background-color:#FFFFFF;
	color:rgba(74,46,46,1.00);
	box-shadow:0 0 25px rgba(0,0,0,0.6);
	letter-spacing:-1px;
}
.modal_old p, .modal button {font-size:16px!important; text-align:center;}
.modal_old button {border:none; margin:5px 20px; color:#fff;}
.modal_old button.btn-default:hover, .modal button.btn-inactive:hover {background-color: rgba(104,33,34,1.00); cursor:pointer;}

.modal_old button.btn  {padding:10px 18px; white-space:nowrap;}
.modal_old button.btn-default {background-color:#A30002;}
.modal_old button.btn-inactive {background-color:#4E558B;}
.modal_old blockquote {margin:0 50px; padding:0;}

div.ferryconnections {
	background-image: url(../images/topWave.png); 
	background-position:center bottom; 
	background-repeat:no-repeat;}
	
img.responsive  {max-width:100%;}

/*Carousel*/
.carousel-caption {background-color: rgba(13,24,70,0.4);}
	
/*Animations*/
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
	opacity:0;  
	-webkit-animation:fadeIn ease-in 1; 
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	
	-webkit-animation-duration:0.3s;
	-moz-animation-duration:.3s;
	animation-duration:.3s;
}

@-webkit-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
@-moz-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
@keyframes fadeOut { from { opacity:1; } to { opacity:0; } }

.fade-out {
	opacity:0;
	-webkit-animation:fadeOut ease-in 1; 
	-moz-animation:fadeOut ease-in 1;
	animation:fadeOut ease-in 1;

	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	
	-webkit-animation-duration:0.3s;
	-moz-animation-duration:.3s;
	animation-duration:.3s;
}

.footer-wrapper {
	background-color: rgb(233, 233, 233); 
	padding: 20px;
} 


/*Sticky top*/

@media (min-width: 992px) {

	.sticky-lg-top{
		top: 5rem;
		right: 0;
		z-index: 2;
		height: calc(100vh - 7rem);
		margin-bottom: 25rem;
	}
}

@media (min-width: 560px) {

	.sticky-sm-top{
		top: 5rem;
		right: 0;
		z-index: 2;
		height: calc(100vh - 7rem);
	}
}

/*Lead*/
div.lead cite {font-size: 16px;}
div.lead p, div.lead li {font-size: 1.25rem;}
div.lead a {font-weight: 400;}
div.lead a:hover {text-decoration: underline;}