/*
Preject Name: Otakim Group
Preject URL: http://www.otakim.com
Version: 1.0
Description: Bootstrap4, HTML5, CSS3 and Fully Responsive Website.
Author: Otakim Group Team

/*[Table of Content]

=> 1. Genral Css
=> 2. Header
=> 3. Site Footer
=> 4. Main Banner
=> 5. Video and Services section
=> 6. Booklets and textbooks
=> 7. Sign In Page
=> 8. Thank You Page
=> 9. Step 3 Page
=> 10. Step 4 Page
=> 9. Media Quries / Responsive

*/

/*-------------------------------------------*\
    1. Genral Css
\*-------------------------------------------*/
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-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration { -webkit-appearance: none; -moz-appearance: none; }
input[type=search] { -webkit-appearance: none; -moz-appearance: none; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; max-width: 100%; }

audio:not([controls]) { display: none; height: 0; }
html { font-size: 100%; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ height: 100%;
box-sizing: border-box;}
:focus { outline: 0; }
a:focus { outline:none; }
a:active, a:hover { outline: 0; text-decoration: none;}
button:focus, .form-control:focus, .form-control:active, .custom-select:focus, .custom-select:active{ outline: 0; box-shadow: none;}

img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ }
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; /* 3 */ }
button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; /* 3 */ }
button, input { line-height: normal; }
button, select { text-transform: none; }
button, html input[type="button"],/* 1 */
input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible;  /* 4 */ }
button[disabled], html input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ }
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ }

table { border-collapse: collapse; border-spacing: 0; }
html, button, input, select, textarea { color: #222; }

::-moz-selection { background: #b3d4fc; text-shadow: none; }
::selection { background: #b3d4fc; text-shadow: none; }

::-webkit-input-placeholder {
  color: inherit !important;
  opacity:1 !important;
}
::-moz-placeholder {
  color: inherit !important;
  opacity:1 !important;
}
:-ms-input-placeholder {
  color: inherit !important;
  opacity:1 !important;
}
:-moz-placeholder {
  color: inherit !important;
}

img { vertical-align: middle; max-width: 100%;}
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }

body{overflow-x: hidden; font-size: 16px; color: #565656; font-weight: 400; font-family: 'Assistant', sans-serif; 
overflow-x: hidden; position: relative; min-height: 100%;}

.section-title h3 {font-size: 40px; color: #000; font-weight: 400; margin-bottom: 15px; letter-spacing: 0.2px;}
.section-title p{font-size: 20px; font-weight: 400; color: #111111; max-width: 360px; margin: 0 auto; line-height: 1.2; letter-spacing: 0.2px;}

body.pattern {
    background: url(../images/banner-pattern.png) no-repeat;
    background-size: 75%;
    background-position: left -6px top 0px;
}


/*Language Switching CSS*/
.direction-rtl {direction: rtl; text-align: right;}

.theme-btn {display: inline-block; position: relative;}
.theme-btn .btnbg{background: #fbaf2e;
display: inline-block; /*padding: 19px 20px 25px 21px; */
clip-path: polygon(5% 8%, 100% 8%, 94% 100%, 0% 75%);
-webkit-clip-path: polygon(5% 8%, 100% 8%, 94% 100%, 0% 75%); display: block;
position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: 0;}
.theme-btn a{ text-align: center; color: #fff; font-size: 19px;  font-weight: 400;}
.theme-btn .form-btn, .theme-btn a{position: relative; padding:15px 22px 26px 25px; display: inline-block; z-index: 9;}
.theme-btn .form-btn {background: transparent; box-shadow: none; border: none; padding: 10px 18px 20px 23px;
color: #fff; font-size: 17px;}
.theme-btn:hover .btnbg, .banner-btn-box li:hover .btnbg{background: #286ba9; color: #fff;}
.theme-btn:after, .banner-btn-box li:after {
content: ""; background: url(../images/btn-bord.png); position: absolute;
left: 9px; right: -9px; top: -2px; bottom: 3px; display: block;
z-index: 1; background-size: 100% 100%; background-repeat: no-repeat; }
.theme-btn:hover:after{background: url(../images/themebtn-bg-hov.png); background-size: 100% 100%;
background-repeat: no-repeat;}

.wht-border:after{background: url(../images/btn-bord-white.png); background-size: 100% 100%;
background-repeat: no-repeat;}

/* Button Blue */
.theme-btn.btn-blue .btnbg{background: #1f6cab;}
.theme-btn.btn-blue:hover .btnbg{background: #fbaf2e;}
.theme-btn.btn-blue:after{background: url(../images/themebtn-bg-hov.png); background-size: 100% 100%;
background-repeat: no-repeat; right: -8px;}
.theme-btn.btn-blue:hover:after{background: url(../images/btn-bord.png); background-size: 100% 100%;
background-repeat: no-repeat; }

/*-------------------------------------------*\
   2. Header 
\*-------------------------------------------*/
.site-header{padding: 32px 0; position: relative; z-index: 99;}
.site-header .row{align-items: center;}
.hamburger-title {padding-right: 50px; font-size: 23px; font-weight: 300; line-height: 1; }
.menu-col{position: relative;}
.menu-col a{color: #fff;}
.menu-col a:hover{color: #fff; text-decoration: none;}

.menu-col .navbar-light .navbar-toggler{height: 40px;}
.menu-col .navbar{justify-content: inherit; padding: 0;}
.menu-col .navbar-light .navbar-brand{color: #fff;}
.menu-col .navbar-light .navbar-toggler,
.menu-col .navbar-light .navbar-toggler:focus{border: none; box-shadow: none; outline: none; padding-left: 0; padding-right: 0;}

button.navbar-toggler.collapsed .hamburger span {margin: 7px 0;}
.hamburger span {background: #fff; height: 2px; width: 32px; display: block;  border-radius: 5px;
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
-o-transition: .35s ease-in-out;
transition: .35s ease-in-out;}
.hamburger span.meat {width: 18px; }
.hamburger:hover span{background: #fbaf2e;}
button.navbar-toggler.collapsed .hamburger span{transform: none !important;}
button.navbar-toggler.collapsed span.meat{display: block !important;}
button.navbar-toggler .hamburger span.meat{display: none;}
button.navbar-toggler .hamburger span.top-bun {top: 18px;
-webkit-transform: rotate(135deg); -moz-transform: rotate(135deg);
-o-transform: rotate(135deg); transform: rotate(135deg);}
button.navbar-toggler .hamburger span.bottom-bun{    top: 18px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);}

.menu-col #navbarNavDropdown {width: 0; display: block !important; position: absolute;
top: 100%; background: #fbaf2e; transition: ease-in-out 0.3s; -webkit-transition: ease-in-out 0.3s;
margin-top: 15px; min-height: 200px; z-index: 9; visibility: hidden; }
.menu-col #navbarNavDropdown .navbar-nav{padding: 15px;}
.menu-col #navbarNavDropdown.show{width: 235px; transition: ease-in-out 0.3s;
-webkit-transition: ease-in-out 0.3s; visibility: visible; }

.menu-col .navbar-light .navbar-nav .nav-link{color: #fff;}
.menu-col #navbarNavDropdown .dropdown-menu {background: rgba(86, 56, 6, 0.1); border: none; text-align: right; height: 0; transition: all ease-in-out 0.3s; opacity: 0; display: block; padding: 0; visibility: hidden;}
.menu-col #navbarNavDropdown .dropdown-menu.show{height: 137px; transition: all ease-in-out 0.3s; opacity: 1; visibility: visible;}
.menu-col #navbarNavDropdown .dropdown-menu .dropdown-item{padding-left: 10px; padding-right: 10px; padding-bottom: 0;
    padding-top: 10px; font-size: 14px; color: #fff;}
.menu-col .navbar-light .navbar-nav .nav-link:hover,
.menu-col #navbarNavDropdown .dropdown-menu .dropdown-item:hover{color: #333;}
.menu-col #navbarNavDropdown .dropdown-menu .dropdown-item:hover,
.menu-col #navbarNavDropdown .dropdown-menu .dropdown-item:focus,
.menu-col #navbarNavDropdown .dropdown-menu .dropdown-item:active{background: transparent;}

.logo, .user-service {display: inline-block; }
.logo {width: 100%; max-width: 151px; text-align: initial; }
.logo img {max-width: 150px; position: absolute; top: 5px; }
#header-transparent .logo img{top: -16px;}

.header-right {text-align: left; }
.user-service {text-align: right;}
.user-service > li {display: inline-block; padding:0px 10px 0px 6px; font-size: 18px; font-weight: 400; color: #1f6cab;
border-right: solid 1px #1f6cab; font-family: 'Assistant', sans-serif; vertical-align: middle; transition: all 0.3s;}
.user-service > li:first-child{border-right: none;}
.user-service > li > a{ color: #1f6cab;}
.user-service > li.active a,
.user-service > li a:hover{color: #fbaf2e; transition: all 0.3s; }

/* Header Tranparent Css */
#header-transparent{background: transparent; color: #333; border-bottom: solid 1px rgba(40, 107, 169, 0.35);}
#header-transparent .logo{margin-left:20px; margin-right: 0;}


/* Header Style-2 */
.header-style2{background: #286ba9; color: #fff; padding: 8px 0 8px; position: relative; z-index: 99;}
.header-style2 .lang-col{text-align: left;}
.header-style2 ul.user-service {margin-left: 21px; border: 1px dashed #3e82b2; padding: 7px 5px; position: relative;
top: -2px;}
.header-style2 .user-service > li{border-color:#fff; padding: 0px 12px 0px 8px;}
.header-style2 .user-service > li > a {color: #fff; }
.header-style2 .user-service > li.active a, .header-style2 .user-service > li a:hover {color: #fbaf2e; transition: all 0.3s; }

.header-title h3 {font-size: 24px; letter-spacing: 0.2px; display: table;}
.header-title h3 .stepno {background: #fbae2c; border-radius: 50%; width: 46px; height: 46px; display: inline-block;
text-align: center; line-height: 46px; vertical-align: middle; margin: 0 2px 0 4px; font-weight: 700; }
.header-title h3 .text {line-height: 1;}
.stepbox {min-width: 105px; }
.header-title .stepbox,
.header-title h3 .text{display: initial; vertical-align: middle; }


/*-------------------------------------------*\
  3. Site Footer
\*-------------------------------------------*/
.site-footer{background: #f4f4f4; padding: 12px 0;}
.site-footer .copyright{font-size: 12px; font-weight: 400;}
.site-footer .copyright, .site-footer .copyright a{color: rgba(0,0,0,0.40);}


/*-------------------------------------------*\
  4. Main Banner
\*-------------------------------------------*/
.main-banner{background-color: #2872ae; padding: 50px 0 90px; color: #fff; position: relative;
clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 80%);
-webkit-clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 80%);}
.main-banner:before{background: url('../images/main_background_pattern.png'); content: ""; position: absolute; left: 0; right: 0;
top: 0; bottom: 0; background-position: 100% 100%; background-repeat: repeat;
-webkit-animation: rotating4 alternate ease-in-out infinite 32s;
animation: rotating4 alternate ease-in-out infinite 32s;

}

.main-banner h1{font-size: 45px; letter-spacing: -0.2px; font-weight: 700;}
.main-banner h4{font-size: 24px; letter-spacing: -0.2px; font-weight: 700; margin: 10px 0 25px;}
.main-banner p{font-size: 21px; font-weight: 400; line-height: 1.2; margin-top: 13px;}
.main-banner .banner-btn{margin-top: 38px;}
.main-banner .banner-btn a{font-size: 24px; padding: 12px 50px 27px 55px;}
.booklets-inn .theme-btn:hover .btnbg,
.main-banner .banner-btn:hover .btnbg{background: #ea9c18;}
.booklets-inn .theme-btn:hover:after,
.main-banner .banner-btn:hover:after{background: url(../images/btn-bord-white.png); background-size: 100% 100%;
background-repeat: no-repeat;}

@keyframes rotating4 {
  0% {
    top: -60%;
  }
  100% {
    bottom: -60%;
  }
}

@-webkit-keyframes rotating4 {
  0% {
    top: -60%;
  }
  100% {
    bottom: -60%;
  }
}




/*-------------------------------------------*\
  5. Video and Services section
\*-------------------------------------------*/
.video-services-sec {padding: 30px 0 0px; background: url('../images/pettern.png'); background-repeat: no-repeat;
background-position: right top 50px;}
.video-services-sec .section-title{margin-bottom: 55px;}
.pcont{font-size: 16px; color: #565656; line-height: 1.5; margin-bottom: 15px;}
.pcont:last-child{margin-bottom: 0;}
.video-cont-col h4{font-size: 24px; color: #1f6cab; font-weight: 700; letter-spacing: 0.2px; line-height: 1.2;
border-bottom: dashed 1px #ececec; padding-bottom: 15px; margin-bottom: 18px;}
.video-cont-col p{}

.services-row{margin-top: 50px;}
.services-box{/*border-left: solid 1px; border-image: linear-gradient( to top, white, rgba(0, 0, 0, 0.20) ) 1 100%;*/ position: relative;}
.services-box:before{content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 1px;
background: url('../images/gradient-border.png'); background-repeat: no-repeat; }
.services-box.last:before{content: none;}
.services-box-inn{padding: 0 15px; margin-bottom: 20px;}
.icon-box span{width: 90px; height: 90px; line-height: 90px; background: #fbae2c; text-align: center; display: inline-block;
border-radius: 50%; padding:0 10px;}
.icon-box span i img{transform: rotate(0deg); transition: all 0.3s; -webkit-transition: all 0.3s; -ms-transition: all 0.3s;}
.services-box h4{font-size: 26px; color: #000000; letter-spacing: 0.2px; margin: 15px 0 5px;}
.services-box h5{font-size: 18px; color: #000000; letter-spacing: 0.2px;}
.services-box p{font-size: 18px; margin-top: 15px;}
.services-box-inn:hover .icon-box span i img{transform: rotate(360deg); transition: all 0.3s;}

/*-------------------------------------------*\
  6. Booklets and textbooks
\*-------------------------------------------*/
.booklets-textbooks{background-color: #2872ae; padding:125px 0 55px; color: #fff; position: relative;
clip-path: polygon(0% 11%, 100% 0px, 100% 100%, 0 100%);
-webkit-clip-path: polygon(0% 11%, 100% 0px, 100% 100%, 0 100%);}
.booklets-textbooks:before{background: url('../images/pattern-with-vector.png'); content: ""; position: absolute; left: 0; 
right: 0; top: 0; bottom: 0; background-position: center top 20px; background-repeat: no-repeat; background-size: cover;}
.booklets-inn{background: rgba(255,255,255,0.10); min-height: 100%; border: 1px solid #fff; padding:20px 30px 35px;
transition: all ease-in-out 0.3s;}
.booklets-inn, .booklets-inn p, .booklets-inn p.pcont{color: #fff;}
.booklets-inn h3{ font-weight: 700; font-size: 30px; letter-spacing: 0.2px; border-bottom:dashed 1px rgba(255, 255, 255, 0.2);
padding-bottom: 23px; margin-bottom: 23px;}
.booklets-inn p.pcont{font-size: 18px;}
.booklets-inn figure{margin: 40px 0;}
.booklets-inn .theme-btn a{font-size: 24px; padding: 17px 20px 32px 30px;}

/*.booklets-inn:hover{background: rgba(255,255,255,1);}
.booklets-inn:hover h3{color: #1f6cab; border-bottom-color:#eaeaea; }
.booklets-inn:hover p.pcont{color: #565656;}
.booklets-inn:hover .theme-btn:after{background: url(../images/btn-bord.png) !important; background-size: 100% 100% !important;
background-repeat: no-repeat !important;}
.booklets-inn:hover .theme-btn:hover .btnbg{background: #ea9c18;}
*/

/*-------------------------------------------*\
  7. Sign In Page
\*-------------------------------------------*/
.section-description {background: white; padding: 10px;  border: 1px dashed #e2e2e2;  margin: 20px 0px 20px 0; direction: rtl; text-align: right;}
.form-sec{padding: 40px 0; border-bottom: 1px solid #f2f2f2; margin-bottom: 30px;}
.form-sec-title {color: #1f6cab; font-size: 30px; letter-spacing: -0.2px; font-weight: 600;
margin-bottom: 60px; }
.form-contanner{max-width: 565px;}

.signinform {border: 2px dashed rgba(40, 107, 169, 0.5); padding:60px 25px 40px 25px; position: relative; /*margin-top: 50px; margin-bottom: 0;*/}
.formlogo {position: absolute; top: -20px; left: 0; right: 0; margin: 0 auto; }
.otakim-form .form-header .formtitle{margin-bottom: 13px;}
.otakim-form .formtitle{margin-top: 0; color: #1f6cab; font-size: 24px; margin-bottom: 20px;}
.form-header .pcont {margin-bottom: 10px; padding: 0 25px; font-weight: 400;}
.createcopy a{color: #5698d6;}
.group-order-box {border-top: 1px dashed #cccccc; margin: 30px 0 22px 0; padding: 40px 0 20px 0; border-bottom: 1px dashed #cccccc; }

.otakim-form .form-group {margin-bottom: 8px; }
.otakim-form .input-group{border:1px dashed #c1c1c1; height: 44px; background: #f2f2f2; padding-bottom: 0;}
.otakim-form .form-control{height: 100%; background-color: transparent; border: none; border-radius: 0;
color: #5698d6; font-size: 16px; font-weight: 400;}
.otakim-form .form-footer .custom-control-label:focus:after, .otakim-form .form-footer .custom-control-label:focus:before,
.otakim-form .custom-control-input:checked~.custom-control-label:focus::before,
.otakim-form .custom-control-input:not(:disabled):active~.custom-control-label:focus::before,
.otakim-form .custom-control-input:checked~.custom-control-label::before{border: transparent !important; background: transparent; box-shadow: none !important; }
.otakim-form span.input-group-addon {padding-right: 15px; }
.otakim-form span.valid-icon {padding-left: 11px; padding-top: 13px; color: #286ba9; font-size: 20px; 
  position: absolute; left: 0; z-index: 9;}
.form-control.valid~span.valid-icon i:before,
.form-control.invalid~span.valid-icon i:before,
.form-control span.valid-icon i:before {content: none !important;}

.otakim-form .form-footer {margin-top: 30px; }
.otakim-form .form-footer, .otakim-form .form-footer a{color: #928f8f;}
.otakim-form .form-footer a:hover{color: #fbaf2e; }
.otakim-form .forgot-col span {font-size: 11px; padding: 0 4px; color: #bfbfbf; }
.otakim-form .form-footer .custom-control-label::after, .otakim-form .form-footer .custom-control-label::before{
background-image: url(../images/cheq-mark-blue.png); }
.otakim-form .form-footer .custom-checkbox .custom-control-input:checked~.custom-control-label::after{
background-image: url(../images/tick-mark-blue.png); }

.otakim-form .theme-btn .form-btn {padding: 9px 25px 19px 30px; font-size: 19px; min-width: 150px; color: #fff;}
.signinform .theme-btn:hover .btnbg{background: #286ba9;}
.otakim-form .theme-btn:hover .form-btn{color: #fff;}
.otakim-form .btn-col {margin-bottom: 0; margin-top: 45px;}
div.invalid {display: none !important; }
span.valid-icon{display: none;} 
.signinform .error{font-size: 14px; color: rgba(255, 255, 255, 0.75);}
.form-control.invalid~span.valid-icon,
.form-control.valid~span.valid-icon{font-size: 18px;}
.form-control.valid~span.valid-icon{display: block;}
.form-control.invalid~span.valid-icon{display: block;}
.form-control.invalid~span.valid-icon .fa:before {content: "\f057"; color: #fbb749;}
div.invalid{display: none !important;}
.form-control.invalid~span.valid-icon .fa {background: url(../images/close-iocn.png) no-repeat;
width: 18px; height: 18px; background-size: 100%; }
.form-control.valid~span.valid-icon .fa {background: url(../images/check-icon.png) no-repeat; width: 18px; height: 18px;
background-size: 100%; }

.signinform .field-col{padding-right: 12px; padding-left: 12px; position: relative;}
.cst-radio{position: relative; margin-right: -5px; margin-left: -5px; margin-bottom: 24px !important;}
.cst-radio [class*="col-"]{padding-right: 5px; padding-left: 5px;}
.cst-radio .input-hidden {position: absolute; /*left: -9999px;*/ opacity: 0;}
.cst-radio label,.theme-btn,.sharing-col{ cursor: pointer;}
.cst-radio .first input[type=radio].invalid + div.invalid + label,
.cst-radio input[type=radio].invalid + label{border: 1px dashed red !important;}
/*.cst-radio .first input[type=radio].valid:checked + label,
.cst-radio input[type=radio]:checked.valid + label{border: 1px dashed #1f6cab !important;}*/
.cst-radio input[type=radio]:checked + div + label>img,
.cst-radio input[type=radio]:checked + label>img {border: 1px dashed rgba(40, 107, 169, 0.5); box-shadow: 0 0 0px 1px #1f6cab; }
/* Stuff after this is only to make things more pretty */
.cst-radio input[type=radio] + label>img {border: 1px dashed #dadada; width: 100%;
height: 100%; object-fit: cover; transition: 500ms all; }
/*.cst-radio input[type=radio]:checked + label>img {transform: rotateZ(-10deg) rotateX(10deg); }*/

/*-------------------------------------------*\
  8. Thank You Page
\*-------------------------------------------*/
.innerbanner{background: #286ba9; padding: 70px 0;}
.innerbanner h1{color: #fff; font-size: 42px; text-transform: uppercase; font-weight: 600;}
.thankucont{padding: 70px 0; border-bottom: 1px solid #f2f2f2;}
.thankucont h3{font-size: 28px; color: #333; font-weight: 600;}
.thankucont p{font-size: 17px; color: #565656; font-weight: 400; margin-bottom: 30px; margin-top: 10px;}
.thankucont .form-btn{min-width: 160px; color: #fff; font-size: 20px;}


/*-------------------------------------------*\
  9. Step 3 Page
\*-------------------------------------------*/
.step-sec{padding: 40px 0;}

.step-col-inn{position: relative;  padding: 0 15px;}
.step-left-col .step-col-inn h4.title{color: #1f6cab; margin: 0 0 13px}
.step-content-col{border-right: 1px solid #f0f0f0; border-left: 1px solid #f0f0f0;}
.h3-title{font-size: 20px; color: #333333; font-weight: 700; letter-spacing: 0.2px; margin-bottom: 22px;}
.h3-title img.ques {position: absolute; top: 10px; left: 12px; }
.step-right-col .h3-title {margin-bottom: 5px; position: relative; top: -5px;}

.simulations-box{background: #f2f2f2; border: 1px dashed #cdcdcd; padding: 13px 20px; margin: 0 0 12px;}
.step-col-inn h4.title,
.simulations-box h4.title{font-size: 18px; color: #000; margin:0 0 18px;}
.step-sec .otakim-form .input-group{ height: 40px; margin-bottom: 9px;}
.step-sec .otakim-form span.valid-icon{padding-top: 11px}
.simulations-box #couponcode.form-control{background: #fff;}
.simulations-box #couponcode.form-control.invalid{border: 1px dashed red;}
.simulations-box #couponcode.form-control.valid{border: 1px dashed green;}
.continued-btn,
.redeem-coupon-btn {margin: 20px 0 5px; }
.continued-btn .theme-btn .form-btn,
.redeem-coupon-btn .theme-btn .form-btn{    font-size: 21px;
    padding: 9px 20px 19px 25px;
    min-width: 190px;
    min-height: 70px;}
div[class="pointer"] {cursor:pointer}

div[class="pointer"]:hover {font-weight:600}
/*Promotional/Geva students Coupon*/
.simulations-box.pomotional-students{background: #fff2f2; border-color: #f1585c;}
.simulations-box.geva-students{background: #fffbf4; border-color: #fcc567;}
.simulations-box.pomotional-students,
.simulations-box.geva-students{padding:17px 15px 20px;}
.pomotional-students .otakim-form .form-control,
.geva-students .otakim-form .form-control{background: #fff;}
.pomotional-students .promo-title,
.geva-students .promo-title{color: #000; font-size: 18px; font-weight: 700; margin: 15px 0 11px;
letter-spacing: -0.2px; line-height: 1.3;}
.pomotional-students .pcont,
.geva-students .pcont{margin-bottom: 15px;}

.simulationprice-form{padding: 0 25px;}
.step-sec .simulationprice-form.otakim-form .labeltext{font-size: 18px; font-weight: 600; color: #5698d6; width: 100%;
padding: 10px 0;}

.step-sec .simulationprice-form.otakim-form .input-group{background: #f3faff; border-color: #84b5e2;}
.step-sec .simulationprice-form.otakim-form .input-group .form-control{font-size: 18px; font-weight: 600;}
.step-sec .simulationprice-form.otakim-form .field-col{margin-bottom: 15px;}

.invitation-details-form {border: 1px dashed #5892c1; padding: 15px 22px 20px 22px; position: relative; }
.otakim-form .remark .input-group{height: 74px;}

.invitation-details-form fieldset.order-details {border-top: 1px dashed #cccccc; margin: 10px 0 15px 0;
padding: 13px 0 15px 0; border-bottom: 1px dashed #cccccc; }
.invitation-details-form.otakim-form .remark{position: relative;}
.invitation-details-form.otakim-form .remark span.tooltip-info {position: absolute; left: 7px; z-index: 1; top: 7px; }

.tooltip-primary .tooltip-inner {
  background-color: #fbaf2e;
  width: 100%;
  max-width: 150px;
  /*height: 80px;*/
  padding: 1em 2em;
  line-height: 1;
  border-radius: 50%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 14px; margin-bottom: -1px;
}
.tooltip-primary.bs-tooltip-top .arrow:before {border-top-color: #fbaf2e; }
.tooltip-primary.bs-tooltip-right .arrow:before {border-right-color: #fbaf2e; }
.tooltip-primary.bs-tooltip-left .arrow:before {border-left-color: #fbaf2e; }
.tooltip-primary.bs-tooltip-bottom .arrow:before {border-bottom-color: #fbaf2e; }


.view-order-row {margin-right: -10px; margin-left: -10px; }
.view-order-row .order-block{padding-right: 10px; padding-left: 10px; margin-bottom: 15px;}
.order-block .order-block-inn{min-height: 100%; border: 1px dashed #cccccc; padding: 10px 12px 12px;
transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -ms-transition: all ease-in-out 0.3s;}
.order-block .order-block-inn:hover {box-shadow: 0 0 10px rgba(0, 0, 0, 0.22); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.22);
-ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.22);
border-color: #1f6cab; background: #f2f2f2; }

.order-block-inn h4.title {color: #1f6cab; font-weight: 600; border-bottom: 1px dashed #cccccc;
padding-bottom: 11px; margin-bottom: 13px; }

.dot-list li,
.order-block-inn h5.title {color: #262626; font-size: 16px; font-weight: 600; margin-bottom: 15px; position: relative; padding-right: 19px;}
.dot-list li:before,
.order-block-inn h5.title:before {content: ""; background: #fbae2c; position: absolute;
width: 7px; height: 7px; border-radius: 50%; right: 0; top: 4px; }

.order-block-inn ul li {margin-bottom: 13px; }
.custom-checkbox{ padding-left: inherit;}
.custom-checkbox .custom-control-label{cursor: pointer; padding-right: 1.7rem; font-size:16px !important}
.custom-checkbox .custom-control-label::before{background-image: url(../images/check_box.png); z-index: 1;}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after{content: none;}
.custom-checkbox .custom-control-input:checked~.custom-control-label::after{
background-image: url(../images/check.png); background-color: transparent; border: none;}
.custom-control-input:checked~.custom-control-label::before{ background-color: transparent !important; border: none !important; box-shadow: none !important;}
.custom-control-label::after,
.custom-control-label::before{background-repeat: no-repeat; background-size: 100%; 
width: 20px; height: 18px; background-color: transparent !important; border: none !important; left: inherit;
right: 0rem; top: 1px; /*transform: translateY(-50%); -webkit-transform: translateY(-50%);*/}
.custom-checkbox .custom-control-input:focus~.custom-control-label::before,
.custom-checkbox .custom-control-label:hover,
.custom-checkbox .custom-control-label:focus{border: none; outline: none; box-shadow: none;}
.custom-checkbox .custom-control{padding-left: 0; padding-right: 1.2rem;}
.order-block-inn figure{text-align: center;}

#general-booklets-display-section .custom-checkbox .custom-control-label{cursor: default !important; padding-right: 5px !important;}
#general-booklets-display-section .custom-checkbox .custom-control-label::before{background-image: none !important; z-index: 1;}
#general-booklets-display-section .order-block-inn figure{text-align: center;border: 1px solid #f2f2f2;}
#general-booklets-display-section .view-order-row .order-block {    padding: 0px 10px 0 10px;margin: 0; margin-bottom:20px} 
#general-booklets-display-section .order-block .order-block-inn{min-height: 100%;border: 1px dashed #5892c1; padding: 15px 22px 20px 22px;
transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -ms-transition: all ease-in-out 0.3s;}
#general-booklets-display-section .order-block-inn h4.title { color: #1f6cab; font-weight: 600;  border-bottom: 1px dashed #cccccc;  margin-bottom: 13px;  width: 90%; padding: 5px 0px = 0; margin-right: 5%;  margin-bottom: 25px;}
.form-control[disabled="disabled"]{cursor:not-allowed}
#simulationprice-form {  border: 1px dashed #5892c1;  padding: 15px 22px 20px 22px;   margin-top: 22px;}
/* Otakim Modal*/
.modal-backdrop.show {opacity: .72; }
.otakim-modal .modal-content {border-radius: 0; }
.otakim-modal .modal-body{padding: 30px 60px;}
.otakim-modal .modal-title {color: #1f6cab; font-size: 24px; letter-spacing: 0.2px; text-align: center; font-weight: 600;
line-height: 1; margin-bottom: 13px;}
.otakim-modal button.close {position: absolute; right: 17px; top: 7px; z-index: 2;}
.otakim-modal .infobox {background: #f2f2f2; border: 1px dashed #cccccc; border-radius: 0; padding: 20px 10px; text-align: right; 
margin-top: 22px; margin-bottom: 28px;}
.otakim-modal .infobox .custom-checkbox .custom-control-label{line-height: 1.4; font-weight: 500; 
  font-family: 'Assistant', sans-serif; color: #565656;}
.otakim-modal .modal-buttons .theme-btn {max-width: 198px; width: 100%; margin: 0 9px;}
.otakim-modal .modal-buttons .theme-btn .form-btn {color: #fff; font-size: 18px;
padding: 11px 22px 20px 25px; font-weight: 500; }


/*-------------------------------------------*\
  10. Step 4 Page
\*-------------------------------------------*/
.dashed-gray-border {border: 1px dashed #cccccc;}
.dashed-blue-border {border: 1px dashed #5892c1;}
.h3-title.bluebg-heading {background: #1f6cab; color: #fff; font-weight: 400; padding: 10px 10px; }
.step4-page .step-right-col .h3-title{top: 0;}
.step4-page .step-col .h3-title,
.step4-page .step-right-col .h3-title{margin-bottom: 13px;}

.invitees-col .invite-inn {padding:30px 15px 35px; background: #fffcf6; box-shadow: inset 0 0 0 9px #fff; }
.invitees-col .invite-inn p{font-size: 20px; letter-spacing: 0.2px; color: #333;}
.invitees-col .invite-inn h2{font-size: 50px; letter-spacing: 0.2px; color: #1f6cab; font-weight: 700; margin-top: 17px; line-height: 0.7;}
.invitees-buttons {margin: 20px 0 15px; }
.invitees-buttons .theme-btn{margin: 5px 9px; width: 100%; max-width: 260px;}
.invitees-buttons .theme-btn .form-btn{font-size: 18px; font-weight: 500;}
.progress-bar-block{background: #f3faff; padding: 10px 13px; direction: ltr;}
.otakim-progressbar .progress{border-radius: 0;}
.otakim-progressbar .progress-bar {background-color: #fbaf2e; width: 0; 
animation: progress 6.5s ease-in-out forwards, progress-bar-stripes 1s linear infinite; }
.otakim-progressbar .progress-bar-striped{background-size: 0.5rem 0.5rem}
.otakim-progressbar .progress-bar-text{direction: rtl;}
.otakim-progressbar .progress-bar-text p{color: #1f6cab; font-size: 18px; font-weight: 600;}

@keyframes progress {
  from { width: 0; }
  to { width: 100%; }
}
@keyframes show {
  from { opacity: 0; }
  to { opacity: 1; }
}

.sharing-row{margin-top: 28px; margin-bottom: 28px; margin-left: -8px; margin-right: -8px;}
.sharing-row .sharing-col{padding-left: 8px; padding-right: 8px;}
.sharing-col .sharing-inn{padding:11px 10px; display: block; font-size: 14px; font-weight: 500; transition: all ease-in-out 0.3s;}
.sharing-col .sharing-inn i{margin: 0 5px; font-size: 16px;}
.facebook-share .sharing-inn{background-color: #e0ebff; color: #4f7ac9; border-color: #7a9bd9;}
.email-share .sharing-inn{background-color: #ffefee; color: #e14135; border-color: #ea746b;}
.whatsapp-share .sharing-inn{background-color: #eaffea; color: #0e970e; border-color: #8bd08b;}
.whatsapp-share .sharing-inn i{font-size: 18px; font-weight: 600; }
.sharing-col .sharing-inn:hover{color: #fff;}
.facebook-share .sharing-inn:hover{background: #4f7ac9;}
.email-share .sharing-inn:hover{background: #e14135;}
.whatsapp-share .sharing-inn:hover{background: #0e970e;}

.referredcode-box {padding: 15px 35px 22px; margin-bottom: 30px;}
.referredcode-box h4.title {font-size: 20px; margin-bottom: 10px; }
.referredcode-form.otakim-form .input-group{background: #f3faff; border-color: #84b5e2;}
.referredcode-form.otakim-form .labeltext,
.referredcode-form.otakim-form .form-control{font-size: 20px; }
.referredcode-form .form-control.invalid{border: 1px dashed red;}
.referredcode-form .form-control.valid{border: 1px dashed green;}
.referredcode-form .referred-btn .theme-btn .form-btn{font-size: 18px; font-weight: 600; padding: 9px 7px 17px 10px; min-width: 195px; letter-spacing: -0.3px;}

.referredcode-box .dot-list{margin-bottom: 17px;}
.referredcode-box .dot-list li{color: #565656; font-size: 16px; font-weight: 400; margin-bottom: 7px; padding-right: 18px; line-height: 1.1;}
.group-invit-form .group-invit-btn .theme-btn .form-btn{min-width: 217px;
font-weight: 600; letter-spacing: -0.3px;}


/* Update Estimated number Popup */
.otakim-form .modal-buttons {margin-top: 28px; }
.otakim-form.modals-form{margin-top: 20px;}
.otakim-form.modals-form .row{margin-right: -12px; margin-left: -12px;}
.otakim-form.modals-form .field-col{padding-right: 12px; padding-left: 12px;}
.otakim-form .custom-select{background-image: url('../images/select-box-icon.png');
background-repeat: no-repeat !important; background-position: left .75rem center; background-size: 8px 13px}

.spinner { /*width: 100px;*/ }
.spinner input { /*text-align: right;*/ }
.input-group-btn-vertical { position: relative; white-space: nowrap; width: 1%; vertical-align: middle; display: table-cell; }
.input-group-btn-vertical > .btn { display: block; float: none; width: 100%; max-width: 100%; padding: 8px; margin-left: -1px; position: relative; border-radius: 0; }
.input-group-btn-vertical > .btn:first-child { border-top-right-radius: 4px; }
.input-group-btn-vertical > .btn:last-child { margin-top: -2px; border-bottom-right-radius: 4px; }
.input-group-btn-vertical i { position: absolute; top: 0; left: 4px; }

.otakim-form .nofparticipants-col .input-group-btn-vertical {width: initial; top: 12px; z-index: 11;}
.otakim-form .nofparticipants-col .input-group-btn-vertical > .btn{ padding:7px 5px;}
.otakim-form .nofparticipants-col .input-group-btn-vertical > .btn:focus{box-shadow: none; border:none outline;}
.otakim-form .nofparticipants-col .input-group-btn-vertical i{color: #fbaf2f; left: 9px; line-height: 0;}

.otakim-form .lightblue,
.lightblue{background: #f3faff; border-color: #84b5e2;}
.otakim-form .lightblue .labeltext,
.lightblue .labeltext{color: #5698d6; width: 100%; padding: 10px 0;}
.otakim-form.modals-form .input-group {height: 41px; }
.totalpay{margin-top: 15px;}
.totalpay .lightblue .labeltext{font-size: 18px; font-weight: 500;}
.otakim-form.modals-form span.valid-icon{padding-top: 11px;}
.otakim-form.modals-form .custom-control-input.invalid~.custom-control-label {color: red; }

.table-modal.otakim-modal .modal-body {padding: 23px 40px 30px; }
.table-modal .otakim-table {margin-top: 20px; }
.otakim-table tr:nth-child(even) {background-color: #f7fcff;} 
.otakim-table .table{color: #565656; text-align: right;}
.otakim-table .table .thead-dark th {background-color: #1f6cab; border-color: #1f6cab; font-size: 17px; font-weight: 600;}
.otakim-table .table td, .table th{border-top: none; border-top: 1px dashed #e5e5e5;}
.table-modal.otakim-modal .modal-buttons .theme-btn {max-width: 155px}

.student-payless-box{margin-top: 19px;}
#gevaorderparticipation-form h4.promo-title {margin-top: 0; font-size: 16px; color: #262626; margin-bottom: 3px; }
#gevaorderparticipation-form p.pcont {font-size: 16px; color: #666666; padding: 0 20px; }
.student-payless-box .simulations-box{margin-bottom: 7px;}




/*-------------------------------------------*\
  Media Quries / Responsive
\*-------------------------------------------*/

@media (min-width: 576px) {
  .col-l-7{padding-left: 7px;}
  .col-r-7{padding-right: 7px;}
}

@media (min-width: 768px) {
  body{padding-bottom: 36px;}
  .site-footer{position: absolute; right: 0; bottom: 0; left: 0;}
  .video-cont-col{padding-left: 80px;}
  .otakim-modal .modal-dialog {max-width: 610px;}
  .otakim-modal.participant_list .modal-dialog {max-width: 748px;}
  .otakim-modal .pcont {font-size: 18px; color: #565656; line-height: 1.35; margin-bottom: 10px; letter-spacing: 0.2px;
  padding: 0 30px; font-weight: 500; }

}

@media (min-width: 992px) {
    /* Header Tranparent Css */
    #desktopmenu #navbarNavDropdown {width: inherit; position: inherit; top: inherit; margin-top: 0;
    display: inherit !important; min-height: inherit; visibility: visible; background: transparent; }
    #desktopmenu #navbarNavDropdown .navbar-nav {padding: 0; }
    #desktopmenu .navbar-light .navbar-nav li.nav-item {border-left: 1px solid #1f6cab; padding: 0 14px; font-family: 'Assistant', sans-serif;}
    #desktopmenu .navbar-light .navbar-nav li.nav-item:last-child{border-left: none;}
    #desktopmenu .navbar-light .navbar-nav .nav-link {color:#1f6cab; font-size: 18px; font-weight: 400; letter-spacing: 0.2px; padding: .01rem 0 .11rem;}
    #desktopmenu .navbar-light .navbar-nav .nav-link:hover {color:#fbaf2e;}

    #header-transparent ul.user-action li:hover a,
    #header-transparent ul.user-action li a:hover{color: #fbaf2e;}
    /* Header Tranparent Submenu */
    #desktopmenu #navbarNavDropdown .dropdown-menu {background: rgba(40, 107, 169, 0.95);
    border-radius: 0; text-align: center; margin-top: 22px; padding-top: 6px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}
    #desktopmenu #navbarNavDropdown .dropdown-menu.show {height: 165px;}
    #desktopmenu #navbarNavDropdown .dropdown-menu .dropdown-item {padding-left: 0; padding-right: 0;
     margin-left: 10px; margin-right: 10px; padding-bottom: 8px; padding-top: 8px; font-size: 14px;
    color: rgba(255, 255, 255, 0.7); border-bottom: 1px solid rgba(255, 255, 255, 0.5); width: auto; }
    #desktopmenu #navbarNavDropdown .dropdown-menu .dropdown-item:last-child{border-bottom: none;}
    #desktopmenu #navbarNavDropdown .dropdown-menu .dropdown-item:hover{color: #fbaf2e; }

    #desktopmenu #navbarNavDropdown .dropdown-menu:before {content: ""; position: absolute;
    border-left: 15px solid transparent; border-right: 15px solid transparent; width: 0;
    border-bottom: 15px solid #356ea4; top: -14px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%);}

    .booklets-textbooks .container,
    .video-services-sec .container{padding-left: 60px; padding-right: 70px;}
    .booklets-inn p.pcont{padding: 0 20px; line-height: 1.6;}

    .step-right-col{-ms-flex: 0 0 23%; flex: 0 0 23%; max-width: 23%;}
    .step-left-col{-ms-flex: 0 0 23%; flex: 0 0 23%; max-width: 23%;}
    .step-content-col{-ms-flex: 0 0 54%; flex: 0 0 54%; max-width: 54%;}


}

@media (min-width: 1024px) and (max-width: 1199px) {

}


@media (min-width: 1200px) {
  .container {max-width: 1270px; }
  .step-sec .container {max-width: 1310px; }

}




@media (max-width: 1199px){
  .container {max-width: inherit; padding-left: 20px; padding-right: 20px; }
  .step-col-inn{padding: 0 8px;}
  .referredcode-box {padding: 15px 10px 22px !important; margin-bottom: 30px;
  }

}

@media (max-width: 1024px){
  .user-service > li,
  #desktopmenu .navbar-light .navbar-nav .nav-link{font-size: 17px;}
  .main-banner h1{font-size: 40px;}
  .main-banner h4{font-size: 20px; font-weight: 600;}
  .main-banner p{font-size: 18px;}

  .section-title h3 {font-size: 34px; letter-spacing: 0;}
  .video-services-sec .section-title {margin-bottom: 40px; }
  .video-cont-col {padding-left: 20px; }
  .video-cont-col h4{font-size: 22px;}

  .services-box p,
  .video-cont-col .pcont {font-size: 15px;}

  .services-box h4 {font-size: 23px;}
  .services-box h5 {font-size: 16px; margin-top: 10px;}
  .booklets-inn h3 {font-size: 26px;}
  .booklets-inn p.pcont {font-size: 16px; padding: 0 0px;}
  .booklets-inn .theme-btn a {font-size: 18px;}

  .header-style2 .lang-col .logo-white img {max-width: 155px; }
  .header-title h3{font-size: 21px;}
  .header-title h3 .stepno{font-weight: 600; width: 40px; height: 40px; line-height: 40px;}

  .simulationprice-form {padding: 0 5px; }
  .step-sec .h3-title {font-size: 18px;}
  .order-block-inn .custom-checkbox .custom-control-label,
  .order-block-inn h5.title {font-size: 15px;}
  .step-col-inn h4.title, .simulations-box h4.title {font-size: 17px;}

  .group-invit-form .group-invit-btn .theme-btn .form-btn,
  .referredcode-form .referred-btn .theme-btn .form-btn{font-size: 16px; padding: 9px 7px 17px 14px; min-width: inherit; line-height: 1;}
  .invitees-col .invite-inn {padding: 26px 15px 30px;}
  .invitees-col .invite-inn p {font-size: 18px;}
  .invitees-col .invite-inn h2 {font-size: 42px; margin-top: 12px;}
  .invitees-buttons .theme-btn{max-width: 240px; margin: 5px 5px;}
  .invitees-buttons .theme-btn .form-btn{padding: 10px 9px 20px 9px; font-size: 17px;}
  .otakim-progressbar .progress-bar-text p {font-size: 15px;}
  .sharing-col .sharing-inn{font-size: 13px; letter-spacing: -0.6px; font-weight: 600;}
  .sharing-col .sharing-inn i {font-size: 14px;}
  .whatsapp-share .sharing-inn i {font-size: 15px; }
}


@media (max-width: 991px){
    #header-transparent{padding: 15px 0;}
    #header-transparent .logo {margin-left: 0; margin-right: auto; }
    #header-transparent .logo img {top: -6px; }

    #header-transparent .hamburger span {background: #5187b9;}
    #header-transparent .hamburger:hover span {background: #fbaf2e; }

    .main-banner{padding: 35px 0 75px;}
    .video-services-sec {padding: 10px 0 0px;}

    .section-title h3 {font-size: 30px; margin-bottom: 10px;} 

    .main-banner h1{font-size: 36px;}
    .main-banner h4{font-size: 19px; font-weight: 500;}
    .main-banner p{font-size: 17px;}
    .main-banner .banner-btn a {font-size: 20px; padding: 12px 30px 27px 35px; }

    .booklets-textbooks{padding: 100px 0 40px;}

    .step-sec .h3-title{text-align: center;}
    .step-left-col .step-col-inn,
    .step-right-col .step-col-inn {max-width: 576px; margin: 0 auto; }
    .step-content-col{margin-top: 30px; margin-bottom: 30px;}

    .group-invit-form .group-invit-btn .theme-btn .form-btn,
    .referredcode-form .referred-btn .theme-btn .form-btn {font-size: 17px; padding: 12px 21px 21px 28px; min-width: inherit; line-height: 1; }


}



@media (max-width: 767px){

	.menu-col .navbar-light .navbar-brand{display: none;}
  #header-transparent .navbar-brand{display: inline-block;}
	/*.header-left-col {-ms-flex: 0 0 15%; flex: 0 0 15%; max-width: 15%; }
	.header-right-col {-ms-flex: 0 0 85%; flex: 0 0 85%; max-width: 85%; }
  #header-transparent .header-left-col {-ms-flex: 0 0 55%; flex: 0 0 55%; max-width: 55%; }
  #header-transparent .header-right-col {-ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; }*/
  
  .main-banner{clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 90%);
    -webkit-clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 90%); padding: 35px 0 50px;}
  .main-banner h4{margin: 10px 0 15px;}
  .main-banner p{margin-top: 5px;}
  .main-banner p br{display: none;}
  .video-services-sec{text-align: center; padding: 20px 0 0px;}
  .video-services-sec .section-title {margin-bottom: 25px; }
  .video-cont-col {padding-left: 15px; margin-bottom: 30px; }
  .services-row {margin-top: 40px; }
  .services-box-inn{max-width: 540px; margin: 0 auto 20px;}
  .services-box p, .video-cont-col .pcont {font-size: 16px; }

  .section-title h3 {font-size: 27px; margin-bottom: 5px; }
  .section-title p{font-size: 18px;}
  
  .booklets-textbooks{clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 100%); padding: 20px 0 40px;}
  .booklets-textbooks [class*="col-"] {margin-top: 25px;}
  .booklets-inn{max-width: 600px; margin: 0 auto;}

  .header-style2 .lang-col {text-align: left; order: 1; -webkit-order: 1; }
  .header-style2 .head-title-col {order: 2; -webkit-order: 2; text-align: center;
  border-top: 1px dashed #3e82b2; margin-top: 19px; padding-top: 20px; padding-bottom: 10px;} 
  .step3-page .header-style2 .head-title-col {margin-top: 50px;}
  .step3-page .header-style2 .lang-col .logo-white img{right: 0; margin: 0 auto;}
  .step3-page .header-title h3{display: block; text-align: center;}
  .step3-page .header-title .stepbox {min-width: inherit; }
  .step3-page .header-title .stepbox, 
  .step3-page .header-title h3 .text{display: inline-block;}
  .header-style2 ul.user-service{top: 5px;}
  .header-style2 .lang-col .logo-white img {max-width: 155px; position: absolute; left: 0; z-index: 1; }
  .header-style2 .lang-col .lang-block{display: -ms-flexbox !important; display: flex !important; position: relative;
  justify-content: space-between; -ms-justify-content: space-between;}
  .header-title h3 .text{text-align: right;}

  .step-sec {padding: 30px 0; }

  .otakim-modal .modal-body {padding: 26px 25px; }
  .otakim-modal .modal-buttons .theme-btn {max-width: 190px;}
  .order-block-inn .custom-checkbox .custom-control-label, .order-block-inn h5.title {font-size: 16px; }

  .table-modal.otakim-modal .modal-body {padding: 25px 20px; }
  .table-modal .modal-dialog{max-width: inherit; padding: 0 15px;}

  .innerbanner{padding: 55px 0;}
  .innerbanner h1{font-size: 35px;}


}


@media (max-width: 575px){
  .wow{animation-name: none !important; visibility: visible !important; }

  .site-header{padding: 70px 0 6px 0; position: relative;}
  .user-service > li, #desktopmenu .navbar-light .navbar-nav .nav-link {font-size: 16px; }
  .menu-col #navbarNavDropdown{min-height: 200px;  margin-top: 10px}
  #header-transparent .menu-col #navbarNavDropdown{margin-top: 0px}
  .header-right-col{position: static;}
  .user-service {margin-left: 0; }
  .logo img {max-width: 150px;}
  .header-title h3 {font-size: 18px; }

  .main-banner h1{font-size: 33px;}
  .main-banner h4{font-size: 18px;}
  .main-banner p{font-size: 16px;}
  .main-banner .banner-btn a {font-size: 18px; padding: 15px 25px 27px 30px; }
  .video-cont-col h4 {font-size: 21px; }
  .booklets-inn .theme-btn a{padding: 14px 20px 29px 30px; font-size: 18px;}

  .form-sec {padding: 30px 0 30px;}
  .signinform{padding: 60px 25px 30px 25px;}
  .form-sec-title{font-size: 26px; margin-bottom: 50px;}
  .otakim-form .formtitle{font-size: 22px;}
  .pcont.createcopy {line-height: 1.1; }
  .cst-radio [class*="col-"]{-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
  .form-header .pcont{padding: 0 0; font-size: 15px;}
  .otakim-form .input-group{height: 40px;}
  .otakim-form .form-group {margin-bottom: 0; }
  .signinform .field-col{margin-bottom: 4px;}
  .group-order-box{margin: 20px 0 20px 0; padding: 15px 0 20px 0;}
  .otakim-form .btn-col{margin-top: 30px;}
  .otakim-form .theme-btn .form-btn{font-size: 17px}

  .otakim-modal .modal-body {padding: 26px 20px; }
  /*.otakim-modal .modal-buttons .theme-btn {max-width: 190px;}*/
  .otakim-modal .modal-buttons .theme-btn{margin: 5px 5px;}
  .otakim-modal .modal-buttons .theme-btn .form-btn{font-size: 16px;}

  .invitees-row .invitees-col,
  .view-order-row .order-block{-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
  .invitees-col.col-l-7{padding-left: 7px;}
  .invitees-col.col-r-7{padding-right: 7px;}
  .invitees-buttons .theme-btn .form-btn {padding: 10px 15px 18px 15px; font-size: 16px; }
  .invitees-buttons .theme-btn{max-width: 42%;}
  .otakim-progressbar .progress-bar-text {text-align: center; margin-top: 7px; }
  .sharing-row {margin-top: 18px; margin-bottom: 18px;}
  .sharing-row .sharing-col{margin: 5px 0;}
  .sharing-col .sharing-inn {font-size: 14px;}
  .group-invit-form .group-invit-btn .theme-btn .form-btn, .referredcode-form .referred-btn .theme-btn .form-btn {font-size: 15px;}
  
  .invitees-col .invite-inn {padding: 22px 15px 25px; min-height: 100%;}
  .invitees-col .invite-inn p {font-size: 16px; }
  .invitees-col .invite-inn h2 {font-size: 36px; margin-top: 8px; }
  .invitees-buttons .theme-btn {max-width: 200px; }

  .otakim-form.modals-form {margin-top: 0; }
  .otakim-form.modals-form .field-col{margin: 5px 0;}
  .otakim-modal.modals-form .infobox{margin-top: 10px; margin-bottom: 10px;}
  .otakim-form.modals-form .modal-buttons {margin-top: 20px; }
  .invitees-buttons .theme-btn {max-width: 240px;}

  .otakim-table .table{width: 700px;}

}


.folder-row-fullrow{
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100%;

}
@media (max-width: 380px){

  .main-banner {clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 95%);
    -webkit-clip-path: polygon(0% 0%, 100% 0px, 100% 100%, 0 95%);
    padding: 35px 0 40px; }
  .main-banner h1 {font-size: 30px; }
  .section-title h3 {font-size: 24px;}
  .header-title h3 .stepno{width: 34px; height: 34px; line-height: 34px;}

  .video-services-sec .section-title {margin-bottom: 18px; }
  .video-cont-col h4 {font-size: 18px; }
  .booklets-textbooks{padding: 10px 0 30px;}
  .booklets-inn{padding: 20px 20px 25px;}
  .booklets-inn h3 {font-size: 24px; padding-bottom: 17px}
  .booklets-inn .theme-btn a {padding: 14px 20px 29px 26px; font-size: 16px; }

  .form-sec-title {font-size: 23px; margin-bottom: 40px; }
  .signinform {padding: 60px 20px 30px 20px; }

  .header-style2 .lang-col .logo-white img {max-width: 140px;}
  .header-style2 ul.user-service{padding: 7px 0px;}
  .header-style2 .user-service > li{padding: 0px 7px 0px 4px;}
  .header-style2 .head-title-col{margin-top: 15px; padding-top: 16px; padding-bottom: 6px;}
  .header-title h3 {font-size: 18px; }

  .view-order-row .order-block{-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
  .order-block-inn ul li {margin-bottom: 8px; }




}