@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,600,600i&display=swap');

/*------------------------------------*\
    GLOBAL STYLES
\*------------------------------------*/

/*fonts*/
@font-face {
    font-family: 'oup-icons';
    src: url("../fonts/oup-icons.eot");
    src: url("../fonts/oup-icons.eot?#iefix") format('embedded-opentype'),
        url("../fonts/oup-icons.ttf") format('truetype'),
        url("../fonts/oup-icons.woff") format('woff'),
        url("../fonts/oup-icons.svg#oup-icons") format('svg');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

.icon-tick:before {
    content: "\e616";
}

#search-btn:before {
    content: "\e60b";
}

#arrow_select:before {
    content: "\e615";
}

.icon-filter:before {
    content: "\e992";
}
.icon-download:before {
    content: "\e9c7";
}
.icon-plus2:before{
    content: "\e611";
}
.icon-minus2:before{
    content: "\e612";
}
.icon-cross {
    line-height: 24px;
    vertical-align: middle;
    font-size: 16px;
}

.icon-cross::after {
    content: "\ea0f";
    padding-left: 5px;
    vertical-align: middle;
}

/* high level styles */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    /*padding: 0;*/
    border: 0;
    font: inherit;
    font-size: 100%;
    font-size:16px;
    vertical-align: baseline;
}

* {
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.clear_fix, #search-form, /*.wl-table tr,*/ .bar-slider {
    *zoom: 1;
}

.clear_fix:before, #search-form:before, /*.wl-table tr:before,*/ .bar-slider:before, .clear_fix:after, #search-form:after, /*.wl-table tr:after,*/ .bar-slider:after {
    content: "";
    display: table;
}

.clear_fix:after, #search-form:after, /*.wl-table tr:after,*/ .bar-slider:after {
    clear: both;
}

html {
    overflow-y: scroll;
    min-height: 100%;
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  * {
    -webkit-animation-duration: 0.01ms !important;
            animation-duration: 0.01ms !important;
    -webkit-animation-iteration-count: 1 !important;
            animation-iteration-count: 1 !important;
    -webkit-transition-duration: 0.01ms !important;
         -o-transition-duration: 0.01ms !important;
            transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

body {
    min-height: 100%;
    font-size: 100%;
    line-height: 1.6em;
    font-family: 'Source Sans Pro', sans-serif;
    color: #333333;
    background-color: #ffffff;
    min-width: 320px;
    -webkit-text-size-adjust: none; /* stops font scaling on iPhone rotation */
}

h1 {
    font-size: 28px;
    line-height: 1.2em;
    margin: 0 0 14px;
    color: #333333;
    font-weight: 600;
}

/*#main_column > h1 {
    margin-top: 7px;
}*/

h1.h, h1.my-wordlist-titles, #search-results h1,
.nearest-results {
    color: #0d3880;
    display: block;
    font-family: 'Source Sans Pro', sans-serif;
    margin-right: 10px;
    margin-top: 12px;
    line-height: 1.2em;
}

h1 + h2 {
    margin-top: 12px;
}

h2 {
    font-size: 31px;
    line-height: 42px;
    margin: 0;
    color: #0d3880;
}

h3 {
    font-size: 21px;
    font-weight: normal;
    line-height: 25px;
    padding: 7px 0;
    margin: 14px 0 7px;
    color: #282828;
}

h4 {
    font-size: 17px;
    line-height: 19px;
    font-weight: bold;
    margin: 0 0 7px;
    color: #282828;
}

h5 {
    font-size: 18px;
    line-height: 28px;
    font-weight: bold;
    margin: 7px 0 0;
    color: rgba(0, 0, 0, 0.7);
}

h6 {
    font-size: 15px;
    font-weight: bold;
    margin: 4px 0 3px;
    color: rgba(0, 0, 0, 0.7);
}

h1,h2,h3,h4,h5,h6 {
    text-rendering: optimizeLegibility;
}

.clear-both {
   clear: both;
}

ol, ul {
    list-style: none;
}

ol li {
    margin-bottom: 12px;
}

ol li:last-child {
    margin-bottom: 0;
}

a {
    text-decoration: none;
    color: #004aac;
    cursor: pointer;
}

a:hover{
    text-decoration:underline;
    cursor: pointer;
}

p {
    margin-bottom: 7px;
}

p.zero {
    margin-bottom: 0;
}

i {
    font-style: italic;
}

em {
    font-weight: bold;
}

strong {
    font-weight: bold;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table td {
    vertical-align: middle;
    font-weight: normal;
}

ul {
    padding: 0;
}

ul.disc {
    margin-left: 21px;
    margin-bottom: 14px;
    max-width: 700px;
    padding: 0;
}

ul.disc li {
    list-style-type: disc;
}

/*ul.menu li,*/ ul.paging_links li {
    display: table-cell;
    text-align: center;
}

pos {
    color: #555555;
    font-weight: normal;
    font-style: italic;
    font-size: 0.9em;
}
/* -end- high level styles */

/* authorizations */
.hide_all {
    display: none;
}

.show_premium {
    display: none !important;
}

.premium .show_premium {
    display: block !important;
}
/* -end- authorizations */

/* survey */

.survey{
    background:#76000a;
    padding: 8px 20px;
    color: #FFE4E4;
}

.survey .responsive_container{
    clear:none;
    min-width:0!important;
}

.survey a{
    color:#fff;
    font-weight:bold;
    text-decoration:none;
}

.survey .surveyClose {
    float: right;
}

/* end survey */

/* header bar */
.top {
    background: #00123C;
    min-height: 5px;
}

.topMarginBottom {
    margin-bottom: 0 !important;
}

.nav {
    position: relative;
    z-index: 10;
}

.nav a,
.nav li input {
    display: inline-block;
    padding: 8px 13px;
    line-height: 20px;
    color: white;
    font-size: 11pt;
    cursor: pointer;
}

.menu a.top-toolbar-off {
   color: grey;
}

.nav a:hover {
    text-decoration: none;
}

.nav ul.menu li a:hover:not(.top-toolbar-active) {
    background-color: #004aac;
}

.menu {
    display: table;
    vertical-align: middle;
    margin: 0;
    float: left;
    padding: 0;
}

.menu li {
    display: table-cell;
    text-align: center;
}

.main_nav .menu span, .main_nav .menu span a, .menu .is-selected a, .menu a.top-toolbar-active {
    display: block;
    padding: 0 15px;
    color: #00123c;
}

.main_nav .menu span, .menu a.top-toolbar-active {
    background-color: #f2f2f2;
    border-radius: 14px 14px 0 0;
    padding: 4px 14px 8px;
    border-right: 4px solid #00123c;
    border-left: 4px solid #00123c;
    border-top: 4px solid #00123c;
    text-decoration: none;
}

.nav .login-circle {
    margin: 0;
    float: right;
    background: url(../images/header/login-bg.png) 0 -50px no-repeat;
    height: 80px;
    width: 120px;
    margin-bottom: -50px;
    padding-top: 0;
    text-align: center;
}

.nav .login-circle a {
    white-space: normal;
    line-height: 18px;
}

.nav .login-circle:hover {
    background-position: 0 -45px;
    padding-top: 5px;
}

.nav .login-circle ul{
    padding: 0;
}

.nav .login-circle li:hover {
    background-color: transparent;
}

.nav .logout {
    float: right;
}

.nav .logout a, .nav .logout span {
    display: inline-block;
}

.nav .logout a:not(.top-toolbar-active):hover,
.nav .logout li input:hover {
    background-color: #8f0610;
}

.main_nav {
    -webkit-transition: max-height 1s ease;
    -o-transition: max-height 1s ease;
    transition: max-height 1s ease;
}

/*.menu_button {
    position: absolute;
    margin-right: 5px;
    top: 15px;
    right: 30px;
    height: 34px;
    width: 44px;
    background: white url(../images/header/menu-bars.png) no-repeat center center;
    background-size: 60%;
    border-radius: 4px;
    border: 1px solid #dddddd;
}

.menu_button:hover {
    cursor: pointer;
}*/

.nav .login-getpremium li {
    padding: 0 10px;
}

.menu.logout li input {
    font-family: inherit;
    background: none;
    border: none;
    border-radius: 0px;
    margin: 0;
    height: auto;
    outline: none;
    vertical-align: baseline;
}
.menu.logout li input::-moz-focus-inner {
    border: 0;
}
/* -end- header bar */

/* main logo */
.old-logo-title {
    background: url("../images/header/OLD-Logo.png") no-repeat;
    background-size: 100%;
    width: 460px;
    height: 82px;
    display: block;
    float: left;
}

.homepage .old-logo-title {
    width: 616px;
    height: 108px;
}

/* end main logo */

/* search bar */
#search-form{
    margin-top: 4px;
    background-color: #fff;
    padding: 2px;
    border: 1px solid #999999;
    position: relative;
}

.mainsearch {
    width: 728px;
    clear: both;
    margin-left: auto;
    margin-right: auto;
}

.mainsearch.responsive_row {
    margin-bottom: 11px;
}

/* input */
.searchfield {
    width: 67%;
    float: left;
}

.searchfield_input {
    font-size: 15px;
    width: 95%;
    outline: none;
    border: none;
    height: 30px;
}

/*Chrome*/
.searchfield_input::-webkit-input-placeholder{
    color: #757575;
}
/*Mozilla*/
.searchfield_input::-moz-placeholder {
    color: #757575;
}
/*IE*/
.searchfield_input:-ms-input-placeholder {
    color: #757575;
}

/* dictionary selector states */
.mainsearch #dictionarySelector {
    float: left;
    width: 27%;
    padding-bottom: 22px;
    margin-bottom: -22px;
}

#arrow_select {
    vertical-align: middle;
    font-size: .4em;
    color: white;
}

.mainsearch #dictionarySelector #select_div {
    padding: 8px 10px;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-block;
    line-height: 14px;
    border-right: 1px solid black;
}

.mainsearch #dictionarySelector option {
    color: #333333;
}

.mainsearch #dictionarySelector #select_div div {
    min-width: 160px;
    display: inline-block;
    padding-right: 3px;
}

.csm {
    top: 48px;
    left: 0px;
    background: #fff;
    border: 1px solid #999999;
    padding: 10px 0;
    font-size: 16px;
    line-height: 1.65em;
    position: absolute;
    display: none;
    width: 220px;
    z-index: 2147483646;
    -webkit-transform: translate3d(0,0,20px);
    -webkit-transform-style: preserve-3d;
}

.csm a {
    text-align: left;
}

.csm a span i.icon-tick:before {
    content: " ";
    padding: 0px 16px 0px 0px;
    margin: 0px 5px 0px 0px;
    background-image: url(../images/graphics/tick.svg);
    background-repeat: no-repeat;
    background-size: auto;
    background-position-y: center;
}

.locked {
    background: url("../images/restricted.svg") no-repeat;
    margin-left: 7px;
    background-size: contain;
    display: inline-block;
    width: 7px;
    height: 11px;
}

.csm a {
     padding: 10px;
    display: block;
    white-space: nowrap;
    color: #333333;
    font-weight: 600;
}



.csm a:hover{
    background-color:#d3ecfc;
    text-decoration: none;
}

.csm a .icon-tick{
    color:#aaa;
    margin-left:10px;
    font-size:0.7em;
    vertical-align:baseline;
}

.mainsearch #dictionarySelector select {
    display: none;
}

/* search button states */
#search-btn {
    float:right;
    height: 30px;
    cursor: pointer;
    line-height: 27px;
    color: #4877af;
    text-align: center;
    width: 31px;
    border-left: 1px solid black;
}

.mainsearch form #search-btn input {
    margin-top: -50px;
    height: 30px;
    width: 31px;
    border: none;
    background-color: transparent;
    outline: none;
    cursor: pointer;
}

#arrowClose {
    background: white;
    margin-right: 1px;
    padding-top: 4px!important;
    border-radius: 4px;
}

.oup_icons {
    vertical-align: text-bottom;
    display: inline-block!important;
    font-family: 'oup-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    color: #777;
    line-height: 1;
    font-size: 16px;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#keyboard_icon:hover {
    text-decoration: none;
}

#keyboard_icon:before {
    content: "\e600";
}

#keyboard_letters {
    display: none;
    background: #ddd;
    position: absolute;
    z-index: 999;
    height: 26px;
    -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
    white-space: nowrap;
    font-size: 16px;
    top: -29px;
    min-width: 502px;
}

#keyboard_letters a {
    color: #444;
    text-decoration: none;
    padding: 5px 2px 2px 2px;
}

#arrowKeyboard:before {
    content: "\e614";
}

#arrowClose {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    padding: 2px 2px 5px 2px!important;
    margin-top: 1px;
}

#arrowClose:before {
    content: "\e609";
}

/* -end- search bar */

/* premium menu bar */
.grey-grad, .ui-grad dt, .pron_row .btn, .pron_row input[type='submit'], .topic-mobile ul ul li:first-child, .wl-nav {
    -webkit-box-shadow: 0 50px 50px -30px white inset;
    box-shadow: 0 50px 50px -30px white inset;
    background-color: #cccccc;
    border: 1px solid #cccccc;
}

.grey-grad-inverse {
    -webkit-box-shadow: 0 -50px 50px -30px white inset;
    box-shadow: 0 -50px 50px -30px white inset;
    background-color: #cccccc;
}

.premium-navigation {
    overflow: hidden;
    width: 728px;
}

.premium-navigation a {
    color: white;
    font-weight: normal;
    padding: 8px 13px;
    display: block;
}

.premium-navigation span {
    margin: 0 21px;
    padding: 0;
}

.premium-navigation ul {
    background-color: #00123C;
    border-radius: 30px;
    padding:0;
    display:table;
    overflow: hidden;
}

.premium-navigation li:first-child {
    padding: 0 14px 0 16px;
    border: 1px solid #00123c;
    background-color: #f2f2f2;
    border-radius: 30px 0 0 30px;
    border-right-width: 0px;
    color: #00123c;
}

.premium-navigation li:first-child a:not(.top-toolbar-active):hover {
    border-radius: 18px 0 0 18px;
}

.premium-navigation li:last-child a.top-toolbar-active {
    border-radius: 0 20px 20px 0;
}

.premium-navigation li a:not(.top-toolbar-active):hover {
    background-color: #004aac;
    color: white;
    text-decoration: none;
}

.premium-navigation .menu a.top-toolbar-active {
    border-radius: 0px;
    border-width: 3px;
    padding-top: 5px;
    padding-bottom: 5px;
}
/* -end- premium menu bar */

/* premium menu dropdown */
.prem-nav-select {
    width: 100%;
    overflow: hidden;
    padding: 6px;
    color: #00123c;
    border: 1px solid rgba(0, 18, 60, 0.3);
    border-radius: 18px;
    position: relative;
}

.prem-nav-select {
    width: 100%;
    font-size: 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    border-radius: 18px;
    border-width: 0px;
    background: #f2f2f2 url(../images/header/icon-select-arrow-circle.png) 0px 0px no-repeat;
    margin: 0;
    padding: 0 0 0 28px;
    color: #00123c;
    line-height: 20px;
}

.prem-nav-select:hover {
    background-color: #00123c;
    color: #ffffff;
}

.prem-nav-select option{
    color: black;
    background-color: white;
}
/* -end- premium menu dropdown */

/* buttons */
.btn, input[type='submit'], input[type='button']#skipDef, input[type='button']#submitQuit {
    display: inline-block;
    width: auto;
    height: 30px;
    line-height: 26px;
    margin: 0 6px 6px 0;
    background: #ffffff;
    border: 2px solid #4577bf;
    border-radius: 15px;
    -webkit-appearance: none;
    text-align: center;
    position: relative;
    vertical-align: middle;
}

.btn > a, .btn > input {
    display: table-cell;
    padding: 0 12px;
    color: #4577bf;
    height: 26px;
    white-space: nowrap;
    font-weight: normal;
}

input[type='submit'], input[type='button']#skipDef, input[type='button']#submitQuit {
    font-size: 15px;
    padding: 0 12px;
    color: #4577bf;
    white-space: nowrap;
}

.btn:not(.inactive):hover {
    background: #4577bf;
    border: 2px solid #4577bf;
}

input[type='submit']:hover, input[type='button']#skipDef:hover, input[type='button']#submitQuit:hover {
    color: white;
    background-color:#4577bf;
}

.btn:not(.inactive):hover a {
    color: white;
}

.btn:not(.inactive):hover a:before {
      background-position: -1px bottom;
}

.btn:active {
    background-color: #07255e;
    border-color: #07255e;
}

.btn > a:hover {
   text-decoration: none;
}

.btn.icon-only {
    width: 30px;
}

.btn.icon-left a,
input.icon-left[type='submit'] a,
.btn.icon-left-colapse a,
input.icon-left-colapse[type='submit'] a {
    padding-left: 30px;
    position: relative;
}

.btn.icon-left a:before,
input.icon-left[type='submit'] a:before,
.btn.icon-left-colapse a:before,
input.icon-left-colapse[type='submit'] a:before {
    content: "";
    position: absolute;
    width: 28px;
    height: 26px;
    margin-left:-28px;
}

.btn.inactive, input.inactive[type='submit'] {
    background: grey;
    pointer-events: none;
}

.btn.inactive a, input.inactive[type='submit'] a {
    color: #333333;
}

.btn.record, .btn.play {
    margin-top: -8px;
}

.btn.record a:before, input.record[type='submit'] a:before {
    background-image: url("../images/pron_prac/btn-record.png");
    background-size:100%;
}

.btn.play a:before, input.play[type='submit'] a:before {
    background-image: url("../images/pron_prac/btn-play.png");
    background-size:100%;
}

.btn.btn-premium {
    background-color: #8f0610;
    border-color: #8f0610;
    margin-top: 10px;
}
.btn.btn-premium a {
    color: #ffffff;
}
.btn.btn-premium:not(.inactive):hover {
    background: #c00815;
    border-color: #c00815;
}

/* end buttons */

/* audio buttons */
.wordlist-oxford3000 .sound,
.webtop-g .sound,
.top-g .sound,
.ei-g .sound,
.if-g .sound,
.pron__wrap .sound {
    vertical-align: middle;
    display: inline-block;
    font-size: 14px;
}

.wordlist-oxford3000 .pron-uk,
.webtop-g .pron-uk,
.top-g .pron-uk,
.ei-g .pron-uk,
.if-g .pron-uk,
.pron__wrap .pron-uk,
.wotd-box .pron-uk {
    background-image: url(../images/documents/icon-audio-bre.png);
    background-repeat: no-repeat;
    background-position: left top !important;
    background-size:100%;
    width:24px;
    height:24px;
}

.wordlist-oxford3000 .pron-uk:hover,
.webtop-g .pron-uk:hover,
.top-g .pron-uk:hover,
.ei-g .pron-uk:hover,
.if-g .pron-uk:hover,
.pron__wrap .pron-uk:hover,
.wotd-box .pron-uk:hover {
    background-image: url(../images/documents/icon-audio-bre.png);
    background-repeat: no-repeat;
    background-position: left bottom !important;
}

.wordlist-oxford3000 .pron-us:hover,
.webtop-g .pron-us:hover,
.top-g .pron-us:hover,
.ei-g .pron-us:hover,
.if-g .pron-us:hover,
.pron__wrap .pron-us:hover,
.labelsAbout .pron-usonly:hover,
.wordlist-oxford3000 .pron-usonly:hover,
.webtop-g .pron-usonly:hover,
.top-g .pron-usonly:hover,
.ei-g .pron-usonly:hover,
.if-g .pron-usonly:hover,
.pron__wrap .pron-usonly:hover {
    background-image: url(../images/documents/icon-audio-name.png);
    background-repeat: no-repeat;
    background-position: left bottom !important;
}

.wordlist-oxford3000 .pron-us,
.webtop-g .pron-us,
.top-g .pron-us,
.ei-g .pron-us,
.if-g .pron-us,
.pron__wrap .pron-us,
.wotd-box .pron-us,
.labelsAbout .pron-usonly,
.wordlist-oxford3000 .pron-usonly,
.webtop-g .pron-usonly,
.top-g .pron-usonly,
.ei-g .pron-usonly,
.if-g .pron-usonly,
.pron__wrap .pron-usonly {
    background-image: url(../images/documents/icon-audio-name.png);
    background-repeat: no-repeat;
    background-position: left top !important;
    background-size:100%;
    width:24px;
    height:24px;
}
/* -end- audio buttons */

/* go to top arrow */
a.go-to-top {
    background: url("../images/go-to-top.png") no-repeat top center;
    background-size: 35px 25px;
    background-color: black;
    width: 48px;
    height: 48px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    color: white;
    cursor: pointer;
    outline: 0;
    z-index: 1;
    text-align:center;
    padding-top:20px;
    text-decoration:none;
    opacity: 0;
    visibility: hidden;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -o-transition: visibility 0s .4s, opacity .4s linear;
    transition: visibility 0s .4s, opacity .4s linear;
    -moz-transition: visibility 0s .4s, opacity .4s linear;
    -webkit-transition: visibility 0s .4s, opacity .4s linear;
}

@supports (-webkit-overflow-scrolling: touch) {
    /* CSS specific to iOS devices */
    a.go-to-top {
        bottom: 60px;
    }
}

a.go-to-top.visible {
    opacity: 1;
    visibility: visible;
    -o-transition: opacity .4s linear;
    transition: opacity .4s linear;
    -moz-transition: opacity .4s linear;
    -webkit-transition: opacity .4s linear;
}

/* -end- go to top arrow */

/* tint panels */
[class*="tint_panel"] {
    padding: 7px 13px;
    border-radius:7px;
}

[class*="tint_panel"] h3 {
    margin-bottom: 12px !important;
}

.tint_panel, .tint_panel_basic, .tint_panel_warning{
    background-color: #efefef;
    border: 1px solid #ddd;
    max-width: 700px;
}

.tint_panel_basic {
    background-color: #e0f2fd;
    border-color: #b0defa;
    border: none;
    margin-right: 0px;
    margin-left: 0px;
    padding-bottom:12px;
}

.tint_blue {
    background-color: #ecf5ff;
    border: 1px solid #ecf5ff;
}

[class*="tint_panel_inner"] {
    margin: 12px 0 12px;
}

.tint_panel_inner_light {
    background-color: white;
    border-color: white;
    border-radius:10px;
}

.tint_panel_inner_light > ol {
    list-style-type: decimal;
    padding-left: 20px;
}

[class*="tint_panel"] > h2, [class*="tint_panel"] > h3, [class*="tint_panel"] > h4 {
    margin-top: 0px;
}

.right-colum h3, .tint_panel h3 {
    border-bottom: 1px solid #282828;
}

#rightcolumn h4, .tint_panel h4 {
    padding: 0 0 8px;
    border-bottom: 1px solid #787878;
    margin-top:7px;
}
/* -end- tint panels */

/* table of content */
#rightcolumn .toc {
    position: relative;
    overflow: hidden;
}

#rightcolumn .toc_header {
    -webkit-box-shadow: 0 50px 50px -30px white inset;
    box-shadow: 0 50px 50px -30px white inset;
    background-color: #cccccc;
    border: 1px solid #cccccc;
    border-radius: 8px 8px 0 0;
    border-bottom: none;
}

#rightcolumn .toc_header h4 {
    padding-left: 25px;
    margin: 7px 0 0 0;
    border-bottom: none;
}

#rightcolumn .toc_content{
    border: 1px solid #cccccc;
}

#rightcolumn .data-fold .toc_content{
    display: none;
}

#rightcolumn .toc_content > a{
    padding-left: 7px;
}
/* -end- table of content */

/* hyperlinks */
p.links {
    margin-top: -10px;
    margin-bottom: 4px;
}

.link-right, .link-left, .link-down, .link-pdf {
    margin-right: 7px;
    display: inline-block;
    font-weight: normal;
}

.link-right:after, .link-left:before, .link-down:before, .link-pdf:before {
    position: relative;
    top: 1px;
    display: inline-block;
    content: "";
    width: 8px;
    height: 15px;
    margin-left: 5px;
    background: url("../images/documents/link-right.png") no-repeat center center;
    background-size:100%;
}

.link-left:before, .link-down:before, .link-pdf:before {
    background: url("../images/documents/link-left.png") no-repeat center center;
    margin-right: 5px;
    margin-left: 0;
    width: 8px;
    height: 15px;
    background-size:100%;
}

.link-pdf:before {
    background: url("../images/documents/icon-pdf.png") no-repeat scroll center center rgba(0, 0, 0, 0);
    height: 16px;
    margin-right: 6px;
    margin-top: 2px;
    width: 16px;
}

.about-link {
    margin-bottom: 14px;
}
/* -end- hyperlinks */


/*------------------------------------*\
    HOMEPAGE
\*------------------------------------*/

div#homeleft .row, .row.row_static_items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 10px;
    margin-bottom: 20px;
    margin-left: -10px;
    margin-right: -10px;
    width: initial;
}

div#homeleft .row:first-child {
margin-bottom:20px;
}

div#homeleft .box-primary {
    background: white;
    /*margin: 10px 0px 20px 0px;*/
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 20px;
    padding-bottom: 40px;
    width: 63%;
    min-height: 250px;
    margin-left: 1%;
    margin-right: 1%;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}

div#homeleft .box-primary .box-content {
    padding:0px;
    padding-right: 40px;
}

div#homeleft .box-primary img {
    max-width: initial;
    height: auto;
    width: 30%;
    display:block;
    margin:auto;
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

div#homeleft .box-primary h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3em;
    padding-bottom: 15px;
    padding-top: 15px;
    margin-bottom:0px;
}

@media screen and (min-width: 500px) and (max-width: 991px){
div#homeleft .box-primary {
    width: 48%;
    margin-right:1%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;

}
    div#homeleft .box-primary .box-content {
    padding-right: 0px;
}
    div#homeleft .box-primary img {
    width: 60%;
}
}

@media screen and (max-width: 500px){
div#homeleft .box-primary {
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom:20px;
    width: 100%;
}
        div#homeleft .box-primary .box-content {
    padding-right: 0px;
}
    div#homeleft .box-primary img {
        width: 50%;
        padding:0px;
}
}

div#homeleft .box-secondary {
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 20px;
    padding-bottom: 40px;
    width: 23%;
    min-height: 250px;
    margin-left: 1%;
    margin-right: 1%;
}

div#homeleft .box-secondary .box-content {
    padding:0px
}

div#homeleft .box-secondary img {
    max-width:100% !important;
}

div#homeleft .box-secondary h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3em;
    padding-bottom: 15px;
    padding-top: 15px;
    margin-bottom:0px;
}

@media screen and (min-width: 500px) and (max-width: 991px){
div#homeleft .box-secondary {
    width: 48%;
}
}

@media screen and (max-width: 500px){
div#homeleft .box-secondary {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
}
}

.row.row_static_items .box {
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 20px;
    padding-bottom: 40px;
    width: 31%;
    min-height: 250px;
    margin-left: 1%;
    margin-right: 1%;
}

.row.row_static_items .box .box-content {
    padding:0px
}

.row.row_static_items .box .box-content h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3em;
    padding-bottom: 15px;
    padding-top: 15px;
    margin-bottom:0px;
}

@media screen and (max-width: 650px){
.row.row_static_items .box {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
}
}




/* home page boxes */
.box {
    -webkit-box-shadow: 0 1px 5px grey;
    box-shadow: 0 1px 5px grey;
    margin-right: 1.2em;
    background: white;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.box .box-content{
    padding: 1.2em;
}
.box h2 {
    font-size: 21px;
    line-height: 30px;
    margin: 0 0 16px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: normal;
    color: #0d3880;
}

.box h3 {
    font-size: 18px;
    padding-left: 42px;
    color: #14387f;
    margin-top: -12px;
    font-weight: normal;
}

.box p {
    line-height: 21px;
    margin-bottom: 7px;
}
.box img {
    width:100%;
}
.box .box-space {
    margin-right: 120px;
}
.box-padding {
    display: table-cell;
    width: 1.2em;
}

/* IE10+ only */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .row.row_static_items .box,
    div#homeleft .box-secondary {
        display: block;
    }

    .box img {
        width: auto;
    }
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 18px;
}

.dynamicPanelWarning {
    color: red;
}

.dynamicPanelWarning item  > *:not(:last-child):after {
    content: " - ";
}

.dynamicPanelWarning item title{
    display: inline-block;
}
/* -end- homepage boxes */

/* word of the day box */
/*#homeleft .wotd-box {
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    min-width:300px;
}*/

.dayhead {
    position: relative;
}

.rss-icon {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 25px;
    height: 25px;
    background: url(../images/icon-rss.png) no-repeat scroll 0 top rgba(0,0,0,0);
    background-size:100%;
}

/* -end- word of the day box */

/* recent searches */
.recentsearches {
    width: 100%;
    border-collapse: collapse;
    margin-left: 0px;
    text-align: left !important;
    background-color: #ecf5ff;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
}

.recentsearches td,
.recentsearches th {
    font-weight: normal;
    vertical-align: middle;
}

.recentsearches td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
}

.recentsearches a {
    /*margin: 0 0 0 10px;*/
}

.recentsearches tr th {
    color: white;
    text-align: center;
    background-color: #4577BF;
    line-height: 2.3333333333333em;
    border-bottom: 1px solid white;
}

.recentsearches tr td {
    line-height: 2em;
    padding:0;
}

.recentsearches tr {
    border-bottom: 1px solid white;
}

.recentsearches tr:last-child {
    border: none;
}

.recentsearches tr td div {
    padding: 7px 14px;
    line-height:21px;
}

.recentsearches tr td a {
    color: #07255e;
}

.recentsearches tr td a .pos {
    color: #555555;
    font-weight: normal;
    margin-left: 0;
    font-size:0.9em;
}

.recentsearches a {
    margin: 0;
}

/* -end- recent searches */

/*------------------------------------*\
    Resources
\*------------------------------------*/

.resources .banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f3f5f6;
    padding-top: 30px;
    padding-bottom: 30px;
}

.resources .banner .responsive_container h1, .resources .banner .responsive_container p {
    max-width: 780px;
}

.resources .responsive_container .responsive_row .selector {
    margin-top:15px;
}

.resources .selector span {
    margin: 5px;
    color: #4776ae;
    border: 1px solid #4776ae;
    background-color:#ffffff;
    border-radius: 50px;
    padding: 0px 10px;
    -webkit-transition: all 0.1s ease-in-out 0.1s;
    -o-transition: all 0.1s ease-in-out 0.1s;
    transition: all 0.1s ease-in-out 0.1s;
    cursor: pointer;
    display: inline-block;
    line-height: 28px;
}

.resources .selector span:hover {
    color: #002048;
    border-color: #949494;
    background-color: #e6e5e5;
    border: 1px solid #949494;
    /*background-color: #DBEDFC;*/
}
.resources .selector .active {
    color: #000000;
    border: 1px solid #47A2EF;
    background-color: #DBEDFC;
}

.resources .selector .active:before {
    content: " ";
    padding: 0px 20px 0px 0px;
    margin: 0px 5px 0px 0px;
    background-image: url(../images/graphics/tick.svg);
    background-repeat: no-repeat;
    background-size: auto;
    background-position-y: center;

}

.resource h1 {
    font-size: 24px;
    font-weight: 600;
    color: #333333;
    border-bottom: 1px solid #999999;
    margin-bottom: 10px;
    line-height: initial;
}


/* end resources */

/*------------------------------------*\
    GENERAL TEXT
    (USED ON WORDLIST HOMEPAGE AND ABOUT PAGE)
\*------------------------------------*/

#generaltext {
    font-size: 15px;
    max-width: 750px;
}

#generaltext h2 {
    color: #282828;
    margin: 16px 0 6px;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
}

#generaltext p {
    margin-bottom: 7px;
}

#generaltext ul {
    padding-left: 0;
}

.h-g+#generaltext {
    margin-top: 0.5em;
}

#generaltext .generaltext-list {
    padding-left: 20px;
    list-style-type: disc;
    margin-bottom: 7px;
}

#generaltext .oxford3000-blue, #generaltext .academic-blue {
    margin-top: 0;
}

.generaltext-table tr {
    border-bottom: 1px solid rgba(0, 18, 60, 0.2);
}

#firsttext {
    max-width: 750px;
    margin-bottom: 7px;
}

.info-enlarge {
    display: block;
    margin-bottom: 12px;
}
.info-enlarge #ox-enlarge {
    float: none;
    display: table-cell;
    height: auto;
    width: 300px;
    clear: none;
}
.info-enlarge #ox-enlarge a {
    margin: 0;
}
.info-enlarge #ox-enlarge img {
    width: 100%;
}
.info-enlarge-desc {
    display: table-cell;
    vertical-align: top;
    padding: 12px 18px 0 0;
}

#licenceform input {
  display: block;
}

/*------------------------------------*\
    MODAL WINDOW
\*------------------------------------*/

body.modal-open {
    overflow: hidden;
}

/* all styles */
.group:after,.mdl-split:after,.mdl-access-wrap:after,.mdl-radio-label:after,.mdl-btn-wrap:after {
    content: "";
    display: table;
    clear: both;
}

/* wrapper */
.modal-window {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.25);
    z-index: 99999;
    opacity: 0;
    -webkit-transition: opacity 400ms ease-in;
    -o-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: none;
}
.modal-window:target {
    opacity: 1;
    pointer-events: auto;
}
.modal-window input[type='button'] {
    -webkit-appearance: none;
}
.mdl-window {
    background-color: #ffffff;
    width: 600px;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 5;
    color: #333333;
}
.mdl-window-inner {
    max-width: 800px;
}
.mdl-window .mdl-window-inner {
    padding: 0 36px 86px;
    position: relative;
}
.mdl-window-inner .modal-errors-info:first-child{
    margin: 18px 0 -8px 0;
}
.mdl-head {
    border-bottom: 1px solid #4f9d9e;
    margin: 0 36px;
}

/* titles */
.mdl-title {
    color: #0d3880;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: normal;
    font-size: 28px;
    text-align: left;
    margin: 7px 0 10px;
    padding: 0;
    height: auto;
    line-height: 34px;
}

/* focus */
.mdl-window-inner *:focus {
    outline: 1px dotted #000000;
    outline: -webkit-focus-ring-color auto 5px;
}

/* text style */
.mdl-window-inner .mdl-title {
    text-align: left;
    margin-bottom: -15px;
}
.mdl-sub-head {
    color: #0d3880;
    margin: 20px 0 0;
    font-size: 22px;
    font-weight: normal;
    font-family: 'Source Sans Pro', sans-serif;
}
.mdl-p {
    font-size: 1em;
    line-height: 1.3em;
    margin: 24px 0 8px 0;
    display: block;
}
.mdl-p strong {
    font-weight: bold;
}
.mdl-p-emphasis {
    width: 100%;
    background-color: #ecf5ff;
    padding: 16px;
    margin-top: 0;
}
.mdl-link {
    color: #004aac;
    font-weight:normal;
}
.mdl-link:hover {
    text-decoration: underline;
}
.mdl-tandc-link {
    text-decoration: underline;
    color: #333333;
    font-weight: normal;
}
.mdl-p-link {
    margin: 8px 0;
    font-style: italic;
    font-size: 0.9em;
}
.mdl-p-help {
    margin: 8px 0 0;
    display: block;
    line-height: 1.3em;
    font-size: 0.8em;
    font-style: italic;
}
.mdl-p-warning {
    margin: 20px 0 -12px ;
}
.modal-errors-info {
    font-size: 0.9em;
    margin: 8px 0 0 0;
    color: #c73b2a;
    line-height: 1.3em;
}

/* text inputs */
.mdl-window-inner input:not([type="radio"]) {
    border-radius: 0px;
}
.mdl-text-input {
    height: 50px;
    min-width: 100px;
    max-width: 400px;
    width: 100%;
    display: inline-block;
    padding: 0 8px;
    background-color: #ffffff;
    border: 1px solid #0d3880;
    font-size: 15px;
    font-family: 'Source Sans Pro', sans-serif;
}
.mdl-input-error {
    -webkit-box-shadow: 0 0 0 1px #c73b2a;
    box-shadow: 0 0 0 1px #c73b2a;
    -webkit-appearance: none;
}
input[disabled="disabled"] {
    cursor: not-allowed;
}
.mdl-input-success:after {
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    right: 0;
    content: url(../images/modal/mdl-tick.svg);
    padding: 12px 10px;
    z-index: 10;
}

/* text inputs with icons */
.mdl-text-icon-wrap {
    height: 50px;
    max-width: 400px;
    min-width: 100px;
}
.mdl-text-icon-wrap * {
    display: inline-block;
    float: left;
}
.mdl-text-icon-wrap .mdl-text-icon {
    width: 50px;
    height: 100%;
    margin-right: 0px;
    background-color: #0d3880;
    padding: 10px 10px 0 15px;
}
.mdl-text-icon-wrap .mdl-text-input-wrap {
    width: 100%;
    padding-left: 50px;
    margin-left: -50px;
    position: relative;
}

/* split content to fit two per line */
.mdl-sub-head+.mdl-split {
    margin-top: -12px;
}
.mdl-sub-head+.mdl-p {
    margin-top: 12px;
}
.mdl-split .mdl-half {
    width: 48%;
}
.mdl-split .mdl-half.mdl-half-left {
    float: left;
}
.mdl-split .mdl-half.mdl-half-right {
    float: right;
}
.mdl-split .modal-errors-info {
    margin-left: 0;
}

/* access code input field */
.mdl-access-wrap .mdl-access-input-wrap .mdl-text-input {
    float: left;
}
.mdl-access-wrap .mdl-btn {
    float: right;
    margin-top: 0 !important;
    height: 50px;
}
.mdl-access-wrap+.modal-errors-info {
    margin-left: 0;
}

/* dropdown lists */
.mdl-dropdown {
    width: 100%;
}

/* radiobuttons */
.mdl-radio-wrap {
    margin-top: 16px;
}
.mdl-sub-head+.mdl-radio-wrap {
    margin-top: 6px;
}
.mdl-radio-label {
    margin-top: 8px;
    margin-bottom: 8px;
    padding-right: 4px;
    margin: 0;
    cursor: pointer;
    display: block;
}
.mdl-radio-label:hover {
    background-color: #ecf5ff;
}
.mdl-radio-label .mdl-radio {
    display: inline-block;
    margin: 4px 7px;
    vertical-align: top;
    width: 12px;
    height: 13px;
    float: left;
}
.mdl-radio-label .mdl-radio-text {
    display: inline-block;
    margin: 0;
    float: left;
    width: 100%;
    padding-left: 40px;
    margin-left: -40px;
    line-height: 1.5em;
}
input[type="checkbox"],input[type="radio"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

/* block text */
.mdl-block {
    background-color: #ecf5ff;
    margin: 16px 0 0;
    padding: 16px;
    padding-top: 4px;
}
.mdl-block .mdl-sub-head {
    margin: 8px 0 0;
}
.mdl-block .mdl-block-p {
    margin: 12px 0;
    line-height: 22px;
}
.mdl-block .mdl-block-list {
    padding-left: 25px;
    list-style-type: disc;
}
.mdl-block .mdl-block-list li {
    margin: 8px 0;
}
.mdl-block .mdl-block-list li:last-of-type {
    margin-bottom: 0;
}
.mdl-block .mdl-btn-wrap {
    margin-top: 12px;
}
.mdl-block .mdl-btn-wrap .mdl-p {
    float: left;
}

/* collapsible text */
.mdl-list {
    padding-left: 25px;
    list-style-type: disc;
}
.mdl-list li {
    margin: 0;
}
.info {
    margin-bottom: -10px;
}

/* error message [top of modal] */
.mdl-block-error {
    border: 1px solid #c73b2a;
    margin: 16px 36px;
    padding: 6px 12px;
}
.mdl-block-error .mdl-block-error-p {
    margin: 12px;
    line-height: 1.4em;
}

/* buttons */
.mdl-btn {
    height: 44px !important;
    border-radius: 0 !important;
    line-height: 34px;
    padding: 0 16px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: bold;
    font-size: 1.1em;
    min-width: 150px;
    display: inline-block;
    color: #ffffff !important;
    background-color: #07255e;
    border: 2px solid transparent;
    text-align: center;
}
.mdl-btn:hover {
    background-color: #051c46;
    cursor: pointer;
}
.mdl-btn:active {
    background-color: #041638;
}
.mdl-btn.mdl-btn-main {
    background-color: #00123c;
    border-color: transparent;
    font-size: 1.1em;
}
.mdl-btn.mdl-btn-main:hover,.mdl-btn.mdl-btn-main:active {
    background-color: #004aac;
}
.mdl-btn:not(.mdl-btn-left):not(.mdl-btn-right) {
    margin-top: 24px;
}
.mdl-btn.mdl-tandc {
    border-color: #0d3880;
    color: #0d3880;
    background-color: #ffffff;
}
.mdl-btn-wrap {
    position: relative;
    margin-top: 24px;
}
.mdl-btn-wrap .mdl-btn-left {
    float: left;
}
.mdl-btn-wrap .mdl-btn-right {
    float: right;
}
.mdl-btn-wrap .mdl-p {
    float: right;
    height: 44px;
    line-height: 34px;
    padding: 6px 8px;
    margin: 0;
}
.mdl-btn-wrap.mdl-btn-wrap-link {
    text-align: right;
}
.mdl-btn-wrap.mdl-btn-wrap-link .mdl-btn-right,.mdl-btn-wrap.mdl-btn-wrap-link .mdl-p {
    float: left;
    display: inline-block;
}
.mdl-btn-link {
    color: #ffffff;
    width: 100%;
    height: 100%;
    display: block;
}
.mdl-btn-link:hover {
    text-decoration: none;
}

/* IDM modal errors */
.show-modal-errors-info {
    display: block;
}
.mdl-split .modal-errors-info {
    margin-left: 0;
}

/* table */
.mdl-table {
    margin-top: 12px;
    background-color: #ecf5ff;
    width: 100%;
    text-align: center;
    vertical-align: top;
}

.mdl-table tr {
    border-bottom: 2px solid #ffffff;
}

.mdl-table th {
    width: 30%;
    padding: 10px 7px;
    color: #07255e;
    font-size: 1.1em;
    font-weight: normal;
}

.mdl-table td {
    padding: 7px;
}

.mdl-table td .mdl-table-p {
    margin: 0;
}

.mdl-table .mdl-table-tick {
    width: 60px;
    vertical-align: middle;
    text-align: center;
}

.mdl-table .mdl-table-tick:after {
    position: absolute;
}

/* modernizr support */
.no-svg .mdl-text-input.mdl-input-success:after {
    content: url(../images/mdl-tick.png);
}

/* responsive design */
@media screen and (max-width: 762px) {
    .mdl-split .mdl-half {
        width: 100%;
        float: none;
    }
}


/*------------------------------------*\
    TABBED CONTENT
\*------------------------------------*/

.mdl-tabs {
    padding: 10px 10px 0;
    margin: 24px 0 5px;
    background-color: grey;
    border-radius: 10px 10px 0 0;
    overflow: hidden;
}

.mdl-tabs .mdl-tab {
    list-style-type: none;
    display: inline-block;
    border-radius: 7px 7px 0 0;
    background-color: silver;
    border-bottom: 0;
    padding: 7px 15px 5px;
    margin-right: 2px;
}

.mdl-tabs .mdl-tab:hover {
    background-color: white;
    color: #444444;
    background-color: #004aac;
    color: white;
}

.mdl-tabs .mdl-tab.is-active {
    background-color: #07255e;
    color: white;
    background-color: white;
    color: #444444;
    -webkit-box-shadow: 0 0 5px grey;
    box-shadow: 0 0 5px grey;
}

.mdl-tab-content {
    display: none;
    overflow-x: auto;
}

.mdl-tab-content.is-active {
    display: block;
}

.dictcodeTitle {
    margin: 5px;
    font-size: 1.1em;
    text-align: left;
    color: #494949;
    line-height: 2;
}

.nearest-results{
    font-size: 26px;
    margin-bottom: 14px;
}

/* Restricted for entry & pronunciation */
.restrictedHeader,
.restrictedLinks  {
    position: relative;
}
.restrictedTitle {
    max-width:100%;
    vertical-align:baseline;
    display:inline;
}

.restrictedTitle h1,
.restrictedImg {
    display:inline-block;
	    color: #0d3880;
}

.restrictedImg img {
    width:20px;
    border:0px solid transparent;
    margin-left: 10px;
}
.restrictedLock {
    font-size:0.9em;
    color:#848482;
    vertical-align:baseline;
    position: inherit;
}
.restrictedLogin {
    font-size: 0.75em;
    vertical-align: baseline;
    display: inline-block;
    position: inherit;
    bottom: inherit;
    right: inherit;
}

.restrictedLinks{
    margin: 20px 0;
    overflow: hidden;
}

.restrictedLinks table{
    width: 100%;
}

.restrictedLinks .bookCoverImage{
    width: 20%;
}

.result-list {
    list-style:initial;
    padding-left:25px;
}
.didyoumean {
    font-size:1.2em;
    line-height: 2;
    margin: 5px;
}

[class^="icon-"],
[class*=" icon-"]:not(.social-facebook):not(.social-twitter):not(.wl-add):not(.test-btn):not(.audio_play_button) {
    vertical-align: text-bottom;
    display: inline-block;
    font-family: 'oup-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon, .icon-plus, .icon-minus {
  content: "";
  position: absolute;
  width: 27px;
  height: 40px;
  background: url(../images/wordlist/icon-plus-minus.png) center 0 no-repeat;
  background-size: 13px auto;
  margin: 0;
  left: 0px;
  cursor: pointer;
}

.data-fold .icon, .icon-plus {
      background-position: center -50px;
}

.expandable ul {
    display: none;
    padding-left: 21px;
}
.expandable div,
.expandable ul li {
  position: relative;
}

.expandable div {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
}

.expandable a {
    padding: 7px 0 7px 25px;
    border-left: 4px solid transparent;
    display: inline-block;
}

.expandable a.selected{
    font-weight: bold;
    background-color: #E5E8E8;
}

.relatedBlock a {
    color: #494949;
    line-height: 22px;
    width: auto;
    background-position: left center;
}

a[data-type-class="normalDisplay"] {
    color: white;
}

a[data-type-class="lastweekDisplay"] {
    /*color: #E6F507;*/
    color: white;
}

a[data-type-class="expiredInfOneWeekDisplay"] {
    /*color: #FB0000;*/
    color: white;
}
.statusBox{
    float:right;
}
.statusBox img{
    margin-left:10px;
}


/*eltsurvey*/

.eltsurvey .link-right:after {
    background: url(../images/home/action_button.png) no-repeat center center;
    width: 22px;
    height: 22px;
    vertical-align: top;
}

.eltsurvey .link-right:hover:after {
    background: url(../images/home/action_button_hover.png) no-repeat center center;
    width: 22px;
    height: 22px;
    vertical-align: top;
}

.eltsurvey ul.disc li {
    list-style: none;
}

.eltsurvey li::before {list-style: none;}

.eltsurvey li::before {content: "•"; color: #b5cd57;
  display: inline-block; width: 1em;
  margin-left: -1em;}


/*cards*/

.cards_container {
  	width: 100%;
	padding: 0;
  	margin: 25px 0px 25px 0px;
  	list-style: none;
    display:-webkit-box;
    display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
  	justify-content: start;
}

.card {
      -webkit-box-shadow: 0 0px 0px 0 rgba(0,0,0,0.2);
  	box-shadow: 0 0px 0px 0 rgba(0,0,0,0.2);
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
  	transition: 0.3s;
  	width: 100%;
  	margin: 0px 0px 20px 0px;
	border: 1px solid #9b9b9b;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	border-radius:5px;
}

.card img {
	display:block;
	height:172px;
	width:100%;
	background-color: antiquewhite;
	border-bottom: 1px solid #333333;
	border-radius: 5px 5px 0px 0px;
}

.card:hover {
      -webkit-box-shadow: 0 0px 16px 0 rgba(0,0,0,0.2);
  	box-shadow: 0 0px 16px 0 rgba(0,0,0,0.2);
}

.card_contents {
  	padding: 15px;
	width:70%;
}

.card_contents h2 {
	font-size: 21px;
    line-height: 30px;
    margin: 0 0 10px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: normal;
    color: #0d3880;
}

.card_contents h2 a {
    font-size: 21px;
    line-height: 30px;
    margin: 0 0 10px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: normal;
    color: #0d3880;
}

.card_contents h2 a:hover {
    font-size: 21px;
    line-height: 30px;
    margin: 0 0 10px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: normal;
    color: #0d3880;
    text-decoration: none;
}

.card_contents p {
    line-height: 21px;
    margin-bottom: 7px;

}

.card_buttons {
	padding: 15px;
	margin-top: auto;
    display:-webkit-box;
    display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:horizontal;
	-webkit-box-direction:normal;
    -ms-flex-direction:row;
    flex-direction:row;
      -webkit-box-align:stretch;
          -ms-flex-align:stretch;
  	align-items:stretch;
	width:30%;
}

/*GEL styles*/

.link_gel {
  	width:100%;
	height:40px;
	cursor: pointer;
	padding:0px;
	display:block;
	text-align: center;
    color: #4577bf;
	font-weight:bold;
	font-size:16px;
	line-height: 40px;
}

.link_gel_primary {
	border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    width: 100%;
    background-color: #4776ae;
   	border-top: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 3px solid #002147;
    margin: 0px;
    color: #ffffff;
    white-space: nowrap;
}

.link_gel_secondary {
    border:1px solid #b3b3b3;
    border-bottom: 3px solid #b3b3b3;
    background-color:#ffffff;
    border-radius:4px;
    font-weight:normal;
    color:#333333;
}

.link_gel_primary:hover {
    background-color: #002147;
    border-top: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 3px solid #002147;
    text-decoration: none;
}

.link_gel_secondary:hover {
    border: 1px solid #949494;
    border-bottom: 3px solid #b3b3b3;
    background-color: #e6e5e5;
    color:#333333;
    text-decoration: none;
}

.card_buttons a:nth-child(2) {
    margin-left:5px;
}


/*wordlist about */

.wordlist_h2 {
    font-size: 21px;
    font-weight: normal;
    line-height: 25px;
    padding: 7px 0;
    margin: 0px 0px 7px 0px;
    color: #282828;
}

.wordlist_h2:last-of-type {
    margin-top:14px;

}


/*about pages*/

.wordlist_about_responsive {
    margin-right: -264px;
}

.wordlist_about_callout_container {
    margin-bottom:20px;
}

.wordlist_about_callout_image {
display: inline-block;
    width: 15%;
    height: 250px;
    background-size: cover;
    background-repeat: no-repeat;
    float: left;
}

.wordlist_about_callout_image_ox3000 {
    background-image: url("../images/wordlist/Ox3000_logo_about_large.svg");
}

.wordlist_about_callout_image_ox5000 {
    background-image: url("../images/wordlist/Ox5000_logo_about_large.svg");
}

.wordlist_about_callout_image_opal {
    background-image: url("../images/wordlist/opal_logo_about_large.svg");
}

.wordlist_about_callout_image_oxphrase {
    background-image: url("../images/wordlist/oxphrase_logo_about_large.svg");
}

.wordlist_about_callout_text {
    display: inline-block;
    width: 65%;
    padding: 15px 20px;
    background-color: #f0f8ff;
    height:250px;
}

.wordlist_about_callout_oxphrase {
    height:250px;
}

.wordlist_about_callout_text .wordlist_h2 {
    margin-top:0px;
}


/*home banner*/

.home_banner_container_outer {
	margin: 5px auto 15px;
    padding: 10px 0px;
}

.home_banner_container_inner {
	background-color:#ffedd5;
    padding: 30px 40px;
    background-repeat: no-repeat;
    background-position: right;
	border-radius: 10px;
    -webkit-box-shadow: 0 1px 5px grey;
	box-shadow: 0 1px 5px grey;
	background-size:contain;
	/*max-width:900px;*/
	width:100%;
}

.boat_image {
	background-color: #bf0062;
}

.home_banner_left {
	width:50%;
}

.home_banner_left p {
	font-size:16px;
}

.home_banner_left p:last-of-type {
	margin-bottom: 20px;
}

.home_banner_left a {
    max-width: 300px;
    margin-bottom: 10px;
    font-weight: bold;
}

.banner_h2 {
    font-size: 36px;
    margin: 0 0 16px;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600;
    color: white;
    margin-bottom: 60px;
}

.link_banner {
    max-width: 250px;
    border-radius: 50px;
    border: 1px solid white;
    background-color: transparent;
    font-weight: normal;
    font-size: 18px;
    cursor: pointer;
    display: inline-block;
    width: 100%;
    margin: 0px;
    color: #ffffff;
    white-space: nowrap;
    height: 40px;
    padding: 0px;
    text-align: center;
    line-height: 40px;
}

.link_banner:hover {
    background-color:white;
    color: #bf0062;
    text-decoration:none;
}

.banner_mobile_image {
    display:none;
}


li.sn-g {
    padding-left:40px;
}

/*homepage dictionnary promotional banner*/

.dictionary_banner {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: #f8f5f1;
    padding: 25px;
    margin-bottom:20px;
}
.dictionary_banner div{
    /*text-align: center;*/
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 5px;
    font-size: 18px;
    line-height: 1.2em;
    font-weight: 400;
    margin-bottom:0px;
}

.dictionary_banner div.title{
    text-align: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 5px;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
    margin-bottom:10px;
}

.dictionary_banner .dictionaries{
    margin-top:0px;
    margin-bottom:0px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
        -ms-flex-direction:row;
            flex-direction:row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.dictionary_banner .dictionaries > div{
    width:180px;
    height:auto;
    /*background-color:white;*/
    text-align: center;
	margin-bottom:20px;

}
.dictionary_banner .dictionaries .img{
    margin: 0;
    width:120px;
    height:120px;
    position:relative;
    /*top:-10px;*/
    left: 26px;
	margin-bottom:20px;
}
.dictionary_banner .dictionnary_title{
    display: inline;
    font-size: 16px;
    /*padding: 0px 10px;*/
    margin: 0px;
	font-weight: 600;
}

.statements{
    text-align: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-top:30px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
        -ms-flex-direction:row;
            flex-direction:row;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.statements > div{
    max-width: 345px;
    text-align: center;
}

.author{
    color:rgba(0, 0, 0, 0.5)
}

.upgrade-title{
    text-align:center;
}

.redeemBox{
    text-align: center;
}

/*end homepage dictionnaries promotional banner*/

/* topic home page */
.topic_banner {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color:#d6f6f4;
    padding-top: 30px;
    padding-bottom: 30px;
}

.topic_banner .responsive_container h1, .topic_banner .responsive_container p {
    max-width: 780px;
}

.topic_list{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: -10px;
    margin-right: -10px;
    width: initial;
}

.topic_list.responsive_container::before {
    display: none;
}

.topic_list.responsive_container::after {
    display:none;

}

.topic-box {
     width: 175px;
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
            box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin-left: 10px;
    margin-right: 10px;
}
.topic-box:hover {
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
            box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
    border: 1px solid #999999;
}

.topic-box .img{
    width:100%;
    background-image: url("../images/placeholder_image.png");
    background:grey;
}


img.topic_img {
    width: 100%;
    border-radius: 4px 4px 0px 0px;
}


.topic-box .topic-label{
    margin: 10px 15px 15px 15px;
}

.topic-box a{
   font-size: 18px;
    font-weight: 600;
}

/* end topic home page */

/* start topic catergory pages */

.topic_header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

a.topic_back {
    margin-top: 20px;
    margin-bottom: 20px;
    color: #4776ae;
    border: 1px solid #4776ae;
    padding: 0px 10px;
    border-radius: 50px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 16px;
    text-decoration: none;
    background-color: #ffffff;
    line-height: 28px;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
}

a.topic_back:hover {
    color: #002048;
    border-color: #949494;
    background-color: #e6e5e5;
    border: 1px solid #949494;
}

a.topic_back:before {
    content: "";
    background-repeat: no-repeat;
    background-image: url(../images/graphics/arrow_blue.svg);
    background-size: contain;
    background-position-y: center;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    padding: 0px 3px 0px 4px;
    margin-right: 5px;
}

a.topic_back:hover:before {
    content: "";
    background-repeat: no-repeat;
    background-image: url(../images/graphics/arrow.svg);
    background-size: contain;
    background-position-y: center;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    padding: 0px 3px 0px 4px;
    margin-right: 5px;
}

h1.topic_label {
    font-size: 24px;
    font-weight: 600;
    color: #333333;
    border-bottom: 1px solid #999999;
    margin-bottom: 0px;
    line-height: initial;
}



.topic-box.topic-box-secondary {
    padding: 20px;
    padding-bottom: 40px;
    width: 370px;
    min-height: 250px;
    margin-left: 10px;
    margin-right: 10px;
}

.topic-box.topic-box-secondary:hover {
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
            box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
    border: 1px solid #999999;
}

a.topic-box-secondary-heading span {
    font-size: 14px;
    font-weight: 400;
    color: #666666;
    padding-left: 5px;
    -webkit-text-decoration-color: #666666;
            text-decoration-color: #666666;
}


.topic-box.topic-box-secondary .l3 {
    padding-top: 15px;
}

.topic-box.topic-box-secondary .l3 a{
    font-size: 16px;
    font-weight: 400;
    padding-right: 15px;
    line-height: 35px;
    display: inline-block;
    background-color: #ffdff566;
    border-radius: 50px;
    padding: 0px 10px;
    margin-bottom: 10px;
    margin-right: 5px;
}

.topic-box.topic-box-secondary .l3 a:hover {
    background-color: rgba(255, 223, 245, 0.8);
}

.topic-box.topic-box-secondary .l3 a:last-child{
    margin-right: 0px;
}

/* end topic catergory pages */





/*responsive layouts 2020 */

.functionality_box {
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding-bottom: 0px;
    width: 370px;
    min-height: 250px;
    margin-left: 10px;
    margin-right: 10px;
}

@media screen and (min-width: 10px) and (max-width: 479px) {
    .responsive_container {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }


    .topic-box {
        width: 46%;
        margin-left: 2%;
        margin-right: 2%;
    }
    .topic-box .topic-label {
        margin: 5px 10px 10px 10px;
    }

    .topic-box a {
        font-size:16px;
    }

    .topic-box.topic-box-secondary {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
    }

    .functionality_box {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
    }

    a.topic-box-secondary-heading {
        font-size:18px;
    }

}


@media screen and (min-width: 480px) and (max-width: 599px) {
    .responsive_container {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }

    .topic-box {
        width: 29.3333333%;
        margin-left: 2%;
        margin-right: 2%;
    }

    .topic-box .topic-label {
        margin: 5px 10px 10px 10px;
    }

    .topic-box a {
        font-size:16px;
    }

    .topic-box.topic-box-secondary {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
    }
    a.topic-box-secondary-heading {
        font-size:18px;
    }
}

        .functionality_box {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
}

}


@media screen and (min-width: 600px) and (max-width: 767px) {

    .responsive_container {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }

    .topic-box {
        width: 29.3333333%;
        margin-left: 2%;
        margin-right: 2%;
    }

    .topic-box.topic-box-secondary {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
    }

    .functionality_box {
        width: 100%;
        min-height: auto;
        padding-bottom: 20px;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
     .responsive_container {
        width: 750px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .topic-box {
     width: 167px;
    }

    .topic-box.topic-box-secondary {
        width: 355px;
    }

    .functionality_box {
        width: 355px;
    }

}


@media screen and (min-width: 992px) and (max-width: 1199px) {
    .responsive_container {
        width: 970px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .topic-box {
        width: 174px;
    }

    .functionality_box {
        width: 465px;
    }

    .topic-box.topic-box-secondary {
        width: 465px;
    }

}


@media screen and (min-width: 1200px) {
    .responsive_container {
        width: 1170px;
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media screen and (min-width: 1310px) {
    .responsive_container.xamerican_english,
    .responsive_container.xenglish,
    .responsive_container.xreference {
        width: 1310px;
    }

    .responsive_container.xonecolumn {
        width: 1000px;
    }
}

/*wordlist responsive layouts*/

@media screen and (min-width: 1220px) {

	.card_buttons{
		-webkit-box-orient:vertical;
		-webkit-box-direction:reverse;
    	-ms-flex-direction:column-reverse;
        flex-direction:column-reverse;
	}

	.card_buttons a:nth-child(2){
		margin-bottom:10px;
		margin-left: 0px;
	}

	.boat_image {
		background-image: url("../images/wordlist/bigger_boat.svg");
	}

}

@media screen and (max-width: 1220px) {


	.boat_image {
		background-image: url("../images/wordlist/boat_edit.svg");
	}

	.wordlist_about_responsive {
		margin-right: -180px;
	}

	.wordlist_about_callout_image {
    	width: 20%;
	}

	.wordlist_about_callout_oxphrase {
		height:300px;
	}

	.wordlist_about_callout_image_oxphrase {
		width:25%;
	}

}

@media screen and (min-width: 929px) and (max-width: 1219px) {

	.card_buttons{
		-webkit-box-orient:vertical;
		-webkit-box-direction:reverse;
    	-ms-flex-direction:column-reverse;
        flex-direction:column-reverse;
	}

	.card_buttons a:nth-child(2){
		margin-bottom:10px;
		margin-left: 0px;
	}


}

@media screen and (min-width: 929px) {
    .box-primary {
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-orient:horizontal;
        -webkit-box-direction:reverse;
        -ms-flex-direction:row-reverse;
        flex-direction:row-reverse;
    }
     .box-primary img{
        max-width: 50%;
    }
    .box-secondary {
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
            -ms-flex-direction:column;
                flex-direction:column;
    }
}

/* Layout resolution = tablet */
@media screen and (min-width: 762px) and (max-width: 928px) {

    .card {
        display:block;
    }

    .card_contents {
        width:100%;
    }

    .card_buttons {
        width:100%;
    }

    .wordlist_about_responsive {
        margin-right: -180px;
    }

    .wordlist_about_callout_image {
        width: 30%;
        height:300px;
    }

    .wordlist_about_callout_text {
        width: 70%;
        height: 300px;
    }

    .wordlist_about_callout_oxphrase {
        height:400px;
        width:60%;
    }

    .wordlist_about_callout_image_oxphrase {
        width:40%;
    }


}


/* Layout resolution = intermediate smartphone-tablet resolution */
@media screen and (max-width: 761px) {

    .card {
        display:block;
    }

    .card_contents {
        width:100%;
    }

    .card_buttons {
        width:100%;
    }

    .home_banner_container_inner {
        max-height: 200px;
    }

    .home_banner_left {
        width:50%;
    }

    .home_banner_left a{
        font-size:16px;
        background-color:#bf0062;
        max-width:unset;
    }

    .banner_h2 {
        margin-bottom: 40px;
        font-size: 24px;
        line-height: 34px;
    }

    .wordlist_about_responsive {
        margin-right: 0px;
    }

    .wordlist_about_callout_image {
        display:none;
    }

    .wordlist_about_callout_text {
        width:100%;
        height:unset;
    }
}
@media screen and (max-width: 550px) {

    .card {
        display:block;
    }

    .card_contents {
        width:100%;
    }

    .card_buttons {
        width:100%;
    }

    .home_banner_left {
        width:100%;
    }

    .home_banner_container_inner {
        max-height:unset;
    }

    .boat_image {
        background-image: none;
        background-color:#4A95AF;
    }

    .banner_mobile_image {
        display: block;
        height: 180px;
        margin-bottom: 20px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url(../images/wordlist/boat_edit.svg);
        background-position: center;
    }

    .banner_h2 {
        margin-bottom: 20px;
    }

    .link_banner{
        max-width:unset;
    }

}

@media screen and (min-width: 261px) and (max-width: 761px) {

    .card {
        display:block;
    }

    .card_contents {
        width:100%;
    }

	.card_buttons {
		width:100%;
	}
}

/* Layout resolution = smartphone */
@media screen and (max-width: 360px) {

    .card {
        display:block;
    }

    .card_contents {
        width:100%;
    }

    .card_buttons {
        width:100%;
    }

	#h-title {
        margin-left: 10px;
    }

}

/*really small screen resolution*/
@media screen and (min-width: 10px) and (max-width: 360px) {

	.card {
		display:block;
	}

	.card_contents {
		width:100%;
	}

	.card_buttons {
		width:100%;
	}

}

/* Functionality Boxes for Product and Resources pages */

.functionality_container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    margin-bottom: 18px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-line-pack: start;
        align-content: flex-start;
    margin-left: -10px;
    margin-right: -10px;
    width: initial;
}

.functionality_ad {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 355px;
    margin: 10px 0px 20px 0px;
}

/*.functionality_box {
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding-bottom: 40px;
    width: 370px;
    min-height: 250px;
    margin-left: 10px;
    margin-right: 10px;
}*/

.functionality_box:hover {
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
    border: 1px solid #999999;
}

@media screen and (max-width:928px) {
    .functionality_box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        position: relative;
        margin-right: 0.5em;
        margin-left: 0.5em;
        margin-bottom: 1.1em;
        background-color: #ffffff;
        -ms-flex-negative: 0;
            flex-shrink: 0;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
        -ms-flex-preferred-size: 100%;
            flex-basis: 100%;
    }
    .functionality_ad {
        width: 100%;
    }
}

.functionality_box .text,
.app_ad div,
.product_paid div {
    padding: 15px;
}

.functionality_box h2 {
    color: #333333;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5rem;
    margin-bottom: 10px;
}

.functionality_box p {
    margin-bottom: 20px;
    color: #333333;
}

.functionality_box .type {
    border-radius: 0 25px 25px 0;
    background-color: #e5e5e5;
    margin-top: 10px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding: 3px 15px;
    font-size: 14px;
    font-weight: 600;
}

.functionality_box .type span::before{
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    float: left;
    margin: 2px 6px 0 0;
}

.functionality_box .tool span::before{
    background: url('../images/pictogram/tag_tool.svg') no-repeat;
}

.functionality_box .video span::before{
    background: url('../images/pictogram/tag_video.svg') no-repeat;
}

.functionality_box .worksheet span::before{
    background: url('../images/pictogram/tag_worksheet.svg') no-repeat;
}

.functionality_box .teacher_resource span::before{
    background: url('../images/pictogram/tag_teacher_resource.svg') no-repeat;
}

.functionality_box .reference span::before{
    background: url('../images/pictogram/tag_reference.svg') no-repeat;
}

.functionality_box .guide span::before{
    background: url('../images/pictogram/tag_guide.svg') no-repeat;
}

.functionality_box .type img {
    margin-top: 5px;
}

.functionality_box a {
    display: block;
    padding-bottom: 10px;
    line-height: 1.2rem;
}

.featured_links a {
    color: #ffffff;
    background-color: #198deb;
    width: 100%;
    display:inline-block;
    text-align: center;
    border-radius: 5px;
    padding: 8px;
    text-decoration: none;
    font-weight: 600;
    -webkit-transition: background-color 100ms ease-in-out;
    -o-transition: background-color 100ms ease-in-out;
    transition: background-color 100ms ease-in-out;
}

.featured_links a:hover {
    background-color: #1171c0;
}

/* End Functionality Boxes  */

.app_ad img,
.product img {
    border-radius: 0 25px 25px 0;
}

.app_ad_container {
    padding: 0px;
    max-width: 1170px;
    padding-left: 10px;
    padding-right: 10px;
    margin: auto;
}

.app_ad {
    /*display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;*/
    width: 100%;
    border-radius: 25px;
    background-color: #78c9a3;
    border: none;
    display: block !important;
}

.app_ad p, .app_ad p i, .app_ad div, .app_ad div i {
    color: #ffffff;
    font-size: 26px;
    line-height: 1.2em;
    font-weight: 600;
}

.android-app img {
    border-radius: 0px;
    height:80px;
}

.apple-app img {
    border-radius: 0px;
    height:80px;
    padding:13px;
}

.homepage .android-app img {
    border-radius: 0px;
    height: 50px;
    width: initial;
}

.homepage .apple-app img {
    border-radius: 0px;
    height: 52px;
    padding: 10px 0px 8px 0px;
    width: initial;
}

/*.app_ad {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
    border-radius: 25px;
    background-color: #25bb84;
    border: none;
}*/

@media screen and (min-width:928px) {
    .app_ad img,
    .product img {
        /*border-radius: 0 25px 25px 0;*/
    }

    .app_ad_container {
        /*padding: 0px;
        max-width: 1170px;
        padding-left: 10px;
        padding-right: 10px;
        margin: auto;*/
    }

    .app_ad {
        /*display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        border-radius: 25px;
        background-color: #ffffff;
        border: solid 1px;*/
    }

    .product {
        /*height: 520px;
        border: solid 1px;
        border-radius: 25px;
        text-align: center;
        background-color: #f8f8f8;*/
        padding-top: 60px;
        padding-bottom: 60px;
        padding-right:10px;
        margin-bottom: 0px;
    }

    .product h1 {
        font-size: 2rem;
    }

    .product p {
        font-size: 1.1rem;
        color: #333333;
    }

    .product span {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .product img {
        /*width: 200px;*/
        height: 300px;
        border-radius: 0px 0px 0px 0px;
    }
}


@media screen and (max-width: 927px){
    .product img {
        /* width: 200px; */
        max-height: 300px;
        border-radius: 0px 0px 0px 0px;
        display: block;
        margin: auto;
        margin-bottom: 20px;
        margin-top: 20px;
    }
}


.major_usp {
    /*height: 450px;*/
    padding-top: 60px;
    padding-bottom: 60px;
}

.major_usp img {
    /*min-width: 50%;
    width: 100%;*/
    width:50%;
	max-width:50%;
	max-height:50%;
	flex-basis:50%;

}

.major_usp .major_usp_left_img {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
}

.upgrade_section {
    background-color: #ffffff;
    padding: 15px !important;
    height: 400px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.upgrade_section h1 {
    margin-bottom:40px;
}

.vrtcl_cntrd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding-right: 80px;
    padding-left: 80px;
}

.sample a {
    margin-right: 15px;
    line-height: 35px;
    color: #47a2ef;
}

.product_paid {
    background-color: #ffffff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.white_background {
    background-color: #ffffff;
}

.mtb-7 {
    margin: 7px 0;
}

/* wotd panel*/

#homeleft .wotd-box {
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    /*min-width:278px;*/
    margin-left: 1%;
    margin-right: 1%;
    max-width: none;
}

@media screen and (min-width: 500px) and (max-width: 991px){
#homeleft .wotd-box {
    width: 48% !important;
    margin-left:1%;
}
}

@media screen and (max-width: 500px){
#homeleft .wotd-box {
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom:20px;
    width: 100%;
}
}

.wotd-box {
    padding: 15px 15px;
    text-align: center;
    border-radius: 15px;
    max-width:400px;
}

.wotd-box #date {
    font-size: 20px;
    color: #333333;
    font-family: 'Source Sans Pro', sans-serif;
    margin-bottom: 30px;
}

.wotd-box a.headword {
    text-decoration: none;
}

.wotd-box a.headword div {
    font-size: 28px;
    font-weight:600;
    line-height: 48px;
    vertical-align: middle;
    color: #1A3561;
    font-family: 'Source Sans Pro', sans-serif;
	margin-left: -15px;
    margin-right: -15px;
}

#rightcolumn .wotd-box a.headword div {
    font-size: 24px;
}

.wotd-box .pos {
    font-size: 20px;
    font-weight:400;
    font-style: italic;
    line-height: 20px;
    vertical-align: middle;
    color: #333333;
    font-family: 'Source Sans Pro', sans-serif;
    margin-bottom: 30px;
}

.wotd-box .prons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 30px;
}

.wotd-box .prons #uk_pron, .wotd-box .prons #us_pron {
    width: 40px;
    height: 40px;
    margin-left: 15px;
    margin-right: 15px;
    background-repeat: no-repeat;
    background-position: left top !important;
    background-size: 100%;
    -webkit-transition: background-image 0.1s ease-in-out 0.1s;
    -o-transition: background-image 0.1s ease-in-out 0.1s;
    transition: background-image 0.1s ease-in-out 0.1s;
}

.wotd-box .prons #uk_pron {
    background-image: url(../images/documents/audio_bre_initial.svg);
}

.wotd-box .prons #us_pron {
    background-image: url(../images/documents/audio_name_initial.svg);
}

.wotd-box .prons #uk_pron:hover {
    background-image: url(../images/documents/audio_bre_playing.svg);
}

.wotd-box .prons #us_pron:hover {
    background-image: url(../images/documents/audio_name_playing.svg);
}

.wotd-box .from {
    font-size: 16px;
    font-weight:400;
    line-height: 20px;
    vertical-align: middle;
    color: #333333;
    font-family: 'Source Sans Pro', sans-serif;
    margin-bottom: 5px;
}

.wotd-box .origin {
    text-decoration: none;
}

.wotd-box .origin div {
    color: #ffffff;
    font-weight: 600;
    border-radius: 25px;
    display: block;
    font-family: 'Source Sans Pro', sans-serif;
    text-transform: uppercase;
    line-height: 35px;
    margin-bottom: 10px;
    -webkit-transition: background-color 0.1s ease-in-out;
    -o-transition: background-color 0.1s ease-in-out;
    transition: background-color 0.1s ease-in-out;
}

.wotd-box .cefr {
    background-color: #666666;
    color: #FFFFFF;
    border-radius: 5px;
    padding: 0px 5px 0px 5px;
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    margin-bottom:20px;
}

.wotd-box .bottom-text {
    font-size: 10px;
    font-weight:400;
    font-style: italic;
    line-height: 13px;
    vertical-align: middle;
    color: #333333;
    font-family: 'Source Sans Pro', sans-serif;
}

.wotd-box .from .type {
    text-transform: lowercase;
}
.wotd-box.ox_3000 {
    background-color: #d9e9f4;
}

.wotd-box.ox_3000 .origin div {
    background-color: #0069b4;
}

.wotd-box.ox_3000 .origin div:hover {
    background-color: #004a80;
}

.wotd-box.ox_5000 {
    background-color: #fee8c8;
}

.wotd-box.ox_5000 .origin div {
    background-color: #ff612b;
}

.wotd-box.ox_5000 .origin div:hover {
    background-color: #d63600;
}

.wotd-box.opal_written {
    background-color: #ddf7e0;
}

.wotd-box.opal_written .origin div {
    background-color: #37a590;
}

.wotd-box.opal_written .origin div:hover {
    background-color: #2a7e6f;
}

.wotd-box.opal_spoken {
    background-color: #f1e4f1;
}

.wotd-box.opal_spoken .origin div {
    background-color: #7c377b;
}

.wotd-box.opal_spoken .origin div:hover {
    background-color: #592758;
}

.wotd-box.topic {
    background-color: #d6f6f4;
    font-weight: initial;
    text-decoration: unset;
    color: unset;
    cursor: unset;
    display: block;
    margin-bottom: unset;
}

.wotd-box.topic:hover {
    text-decoration: unset;
}

.wotd-box.topic .origin div {
    background-color: #27a1b0;
}

.wotd-box.topic .origin div:hover {
    background-color: #1c727d;
}

.wotd-box .pron-us:hover  {
    background-image: url(../images/documents/icon-audio-name.png);
    background-repeat: no-repeat;
    background-position: left bottom !important;
    cursor: pointer;
}

.wotd-box .pron-uk:hover {
    background-image: url(../images/documents/icon-audio-bre.png);
    background-repeat: no-repeat;
    background-position: left bottom !important;
    cursor: pointer;
}

/* grammar home page */

.peu-grammar-home .box {
    display: table-cell;
    padding: 1.2em;
    -webkit-box-shadow: 0 1px 5px grey;
            box-shadow: 0 1px 5px grey;
    margin-right: 1.2em;
    width: 296px;
    background: url(../images/home/old-ball.png) no-repeat 15px 15px white;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

.peu-grammar-home .box h2 {
    font-size: 21px;
    line-height: 30px;
    padding-left: 42px;
    margin: 0 0 16px;
    font-family: 'Merriweather', Georgia, sans-serif;
    font-weight: normal;
    color: #0d3880;
}

.peu-grammar-home .box .box-image {
    position: absolute;
    right: 0;
    bottom: 0;
}

.peu-grammar-home .box img {
    width: auto;
}

.grammar-row {
    display: table;
    width: 100%;
    margin-bottom: 18px;
}

#homeleft .box-primary.grammar-box {
    width:48%;
}


@media screen and (max-width: 500px) {
	#homeleft div.box.box-primary.grammar-box  {
    	margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 20px;
		width: 100%;
	}
}

.peu-grammar-home .box {
    background:url(../images/home/gu-ball.jpg) no-repeat 15px 15px white
}

@media screen and (max-width:928px) {
    .peu-grammar-home .box {
        width: 100%;
        display: block;
        margin-bottom: 6px;
    }
}

/* end of grammar home page */

.product_top_background {
    background-color: #c0e3f599;
}

.product_top_copy {
    padding-left: 10px;
    padding-right: 40px;
}

@media screen and (max-width: 927px){
    .product_top_copy {
        padding-left: 10px;
        padding-right: 10px;
        max-width: 728px;
        margin: auto;
        margin-top:10px;
    }
    .product_top_copy span {
        margin-top: 20px;
        margin-bottom: 20px;
        text-align: center;
    }

    .major_usp .vrtcl_cntrd {
    padding-right: 30px;
    padding-left: 30px;
}

    .major_usp img {
    width: 50%;
    display: block;
    margin: auto;
    margin-bottom: 50px;
        margin-top:30px;
}

}

.product_top_svg_clip {
    height: auto;
    bottom: -10px;
    position: relative;
    width: 100%;
}

@media screen and (max-width: 927px){
.product_top_svg_clip {
    margin-left:-10px;
}
}

.product-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 10px;
    margin-bottom: 30px;
    margin-left: -10px;
    margin-right: -10px;
    width: initial;
}

.product-item-box {
    background: white;
    margin: 10px 0px 20px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
            box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    padding: 20px;
    padding-bottom: 40px;
    width: 29%;
    min-height: 250px;
    margin-left: 2%;
    margin-right: 2%;
}

@media screen and (max-width: 650px){
    .product-item-box {
        margin-left: 10px;
        margin-right: 10px;
        width: 100%;
    }
}

.product-item-box:hover {
    -webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
            box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);
    border: 1px solid #999999;
}

.product-image {

}

.product-items .box-content h2 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3em;
    padding-bottom: 15px;
    padding-top: 15px;
}

/*migrated mywordlist styles from oxford.css start*/

.wl-nav{border-color:silver;border:0}
.wl-nav a,.wl-nav span{display:inline-block;padding:10px 15px;border-right:1px solid silver;color:#444444;font-weight:normal}
.wl-nav li:hover{-webkit-box-shadow:0 -50px 50px -30px white inset;box-shadow:0 -50px 50px -30px white inset;background-color:#cccccc}
.wl-nav li:hover a{text-decoration:none}
.wl-nav li.activepage{background-color:white}
.wl-nav li.activepage:hover{background-color:white !important;-webkit-box-shadow:none;box-shadow:none}
.currentpage a{color:#890017}
.currentpage a .pos{font-weight:normal}
.paging_links{padding:0}
.paging_links li:last-child a{border-right:0}
.paging_links .page_range{font-family:Verdana;font-weight:bolder;margin-right:30px;display:inline-block}
.paging_links .page_info{display:inline-block;margin-right:30px}
#entrylist1 a{font-weight:bold}
.result-list1{padding:4px 0;list-style-type:none}
.wordlist-oxford3000 li{padding:7px}
.soundList{display:inline}
.lang-study-page .pron-g{white-space:normal}
.lang-col{width:48%;float:left;padding-right:12px}
.mid-grad-bottom,.wl-table tr:first-child{background:#00123c;background:-o-linear-gradient(top, #07255e 0%, #00123c 100%);background:-webkit-gradient(linear, left top, left bottom, from(#07255e), to(#00123c));background:linear-gradient(to bottom, #07255e 0%, #00123c 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='$blue2', endColorstr='$blue1', GradientType=0)}
.pale-grad,.wl-table tr{background:#ffffff;background:-o-linear-gradient(top, white 0%, #eee 100%);background:-webkit-gradient(linear, left top, left bottom, from(white), to(#eee));background:linear-gradient(to bottom, white 0%, #eee 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0)}
.wl-table .delete-btn a:before{background:url("../images/myWordlist/btn-trash.png") no-repeat scroll -1px top/100% auto transparent;pointer-events:all}
.wl-table .btn.delete-btn:hover a:before{background-position:-1px bottom}
.wl-sub-head{background:#4577bf;background:-o-linear-gradient(top, #4577bf 0%, #345c95 100%);background:-webkit-gradient(linear, left top, left bottom, from(#4577bf), to(#345c95));background:linear-gradient(to bottom, #4577bf 0%, #345c95 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#4577bf', endColorstr='#345c95', GradientType=0);color:#ffffff}
.btn.test-btn a:before{background:url("../images/myWordlist/btn-test.png") no-repeat scroll -1px top/100% auto transparent}
.btn.test-btn a,.btn.delete-btn a{padding-left:28px}
.wl-add a:before{background:url("../images/myWordlist/btn-wordlist.png") no-repeat 0px 0px transparent;background-size:100%}
.wl-table{width:100%;margin-top:10px;margin-bottom:28px;border:1px solid #cccccc;border-collapse:separate}
.wl-table .wl-col1{text-align:left;font-size:16px}
.wl-table tr th{color:white;vertical-align:middle}
.wl-table th,.wl-table td{text-align:center;line-height:18px;padding:12px}
.wl-table.wl-edit .wl-col2{font-style:italic}
.wl-table.wl-edit .wl-col3{text-align:left}
.wl-table .wl-col1 a{line-height:20px;padding-right:12px;text-align:left;font-size:16px;font-weight:bold}
.entry-word{font-weight:bold;font-family:'Open Sans', Arial;color:#4577bf;margin-left:10px}
.hide-delete-icon{display:none}
.premium .hide-delete-icon{display:block}
h1.my-wordlist-titles{margin:7px 0 21px}
h2.my-wordlist-titles{font-size:36px;color:#4577bf;font-weight:bold;padding-left:0;margin-top:6px;margin-bottom:24px;line-height:1em}
h3.my-wordlist-titles{line-height:1.5em;font-size:16px;font-weight:bold;margin:0;padding:0;color:#0d3880}
h4.my-wordlist-titles{font-weight:bold;margin-bottom:6px}
h5.my-wordlist-titles{font-size:18px;line-height:28px;margin:0 0 7px;font-weight:bold}
.mywordlist-container{padding-left:15px}
.mywordlist-container>.entry>span.h{display:none}
.senseinfo{margin-bottom:6px}
.senseinfo .sense_check_box{margin-right:6px}
#wordlist-select{margin-bottom:7px}
.test__question-count{margin:-7px -14px 14px;padding:5px 12px;background-color:#4577bf;color:white}
.test__definition{font-size:22px;line-height:26px;color:#07255e;max-width:650px;font-size:18px}
.test__definition__wrap{margin-top:14px;margin-bottom:14px}
.test__definition__wrap .pos{margin-bottom:6px;font-size:15px;font-weight:normal}
.test__definition__wrap p{display:table-cell;padding-right:14px}
.test__form,#add-wordlist{display:table;width:100%;margin-bottom:0;vertical-align:top;padding-bottom:10px}
.test__form .test__answer{font-size:15px;line-height:1.6em;width:350px;float:left;margin-bottom:7px;margin-right:14px}
.test_submit_testme{float:left}
.test__form input[type='text']{border:none;font-size:16px;padding:0 10px;line-height:30px;height:30px;border-radius:6px;background-color:white;-webkit-box-shadow:2px 2px 5px rgba(0,0,0,0.5) inset;box-shadow:2px 2px 5px rgba(0,0,0,0.5) inset;color:grey;width:100%}
.test__form #add-wordlist .test__submit{float:left}
.result{display:table-cell;vertical-align:middle}
.test__attempt,.test__useranswer,.test__skipped{display:inline-block;font-size:26px;font-weight:bold;width:100%;margin-left:-30px;padding-left:30px}
.test__skipped{font-size:24px}
.test__attempt{color:#C1272D}
.test__useranswer{color:#037531}
.test__correctanswer{font-weight:bold;color:#07255E}
.test__incorrect,.test__correct{width:24px;height:24px;line-height:20px;background:url(../images/myWordlist/test-cross.png) no-repeat #C1272D;background-size:100%;border-radius:24px;border:2px solid white;vertical-align:top;text-indent:-9999px;display:inline-block;margin-right:5px}
.test__correct{background-color:#037531;background-image:url(../images/myWordlist/test-tick.png)}
.test__correcthead{text-transform:capitalize}
.test__form .test__answer,.test__form .test__submit,.test__form .test__skip,#check-answer .test__form .test__next,#check-answer .test__form .test__quit{display:table-cell;vertical-align:top}
.test__form .test__submit,.test__form .test__next{padding-right:5px}
.test__next,.test__quit{float:left}
.mywordlist-warnings,.error{display:none;color:#c73b2a}
.mywordlist-warnings#wait,.mywordlist-warnings#test-loading,.mywordlist-warnings#test-saving-score,.mywordlist-warnings#supp{color:#00123c}
.mywordlist-warnings#wait:before,.mywordlist-warnings#test-loading:before,.mywordlist-warnings#test-saving-score:before,.mywordlist-warnings#supp:before{bottom:-2px;content:url("../images/myWordlist/loader-sm.gif");display:inline-block;margin-right:8px;position:relative}
.mywordlist-warnings#wait:before{content:url("../images/myWordlist/loader-sm-blue.gif")}

/*migrated mywordlist styles from oxford.css end*/

/*hide share start*/

.entry-header .share-this-entry{margin:0;padding-top:0;display:none}
.social-wrap{display:none;}

/*hide share end*/

/*product page signed in and out start*/

.product_paid.english, .product_top_background.english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.american_english, .product_top_background.american_english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.academic, .product_top_background.academic {
    background-color: #efccac66;
    display: block !important;
}

.product_paid.collocations, .product_top_background.collocations {
    background-color: #f9e6e1;
    display: block !important;
}

.product_paid.schulwoerterbuch_English-German, .product_top_background.schulwoerterbuch_English-German {
    background-color:  #d6f3d1b5;
    display: block !important;
}

.product_paid.grammar, .product_top_background.grammar {
    background-color: #e4d4d7;
    display: block !important;
}

.product_paid.students, .product_top_background.students {
    background-color: #f9efdf;
    display: block !important;
}


.product_paid .product_paid .vrtcl_cntrd {
max-width: 800px;
}

@media screen and (max-width: 928px) and (min-width: 762px){
.product_paid.english, .product_top_background.english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.american_english, .product_top_background.american_english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.academic, .product_top_background.academic {
    background-color: #efccac66;
    display: block !important;
}

.product_paid.collocations, .product_top_background.collocations {
    background-color: #f9e6e1;
    display: block !important;
}

.product_paid.schulwoerterbuch_English-German, .product_top_background.schulwoerterbuch_English-German {
    background-color:  #d6f3d1b5;
    display: block !important;
}

.product_paid.students, .product_top_background.students {
    background-color: #f9efdf;
    display: block !important;
}
}

@media screen and (max-width: 761px) and (min-width: 261px){
.product_paid.english, .product_top_background.english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.american_english, .product_top_background.american_english {
    background-color: #c0e3f599;
    display: block !important;
}

.product_paid.academic, .product_top_background.academic {
    background-color: #efccac66;
    display: block !important;
}

.product_paid.collocations, .product_top_background.collocations {
    background-color: #f9e6e1;
    display: block !important;
}

.product_paid.schulwoerterbuch_English-German, .product_top_background.schulwoerterbuch_English-German {
    background-color:  #d6f3d1b5;
    display: block !important;
}

.product_paid.students, .product_top_background.students {
    background-color: #f9efdf;
    display: block !important;
}

}

.product_paid .product_paid.premium {
    background-color: initial;
}

.responsive_row.sample {
    margin-top: 50px;
    margin-bottom: 50px;
}

/*product page signed in and out end*/

.hr-margin {
    margin: 3rem 0;
}

/*upgrade page start */

.upgrade .major_usp img{
	height: 300px;
	width:initial;
}

.upgrade .mtb-7 {
    padding-left: 60px;
    padding-right: 60px;
}

@media screen and (max-width: 761px){
.upgrade .mtb-7 {
    padding-left: 20px;
    padding-right: 20px;
}
	.upgrade_no_margin {
    margin-bottom: 0px;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
}
}

@media screen and (max-width: 389px){
.dictionary_banner .dictionaries > div {
    width: 40%;
    margin-left: 1%;
    margin-right: 1%;
    height: auto;
    /* background-color: white; */
    text-align: center;
    margin-bottom: 10px;
}

	.dictionary_banner .dictionaries .img {
    margin: 0;
    margin-right: 0px;
    width: 80px;
    height: 80px;
    position: relative;
    /* top: -10px; */
    left: 27px;
    margin-bottom: 10px;
}
}

.upgrade .upgrade-title{
	text-align: left;
}

.upgrade_productheading {
	font-weight: 600;
	line-height: 1.2;
}

.upgrade_productsubheading {
	margin-top: 0px;
    margin-bottom: 20px;
}

.upgrade_productheading2 {
	font-weight: 600;
	line-height: 1.2;
	font-size:28px;
}

.upgrade_productsubheading2 {
	margin-top: 5px;
    margin-bottom: 20px;
	font-size: 18px;
	line-height: 1.5;
}

.upgrade ol li {
    margin-bottom: 15px;
    font-size: 17px;
    line-height: 1.8rem;
}

.upgrade_buttons_container {
	margin-top: 20px;
    margin-bottom: 20px;
}

.secondaryButton {
    background-color: #ffffff;
    color: #4776ae;
    border-radius: 5px;
    font-family: 'Source Sans Pro', sans-serif;
    padding: 8px 25px;
    cursor: pointer;
    margin: 5px 10px;
    position: relative;
    border: 1px solid #4776ae;
    min-height: 30px;
    line-height: 22px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    min-width: 40px;
	width:-webkit-max-content;
	width:-moz-max-content;
	width:max-content;
    fill: #fff;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
    text-decoration: none;
    display: inline-block;
}

.secondaryButton:hover {
    background-color: #4776ae;
    color: #ffffff;
    border-color: #4776ae;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.upgradeButton {
    background-color: #ea7f7e;
    color: #ffffff;
    padding: 8px 25px;
    border: 1px solid #ea7f7e;
    border-radius: 5px;
    margin: 5px 10px;
    min-height: 30px;
    line-height: 22px;
    text-align: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    min-width: 40px;
	width:-webkit-max-content;
	width:-moz-max-content;
	width:max-content;
    fill: #fff;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
    text-decoration: none;
    display: inline-block;
}

.upgradeButton:hover {
    background-color: #ffffff;
    color: #ea7f7e;
    border-color: #ea7f7e;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.buyACodeButton {
    background-color: #E51069;
    color: #ffffff;
    font-family: 'Source Sans Pro', sans-serif;
    padding: 8px 25px;
    border-radius: 5px;
    margin: 5px 10px;
    cursor: pointer;
    position: relative;
    border: 1px solid #E51069;
    min-height: 30px;
    line-height: 22px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    min-width: 40px;
    fill: #fff;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
    text-decoration: none;
    display: inline-block;
}

.buyACodeButton:hover {
    background-color: #ffffff;
    color: #E51069;
    border-color: #E51069;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.buyACodeButton:after {
	content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url("../images/graphics/icon-link-external_white.svg");
    width: 16px;
    height: 16px;
    margin: 0px 0px -2px 7px;
}

.buyACodeButton:hover:after {
	content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url("../images/graphics/icon-link-external_pink.svg");
    width: 16px;
    height: 16px;
    margin: 0px 0px -2px 7px;
}

.redeemButton {
    background-color: #0C7BC0;
    color: #ffffff;
    border-radius: 5px;
    font-family: 'Source Sans Pro', sans-serif;
    padding: 8px 25px;
    cursor: pointer;
    margin: 5px 10px;
    position: relative;
    border: 1px solid #0C7BC0;
    min-height: 30px;
    line-height: 22px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    min-width: 40px;
    fill: #fff;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
    text-decoration: none;
    display: inline-block;
}

.redeemButton:hover {
    background-color: #ffffff;
    color: #0C7BC0;
    border-color: #0C7BC0;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.buyAPrintBook {
    background-color: #ffffff;
    color: #4776ae;
    border-radius: 5px;
    font-family: 'Source Sans Pro', sans-serif;
    padding: 5px 25px;
    cursor: pointer;
    margin: 5px 10px;
    position: relative;
    border: 1px solid #4776ae;
    min-height: 30px;
    line-height: 28px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 100%;
    min-width: 40px;
	width:-webkit-max-content;
	width:-moz-max-content;
	width:max-content;
    fill: #fff;
    -webkit-transition: background-color .1s;
    -o-transition: background-color .1s;
    transition: background-color .1s;
    text-decoration: none;
    display: inline-block;
}

.buyAPrintBook:hover {
    background-color: #4776ae;
    color: #ffffff;
    border-color: #4776ae;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.buyAPrintBook:after {
	content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url("../images/graphics/icon-link-external_default.svg");
    width: 16px;
    height: 16px;
    margin: 0px 0px -2px 7px;
}

.buyAPrintBook:hover:after {
	content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url("../images/graphics/icon-link-external_white.svg");
    width: 16px;
    height: 16px;
    margin: 0px 0px -2px 7px;
}

.flushbutton {
	margin-left:0px;
}

.promotebutton {
    padding: 5px;
    line-height: 20px;
    font-weight: 600;
    padding-bottom: 5px;
    padding-top: 20px;
	height: 100%;
	-webkit-box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.2);
    border: 1px solid #d9d9d9;
}

.upgradebanner.banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f8f5f1;
    padding-top: 30px;
    padding-bottom: 10px;
}

.upgrade_no_margin{
	margin-bottom:0px;
	padding-top:0px;
}

.redeemBox h2.upgrade_productheading {
    margin-bottom: 20px;
}

.dictionary_banner .redeemButton {
    padding-left: 5px;
    padding-right: 5px;
    width: 90%;
    margin-top: 20px;
    margin-left: 0px;
    margin-right: 0px;
	font-size: 16px;
}

.secondaryButton:hover .redeemButton {
    background-color: #ffffff;
    color: #0C7BC0;
    border-color: #0C7BC0;
    font-family: 'Source Sans Pro', sans-serif;
    text-decoration: none;
    cursor: pointer;
}

.endofpageredeemBox {
	margin-top:100px;
	margin-bottom:100px;
}

div#jumppremium, div#jumppeu, div#jumpschul {
    background-color: #f3f8ff;
}

ol.upgrade_list {
	list-style-image: url(../images/graphics/tick_green.svg);
	list-style-position:outside;
	padding-left:25px;
}

body[upgrade] div#ox-container div.row.product_paid.english {
	display:none !important;
}

body[upgrade] div#ox-container div.responsive_container.premium {
	width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}


/*upgrade page end */

div.old_logo {
    background-image: url(../images/OLD_logo.svg), linear-gradient(transparent, transparent);
    background-size: cover;
    background-repeat: no-repeat;
    width: 247px;
}

@media screen and (max-width: 370px){
	div.old_logo {
        background-image: url(../images/OLD_logo.svg), linear-gradient(transparent, transparent);
        background-size: cover;
        background-repeat: no-repeat;
        width: 197px;
		height:12px !important;
    }
}

#elm-box {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 20;
    background-color: white;
    padding: 6px;
    border: solid 2px;
    border-color: #bcbcbc;
    background-color: #e0e0e0;
}

#elm-box button{
    font-size: 16px;
}

#elm-title {
    font-weight: bold;
}

#elm-buttons {
    display: flex;
    justify-content: space-evenly;
}

#elm-dismiss {
    margin: 10px 0 0 0;
}

#elm-dismiss input{
    padding-right: 5px;
}

.hidden{
    display: none;
}

.iframe-student {
    width: 426px;
    height: 240px;
}

.iframe_lor_loader {
    background-color: lightgray;
    border: 1px solid #000;
}

.student-separator {
    padding-right: 80px;
}

.student-vimeo {
    width: 426px;
    height: 240px;
}

@media screen and (max-width: 480px) {
    .iframe-student {
        width: 100%;
        height: 240px;
    }

    .student-separator{
        padding-right: unset;
    }

    .student-vimeo {
        width: 100%;
        height: 195px;
    }
}