html, body{ margin: 0; padding: 0; height: 100%; }
p, span{ font-family: 'Open Sans', sans-serif; font-weight: 300; font-size: 20px; margin: 10px 0; }
h1{ font-family: 'Open Sans', sans-serif; font-weight: 300; font-size: 45px; margin: 5px auto 5px; text-transform: uppercase; color: #FFF; }
h1 strong{ font-weight: 800; }
h2{ font-family: 'Open Sans', sans-serif; font-weight: 300; font-size: 40px; margin: 10px 0; }
h2 strong{ font-weight: 800; }
a{ font-family: 'Open Sans', sans-serif; font-weight: 600; }
.clear{ clear: both; }

.fullwidth{ width: 100%; display: inline-block; }

.hoverpanel{ position: absolute; width: 100%; z-index: 999; text-align: center; }
.hoverpanel .bordermax{ max-width: 70%; background: url(../img/background-dottedline.png) repeat-x top; padding-top: 5px; }
.hoverpanel > div{ max-width: 100%; margin: 0 auto; }
.hoverpanel h1{ }
.hoverpanel .col{ width: 33%; float: left; text-align: left; min-height: 85px; }
.hoverpanel p{ color: #FFF; padding: 0 20px 0 80px; }
.hoverpanel p strong{ font-weight: 800; }
.hoverpanel .col.world{ background: url(../img/icon_world.svg) no-repeat left 10px; }
.hoverpanel .col.phone{ background: url(../img/icon_iphone.svg) no-repeat left 10px; background-size: 59px 73px; }
.hoverpanel .col.e{ background: url(../img/emotion_logo.svg) no-repeat left 10px; background-size:  55px 53px; }
.hoverpanel .row{ max-width: 90%;}
.hoverpanel div.row.twocol .col{ width: 50%; float: left; }
.hoverpanel .languages{ text-align: right; }
.hoverpanel .languages ul{ margin: 0; padding: 0; list-style: none; }
.hoverpanel .languages ul li{ display: inline-block; margin-left: 10px; }
.hoverpanel .languages ul li a{ font-weight: 400; font-size: 12px; color: #8cb1da; text-transform: uppercase; text-decoration: none; line-height: 59px; }
.hoverpanel .languages ul li a:hover, .hoverpanel .languages ul li.selected a{ color: #FFF;}


.panel{ position: relative; min-width: 33.33%; max-width: 33.33%; min-height: 760px; max-height: 800px; float: left; background-repeat: repeat-x; background-size: 100% 100%; padding-top: 300px; }

.panel.yellow{ background-image: url(../img/yellow_bg.jpg); }
.panel.yellow p, .panel.yellow h2 { color: #272771; }
.panel.blue{ background-image: url(../img/blue_bg.jpg); }
.panel.blue p, .panel.blue h2 { color: #FFF; }
.panel.red{ background-image: url(../img/red_bg.jpg); }
.panel.red p, .panel.red h2 { color: #0035ad; }
.panel.red h2 {height: 100% !important;}
/*.panel.red .british-logo{background-image: url(../img/british_logo.png); background-repeat: no-repeat; background-position: top; background-size: auto 100%; height: 58px; margin-top: -15px; }*/
.panel.red .british-logo{ max-height: 58px; max-width: 100%; margin: 0 auto; margin-top: -10px; }


.panel .row{ width: 80%; margin: 0 auto 20px; text-align: center; }
.panel .row.button{ margin: 0 auto; }
.panel .row img.creditcard{ max-width: 100%; margin: 0 auto; }
.panel .row > .left{ width: 50%; float: left; }
.panel .row  > .right{ width: 50%; float: left; }
.panel .row.icons{ margin-top: 50px; }
.panel .row.icons p{ font-size: 16px; font-weight: 600; }
.panel .row .content{ padding: 10px; }
.panel.yellow .row .content.two{ border-left: 1px dotted #8b6d25; }
.panel.blue .row .content.two{ border-left: 1px dotted #FFF; }
.panel.red .row .content.two{ border-left: 1px dotted #708fd1; }
.panel .row.alignparagraph p{ overflow: hidden; }

.panel .row.button a{ opacity: 0; max-width: 350px; margin: 60px auto 0; display: block; padding: 20px 30px 20px 30px; border: 1px solid #FFF; color: #FFF; text-transform: uppercase; text-decoration: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }

.panel .shadow{ background: url(../img/shadow-left.png) repeat-y left; width: 50px; min-height: 100%; z-index: 10; position: absolute; top: 0; }
.panel .shadow.left{ background-image: url(../img/shadow-left.png); }
.panel .shadow.right{ background-image: url(../img/shadow-right.png); background-position: right; right: 0; }

.panel.yellow .row.button a{ border: solid 1px #272771; color: #272771;  }
.panel.yellow .row.button a:hover{ background-color: #272771; border: solid 1px #272771; color: #FFF;  }
.panel.blue .row.button a:hover{ background-color: #FFF; color: #0061a8;  }
.panel.red .row.button a{color:#0035ad; border-color:#0035ad; }
.panel.red .row.button a:hover{ background-color: #0035ad; color: #fff; }

.wrapper{ width: 100%; position: relative; }
.footer{ width: 90%; margin: 0 auto; height: 40px; background-color: #FFF; position: relative; }
.footer .col{ width: 40%; float: left; }
.footer .col.two{ text-align: right; width: 60%; }
.footer ul{ margin: 0; padding: 0; list-style: none; }
.footer ul li{ display: inline-block; margin-right: 10px; }
.footer p, .footer ul li a{ font-weight: 600; color: #0061a8; font-size: 14px; text-decoration: none; line-height: 40px; margin: 0; }
.footer ul li a:hover{ text-decoration: underline; }
.footer .col.mobile{ display: none; }

.panel.red .custom-small-text{font-size:11px !important; font-weight: 300 !important; color: #0035ad; width: 100%; color: #0035ad; margin:0 auto; text-align:center; }
.panel.red .row.button a{margin-top:26px;}
@media only all and (min-width:1370px)  and (min-height:1050px){
	.wrapper{ height: 100%; }
	.panel{ min-height: 100% !important; max-height: 100% !important; padding: 0; }
	.panel .row.firstone{ margin-top: 300px; }
	.footer{ width: 100%; position: fixed; bottom: 0; z-index: 100; background-color: #ffffff;}
	.footer .col{ width: 35%; margin-left: 10%; display: inline-block;}
	.footer .col.two{ width: 35%; margin-right: 10%;display: inline-block; }
}

@media only all and (max-width:1370px),(max-device-width : 1024px)  and (max-height:770px), (max-height:900px){ 
	
}
@media only all and (max-width:1440px){
	.panel .row.button a{ background-image: none !important; padding: 20px 20px; }

}
@media only all and (max-width:1140px){
	h1{ font-size: 35px; }
	h2{ font-size: 25px; }
	p{ font-size: 14px; }
	.panel .row.icons p{ font-size: 14px; } 
	.panel .row.button a{ font-size: 14px; padding: 20px 20px; background-image: none !important; margin: 30px auto 10px; }
	.panel .row.button a:hover{ background-image: none !important; }
	.panel{ padding-top: 270px; }
	.panel .row img.creditcard{ max-width: 80%; }
	.hoverpanel .bordermax{ max-width: 80%; }
	.panel .row.button a{ opacity: 1 !important; }
	.panel .row.icons{ margin-top: 30px; }
	.panel .row .content img{ width: 80%; }
	
	.footer p, .footer ul li a{ font-size: 12px; }
	
	.footer{ height: auto; padding: 15px 0; }
	.footer ul li{ margin-right: 8px; }
	.footer .col{ width: 100%; margin-bottom: 15px; }
	.footer .col, .footer .col p{ text-align: center; }
	.footer p, .footer ul li a{ font-size: 12px; line-height: 130%; }
	.footer .col.two{ display: none; }
	.footer .col.two.mobile{ display: block; width: 100%; }
	
	
	.hoverpanel .col.world{background-size:  auto 43px; background-position: 20px 10px;}
	.hoverpanel .col.phone{  background-size: auto 53px; background-position: 20px 10px; }
	.hoverpanel .col.e{  background-size:  auto 43px; background-position: 20px 10px;}
	
	
	.panel.red .row.button a{margin-top:0px;}
	.panel.red .row.icons{margin-bottom:5px;}
}
@media only all and (max-width:900px){
	.hoverpanel p{ padding: 10px 15px 0 80px; }
	.panel .row .content{ padding: 5px;}
	.hoverpanel .bordermax{ max-width: 90%; }
	.panel{ padding-top: 260px; }
	.panel .row{ width: 85%; }
	.panel .row .content.two{ border: none !important; }
	.panel .row.icons p{ font-size: 12px; }
	
	.panel.red .custom-small-text{width:100%; margin:8px 0px 8px 0px;}
}

@media only all and (max-width:600px){
	p{ font-size: 16px; }
	.panel .row.icons p{ font-size: 14px; }
	.hoverpanel > div{ max-width: 90%;}
	.hoverpanel div.row.twocol .col{ width: 100%; text-align: center; }
	.hoverpanel .languages ul li{ height: 30px; }
	.hoverpanel .languages ul li a{ line-height: 30px; color: #00a4e3; }
	.hoverpanel .languages ul li a:hover, .hoverpanel .languages ul li.selected a{ color: #FFF; }
	.hoverpanel div.row.twocol .col img{ width: 100%; max-width: 270px; }
	h1{ font-size: 25px; }
	.hoverpanel{ position: relative; background: #0061a8; padding-bottom: 20px; }
	.hoverpanel .col{ width: 100%; min-height: 55px;  }
	.panel{ padding: 60px 0px 50px; background-size: 100% 120%; background-position: bottom; }
	.panel .row img.creditcard{ max-width: 80%; }
	.panel .row .content img{ width: 65%%; }
	.panel{ max-width: 100%; min-height: 100% !important; }
	.hoverpanel .languages ul{ padding-top: 10px; }
	.hoverpanel .bordermax{ padding: 20px 0 0; }
	.panel .row.alignparagraph p, .panel .row.icons p, .panel .row.alignparagraph h2{ height: 100% !important; }
		
	.panel .shadow.left{ display: none; }
}