﻿/* Desktop */
@media screen and (min-width: 1241px){
/*DO THIS*/
#top_mobile {display: none;}
/*Menu*/
#topmenu {
	position:fixed;
	top: 5.4vw;
	left:28vw;
	width:60%;
	height: 1.3vw;
	z-index: 999;
    text-align: center;
    display: initial;
    /*border: 2px solid #ff0000;*/
}
/*End Menu*/
#topmenutablet {
    display: none;
}
#topmenumobile {
    display: none;
}
#menuicon {
    display: none;
}
#topbasket {
	position:absolute;
	color:#ffffff;
	left:82%;
	top: 1.5vw;
	font-size: 0.8vw;
	white-space: nowrap;
	width: 4.5vw;
	z-index:1001;
	/*border: 1px solid #ff0000;*/
}
img {
	max-width: 100%;
	max-height: 100%;
}

#topbasketcheckout {
	position:absolute;
	left:87%;
	top: 1.5vw;
	width: 2.0vw;
	z-index:1001;
	/*border: 1px solid #ffff00;*/
}

.topnavigation {
	font-size: 1.2vw;
	font-family: Arial Narrow;
	text-decoration: none;
	color: #ffffff;
}
a.topnavigation:hover {
	color: #ee4d9b;
	cursor:pointer;
}
#toplogo {
	position:relative;
	top: 4vw;
	left:10vw;
	width:30vw;
	z-index:998;
	/*border: 2px solid #ffff00;*/
}
#toplogo img {
	width: 100%;
}
#page_strap,#topcontact1,#topcontact2,#topcontact3,#topcontact4,#christmastop {
	position:absolute;
	font-family: Arial Narrow;
	text-align:center;
	color: #ffffff;
	text-decoration: none;
	z-index:1111;
}
#page_strap {
	top: 7.5vw;
	left:65vw;
	width:25vw;
	font-size: 3vw;
	font-weight:bold;
	line-height: 1.5;
	/*border: 1px solid #ff0000;*/
}
#topcontact2 {
	top: 0.6vw;
	left:67vw;
	height:1.9vw;
	color: #ffffff;
	font-size: 1.9vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact2{
text-decoration: none;
}
#topcontact3 {
	top: 2.8vw;
	left:67vw;
	height:1.9vw;
	font-size: 1.2vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact3 {
text-decoration: none;
color: #ee4d9b;
}

a.topcontact3:hover {
	color: #ffffff;
}
#topcontact4 {
	position:fixed;
	top: 1.1vw;
	left:87%;
}
.topcontact4 {
	border-radius:5px;
	width:3.0vw;
	height:3.0vw;
}
#christmastop {
    display: none;
}
/*
#christmastop {
	top: 11.75vw;
	left:40%;
	width:30%;
	height:6vw;
	font-size: 1vw;
	font-weight:bold;
	background-color:rgba(26, 159, 234, 0.8);
	padding: 10px 10px 10px 70px;
	background-image: url("../images/holly.png");
	background-size: 17% auto;
	background-repeat: no-repeat;
	background-position: left center;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
*/
}/* END PC */

/* Mobile landcape and Tablets*/
@media screen and (min-width: 601px) and (max-width: 1240px){
/*DO THIS*/
#top_mobile {display: none;}
/*Menu*/
#topmenu {
	position:fixed;
	top: 5.4vw;
	left:28vw;
	width:60%;
	height: 1.3vw;
	z-index: 999;
    text-align: center;
    display: initial;
    /*border: 2px solid #ff0000;*/
}
/*End Menu*/
#topmenutablet {
    display: none;
}
#topmenumobile {
    display: none;
}
#menuicon {
    display: none;
}
#topbasket {
	position:absolute;
	color:#ffffff;
	left:87%;
	top: 1.5vw;
	font-size: 0.8vw;
	white-space: nowrap;
	width: 4.5vw;
	z-index:1001;
	/*border: 1px solid #ff0000;*/
}
img {
	max-width: 100%;
	max-height: 100%;
}

#topbasketcheckout {
	position:absolute;
	left:92%;
	top: 1.5vw;
	width: 2.0vw;
	z-index:1001;
	/*border: 1px solid #ffff00;*/
}

.topnavigation {
	font-size: 1.2vw;
	font-family: Arial Narrow;
	text-decoration: none;
	color: #ffffff;
}
a.topnavigation:hover {
	color: #ee4d9b;
	cursor:pointer;
}
#toplogo {
	position:relative;
	top: 4vw;
	left:10vw;
	width:30vw;
	z-index:998;
	/*border: 2px solid #ffff00;*/
}
#toplogo img {
	width: 100%;
}
#page_strap,#topcontact1,#topcontact2,#topcontact3,#topcontact4,#christmastop {
	position:absolute;
	font-family: Arial Narrow;
	text-align:center;
	color: #ffffff;
	text-decoration: none;
	z-index:1111;
}
#page_strap {
	top: 7.5vw;
	left:65vw;
	width:25vw;
	font-size: 3vw;
	font-weight:bold;
	line-height: 1.5;
	/*border: 1px solid #ff0000;*/
}
#topcontact2 {
	top: 0.6vw;
	left:67vw;
	height:1.9vw;
	color: #ffffff;
	font-size: 1.9vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact2{
	text-decoration: none;
}
#topcontact3 {
	top: 2.8vw;
	left:67vw;
	height:1.9vw;
	font-size: 1.2vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact3 {
text-decoration: none;
color: #ee4d9b;
}
a.topcontact3:hover {
	color: #ffffff;

}
#topcontact4 {
	position:fixed;
	top: 1.1vw;
	left:87%;
}
.topcontact4 {
	border-radius:5px;
	width:3.0vw;
	height:3.0vw;
}
#topcontact5 {
	top: 17vw;
	left:15%;
	width:20%;
	height:1.5vw;
	font-size: 1.0vw;
	font-weight:bold;
}
#christmastop {
    display: none;
}
/*
#christmastop {
	top: 11.75vw;
	left:40%;
	width:30%;
	height:6vw;
	font-size: 1vw;
	font-weight:bold;
	background-color:rgba(26, 159, 234, 0.8);
	padding: 10px 10px 10px 70px;
	background-image: url("../images/holly.png");
	background-size: 17% auto;
	background-repeat: no-repeat;
	background-position: left center;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
*/
/* END Mobile landcape and Tablets*/
}

/* Mobile portrait */
@media screen and (max-width: 600px){
/*DO THIS*/
#top-container {display: none;}
#topmenu {display: none;}
#topmenutablet {display: none;}
#stickyHeader {display: none;}
#top_mobile {
	position:fixed;
	top: 0px;
	left:0px;
	width:100%;
	background-image:url('../images/TRT_header_image.png');
	background-size:100%;
	background-repeat:no-repeat;
	height: 25vw;
	z-index:1111;
}
#topmenumobile {
position:fixed;
top:0px;
/*top:0px;*/
width:100%;
height:10vw;
/*background: linear-gradient(#DEDEDE, #F7F7F7);*/
line-height:6px;
text-align:center;
border-style: solid;
border-top-width: 0;
border-right-width: 0;
border-left-width: 0;
border-bottom-width: 2px;
z-index:999998;
color: #ffffff;
}

#topbasket {
	position:fixed;
	color:#000000;
	left:77%;
	top: 1.5vw;
	font-size: 2vw;
	white-space: nowrap;
	width: 10vw;
	z-index:1001;
	/*border: 1px solid #ff0000;*/
}
img {
	max-width: 100%;
	max-height: 100%;
}

#topbasketcheckout {
	position:fixed;
	left:87%;
	top: 1.5vw;
	width: 5.0vw;
	z-index:1001;
	/*border: 1px solid #ffff00;*/
}

.topnavigation {
	font-size: 2.5vw;
	font-family: Arial Narrow;
	text-decoration: none;
	color: #ffffff;
}
a.topnavigation:hover {
	color: #ee4d9b;
	cursor:pointer;
}
.bullets li  {
	display:list-item;
}
.mobile li  {
	display:inline;
	/*margin:0 4px;*/
	line-height:0.95;
	display:list-item;
	list-style:circle;
	/*padding-left:5px;*/
	color:#ee4d9b;
}
#menuicon {
	position:fixed;
	top:1px;
	left: 0px;
    width: 100px;
    height: 25px;
	z-index:999999;
    /*border: 1px solid #ffffff;*/
}
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
	display: none;
	position: absolute;
	background-color:rgba(98, 98, 98, 0.8);
	min-width: 200px;
	box-shadow: 0px 6px 14px 0px rgba(0,0,0,0.3);
	padding: 12px 16px;
	text-decoration: none;
	z-index: 999999;
}
.dropdown:hover .dropdown-content {
    display: block;
}
#toplogo {
	position:fixed;
	top: 4vw;
	left:10vw;
	width:30vw;
	z-index:998;
	/*border: 2px solid #ffff00;*/
}
#toplogo img {
	width: 100%;
}

#page_strap,#topcontact1,#topcontact2,#topcontact3,#topcontact4,#christmastop {
	position:fixed;
	font-family: Arial Narrow;
	text-align:center;
	color: #ffffff;
	text-decoration: none;
	z-index:1111;
}

#page_strap {
	top: 7.5vw;
	left:65vw;
	width:25vw;
	font-size: 3.0vw;
	font-weight:bold;
	line-height: 1.5;
	/*border: 1px solid #ff0000;*/
}
#topcontact2 {
	top: 0.6vw;
	left:67vw;
	height:1.9vw;
	color: #ffffff;
	font-size: 2.5vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact2{
text-decoration: none;
}
#topcontact3 {
	top: 2.8vw;
	left:67vw;
	height:1.9vw;
	font-size: 2.0vw;
	/*text-shadow: -1px 0 #dddddd, 0 1px #dddddd, 1px 0 #dddddd, 0 -1px #dddddd;*/
}
.topcontact3 {
text-decoration: none;
color: #ee4d9b;
}

a.topcontact3:hover {
	color: #ffffff;

}

#topcontact4 {
	position:fixed;
	top: 1.1vw;
	left:30%;
}
.topcontact4 {
	border-radius:2px;
	width:4.0vw;
	height:4.0vw;
}
#topcontact5 {
	top: 17vw;
	left:15%;
	width:20%;
	height:1.5vw;
	font-size: 1.0vw;
	font-weight:bold;
}
a.topcontact5:link {
	color: #ffffff;
}
a.topcontact5:visited {
	color: #ffffff;
}
a.topcontact5:hover {
	color: #051145;

}
a.topcontact5:active {
	color: #ffffff;
}

#christmastop {
    display: none;
}
/*
#christmastop {
	top: calc(5.5vw + 35px);
	left:50%;
	width:37%;
	height:10vw;
	font-size: 1.5vw;
	font-weight:bold;
	background-color:rgba(26, 159, 234, 0.8);
	padding: 5px 10px 5px 50px;
	background-image: url("../images/holly.png");
	background-size: 24% auto;
	background-repeat: no-repeat;
	background-position: left center;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    z-index:1001;
}
*/

/*End Phone */
}
/*----------------------------------------*/
/*For all Widths, Do This*/

.dot {
  height: 0.4vw;
  width: 0.4vw;
  background-color: #fff;
  border-radius: 50%;
  display: inline-block;
}


/*TOP MOVE THEN STICKY*/
.top-container {
  background-image:url('../images/TRT_header_image.png');
  background-size:100%;
  background-repeat:no-repeat;
  height: 25vw;
}
.header {
  /*height: 2vw;*/
  padding: 0.7vw 0 0.7vw 0;
  text-align:center;
  background: #222b31;
  color: #f1f1f1;
  z-index: 999999;
}
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  padding: 0.7vw 0 0.7vw 0;
}
/*END OF TOP MOVE THEN STICK*/


